Browse Source

添加文件

lex-xin 3 năm trước cách đây
mục cha
commit
949555fa2a

BIN
src/common/images/icon_uploader.png


+ 14 - 2
src/components/col-field/index.module.less

@@ -1,5 +1,5 @@
 .formTitle {
-  font-size: 17px;
+  font-size: 16px;
   color: #000;
   // line-height: 24px;
   // &::before {
@@ -11,12 +11,24 @@
   align-items: center;
   justify-content: space-between;
   .col-left {
-    i {
+    display: flex;
+    align-items: center;
+    :global {
+      .van-icon {
+        margin-right: 5px;
+      }
+    }
+    .required {
       font-style: normal;
       color: #FF4E19;
       font-size: 17px;
     }
   }
+
+  .col-icon {
+    display: flex;
+    align-items: center;
+  }
 }
 
 .col-field {

+ 12 - 4
src/components/col-field/index.tsx

@@ -1,9 +1,9 @@
-import { Button, Col, Row } from "vant";
+import { Button, Col, Icon, Row } from "vant";
 import { defineComponent } from "vue";
 import styles from './index.module.less';
 
 export default defineComponent({
-  name: 'input',
+  name: 'col-field',
   props: {
     required: {
       type: Boolean,
@@ -16,15 +16,23 @@ export default defineComponent({
     border: {
       type: Boolean,
       default: true
+    },
+    iconName: {
+      type: String
     }
   },
   render() {
     return (
       <Row class={styles['col-field']}>
         <Col span={24} class={styles.formTitle}>
-          <div class={styles['col-left']}>{this.required ? <i>*</i> : null}{this.title}</div>
+          <div class={styles['col-left']}>
+            <div class={styles['col-icon']}>
+              {this.$slots.icon ? this.$slots.icon() : this.iconName ? <Icon name={this.iconName} size="24" /> : null}
+            </div>
+            {this.required ? <i class={styles.required}>*</i> : null}{this.title}
+          </div>
           <div class={styles['col-right']}>
-            {this.$slots.titleRight && this.$slots.titleRight()}
+            {this.$slots.right && this.$slots.right()}
           </div>
         </Col>
         <Col span={24} class={this.border ? 'van-hairline--bottom' : null}>

+ 0 - 0
src/components/col-popup/index.module.less


+ 71 - 0
src/components/col-popup/index.tsx

@@ -0,0 +1,71 @@
+import { Popup } from "vant";
+import { defineComponent } from "vue";
+
+export default defineComponent({
+  name: 'col-popup',
+  props: {
+    popupStatus: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      popupShow: false,
+    }
+  },
+  watch: {
+    popupStatus(val) {
+      // if(val) {
+        this.onPopupClose(val)
+      // }
+    }
+  },
+  mounted() {
+    window.addEventListener('hashchange', this.onHash, false)
+  },
+  unmounted() {
+    window.removeEventListener('hashchange', this.onHash, false)
+  },
+  methods: {
+    onHash() {
+      this.$emit("update:popupStatus", false);
+      this.popupShow = false;
+      this.hashState();
+    },
+    onPopupClose(val: boolean) {
+      this.$emit("update:popupStatus", val);
+      this.popupShow = val;
+
+      this.hashState();
+    },
+    hashState() {
+      // 打开弹窗
+      if (this.popupShow) {
+        const route = this.$route
+        let times = 0;
+        for (let i in route.query) {
+          times += 1
+        }
+        const origin = window.location.href
+        const url = times > 0 ? '&cPop=' + (+new Date()) : '?cPop=' + (+new Date())
+        history.pushState("", "", `${origin}${url}`)
+      } else {
+        const route = this.$route
+        if(route.query.cPop) {
+          window.history.go(-1)
+        }
+      }
+      if (this.$refs.protocolPopup) {
+        (this.$refs.protocolPopup as any).scrollTop = 0
+      }
+    }
+  },
+  render() {
+    return (
+      <Popup ref="protocolPopup" show={this.popupShow} position="bottom" style={{ height: '100%' }}>
+        {this.$slots.default && this.$slots.default()}
+      </Popup>
+    )
+  }
+})

+ 51 - 0
src/components/col-upload/index.module.less

@@ -0,0 +1,51 @@
+.uploader-section {
+  padding: 10px 0;
+  :global {
+    .van-uploader {
+      width: 100%;
+    }
+    .van-uploader__wrapper {
+      display: block;
+    }
+  }
+  .uploader {
+    // width: 300px;
+    height: 145px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+    border-radius: 10px;
+    border: 1px dashed #ccc;
+    .uploaderText {
+      font-size: 14px;
+      color: #999999;
+      margin-top: 14px;
+    }
+  }
+
+  .img-section {
+    position: relative;
+    .img-close {
+      position: absolute;
+      top: 10px;
+      right: 10px;
+      z-index: 99;
+      font-size: 16px;
+      background-color: #333;
+      color: #fff;
+      width: 22px;
+      height: 22px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      border-radius: 50%;
+    }
+  }
+  .uploadImg {
+    width: 100%;
+    height: 145px;
+    border-radius: 10px;
+    overflow: hidden;
+  }
+}

+ 74 - 0
src/components/col-upload/index.tsx

@@ -0,0 +1,74 @@
+import { Icon, Image, Toast, Uploader } from "vant";
+import { defineComponent } from "vue";
+import styles from "./index.module.less";
+
+import iconUploader from '@common/images/icon_uploader.png';
+import request from "@/helpers/request";
+
+export default defineComponent({
+  name: 'col-upload',
+  props: {
+    value: String,
+    tips: {
+      type: String,
+      default: '点击上传'
+    },
+    deletable: {
+      type: Boolean,
+      default: true
+    }
+  },
+  mounted() {
+    // console.log(this.value, 'uploader');
+  },
+  methods: {
+    beforeRead(file: any) {
+      const isLt2M = file.size / 1024 / 1024 < 5
+      if (!isLt2M) {
+          Toast('上传文件大小不能超过 5MB')
+          return false
+      }
+      return true
+    },
+    beforeDelete(file: any, detail: { index: any; }) {
+        // this.dataModel.splice(detail.index, 1)
+        return true
+    },
+    async afterRead(file: any, detail: any) {
+      try {
+        file.status = 'uploading';
+        file.message = '上传中...';
+        let formData = new FormData();
+        formData.append('file', file.file);
+        let res = await request.post('/api-web/uploadFile', {
+          data: formData
+        })
+        this.$emit('update:value', res.data.url);
+      } catch (error) {
+        //
+      }
+    },
+    onClose(e: any) {
+      this.$emit('update:value', null);
+      e.stopPropagation();
+    },
+  },
+  render() {
+    return (
+      <div class={styles['uploader-section']}>
+        {/* @ts-ignore */}
+        <Uploader afterRead={this.afterRead} beforeRead={this.beforeRead} beforeDelete={this.beforeDelete}
+          v-slots={{
+            default: () => (this.value ? <div class={styles['img-section']} onClick={this.onClose}>
+              { this.deletable ? <Icon name="cross" class={styles["img-close"]} /> : null }
+              <Image fit="cover" class={styles.uploadImg} src={this.value} />
+            </div> : <div class={styles.uploader}>
+            <Icon name={iconUploader} size="32" />
+            <p class={styles.uploaderText}>{this.tips}</p>
+          </div> )
+          }}
+        />
+      </div>
+    )
+  }
+})

+ 1 - 1
src/helpers/utils.ts

@@ -74,7 +74,7 @@ export const openLoading = () => {
  * 关闭加载
  */
 export const closeLoading = () => {
-  console.log(helpState.loadingCount, +new Date());
+  // console.log(helpState.loadingCount, +new Date());
   if (helpState.loadingCount <= 0) return;
   setTimeout(() => {
     helpState.loadingCount--;

+ 4 - 4
src/teacher/layout/login.tsx

@@ -57,15 +57,15 @@ export default defineComponent({
             data: {
               username: this.username,
               password: this.password,
-              clientId: 'student',
-              clientSecret: 'student'
+              clientId: 'teacher',
+              clientSecret: 'teacher'
             }
           });
         } else {
           res = await request.post('/api-auth/smsLogin', {
             data: {
-              clientId: 'student',
-              clientSecret: 'student',
+              clientId: 'teacher',
+              clientSecret: 'teacher',
               phone: this.username,
               smsCode: this.smsCode,
               channel: 'H5'

+ 44 - 0
src/teacher/teacher-cert/cert-info.module.less

@@ -0,0 +1,44 @@
+.cert-info {
+  background-color: #fff;
+  padding: 12px;
+  min-height: 100vh;
+  position: relative;
+  padding-bottom: 75px;
+
+  h2 {
+    font-size: 18px;
+  }
+
+  h3 {
+    font-size: 16px;
+  }
+
+  h2, h3 {
+    padding: 8px 0;
+    font-weight: 600;
+    color: black;
+    line-height: 1.5;
+  }
+
+  .cert-text {
+    font-size: 13px;
+    line-height: 1.3;
+    padding-bottom: 12px;
+  }
+
+  .cert-img {
+    border-radius: 5px;
+    overflow: hidden;
+    line-height: 0;
+    margin-bottom: 8px;
+  }
+
+  .btn-group {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    padding: 12px;
+    background-color: #fff;
+  }
+}

+ 64 - 0
src/teacher/teacher-cert/cert-info.tsx

@@ -0,0 +1,64 @@
+import { Button, Image } from "vant";
+import { defineComponent, Transition } from "vue";
+import styles from './cert-info.module.less';
+import { teacherState } from "./teacherState";
+
+export default defineComponent({
+  name: 'cert-info',
+  methods: {
+    onClick() {
+      teacherState.authStatus = true
+    }
+  },
+  render() {
+    return (
+      <div class={styles['cert-info']}>
+        <h2>认证酷乐秀老师能为您带来什么?</h2>
+        <p class={styles['cert-text']}>
+            酷乐秀是一款为器乐学习者提供智能陪练及线上授课撮合的乐器教学平台,器乐老师可通过自身的专业知识位自己带来授课及曲谱销售收益。
+          </p>
+          <p class={styles['cert-img']}>
+            <Image src="https://daya.ks3-cn-beijing.ksyun.com/202110/Sn76BUQ.png" width="100%" height="150px" fit="cover" />
+          </p>
+
+        <h3>线上授课</h3>
+        <p class={styles['cert-text']}>
+          认证成为酷乐秀老师后,可设置您的空闲时间为平台中的求学者进行1对1的线上课程指导。
+        </p>
+        <p class={styles['cert-img']}>
+          <Image src="https://daya.ks3-cn-beijing.ksyun.com/202110/Sn76BUQ.png" width="100%" height="150px" fit="cover" />
+        </p>
+
+        <h3>个人风采展示</h3>
+        <p class={styles['cert-text']}>
+        可发布自己的专业经历、获奖记录及音视频资料对求学者展示,让学员更加深入的了解您的专业技能,从而提高约课率。
+        </p>
+        <p class={styles['cert-img']}>
+          <Image src="https://daya.ks3-cn-beijing.ksyun.com/202110/Sn76BUQ.png" width="100%" height="150px" fit="cover" />
+        </p>
+
+        <h3>曲谱上传</h3>
+        <p class={styles['cert-text']}>
+        可上传您制作的MIDI乐谱为求学者提供学习曲目的途径,并从中获得收益。
+        </p>
+        <p class={styles['cert-img']}>
+          <Image src="https://daya.ks3-cn-beijing.ksyun.com/202110/Sn76BUQ.png" width="100%" height="150px" fit="cover" />
+        </p>
+
+        <h3>收益提现</h3>
+        <p class={styles['cert-text']}>
+        在您授课及上传曲谱销售后,经过平台核算,将您获得的收益发放至您的个人账户下,您可随时将自己获得的收益提现。
+        </p>
+
+        <h2>酷乐秀欢迎您的加入!</h2>
+        <p class={styles['cert-text']}>
+        在艺术的殿堂中,为他人照亮前进的道路,用自己的经验和点拨,传播艺术的种子,获取硕果。
+        </p>
+
+        <div class={styles["btn-group"]}>
+          <Button round block type="primary" onClick={this.onClick}>立即认证</Button>
+        </div>
+      </div>
+    )
+  }
+})

+ 1 - 15
src/teacher/teacher-cert/cert-one.module.less

@@ -4,21 +4,7 @@
   overflow: hidden;
   background-color: #fff;
   padding: 20px;
-
-  .codeText {
-    color: var(--van-primary);
-  }
-
-  .formTitle {
-    font-size: 17px;
-    color: #000;
-    line-height: 24px;
-    &::before {
-      content: '*';
-      color: #FF4E19;
-      font-size: 17px;
-    }
-  }
+  padding-bottom: 0;
 
   :global {
     .van-field {

+ 25 - 48
src/teacher/teacher-cert/cert-one.tsx

@@ -16,7 +16,7 @@ export default defineComponent({
   },
   methods: {
     onConfirm(_date: any) {
-      teacherState.teacherCert.birthday = dayjs(this.popupDate).format('YYYY-MM-DD')
+      teacherState.teacherCert.birthdate = dayjs(this.popupDate).format('YYYY-MM-DD')
       this.popupShow = false;
     },
     formatter(type: any, val: any) {
@@ -38,57 +38,34 @@ export default defineComponent({
         <CellGroup border={false}>
           <ColField title="真实姓名" required>
             <Field
-              v-model={teacherState.teacherCert.username}
+              v-model={teacherState.teacherCert.realname}
               name="真实姓名"
               placeholder="请输入您的真实姓名"
-              type="tel"
-              maxlength={11}
             />
           </ColField>
-          {/* <Row style={{ marginBottom: '16px' }}>
-            <Col span={24} class={styles.formTitle}>真实姓名</Col>
-            <Col span={24} class="van-hairline--bottom">
-              <Field
-                v-model={teacherState.teacherCert.username}
-                name="真实姓名"
-                placeholder="请输入您的真实姓名"
-                type="tel"
-                maxlength={11}
-              />
-            </Col>
-          </Row> */}
-          <Row style={{ marginBottom: '16px' }}>
-            <Col span={24} class={styles.formTitle}>身份证号</Col>
-            <Col span={24} class="van-hairline--bottom">
-              <Field
-                v-model={teacherState.teacherCert.idCard}
-                name="身份证号"
-                placeholder="请输入您的身份证号码"
-                type="tel"
-                maxlength={11}
-              />
-            </Col>
-          </Row>
-          <Row style={{ marginBottom: '16px' }}>
-            <Col span={24} class={styles.formTitle}>性别</Col>
-            <Col span={24} class={styles.radioGroup}>
-              <div onClick={() => teacherState.teacherCert.sex = 1} class={[styles.radio, teacherState.teacherCert.sex === 1 ? styles.active : null]}>男</div>
-              <div onClick={() => teacherState.teacherCert.sex = 0} class={[styles.radio, teacherState.teacherCert.sex === 0 ? styles.active : null]}>女</div>
-            </Col>
-          </Row>
-          <Row>
-            <Col span={24} class={styles.formTitle}>出生日期</Col>
-            <Col span={24} class="van-hairline--bottom">
-              <Field
-                v-model={teacherState.teacherCert.birthday}
-                name="出生日期"
-                onClick-input={() => this.popupShow = true}
-                readonly
-                isLink
-                placeholder="请选择您的出生日期"
-              />
-            </Col>
-          </Row>
+          <ColField title="身份证号" required>
+            <Field
+              v-model={teacherState.teacherCert.idcardNo}
+              name="身份证号"
+              placeholder="请输入您的身份证号码"
+            />
+          </ColField>
+          <ColField title="性别" required border={false}>
+            <div class={styles.radioGroup}>
+              <div onClick={() => teacherState.teacherCert.gender = 1} class={[styles.radio, teacherState.teacherCert.gender === 1 ? styles.active : null]}>男</div>
+              <div onClick={() => teacherState.teacherCert.gender = 0} class={[styles.radio, teacherState.teacherCert.gender === 0 ? styles.active : null]}>女</div>
+            </div>
+          </ColField>
+          <ColField title="出生日期" required>
+            <Field
+              v-model={teacherState.teacherCert.birthdate}
+              name="出生日期"
+              onClick-input={() => this.popupShow = true}
+              readonly
+              isLink
+              placeholder="请选择您的出生日期"
+            />
+          </ColField>
         </CellGroup>
 
         <Popup show={this.popupShow} position="bottom" round>

+ 14 - 0
src/teacher/teacher-cert/cert-three.module.less

@@ -0,0 +1,14 @@
+.items {
+  margin: 0 14px 12px;
+  border-radius: 10px;
+  overflow: hidden;
+  background-color: #fff;
+  padding: 12px;
+  padding-bottom: 0;
+  :global {
+    .van-field {
+      padding-left: 0;
+      padding-right: 0;
+    }
+  }
+}

+ 51 - 0
src/teacher/teacher-cert/cert-three.tsx

@@ -0,0 +1,51 @@
+import ColField from "@/components/col-field";
+import ColUpload from "@/components/col-upload";
+import { Field } from "vant";
+import { defineComponent } from "vue";
+import styles from "./cert-three.module.less";
+import { teacherState } from "./teacherState";
+
+export default defineComponent({
+  name: "CertThree",
+  render() {
+    return (
+      <div class="cert-three">
+        <div class={styles.items}>
+          <ColField title="毕业院校">
+            <Field
+              v-model={teacherState.teacherCert.graduateSchool}
+              name="毕业院校"
+              placeholder="请输入您的毕业院校"
+            />
+          </ColField>
+
+          <ColField title="专业">
+            <Field
+              v-model={teacherState.teacherCert.subject}
+              name="专业"
+              placeholder="请输入您的专业"
+            />
+          </ColField>
+        </div>
+
+        <div class={styles.items}>
+          <ColField title="毕业证书">
+            <ColUpload deletable={false} v-model:value={teacherState.teacherCert.gradCertificate} tips="点击上传学历证书" />
+          </ColField>
+        </div>
+
+        <div class={styles.items}>
+          <ColField title="学位证书">
+            <ColUpload v-model:value={teacherState.teacherCert.degreeCertificate} tips="点击上传学位证书" />
+          </ColField>
+        </div>
+
+        <div class={styles.items}>
+          <ColField title="教师资格证">
+            <ColUpload v-model:value={teacherState.teacherCert.teacherCertificate} tips="点击上传教师资格证" />
+          </ColField>
+        </div>
+      </div>
+    )
+  }
+})

+ 25 - 0
src/teacher/teacher-cert/cert-two.module.less

@@ -0,0 +1,25 @@
+.items {
+  margin: 0 14px 12px;
+  border-radius: 10px;
+  overflow: hidden;
+  background-color: #fff;
+  padding: 12px;
+  padding-bottom: 0;
+  .select {
+    padding: 0 12px;
+    height: 24px;
+  }
+  :global {
+    .van-field {
+      padding-left: 0;
+      padding-right: 0;
+    }
+    .van-tag {
+      margin-right: 6px;
+      margin-bottom: 6px;
+    }
+  }
+  .tag-list {
+    margin-top: 12px;
+  }
+}

+ 63 - 0
src/teacher/teacher-cert/cert-two.tsx

@@ -0,0 +1,63 @@
+import { defineComponent } from "vue";
+import ColField from "@/components/col-field";
+import SubjectModel from './module/subject-model';
+import styles from './cert-two.module.less';
+import { Button, Field, Icon, Popup, Tag } from "vant";
+import { teacherState } from "./teacherState";
+
+import icon1 from './images/icon_1.png';
+import icon2 from './images/icon_2.png';
+import ColPopup from "@/components/col-popup";
+
+export default defineComponent({
+  name: 'cert-two',
+  data() {
+    return {
+      subjectStatus: false
+    }
+  },
+  methods: {
+    onChoice(item: any) {
+      console.log(item)
+      this.subjectStatus = false
+    }
+  },
+  render() {
+    return (
+      <div>
+        <div class={styles.items}>
+          <ColField title="可教授乐器(可多选)" border={false} required v-slots={{
+            icon: () => <Icon name={icon1} size="24" />,
+            right: () => <Button class={styles.select} round type="primary" size="small" onClick={() => { this.subjectStatus = true }}>选择</Button>
+          }}>
+            <div class={styles['tag-list']}>
+              <Tag type="primary" plain round closeable size="medium">长笛</Tag>
+              <Tag type="primary" plain round closeable size="medium">长笛</Tag>
+              <Tag type="primary" plain round closeable size="medium">长笛</Tag>
+            </div>
+          </ColField>
+        </div>
+
+        <div class={styles.items}>
+          <ColField title="个人简介" border={false} v-slots={{
+            icon: () => <Icon name={icon2} size="24" />,
+            right: () => <div class={styles.limit}>{teacherState.teacherCert.introduction.length}/200</div>
+          }}>
+            <Field
+              v-model={teacherState.teacherCert.introduction}
+              rows="3"
+              autosize
+              type="textarea"
+              maxlength={10}
+              placeholder="例:毕业于中国音乐学院长笛专业,曾获得中国青年管乐演奏大赛一等奖,具有8年教学经验,能够将专业知识通过简单易懂的方式教授给学员。"
+            />
+          </ColField>
+        </div>
+
+        <ColPopup v-model:popupStatus={this.subjectStatus}>
+          <SubjectModel onChoice={this.onChoice} />
+        </ColPopup>
+      </div>
+    )
+  }
+})

BIN
src/teacher/teacher-cert/images/checkbox_active.png


BIN
src/teacher/teacher-cert/images/checkbox_default.png


BIN
src/teacher/teacher-cert/images/icon_1.png


BIN
src/teacher/teacher-cert/images/icon_2.png


+ 15 - 7
src/teacher/teacher-cert/index.tsx

@@ -1,10 +1,14 @@
 
+import { Button, Toast } from "vant";
 import { defineComponent } from "vue";
 import styles from './index.module.less';
+import CertInfo from "./cert-info";
 import ColProtocol from "@/components/col-protocol";
+import { teacherState } from "./teacherState";
 import Steps from './steps';
 import CertOne from './cert-one'
-import { Button, Toast } from "vant";
+import CertTwo from './cert-two'
+import CertThree from "./cert-three";
 
 
 export default defineComponent({
@@ -25,13 +29,17 @@ export default defineComponent({
   render() {
     return (
       <div class={styles['teacher-cert']}>
-        <Steps style={{ marginBottom: '12px' }} />
+        {!teacherState.authStatus ? <CertInfo /> : <div>
+          <Steps style={{ marginBottom: '12px' }} />
+          {teacherState.active === 1 ? <CertOne /> : null }
+          {teacherState.active === 2 ? <CertTwo /> : null }
+          {teacherState.active === 3 ? <CertThree /> : null }
 
-        <CertOne />
-        <div class={styles.btnGroup}>
-          <ColProtocol ref='eleRef' style={{ paddingLeft: 0, paddingRight: 0 }} />
-          <Button block round onClick={this.next} type="primary" text="下一步" />
-        </div>
+          <div class={styles.btnGroup}>
+            <ColProtocol ref='eleRef' style={{ paddingLeft: 0, paddingRight: 0 }} />
+            <Button block round onClick={this.next} type="primary" text="下一步" />
+          </div>
+        </div>}
       </div>
     )
   }

+ 71 - 0
src/teacher/teacher-cert/module/subject-model.module.less

@@ -0,0 +1,71 @@
+.subjects {
+  padding: 15px;
+
+  .btn-group {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    padding: 12px;
+    background-color: #fff;
+  }
+
+  .subject-list {
+    display: flex;
+    align-items: center;
+    // justify-content: space-between;
+    flex-wrap: wrap;
+
+    .subject-item {
+      position: relative;
+      width: 108px;
+      height: 108px;
+      margin-right: 10px;
+      margin-bottom: 10px;
+      border-radius: 7px;
+      overflow: hidden;
+
+      &:nth-child(3n) {
+        margin-right: 0;
+      }
+    }
+
+    .topBg {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.54) 100%);
+    }
+
+    .checkbox {
+      position: absolute;
+      right: 7px;
+      top: 7px;
+    }
+
+    .name {
+      position: absolute;
+      bottom: 7px;
+      left: 7px;
+      font-size: 16px;
+      font-weight: 500;
+      color: #FFFFFF;
+      line-height: 22px;
+    }
+
+    :global {
+      .van-checkbox__icon {
+        height: 22px;
+        .van-icon {
+          border: 0;
+        }
+      }
+      .van-checkbox__icon--checked .van-icon {
+        background: transparent;
+        border: transparent
+      }
+    }
+  }
+}

+ 46 - 0
src/teacher/teacher-cert/module/subject-model.tsx

@@ -0,0 +1,46 @@
+import { Button, Checkbox, Icon, Image } from "vant";
+import { defineComponent } from "vue";
+import styles from './subject-model.module.less';
+
+import checkBoxActive from '../images/checkbox_active.png';
+import checkBoxDefault from '../images/checkbox_default.png';
+
+export default defineComponent({
+  name: "subject-model",
+  props: {
+    onChoice: {
+      type: Function,
+      default: (item: any) => { }
+    }
+  },
+  data() {
+    return {
+      checkBox: []
+    }
+  },
+  render() {
+    return (
+      <div class={styles.subjects}>
+        <div class={styles['subject-list']}>
+          {[1, 2, 3, 4, 5].map((item: any) => (
+            <div class={styles['subject-item']}>
+            <Image src="https://daya.ks3-cn-beijing.ksyun.com/202110/Sn76BUQ.png" width="100%" height="100%" fit="cover" />
+            <div class={styles.topBg}>
+              <Checkbox v-model={this.checkBox} name={1} class={styles.checkbox} v-slots={{
+                icon: (props: any) => (
+                  <Icon name={props.checked ? checkBoxActive : checkBoxDefault} size="22" />
+                )
+              }} />
+              <p class={styles.name}>长笛</p>
+            </div>
+          </div>
+          )) }
+        </div>
+
+        <div class={styles["btn-group"]}>
+          <Button round block type="primary" onClick={() => this.onChoice(true)}>确定</Button>
+        </div>
+      </div>
+    )
+  }
+})

+ 12 - 4
src/teacher/teacher-cert/teacherState.ts

@@ -1,11 +1,19 @@
 import { reactive } from 'vue';
 
 export const teacherState = reactive({
+  authStatus: false, // 是否立即认证
   active: 1,
   teacherCert: {
-    username: null,
-    idCard: null,
-    sex: 1,
-    birthday: null as any
+    realname: null,
+    idcardNo: null,
+    gender: 1,
+    birthdate: null as any,
+    subjectId: null,
+    introduction: '',
+    graduateSchool: null,
+    subject: null,
+    gradCertificate: null,
+    degreeCertificate: null,
+    teacherCertificate: null
   }
 });

+ 6 - 1
vite.config.ts

@@ -11,7 +11,8 @@ function resolve(dir: string) {
 }
 // https://vitejs.dev/config/
 // https://github.com/vitejs/vite/issues/1930 .env
-const proxyUrl = 'https://mstutest.dayaedu.com/';
+// const proxyUrl = 'https://mstutest.dayaedu.com/';
+const proxyUrl = 'http://dev.colexiu.com/';
 export default defineConfig({
   plugins: [
     vue(),
@@ -55,6 +56,10 @@ export default defineConfig({
       '/api-teacher': {
         target: proxyUrl,
         changeOrigin: true
+      },
+      '/api-web': {
+        target: proxyUrl,
+        changeOrigin: true
       }
     }
   },