修改样式与文案

src/router/routes-student.ts

@@ -81,7 +81,7 @@ export default [
         name: 'memberCenter',
         component: () => import('@/student/member-center/index'),
         meta: {
-          title: '会员中心'
+          title: '乐团Ai学练工具'
         }
       },
       {

src/student/member-center/index.module.less

@@ -1,351 +1,392 @@
-.member-center {
-  background-color: #ffe5cc;
-  min-height: 100vh;
-  position: relative;
-
-  :global {
-    .van-nav-bar {
-      background-color: transparent;
-    }
-  }
-
-  .member_container {
-    padding: 10px 14px 0;
-    .title {
-      display: flex;
-      align-items: center;
-      font-size: 16px;
-      line-height: 28px;
-      font-weight: 500;
-      color: #333333;
-      &::before {
-        content: ' ';
-        width: 4px;
-        height: 17px;
-        background: var(--van-primary-color);
-        display: inline-block;
-        margin-right: 7px;
-        border-radius: 8px;
-      }
-    }
-  }
-  .beforMemberContainer {
-    padding-bottom: 12px !important;
-    .memberImgs {
-      margin-top: 8px;
-    }
-  }
-  .level {
-    width: 18px;
-    height: 16px;
-  }
-  .userMember {
-    background: url('./images/member_bg.png') no-repeat center #534754;
-    background-size: cover;
-    width: auto;
-    border-radius: 19px;
-    padding: 20px 12px 30px;
-
-    &.purchaseMember {
-      background: url('./images/member_bg1.png') no-repeat center #ffce9a;
-      background-size: cover;
-      .userInfo {
-        color: #7a5420;
-      }
-
-      .beforeQuestion {
-        display: flex;
-        align-items: center;
-        font-size: 14px;
-        color: #7a5420;
-        line-height: 20px;
-        .iconQeustion {
-          font-size: 18px;
-          margin-right: 4px;
-        }
-        span {
-          color: #eb8000;
-        }
-      }
-    }
-    .userImgSection {
-      padding: 2px;
-      border: 1px solid #feecd2;
-      background-color: transparent;
-      margin-right: 12px;
-      border-radius: 50%;
-    }
-    .userImg {
-      width: 46px;
-      height: 46px;
-      border-radius: 50%;
-      vertical-align: middle;
-      overflow: hidden;
-    }
-    .userInfo {
-      display: flex;
-      align-items: center;
-      color: #fff;
-      padding-bottom: 5px;
-      .name {
-        font-size: 18px;
-        padding-right: 5px;
-        max-width: 100px;
-        overflow: hidden;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-      }
-      .phone {
-        font-size: 14px;
-      }
-    }
-    .timeRemaining {
-      margin-top: 0;
-      font-size: 14px;
-      color: #c0c0c0;
-      .remaining {
-        color: #f7b500;
-        padding: 0 5px;
-      }
-    }
-    .member_time {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-    }
-  }
-
-  .memberImgs {
-    img {
-      margin-bottom: 6px;
-      width: 100%;
-    }
-  }
-
-  .intro {
-    background: url('./images/tip_bg.png') no-repeat center;
-    background-size: contain;
-    height: 142px;
-    font-size: 14px;
-    color: #bb6e3a;
-    p {
-      padding: 45px 25px 0;
-      text-align: justify;
-      line-height: 22px;
-    }
-  }
-
-  .memberContainer {
-    // height: calc(100vh - 196px);
-    // overflow-y: auto;
-    background-color: #fff;
-    border-radius: 18px 18px 0px 0px;
-    position: relative;
-    margin-top: -15px;
-    padding: 0 14px 75px;
-    z-index: 99;
-  }
-  .memberItem {
-    padding-top: 20px;
-    .title {
-      font-size: 16px;
-      color: #333333;
-      font-weight: 500;
-      span {
-        color: #f7b500;
-      }
-    }
-  }
-
-  .member_function {
-    display: flex;
-    justify-content: space-between;
-    flex-wrap: wrap;
-    .function_item__content {
-      height: 100%;
-    }
-    .function_item {
-      width: 80px;
-      padding: 12px 0;
-      margin-top: 8px;
-      border-radius: 8px;
-      overflow: hidden;
-      background-color: #faefe3;
-      text-align: center;
-    }
-    .function_text {
-      font-size: 12px;
-      color: #814014;
-      line-height: 16px;
-    }
-  }
-  .system-list::-webkit-scrollbar {
-    display: none; /* Chrome Safari */
-  }
-  .system-list {
-    width: 100%;
-    overflow-x: auto;
-    overflow-y: hidden;
-    display: flex;
-    position: relative;
-    user-select: none;
-    box-sizing: content-box;
-    padding-top: 16px;
-    padding-bottom: 10px;
-  }
-  .system-item {
-    display: flex;
-    flex-direction: column;
-    // align-items: center;
-    // justify-content: center;
-    flex: 1 0 auto;
-    // width: 96px;
-    min-height: 116px;
-    box-sizing: border-box;
-    background: #ffffff;
-    border-radius: 12px;
-    // border: 1px solid #e5e5e5;
-    .title {
-      font-weight: 500;
-      font-size: 14px;
-      color: #814014 !important;
-      line-height: 20px;
-      span {
-        color: #814014 !important;
-      }
-      padding: 11px 0 9px;
-      margin: 0 11px;
-      // border-bottom: 1px solid #b1652e;
-      &::after {
-        border-color: rgba(177, 101, 46, 0.27);
-      }
-    }
-
-    .priceGroup {
-      display: flex;
-      align-items: baseline;
-      padding: 25px 12px 9px;
-    }
-    .price {
-      font-size: 28px;
-      font-weight: 500;
-      color: #b1652e;
-      span {
-        font-size: 16px;
-      }
-    }
-    .originalPrice {
-      margin-left: 8px;
-      font-size: 18px;
-      color: #c59575 !important;
-      line-height: 16px;
-      font-weight: 300;
-    }
-
-    &.active {
-      // background: linear-gradient(215deg, #ffe7c4 0%, rgba(250, 211, 156, 0.21) 100%);
-      background: url('./images/vip_bg.png') no-repeat center center;
-      background-size: cover;
-      // border: 1px solid #b1652e;
-      position: relative;
-      .title {
-        color: #814014;
-      }
-      .price {
-        color: #b1652e;
-      }
-      .originalPrice {
-        color: #937059;
-      }
-      &::before {
-        content: '\e728';
-        font: 14px/1 'vant-icon';
-        color: #fff;
-        background-color: #b1652e;
-        width: 27px;
-        height: 18px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        position: absolute;
-        top: 0;
-        right: -1px;
-        border-radius: 0 12px 0 12px;
-      }
-    }
-  }
-
-  .btnGroup {
-    position: fixed;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    z-index: 100;
-    background-color: #fff;
-    display: flex;
-    align-items: center;
-    padding: 12px 16px;
-    justify-content: space-between;
-    border-top: 1px solid #f0f0f0;
-    .btn {
-      line-height: 38px;
-      height: 38px;
-      color: #7a3104 !important;
-      padding: 0 17px;
-    }
-
-    .priceSection {
-      display: flex;
-      align-items: center;
-      font-size: 16px;
-      color: #1a1a1a;
-      .price {
-        font-size: 18px;
-        font-weight: bold;
-        color: #ff3535;
-
-        .priceUnit {
-          font-size: 14px;
-        }
-      }
-    }
-  }
-}
-
-.memberDiscount {
-  margin-top: 16px;
-  position: relative;
-  background: url('./images/discount_bg.png') no-repeat center;
-  background-size: contain;
-  display: flex;
-  align-items: center;
-  height: 44px;
-  font-size: 16px;
-  color: #ff7100;
-  line-height: 18px;
-
-  .discountAvatar {
-    margin-left: 15px;
-    width: 36px;
-    height: 36px;
-    border-radius: 50%;
-    overflow: hidden;
-    border: 1px solid #ffaf59;
-  }
-
-  .discountName {
-    padding-left: 30px;
-    max-width: 200px;
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-  }
-
-  .discountGift {
-    position: absolute;
-    right: 26px;
-    top: 7px;
-    width: 29px;
-    height: 29px;
-  }
-}
+.member-center {
+  background-color: #ffe5cc;
+  min-height: 100vh;
+  position: relative;
+
+  :global {
+    .van-nav-bar {
+      background-color: transparent;
+    }
+  }
+
+  .member_container {
+    padding: 10px 14px 0;
+
+    .title {
+      display: flex;
+      align-items: center;
+      font-size: 16px;
+      line-height: 28px;
+      font-weight: 500;
+      color: #333333;
+
+      &::before {
+        content: ' ';
+        width: 4px;
+        height: 17px;
+        background: var(--van-primary-color);
+        display: inline-block;
+        margin-right: 7px;
+        border-radius: 8px;
+      }
+    }
+  }
+
+  .beforMemberContainer {
+    padding-bottom: 12px !important;
+
+    .memberImgs {
+      margin-top: 8px;
+    }
+  }
+
+  .level {
+    width: 18px;
+    height: 16px;
+  }
+
+  .userMember {
+    background: url('./images/member_bg.png') no-repeat center #534754;
+    background-size: cover;
+    width: auto;
+    border-radius: 19px;
+    padding: 20px 12px 30px;
+
+    &.purchaseMember {
+      background: url('./images/member_bg1.png') no-repeat center #ffce9a;
+      background-size: cover;
+
+      .userInfo {
+        color: #7a5420;
+      }
+
+      .beforeQuestion {
+        display: flex;
+        align-items: center;
+        font-size: 14px;
+        color: #7a5420;
+        line-height: 20px;
+
+        .iconQeustion {
+          font-size: 18px;
+          margin-right: 4px;
+        }
+
+        span {
+          color: #eb8000;
+        }
+      }
+    }
+
+    .userImgSection {
+      padding: 2px;
+      border: 1px solid #feecd2;
+      background-color: transparent;
+      margin-right: 12px;
+      border-radius: 50%;
+    }
+
+    .userImg {
+      width: 46px;
+      height: 46px;
+      border-radius: 50%;
+      vertical-align: middle;
+      overflow: hidden;
+    }
+
+    .userInfo {
+      display: flex;
+      align-items: center;
+      color: #fff;
+      padding-bottom: 5px;
+
+      .name {
+        font-size: 18px;
+        padding-right: 5px;
+        max-width: 100px;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .phone {
+        font-size: 14px;
+      }
+    }
+
+    .timeRemaining {
+      margin-top: 0;
+      font-size: 14px;
+      color: #c0c0c0;
+
+      .remaining {
+        color: #f7b500;
+        padding: 0 5px;
+      }
+    }
+
+    .member_time {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+    }
+  }
+
+  .memberImgs {
+    img {
+      margin-bottom: 6px;
+      width: 100%;
+    }
+  }
+
+  .intro {
+    background: url('./images/tip_bg.png') no-repeat center;
+    background-size: contain;
+    height: 142px;
+    font-size: 14px;
+    color: #bb6e3a;
+
+    p {
+      padding: 45px 25px 0;
+      text-align: justify;
+      line-height: 22px;
+    }
+  }
+
+  .memberContainer {
+    // height: calc(100vh - 196px);
+    // overflow-y: auto;
+    background-color: #fff;
+    border-radius: 18px 18px 0px 0px;
+    position: relative;
+    margin-top: -15px;
+    padding: 0 14px 75px;
+    z-index: 99;
+  }
+
+  .memberItem {
+
+    // padding-top: 20px;
+    .title {
+      font-size: 16px;
+      color: #333333;
+      font-weight: 500;
+
+      span {
+        color: #f7b500;
+      }
+    }
+  }
+
+  .member_function {
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+
+    .function_item__content {
+      height: 100%;
+    }
+
+    .function_item {
+      width: 80px;
+      padding: 12px 0;
+      margin-top: 8px;
+      border-radius: 8px;
+      overflow: hidden;
+      background-color: #faefe3;
+      text-align: center;
+    }
+
+    .function_text {
+      font-size: 12px;
+      color: #814014;
+      line-height: 16px;
+    }
+  }
+
+  .system-list::-webkit-scrollbar {
+    display: none;
+    /* Chrome Safari */
+  }
+
+  .system-list {
+    width: 100%;
+    overflow-x: auto;
+    overflow-y: hidden;
+    display: flex;
+    position: relative;
+    user-select: none;
+    box-sizing: content-box;
+    padding-top: 16px;
+    padding-bottom: 10px;
+  }
+
+  .system-item {
+    display: flex;
+    flex-direction: column;
+    // align-items: center;
+    // justify-content: center;
+    flex: 1 0 auto;
+    // width: 96px;
+    min-height: 116px;
+    box-sizing: border-box;
+    background: #ffffff;
+    border-radius: 12px;
+
+    // border: 1px solid #e5e5e5;
+    .title {
+      font-weight: 500;
+      font-size: 14px;
+      color: #814014 !important;
+      line-height: 20px;
+
+      span {
+        color: #814014 !important;
+      }
+
+      padding: 11px 0 9px;
+      margin: 0 11px;
+
+      // border-bottom: 1px solid #b1652e;
+      &::after {
+        border-color: rgba(177, 101, 46, 0.27);
+      }
+    }
+
+    .priceGroup {
+      display: flex;
+      align-items: baseline;
+      padding: 25px 12px 9px;
+    }
+
+    .price {
+      font-size: 28px;
+      font-weight: 500;
+      color: #b1652e;
+
+      span {
+        font-size: 16px;
+      }
+    }
+
+    .originalPrice {
+      margin-left: 8px;
+      font-size: 18px;
+      color: #c59575 !important;
+      line-height: 16px;
+      font-weight: 300;
+    }
+
+    &.active {
+      // background: linear-gradient(215deg, #ffe7c4 0%, rgba(250, 211, 156, 0.21) 100%);
+      background: url('./images/vip_bg.png') no-repeat center center;
+      background-size: cover;
+      // border: 1px solid #b1652e;
+      position: relative;
+
+      .title {
+        color: #814014;
+      }
+
+      .price {
+        color: #b1652e;
+      }
+
+      .originalPrice {
+        color: #937059;
+      }
+
+      &::before {
+        content: '\e728';
+        font: 14px/1 'vant-icon';
+        color: #fff;
+        background-color: #b1652e;
+        width: 27px;
+        height: 18px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        position: absolute;
+        top: 0;
+        right: -1px;
+        border-radius: 0 12px 0 12px;
+      }
+    }
+  }
+
+  .btnGroup {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    z-index: 100;
+    background-color: #fff;
+    display: flex;
+    align-items: center;
+    padding: 12px 16px;
+    justify-content: space-between;
+    border-top: 1px solid #f0f0f0;
+
+    .btn {
+      line-height: 38px;
+      height: 38px;
+      color: #7a3104 !important;
+      padding: 0 17px;
+    }
+
+    .priceSection {
+      display: flex;
+      align-items: center;
+      font-size: 16px;
+      color: #1a1a1a;
+
+      .price {
+        font-size: 18px;
+        font-weight: bold;
+        color: #ff3535;
+
+        .priceUnit {
+          font-size: 14px;
+        }
+      }
+    }
+  }
+}
+
+.memberDiscount {
+  margin-top: 16px;
+  position: relative;
+  background: url('./images/discount_bg.png') no-repeat center;
+  background-size: contain;
+  display: flex;
+  align-items: center;
+  height: 44px;
+  font-size: 16px;
+  color: #ff7100;
+  line-height: 18px;
+
+  .discountAvatar {
+    margin-left: 15px;
+    width: 36px;
+    height: 36px;
+    border-radius: 50%;
+    overflow: hidden;
+    border: 1px solid #ffaf59;
+  }
+
+  .discountName {
+    padding-left: 30px;
+    max-width: 200px;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  .discountGift {
+    position: absolute;
+    right: 26px;
+    top: 7px;
+    width: 29px;
+    height: 29px;
+  }
+}

src/student/member-center/index.tsx

@@ -237,7 +237,7 @@ export default defineComponent({
                     <>
                       {this.userInfo.isVip ? (
                         <div>
-                          会员权益有效期剩余
+                          乐团Ai学练工具有效期剩余
                           <span class={styles.remaining}>{this.userInfo.membershipDays}</span>天
                         </div>
                       ) : (
@@ -251,7 +251,7 @@ export default defineComponent({
                         class={styles.iconQeustion}
                         onClick={() => (this.memberStatus = true)}
                       />
-                      您有<span>待激活</span>团练宝
+                      您有<span>待激活</span>乐团Ai学练工具
                     </div>
                   )}
                 </div>
@@ -267,15 +267,15 @@ export default defineComponent({
           ]}
         >
           <div class={styles.memberItem}>
-            <div class={styles.title}>
+            {/* <div class={styles.title}>
               会员<span>VIP</span>
-            </div>
+            </div> */}
 
             {!this.users.purchaseMemberRecord ? (
               <div class={styles['system-list']}>
                 <div class={[styles['system-item'], styles.active]}>
                   <p class={[styles.title, 'van-hairline--bottom']}>
-                    半年会员
+                    乐团Ai学练工具
                     <span>（6个月）</span>
                   </p>
                   <div class={styles.priceGroup}>
@@ -296,7 +296,7 @@ export default defineComponent({
           <div class={styles.memberImgs}>
             <img src={member1} />
             <img src={member2} />
-            <img src={member3} />
+            {/* <img src={member3} /> */}
           </div>
 
           {/* <div class={[styles.intro]}>

src/student/music-group/member-bao/index.tsx

@@ -1,7 +1,7 @@
 import { Image } from 'vant'
 import { defineComponent } from 'vue'
 import bg1 from '../pre-apply/images/member_bao-1.png'
-import bg2 from '../pre-apply/images/member_bao-2.png'
+// import bg2 from '../pre-apply/images/member_bao-2.png'
 import bg3 from '../pre-apply/images/member_bao-3.png'
 
 export default defineComponent({
@@ -10,7 +10,7 @@ export default defineComponent({
     return () => (
       <div style={{ lineHeight: '0' }}>
         <Image src={bg1} />
-        <Image src={bg2} />
+        {/* <Image src={bg2} /> */}
         <Image src={bg3} />
       </div>
     )

src/student/music-group/pre-apply/component/apply.tsx

@@ -270,6 +270,7 @@ export default defineComponent({
           </CellGroup>
 
           <div class={styles.applyTitle}>声部信息</div>
+          <div class={styles.applyTips}>(请务必按照学生的录取声部填报)</div>
           <CellGroup inset class={styles.applyCellGroup}>
             <Field
               required

src/student/music-group/pre-apply/component/payment.tsx

@@ -286,9 +286,20 @@ export default defineComponent({
       <>
         <div class={styles.applyTitle}>报名须知</div>
         <div class={[styles.paymentTips, styles.mlr13]}>
-          <p>1、您注册时所选择的乐团声部，即为乐团录取最终确认的声部，请您务必仔细填写；</p>
           <p>
-            2、所有参与乐团的学员免费赠送选报声部教材，教材随乐器一同发放，若您自备乐器，则需承担教材运费。
+            1、<span>乐团免费政策</span>：学生在团期间训练及教材免费政策（教材邮费需自理）；
+          </p>
+          <p>
+            2、<span>入团必备工具</span>
+            ：为了符合乐团学练同频的要求，学生在入团前需准备好乐团Ai训练工具和乐器两项工具；
+          </p>
+          <p>
+            3、<span>入团必备工具准备的原则</span>
+            ：家长可自行准备（需按照乐团提供的参考参数准备），也可勾选下方项目技术方提供的乐团工具；
+          </p>
+          <p>
+            4、<span>温馨提示</span>
+            ：自行准备的家长请在收到开团信息后再进行工具准备（避免出现时间浪费），在项目技术方购置的家长请放心提交（Ai学练工具将在首次训练时激活）
           </p>
         </div>
         <CheckboxGroup

src/student/music-group/pre-apply/index.module.less

@@ -2,10 +2,12 @@
   --van-tab-active-text-color: var(--van-primary-color);
   --van-tab-text-color: #333;
   --van-tab-font-size: 16px;
+
   :global {
     .van-tab {
       font-weight: 600;
     }
+
     .van-tabs__wrap {
       padding-bottom: 3px;
     }
@@ -18,6 +20,7 @@
   .popupContainer {
     background: url('./images/wx-no-bg.png') no-repeat top center;
     padding: 0 15px;
+
     .dialogTitle {
       i {
         display: inline-block;
@@ -41,6 +44,7 @@
       padding: 15px 0 45px;
       font-size: 16px;
     }
+
     .title1 {
       padding-top: 57px;
       text-align: center;
@@ -48,6 +52,7 @@
       font-weight: 500;
       color: #3b2300;
     }
+
     .popupTips {
       padding-top: 12px;
       padding-bottom: 47px;
@@ -63,6 +68,7 @@
     background-size: cover;
     height: 142px;
     width: 100%;
+
     .orchestraName {
       display: block;
       padding: 86px 18px 0;
@@ -92,8 +98,16 @@
     border-radius: 3px;
   }
 }
+
+.applyTips {
+  padding: 0px 20px 12px;
+  font-size: 14px;
+  color: #777;
+}
+
 .applyCellGroup {
   margin: 0 13px;
+
   :global {
     .van-cell {
       font-size: 16px;
@@ -116,7 +130,7 @@
     opacity: 0;
   }
 
-  & + .radioSection {
+  &+.radioSection {
     margin-left: 12px;
   }
 }
@@ -135,6 +149,10 @@
   font-size: 400;
   line-height: 20px;
   text-align: justify;
+
+  span {
+    color: #ff4e19;
+  }
 }
 
 .paymentContainer {
@@ -143,21 +161,25 @@
   justify-content: space-between;
   font-size: 14px;
   padding: 15px 12px calc(15px + env(safe-area-inset-bottom)) 12px;
+
   .needPrice {
     display: flex;
     align-items: center;
     color: #333333;
     padding-bottom: 7px;
+
     span {
       font-size: 22px;
       font-weight: bold;
       color: #ff4e19;
+
       span {
         font-size: 18px;
         margin-right: 2px;
       }
     }
   }
+
   .allPrice {
     color: #aaa;
   }
@@ -177,11 +199,13 @@
   border-radius: 10px;
   overflow: hidden;
   --van-checkbox-border-color: transparent;
+
   :global {
     .van-cell {
       padding: 0;
     }
   }
+
   .checkbox {
     margin-right: 12px;
   }
@@ -189,6 +213,7 @@
   .extra {
     // padding-left: 35px;
     padding: 10px 0 0 35px;
+
     .sectionPrice {
       display: flex;
       align-items: center;
@@ -196,6 +221,7 @@
       font-weight: 600;
       flex-wrap: wrap;
     }
+
     .price {
       display: flex;
       align-items: center;
@@ -203,11 +229,13 @@
       color: #333333;
       padding-right: 12px;
       font-weight: 400;
+
       span {
         font-size: 16px;
         font-weight: bold;
         color: #ff4e19;
       }
+
       .free {
         font-size: 14px;
       }
@@ -218,6 +246,7 @@
     margin-top: 18px;
     padding-top: 8px;
     border-top: 1px solid #f2f2f2;
+
     .sectionTips {
       display: flex;
       align-items: center;
@@ -227,6 +256,7 @@
       background: #ffebdd;
       border-radius: 6px;
     }
+
     .iconGives {
       width: 32px;
       height: 18px;
@@ -236,6 +266,7 @@
 
   .iconChecked {
     font-size: 18px;
+
     :global {
       .van-icon__image {
         width: 100%;
@@ -243,25 +274,30 @@
       }
     }
   }
+
   :global {
     .van-checkbox__icon--disabled .van-icon {
       border-color: transparent;
       background-color: transparent;
       opacity: 0.6;
     }
+
     .van-checkbox__icon--checked .van-icon {
       border-color: transparent;
       background-color: transparent;
     }
   }
 }
+
 .numFont {
   font-family: 'DINA';
+
   .numPrefix {
     font-size: 14px !important;
     margin-right: 2px;
   }
 }
+
 .section {
   display: flex;
   // align-items: center;
@@ -299,6 +335,7 @@
 
 .orderCellGroup {
   margin: 0 13px 12px;
+
   :global {
     .van-cell {
       padding-left: 12px;
@@ -306,20 +343,24 @@
     }
   }
 }
+
 .payTime {
   font-size: 16px;
   color: #777777;
   flex: 0 auto;
 }
+
 .payStatus {
   color: #ff4e19;
 }
+
 .paySuccess {
   color: var(--van-primary);
 }
 
 .imgGroup {
   padding: 15px 12px 18px 6px !important;
+
   .img {
     width: 70px;
     height: 70px;
@@ -337,7 +378,7 @@
     display: flex;
     align-content: center;
 
-    & > div {
+    &>div {
       flex: 1 auto;
     }
 
@@ -348,16 +389,19 @@
       display: flex;
       flex-direction: column;
       justify-content: center;
+
       .opNums {
         span {
           font-size: 12px;
         }
+
         font-size: 16px;
         font-family: DINA;
         font-weight: bold;
         color: #333333;
         line-height: 14px;
       }
+
       .opBuyLength {
         font-size: 13px;
         color: #777777;
@@ -369,27 +413,32 @@
 
 .btnGroup {
   padding-top: 0;
+
   .btnPrice {
     font-family: DINA;
     font-size: 22px;
     font-weight: bold;
     color: #ff4e19;
   }
+
   :global {
     .van-cell__value {
       flex: 1 auto;
       display: flex;
       justify-content: flex-end;
     }
+
     .van-button {
       height: 30px;
       line-height: 30px;
       min-width: 80px;
-      & + .van-button {
+
+      &+.van-button {
         margin-left: 10px;
       }
     }
   }
+
   .btns {
     display: flex;
   }
@@ -398,6 +447,7 @@
 .preApplyC {
   --van-dialog-message-font-size: 16px !important;
 }
+
 .dialogTitle {
   i {
     display: inline-block;
@@ -420,14 +470,17 @@
 .dialogRefund {
   padding: 20px 0 15px 25px;
 }
+
 .refundContent {
   padding: 0 20px 25px;
+
   .tips {
     font-size: 15px;
     color: #333333;
     line-height: 21px;
   }
 }
+
 .container {
   :global {
     .van-button {
@@ -443,6 +496,7 @@
   font-weight: 600;
   color: #333333;
   line-height: 22px;
+
   span {
     color: #f44541;
   }
@@ -451,4 +505,4 @@
 .phoneName {
   background: #f2f2f2;
   border-radius: 6px;
-}
+}

src/student/music-group/pre-apply/index.tsx

@@ -241,9 +241,9 @@ export default defineComponent({
             v-model:active={state.tabValue}
             onChange={(val: any) => getRegisterInfo(val)}
           >
-            <Tab title="报名信息" name="apply" disabled={state.purchase}></Tab>
-            <Tab title="缴费信息" name="payment" disabled={state.purchase || !state.register}></Tab>
-            <Tab title="我的订单" name="order" disabled={!state.register}></Tab>
+            <Tab title="基础信息" name="apply" disabled={state.purchase}></Tab>
+            <Tab title="工具准备" name="payment" disabled={state.purchase || !state.register}></Tab>
+            <Tab title="完成报名" name="order" disabled={!state.register}></Tab>
           </Tabs>
         </Sticky>