Update index.tsx

src/views/tenantTeacherRejest/index.tsx

@@ -1,6 +1,21 @@
 import ColHeader from '@/components/col-header'
 import ColSearch from '@/components/col-search'
-import { Sticky, Image, List, Popup, Icon, Area, Field, Form, CellGroup, Button, Toast, Picker, DatetimePicker, Overlay } from 'vant'
+import {
+  Sticky,
+  Image,
+  List,
+  Popup,
+  Icon,
+  Area,
+  Field,
+  Form,
+  CellGroup,
+  Button,
+  Toast,
+  Picker,
+  DatetimePicker,
+  Overlay
+} from 'vant'
 import { defineComponent, onMounted, reactive } from 'vue'
 import styles from './index.module.less'
 import bg from './images/teacherBg.png'
@@ -19,7 +34,7 @@ import dayjs from 'dayjs'
 export default defineComponent({
   name: 'tenantStudentRejest',
   setup() {
-    const route = useRoute();
+    const route = useRoute()
     const forms = reactive({
       idCardNo: '',
       username: '',
@@ -29,7 +44,7 @@ export default defineComponent({
       tenantId: route.query.tenantId,
       birthdate: '',
       code: ''
-    });
+    })
 
     const data = reactive({
       schoolName: route.query.name || '',
@@ -48,7 +63,7 @@ export default defineComponent({
       // selectedSubjectList: [] as any,
       choiceSubjectIds: [] as any,
       choiceSubjectNames: [] as any
-    });
+    })
     const handleSubmit = async () => {
       console.log(forms, 'forms')
       if (!forms.username) {
@@ -70,7 +85,9 @@ export default defineComponent({
         Toast('请选择声部')
       }
       try {
-        const res = await request.post('/api-tenant/open/teacher/submit', { data: { ...forms, subjectId: data.choiceSubjectIds.join(',') } })
+        const res = await request.post('/api-tenant/open/teacher/submit', {
+          data: { ...forms, subjectId: data.choiceSubjectIds.join(',') }
+        })
         data.showSuccess = true
       } catch (e) {
         console.log(e)
@@ -78,12 +95,12 @@ export default defineComponent({
     }
     const getSubjectList = async () => {
       try {
-        const res = await request.get('/api-tenant/open/subject/queryPage', { data: { page: 1, rows: 9999 } })
+        const res = await request.get('/api-tenant/open/subject/queryPage', {
+          data: { page: 1, rows: 9999 }
+        })
         // const res = await request.post('/api-tenant/open/subject/queryPageTree', { data: { page: 1, rows: 9999 } })
         data.subjectList = res.data.rows || []
 
-
-
         /**
          * .map((item: any) => {
           return {
@@ -106,23 +123,20 @@ export default defineComponent({
       data.dateState = false
     }
 
-
     onMounted(() => {
-      console.log(
-        route.query
-      )
+      console.log(route.query)
       getSubjectList()
     })
 
     /** 发送验证码 */
     const onSendSms = async () => {
       if (!forms.phone) {
-        Toast('请输入手机号码');
-        return;
+        Toast('请输入手机号码')
+        return
       }
       if (!/^1[3456789]\d{9}$/.test(forms.phone)) {
-        Toast('手机号码格式不正确');
-        return;
+        Toast('手机号码格式不正确')
+        return
       }
       await request.post('/api-student/code/sendSmsCode', {
         requestType: 'form',
@@ -135,19 +149,18 @@ export default defineComponent({
       setTimeout(() => {
         Toast('验证码已发送')
       }, 100)
-    };
+    }
     const onCountDown = () => {
       data.sendMsg = '60s'
-      let count = 60;
+      let count = 60
       const timer = setInterval(() => {
-        count--;
+        count--
         data.sendMsg = `${count}s`
         if (count <= 0) {
           data.sendMsg = '获取验证码'
-          clearInterval(timer);
+          clearInterval(timer)
         }
-      }, 1000);
-
+      }, 1000)
     }
 
     const downApp = () => {
@@ -156,7 +169,6 @@ export default defineComponent({
     }
 
     const onChoice = (val: any) => {
-
       data.searchStatus = false
       data.choiceSubjectIds = [...val]
       const chioseSound = [] as any
@@ -169,129 +181,134 @@ export default defineComponent({
       // data.choiceSubjectNames =
     }
 
-    return () =>
-      <>< div class={styles.videoClass} >
-        <ColHeader
-          class={styles.classHeader}
-          border={false}
-          isFixed={false}
-          background="#fff"
-        />
-        <div class={styles.resjetStudentWrap}>
-          <img src={rejectLogo} class={styles.rejectLogo} alt="" />
-          <img src={studentText} class={styles.studentText} alt="" />
-          <img src={bg} class={styles.bgWrap} alt="" />
-          <div class={styles.schoolNameWrap}>
-            <img src={rejectSchool} class={styles.rejectSchool} alt="" />
-            <p>{data.schoolName}</p>
-
-          </div>
-          <img class={styles.centerLogo} src={centerLogo} alt="" />
-          <div class={styles.infoWrap}>
-            <div class={styles.infoWrapCore}>
-              <img src={subTitle} class={styles.subTitle} alt="" />
-
-              <Form onSubmit={() => handleSubmit()}>
-                <CellGroup class={styles.group} border={false}>
-                  <Field
-                    class={styles.noArrow}
-                    inputAlign="right"
-                    label="老师昵称"
-                    placeholder="请输入老师昵称"
-                    maxlength={20}
-                    v-model={forms.username}
-
-                  // onUpdate: modelValue={(val: string) => {
-                  //   forms.nickname = val.trim();
-                  // }}
-                  />
-
-                  <Field
-                    inputAlign="right"
-                    label="手机号"
-                    class={styles.noArrow}
-                    maxlength={11}
-                    placeholder="请输入手机号码"
-                    v-model={forms.phone}
-                  />
-                  <div class={styles.tips}>
-                    手机号码为酷乐秀学院登录账号
-                  </div>
+    return () => (
+      <>
+        <div class={styles.videoClass}>
+          <ColHeader
+            class={styles.classHeader}
+            border={false}
+            isFixed={false}
+            background="#fff"
+          />
+          <div class={styles.resjetStudentWrap}>
+            <img src={rejectLogo} class={styles.rejectLogo} alt="" />
+            <img src={studentText} class={styles.studentText} alt="" />
+            <img src={bg} class={styles.bgWrap} alt="" />
+            <div class={styles.schoolNameWrap}>
+              <img src={rejectSchool} class={styles.rejectSchool} alt="" />
+              <p>{data.schoolName}</p>
+            </div>
+            <img class={styles.centerLogo} src={centerLogo} alt="" />
+            <div class={styles.infoWrap}>
+              <div class={styles.infoWrapCore}>
+                <img src={subTitle} class={styles.subTitle} alt="" />
 
-                  <Field
-                    class={styles.inputCode}
-                    inputAlign="left"
-                    label="请输入验证码"
-                    labelWidth={0}
-                    v-model={forms.code}
-                    maxlength={6}>
-                    {{
-                      button: () => (
-                        <Button
+                <Form onSubmit={() => handleSubmit()}>
+                  <CellGroup class={styles.group} border={false}>
+                    <Field
+                      class={styles.noArrow}
+                      inputAlign="right"
+                      label="老师昵称"
+                      placeholder="请输入老师昵称"
+                      maxlength={20}
+                      v-model={forms.username}
 
-                          disabled={data.sendMsg.includes('s')}
-                          class={styles.sendBtn}
-                          onClick={() => onSendSms()}>
-                          {data.sendMsg}
-                        </Button>
-                      )
-                    }}
-                  </Field>
-                  <Field
-                    class={styles.noArrow}
-                    inputAlign="right"
-                    label="真实姓名"
-                    placeholder="请输入真实姓名"
-                    maxlength={20}
-                    v-model={forms.realName}
+                      // onUpdate: modelValue={(val: string) => {
+                      //   forms.nickname = val.trim();
+                      // }}
+                    />
 
-                  // onUpdate: modelValue={(val: string) => {
-                  //   forms.nickname = val.trim();
-                  // }}
-                  />
-                  <Field
-                    class={styles.noArrow}
-                    inputAlign="right"
-                    label="身份证号"
-                    placeholder="请输入身份证号"
-                    maxlength={20}
-                    v-model={forms.idCardNo}
+                    <Field
+                      inputAlign="right"
+                      label="手机号"
+                      class={styles.noArrow}
+                      maxlength={11}
+                      placeholder="请输入手机号码"
+                      v-model={forms.phone}
+                    />
+                    <div class={styles.tips}>手机号码为酷乐秀学院登录账号</div>
 
-                  // onUpdate: modelValue={(val: string) => {
-                  //   forms.nickname = val.trim();
-                  // }}
-                  />
+                    <Field
+                      class={styles.inputCode}
+                      inputAlign="left"
+                      label="请输入验证码"
+                      labelWidth={0}
+                      v-model={forms.code}
+                      maxlength={6}
+                    >
+                      {{
+                        button: () => (
+                          <Button
+                            disabled={data.sendMsg.includes('s')}
+                            class={styles.sendBtn}
+                            onClick={() => onSendSms()}
+                          >
+                            {data.sendMsg}
+                          </Button>
+                        )
+                      }}
+                    </Field>
+                    <Field
+                      class={styles.noArrow}
+                      inputAlign="right"
+                      label="真实姓名"
+                      placeholder="请输入真实姓名"
+                      maxlength={20}
+                      v-model={forms.realName}
 
+                      // onUpdate: modelValue={(val: string) => {
+                      //   forms.nickname = val.trim();
+                      // }}
+                    />
+                    <Field
+                      class={styles.noArrow}
+                      inputAlign="right"
+                      label="身份证号"
+                      placeholder="请输入身份证号"
+                      maxlength={20}
+                      v-model={forms.idCardNo}
 
-                  <Field
-                    border={false}
-                    inputAlign="right"
-                    label="声部"
-                    placeholder="请选择声部"
-                    readonly
-                    v-model={data.choiceSubjectNames}
-                    onClick={() => (data.searchStatus = true)}>
-                    {{
-                      button: () => (
-                        <img
-                          style={{
-                            display: 'block',
-                            width: '12px',
-                            height: '12px',
+                      // onUpdate: modelValue={(val: string) => {
+                      //   forms.nickname = val.trim();
+                      // }}
+                    />
 
-                          }}
-                          src={icon_arrow}
-                        />
-                      )
-                    }}
-                  </Field>
-                </CellGroup>
-              </Form>
+                    <Field
+                      border={false}
+                      inputAlign="right"
+                      label="声部"
+                      placeholder="请选择声部"
+                      readonly
+                      v-model={data.choiceSubjectNames}
+                      onClick={() => (data.searchStatus = true)}
+                    >
+                      {{
+                        button: () => (
+                          <img
+                            style={{
+                              display: 'block',
+                              width: '12px',
+                              height: '12px'
+                            }}
+                            src={icon_arrow}
+                          />
+                        )
+                      }}
+                    </Field>
+                  </CellGroup>
+                </Form>
+              </div>
+              <img
+                src={rejectBtn}
+                onClick={() => {
+                  handleSubmit()
+                }}
+                class={styles.rejectBtn}
+                alt=""
+              />
             </div>
-            <img src={rejectBtn} onClick={() => { handleSubmit() }} class={styles.rejectBtn} alt="" />
           </div>
-        </div>
-        {/* <Popup
+          {/* <Popup
           show={data.searchStatus}
           position="bottom"
           round
@@ -303,39 +320,39 @@ export default defineComponent({
           <Picker columns={data.subjectList} onCancel={() => { data.searchStatus = false }} onConfirm={confirmSubject}></Picker>
         </Popup> */}
 
-
-        <Popup
-          show={data.searchStatus}
-          round
-          closeable
-          position="bottom"
-          style={{ height: '60%' }}
-          teleport="body"
-          onUpdate: show={val => (data.searchStatus = val)}
-        >
-          <SubjectModel
-            subjectList={data.subjectList}
-            choiceSubjectIds={data.choiceSubjectIds}
-            onChoice={onChoice}
-            single={true}
-            selectType="Checkbox"
-          />
-        </Popup>
-      </div >
+          <Popup
+            show={data.searchStatus}
+            round
+            closeable
+            position="bottom"
+            style={{ height: '60%' }}
+            teleport="body"
+            onUpdate:show={val => (data.searchStatus = val)}
+          >
+            <SubjectModel
+              subjectList={data.subjectList}
+              choiceSubjectIds={data.choiceSubjectIds}
+              onChoice={onChoice}
+              single={true}
+              selectType="Checkbox"
+            />
+          </Popup>
+        </div>
 
         <Overlay show={data.showSuccess} z-index={1000}>
           <div class={styles.showWrap}>
             <img class={styles.showWrapTop} src={teacherSuccess} alt="" />
             <h2>恭喜您已成功登记为</h2>
-            <h4>{data.schoolName} <span>【音乐老师】</span> </h4>
+            <h4>
+              {data.schoolName} <span>【音乐老师】</span>{' '}
+            </h4>
             <p>请下载酷乐秀机构版APP进行学习</p>
-            <div class={styles.downApp} onClick={downApp}>立即下载</div>
+            <div class={styles.downApp} onClick={downApp}>
+              立即下载
+            </div>
           </div>
         </Overlay>
-
-
       </>
-
+    )
   }
-
 })