Explorar o código

Merge branch 'feature-2025-1-10' into jenkins-test

TIANYONG hai 5 meses
pai
achega
2e514fc035

+ 34 - 0
src/helpers/utils.ts

@@ -642,3 +642,37 @@ export function chunkArray(array: any[], size: number) {
   }
   return result;
 }
+
+// 转换数字为中文数字
+export const convertToChineseNumber = (num: number) => {
+  const chineseNumerals = ['零', '一', '二', '三', '四', '五', '六', '七', '八', '九'];
+  const chineseUnits = ['', '十', '百', '千', '万', '十', '百', '千', '亿'];
+
+  // 特殊处理0
+  if (num === 0) {
+    return chineseNumerals[0];
+  }
+
+  let result = '';
+  let unitPos = 0; // 单位的位置,表示“十”,“百”,“千”,“万”等
+
+  // 处理数字的每一位
+  while (num > 0) {
+    const digit = num % 10;  // 取出最后一位数字
+    if (digit !== 0) {
+      result = chineseNumerals[digit] + chineseUnits[unitPos] + result;  // 数字加上相应单位
+    } else if (result && result.charAt(0) !== chineseNumerals[0]) {
+      result = chineseNumerals[0] + result;  // 处理中间的零
+    }
+
+    num = Math.floor(num / 10);  // 移除最后一位数字
+    unitPos++;
+  }
+
+  // 如果结果以“一十”开头,去掉一
+  if (result.startsWith('一十')) {
+    result = result.substring(1);
+  }
+
+  return result;
+}

+ 3 - 1
src/views/payment-result/index.tsx

@@ -213,7 +213,9 @@ export default defineComponent({
                 title: () => (
                   <div class={styles.buyContent}>
                     <p class={styles.goodsTitle}>{goods.goodsName}</p>
-                    <Tag class={styles.brandName}>{goods.brandName}</Tag>
+                    {
+                      goods.brandName && <Tag class={styles.brandName}>{goods.brandName}</Tag>
+                    }
                   </div>
                 ),
                 value: () => <span>x{goods.goodsNum}</span>

BIN=BIN
src/views/student-register/images/gift-box-title.png


BIN=BIN
src/views/student-register/images/gift-tip-icon.png


BIN=BIN
src/views/student-register/images/gift_card1.png


BIN=BIN
src/views/student-register/images/gift_card2.png


BIN=BIN
src/views/student-register/images/gift_zs_icon.png


BIN=BIN
src/views/student-register/images/new/banner-bg5.png


BIN=BIN
src/views/student-register/images/tip-box-icon.png


BIN=BIN
src/views/student-register/images/tip-btn-icon.png


BIN=BIN
src/views/student-register/images/tip-title-icon.png


BIN=BIN
src/views/student-register/images/tip1-icon.png


BIN=BIN
src/views/student-register/images/tip2-icon.png


BIN=BIN
src/views/student-register/images/tip3-icon.png


+ 229 - 2
src/views/student-register/index-apply.module.less

@@ -12,6 +12,11 @@
     background: url('./images/new/banner-bg4.png') no-repeat top center;
     background-size: contain;
   }
+  .studentRegisterContainer2 {
+    padding-top: 142px;
+    background: url('./images/new/banner-bg5.png') no-repeat top center;
+    background-size: contain;
+  }
 }
 
 .countdownSection {
@@ -96,6 +101,16 @@
   background: #FFFFFF;
   box-shadow: 0px -1px 0px 0px #F2F2F2, inset 0px 1px 3px 0px #FFFFFF;
   border-radius: 18px 18px 0px 0px;
+  position: relative;
+  &::before {
+    content: "";
+    position: absolute;
+    left: 0;
+    bottom: -20px;
+    width: 100%;
+    height: 30px;
+    background: #fff;
+  }
 
 
   .payemntPrice {
@@ -190,7 +205,7 @@
     height: 22px;
     background: url('./images/new/title-7.png') no-repeat center;
     background-size: contain;
-    margin: 0 auto;
+    margin: 12px auto 0;
   }
 
   .title2 {
@@ -865,4 +880,216 @@
     font-size: 16px;
     margin-top: 6px;
   }
-}
+}
+
+.tipBoxPop {
+  position: fixed;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.7);
+  overflow: hidden;
+  z-index: 999;
+  .tipBox {
+    position: relative;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -55%);
+    background: url('./images/tip-box-icon.png') no-repeat center;
+    background-size: contain;
+    height: 310px;
+    width: 260px;
+    padding: 124px 22px 0;
+    .tipTitle {
+      width: 75px;
+      display: block;
+      margin: 0 auto 10px;
+    }
+    .tipBtn {
+      position: relative;
+      img {
+        width: 190px;
+        height: 62px;
+        display: block;
+        margin: 8px auto 0;
+      }
+      span {
+        position: absolute;
+        left: 0;
+        top: 0;
+        width: 100%;
+        height: 100%;
+        text-align: center;
+        padding: 13px;
+        font-size: 18px;
+        color: #fff;
+        font-weight: 500;
+      }
+    }
+    .tipItem {
+      display: flex;
+      align-items: center;
+      img {
+        width: 14px;
+        height: 14px;
+        margin-right: 5px;
+      }
+      p {
+        font-size: 13px;
+        color: #777777;
+        line-height: 26px;
+        span {
+          color: #0C8BFE;
+          font-weight: 500;
+        }
+      }
+    }
+  }
+}
+
+.giftBox {
+  position: relative;
+  margin: 1px 14px 16px;
+  background: linear-gradient(180deg, #DBF6FD 0%, #FFFFFF 10%);
+  border-radius: 16px;
+  border: 2px solid #FFFFFF;
+  padding: 12px 14px 14px;
+  .titleIcon {
+    width: 212px;
+    margin: 0 auto 20px;
+    display: block;
+  }
+  .tools {
+    background: linear-gradient( 135deg, #EAFAFF 0%, #E6F2FF 100%);
+    border-radius: 13px;    
+    display: flex;
+    align-items: center;
+    padding: 10px;
+    .toolImg {
+      width: 80px;
+      height: 80px;
+      border-radius: 4px;
+      margin-right: 12px;
+    }
+    .toolRight {
+      display: flex;
+      flex-direction: column;
+      height: 80px;
+      justify-content: space-between;
+      overflow: hidden;
+      >p {
+        font-size: 16px;
+        color: #000000;
+        text-overflow: ellipsis;
+        overflow: hidden;
+        word-break: break-all;
+        white-space: nowrap;  
+      }
+      .trDesc {
+        font-size: 13px;
+        color: #FD2C55;
+      }
+      .trBottom {
+        display: flex;
+        align-items: center;
+        >span {
+          display: inline-block;
+        }
+        .tcPrice {
+          font-size: 18px;
+          color: #000000;
+          font-weight: 500;
+        }
+        .toPrice {
+          font-size: 13px;
+          color: #69717C;
+          i {
+            font-style: normal;
+            text-decoration: line-through;
+          }
+        }
+      }
+    }
+  }
+  .extraTools {
+    margin-top: 10px;
+    background: linear-gradient( 135deg, #EAFAFF 0%, #E6F2FF 100%);
+    border-radius: 13px;
+    display: flow-root;
+    .exTitle {
+      background: #F0F8FF;
+      border-radius: 13px 13px 0px 0px;
+      padding: 6px 8px;
+      margin: 4px 4px 0;
+      img {
+        width: 280px;
+      }
+    }
+    .extItem {
+      background: #fff;
+      border-radius: 10px;    
+      display: flex;
+      align-items: center;
+      //padding: 10px 10px 10px;
+      margin: 10px;
+      position: relative;
+      overflow: hidden;
+      .toolImg {
+        width: 80px;
+        height: 80px;
+        border-radius: 4px;
+        margin-right: 12px;
+      }
+      .toolRight {
+        display: flex;
+        flex-direction: column;
+        height: 80px;
+        justify-content: center;
+        position: relative;
+        z-index: 5;
+        overflow: hidden;
+        >p {
+          font-size: 16px;
+          color: #000000;
+          margin-bottom: 12px;
+          text-overflow: ellipsis;
+          overflow: hidden;
+          word-break: break-all;
+          white-space: nowrap;    
+          padding-right: 6px;      
+        }
+        .trDesc {
+          font-size: 13px;
+          color: #FD2C55;
+        }
+        .trBottom {
+          display: flex;
+          align-items: center;
+          .tcPrice {
+            font-size: 18px;
+            color: #000000;
+            font-weight: 500;
+          }
+          .toPrice {
+            font-size: 13px;
+            color: #69717C;
+            i {
+              font-style: normal;
+              text-decoration: line-through;
+            }
+          }
+        }
+      }    
+      .toolZsIcon {
+        position: absolute;
+        right: -10px;
+        bottom: -10px;
+        width: 60px;
+        height: 60px;
+        z-index: 1;
+      }  
+    }
+  }
+
+}  

+ 272 - 82
src/views/student-register/index-apply.tsx

@@ -37,7 +37,7 @@ import { useRoute, useRouter } from 'vue-router';
 import { useStudentRegisterStore } from '@/store/modules/student-register-store';
 import request from '@/helpers/request';
 import requestStudent from './request';
-import { browser, checkPhone, getHttpOrigin, getUrlCode, moneyFormat } from '@/helpers/utils';
+import { browser, checkPhone, getHttpOrigin, getUrlCode, moneyFormat, convertToChineseNumber } from '@/helpers/utils';
 import deepClone from '@/helpers/deep-clone';
 import OWxTip from '@/components/m-wx-tip';
 import MDialog from '@/components/m-dialog';
@@ -67,6 +67,16 @@ import UserAuth from './component/user-auth';
 import MMessageTip from '@/components/m-message-tip';
 import SelectStudent from './modal/select-student';
 import { vipGiftPeriodType } from '.';
+import tipTitleIcon from './images/tip-title-icon.png';
+import tipIcon1 from './images/tip1-icon.png';
+import tipIcon2 from './images/tip2-icon.png';
+import tipIcon3 from './images/tip3-icon.png';
+import tipBtnIcon from './images/tip-btn-icon.png';
+import giftBoxTitleIcon from './images/gift-box-title.png';
+import giftExtraTitleIcon from './images/gift-tip-icon.png';
+import giftCard1Icon from './images/gift_card1.png';
+import giftCard2Icon from './images/gift_card2.png';
+import giftZsIcon from './images/gift_zs_icon.png';
 
 const classList: any = [];
 for (let i = 1; i <= 40; i++) {
@@ -214,7 +224,12 @@ export default defineComponent({
       orderNo: null as any,
       config: {} as any,
       paymentStatus: false,
-      orderTimer: null as any
+      orderTimer: null as any,
+      tipBoxPop: false, // 团购政策提示弹窗
+      intrumentList: [] as any, // 赠送的乐器列表
+      currentIntrument: null as any, // 当前匹配上的乐器
+      giftDesc: '' as any, // 团购政策,赠送会员的提示信息
+      descSecondsNum: 3, // 倒计时
     });
 
     /*
@@ -328,6 +343,27 @@ export default defineComponent({
 
         if (forms.details.length > 0) {
           forms.detailVip = forms.details[0];
+          const { giftPeriod, giftFlag, giftVipDay } = forms.detailVip
+          forms.detailVip.zsUnit = giftPeriod === 'DAY' ? '天' : giftPeriod === 'MONTH' ? '月' : giftPeriod === 'YEAR' ? '年' : '天'
+          /**
+           * 计算赠品原价
+           * giftFlag: 是否赠送会员
+           * giftVipDay: 赠送天数
+           * giftPeriod: 赠送单位,'DAY','MONTH', 'YEAR'(天月年)
+           * 原价取值:学校管理-会员原价
+           * 按天赠送:会员原价/365*赠送天数
+           * 按月赠送:就会员原价/12*赠送月数
+           * 按年赠送:就会员原价*年数
+           */
+          if (giftFlag) {
+            if (giftPeriod === 'YEAR') {
+              const preNum = convertToChineseNumber(giftVipDay)
+              const totalNum = convertToChineseNumber(giftVipDay+1)
+              state.giftDesc = `买一赠${preNum},即<span>团购一年,使用${totalNum}年</span>`
+            } else {
+              state.giftDesc = `团购一年,<span>赠送${giftVipDay}${forms.detailVip.zsUnit}有效期</span>`
+            }
+          }
           // forms.giftVipDay = forms.details[0].membershipDays;
         }
         forms.giftVipDay = data.giftVipDay || 0;
@@ -336,6 +372,10 @@ export default defineComponent({
         forms.registerType = data.registerType;
         studentInfo.extra.registerType = data.registerType;
         const schoolInstrumentList = data.schoolInstrumentList || [];
+        state.intrumentList = schoolInstrumentList
+        if (data.schoolInstrumentSetType === 'SCHOOL' && forms.registerType === 'MUST_BUY_GOODS') {
+          state.currentIntrument = schoolInstrumentList[0] || null
+        }
         if (data.schoolInstrumentSetType === 'SCHOOL') {
           const instrumentCode = schoolInstrumentList[0]?.instrumentCode;
           forms.gradeList = getGradeList(data.gradeYear, instrumentCode);
@@ -386,6 +426,7 @@ export default defineComponent({
             list.classList.sort((a: any, b: any) => a.value - b.value);
             lastGradeList.push(list);
           });
+          console.log('显示11',schoolInstrumentList)
           lastGradeList.sort((a: any, b: any) => a.value - b.value);
           forms.gradeList = lastGradeList;
           forms.classList = [];
@@ -441,6 +482,11 @@ export default defineComponent({
         originAmount += Number(vip.originalPrice);
       });
 
+      // 一页必买,需要加水赠送的价格和乐器价格
+      if (forms.registerType === 'MUST_BUY_GOODS') {
+        originAmount = originAmount + (state.currentIntrument?.originalPrice || 0)
+      }
+
       // const goodsList: any[] = studentRegisterStore.getGoods;
       // goodsList.forEach((good: any) => {
       //   amount += Number(good.price) * good.quantity;
@@ -938,6 +984,16 @@ export default defineComponent({
             paymentCouponAmount: 0 // 优惠券金额
           });
         });
+        // 添加赠送的乐器
+        if (state.currentIntrument?.instrumentId) {
+          params.push({
+            goodsId: state.currentIntrument?.instrumentId,
+            goodsNum: 1,
+            goodsType: "INSTRUMENTS",
+            paymentCashAmount: 0,
+            paymentCouponAmount: 0
+          })
+        }
 
         // goodsList.forEach((goods: any) => {
         //   params.push({
@@ -1274,6 +1330,18 @@ export default defineComponent({
       forms.isChangeSchool = false; // 是否切换学校
     };
 
+    const tipCountdown = (seconds: number) => {
+      let remainingTime = seconds;
+      const interval = setInterval(() => {
+        remainingTime--;
+        state.descSecondsNum = state.descSecondsNum > 1 ? state.descSecondsNum - 1 : 1;
+        if (remainingTime < 1) {
+          clearInterval(interval);  // 清除定时器
+          state.tipBoxPop = false
+        }
+      }, 1000);  // 每秒执行一次
+    }
+
     onMounted(async () => {
       try {
         // 获取支付类型
@@ -1317,6 +1385,13 @@ export default defineComponent({
         }
 
         await getRegisterGoods();
+        nextTick(() => {
+          // 一页展示(必买)才显示团购提示弹窗
+          if (forms.registerType === 'MUST_BUY_GOODS' && browser().weixin) {
+            state.tipBoxPop = true
+            tipCountdown(3)
+          }
+        })
       } catch {}
     });
 
@@ -1326,7 +1401,7 @@ export default defineComponent({
 
     return () => (
       <div class={styles['student-register']}>
-        <div class={styles.studentRegisterContainer}>
+        <div class={[forms.registerType === 'MUST_BUY_GOODS' ? styles.studentRegisterContainer2 : styles.studentRegisterContainer]}>
           {!forms.activeOverStatus && (
             <div class={styles.countdownSection}>
               <div class={styles.timer}>
@@ -1360,8 +1435,10 @@ export default defineComponent({
               styles.studentSectionForm,
               forms.giftVipDay <= 0 && styles.noSendDay
             ]}>
-            {/* <div class={styles.title1}></div> */}
-
+            {
+              forms.registerType === 'MUST_BUY_GOODS' && 
+              <div class={styles.title1}></div>
+            }
             <Form labelAlign="left" class={styles.registerForm}>
               <Field
                 clearable={false}
@@ -1630,78 +1707,137 @@ export default defineComponent({
             </div>
           </div> */}
 
-          <div class={[styles.goodsExtra]}>
-            {/* <i class={styles.iconArrow}></i> */}
-            <Cell
-              border={false}
-              class={[
-                styles.goodsCell,
-                forms.registerType === 'SELECT_BUY_GOODS' &&
-                  styles.goodsBuyGoods
-              ]}
-              center
-              onClick={() => {
-                // console.log(forms.joinType, 'joinType');
-                if (forms.registerType !== 'SELECT_BUY_GOODS') return;
-
-                if (forms.joinType === 'digitalize') {
-                  otherParams.showOtherMessage = `没有陪练工具,将无法实现同步练习`;
-                  otherParams.showOtherSchool = true;
-                  otherParams.showCloseButton = true;
-                  otherParams.showCancelButton = true;
-                  otherParams.cancelButtonColor = '';
-                  otherParams.cancelButtonText = '确认取消';
-                  otherParams.confirmButtonColor = '';
-                  otherParams.confirmButtonText = '放弃取消';
-                  otherParams.otherType = 'payment';
-                  otherParams.messageAlign = 'center';
-                } else if (forms.joinType === 'tradition') {
-                  forms.joinType = 'digitalize';
-                }
-              }}>
-              {{
-                icon: () =>
-                  forms.registerType === 'SELECT_BUY_GOODS' && (
-                    <div class={styles.checkedGroup}>
-                      <i
-                        class={[
-                          styles.iconChecked,
-                          forms.joinType === 'digitalize' && styles.selected
-                        ]}></i>
-
-                      {/* {forms.tipStatus && <i class={styles.showBg}></i>} */}
-                      {forms.joinType === 'digitalize' && (
-                        <i class={styles.showBg}></i>
-                      )}
-                    </div>
-                  ),
-                title: () => (
-                  <div class={styles.section}>
-                    <Image
-                      class={styles.img}
-                      src={forms.detailVip.goodsUrl || tuangou}
-                    />
-                    <div class={styles.sectionContent}>
-                      <img
-                        src={
-                          forms.registerType === 'SELECT_BUY_GOODS'
-                            ? icon5
-                            : icon10
-                        }
-                        class={styles.goodsName}
+          {
+            forms.registerType !== 'MUST_BUY_GOODS' && 
+            <div class={[styles.goodsExtra]}>
+              {/* <i class={styles.iconArrow}></i> */}
+              <Cell
+                border={false}
+                class={[
+                  styles.goodsCell,
+                  forms.registerType === 'SELECT_BUY_GOODS' &&
+                    styles.goodsBuyGoods
+                ]}
+                center
+                onClick={() => {
+                  // console.log(forms.joinType, 'joinType');
+                  if (forms.registerType !== 'SELECT_BUY_GOODS') return;
+
+                  if (forms.joinType === 'digitalize') {
+                    otherParams.showOtherMessage = `没有陪练工具,将无法实现同步练习`;
+                    otherParams.showOtherSchool = true;
+                    otherParams.showCloseButton = true;
+                    otherParams.showCancelButton = true;
+                    otherParams.cancelButtonColor = '';
+                    otherParams.cancelButtonText = '确认取消';
+                    otherParams.confirmButtonColor = '';
+                    otherParams.confirmButtonText = '放弃取消';
+                    otherParams.otherType = 'payment';
+                    otherParams.messageAlign = 'center';
+                  } else if (forms.joinType === 'tradition') {
+                    forms.joinType = 'digitalize';
+                  }
+                }}>
+                {{
+                  icon: () =>
+                    forms.registerType === 'SELECT_BUY_GOODS' && (
+                      <div class={styles.checkedGroup}>
+                        <i
+                          class={[
+                            styles.iconChecked,
+                            forms.joinType === 'digitalize' && styles.selected
+                          ]}></i>
+
+                        {/* {forms.tipStatus && <i class={styles.showBg}></i>} */}
+                        {forms.joinType === 'digitalize' && (
+                          <i class={styles.showBg}></i>
+                        )}
+                      </div>
+                    ),
+                  title: () => (
+                    <div class={styles.section}>
+                      <Image
+                        class={styles.img}
+                        src={forms.detailVip.goodsUrl || tuangou}
                       />
+                      <div class={styles.sectionContent}>
+                        <img
+                          src={
+                            forms.registerType === 'SELECT_BUY_GOODS'
+                              ? icon5
+                              : icon10
+                          }
+                          class={styles.goodsName}
+                        />
+                      </div>
                     </div>
+                  )
+                }}
+              </Cell>
+
+            </div>            
+          }    
+  
+
+          {
+            forms.registerType === 'MUST_BUY_GOODS' && 
+            <div class={styles.giftBox}>
+              <img class={styles.titleIcon} src={giftBoxTitleIcon} />
+              <div class={styles.tools}>
+                <img class={styles.toolImg} src={forms.detailVip.goodsUrl || giftCard1Icon} />
+                <div class={styles.toolRight}>
+                  <p>乐器AI学练工具一年卡</p>
+                  <div class={styles.trDesc}>7天无理由退款</div>
+                  <div class={styles.trBottom}>
+                    <span class={styles.tcPrice}>¥ {forms.detailVip.currentPrice}</span>
+                    <span class={styles.toPrice}>|原价 <i>¥ {Number(forms.detailVip.originalPrice).toFixed(2)}</i></span>
                   </div>
-                )
-              }}
-            </Cell>
+                </div>
+              </div>
 
-            {/* {forms.detailVip.membershipDays ? ( */}
+              {/** 有赠品才显示 */}
+              {
+                (forms.detailVip.giftFlag || state.currentIntrument?.instrumentId) &&
+                <div class={styles.extraTools}>
+                  <div class={styles.exTitle}>
+                    <img src={giftExtraTitleIcon} />
+                  </div>
+                  {/** 会员赠送 */}
+                  {
+                    forms.detailVip.giftFlag && 
+                    <div class={styles.extItem}>
+                      <img class={styles.toolImg} src={giftCard2Icon} />
+                      <div class={styles.toolRight}>
+                        <p>乐器AI学练工具{forms.detailVip.giftPeriod === 'YEAR' ? convertToChineseNumber(forms.detailVip.giftVipDay) : forms.detailVip.giftVipDay}{forms.detailVip.zsUnit}卡</p>
+                        <div class={styles.trBottom}>
+                          <span class={styles.tcPrice}>¥ 00.00</span>
+                          <span class={styles.toPrice}>|原价 <i>¥ {Number(forms.detailVip.giftOriginalPrice).toFixed(2)}</i></span>
+                        </div>                  
+                      </div>
+                      <img class={styles.toolZsIcon} src={giftZsIcon} />
+                    </div>                
+                  }
+                  {/** 乐器赠送,注册类型为MUST_BUY_GOODS,才显示赠送乐器 */}
+                  {
+                    (state.currentIntrument?.instrumentId && forms.registerType === 'MUST_BUY_GOODS') && 
+                    <div class={styles.extItem}>
+                      <img class={styles.toolImg} src={giftCard2Icon} />
+                      <div class={styles.toolRight}>
+                        <p>{state.currentIntrument.instrumentName}</p>
+                        <div class={styles.trBottom}>
+                          <span class={styles.tcPrice}>¥ 00.00</span>
+                          <span class={styles.toPrice}>|原价 <i>¥ {Number(state.currentIntrument.originalPrice).toFixed(2)}</i></span>
+                        </div>                  
+                      </div>
+                      <img class={styles.toolZsIcon} src={giftZsIcon} />
+                    </div>                
+                  }
+
+                </div>
+              }
+            </div>            
+          }
 
-            {/* ) : (
-              ''
-            )} */}
-          </div>
 
           {/* <div class={[styles.memberNumer, styles.aiMemberNumber]}>
             <img src={iconGift} class={styles.iconGift} />
@@ -1711,7 +1847,7 @@ export default defineComponent({
             </p>
           </div> */}
 
-          {forms.detailVip.membershipDays ? (
+          {forms.detailVip.membershipDays && forms.registerType !== 'MUST_BUY_GOODS' ? (
             <div class={styles.vipGiftContainer}>
               <img src={vipGiftTIps} class={styles.iconGift} />
               <p>
@@ -1779,7 +1915,10 @@ export default defineComponent({
             <MSticky position="bottom" ref={mstickyRef}>
               <div class={styles.paymentContainer}>
                 <div class={styles.payemntPrice}>
-                  <img src={giftTip} class={styles.giftTip} />
+                  {
+                    forms.registerType === 'SELECT_BUY_GOODS' && 
+                    <img src={giftTip} class={styles.giftTip} />
+                  }
                   <div>
                     <span class={styles.needPrice}>
                       <i style="font-style: normal">¥ </i>
@@ -1803,14 +1942,24 @@ export default defineComponent({
                   onClick={() => {
                     onSubmit();
                   }}>
-                  <Button
-                    round
-                    disabled={forms.submitLoading}
-                    loading={forms.submitLoading}>
-                    {forms.joinType === 'digitalize'
-                      ? '报名与支付'
-                      : '提交报名'}
-                  </Button>
+                  {
+                    forms.registerType === 'MUST_BUY_GOODS' ?
+                    <Button
+                      round
+                      disabled={forms.submitLoading}
+                      loading={forms.submitLoading}>
+                      立即购买
+                    </Button> : 
+                    <Button
+                      round
+                      disabled={forms.submitLoading}
+                      loading={forms.submitLoading}>
+                      {forms.joinType === 'digitalize'
+                        ? '报名与支付'
+                        : '提交报名'}
+                    </Button>                    
+                  }
+
                 </div>
 
                 {/* {forms.joinType === 'tradition' && (
@@ -1884,6 +2033,11 @@ export default defineComponent({
                   forms.currentClassText = '';
                   studentInfo.extra.currentClass = '';
                 }
+                // 更换年级班级后,判断是否需要更换赠送的乐器
+                if (forms.schoolInstrumentSetType === 'GRADE') {
+                  state.currentIntrument = state.intrumentList.find((item: any) => (item.gradeNum === studentInfo.extra.currentGradeNum && item.classNum === selectedOption.value) )
+                }
+                // console.log('选择111',state.currentIntrument)
               }}
             />
           )}
@@ -1914,6 +2068,11 @@ export default defineComponent({
                 if (['CLASS'].includes(forms.schoolInstrumentSetType)) {
                   forms.instrumentCode = selectedOption.instrumentCode;
                 }
+                // 更换年级班级后,判断是否需要更换赠送的乐器
+                if (forms.schoolInstrumentSetType === 'CLASS') {
+                  state.currentIntrument = state.intrumentList.find((item: any) => (item.gradeNum === selectedOption.value))
+                }
+                // console.log('选择222',state.currentIntrument)
               }}
             />
           )}
@@ -2162,6 +2321,37 @@ export default defineComponent({
             }}
           />
         </Popup>
+
+        {
+          state.tipBoxPop && 
+          <div class={styles.tipBoxPop}>
+            <div class={styles.tipBox}>
+              <img class={styles.tipTitle} src={tipTitleIcon} />
+              <ul>
+                <li class={styles.tipItem}>
+                  <img src={tipIcon1} />
+                  <p>开课时赠送<span>全新乐器一支</span></p>
+                </li>
+                {
+                  state.giftDesc && 
+                  <li class={styles.tipItem}>
+                    <img src={tipIcon2} />
+                    <p v-html={state.giftDesc}></p>
+                  </li>                  
+                }
+                <li class={styles.tipItem}>
+                  <img src={state.giftDesc ? tipIcon3 : tipIcon2} />
+                  <p><span>7天内无理由</span>全额退款保障</p>
+                </li>
+              </ul>
+              <div class={styles.tipBtn}>
+                <img src={tipBtnIcon} />
+                <span>我知道了({state.descSecondsNum}s)</span>
+              </div>
+            </div>
+          </div>          
+        }
+
       </div>
     );
   }