返回原声部流程

src/views/teamBuild/index.vue

@@ -5,9 +5,42 @@
       <el-page-header @back="goBack"
                       :content="pageName"> </el-page-header>
     </h2>
-    <h2>
-      <div class="squrt"></div><h3 style="font-size: 22px;">{{getIndexName(activeIndex)}}</h3>
-    </h2>
+    <div class="m-core">
+      <div class="stepbox">
+        <!--  @click="activeIndex = 0" -->
+        <span class="stepspan stepspan1">
+          <div class="step1 sptep"
+               :class="activeIndex >= 0 ? 'activestep' : ''">
+            基本信息
+          </div>
+          <img :src="activeIndex  >=  0 ? stepImgs.nol : stepImgs.active"
+               alt=""
+               class="arrow" />
+        </span>
+        <!-- @click="activeIndex = 1" -->
+        <span class="stepspan stepspan2"
+              v-if="showFlag?activeIndex>= 1:true">
+          <!--    -->
+          <div class="step2 sptep"
+               :class="activeIndex  >= 1 ? 'activestep' : ''">
+            声部设置
+          </div>
+          <img :src="activeIndex >=  1 ? stepImgs.nol : stepImgs.active"
+               alt=""
+               class="arrow" />
+        </span>
+        <!--  @click="activeIndex = 2" -->
+        <span class="stepspan stepspan3"
+              v-if="showFlag?activeIndex  >=  2:true">
+          <div class="step2 sptep"
+               :class="activeIndex  >=  2 ? 'activestep' : ''">
+            创建缴费
+          </div>
+          <img :src="activeIndex >= 2 ? stepImgs.nol : stepImgs.active"
+               alt=""
+               class="arrow" />
+        </span>
+      </div>
 
       <!-- 下面显示的内容 -->
       <div class="stepcontent">
@@ -27,10 +60,6 @@
                        :getTeamList="getTeamList"
                        :baseInfo="baseInfo" />
         </div>
-        <div v-if="activeIndex == 3">
-          <mergeMusic @chiosetab="chiosetab"
-                       :getTeamList="getTeamList" />
-        </div>
       </div>
     </div>
   </div>
@@ -39,9 +68,8 @@
 import teamBaseInfo from "@/views/teamBuild/components/teamBaseInfo";
 import teamSoundMoney from "@/views/teamBuild/components/teamSoundSet";
 import teamPayInfo from "@/views/teamBuild/components/teamPayInfo";
-import mergeMusic from "@/views/teamBuild/components/merge-music";
 export default {
-  components: { teamBaseInfo, teamSoundMoney, teamPayInfo, mergeMusic },
+  components: { teamBaseInfo, teamSoundMoney, teamPayInfo },
   name: "teamBuild",
   data () {
     return {
@@ -57,7 +85,7 @@ export default {
   },
   created () {
     // 判断 是新建乐团还是修改乐团
-    this.activeIndex = 3;
+    this.activeIndex = 0;
     this.init();
   },
   activated () {
@@ -94,20 +122,11 @@ export default {
       this.baseInfo = baseInfo
       this.pageName = baseInfo.musicGroup?.name
     },
-    getIndexName(index) {
-      const data = {
-        0: '基本信息',
-        1: '声部设置',
-        2: '创建缴费',
-        3: '合并乐团',
-      }
-      return data[index]
-    }
   },
   computed: {
     showFlag () {
       return (this.teamStatus == 'newTeam' || this.teamStatus == 'teamList')
-    },
+    }
   }
 };
 </script>