|
|
|
|
@ -6,12 +6,12 @@
|
|
|
|
|
center
|
|
|
|
|
:before-close="handleClose"
|
|
|
|
|
>
|
|
|
|
|
<el-steps style="max-width: 100%;-webkit-app-region: no-drag;" :active="activeIndex" finish-status="success" simple>
|
|
|
|
|
<el-step title="1.基本信息" />
|
|
|
|
|
<el-steps style="max-width: 100%;-webkit-app-region: no-drag;height:35px" :active="activeIndex" finish-status="success" simple>
|
|
|
|
|
<el-step title="1.基本信息" @click="activeIndex=1" />
|
|
|
|
|
<el-step title="2.在校信息" />
|
|
|
|
|
</el-steps>
|
|
|
|
|
<el-form
|
|
|
|
|
style="width: 80%;margin: 0 auto;margin-top: 30px;-webkit-app-region: no-drag;"
|
|
|
|
|
style="width: 80%;margin: 0 auto;margin-top: 10px;-webkit-app-region: no-drag;"
|
|
|
|
|
:model="ruleForm"
|
|
|
|
|
:rules="rules"
|
|
|
|
|
label-width="auto"
|
|
|
|
|
@ -28,52 +28,53 @@
|
|
|
|
|
<el-input v-model="ruleForm.phoneNumber" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="验证码" prop="Code" v-if="activeIndex==1">
|
|
|
|
|
<el-input style="width:60%" v-model="ruleForm.Code" />
|
|
|
|
|
<el-button type="primary" style="margin-left:10px">发送验证码</el-button>
|
|
|
|
|
<el-input style="width:60%" v-model="ruleForm.Code" :disabled="true" />
|
|
|
|
|
<el-button type="primary" style="margin-left:10px" @click="sendcaptchaImg">发送验证码</el-button>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="设置密码" prop="password" v-if="activeIndex==1">
|
|
|
|
|
<el-input v-model="ruleForm.password" />
|
|
|
|
|
<el-input v-model="ruleForm.password" type="password" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="确认密码" prop="confirmPassword" v-if="activeIndex==1">
|
|
|
|
|
<el-input v-model="ruleForm.confirmPassword" />
|
|
|
|
|
<el-input v-model="ruleForm.confirmPassword" type="password" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="所属地区" prop="address" v-if="activeIndex==2">
|
|
|
|
|
<el-cascader
|
|
|
|
|
style="width:100%"
|
|
|
|
|
v-model="ruleForm.address"
|
|
|
|
|
:options="options"
|
|
|
|
|
:options="regionData"
|
|
|
|
|
@change="handleChange"
|
|
|
|
|
/>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="学校" prop="school" v-if="activeIndex==2">
|
|
|
|
|
<el-select
|
|
|
|
|
v-model="ruleForm.school"
|
|
|
|
|
placeholder="请选择学校"
|
|
|
|
|
style="width: 100%"
|
|
|
|
|
>
|
|
|
|
|
<el-option :value="1">小学</el-option>
|
|
|
|
|
<el-option :value="2">中学</el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
<el-cascader :options="optionsSchool" style="width:100%" v-model="ruleForm.school" @change="handleSchoolChange" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="班级" prop="class" v-if="activeIndex==2">
|
|
|
|
|
<el-select
|
|
|
|
|
v-model="ruleForm.class"
|
|
|
|
|
multiple
|
|
|
|
|
placeholder="请选择班级"
|
|
|
|
|
style="width: 100%"
|
|
|
|
|
>
|
|
|
|
|
<el-option :value="1">1班</el-option>
|
|
|
|
|
<el-option :value="2">2班</el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
<el-tree-select
|
|
|
|
|
v-model="ruleForm.class"
|
|
|
|
|
:data="gradeTree"
|
|
|
|
|
multiple
|
|
|
|
|
:render-after-expand="false"
|
|
|
|
|
style="width: 100%"
|
|
|
|
|
/>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="学科" prop="discipline" v-if="activeIndex==2">
|
|
|
|
|
<el-checkbox-group v-model="ruleForm.discipline">
|
|
|
|
|
<div v-for="item in schoolSubject" style="display: flex;">
|
|
|
|
|
<span style="width:50px">{{ item.name }}：</span>
|
|
|
|
|
<el-checkbox-group style="width:100%" v-model="ruleForm.discipline" >
|
|
|
|
|
<el-checkbox style="margin-right:10px" v-for="el in item.children" :key="el.id" :label="el.itemtitle" :value="el.id" />
|
|
|
|
|
</el-checkbox-group>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- <el-checkbox-group v-model="ruleForm.discipline">
|
|
|
|
|
<el-checkbox v-for="(item,index) in schoolSubject" :label="item.itemtitle" :key="index" :value="item.itemtitle" />
|
|
|
|
|
</el-checkbox-group> -->
|
|
|
|
|
<!-- <el-checkbox-group v-model="ruleForm.discipline">
|
|
|
|
|
<el-checkbox value="Online activities" name="type">
|
|
|
|
|
语文
|
|
|
|
|
</el-checkbox>
|
|
|
|
|
<el-checkbox value="Promotion activities" name="type">
|
|
|
|
|
数学
|
|
|
|
|
</el-checkbox>
|
|
|
|
|
</el-checkbox-group>
|
|
|
|
|
</el-checkbox-group> -->
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item v-if="activeIndex==1">
|
|
|
|
|
<div class="centerDiv">
|
|
|
|
|
@ -91,21 +92,81 @@
|
|
|
|
|
<el-button @click="dialogVisible = false">下一步</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</template> -->
|
|
|
|
|
<el-dialog
|
|
|
|
|
v-model="isImg"
|
|
|
|
|
title="人机验证"
|
|
|
|
|
width="500"
|
|
|
|
|
>
|
|
|
|
|
<span>根据图片回答相关问题</span>
|
|
|
|
|
<div style="display: flex;align-items: center;;margin-top:30px">
|
|
|
|
|
<img :src="isPeopleImg" style="width:200px;height:60px;cursor: pointer;" alt="" srcset="" @click="refreshImg">
|
|
|
|
|
<el-input v-model="ruleForm.imgCode" style="width: 250px;height:40px;margin-left:20px" placeholder="请根据图片填入答案" />
|
|
|
|
|
</div>
|
|
|
|
|
<div style="display: flex;justify-content: center;margin-top:30px">
|
|
|
|
|
<el-button type="primary" @click="sbmitImg">确定</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- <template #footer>
|
|
|
|
|
<div class="dialog-footer">
|
|
|
|
|
<el-button @click="dialogVisible = false">Cancel</el-button>
|
|
|
|
|
<el-button type="primary" @click="dialogVisible = false">
|
|
|
|
|
Confirm
|
|
|
|
|
</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</template> -->
|
|
|
|
|
</el-dialog>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script setup>
|
|
|
|
|
import { ref, defineExpose, reactive } from 'vue'
|
|
|
|
|
import { ref, defineExpose, reactive ,onMounted} from 'vue'
|
|
|
|
|
import {captchaImg,sendCode,deptTree,getDept,listClassmain,listEvaluation,signIn} from '@/api/login'
|
|
|
|
|
import { ElMessage } from 'element-plus'
|
|
|
|
|
import {setToken, removeToken } from '@/utils/auth'
|
|
|
|
|
import { regionData, codeToText } from 'element-china-area-data'
|
|
|
|
|
import array from 'lodash/array'
|
|
|
|
|
const ruleFormRef = ref(null)
|
|
|
|
|
const activeIndex=ref(1)
|
|
|
|
|
const ruleForm = reactive({
|
|
|
|
|
name: '',
|
|
|
|
|
idNumber:null,
|
|
|
|
|
phoneNumber: null,
|
|
|
|
|
Code:null,
|
|
|
|
|
password:null,
|
|
|
|
|
confirmPassword:null,
|
|
|
|
|
idNumber:'',
|
|
|
|
|
phoneNumber: '',
|
|
|
|
|
Code:'',
|
|
|
|
|
password:'',
|
|
|
|
|
confirmPassword:'',
|
|
|
|
|
class:[],
|
|
|
|
|
discipline:[],
|
|
|
|
|
school:[],
|
|
|
|
|
})
|
|
|
|
|
const isImg=ref(false)
|
|
|
|
|
const btnName=ref('发送验证码')
|
|
|
|
|
const resImg = reactive({ imgData: {} });
|
|
|
|
|
const optionsSchool=ref([])
|
|
|
|
|
const gradeTree=ref([])
|
|
|
|
|
const schoolSubject=ref([])
|
|
|
|
|
const allSubjectList = ref([])
|
|
|
|
|
const gradeDataList = [
|
|
|
|
|
[
|
|
|
|
|
{ label: '一年级', agekey: 1, checked: false, current: 1 },
|
|
|
|
|
{ label: '二年级', agekey: 2, checked: false, current: 1 },
|
|
|
|
|
{ label: '三年级', agekey: 3, checked: false, current: 1 },
|
|
|
|
|
{ label: '四年级', agekey: 4, checked: false, current: 1 },
|
|
|
|
|
{ label: '五年级', agekey: 5, checked: false, current: 1 },
|
|
|
|
|
{ label: '六年级', agekey: 6, checked: false, current: 1 },
|
|
|
|
|
],
|
|
|
|
|
[
|
|
|
|
|
{ label: '初一', agekey: 7, checked: false, current: 2 },
|
|
|
|
|
{ label: '初二', agekey: 8, checked: false, current: 2 },
|
|
|
|
|
{ label: '初三', agekey: 9, checked: false, current: 2 },
|
|
|
|
|
],
|
|
|
|
|
[
|
|
|
|
|
{ label: '高一', agekey: 10, checked: false, current: 3 },
|
|
|
|
|
{ label: '高二', agekey: 11, checked: false, current: 3 },
|
|
|
|
|
{ label: '高三', agekey: 12, checked: false, current: 3 },
|
|
|
|
|
],
|
|
|
|
|
]
|
|
|
|
|
// 人机验证图片
|
|
|
|
|
const isPeopleImg=ref(null)
|
|
|
|
|
const rules = reactive({
|
|
|
|
|
name: [
|
|
|
|
|
{ required: true, message: '请输入姓名', trigger: 'blur' },
|
|
|
|
|
@ -147,6 +208,7 @@ const rules = reactive({
|
|
|
|
|
trigger: 'change',
|
|
|
|
|
},],
|
|
|
|
|
class:[ {
|
|
|
|
|
type:'array',
|
|
|
|
|
required: true,
|
|
|
|
|
message: '请选择班级',
|
|
|
|
|
trigger: 'change',
|
|
|
|
|
@ -159,44 +221,6 @@ const rules = reactive({
|
|
|
|
|
},]
|
|
|
|
|
})
|
|
|
|
|
const dialogVisible = ref(false)
|
|
|
|
|
const options = [
|
|
|
|
|
{
|
|
|
|
|
value: 'guide',
|
|
|
|
|
label: 'Guide',
|
|
|
|
|
children: [
|
|
|
|
|
{
|
|
|
|
|
value: 'disciplines',
|
|
|
|
|
label: 'Disciplines',
|
|
|
|
|
children: [
|
|
|
|
|
{
|
|
|
|
|
value: 'consistency',
|
|
|
|
|
label: 'Consistency',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
value: 'feedback',
|
|
|
|
|
label: 'Feedback',
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
value: 'navigation',
|
|
|
|
|
label: 'Navigation',
|
|
|
|
|
children: [
|
|
|
|
|
{
|
|
|
|
|
value: 'side nav',
|
|
|
|
|
label: 'Side Navigation',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
value: 'top nav',
|
|
|
|
|
label: 'Top Navigation',
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
]
|
|
|
|
|
// 打开弹窗
|
|
|
|
|
const OpenModel = () =>{
|
|
|
|
|
dialogVisible.value=true
|
|
|
|
|
@ -213,25 +237,207 @@ const nextStep = (formEl) => {
|
|
|
|
|
formEl.validate((valid) => {
|
|
|
|
|
if (valid) {
|
|
|
|
|
activeIndex.value=2
|
|
|
|
|
// 获取部门列表
|
|
|
|
|
deptTree({phone:ruleForm.phoneNumber}).then(res=>{
|
|
|
|
|
optionsSchool.value=res.data
|
|
|
|
|
optionsSchool.value.forEach(item=>{
|
|
|
|
|
item.value=item.id
|
|
|
|
|
if(!item.children){
|
|
|
|
|
item.disabled=true
|
|
|
|
|
}
|
|
|
|
|
if(item.children){
|
|
|
|
|
item.children.forEach(child=>{
|
|
|
|
|
child.value=child.id
|
|
|
|
|
if(!child.children){
|
|
|
|
|
child.disabled=true
|
|
|
|
|
}
|
|
|
|
|
if(child.children){
|
|
|
|
|
child.children.forEach(grandson=>{
|
|
|
|
|
grandson.value=grandson.id
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
getSubject()
|
|
|
|
|
console.log(res)
|
|
|
|
|
})
|
|
|
|
|
console.log('submit!')
|
|
|
|
|
} else {
|
|
|
|
|
console.log('error submit!')
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
// 获取所有学科
|
|
|
|
|
const getSubject = async ()=>{
|
|
|
|
|
const rows= await listEvaluation({ itemkey: "subject", pageSize: 500 })
|
|
|
|
|
console.log(rows,'所有学科')
|
|
|
|
|
allSubjectList.value = rows.data
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
const submitForm = async (formEl) => {
|
|
|
|
|
if (!formEl) return
|
|
|
|
|
await formEl.validate((valid, fields) => {
|
|
|
|
|
if (valid) {
|
|
|
|
|
console.log(ruleForm)
|
|
|
|
|
var form={
|
|
|
|
|
mobile:ruleForm.phoneNumber,
|
|
|
|
|
code:ruleForm.Code,
|
|
|
|
|
name:ruleForm.name,
|
|
|
|
|
idCard:ruleForm.idNumber,
|
|
|
|
|
password:ruleForm.password,
|
|
|
|
|
confirmPassword:ruleForm.confirmPassword,
|
|
|
|
|
schoolId:ruleForm.school.join(','),
|
|
|
|
|
classIds:ruleForm.class.join(','),
|
|
|
|
|
subjectIds:ruleForm.discipline.join(','),
|
|
|
|
|
area:ruleForm.address.join(','),
|
|
|
|
|
}
|
|
|
|
|
signIn(form).then(res=>{
|
|
|
|
|
if(res.code==200){
|
|
|
|
|
ElMessage.success('注册成功')
|
|
|
|
|
if (ruleFormRef.value) ruleFormRef.value.resetFields()
|
|
|
|
|
ruleForm={
|
|
|
|
|
name: '',
|
|
|
|
|
idNumber:'',
|
|
|
|
|
phoneNumber: '',
|
|
|
|
|
Code:'',
|
|
|
|
|
password:'',
|
|
|
|
|
confirmPassword:'',
|
|
|
|
|
class:[],
|
|
|
|
|
discipline:[],
|
|
|
|
|
school:[],
|
|
|
|
|
}
|
|
|
|
|
activeIndex.value=1
|
|
|
|
|
dialogVisible.value=false
|
|
|
|
|
}else{
|
|
|
|
|
ElMessage.error(res.msg)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
console.log('submit!')
|
|
|
|
|
} else {
|
|
|
|
|
console.log('error submit!', fields)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
// 发送验证码
|
|
|
|
|
const sendcaptchaImg=()=>{
|
|
|
|
|
if(ruleForm.phoneNumber){
|
|
|
|
|
const pattern = /^1[3-9]\d{9}$/;
|
|
|
|
|
if( pattern.test(ruleForm.phoneNumber) ){
|
|
|
|
|
captchaImg({mobile:ruleForm.phoneNumber}).then(res=>{
|
|
|
|
|
ruleForm.imgCode=null
|
|
|
|
|
isImg.value=true
|
|
|
|
|
isPeopleImg.value='data:image/jpg;base64,'+res.img
|
|
|
|
|
if(res.token){
|
|
|
|
|
setToken(res.token)
|
|
|
|
|
}
|
|
|
|
|
resImg.imgData=res
|
|
|
|
|
})
|
|
|
|
|
}else{
|
|
|
|
|
ElMessage.error('请输入正确的手机号码')
|
|
|
|
|
}
|
|
|
|
|
// captchaImg({mobile:ruleForm.phoneNumber}).then(res=>{
|
|
|
|
|
// console.log('res->', res)
|
|
|
|
|
// })
|
|
|
|
|
}else{
|
|
|
|
|
ElMessage.error('请输入手机号码')
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
// 刷新
|
|
|
|
|
const refreshImg=()=>{
|
|
|
|
|
captchaImg({mobile:ruleForm.phoneNumber}).then(res=>{
|
|
|
|
|
isPeopleImg.value='data:image/jpg;base64,'+res.img
|
|
|
|
|
if(res.token){
|
|
|
|
|
setToken(res.token)
|
|
|
|
|
}
|
|
|
|
|
resImg.imgData=res
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
// 提交人机验证
|
|
|
|
|
const sbmitImg=()=>{
|
|
|
|
|
if(ruleForm.imgCode){
|
|
|
|
|
sendCode({mobile:ruleForm.phoneNumber,code:ruleForm.imgCode,uuid:resImg.imgData.uuid}).then(res=>{
|
|
|
|
|
if(res.code==200){
|
|
|
|
|
ruleForm.Code=res.data
|
|
|
|
|
isImg.value=false
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
})
|
|
|
|
|
}else{
|
|
|
|
|
ElMessage.error('请根据图片输入验证码')
|
|
|
|
|
}
|
|
|
|
|
//
|
|
|
|
|
}
|
|
|
|
|
const handleChange = (value) => {
|
|
|
|
|
console.log('选中的地址值：', value);
|
|
|
|
|
};
|
|
|
|
|
const handleSchoolChange= async ()=>{
|
|
|
|
|
ruleForm.discipline=[];
|
|
|
|
|
ruleForm.class=[];
|
|
|
|
|
getDept({deptId:ruleForm.school[2]}).then(res =>{
|
|
|
|
|
if(res.data.studying && res.data.studying.length){
|
|
|
|
|
let studying = res.data.studying.split(',')
|
|
|
|
|
let ary = []
|
|
|
|
|
studying.forEach(item =>{
|
|
|
|
|
let obj = {
|
|
|
|
|
name: item,
|
|
|
|
|
children: []
|
|
|
|
|
}
|
|
|
|
|
allSubjectList.value.forEach(el =>{
|
|
|
|
|
if(item == el.edustage){
|
|
|
|
|
obj.children.push(el)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
ary.push(obj)
|
|
|
|
|
})
|
|
|
|
|
schoolSubject.value = ary
|
|
|
|
|
}
|
|
|
|
|
else{
|
|
|
|
|
schoolSubject.value = []
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
listClassmain( {entpid: ruleForm.school[2], pageSize: 500, status: 'open'}).then(res=>{
|
|
|
|
|
gradeTree.value = groupByCondition(res.rows, item => item.agekey);
|
|
|
|
|
console.log(gradeTree.value,'班级')
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
//将所有班级筛选成二级的数组
|
|
|
|
|
const groupByCondition = (arr, condition)=>{
|
|
|
|
|
// 分组结果存储为对象
|
|
|
|
|
const groups = arr.reduce((groups, item) => {
|
|
|
|
|
const groupKey = condition(item);
|
|
|
|
|
item.label = item.caption
|
|
|
|
|
item.value = item.id
|
|
|
|
|
groups[groupKey] = groups[groupKey] || [];
|
|
|
|
|
groups[groupKey].push(item);
|
|
|
|
|
return groups;
|
|
|
|
|
}, {});
|
|
|
|
|
// 构建新的数据结构
|
|
|
|
|
const formattedGroups = Object.keys(groups).map(key => ({
|
|
|
|
|
label: gradeName(key),
|
|
|
|
|
value: key,
|
|
|
|
|
children: groups[key]
|
|
|
|
|
}));
|
|
|
|
|
return formattedGroups;
|
|
|
|
|
}
|
|
|
|
|
//key对应学段年级
|
|
|
|
|
const gradeName = (key) =>{
|
|
|
|
|
//先把二级数组转化为一级数组，用于筛选
|
|
|
|
|
const flatGradeDataList = gradeDataList.flat();
|
|
|
|
|
const currentIndex = flatGradeDataList.findIndex(item => item.agekey === Number(key));
|
|
|
|
|
if(currentIndex !== -1){
|
|
|
|
|
return flatGradeDataList[currentIndex].label;
|
|
|
|
|
}else{
|
|
|
|
|
//社团的处理
|
|
|
|
|
const defaultLabel = '社团';
|
|
|
|
|
flatGradeDataList[currentIndex] = { ...flatGradeDataList[currentIndex], label: defaultLabel };
|
|
|
|
|
return defaultLabel;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
onMounted(()=>{
|
|
|
|
|
|
|
|
|
|
})
|
|
|
|
|
defineExpose({
|
|
|
|
|
OpenModel,
|
|
|
|
|
})
|
|
|
|
|
|