修改样式

src/pages/home/explain.vue

@@ -55,6 +55,7 @@ export default {
     color: #222222;
     line-height: 25px;
     margin-bottom: 16px;
+    margin-top: 16px;
   }
   .doce{
     p{

src/pages/practice/components/practice3.vue

@@ -30,7 +30,7 @@
         </div>
       </div>
     </div>
-    <preview v-show="isEdit" @confirm="confirm"></preview>
+    <preview :navItemIndex="navItemIndex" v-show="isEdit" @confirm="confirm"></preview>
   </div>
 </template>
 <script>

src/pages/practice/components/preview.vue

@@ -12,7 +12,7 @@
           v-model="textarea">
         </el-input>
       </div>
-      <div class="upload-box">
+      <div class="upload-box" v-if="showActiveIndex == 0 || showActiveIndex == 4 || showActiveIndex == 5 || showActiveIndex == 6 ">
         <div class="name">上传图片</div>
         <el-upload
           class="upload-demo"
@@ -84,6 +84,9 @@
 </template>
 <script>
 export default {
+  props: {
+    navItemIndex: {}
+  },
   data() {
     return {
       textarea: '',
@@ -116,6 +119,15 @@ export default {
   computed: {
     getStyle() {
       return `background:url(${this.url});background-size: cover;`
+    },
+    dataWatch() {
+      return this.navItemIndex
+    }
+  },
+  watch: {
+    dataWatch(newV) {
+      this.showActiveIndex = this.navItemIndex
+      this.$forceUpdate()
     }
   }
 }

src/pages/practice/index.vue

 <template>
   <div>
     <div class="head-steps">
-      <div class="title">产品分析</div>
+      <div class="title">
+        <div class="name" v-if="dataParam.stepIndex == 0">产品分析</div>
+        <div class="name" v-if="dataParam.stepIndex == 1">用户分析</div>
+        <div class="name" v-if="dataParam.stepIndex == 2">用户触达</div>
+        <div class="tab-btns" @click="$router.push('/index')">切换案例</div>
+      </div>
       <ul class="steps-box">
         <li @click="stepChange(0)" :class="dataParam.stepIndex == 0 && 'active'">1. 产品分析</li>
         <li @click="stepChange(1)" :class="dataParam.stepIndex == 1 && 'active'">2. 用户分析</li>
@@ -77,8 +82,23 @@ export default {
   padding: 0 16px;
   box-sizing: border-box;
   .title{
-    line-height: 54px;
+    // line-height: 54px;
+    height: 54px;
+    display: flex;
+    align-items: center;
     border-bottom: 1px solid #eee;
+    .tab-btns{
+      width: 104px;
+      height: 32px;
+      background: linear-gradient(315deg, rgba(225, 47, 116, 0.83) 0%, #C01540 100%);
+      border-radius: 4px;
+      margin-left: auto;
+      font-size: 14px;
+      color: #F8F8F8;
+      cursor: pointer;
+      text-align: center;
+      line-height: 32px;
+    }
   }
   .steps-box{
     display: flex;