添加音频播放

package-lock.json

@@ -18,6 +18,8 @@
         "countup.js": "^2.3.2",
         "dayjs": "^1.10.7",
         "echarts": "^5.3.3",
+        "eventemitter3": "^5.0.0",
+        "howler": "^2.2.3",
         "html-to-image": "^1.9.0",
         "html2canvas": "^1.4.1",
         "loaders.css": "^0.1.2",
@@ -4750,6 +4752,11 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/eventemitter3": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmmirror.com/eventemitter3/-/eventemitter3-5.0.0.tgz",
+      "integrity": "sha512-riuVbElZZNXLeLEoprfNYoDSwTBRR44X3mnhdI1YcnENpWTCsTTVZ2zFuqQcpoyqPQIUXdiPEU0ECAq0KQRaHg=="
+    },
     "node_modules/execa": {
       "version": "5.1.1",
       "resolved": "https://registry.npmmirror.com/execa/-/execa-5.1.1.tgz",
@@ -5366,6 +5373,11 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/howler": {
+      "version": "2.2.3",
+      "resolved": "https://registry.npmmirror.com/howler/-/howler-2.2.3.tgz",
+      "integrity": "sha512-QM0FFkw0LRX1PR8pNzJVAY25JhIWvbKMBFM4gqk+QdV+kPXOhleWGCB6AiAF/goGjIHK2e/nIElplvjQwhr0jg=="
+    },
     "node_modules/html-tags": {
       "version": "3.1.0",
       "resolved": "https://registry.npmmirror.com/html-tags/-/html-tags-3.1.0.tgz",
@@ -13091,6 +13103,11 @@
       "integrity": "sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==",
       "dev": true
     },
+    "eventemitter3": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmmirror.com/eventemitter3/-/eventemitter3-5.0.0.tgz",
+      "integrity": "sha512-riuVbElZZNXLeLEoprfNYoDSwTBRR44X3mnhdI1YcnENpWTCsTTVZ2zFuqQcpoyqPQIUXdiPEU0ECAq0KQRaHg=="
+    },
     "execa": {
       "version": "5.1.1",
       "resolved": "https://registry.npmmirror.com/execa/-/execa-5.1.1.tgz",
@@ -13517,6 +13534,11 @@
         "parse-passwd": "^1.0.0"
       }
     },
+    "howler": {
+      "version": "2.2.3",
+      "resolved": "https://registry.npmmirror.com/howler/-/howler-2.2.3.tgz",
+      "integrity": "sha512-QM0FFkw0LRX1PR8pNzJVAY25JhIWvbKMBFM4gqk+QdV+kPXOhleWGCB6AiAF/goGjIHK2e/nIElplvjQwhr0jg=="
+    },
     "html-tags": {
       "version": "3.1.0",
       "resolved": "https://registry.npmmirror.com/html-tags/-/html-tags-3.1.0.tgz",

package.json

@@ -30,6 +30,8 @@
     "countup.js": "^2.3.2",
     "dayjs": "^1.10.7",
     "echarts": "^5.3.3",
+    "eventemitter3": "^5.0.0",
+    "howler": "^2.2.3",
     "html-to-image": "^1.9.0",
     "html2canvas": "^1.4.1",
     "loaders.css": "^0.1.2",

public/project/initiation.html

@@ -192,82 +192,72 @@
           v-model="stu.phone" name="phone" :rules="[{ pattern, message: '输入监护人手机号码有误' }]" placeholder="请输入监护人手机号码">
         </van-field>
         <van-field label="学员姓名" :rules="[{ validator, message }]" name="username" v-model="stu.username"
-          placeholder="请填写学员真实姓名" :disabled='checkPhone' @click="onCheckInsertPhone"></van-field>
-        <van-field label="性别" name="sex" :disabled='checkPhone' @click="onCheckInsertPhone"
-          :rules="[{ required: true, message: '请选择性别' }]">
+          placeholder="请填写学员真实姓名"></van-field>
+        <van-field label="性别" name="sex" :rules="[{ required: true, message: '请选择性别' }]">
           <template #input>
-            <van-radio-group v-model="stu.sex" :disabled='checkPhone' checked-color="#FF8057" direction="horizontal">
-              <van-tag size="large" type="primary" :color="!(stu.sex === 1) || checkPhone ? '#EAEAEA' : '#FF8057'"
-                :text-color="!(stu.sex === 1) || checkPhone ? '#AAA' : '#FFF'" class="radioSection" round>
+            <van-radio-group v-model="stu.sex" checked-color="#FF8057" direction="horizontal">
+              <van-tag size="large" type="primary" :color="!(stu.sex === 1) ? '#EAEAEA' : '#FF8057'"
+                :text-color="!(stu.sex === 1) ? '#AAA' : '#FFF'" class="radioSection" round>
                 <van-radio class="radioItem" :name="1"></van-radio>男生
               </van-tag>
-              <van-tag size="large" type="primary" :color="!(stu.sex === 0) || checkPhone ? '#EAEAEA' : '#FF8057'"
-                :text-color="!(stu.sex === 0) || checkPhone ? '#AAA' : '#FFF'" class="radioSection" round>
+              <van-tag size="large" type="primary" :color="!(stu.sex === 0) ? '#EAEAEA' : '#FF8057'"
+                :text-color="!(stu.sex === 0) ? '#AAA' : '#FFF'" class="radioSection" round>
                 <van-radio class="radioItem" :name="0"></van-radio>女生
               </van-tag>
             </van-radio-group>
           </template>
         </van-field>
-        <van-field label="在读年级" :disabled='checkPhone' @click="onCheckInsertPhone" v-model="stu.currentGrade" readonly
-          name="currentGrade" :rules="[{ required: true, message: '请选择在读年级', trigger: 'onChange' }]"
-          @click="() => showPicker = true" placeholder="请选择在读年级">
+        <van-field label="在读年级" v-model="stu.currentGrade" readonly name="currentGrade"
+          :rules="[{ required: true, message: '请选择在读年级', trigger: 'onChange' }]" @click="() => showPicker = true"
+          placeholder="请选择在读年级">
           <template #right-icon>
             <van-icon name="arrow" :color="checkPhone ? '#aaa' : '#323233'" size="16"></van-icon>
           </template>
         </van-field>
-        <van-field v-show="false" v-model="stu.currentGradeNum" @click="onCheckInsertPhone" name="currentGradeNum"
-          readonly></van-field>
-        <van-field label="所在班级" :disabled='checkPhone' @click="onCheckInsertPhone" v-model="stu.currentClass" readonly
-          name="currentClass" :rules="[{ required: true, message: '请选择所在班级', trigger: 'onChange' }]"
-          @click="() => classPicker = true" placeholder="请选择所在班级">
+        <van-field v-show="false" v-model="stu.currentGradeNum" name="currentGradeNum" readonly></van-field>
+        <van-field label="所在班级" v-model="stu.currentClass" readonly name="currentClass"
+          :rules="[{ required: true, message: '请选择所在班级', trigger: 'onChange' }]" @click="() => classPicker = true"
+          placeholder="请选择所在班级">
           <template #right-icon>
             <van-icon name="arrow" :color="checkPhone ? '#aaa' : '#323233'" size="16"></van-icon>
           </template>
         </van-field>
 
-        <van-field label="孩子是否有学习过乐器" :disabled='checkPhone' @click="onCheckInsertPhone"
-          name="musicalInstrumentsLearning" :rules="[{ required: true, message: '请选择孩子是否有学习过乐器' }]">
+        <van-field label="孩子是否有学习过乐器" name="musicalInstrumentsLearning"
+          :rules="[{ required: true, message: '请选择孩子是否有学习过乐器' }]">
           <template #input>
-            <van-radio-group v-model="stu.hasLearningExperience" :disabled='checkPhone' checked-color="#FF8057"
-              direction="horizontal">
-              <van-tag size="large" type="primary"
-                :color="!(stu.hasLearningExperience === 1) || checkPhone ? '#EAEAEA' : '#FF8057'"
-                :text-color="!(stu.hasLearningExperience === 1) || checkPhone ? '#AAA' : '#FFF'" class="radioSection"
-                round>
+            <van-radio-group v-model="stu.hasLearningExperience" checked-color="#FF8057" direction="horizontal">
+              <van-tag size="large" type="primary" :color="!(stu.hasLearningExperience === 1) ? '#EAEAEA' : '#FF8057'"
+                :text-color="!(stu.hasLearningExperience === 1) ? '#AAA' : '#FFF'" class="radioSection" round>
                 <van-radio class="radioItem" :name="1"></van-radio>是
               </van-tag>
-              <van-tag size="large" type="primary"
-                :color="!(stu.hasLearningExperience === 0) || checkPhone ? '#EAEAEA' : '#FF8057'"
-                :text-color="!(stu.hasLearningExperience === 0) || checkPhone ? '#AAA' : '#FFF'" class="radioSection"
+              <van-tag size="large" type="primary" :color="!(stu.hasLearningExperience === 0) ? '#EAEAEA' : '#FF8057'"
+                :text-color="!(stu.hasLearningExperience === 0) ? '#AAA' : '#FFF'" class="radioSection"
                 @click="() => stu.learningSubjectName = ''" round>
                 <van-radio class="radioItem" :name="0"></van-radio>否
               </van-tag>
             </van-radio-group>
           </template>
         </van-field>
-        <van-field label="所学乐器" :disabled='checkPhone' @click="onCheckInsertPhone" v-if="stu.hasLearningExperience==1"
-          name="learningSubjectName" v-model="stu.learningSubjectName" placeholder="(非必填)请选择所学乐器"></van-field>
-        <van-field label="是否报名参加管乐团家长会了解相关情况" :disabled='checkPhone' @click="onCheckInsertPhone"
-          name="joinParentMeeting" :rules="[{ required: true, message: '请选择是否报名参加管乐团家长会了解相关情况' }]">
+        <van-field label="所学乐器" v-if="stu.hasLearningExperience==1" name="learningSubjectName"
+          v-model="stu.learningSubjectName" placeholder="(非必填)请选择所学乐器"></van-field>
+        <van-field label="是否报名参加管乐团家长会了解相关情况" name="joinParentMeeting"
+          :rules="[{ required: true, message: '请选择是否报名参加管乐团家长会了解相关情况' }]">
           <template #input>
-            <van-radio-group v-model="stu.joinParentMeeting" :disabled='checkPhone' checked-color="#FF8057"
-              direction="horizontal">
-              <van-tag size="large" type="primary"
-                :color="!(stu.joinParentMeeting === 1) || checkPhone ? '#EAEAEA' : '#FF8057'"
-                :text-color="!(stu.joinParentMeeting === 1) || checkPhone ? '#AAA' : '#FFF'" class="radioSection" round>
+            <van-radio-group v-model="stu.joinParentMeeting" checked-color="#FF8057" direction="horizontal">
+              <van-tag size="large" type="primary" :color="!(stu.joinParentMeeting === 1) ? '#EAEAEA' : '#FF8057'"
+                :text-color="!(stu.joinParentMeeting === 1) ? '#AAA' : '#FFF'" class="radioSection" round>
                 <van-radio class="radioItem" :name="1"></van-radio>是
               </van-tag>
-              <van-tag size="large" type="primary"
-                :color="!(stu.joinParentMeeting === 0) || checkPhone ? '#EAEAEA' : '#FF8057'"
-                :text-color="!(stu.joinParentMeeting === 0) || checkPhone ? '#AAA' : '#FFF'" class="radioSection" round>
+              <van-tag size="large" type="primary" :color="!(stu.joinParentMeeting === 0) ? '#EAEAEA' : '#FF8057'"
+                :text-color="!(stu.joinParentMeeting === 0) ? '#AAA' : '#FFF'" class="radioSection" round>
                 <van-radio class="radioItem" :name="0"></van-radio>否
               </van-tag>
             </van-radio-group>
           </template>
         </van-field>
-        <van-field :border="true" label="您对校管乐团的组建有什么建议" :disabled='checkPhone' @click="onCheckInsertPhone"
-          type="textarea" rows="3" name="personalSuggestion" v-model="stu.personalSuggestion"
-          placeholder="(非必填)请填写您的建议内容">
+        <van-field :border="true" label="您对校管乐团的组建有什么建议" type="textarea" rows="3" name="personalSuggestion"
+          v-model="stu.personalSuggestion" placeholder="(非必填)请填写您的建议内容">
         </van-field>
       </van-cell-group>
 
@@ -327,7 +317,7 @@
           pickerType: null, // 下拉类型
           stu: {
             username: null, // 姓名
-            sex: 0, // 性别
+            sex: 1, // 性别
             phone: null, // 电话
             currentGrade: '', // 年级
             currentGradeNum: null, // 年级编号
@@ -467,11 +457,6 @@
             vant.closeToast()
           }
         },
-        onCheckInsertPhone() {
-          if (this.checkPhone) {
-            vant.showToast('请输入联系电话')
-          }
-        },
         onConfirm(options) {
           var stu = this.stu
           stu.currentGrade = options.selectedOptions[0].text

public/project/preRegister.html

@@ -191,33 +191,32 @@
         <van-field type="tel" @blur='checkchangePhone' maxlength="11" minlength="11" label="联系电话(直接监护人)"
           v-model="stu.phone" name="phone" :rules="[{ pattern, message: '输入监护人手机号码有误' }]" placeholder="请输入监护人手机号码">
         </van-field>
-        <van-field label="学员姓名" :rules="[{ validator, message }]" @click="onCheckInsertPhone" name="username"
-          v-model="stu.username" placeholder="请填写学员真实姓名" :disabled='checkPhone'></van-field>
-        <van-field label="性别" name="sex" :disabled='checkPhone' @click="onCheckInsertPhone"
-          :rules="[{ required: true, message: '请选择性别' }]">
+        <van-field label="学员姓名" :rules="[{ validator, message }]" name="username" v-model="stu.username"
+          placeholder="请填写学员真实姓名"></van-field>
+        <van-field label="性别" name="sex" :rules="[{ required: true, message: '请选择性别' }]">
           <template #input>
-            <van-radio-group v-model="stu.sex" :disabled='checkPhone' checked-color="#9A64FF" direction="horizontal">
-              <van-tag size="large" type="primary" :color="!(stu.sex === 1) || checkPhone ? '#EAEAEA' : '#64A9FF'"
-                :text-color="!(stu.sex === 1) || checkPhone ? '#AAA' : '#FFF'" class="radioSection" round>
+            <van-radio-group v-model="stu.sex" checked-color="#9A64FF" direction="horizontal">
+              <van-tag size="large" type="primary" :color="!(stu.sex === 1) ? '#EAEAEA' : '#64A9FF'"
+                :text-color="!(stu.sex === 1) ? '#AAA' : '#FFF'" class="radioSection" round>
                 <van-radio class="radioItem" :name="1"></van-radio>男生
               </van-tag>
-              <van-tag size="large" type="primary" :color="!(stu.sex === 0)  || checkPhone? '#EAEAEA' : '#64A9FF'"
-                :text-color="!(stu.sex === 0)  || checkPhone? '#AAA' : '#FFF'" class="radioSection" round>
+              <van-tag size="large" type="primary" :color="!(stu.sex === 0) ? '#EAEAEA' : '#64A9FF'"
+                :text-color="!(stu.sex === 0) ? '#AAA' : '#FFF'" class="radioSection" round>
                 <van-radio class="radioItem" :name="0"></van-radio>女生
               </van-tag>
             </van-radio-group>
           </template>
         </van-field>
-        <van-field label="在读年级" :disabled='checkPhone' @click="onCheckInsertPhone" v-model="stu.currentGrade" readonly
-          name="currentGrade" :rules="[{ required: true, message: '请选择在读年级', trigger: 'onChange' }]"
-          @click="pickerChange" placeholder="请选择在读年级">
+        <van-field label="在读年级" v-model="stu.currentGrade" readonly name="currentGrade"
+          :rules="[{ required: true, message: '请选择在读年级', trigger: 'onChange' }]" @click="pickerChange"
+          placeholder="请选择在读年级">
           <template #right-icon>
             <van-icon name="arrow" :color="checkPhone ? '#aaa' : '#323233'" size="16"></van-icon>
           </template>
         </van-field>
-        <van-field label="所在班级" :disabled='checkPhone' @click="onCheckInsertPhone" v-model="stu.currentClass" readonly
-          name="currentClass" :rules="[{ required: true, message: '请选择所在班级', trigger: 'onChange' }]"
-          @click="pickerChange1" placeholder="请选择所在班级">
+        <van-field label="所在班级" v-model="stu.currentClass" readonly name="currentClass"
+          :rules="[{ required: true, message: '请选择所在班级', trigger: 'onChange' }]" @click="pickerChange1"
+          placeholder="请选择所在班级">
           <template #right-icon>
             <van-icon name="arrow" :color="checkPhone ? '#aaa' : '#323233'" size="16"></van-icon>
           </template>
@@ -225,50 +224,46 @@
       </van-cell-group>
 
       <van-cell-group inset class="cell-group">
-        <van-field label="选报声部" :disabled='checkPhone' @click="onCheckInsertPhone" v-model="stu.registerSubjectId"
-          readonly name="registerSubjectId" :rules="[{ required: true, message: '请选择选报声部', trigger: 'onChange' }]"
-          @click="pickerChange2" placeholder="请选择选报声部">
+        <van-field label="选报声部" v-model="stu.registerSubjectId" readonly name="registerSubjectId"
+          :rules="[{ required: true, message: '请选择选报声部', trigger: 'onChange' }]" @click="pickerChange2"
+          placeholder="请选择选报声部">
           <template #right-icon>
             <van-icon name="arrow" :color="checkPhone ? '#aaa' : '#323233'" size="16"></van-icon>
           </template>
         </van-field>
 
-        <van-field label="乐器准备方式" :disabled='checkPhone' @click="onCheckInsertPhone" name="instrumentsPrepareMode"
-          :rules="[{ required: true, message: '请选择乐器准备方式' }]">
+        <van-field label="乐器准备方式" name="instrumentsPrepareMode" :rules="[{ required: true, message: '请选择乐器准备方式' }]">
           <template #input>
-            <van-radio-group v-model="stu.instrumentsPrepareMode" :disabled='checkPhone' checked-color="#9A64FF"
-              direction="horizontal">
+            <van-radio-group v-model="stu.instrumentsPrepareMode" checked-color="#9A64FF" direction="horizontal">
               <van-tag size="large" type="primary"
-                :color="!(stu.instrumentsPrepareMode === 'GROUP_PURCHASE')  || checkPhone ? '#EAEAEA' : '#64A9FF'"
-                :text-color="!(stu.instrumentsPrepareMode === 'GROUP_PURCHASE') || checkPhone ? '#AAA' : '#FFF'"
-                class="radioSection" round>
+                :color="!(stu.instrumentsPrepareMode === 'GROUP_PURCHASE')  ? '#EAEAEA' : '#64A9FF'"
+                :text-color="!(stu.instrumentsPrepareMode === 'GROUP_PURCHASE') ? '#AAA' : '#FFF'" class="radioSection"
+                round>
                 <van-radio class="radioItem" name="GROUP_PURCHASE"></van-radio>团购
               </van-tag>
               <van-tag size="large" type="primary"
-                :color="!(stu.instrumentsPrepareMode === 'ONESELF') || checkPhone ? '#EAEAEA' : '#64A9FF'"
-                :text-color="!(stu.instrumentsPrepareMode === 'ONESELF') || checkPhone ? '#AAA' : '#FFF'"
-                class="radioSection" round>
+                :color="!(stu.instrumentsPrepareMode === 'ONESELF') ? '#EAEAEA' : '#64A9FF'"
+                :text-color="!(stu.instrumentsPrepareMode === 'ONESELF') ? '#AAA' : '#FFF'" class="radioSection" round>
                 <van-radio class="radioItem" name="ONESELF"></van-radio>自备
               </van-tag>
             </van-radio-group>
           </template>
         </van-field>
 
-        <van-field label="乐团学习系统准备方式" :disabled='checkPhone' @click="onCheckInsertPhone"
-          name="learningSystemPrepareMode" :rules="[{ required: true, message: '请选择乐团学习系统准备方式' }]">
+        <van-field label="乐团学习系统准备方式" name="learningSystemPrepareMode"
+          :rules="[{ required: true, message: '请选择乐团学习系统准备方式' }]">
           <template #input>
-            <van-radio-group v-model="stu.learningSystemPrepareMode" :disabled='checkPhone' checked-color="#9A64FF"
-              direction="horizontal">
+            <van-radio-group v-model="stu.learningSystemPrepareMode" checked-color="#9A64FF" direction="horizontal">
               <!-- :color="checkPhone ? '#ccc': '#9A64FF'" -->
               <van-tag size="large" type="primary"
-                :color="!(stu.learningSystemPrepareMode === 'GROUP_PURCHASE') || checkPhone ? '#EAEAEA' : '#64A9FF'"
-                :text-color="!(stu.learningSystemPrepareMode === 'GROUP_PURCHASE') || checkPhone ? '#AAA' : '#FFF'"
+                :color="!(stu.learningSystemPrepareMode === 'GROUP_PURCHASE') ? '#EAEAEA' : '#64A9FF'"
+                :text-color="!(stu.learningSystemPrepareMode === 'GROUP_PURCHASE') ? '#AAA' : '#FFF'"
                 class="radioSection" round>
                 <van-radio class="radioItem" name="GROUP_PURCHASE"></van-radio>团购
               </van-tag>
               <van-tag size="large" type="primary"
-                :color="!(stu.learningSystemPrepareMode === 'ONESELF') || checkPhone ? '#EAEAEA' : '#64A9FF'"
-                :text-color="!(stu.learningSystemPrepareMode === 'ONESELF') || checkPhone ? '#AAA' : '#FFF'"
+                :color="!(stu.learningSystemPrepareMode === 'ONESELF') ? '#EAEAEA' : '#64A9FF'"
+                :text-color="!(stu.learningSystemPrepareMode === 'ONESELF') ? '#AAA' : '#FFF'"
                 :color="checkPhone ? '#ccc': '#9A64FF'" class="radioSection" round>
                 <van-radio class="radioItem" name="ONESELF"></van-radio>自备
               </van-tag>
@@ -507,11 +502,6 @@
           }
           this.btnLoading = false
         },
-        onCheckInsertPhone() {
-          if (this.checkPhone) {
-            vant.showToast('请输入手机号码')
-          }
-        },
         setLoading(status) {
           if (status) {
             vant.showLoadingToast({

src/school/companion-teacher/companion-teacher-register.tsx

@@ -346,12 +346,6 @@ export default defineComponent({
       }
     }
 
-    const onCheckInsertPhone = () => {
-      if (state.checkPhone) {
-        showToast('请输入手机号码')
-      }
-    }
-
     return () => (
       <div class={styles.register}>
         <div class={styles.title}>
@@ -385,7 +379,6 @@ export default defineComponent({
               rules={[{ required: true, message: '请填写真实姓名' }]}
               name="realName"
               placeholder="请填写真实姓名"
-              onClick={onCheckInsertPhone}
               maxlength="5"
               disabled={state.checkPhone}
             ></Field>
@@ -393,7 +386,6 @@ export default defineComponent({
             <Field
               label="身份证号码"
               v-model={state.forms.idCardNo}
-              onClick={onCheckInsertPhone}
               rules={[
                 { required: true, message: '请输入身份证号' },
                 {
@@ -408,12 +400,7 @@ export default defineComponent({
               disabled={state.checkPhone}
             ></Field>
 
-            <Field
-              label="性别"
-              name="gender"
-              onClick={onCheckInsertPhone}
-              rules={[{ required: true, message: '请选择性别' }]}
-            >
+            <Field label="性别" name="gender" rules={[{ required: true, message: '请选择性别' }]}>
               {{
                 input: () => (
                   <RadioGroup
@@ -451,7 +438,6 @@ export default defineComponent({
               label="身份证照片正面"
               v-model={state.forms.idcardFrontImg}
               readonly
-              onClick={onCheckInsertPhone}
               name="idcardFrontImg"
               rules={[{ required: true, message: '请上传身份证正面', trigger: 'onChange' }]}
               placeholder="请上传身份证正面"
@@ -472,7 +458,6 @@ export default defineComponent({
               v-model={state.forms.idcardBackImg}
               readonly
               name="idcardBackImg"
-              onClick={onCheckInsertPhone}
               rules={[{ required: true, message: '请上传身份证反面', trigger: 'onChange' }]}
               placeholder="请上传身份证反面"
             >
@@ -495,7 +480,6 @@ export default defineComponent({
               disabled={state.checkPhone}
               name="educationBackground"
               onClick={() => {
-                onCheckInsertPhone()
                 if (state.checkPhone) return
                 state.showEducation = true
               }}
@@ -515,7 +499,6 @@ export default defineComponent({
               v-model={state.forms.graduateSchool}
               rules={[{ required: true, message: '请输入毕业学校' }]}
               name="graduateSchool"
-              onClick={onCheckInsertPhone}
               placeholder="请输入毕业学校"
             ></Field>
 
@@ -526,7 +509,6 @@ export default defineComponent({
               disabled={state.checkPhone}
               name="cityCodeName"
               onClick={() => {
-                onCheckInsertPhone()
                 if (state.checkPhone) return
                 state.showPicker = true
               }}
@@ -547,7 +529,6 @@ export default defineComponent({
               name="showSubjectIds"
               disabled={state.checkPhone}
               onClick={() => {
-                onCheckInsertPhone()
                 if (state.checkPhone) return
                 state.showSubject = true
               }}
@@ -594,7 +575,6 @@ export default defineComponent({
               rules={[{ required: true, message: '请输入验证码', trigger: 'onChange' }]}
               placeholder="请输入验证码"
               maxlength={6}
-              onClick={onCheckInsertPhone}
               disabled={state.checkPhone}
               type="tel"
             >

src/student/my-orchestra/apply-withdrawal.tsx

@@ -20,6 +20,7 @@ export default defineComponent({
     })
     const forms = reactive({
       status: false,
+      statusMember: false,
       reason: '',
       id: route.query.id,
       dataInfo: {} as any,
@@ -40,7 +41,22 @@ export default defineComponent({
         showToast('请输入退团原因')
         return
       }
-      forms.status = true
+
+      try {
+        const { data } = await request.post('/api-student/student/hasWaitActivateVipOrder', {
+          requestType: 'form',
+          data: {
+            orchestraId: forms.id
+          }
+        })
+        if (data) {
+          forms.statusMember = true
+        } else {
+          forms.status = true
+        }
+      } catch {
+        //
+      }
     }
 
     //
@@ -56,12 +72,7 @@ export default defineComponent({
         })
 
         forms.isClick = false
-        setTimeout(() => {
-          showToast('申请成功')
-        }, 100)
-        setTimeout(() => {
-          router.replace('/my-orchestra')
-        }, 1100)
+        router.replace('/my-orchestra')
       } catch {
         //
         forms.isClick = false
@@ -128,7 +139,18 @@ export default defineComponent({
           confirmButtonText="确定"
           cancelButtonText="取消"
           showCancelButton
-          onConfirm={() => onConfirm()}
+          onConfirm={onConfirm}
+        ></ODialog>
+
+        <ODialog
+          v-model:show={forms.statusMember}
+          title="提示"
+          message={'您有待激活的团练宝订单，是否继续退团？'}
+          messageAlign="left"
+          confirmButtonText="继续"
+          cancelButtonText="取消"
+          showCancelButton
+          onConfirm={onConfirm}
         ></ODialog>
       </div>
     )

src/views/unit-test/model/choice-question/index.module.less

@@ -18,6 +18,7 @@
     padding: 15px 12px;
     display: flex;
     align-items: center;
+    justify-content: space-between;
     font-size: 16px;
     font-weight: 500;
     color: #333333;
@@ -32,9 +33,22 @@
         }
       }
     }
+    .valueAudio {
+      width: 170px;
+    }
   }
   .active {
     background-color: #ffebdd;
     color: #f67146;
   }
+
+  .answerContent {
+    display: flex;
+    align-items: center;
+  }
+  .answerChoice {
+    font-size: 16px;
+    font-weight: 500;
+    line-height: 26px;
+  }
 }

src/views/unit-test/model/choice-question/index.tsx

@@ -3,6 +3,7 @@ import { computed, defineComponent, PropType, reactive } from 'vue'
 import { AnswerType, labelOptions, QuestionType } from '../../unit'
 import AnserTitle from '../anser-title'
 import AnswerAnalysis from '../answer-analysis'
+import UnitAudio from '../unit-audio'
 import styles from './index.module.less'
 
 // 单选题 - 多选题
@@ -108,15 +109,23 @@ export default defineComponent({
                 class={[styles.unitAnswer, item.checked && styles.active]}
                 onClick={() => onSelect(item)}
               >
-                <span class={styles.option}>{labelOptions[index + 1]}.</span>
-                {item.questionAnswerTypeCode === AnswerType.IMAGE && (
-                  <div class={styles.value}>
-                    <Image src={item.questionAnswer} />
-                  </div>
-                )}
-                {item.questionAnswerTypeCode === AnswerType.TXT && (
-                  <div class={styles.value}>{item.questionAnswer}</div>
-                )}
+                <div class={styles.answerContent}>
+                  <span class={styles.option}>{labelOptions[index + 1]}.</span>
+                  {item.questionAnswerTypeCode === AnswerType.IMAGE && (
+                    <div class={styles.value}>
+                      <Image src={item.questionAnswer} />
+                    </div>
+                  )}
+                  {item.questionAnswerTypeCode === AnswerType.TXT && (
+                    <div class={styles.value}>{item.questionAnswer}</div>
+                  )}
+                  {item.questionAnswerTypeCode === AnswerType.AUDIO && (
+                    <div class={styles.value}>
+                      <UnitAudio src={item.questionAnswer} class={styles.valueAudio} />
+                    </div>
+                  )}
+                </div>
+                {props.showRate && <div class={styles.answerChoice}>{item.selectRate}%人选择</div>}
               </div>
             ))}
           </div>

src/views/unit-test/model/play-question/index.tsx

@@ -154,7 +154,13 @@ export default defineComponent({
                   icon: () => <Image class={styles.img} src={iconSong} />,
                   title: () => <>{questionExtendsInfo.value.musicName}</>,
                   value: () => (
-                    <Button round class={styles.playBtn} type="primary" onClick={onEvaluation}>
+                    <Button
+                      round
+                      class={styles.playBtn}
+                      type="primary"
+                      onClick={onEvaluation}
+                      disabled={props.readOnly}
+                    >
                       点击评测
                       <Icon name="play" />
                     </Button>
@@ -163,11 +169,13 @@ export default defineComponent({
               </Cell>
             )}
 
-            <div class={['van-hairline--top', styles.unitScoreNum]}>
-              <div class={styles.score}>{state.score}</div>
-              <div class={styles.scoreTitle}>评测分数</div>
-              <div class={styles.scoreTips}>多次评测取完整评测的最高分数</div>
-            </div>
+            {!props.readOnly && (
+              <div class={['van-hairline--top', styles.unitScoreNum]}>
+                <div class={styles.score}>{state.score}</div>
+                <div class={styles.scoreTitle}>评测分数</div>
+                <div class={styles.scoreTips}>多次评测取完整评测的最高分数</div>
+              </div>
+            )}
           </div>
         </div>
         {props.showAnalysis && (

src/views/unit-test/model/unit-audio/index.module.less

@@ -0,0 +1,41 @@
+.unitAudio {
+  position: relative;
+  display: flex;
+}
+
+.nativeAudio {
+  width: 100%;
+  height: 40px;
+}
+
+.htmlAudio {
+  // position: absolute;
+  width: 100%;
+  height: 40px;
+  box-sizing: border-box;
+  background: #ff8057;
+  border-radius: 20px;
+  padding: 0 12px;
+  z-index: 9;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  color: #fff;
+  .htmlTimes {
+    display: flex;
+    align-items: center;
+    color: #fff;
+    font-size: 16px;
+    font-weight: 500;
+    color: #ffffff;
+    line-height: 22px;
+  }
+  .iconAudio {
+    margin-right: 6px;
+    font-size: 18px;
+  }
+
+  .audioStatus {
+    font-size: 18px;
+  }
+}

src/views/unit-test/model/unit-audio/index.tsx

@@ -0,0 +1,80 @@
+import { Icon } from 'vant'
+import { defineComponent, reactive } from 'vue'
+import styles from './index.module.less'
+import { Howl } from 'howler'
+import iconAudio from './images/icon-audio.png'
+import { eventUnit } from '../../unit'
+
+// 音频播放
+export default defineComponent({
+  name: 'unit-audio',
+  props: {
+    src: {
+      type: String,
+      default: ''
+    }
+  },
+  setup(props) {
+    const state = reactive({
+      audioStatus: 'stopped',
+      duration: 0
+    })
+    // https://github.com/Tonejs/Tone.js/issues/784 部分ios上可能存在问题
+    const htick: any = new Howl({
+      src: props.src,
+      format: ['mp3']
+      // sprite: {
+      //   blast: [0, 3000],
+      //   laser: [4000, 1000],
+      //   winner: [6000, 5000]
+      // }
+    })
+    console.log(htick)
+
+    htick.on('load', (val) => {
+      console.log('111')
+      console.log(htick.duration())
+      state.duration = Math.ceil(htick.duration())
+    })
+    // 播放结束
+    htick.on('end', () => {
+      console.log('1')
+    })
+
+    eventUnit.on('unitAudioStop', () => {
+      htick.stop()
+      state.audioStatus = 'stopped'
+    })
+
+    return () => (
+      <div class={styles.unitAudio}>
+        <div class={styles.htmlAudio}>
+          <div class={styles.htmlTimes}>
+            <Icon class={styles.iconAudio} name={iconAudio} />
+            <span>{state.duration}"</span>
+          </div>
+
+          {/* pause-circle */}
+          <Icon
+            name={state.audioStatus === 'stopped' ? 'play-circle' : 'pause-circle'}
+            class={styles.audioStatus}
+            onClick={() => {
+              if (state.audioStatus === 'stopped') {
+                eventUnit.emit('unitAudioStop')
+                htick.play()
+                state.audioStatus = 'paused'
+              } else if (state.audioStatus === 'paused') {
+                htick.pause()
+                state.audioStatus = 'stopped'
+              }
+            }}
+          />
+        </div>
+        {/* <audio controls class={styles.nativeAudio} id={state.id}>
+          <source src={props.src} type="audio/mpeg" />
+          您的浏览器不支持该音频格式。
+        </audio> */}
+      </div>
+    )
+  }
+})

src/views/unit-test/unit-detail/index.tsx

@@ -223,39 +223,10 @@ export default defineComponent({
             resizeSwipeItemHeight()
           }}
         >
-          {state.questionList.map((item: any, index: number) => (
-            // item.questionTypeCode === QuestionType.CHECKBOX && (
-            //   <SwipeItem>
-            //     <ChoiceQuestion
-            //       v-model:value={item.userAnswer}
-            //       index={index + 1}
-            //       data={item}
-            //       readOnly
-            //       type="radio"
-            //       showAnalysis
-            //       analysis={{
-            //         message: item.answerAnalysis,
-            //         topic: true, // 是否显示结果
-            //         userResult: formatUserResult(item.id) // 用户答题对错
-            //       }}
-            //     />
-            //   </SwipeItem>
-            // )
-            <SwipeItem>
-              <div class="swipe-item-question">
-                {item.questionTypeCode === QuestionType.RADIO && (
-                  <ChoiceQuestion
-                    v-model:value={item.userAnswer}
-                    index={index + 1}
-                    data={item}
-                    readOnly
-                    type="radio"
-                    showRate={item.showRate}
-                    showAnalysis={item.showAnalysis}
-                    analysis={item.analysis}
-                  />
-                )}
-                {item.questionTypeCode === QuestionType.CHECKBOX && (
+          {state.questionList.map(
+            (item: any, index: number) =>
+              item.questionTypeCode === QuestionType.CHECKBOX && (
+                <SwipeItem>
                   <ChoiceQuestion
                     v-model:value={item.userAnswer}
                     index={index + 1}
@@ -266,44 +237,71 @@ export default defineComponent({
                     showAnalysis={item.showAnalysis}
                     analysis={item.analysis}
                   />
-                )}
-                {item.questionTypeCode === QuestionType.SORT && (
-                  <DragQuestion
-                    readOnly
-                    v-model:value={item.userAnswer}
-                    data={item}
-                    index={index + 1}
-                    showRate={item.showRate}
-                    showAnalysis={item.showAnalysis}
-                    analysis={item.analysis}
-                  />
-                )}
-                {item.questionTypeCode === QuestionType.LINK && (
-                  <KeepLookQuestion
-                    readOnly
-                    v-model:value={item.userAnswer}
-                    data={item}
-                    index={index + 1}
-                    showRate={item.showRate}
-                    showAnalysis={item.showAnalysis}
-                    analysis={item.analysis}
-                  />
-                )}
-                {item.questionTypeCode === QuestionType.PLAY && (
-                  <PlayQuestion
-                    readOnly
-                    v-model:value={item.userAnswer}
-                    data={item}
-                    index={index + 1}
-                    unitId={state.id as any}
-                    showRate={item.showRate}
-                    showAnalysis={item.showAnalysis}
-                    analysis={item.analysis}
-                  />
-                )}
-              </div>
-            </SwipeItem>
-          ))}
+                </SwipeItem>
+              )
+            // <SwipeItem>
+            //   <div class="swipe-item-question">
+            //     {item.questionTypeCode === QuestionType.RADIO && (
+            //       <ChoiceQuestion
+            //         v-model:value={item.userAnswer}
+            //         index={index + 1}
+            //         data={item}
+            //         readOnly
+            //         type="radio"
+            //         showRate={item.showRate}
+            //         showAnalysis={item.showAnalysis}
+            //         analysis={item.analysis}
+            //       />
+            //     )}
+            //     {item.questionTypeCode === QuestionType.CHECKBOX && (
+            //       <ChoiceQuestion
+            //         v-model:value={item.userAnswer}
+            //         index={index + 1}
+            //         data={item}
+            //         readOnly
+            //         type="checkbox"
+            //         showRate={item.showRate}
+            //         showAnalysis={item.showAnalysis}
+            //         analysis={item.analysis}
+            //       />
+            //     )}
+            //     {item.questionTypeCode === QuestionType.SORT && (
+            //       <DragQuestion
+            //         readOnly
+            //         v-model:value={item.userAnswer}
+            //         data={item}
+            //         index={index + 1}
+            //         showRate={item.showRate}
+            //         showAnalysis={item.showAnalysis}
+            //         analysis={item.analysis}
+            //       />
+            //     )}
+            //     {item.questionTypeCode === QuestionType.LINK && (
+            //       <KeepLookQuestion
+            //         readOnly
+            //         v-model:value={item.userAnswer}
+            //         data={item}
+            //         index={index + 1}
+            //         showRate={item.showRate}
+            //         showAnalysis={item.showAnalysis}
+            //         analysis={item.analysis}
+            //       />
+            //     )}
+            //     {item.questionTypeCode === QuestionType.PLAY && (
+            //       <PlayQuestion
+            //         readOnly
+            //         v-model:value={item.userAnswer}
+            //         data={item}
+            //         index={index + 1}
+            //         unitId={state.id as any}
+            //         showRate={item.showRate}
+            //         showAnalysis={item.showAnalysis}
+            //         analysis={item.analysis}
+            //       />
+            //     )}
+            //   </div>
+            // </SwipeItem>
+          )}
         </Swipe>
 
         <OSticky position="bottom" background="white">

src/views/unit-test/unit.ts

@@ -1,3 +1,8 @@
+import EventEmitter from "eventemitter3"
+
+export const eventUnit = new EventEmitter()
+
+
 export const labelOptions = {
   1: 'A',
   2: 'B',
@@ -30,5 +35,5 @@ export const QuestionTypeName = {
 export const AnswerType = {
   IMAGE: 'IMAGE',
   TXT: 'TXT',
-  RADIO: 'RADIO',
+  AUDIO: 'AUDIO',
 }