src/business-components/subject-list/index.tsx

@@ -1,309 +1,308 @@
-import {
-  Button,
-  Checkbox,
-  CheckboxGroup,
-  Icon,
-  Image,
-  Loading,
-  Radio,
-  RadioGroup,
-  Sticky,
-  Toast
-} from 'vant'
-import { defineComponent, PropType } from 'vue'
-import styles from './index.module.less'
-
-import checkBoxActive from '@/teacher/teacher-cert/images/checkbox_active.png'
-import checkBoxDefault from '@/teacher/teacher-cert/images/checkbox_default.png'
-import ColResult from '@/components/col-result'
-
-export default defineComponent({
-  name: 'SubjectList',
-  props: {
-    onChoice: {
-      type: Function,
-      default: (item: any) => {}
-    },
-    choiceSubjectIds: {
-      type: Array,
-      default: []
-    },
-    subjectList: {
-      type: Array,
-      default: []
-    },
-    max: {
-      // 最多可选数量
-      type: Number,
-      default: 5
-    },
-    selectType: {
-      // 选择类型，Radio：单选，Checkbox：多选
-      type: String as PropType<'Checkbox' | 'Radio'>,
-      default: 'Checkbox'
-    },
-    single: {
-      // 单选模式
-      type: Boolean,
-      default: false
-    }
-  },
-  data() {
-    return {
-      checkBox: [],
-      checkboxRefs: [] as any,
-      radio: null as any // 单选
-    }
-  },
-  async mounted() {
-    if (this.selectType === 'Radio') {
-      this.radio = this.choiceSubjectIds[0]
-    } else {
-      this.checkBox = this.choiceSubjectIds as never[]
-    }
-  },
-  watch: {
-    choiceSubjectIds(val: any, oldVal) {
-      // 同步更新显示数据
-      this.checkBox = [...val] as never[]
-    }
-  },
-  methods: {
-    onSelect(id: number) {
-      if (this.selectType === 'Checkbox') {
-        if (
-          this.max === this.checkBox.length &&
-          !this.checkBox.includes(id as never)
-        ) {
-          Toast(`乐器最多选择${this.max}个`)
-        }
-        this.checkboxRefs[id].toggle()
-      } else if (this.selectType === 'Radio') {
-        this.radio = id
-      }
-    }
-  },
-  render() {
-    return (
-      <div class={styles.subjects}>
-        <div class={styles.subjectContainer}>
-          {this.subjectList.length ? (
-            this.selectType === 'Checkbox' ? (
-              <CheckboxGroup v-model={this.checkBox} max={this.max}>
-                <div class={styles.subjectMaxLength}>
-                  最多可选择{this.max}个乐器
-                </div>
-
-                {!this.single &&
-                  this.subjectList.map((item: any) =>
-                    item.subjects && item.subjects.length > 0 ? (
-                      <>
-                        <div class={styles.title}>{item.name}</div>
-                        <div class={styles['subject-list']}>
-                          {item.subjects &&
-                            item.subjects.map((sub: any) => (
-                              <div
-                                class={styles['subject-item']}
-                                onClick={() => this.onSelect(sub.id)}
-                              >
-                                <Image
-                                  src={sub.img || 'xxx'}
-                                  width="100%"
-                                  height="100%"
-                                  fit="cover"
-                                  v-slots={{
-                                    loading: () => (
-                                      <Loading type="spinner" size={20} />
-                                    )
-                                  }}
-                                />
-                                <div class={styles.topBg}>
-                                  <Checkbox
-                                    name={sub.id}
-                                    class={styles.checkbox}
-                                    disabled
-                                    ref={(el: any) =>
-                                      (this.checkboxRefs[sub.id] = el)
-                                    }
-                                    v-slots={{
-                                      icon: (props: any) => (
-                                        <Icon
-                                          name={
-                                            props.checked
-                                              ? checkBoxActive
-                                              : checkBoxDefault
-                                          }
-                                          size="20"
-                                        />
-                                      )
-                                    }}
-                                  />
-                                  <p class={styles.name}>{sub.name}</p>
-                                </div>
-                              </div>
-                            ))}
-                        </div>
-                      </>
-                    ) : null
-                  )}
-                {this.single ? (
-                  <div class={styles['subject-list']}>
-                    {this.subjectList.map((item: any) => (
-                      <div
-                        class={styles['subject-item']}
-                        onClick={() => this.onSelect(item.id)}
-                      >
-                        <Image
-                          src={item.img || 'xxx'}
-                          width="100%"
-                          height="100%"
-                          fit="cover"
-                          v-slots={{
-                            loading: () => <Loading type="spinner" size={20} />
-                          }}
-                        />
-                        <div class={styles.topBg}>
-                          <Checkbox
-                            name={item.id}
-                            class={styles.checkbox}
-                            disabled
-                            ref={(el: any) => (this.checkboxRefs[item.id] = el)}
-                            v-slots={{
-                              icon: (props: any) => (
-                                <Icon
-                                  name={
-                                    props.checked
-                                      ? checkBoxActive
-                                      : checkBoxDefault
-                                  }
-                                  size="20"
-                                />
-                              )
-                            }}
-                          />
-                          <p class={styles.name}>{item.name}</p>
-                        </div>
-                      </div>
-                    ))}
-                  </div>
-                ) : null}
-              </CheckboxGroup>
-            ) : (
-              <RadioGroup v-model={this.radio}>
-                {!this.single &&
-                  this.subjectList.map((item: any) =>
-                    item.subjects && item.subjects.length > 0 ? (
-                      <>
-                        <div class={styles.title}>{item.name}</div>
-                        <div class={styles['subject-list']}>
-                          {item.subjects &&
-                            item.subjects.map((sub: any) => (
-                              <div
-                                class={styles['subject-item']}
-                                onClick={() => this.onSelect(sub.id)}
-                              >
-                                <Image
-                                  src={sub.img || 'xxx'}
-                                  width="100%"
-                                  height="100%"
-                                  fit="cover"
-                                  v-slots={{
-                                    loading: () => (
-                                      <Loading type="spinner" size={20} />
-                                    )
-                                  }}
-                                />
-                                <div class={styles.topBg}>
-                                  <Radio
-                                    name={sub.id}
-                                    class={styles.checkbox}
-                                    v-slots={{
-                                      icon: (props: any) => (
-                                        <Icon
-                                          name={
-                                            props.checked
-                                              ? checkBoxActive
-                                              : checkBoxDefault
-                                          }
-                                          size="20"
-                                        />
-                                      )
-                                    }}
-                                  />
-                                  <p class={styles.name}>{sub.name}</p>
-                                </div>
-                              </div>
-                            ))}
-                        </div>
-                      </>
-                    ) : null
-                  )}
-                {this.single ? (
-                  <div class={styles['subject-list']}>
-                    {this.subjectList.map((item: any) => (
-                      <div
-                        class={styles['subject-item']}
-                        onClick={() => this.onSelect(item.id)}
-                      >
-                        <Image
-                          src={item.img || 'xxx'}
-                          width="100%"
-                          height="100%"
-                          fit="cover"
-                          v-slots={{
-                            loading: () => <Loading type="spinner" size={20} />
-                          }}
-                        />
-                        <div class={styles.topBg}>
-                          <Radio
-                            name={item.id}
-                            class={styles.checkbox}
-                            v-slots={{
-                              icon: (props: any) => (
-                                <Icon
-                                  name={
-                                    props.checked
-                                      ? checkBoxActive
-                                      : checkBoxDefault
-                                  }
-                                  size="20"
-                                />
-                              )
-                            }}
-                          />
-                          <p class={styles.name}>{item.name}</p>
-                        </div>
-                      </div>
-                    ))}
-                  </div>
-                ) : null}
-              </RadioGroup>
-            )
-          ) : (
-            <ColResult tips="暂无声部数据" btnStatus={false} />
-          )}
-        </div>
-
-        {this.subjectList.length > 0 && (
-          <Sticky offsetBottom={0} position="bottom">
-            <div class={'btnGroup'}>
-              <Button
-                round
-                block
-                type="primary"
-                style={{ width: '96%', margin: '0 auto' }}
-                onClick={() =>
-                  this.onChoice(
-                    this.selectType === 'Checkbox' ? this.checkBox : this.radio
-                  )
-                }
-              >
-                确定
-              </Button>
-            </div>
-          </Sticky>
-        )}
-      </div>
-    )
-  }
-})
+import {
+  Button,
+  Checkbox,
+  CheckboxGroup,
+  Icon,
+  Image,
+  Loading,
+  Radio,
+  RadioGroup,
+  Sticky,
+  Toast
+} from 'vant'
+import { defineComponent, PropType } from 'vue'
+import styles from './index.module.less'
+import checkBoxActive from '@/teacher/teacher-cert/images/checkbox_active.png'
+import checkBoxDefault from '@/teacher/teacher-cert/images/checkbox_default.png'
+import ColResult from '@/components/col-result'
+
+export default defineComponent({
+  name: 'SubjectList',
+  props: {
+    onChoice: {
+      type: Function,
+      default: (item: any) => { }
+    },
+    choiceSubjectIds: {
+      type: Array,
+      default: []
+    },
+    subjectList: {
+      type: Array,
+      default: []
+    },
+    max: {
+      // 最多可选数量
+      type: Number,
+      default: 5
+    },
+    selectType: {
+      // 选择类型，Radio：单选，Checkbox：多选
+      type: String as PropType<'Checkbox' | 'Radio'>,
+      default: 'Checkbox'
+    },
+    single: {
+      // 单选模式
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      checkBox: [],
+      checkboxRefs: [] as any,
+      radio: null as any // 单选
+    }
+  },
+  async mounted() {
+    if (this.selectType === 'Radio') {
+      this.radio = this.choiceSubjectIds[0]
+    } else {
+      this.checkBox = this.choiceSubjectIds as never[]
+    }
+  },
+  watch: {
+    choiceSubjectIds(val: any, oldVal) {
+      // 同步更新显示数据
+      this.checkBox = [...val] as never[]
+    }
+  },
+  methods: {
+    onSelect(id: number) {
+      if (this.selectType === 'Checkbox') {
+        if (
+          this.max === this.checkBox.length &&
+          !this.checkBox.includes(id as never)
+        ) {
+          Toast(`乐器最多选择${this.max}个`)
+        }
+        this.checkboxRefs[id].toggle()
+      } else if (this.selectType === 'Radio') {
+        this.radio = id
+      }
+    }
+  },
+  render() {
+    return (
+      <div class={styles.subjects}>
+        <div class={styles.subjectContainer}>
+          {this.subjectList.length ? (
+            this.selectType === 'Checkbox' ? (
+              <CheckboxGroup v-model={this.checkBox} max={this.max}>
+                <div class={styles.subjectMaxLength}>
+                  最多可选择{this.max}个乐器
+                </div>
+
+                {!this.single &&
+                  this.subjectList.map((item: any) =>
+                    item.subjects && item.subjects.length > 0 ? (
+                      <>
+                        <div class={styles.title}>{item.name}</div>
+                        <div class={styles['subject-list']}>
+                          {item.subjects &&
+                            item.subjects.map((sub: any) => (
+                              <div
+                                class={styles['subject-item']}
+                                onClick={() => this.onSelect(sub.id)}
+                              >
+                                <Image
+                                  src={sub.img || 'xxx'}
+                                  width="100%"
+                                  height="100%"
+                                  fit="cover"
+                                  v-slots={{
+                                    loading: () => (
+                                      <Loading type="spinner" size={20} />
+                                    )
+                                  }}
+                                />
+                                <div class={styles.topBg}>
+                                  <Checkbox
+                                    name={sub.id}
+                                    class={styles.checkbox}
+                                    disabled
+                                    ref={(el: any) =>
+                                      (this.checkboxRefs[sub.id] = el)
+                                    }
+                                    v-slots={{
+                                      icon: (props: any) => (
+                                        <Icon
+                                          name={
+                                            props.checked
+                                              ? checkBoxActive
+                                              : checkBoxDefault
+                                          }
+                                          size="20"
+                                        />
+                                      )
+                                    }}
+                                  />
+                                  <p class={styles.name}>{sub.name}</p>
+                                </div>
+                              </div>
+                            ))}
+                        </div>
+                      </>
+                    ) : null
+                  )}
+                {this.single ? (
+                  <div class={styles['subject-list']}>
+                    {this.subjectList.map((item: any) => (
+                      <div
+                        class={styles['subject-item']}
+                        onClick={() => this.onSelect(item.id)}
+                      >
+                        <Image
+                          src={item.img || 'xxx'}
+                          width="100%"
+                          height="100%"
+                          fit="cover"
+                          v-slots={{
+                            loading: () => <Loading type="spinner" size={20} />
+                          }}
+                        />
+                        <div class={styles.topBg}>
+                          <Checkbox
+                            name={item.id}
+                            class={styles.checkbox}
+                            disabled
+                            ref={(el: any) => (this.checkboxRefs[item.id] = el)}
+                            v-slots={{
+                              icon: (props: any) => (
+                                <Icon
+                                  name={
+                                    props.checked
+                                      ? checkBoxActive
+                                      : checkBoxDefault
+                                  }
+                                  size="20"
+                                />
+                              )
+                            }}
+                          />
+                          <p class={styles.name}>{item.name}</p>
+                        </div>
+                      </div>
+                    ))}
+                  </div>
+                ) : null}
+              </CheckboxGroup>
+            ) : (
+              <RadioGroup v-model={this.radio}>
+                {!this.single &&
+                  this.subjectList.map((item: any) =>
+                    item.subjects && item.subjects.length > 0 ? (
+                      <>
+                        <div class={styles.title}>{item.name}</div>
+                        <div class={styles['subject-list']}>
+                          {item.subjects &&
+                            item.subjects.map((sub: any) => (
+                              <div
+                                class={styles['subject-item']}
+                                onClick={() => this.onSelect(sub.id)}
+                              >
+                                <Image
+                                  src={sub.img || 'xxx'}
+                                  width="100%"
+                                  height="100%"
+                                  fit="cover"
+                                  v-slots={{
+                                    loading: () => (
+                                      <Loading type="spinner" size={20} />
+                                    )
+                                  }}
+                                />
+                                <div class={styles.topBg}>
+                                  <Radio
+                                    name={sub.id}
+                                    class={styles.checkbox}
+                                    v-slots={{
+                                      icon: (props: any) => (
+                                        <Icon
+                                          name={
+                                            props.checked
+                                              ? checkBoxActive
+                                              : checkBoxDefault
+                                          }
+                                          size="20"
+                                        />
+                                      )
+                                    }}
+                                  />
+                                  <p class={styles.name}>{sub.name}</p>
+                                </div>
+                              </div>
+                            ))}
+                        </div>
+                      </>
+                    ) : null
+                  )}
+                {this.single ? (
+                  <div class={styles['subject-list']}>
+                    {this.subjectList.map((item: any) => (
+                      <div
+                        class={styles['subject-item']}
+                        onClick={() => this.onSelect(item.id)}
+                      >
+                        <Image
+                          src={item.img || 'xxx'}
+                          width="100%"
+                          height="100%"
+                          fit="cover"
+                          v-slots={{
+                            loading: () => <Loading type="spinner" size={20} />
+                          }}
+                        />
+                        <div class={styles.topBg}>
+                          <Radio
+                            name={item.id}
+                            class={styles.checkbox}
+                            v-slots={{
+                              icon: (props: any) => (
+                                <Icon
+                                  name={
+                                    props.checked
+                                      ? checkBoxActive
+                                      : checkBoxDefault
+                                  }
+                                  size="20"
+                                />
+                              )
+                            }}
+                          />
+                          <p class={styles.name}>{item.name}</p>
+                        </div>
+                      </div>
+                    ))}
+                  </div>
+                ) : null}
+              </RadioGroup>
+            )
+          ) : (
+            <ColResult tips="暂无声部数据" btnStatus={false} />
+          )}
+        </div>
+
+        {this.subjectList.length > 0 && (
+          <Sticky offsetBottom={0} position="bottom">
+            <div class={'btnGroup'}>
+              <Button
+                round
+                block
+                type="primary"
+                style={{ width: '96%', margin: '0 auto' }}
+                onClick={() =>
+                  this.onChoice(
+                    this.selectType === 'Checkbox' ? this.checkBox : this.radio
+                  )
+                }
+              >
+                确定
+              </Button>
+            </div>
+          </Sticky>
+        )}
+      </div>
+    )
+  }
+})

src/helpers/request.ts

@@ -85,7 +85,7 @@ request.interceptors.response.use(
       throw new Error(msg)
     }
     const data = await res.clone().json()
-    if (data.code !== 200 && data.errCode !== 0) {
+    if (data.code !== 200 && data.errCode !== 0 && data.code !== 5004) {
       let msg = data.msg || data.message || '处理失败，请重试'
       if (initRequest) {
         if (data.code === 403 || data.code === 401) {

src/views/tenantStudentRejest/index.module.less

@@ -189,3 +189,129 @@
   margin-left: -151px;
   margin-top: 24px;
 }
+
+.showWrap {
+  width: 264px;
+  height: 326px;
+  position: absolute;
+  top: 212px;
+  left: 50%;
+  margin-left: -132px;
+  background-color: #fff;
+  z-index: 1001;
+  box-shadow: 1px 1px 9px 0px rgba(149, 145, 145, 0.07);
+  border-radius: 12px 12px;
+  position: relative;
+  .showWrapTop {
+    width: 264px;
+    height: 130px;
+    position: relative;
+    top: -23px;
+  }
+  h2 {
+    margin-top: 3px;
+    height: 25px;
+    font-size: 18px;
+    font-weight: 500;
+    color: #333333;
+    line-height: 25px;
+    text-align: center;
+    margin-bottom: 11px;
+  }
+  h4 {
+    font-size: 15px;
+    font-weight: 500;
+    color: #333333;
+    text-align: center;
+    margin-bottom: 11px;
+    span {
+      color: #fe2451;
+      font-weight: bold;
+    }
+  }
+  p {
+    font-size: 14px;
+    font-weight: 400;
+    color: #777777;
+    line-height: 20px;
+    text-align: center;
+    margin-bottom: 22px;
+  }
+  .downApp {
+    width: 200px;
+    height: 40px;
+    background: #fe2451;
+    border-radius: 39px;
+    font-size: 18px;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    color: #ffffff;
+    text-align: center;
+    line-height: 40px;
+    position: relative;
+    left: 50%;
+    margin-left: -100px;
+  }
+}
+.secondWrap {
+  width: 294px;
+  height: 182px;
+  background: #ffffff;
+  border-radius: 12px;
+  padding: 15px 21px 21px;
+  h2 {
+    height: 24px;
+    font-size: 17px;
+    font-weight: 600;
+    color: #333333;
+    line-height: 24px;
+    margin-bottom: 10px;
+    text-align: center;
+  }
+  p {
+    font-size: 15px;
+    font-weight: 400;
+    color: #666666;
+    line-height: 24px;
+    text-align: center;
+    margin-bottom: 3px;
+    span {
+      color: #fe2451;
+      font-weight: bold;
+    }
+  }
+  .buttonWrap {
+    margin-top: 24px;
+    box-sizing: border-box;
+    width: 100%;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+    .closeBtn {
+      width: 120px;
+      height: 40px;
+      background: #ffffff;
+      border-radius: 20px;
+      border: 1px solid #dbdbdb;
+      line-height: 40px;
+      font-size: 14px;
+      font-weight: 400;
+      color: #333333;
+      text-align: center;
+      margin-right: 12px;
+    }
+    .submitBtn {
+      width: 120px;
+      height: 40px;
+      background: #fe2451;
+      border-radius: 20px;
+      border: 1px solid #dbdbdb;
+      line-height: 40px;
+      font-size: 14px;
+      font-weight: 400;
+      color: #fff;
+      text-align: center;
+    }
+  }
+}

src/views/tenantStudentRejest/index.tsx

@@ -1,6 +1,6 @@
 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  } from 'vant'
+import { Sticky, Image, List, Popup, Icon, Area, Field, Form, CellGroup, Button, Toast, Picker, DatetimePicker,Overlay,Dialog } from 'vant'
 import { defineComponent, onMounted, reactive } from 'vue'
 import styles from './index.module.less'
 import bg from './images/bg.png'
@@ -12,6 +12,7 @@ import studentText from './images/studentText.png'
 import { useRoute } from 'vue-router'
 import icon_arrow from './images/icon_arrow.png'
 import rejectBtn from './images/rejectBtn.png'
+import studentSuccess from './images/studentSuccess.png'
 import request from '@/helpers/request'
 import dayjs from 'dayjs'
 export default defineComponent({
@@ -23,14 +24,16 @@ export default defineComponent({
       name: '',
       phone: '',
       subjectId: '',
-      tenantId: '',
+      subjectName:'',
       birthdate: '',
       code: '',
-      genderName:''
+      genderName:'',
+      tenantId:route.query.tenantId,
     });
 
     const data = reactive({
-      schoolName: route.query.schoolName || '',
+      schoolName: route.query.name || '',
+      id:route.query.tenantId,
       cityName: '', // 所属城市
       showArea: false,
       checked: true,
@@ -43,9 +46,11 @@ export default defineComponent({
       openStatus: false,
       dateState: false,
       genderState:false,
-      genderList:[{text:'男',value:'1'},{text:'女',value:'0'}]
+      genderList:[{text:'男',value:'1'},{text:'女',value:'0'}],
+      showSuccess:false,
+      secondConfirm:false,
     });
-    const handleSubmit = () => {
+    const handleSubmit = async() => {
       console.log(forms, 'forms')
       if (!forms.name) {
         Toast('请输入姓名')
@@ -65,22 +70,44 @@ export default defineComponent({
       if (!forms.subjectId) {
         Toast('请选择声部')
       }
+
+        const res = await request.post('/api-tenant/open/student/save',{ data: { ... forms}})
+        console.log(res)
+      if(res.code == 200){
+        data.showSuccess = true
+      }
+
+      if(res.code == 5004){
+        data.secondConfirm = true
+      }
+
+
+
+
     }
     const getSubjectList = async () => {
       try {
-        const res = await request.get('/api-student/open/subject/subjectSelect')
-        data.subjectList = res.data || []
+        const res = await request.get('/api-tenant/open/subject/queryPage',{ data: { page: 1, rows: 9999 }})
+        data.subjectList = res.data.rows.map((item:any)=>{
+          return {
+            text:item.name,
+            value:item.id
+          }
+        }) || []
       } catch (e) {
         console.log(e)
       }
     }
     const confirmSubject = (val: any) => {
+      forms.subjectName = val.text;
+      forms.subjectId = val.value;
+      data.searchStatus = false
       console.log(val, 'confirmSubject')
     }
 
     const confirmDate = (val:any)=>{
       forms.birthdate = dayjs(val).format('YYYY-MM-DD')
-     data.genderState = false
+     data.dateState = false
     }
     onMounted(() => {
       getSubjectList()
@@ -96,7 +123,7 @@ export default defineComponent({
       data.genderState = false
     }
     /** 发送验证码 */
-    const onSendSms = () => {
+    const onSendSms = async () => {
       if (!forms.phone) {
         Toast('请输入手机号码');
         return;
@@ -105,8 +132,48 @@ export default defineComponent({
         Toast('手机号码格式不正确');
         return;
       }
-      data.imgCodeStatus = true;
+      await request.post('/api-student/code/sendSmsCode', {
+        requestType: 'form',
+        data: {
+          mobile: forms.phone,
+          type: 'LOGIN'
+        }
+      })
+      onCountDown()
+      setTimeout(() => {
+        Toast('验证码已发送')
+      }, 100)
     };
+
+    const onCountDown = ()=>{
+        data.sendMsg='60s'
+        let count = 60;
+        const timer = setInterval(() => {
+          count--;
+          data.sendMsg= `${count}s`
+          if (count <= 0) {
+           data.sendMsg='获取验证码'
+            clearInterval(timer);
+          }
+        }, 1000);
+
+    }
+
+    const downApp = ()=>{
+      data.showSuccess = false
+    }
+
+    const submitSecond = async()=>{
+      try{
+        const res = await request.post('/api-tenant/open/student/save',{ data: { ... forms,updateTenant:true}})
+        data.showSuccess=true
+        data.secondConfirm=false
+
+      }catch(e){
+        console.log(e)
+      }
+
+    }
     return () =>
       <>< div class={styles.videoClass} >
         <ColHeader
@@ -121,7 +188,7 @@ export default defineComponent({
           <img src={bg} class={styles.bgWrap} alt="" />
           <div class={styles.schoolNameWrap}>
             <img src={rejectSchool} class={styles.rejectSchool} alt="" />
-            <p>武汉星星小学</p>
+            <p>{data.schoolName}</p>
 
           </div>
           <img class={styles.centerLogo} src={centerLogo} alt="" />
@@ -233,7 +300,7 @@ export default defineComponent({
                     label="声部"
                     placeholder="请选择声部"
                     readonly
-                    v-model={data.cityName}
+                    v-model={forms.subjectName}
                     onClick={() => (data.searchStatus = true)}>
                     {{
                       button: () => (
@@ -289,6 +356,36 @@ export default defineComponent({
         >
           <Picker columns={data.genderList} onCancel={() => { data.genderState = false }} onConfirm={confirmGender}></Picker>
         </Popup>
+
+        <Overlay show={data.showSuccess}  z-index={1000}>
+          <div class={styles.showWrap}>
+           <img class={styles.showWrapTop} src={studentSuccess} alt="" />
+           <h2>恭喜您已成功登记为</h2>
+           <h4>{data.schoolName} <span>【学员】</span> </h4>
+           <p>请下载酷乐秀机构版APP进行学习</p>
+           <div class={styles.downApp} onClick={downApp}>立即下载</div>
+          </div>
+        </Overlay>
+
+
+          <Popup
+          show={data.secondConfirm}
+          position="center"
+          round
+          onClose={() => (data.secondConfirm = false)}
+          onClosed={() => (data.secondConfirm = false)}
+        >
+        <div class={styles.secondWrap}>
+          <h2>提示</h2>
+          <p>当前账号已存在 <span>【机构名称】</span> ，是否</p>
+          <p>确认更换到 <span>【机构名称】</span>吗? </p>
+          <div class={styles.buttonWrap}>
+            <div class={styles.closeBtn} onClick={()=>{data.secondConfirm = false}}> 取消</div>
+            <div  class={styles.submitBtn} onClick={submitSecond}>确定</div>
+          </div>
+        </div>
+
+        </Popup>
       </div ></>
 
   }

src/views/tenantTeacherRejest/index.module.less

@@ -189,3 +189,67 @@
   margin-left: -151px;
   margin-top: 24px;
 }
+
+.showWrap {
+  width: 264px;
+  height: 326px;
+  position: absolute;
+  top: 212px;
+  left: 50%;
+  margin-left: -132px;
+  background-color: #fff;
+  z-index: 1001;
+  box-shadow: 1px 1px 9px 0px rgba(149, 145, 145, 0.07);
+  border-radius: 12px 12px;
+  position: relative;
+  .showWrapTop {
+    width: 264px;
+    height: 130px;
+    position: relative;
+    top: -25px;
+  }
+  h2 {
+    margin-top: 3px;
+    height: 25px;
+    font-size: 18px;
+    font-weight: 500;
+    color: #333333;
+    line-height: 25px;
+    text-align: center;
+    margin-bottom: 11px;
+  }
+  h4 {
+    font-size: 15px;
+    font-weight: 500;
+    color: #333333;
+    text-align: center;
+    margin-bottom: 11px;
+    span {
+      color: #fe2451;
+      font-weight: bold;
+    }
+  }
+  p {
+    font-size: 14px;
+    font-weight: 400;
+    color: #777777;
+    line-height: 20px;
+    text-align: center;
+    margin-bottom: 22px;
+  }
+  .downApp {
+    width: 200px;
+    height: 40px;
+    background: #fe2451;
+    border-radius: 39px;
+    font-size: 18px;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    color: #ffffff;
+    text-align: center;
+    line-height: 40px;
+    position: relative;
+    left: 50%;
+    margin-left: -100px;
+  }
+}

src/views/tenantTeacherRejest/index.tsx

@@ -1,6 +1,6 @@
 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 } 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'
@@ -12,6 +12,8 @@ import studentText from './images/studentText.png'
 import { useRoute } from 'vue-router'
 import icon_arrow from './images/icon_arrow.png'
 import rejectBtn from './images/rejectBtn.png'
+import teacherSuccess from './images/teacherSuccess.png'
+import SubjectModel from './modals/chioseSuond'
 import request from '@/helpers/request'
 import dayjs from 'dayjs'
 export default defineComponent({
@@ -30,7 +32,7 @@ export default defineComponent({
     });
 
     const data = reactive({
-      schoolName: route.query.schoolName || '',
+      schoolName: route.query.name || '',
       cityName: '', // 所属城市
       showArea: false,
       checked: true,
@@ -41,7 +43,10 @@ export default defineComponent({
       subjectList: [],
       searchStatus: false,
       openStatus: false,
-      dateState: false
+      dateState: false,
+      showSuccess: false,
+      selectedSubjectList: [] as any,
+      choiceSubjectIds: [] as any
     });
     const handleSubmit = () => {
       console.log(forms, 'forms')
@@ -66,8 +71,21 @@ export default defineComponent({
     }
     const getSubjectList = async () => {
       try {
-        const res = await request.get('/api-student/open/subject/subjectSelect')
-        data.subjectList = res.data || []
+        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 {
+            text: item.name,
+            value: item.id
+          }
+        })
+         *
+         */
       } catch (e) {
         console.log(e)
       }
@@ -80,12 +98,17 @@ export default defineComponent({
       forms.birthdate = dayjs(val).format('YYYY-MM-DD')
       data.dateState = false
     }
+
+
     onMounted(() => {
+      console.log(
+        route.query
+      )
       getSubjectList()
     })
 
     /** 发送验证码 */
-    const onSendSms = () => {
+    const onSendSms = async () => {
       if (!forms.phone) {
         Toast('请输入手机号码');
         return;
@@ -94,8 +117,41 @@ export default defineComponent({
         Toast('手机号码格式不正确');
         return;
       }
-      data.imgCodeStatus = true;
+      await request.post('/api-student/code/sendSmsCode', {
+        requestType: 'form',
+        data: {
+          mobile: forms.phone,
+          type: 'LOGIN'
+        }
+      })
+      onCountDown()
+      setTimeout(() => {
+        Toast('验证码已发送')
+      }, 100)
     };
+    const onCountDown = () => {
+      data.sendMsg = '60s'
+      let count = 60;
+      const timer = setInterval(() => {
+        count--;
+        data.sendMsg = `${count}s`
+        if (count <= 0) {
+          data.sendMsg = '获取验证码'
+          clearInterval(timer);
+        }
+      }, 1000);
+
+    }
+
+    const downApp = () => {
+      data.showSuccess = false
+    }
+
+    const onChoice = (val: any) => {
+      data.searchStatus = false
+      data.selectedSubjectList = [val]
+    }
+
     return () =>
       <>< div class={styles.videoClass} >
         <ColHeader
@@ -110,7 +166,7 @@ export default defineComponent({
           <img src={bg} class={styles.bgWrap} alt="" />
           <div class={styles.schoolNameWrap}>
             <img src={rejectSchool} class={styles.rejectSchool} alt="" />
-            <p>武汉星星小学</p>
+            <p>{data.schoolName}</p>
 
           </div>
           <img class={styles.centerLogo} src={centerLogo} alt="" />
@@ -218,7 +274,7 @@ export default defineComponent({
             <img src={rejectBtn} onClick={() => { handleSubmit() }} class={styles.rejectBtn} alt="" />
           </div>
         </div>
-        <Popup
+        {/* <Popup
           show={data.searchStatus}
           position="bottom"
           round
@@ -228,8 +284,40 @@ export default defineComponent({
           onClosed={() => (data.openStatus = false)}
         >
           <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 ></>
+      </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>
+            <p>请下载酷乐秀机构版APP进行学习</p>
+            <div class={styles.downApp} onClick={downApp}>立即下载</div>
+          </div>
+        </Overlay>
+
+
+      </>
 
   }
 

src/views/tenantTeacherRejest/modals/chioseSuond.module.less

@@ -0,0 +1,110 @@
+.subjects {
+  .subjectName {
+    text-align: center;
+    margin-bottom: 15px;
+  }
+  padding: 15px 0 0;
+  background: #f6f8f9;
+  min-height: calc(100vh - 15px);
+  .subjectContainer {
+    min-height: calc(100vh - 95px);
+  }
+
+  .subjectMaxLength {
+    margin: 0 14px 10px;
+    background: linear-gradient(139deg, #fff6ee 0%, #ffecdd 100%) #ffffff;
+    border-radius: 10px;
+    padding: 7px 11px;
+    background: #ffffff;
+    font-size: 14px;
+    color: #ff9e5a;
+    line-height: 22px;
+  }
+  .title {
+    padding: 12px 0;
+    margin: 0 15px;
+    color: #333;
+    font-size: 16px;
+    display: flex;
+    align-items: center;
+    &::before {
+      content: ' ';
+      display: inline-block;
+      width: 3px;
+      height: 16px;
+      background: #2dc7aa;
+      border-radius: 3px;
+      margin-right: 8px;
+      vertical-align: text-bottom;
+    }
+  }
+
+  .subject-list {
+    display: flex;
+    align-items: center;
+    // justify-content: space-between;
+    // justify-content: center;
+    flex-wrap: wrap;
+    padding: 0 10px;
+
+    .subject-item {
+      position: relative;
+      width: 108px;
+      height: 108px;
+      margin-right: 5px;
+      margin-left: 5px;
+      margin-bottom: 10px;
+      border-radius: 7px;
+      overflow: hidden;
+    }
+
+    .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,
+      .van-radio__icon {
+        height: 22px;
+        .van-icon {
+          border: 0;
+          background-color: transparent;
+        }
+      }
+      .van-checkbox__icon--checked .van-icon,
+      .van-radio__icon--checked .van-icon {
+        background-color: transparent;
+        border: transparent;
+      }
+    }
+  }
+}
+.chioseBtn {
+  width: 303px;
+  height: 50px;
+}

src/views/tenantTeacherRejest/modals/chioseSuond.tsx

@@ -0,0 +1,311 @@
+import {
+  Button,
+  Checkbox,
+  CheckboxGroup,
+  Icon,
+  Image,
+  Loading,
+  Radio,
+  RadioGroup,
+  Sticky,
+  Toast
+} from 'vant'
+import { defineComponent, PropType } from 'vue'
+import styles from './chioseSuond.module.less'
+import checkBoxActive from '../images/checkBoxActive.png'
+import checkBoxDefault from '../images/checkBoxDefault.png'
+import ColResult from '@/components/col-result'
+import chioseOk from '../images/chioseOk.png'
+export default defineComponent({
+  name: 'SubjectList',
+  props: {
+    onChoice: {
+      type: Function,
+      default: (item: any) => { }
+    },
+    choiceSubjectIds: {
+      type: Array,
+      default: []
+    },
+    subjectList: {
+      type: Array,
+      default: []
+    },
+    max: {
+      // 最多可选数量
+      type: Number,
+      default: 5
+    },
+    selectType: {
+      // 选择类型，Radio：单选，Checkbox：多选
+      type: String as PropType<'Checkbox' | 'Radio'>,
+      default: 'Checkbox'
+    },
+    single: {
+      // 单选模式
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      checkBox: [],
+      checkboxRefs: [] as any,
+      radio: null as any // 单选
+    }
+  },
+  async mounted() {
+    if (this.selectType === 'Radio') {
+      this.radio = this.choiceSubjectIds[0]
+    } else {
+      this.checkBox = this.choiceSubjectIds as never[]
+    }
+  },
+  watch: {
+    choiceSubjectIds(val: any, oldVal) {
+      // 同步更新显示数据
+      this.checkBox = [...val] as never[]
+    }
+  },
+  methods: {
+    onSelect(id: number) {
+      if (this.selectType === 'Checkbox') {
+        if (
+          this.max === this.checkBox.length &&
+          !this.checkBox.includes(id as never)
+        ) {
+          Toast(`乐器最多选择${this.max}个`)
+        }
+        this.checkboxRefs[id].toggle()
+      } else if (this.selectType === 'Radio') {
+        this.radio = id
+      }
+    }
+  },
+  render() {
+    return (
+      <div class={styles.subjects}>
+        <h2 class={styles.subjectName}>选择声部</h2>
+        <div class={styles.subjectContainer}>
+          {this.subjectList.length ? (
+            this.selectType === 'Checkbox' ? (
+              <CheckboxGroup v-model={this.checkBox} max={this.max}>
+                <div class={styles.subjectMaxLength}>
+                  最多可选择{this.max}个乐器
+                </div>
+
+                {!this.single &&
+                  this.subjectList.map((item: any) =>
+                    item.subjects && item.subjects.length > 0 ? (
+                      <>
+                        <div class={styles.title}>{item.name}</div>
+                        <div class={styles['subject-list']}>
+                          {item.subjects &&
+                            item.subjects.map((sub: any) => (
+                              <div
+                                class={styles['subject-item']}
+                                onClick={() => this.onSelect(sub.id)}
+                              >
+                                <Image
+                                  src={sub.img || 'xxx'}
+                                  width="100%"
+                                  height="100%"
+                                  fit="cover"
+                                  v-slots={{
+                                    loading: () => (
+                                      <Loading type="spinner" size={20} />
+                                    )
+                                  }}
+                                />
+                                <div class={styles.topBg}>
+                                  <Checkbox
+                                    name={sub.id}
+                                    class={styles.checkbox}
+                                    disabled
+                                    ref={(el: any) =>
+                                      (this.checkboxRefs[sub.id] = el)
+                                    }
+                                    v-slots={{
+                                      icon: (props: any) => (
+                                        <Icon
+                                          name={
+                                            props.checked
+                                              ? checkBoxActive
+                                              : checkBoxDefault
+                                          }
+                                          size="20"
+                                        />
+                                      )
+                                    }}
+                                  />
+                                  <p class={styles.name}>{sub.name}</p>
+                                </div>
+                              </div>
+                            ))}
+                        </div>
+                      </>
+                    ) : null
+                  )}
+                {this.single ? (
+                  <div class={styles['subject-list']}>
+                    {this.subjectList.map((item: any) => (
+                      <div
+                        class={styles['subject-item']}
+                        onClick={() => this.onSelect(item.id)}
+                      >
+                        <Image
+                          src={item.img || 'xxx'}
+                          width="100%"
+                          height="100%"
+                          fit="cover"
+                          v-slots={{
+                            loading: () => <Loading type="spinner" size={20} />
+                          }}
+                        />
+                        <div class={styles.topBg}>
+                          <Checkbox
+                            name={item.id}
+                            class={styles.checkbox}
+                            disabled
+                            ref={(el: any) => (this.checkboxRefs[item.id] = el)}
+                            v-slots={{
+                              icon: (props: any) => (
+                                <Icon
+                                  name={
+                                    props.checked
+                                      ? checkBoxActive
+                                      : checkBoxDefault
+                                  }
+                                  size="20"
+                                />
+                              )
+                            }}
+                          />
+                          <p class={styles.name}>{item.name}</p>
+                        </div>
+                      </div>
+                    ))}
+                  </div>
+                ) : null}
+              </CheckboxGroup>
+            ) : (
+              <RadioGroup v-model={this.radio}>
+                {!this.single &&
+                  this.subjectList.map((item: any) =>
+                    item.subjects && item.subjects.length > 0 ? (
+                      <>
+                        <div class={styles.title}>{item.name}</div>
+                        <div class={styles['subject-list']}>
+                          {item.subjects &&
+                            item.subjects.map((sub: any) => (
+                              <div
+                                class={styles['subject-item']}
+                                onClick={() => this.onSelect(sub.id)}
+                              >
+                                <Image
+                                  src={sub.img || 'xxx'}
+                                  width="100%"
+                                  height="100%"
+                                  fit="cover"
+                                  v-slots={{
+                                    loading: () => (
+                                      <Loading type="spinner" size={20} />
+                                    )
+                                  }}
+                                />
+                                <div class={styles.topBg}>
+                                  <Radio
+                                    name={sub.id}
+                                    class={styles.checkbox}
+                                    v-slots={{
+                                      icon: (props: any) => (
+                                        <Icon
+                                          name={
+                                            props.checked
+                                              ? checkBoxActive
+                                              : checkBoxDefault
+                                          }
+                                          size="20"
+                                        />
+                                      )
+                                    }}
+                                  />
+                                  <p class={styles.name}>{sub.name}</p>
+                                </div>
+                              </div>
+                            ))}
+                        </div>
+                      </>
+                    ) : null
+                  )}
+                {this.single ? (
+                  <div class={styles['subject-list']}>
+                    {this.subjectList.map((item: any) => (
+                      <div
+                        class={styles['subject-item']}
+                        onClick={() => this.onSelect(item.id)}
+                      >
+                        <Image
+                          src={item.img || 'xxx'}
+                          width="100%"
+                          height="100%"
+                          fit="cover"
+                          v-slots={{
+                            loading: () => <Loading type="spinner" size={20} />
+                          }}
+                        />
+                        <div class={styles.topBg}>
+                          <Radio
+                            name={item.id}
+                            class={styles.checkbox}
+                            v-slots={{
+                              icon: (props: any) => (
+                                <Icon
+                                  name={
+                                    props.checked
+                                      ? checkBoxActive
+                                      : checkBoxDefault
+                                  }
+                                  size="20"
+                                />
+                              )
+                            }}
+                          />
+                          <p class={styles.name}>{item.name}</p>
+                        </div>
+                      </div>
+                    ))}
+                  </div>
+                ) : null}
+              </RadioGroup>
+            )
+          ) : (
+            <ColResult tips="暂无声部数据" btnStatus={false} />
+          )}
+        </div>
+
+        {this.subjectList.length > 0 && (
+          <Sticky offsetBottom={0} position="bottom">
+            <div class={'btnGroup'}>
+
+              <img src={chioseOk} class={styels.chioseBtn} alt="" onClick={() =>
+                this.onChoice(
+                  this.selectType === 'Checkbox' ? this.checkBox : this.radio
+                )
+              } />
+              {/* <Button
+                round
+                block
+                type="primary"
+                style={{ width: '96%', margin: '0 auto' }}
+
+              >
+                确定
+              </Button> */}
+            </div>
+          </Sticky>
+        )}
+      </div>
+    )
+  }
+})

vite.config.ts

@@ -12,7 +12,7 @@ function resolve(dir: string) {
 // https://vitejs.dev/config/
 // https://github.com/vitejs/vite/issues/1930 .env
 // const proxyUrl = 'https://online.colexiu.com/';
-const proxyUrl = 'https://dev.colexiu.com/'
+const proxyUrl = 'https://test.colexiu.com/'
 // const proxyUrl = 'http://192.168.3.143:8000/'
 export default defineConfig({
   base: './',
@@ -101,6 +101,10 @@ export default defineConfig({
       '/api-mall-portal': {
         target: proxyUrl,
         changeOrigin: true
+      },
+      '/api-tenant': {
+        target: proxyUrl,
+        changeOrigin: true
       }
     }
   },