You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1332 lines
51 KiB
1332 lines
51 KiB
<template> |
|
<div class="wrap"> |
|
<div class="header"> |
|
<el-avatar :size="80" :src="avatar" class="Headtop"></el-avatar> |
|
<div style="color:#9278FF;font-size:14px;font-family:MicrosoftYaHei;margin-top:5px;"> |
|
<el-upload |
|
class="upload-demo" |
|
:headers="{token}" |
|
:action="this.api.updateUserAvatars" |
|
name="file" |
|
:limit="1" |
|
:on-success="getRes" |
|
> |
|
<div>点击更改头像</div> |
|
</el-upload> |
|
</div> |
|
</div> |
|
|
|
<div class="card" style="margin-top: -65px"> |
|
<p class="block-title" style="display: flex;justify-content: space-between;align-items: center;"> |
|
<span><img src="../../assets/img/person/user.png" alt=""> 用户信息</span> |
|
<el-button type="primary" size="small" v-preventReClick @click="save">更新资料</el-button> |
|
</p> |
|
<p class="meta-title"> |
|
<span>个人信息</span> |
|
</p> |
|
<div class="information"> |
|
<div class="line"> |
|
<div class="item"> |
|
<span>姓名</span> |
|
<input id="username" class="username" placeholder="请输入姓名" type="text" v-model="form.userName"/> |
|
</div> |
|
<div class="item"> |
|
<span>所在国家</span> |
|
<el-select |
|
v-model="form.countries" |
|
placeholder |
|
> |
|
<el-option |
|
v-for="item in countryList" |
|
:key="item.value" |
|
:label="item.label" |
|
:value="item.value" |
|
></el-option> |
|
</el-select> |
|
</div> |
|
</div> |
|
<div class="line"> |
|
<div class="item"> |
|
<span>性别</span> |
|
<div class="sexRadio"> |
|
<el-radio v-model="form.sex" :label="1">男</el-radio> |
|
<el-radio v-model="form.sex" :label="2">女</el-radio> |
|
</div> |
|
</div> |
|
<div class="item"> |
|
<span>所在地</span> |
|
<div class="selects"> |
|
<el-select |
|
v-model="form.countries" |
|
placeholder |
|
> |
|
<el-option |
|
v-for="item in countryList" |
|
:key="item.value" |
|
:label="item.label" |
|
:value="item.value" |
|
></el-option> |
|
</el-select> |
|
<el-select |
|
v-model="form.provinceId" |
|
placeholder |
|
@change="id => getCity(id,1)" |
|
> |
|
<el-option |
|
v-for="item in provinceList" |
|
:key="item.provinceId" |
|
:label="item.provinceName" |
|
:value="item.provinceId" |
|
></el-option> |
|
</el-select> |
|
<el-select |
|
v-model="form.cityId" |
|
placeholder |
|
:disabled="form.provinceId ? false : true" |
|
> |
|
<el-option |
|
v-for="item in cityList" |
|
:key="item.cityId" |
|
:label="item.cityName" |
|
:value="item.cityId" |
|
></el-option> |
|
</el-select> |
|
</div> |
|
</div> |
|
</div> |
|
<div class="line"> |
|
<div class="item"> |
|
<span>出生年月日</span> |
|
<el-date-picker |
|
v-model="form.dateBirth" |
|
:clearable="false" |
|
class="block-right" |
|
type="date"> |
|
</el-date-picker> |
|
</div> |
|
<div class="item"> |
|
<span>证件</span> |
|
<input onkeyup="value=value.replace(/[^\w\.\/]/ig,'')" id="idnumber" class="idnumber" placeholder="请输入证件" type="text" v-model="form.idNumber"/> |
|
</div> |
|
</div> |
|
<div class="line"> |
|
<div class="item"> |
|
<span>教育程度</span> |
|
<el-select |
|
v-model="form.educationDegree" |
|
placeholder="请选择教育程度" |
|
> |
|
<el-option |
|
v-for="(item,index) in educationDegreeList" |
|
:key="index" |
|
:label="item.name" |
|
:value="item.value" |
|
></el-option> |
|
</el-select> |
|
</div> |
|
<div class="item"> |
|
<span>所在学校</span> |
|
<el-select |
|
v-model="form.schoolId" |
|
filterable |
|
placeholder="请选择所在学校" |
|
> |
|
<el-option |
|
v-for="item in schoolList" |
|
:key="item.value" |
|
:label="item.schoolName" |
|
:value="item.schoolId" |
|
></el-option> |
|
</el-select> |
|
</div> |
|
</div> |
|
<div class="line"> |
|
<div class="item"> |
|
<span>手机号</span> |
|
<div class="btns flex-between"> |
|
<span>{{form.phone}}</span> |
|
<el-button v-if="form.phone" type="primary" size="small" @click="bindPhone">更换</el-button> |
|
<el-button v-else type="primary" size="small" @click="bindPhone">绑定</el-button> |
|
</div> |
|
</div> |
|
<div class="item"> |
|
<span>邮箱</span> |
|
<div class="btns flex-between"> |
|
<span>{{form.email}}</span> |
|
<el-button v-if="form.email" type="primary" size="small" @click="bindEmail">更换</el-button> |
|
<el-button v-else type="primary" size="small" @click="bindEmail">绑定</el-button> |
|
</div> |
|
</div> |
|
</div> |
|
<div class="line"> |
|
<div class="item"> |
|
<span>微信号</span> |
|
<input type="text" class="username" placeholder="请输入微信号" v-model="form.wechatId"/> |
|
</div> |
|
</div> |
|
|
|
<p class="meta-title plus"> |
|
<span>个人档案</span> |
|
<el-button type="text" icon="el-icon-plus" @click="addArch">新增</el-button> |
|
</p> |
|
</div> |
|
|
|
<div class="information" style="margin-top: 20px;"> |
|
<div class="archives" v-for="(archive,index) in archivesList" :key="index" v-show="index == 0 || showArch"> |
|
<div class="line"> |
|
<div class="item"> |
|
<span>职业</span> |
|
<el-select |
|
v-model="archive.personalCareerId" |
|
placeholder="选择职业" |
|
> |
|
<el-option |
|
v-for="item in occupationList" |
|
:key="item.value" |
|
:label="item.label" |
|
:value="item.value" |
|
></el-option> |
|
</el-select> |
|
</div> |
|
<div class="item"> |
|
<span>国家</span> |
|
<el-select |
|
v-model="form.countries" |
|
placeholder |
|
> |
|
<el-option |
|
v-for="item in countryList" |
|
:key="item.value" |
|
:label="item.label" |
|
:value="item.value" |
|
></el-option> |
|
</el-select> |
|
</div> |
|
</div> |
|
<div class="line"> |
|
<div class="item"> |
|
<span>学校名称</span> |
|
<el-select |
|
v-model="archive.schoolId" |
|
filterable |
|
placeholder="选择学校" |
|
@change="id => getSchoolName(id,index)" |
|
> |
|
<el-option |
|
v-for="item in schoolList" |
|
:key="item.value" |
|
:label="item.schoolName" |
|
:value="item.schoolId" |
|
></el-option> |
|
</el-select> |
|
</div> |
|
<div class="item"> |
|
<span>专业学科</span> |
|
<el-select |
|
v-model="archive.disciplineId" |
|
placeholder="选择专业学科" |
|
@change="id => getItemProfessionalClass(id,index)" |
|
@clear="() => clearItemClass(index)" |
|
> |
|
<el-option |
|
v-for="item in subjectList" |
|
:key="item.value" |
|
:label="item.disciplineName" |
|
:value="item.disciplineId" |
|
></el-option> |
|
</el-select> |
|
</div> |
|
</div> |
|
<div class="line"> |
|
<div class="item"> |
|
<span>专业类</span> |
|
<el-select |
|
v-model="archive.professionalClassId" |
|
placeholder="选择专业类" |
|
:disabled="archive.disciplineId ? false : true" |
|
@change="id => getItemProfessional(id,index)" |
|
@clear="() => clearItemProfess(index)" |
|
> |
|
<el-option |
|
v-for="item in archive.ProfessionalClassList" |
|
:key="item.professionalClassId" |
|
:label="item.professionalClassName" |
|
:value="item.professionalClassId" |
|
></el-option> |
|
</el-select> |
|
</div> |
|
<div class="item"> |
|
<span>专业</span> |
|
<el-select |
|
v-model="archive.professionalId" |
|
placeholder="选择专业" |
|
:disabled="archive.professionalClassId ? false : true" |
|
@change="getItemStuGrade" |
|
> |
|
<el-option |
|
v-for="item in archive.ProfessionalList" |
|
:key="item.professionalId" |
|
:label="item.professionalName" |
|
:value="item.professionalId" |
|
></el-option> |
|
</el-select> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
<div class="fold" v-if="archivesList.length > 1"> |
|
<img :class="{ 'arrowTransform': showArch, 'arrowTransformReturn': !showArch}" style="width: 21px;height: 17px;" src="../../assets/img/person/open.png" alt="" @click="foldArch"> |
|
</div> |
|
</div> |
|
|
|
<div class="card mgb20"> |
|
<p class="block-title" style="margin-bottom: 15px"> |
|
<span><img src="../../assets/img/person/manag.png" alt=""> 账号信息</span> |
|
</p> |
|
<div class="information"> |
|
<div class="line"> |
|
<div class="item"> |
|
<span>用户账号</span> |
|
<input |
|
id="account" |
|
type="text" |
|
class="username" placeholder="请输入用户账号" |
|
v-model="form.account" |
|
/> |
|
</div> |
|
<div class="item"> |
|
<span>密码</span> |
|
<div class="btns flex-between"> |
|
<p>******</p> |
|
<el-button type="primary" size="small" @click="bindPassword">更换</el-button> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
<el-dialog |
|
:title="form.email ? '更换邮箱' : '绑定邮箱'" |
|
:visible.sync="emailVisible" |
|
:close-on-click-modal="false" |
|
@close="closeEmail" |
|
width="30%"> |
|
<el-form ref="form" :model="form" label-width="60px"> |
|
<el-form-item label="邮箱"> |
|
<el-input placeholder="请输入邮箱" v-model="email"></el-input> |
|
</el-form-item> |
|
<el-form-item label="验证码"> |
|
<div class="flex-between"> |
|
<el-input v-model="emailCode" placeholder="请输入验证码" maxlength="6"></el-input> |
|
<el-button style="margin-left: 10px" type="text" @click="sendEmailCode" :disabled="emailDisabled">{{emailBtnText}}</el-button> |
|
</div> |
|
</el-form-item> |
|
</el-form> |
|
<span slot="footer" class="dialog-footer"> |
|
<el-button @click="emailVisible = false">取 消</el-button> |
|
<el-button type="primary" @click="emailSubmit">确 定</el-button> |
|
</span> |
|
</el-dialog> |
|
|
|
<el-dialog |
|
:title="form.phone ? '更换手机号' : '绑定手机号'" |
|
:visible.sync="phoneVisible" |
|
:close-on-click-modal="false" |
|
@close="closePhone" |
|
width="30%"> |
|
<el-form ref="form" :model="form" label-width="60px"> |
|
<el-form-item label="手机号"> |
|
<el-input placeholder="请输入手机号" v-model="phone" maxlength="11"></el-input> |
|
</el-form-item> |
|
<el-form-item label="验证码"> |
|
<div class="flex-between"> |
|
<el-input v-model="phoneCode" placeholder="请输入验证码" maxlength="6"></el-input> |
|
<el-button style="margin-left: 10px" type="text" @click="sendPhoneCode" :disabled="phoneDisabled">{{phoneBtnText}}</el-button> |
|
</div> |
|
</el-form-item> |
|
</el-form> |
|
<span slot="footer" class="dialog-footer"> |
|
<el-button @click="phoneVisible = false">取 消</el-button> |
|
<el-button type="primary" @click="phoneSubmit">确 定</el-button> |
|
</span> |
|
</el-dialog> |
|
|
|
<el-dialog |
|
title="更换密码" |
|
:visible.sync="passwordVisible" |
|
:close-on-click-modal="false" |
|
@close="closePassword" |
|
width="30%"> |
|
<el-form ref="passwordForm" :model="form" label-width="60px"> |
|
<el-form-item label="原密码"> |
|
<el-input type="password" v-model="passwordForm.password" placeholder="请输入原密码"></el-input> |
|
</el-form-item> |
|
<el-form-item label="新密码"> |
|
<el-input type="password" v-model="passwordForm.newPassword" placeholder="请输入新密码" @keyup.enter.native="editPassword"></el-input> |
|
</el-form-item> |
|
<el-form-item label="新密码"> |
|
<el-input type="password" v-model="passwordForm.reNewPassword" placeholder="请确认新密码" @keyup.enter.native="editPassword"></el-input> |
|
</el-form-item> |
|
</el-form> |
|
<span slot="footer" class="dialog-footer"> |
|
<el-button @click="passwordVisible = false">取 消</el-button> |
|
<el-button type="primary" @click="editPassword">确 定</el-button> |
|
</span> |
|
</el-dialog> |
|
</div> |
|
</template> |
|
|
|
<script> |
|
export default { |
|
data() { |
|
return { |
|
avatar: 'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png', |
|
token: sessionStorage.getItem('token'), |
|
form: { |
|
name:'', |
|
workNumber:'', |
|
password:"", |
|
phone:'', |
|
email:'', |
|
provinceName:'', |
|
cityName:'', |
|
schoolName:'', |
|
professionalName:'', |
|
experimentName:'', |
|
sex: 1, |
|
dateBirth: '', |
|
educationDegree: '' |
|
}, |
|
profession: [ |
|
{ |
|
value: '1', |
|
label: '学生' |
|
}, |
|
{ |
|
value: '2', |
|
label: '老师' |
|
} |
|
], |
|
emailVisible: false, |
|
passwordVisible: false, |
|
phoneVisible: false, |
|
showArch: false, |
|
passwordForm: { |
|
password: '', |
|
newPassword: '', |
|
reNewPassword: '' |
|
}, |
|
sexList: [ |
|
{ |
|
name: '男', |
|
value: 1 |
|
}, |
|
{ |
|
name: '女', |
|
value: 2 |
|
} |
|
], |
|
countryList: [ |
|
{ |
|
label: '中国' |
|
} |
|
], |
|
form: {}, |
|
occupationList: [{ |
|
value: 1, |
|
label: '学生' |
|
}, |
|
{ |
|
value: 2, |
|
label: '老师' |
|
}], |
|
provinceList: this.$store.state.provinceList, //省份 |
|
cityList: [], //城市 |
|
// 教育程度 |
|
educationDegreeList: [ |
|
{ |
|
name: '专科', |
|
value: 1 |
|
}, |
|
{ |
|
name: '本科', |
|
value: 2 |
|
}, |
|
{ |
|
name: '硕士', |
|
value: 3 |
|
}, |
|
{ |
|
name: '博士', |
|
value: 4 |
|
}, |
|
{ |
|
name: '其他', |
|
value: 5 |
|
} |
|
], |
|
subjectList: [], //专业学科 |
|
ProfessionalClassList: [], //专业类 |
|
ProfessionalList: [], //专业 |
|
schoolList: [], |
|
|
|
archivesList: [], |
|
archivesForm: { |
|
//个人档案 |
|
personalCareerId: '', //职业 |
|
schoolId: '', //院校 |
|
schoolName: '', //院校名称 |
|
professionalClassId: '', //专业类 |
|
professionalClassName: '', //专业类名称 |
|
disciplineId: '', //专业学科 |
|
disciplineName: '', //专业学科名称 |
|
professionalId: '', //专业 |
|
professionalName: '', //专业名称 |
|
}, |
|
email: '', |
|
emailBtnText: '发送验证码', |
|
emailCode: '', |
|
emailDisabled: false, |
|
emailTimer: null, |
|
phone: '', |
|
phoneBtnText: '发送验证码', |
|
phoneCode: '', |
|
phoneDisabled: false, |
|
phoneTimer: null, |
|
originAccount: '', |
|
accountReapeat: false |
|
}; |
|
}, |
|
mounted() { |
|
this.getdata() |
|
this.getProvince() |
|
this.getSchoolData() |
|
this.getSubject() |
|
}, |
|
methods: { |
|
getProvince(){ |
|
this.$get(this.api.queryProvince).then(res => { |
|
this.provinceList = res.list |
|
this.$store.commit("provinceData", { provinceList : this.provinceList}); |
|
}).catch(res => {}); |
|
}, |
|
// 获取城市 |
|
getCity(id,type,index){ |
|
if(type == 1){ |
|
if(this.form.provinceId){ |
|
this.form.cityId = 1 |
|
this.getCityData(type,index) |
|
} |
|
}else{ |
|
if(this.archivesList[index].provinceId){ |
|
this.archivesList[index].provinceName = this.provinceList[id-1].provinceName |
|
this.archivesList[index].cityId = 1 |
|
this.getCityData(type,index) |
|
} |
|
} |
|
}, |
|
getCityData(type,index){ |
|
let provinceId = type == 1 ? this.form.provinceId : this.archivesList[index].provinceId |
|
this.$get(this.api.queryCity,{provinceId}).then(res => { |
|
if(type == 1){ |
|
this.cityList = res.list |
|
}else{ |
|
this.archivesList[index].cityList = res.list |
|
} |
|
}).catch(res => {}); |
|
}, |
|
getCityName(id,index){ |
|
this.archivesList[index].cityName = this.archivesList[index].cityList[id-1].cityName |
|
}, |
|
getSchoolName(id,index){ |
|
this.archivesList[index].schoolName = this.schoolList[id-1].schoolName |
|
}, |
|
// 获取学校名称 |
|
getSchoolData(){ |
|
this.$get(this.api.querySchoolData,{schoolName: '',provinceId: '',cityId: ''}).then(res => { |
|
this.schoolList = res.list |
|
}).catch(res => {}) |
|
}, |
|
async accountChange(){ |
|
if(this.originAccount != this.form.account){ |
|
let res = await this.$get(this.api.queryAccountIsExist, { |
|
account: this.form.account, |
|
schoolId: this.form.schoolId |
|
}); |
|
if(res.message.user.length){ |
|
this.$message.warning('该账号已存在'); |
|
this.accountReapeat = true |
|
}else{ |
|
this.accountReapeat = false |
|
} |
|
}else{ |
|
this.accountReapeat = false |
|
} |
|
}, |
|
//取得头像地址 |
|
getRes(res) { |
|
this.avatar = res.message |
|
this.$store.commit('userPhoto',{avatar:res.message}) |
|
}, |
|
getdata() { |
|
this.$get(this.api.queryUserInfoDetails).then(res => { |
|
let userInfo = res.result.hrUserInfo |
|
let schoolId = userInfo.schoolId |
|
this.form = Object.assign(userInfo,res.result.userAccountList[0]) |
|
this.form.schoolId = schoolId |
|
this.form.accountId = userInfo.id |
|
this.originAccount = this.form.account |
|
this.archivesList = res.result.personalFileList |
|
if(userInfo.userAvatars) this.avatar = userInfo.userAvatars |
|
this.$nextTick(() => { |
|
if(this.form.provinceId){ |
|
this.getCityData(1) |
|
} |
|
if(this.archivesList.length != 0){ |
|
this.archivesList.forEach((e,k) =>{ |
|
this.$set(e, 'subjectList', this.subjectList); |
|
this.$set(e, 'disciplineId', e.disciplineId ? e.disciplineId : ''); |
|
this.$set(e, 'disciplineName', e.disciplineName ? e.disciplineName : ''); |
|
this.$set(e, 'professionalClassId', e.professionalClassId ? e.professionalClassId : ''); |
|
this.$set(e, 'professionalClassName', e.professionalClassName ? e.professionalClassName : ''); |
|
this.$set(e, 'professionalId', e.professionalId ? e.professionalId : ''); |
|
this.$set(e, 'professionalName', e.professionalName ? e.professionalName : ''); |
|
this.$set(e, 'schoolId', e.schoolId ? e.schoolId : ''); |
|
this.$set(e, 'schoolName', e.schoolName ? e.schoolName : ''); |
|
|
|
if(e.disciplineId){ |
|
this.$post(this.api.queryCourseProfessionalClass,[e.disciplineId]).then(res => { |
|
this.$set(e, 'ProfessionalClassList', res.result); |
|
}).catch(res => {}); |
|
}else{ |
|
this.$set(e, 'ProfessionalClassList', []); |
|
} |
|
if(e.professionalClassId){ |
|
this.$get(this.api.queryCourseProfessional,{ professionalClassId: e.professionalClassId }).then(res => { |
|
this.$set(e, 'ProfessionalList', res.result); |
|
}).catch(res => {}); |
|
}else{ |
|
this.$set(e, 'ProfessionalList', []); |
|
} |
|
}) |
|
}else{ |
|
this.concatArch(1) |
|
} |
|
}) |
|
}).catch(err => {}) |
|
}, |
|
concatArch(isLoadData) { |
|
this.archivesList = this.archivesList.concat({ |
|
isNew: true, |
|
personalCareerId: '', |
|
schoolId: '', |
|
schoolName: '', |
|
subjectList: this.subjectList, |
|
disciplineId: '', |
|
disciplineName: '', |
|
ProfessionalClassList: [], |
|
professionalClassId: '', |
|
professionalClassName: '', |
|
ProfessionalList: [], |
|
professionalId: '', |
|
professionalName: '', |
|
personalFileId: '' |
|
}) |
|
// if(!isLoadData){ |
|
// this.$nextTick(() => { |
|
// document.body.scrollTop = document.querySelector('.content-box').scrollHeight |
|
// document.documentElement.scrollTop = document.querySelector('.content-box').scrollHeight |
|
// }) |
|
// } |
|
}, |
|
addArch() { |
|
let isEmpty = false |
|
this.archivesList.forEach((n,k) => { |
|
if(!n.personalCareerId) isEmpty = true |
|
}) |
|
if(isEmpty) return this.$message.warning('请选择职业') |
|
this.showArch = true |
|
this.concatArch() |
|
}, |
|
bindEmail() { |
|
this.email = this.form.email |
|
this.emailVisible = true |
|
}, |
|
bindPhone() { |
|
this.phone = this.form.phone |
|
this.phoneVisible = true |
|
}, |
|
bindPassword() { |
|
this.passwordVisible = true |
|
}, |
|
editPassword() { |
|
if(!this.passwordForm.password) return this.$message.warning('请输入原密码') |
|
if(!this.passwordForm.newPassword) return this.$message.warning('请输入新密码') |
|
if(!this.passwordForm.reNewPassword) return this.$message.warning('请确认新密码') |
|
if(this.passwordForm.newPassword.length < 6 || this.passwordForm.reNewPassword.length < 6) return this.$message.warning('请输入6位数以上的密码') |
|
if(this.passwordForm.newPassword !== this.passwordForm.reNewPassword) return this.$message.warning('输入的新密码不一致，请重新确认') |
|
if(this.passwordForm.password === this.passwordForm.newPassword) return this.$message.warning('原密码跟新密码不能一致') |
|
|
|
let data = this.passwordForm |
|
data.accountId = this.form.userId |
|
this.$post(this.api.examinePassword,data).then(res => { |
|
if(res.status == 200){ |
|
this.$message.success('更换成功') |
|
this.passwordVisible = false |
|
}else{ |
|
this.$message.error(res.message) |
|
} |
|
}).catch(err => {}) |
|
}, |
|
closePassword() { |
|
this.passwordForm = { |
|
password: '', |
|
newPassword: '', |
|
reNewPassword: '' |
|
} |
|
}, |
|
foldArch() { |
|
this.showArch = !this.showArch |
|
// this.$nextTick(() => { |
|
// document.body.scrollTop = document.querySelector('.content-box').scrollHeight |
|
// document.documentElement.scrollTop = document.querySelector('.content-box').scrollHeight |
|
// }) |
|
}, |
|
// 获取学科类别 |
|
getSubject(){ |
|
this.$post(this.api.queryCourseDiscipline).then(res => { |
|
this.subjectList = res.result |
|
}).catch(res => {}) |
|
}, |
|
// 清除学科类别 |
|
clearClass(){ |
|
this.archivesForm.professionalClassId = '', |
|
this.archivesForm.professionalId = '' |
|
}, |
|
// 获取专业类 |
|
getProfessionalClass(val){ |
|
this.clearClass() |
|
if(val){ |
|
let obj = {} |
|
obj = this.subjectList.find((item)=>{ |
|
return item.disciplineId === val |
|
}); |
|
this.archivesForm.disciplineName = obj.disciplineName |
|
this.getProfessionalClassData(val) |
|
} |
|
}, |
|
clearItemClass(index){ |
|
this.archivesList[index].professionalClassId = '' |
|
this.archivesList[index].professionalClassName = '' |
|
this.archivesList[index].professionalId = '' |
|
this.archivesList[index].professionalName = '' |
|
// this.archivesList.map(e =>{ |
|
// if(e.disciplineId == item){ |
|
// e.professionalClassId = '', |
|
// e.professionalClassName = '', |
|
// e.professionalId = '', |
|
// e.professionalName = '' |
|
// } |
|
// }) |
|
}, |
|
getItemProfessionalClass(item,index){ |
|
this.clearItemClass(index) |
|
if(item){ |
|
let obj = {} |
|
obj = this.subjectList.find(r =>{ |
|
return r.disciplineId === item |
|
}); |
|
this.$post(this.api.queryCourseProfessionalClass,[item]).then(res => { |
|
this.archivesList.map(e =>{ |
|
if(e.disciplineId == item){ |
|
e.ProfessionalClassList = res.result |
|
e.disciplineName = obj.disciplineName |
|
} |
|
}) |
|
}).catch(res => {}) |
|
} |
|
}, |
|
getProfessionalClassData(value){ |
|
this.$post(this.api.queryCourseProfessionalClass,[value]).then(res => { |
|
this.ProfessionalClassList = res.result |
|
}).catch(res => {}) |
|
}, |
|
// 清除专业类 |
|
clearProfess(){ |
|
this.archivesForm.professionalId = '' |
|
}, |
|
// 获取专业 |
|
getProfessional(val){ |
|
this.clearProfess() |
|
if(val){ |
|
let obj = {} |
|
obj = this.ProfessionalClassList.find((item)=>{ |
|
return item.professionalClassId === val |
|
}) |
|
this.archivesForm.professionalClassName = obj.professionalClassName |
|
this.getProfessionalData(val) |
|
} |
|
}, |
|
clearItemProfess(index){ |
|
this.archivesList[index].professionalId = '' |
|
this.archivesList[index].professionalName = '' |
|
// this.archivesList.map(e =>{ |
|
// if(e.professionalClassId == item){ |
|
// e.professionalId = '', |
|
// e.professionalName = '' |
|
// } |
|
// }) |
|
}, |
|
getItemProfessional(item,index){ |
|
this.clearItemProfess(index) |
|
if(item){ |
|
this.$get(this.api.queryCourseProfessional,{ professionalClassId: item }).then(res => { |
|
this.archivesList.map(e =>{ |
|
if(e.professionalClassId == item){ |
|
let obj = {} |
|
obj = e.ProfessionalClassList.find(r =>{ |
|
return r.professionalClassId === item |
|
}) |
|
e.ProfessionalList = res.result |
|
e.professionalClassName = obj.professionalClassName |
|
} |
|
}) |
|
}).catch(res => {}) |
|
} |
|
}, |
|
getProfessionalData(value){ |
|
this.$get(this.api.queryCourseProfessional,{professionalClassId: value}).then(res => { |
|
this.ProfessionalList = res.result |
|
}).catch(res => {}) |
|
}, |
|
// 获取专业名称 |
|
getStuGrade(val){ |
|
if(val){ |
|
let obj = {} |
|
obj = this.ProfessionalList.find(r =>{ |
|
return r.professionalId === val; |
|
}) |
|
this.archivesForm.professionalName = obj.professionalName |
|
} |
|
}, |
|
getItemStuGrade(item){ |
|
if(item){ |
|
this.archivesList.map(e =>{ |
|
if(e.professionalId == item){ |
|
let obj = {} |
|
obj = e.ProfessionalList.find(r =>{ |
|
return r.professionalId === item; |
|
}) |
|
e.professionalName = obj.professionalName |
|
} |
|
}) |
|
} |
|
}, |
|
save() { |
|
let isEmpty = false |
|
// this.archivesList.forEach((n,k) => { |
|
// if(!n.personalCareerId) isEmpty = true |
|
// n.userId = this.form.userId |
|
// }) |
|
// if(isEmpty) return this.$message.warning('请选择职业') |
|
if(this.accountReapeat) return this.$message.warning('该账号已存在') |
|
if(this.form.idNumber && !/(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)/.test(this.form.idNumber)) return this.$message.warning('请输入正确的证件号码') |
|
let form = this.form |
|
let personalFileList = [] |
|
this.archivesList.forEach((n,k) => { |
|
n.personalCareerId && personalFileList.push({ |
|
disciplineId: n.disciplineId, |
|
disciplineName: n.disciplineName, |
|
personalCareerId: n.personalCareerId, |
|
personalFileId: n.personalFileId, |
|
professionalClassId: n.professionalClassId, |
|
professionalClassName: n.professionalClassName, |
|
professionalId: n.professionalId, |
|
professionalName: n.professionalName, |
|
provinceId: n.provinceId, |
|
provinceName: n.provinceName, |
|
schoolId: n.schoolId, |
|
schoolName: n.schoolName, |
|
userId: form.userId |
|
}) |
|
}) |
|
let data = { |
|
userId: form.userId, |
|
userAccountList: [{ |
|
id: form.accountId, |
|
account: form.account, |
|
userId: form.userId, |
|
}], |
|
hrUserInfo: { |
|
provinceId: form.provinceId, |
|
cityId: form.cityId, |
|
countries: form.countries, |
|
dateBirth: form.dateBirth, |
|
educationDegree: form.educationDegree, |
|
idNumber: form.idNumber, |
|
schoolId: form.schoolId, |
|
sex: form.sex, |
|
userId: form.userId, |
|
userName: form.userName, |
|
wechatId: form.wechatId |
|
}, |
|
personalFileList, |
|
} |
|
this.$post(this.api.updatePersonCenter,data).then(res => { |
|
this.$message.success('提交成功！') |
|
}).catch(res => {}) |
|
}, |
|
emailCountdown(){ |
|
let count = 60 |
|
if(!this.emailTimer){ |
|
this.emailDisabled = true |
|
this.emailTimer = setInterval(() => { |
|
console.log('倒计时中') |
|
if(count > 0){ |
|
count-- |
|
this.emailBtnText = `${count}秒后重试` |
|
}else{ |
|
this.emailDisabled = false |
|
clearInterval(this.emailTimer) |
|
this.emailTimer = null |
|
this.emailBtnText = `发送验证码` |
|
} |
|
},1000) |
|
} |
|
}, |
|
phoneCountdown(){ |
|
let count = 60 |
|
if(!this.phoneTimer){ |
|
this.phoneDisabled = true |
|
this.phoneTimer = setInterval(() => { |
|
console.log('倒计时中') |
|
if(count > 0){ |
|
count-- |
|
this.phoneBtnText = `${count}秒后重试` |
|
}else{ |
|
this.phoneDisabled = false |
|
clearInterval(this.phoneTimer) |
|
this.phoneTimer = null |
|
this.phoneBtnText = `发送验证码` |
|
} |
|
},1000) |
|
} |
|
}, |
|
closeEmail(){ |
|
if(!this.emailDisabled){ |
|
this.emailCode = '' |
|
} |
|
}, |
|
sendEmailCode(){ |
|
if(!this.email) return this.$message.warning('请输入邮箱') |
|
if(!/^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/.test(this.email)) return this.$message.warning('请输入正确的邮箱') |
|
let data = { |
|
userId: this.form.userId, |
|
email: this.email, |
|
types: 1 |
|
} |
|
this.$post(this.api.sendPhoneOrEmailCode,data).then(res => { |
|
if(res.message.opener){ |
|
this.emailCountdown() |
|
this.emailOpener = res.message.opener |
|
}else{ |
|
this.$message.error(res.message) |
|
} |
|
}).catch(res => {}); |
|
}, |
|
emailSubmit(){ |
|
if(!this.email) return this.$message.warning('请输入邮箱') |
|
if(!/^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/.test(this.email)) return this.$message.warning('请输入正确的邮箱') |
|
if(!this.emailCode) return this.$message.warning('请输入验证码') |
|
let data = { |
|
userId: this.form.userId, |
|
email: this.email, |
|
types: 1, |
|
code: this.emailCode, |
|
opener: this.emailOpener |
|
} |
|
this.$post(this.api.bindPhoneOrEmail,data).then(res => { |
|
if(res.status == 200){ |
|
this.$message.success('绑定成功') |
|
this.form.email = this.email |
|
this.emailVisible = false |
|
} |
|
}).catch(res => {}); |
|
}, |
|
closePhone(){ |
|
if(!this.emailDisabled){ |
|
this.emailCode = '' |
|
} |
|
}, |
|
sendPhoneCode(){ |
|
if(!this.phone) return this.$message.warning('请输入手机号') |
|
if(!/^1[3456789]\d{9}$/.test(this.phone)) return this.$message.warning('请输入正确的手机号') |
|
this.$post(this.api.sendPhoneOrEmailCode,{ |
|
userId: this.form.userId, |
|
phone: this.phone, |
|
types: 2 |
|
}).then(res => { |
|
if(res.message.opener){ |
|
this.phoneCountdown() |
|
this.phoneOpener = res.message.opener |
|
}else{ |
|
this.$message.error(res.message) |
|
} |
|
}).catch(res => {}) |
|
}, |
|
phoneSubmit(){ |
|
if(!this.phone) return this.$message.warning('请输入手机号') |
|
if(!/^1[3456789]\d{9}$/.test(this.phone)) return this.$message.warning('请输入正确的手机号') |
|
if(!this.phoneCode) return this.$message.warning('请输入验证码') |
|
let data = { |
|
userId: this.form.userId, |
|
phone: this.phone, |
|
types: 2, |
|
code: this.phoneCode, |
|
opener: this.phoneOpener |
|
} |
|
this.$post(this.api.bindPhoneOrEmail,data).then(res => { |
|
if(res.status == 200){ |
|
this.$message.success('绑定成功') |
|
this.form.phone = this.phone |
|
this.phoneVisible = false |
|
} |
|
}).catch(res => {}); |
|
}, |
|
} |
|
}; |
|
</script> |
|
|
|
<style lang="scss" scoped> |
|
.arrowTransform{ |
|
transition: 0.5s; |
|
transform-origin: center; |
|
transform: rotateZ(180deg); |
|
} |
|
.arrowTransformReturn{ |
|
transition: 0.5s; |
|
transform-origin: center; |
|
transform: rotateZ(0deg); |
|
} |
|
.wrap{ |
|
padding-top: 170px; |
|
overflow: auto; |
|
display:flex; |
|
align-items: center; |
|
flex-direction:column; |
|
margin: -20px; |
|
background: #f6f6f6 url(../../assets/img/person/bg.png) 0 0/100% 500px no-repeat; |
|
box-sizing: border-box; |
|
} |
|
.header{ |
|
z-index: 2; |
|
background-color: transparent; |
|
} |
|
.header /deep/.el-upload-list__item-name { |
|
display: none; |
|
} |
|
|
|
.header /deep/.el-icon-upload-success{ |
|
display: none; |
|
} |
|
|
|
.header /deep/.el-upload-list__item-status-label{ |
|
display: none; |
|
} |
|
.header /deep/ .el-upload-list{ |
|
display: none; |
|
} |
|
|
|
/deep/.el-input__inner{ |
|
height: 32px !important; |
|
} |
|
/deep/.el-select .el-input .el-select__caret{ |
|
line-height: 32px; |
|
} |
|
input:focus { |
|
outline: 0; |
|
} |
|
.openfile { |
|
cursor: pointer; |
|
} |
|
.Headtop { |
|
margin-top: 10px; |
|
// width: 80px; |
|
// height: 80px; |
|
// background: url('../../assets/img/img.jpg'); |
|
// border-radius: 50%; |
|
|
|
.head { |
|
width: 34px; |
|
height: 34px; |
|
background: rgba(255, 255, 255, 1); |
|
border-radius: 50%; |
|
display: flex; |
|
align-items: center; |
|
flex-direction: column; |
|
justify-content: center; |
|
position: relative; |
|
.eee { |
|
height: 10px; |
|
width: 16px; |
|
background-color: rgba(255, 255, 255, 1); |
|
margin-bottom: -10px; |
|
position: absolute; |
|
top: 8px; |
|
z-index: 2; |
|
} |
|
.Semicircle { |
|
width: 12px; |
|
height: 12px; |
|
border: 2px solid #9278ff; |
|
border-radius: 50px; |
|
margin-bottom: 10px; |
|
position: absolute; |
|
} |
|
} |
|
.body { |
|
color: #9278ff; |
|
width: 30px; |
|
height: 20px; |
|
border: 3px solid #f5f5f5; |
|
border-radius: 100%; |
|
margin-top: 5px; |
|
margin-bottom: -10px; |
|
} |
|
.body::after { |
|
content: ''; |
|
width: 40px; |
|
height: 30px; |
|
display: inline-block; |
|
background-color: #9278ff; |
|
margin-top: 8px; |
|
margin-left: -6px; |
|
} |
|
} |
|
|
|
.card { |
|
width: 1000px; |
|
margin-top: 10px; |
|
padding: 60px 100px; |
|
background: rgba(255, 255, 255, 1); |
|
box-shadow: 0px 0px 21px 0px rgba(48, 115, 248, 0.1); |
|
border-radius: 4px; |
|
position: relative; |
|
box-sizing: border-box; |
|
.block-title{ |
|
span{ |
|
display: inline-flex; |
|
align-items: center; |
|
color: #444; |
|
font-size: 18px; |
|
img{ |
|
width: 20px; |
|
margin-right: 5px; |
|
} |
|
} |
|
|
|
} |
|
.meta-title{ |
|
padding-left: 6px; |
|
margin: 20px 0 10px 0; |
|
line-height: 1; |
|
border-left: 4px solid #9278ff; |
|
span{ |
|
font-size: 16px; |
|
color: #9278ff; |
|
} |
|
/deep/ .el-button{ |
|
padding: 0 0; |
|
font-size: 16px; |
|
color: #9278ff; |
|
} |
|
} |
|
.el-icon-document { |
|
color: #9278ff; |
|
font-size: 30px; |
|
} |
|
.el-icon-collection { |
|
color: #9278ff; |
|
position: absolute; |
|
left: 31px; |
|
top: 31px; |
|
font-size: 30px; |
|
} |
|
span { |
|
color: #333333; |
|
font-size: 20px; |
|
} |
|
.plus{ |
|
display: flex; |
|
justify-content: space-between; |
|
i{ |
|
font-size: 22px; |
|
color: #21d749; |
|
cursor: pointer; |
|
} |
|
} |
|
.information { |
|
.archives{ |
|
padding: 15px; |
|
margin-bottom: 20px; |
|
border: 1px dashed #c9c9c9; |
|
border-radius: 8px; |
|
} |
|
.line { |
|
position: relative; |
|
display: flex; |
|
justify-content: space-between; |
|
align-items: center; |
|
.item{ |
|
display: inline-flex; |
|
align-items: center; |
|
margin-bottom: 20px; |
|
span{ |
|
width: 90px; |
|
margin-right: 15px; |
|
text-align: right; |
|
font-size: 15px; |
|
color: #656565; |
|
white-space: nowrap; |
|
} |
|
.username { |
|
background:url('~@/assets/img/person/edit.png') no-repeat 10px center; |
|
background-size: 16px 15px; |
|
background-position: 98% 50%; |
|
box-sizing: border-box; |
|
} |
|
.idnumber { |
|
background:url('~@/assets/img/person/idcard.png') no-repeat 10px center; |
|
background-size: 20px 16px; |
|
background-position: 98% 50%; |
|
box-sizing: border-box; |
|
} |
|
.school { |
|
background: url('~@/assets/img/person/school.png') no-repeat; |
|
background-size: 22px 17px; |
|
background-position: 98% 50%; |
|
box-sizing: border-box; |
|
} |
|
.weChat{ |
|
background: url('~@/assets/img/person/bind.png') no-repeat; |
|
background-size: 19px 18px; |
|
background-position: 98% 50%; |
|
box-sizing: border-box; |
|
} |
|
input { |
|
height: 36px; |
|
width: 260px; |
|
color: #727272; |
|
border: 0; |
|
border-bottom: 1px solid #b5b5b5; |
|
outline: none; |
|
padding-left: 15px; |
|
} |
|
.read{ |
|
width: 260px; |
|
color: #727272; |
|
} |
|
.el-select,.btns{ |
|
width: 260px; |
|
} |
|
.btns{ |
|
display: inline-flex; |
|
align-items: center; |
|
border-bottom: 1px solid #b5b5b5; |
|
padding: 5px 0; |
|
} |
|
.selects{ |
|
display: inline-flex; |
|
align-items: center; |
|
width: 260px; |
|
.el-select{ |
|
width: 100px; |
|
font-size: 12px; |
|
&:first-child{ |
|
width: 82px; |
|
} |
|
} |
|
} |
|
} |
|
/deep/.el-date-editor{ |
|
width: 260px; |
|
} |
|
/deep/.el-date-editor .el-input__prefix{ |
|
line-height: 32px; |
|
} |
|
/deep/.el-input__prefix,/deep/.el-input__suffix{ |
|
left: auto; |
|
right: 0; |
|
} |
|
/deep/.el-input__inner { |
|
color: #656565; |
|
font-size: 14px; |
|
border-radius: 0 !important; |
|
border: 0px; |
|
border-bottom: 1px solid #b5b5b5; |
|
} |
|
/deep/.el-input--prefix .el-input__inner{ |
|
padding-left: 15px; |
|
} |
|
/deep/.el-input__icon { |
|
color: #9278ff; |
|
&.el-icon-date{ |
|
font-size: 14px; |
|
&:before{ |
|
content: ""; |
|
background: url('~@/assets/img/person/date.png') center center no-repeat; |
|
position: absolute; |
|
width: 20px; |
|
height: 18px; |
|
top: 50%; |
|
left: 50%; |
|
transform: translate(-50%, -50%); |
|
} |
|
} |
|
} |
|
/deep/.el-icon-arrow-up:before { |
|
content: ""; |
|
background: url('~@/assets/img/person/select.png') center center no-repeat; |
|
position: absolute; |
|
width: 12px; |
|
height: 7px; |
|
top: 50%; |
|
left: 50%; |
|
transform: translate(-50%, -50%); |
|
} |
|
} |
|
} |
|
.fold{ |
|
margin-top: 20px; |
|
text-align: center; |
|
i{ |
|
font-size: 22px; |
|
color: #8e8e8e; |
|
cursor: pointer; |
|
&:hover{ |
|
opacity: .8; |
|
} |
|
} |
|
} |
|
.sexRadio /deep/ .el-radio__input.is-checked .el-radio__inner{ |
|
border-color: #9278ff; |
|
background: #9278ff; |
|
} |
|
.sexRadio /deep/ .el-radio__input.is-checked + .el-radio__label{ |
|
color: #9278ff; |
|
} |
|
.sexRadio /deep/ .el-radio__inner:hover{ |
|
border-color: #9278ff; |
|
} |
|
/deep/ input::-webkit-input-placeholder { |
|
color: #c0c0c0; |
|
} |
|
/deep/ input::-moz-input-placeholder { |
|
color: #c0c0c0; |
|
} |
|
/deep/ input::-ms-input-placeholder { |
|
color: #c0c0c0; |
|
} |
|
} |
|
</style> |