|
|
|
|
<template>
|
|
|
|
|
<div class="wrap">
|
|
|
|
|
<div class="header">
|
|
|
|
|
<el-avatar :size="80" :src="this.$store.state.avatar" class="Headtop"></el-avatar>
|
|
|
|
|
<div style="color:#9278FF;font-size:14px;font-family:MicrosoftYaHei;margin-top:5px;">
|
|
|
|
|
<el-upload
|
|
|
|
|
class="upload-demo"
|
|
|
|
|
:action="this.api.updateUserAvatars"
|
|
|
|
|
:data="{userId:this.userId}"
|
|
|
|
|
name="file"
|
|
|
|
|
:limit="3"
|
|
|
|
|
: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="personalInformation.userName"/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="item">
|
|
|
|
|
<span>所在国家</span>
|
|
|
|
|
<el-select
|
|
|
|
|
v-model="personalInformation.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="personalInformation.sex" :label="1">男</el-radio>
|
|
|
|
|
<el-radio v-model="personalInformation.sex" :label="2">女</el-radio>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="item">
|
|
|
|
|
<span>所在地</span>
|
|
|
|
|
<div class="selects">
|
|
|
|
|
<el-select
|
|
|
|
|
v-model="personalInformation.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="personalInformation.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="personalInformation.cityId"
|
|
|
|
|
placeholder
|
|
|
|
|
:disabled="personalInformation.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="personalInformation.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="personalInformation.idNumber"/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="line">
|
|
|
|
|
<div class="item">
|
|
|
|
|
<span>教育程度</span>
|
|
|
|
|
<el-select
|
|
|
|
|
v-model="personalInformation.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>
|
|
|
|
|
<input id="schoolName" class="school" disabled placeholder="所在学校" type="text" v-model="personalInformation.schoolName"/>
|
|
|
|
|
</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="personalInformation.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="personalInformation.account"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="item">
|
|
|
|
|
<span>手机号</span>
|
|
|
|
|
<div class="btns flex-between">
|
|
|
|
|
<span>{{personalInformation.phone}}</span>
|
|
|
|
|
<el-button v-if="personalInformation.phone" type="primary" size="small" @click="bindPhone">更换</el-button>
|
|
|
|
|
<el-button v-else type="primary" size="small" @click="bindPhone">绑定</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="line">
|
|
|
|
|
<div class="item">
|
|
|
|
|
<span>邮箱</span>
|
|
|
|
|
<div class="btns flex-between">
|
|
|
|
|
<span>{{personalInformation.email}}</span>
|
|
|
|
|
<el-button v-if="personalInformation.email" type="primary" size="small" @click="bindEmail">更换</el-button>
|
|
|
|
|
<el-button v-else type="primary" size="small" @click="bindEmail">绑定</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</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="personalInformation.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="personalInformation.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 {
|
|
|
|
|
userId: this.$store.state.userLoginId,
|
|
|
|
|
personalInformation: {
|
|
|
|
|
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: '', //专业名称
|
|
|
|
|
userId: this.userId
|
|
|
|
|
},
|
|
|
|
|
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.message
|
|
|
|
|
this.$store.commit("provinceData", { provinceList : this.provinceList});
|
|
|
|
|
}).catch(res => {});
|
|
|
|
|
},
|
|
|
|
|
// 获取城市
|
|
|
|
|
getCity(id,type,index){
|
|
|
|
|
if(type == 1){
|
|
|
|
|
if(this.personalInformation.provinceId){
|
|
|
|
|
this.personalInformation.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.personalInformation.provinceId : this.archivesList[index].provinceId
|
|
|
|
|
this.$get(this.api.queryCity,{provinceId}).then(res => {
|
|
|
|
|
if(type == 1){
|
|
|
|
|
this.cityList = res.message
|
|
|
|
|
}else{
|
|
|
|
|
this.archivesList[index].cityList = res.message
|
|
|
|
|
}
|
|
|
|
|
}).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.message
|
|
|
|
|
}).catch(res => {});
|
|
|
|
|
},
|
|
|
|
|
async accountChange(){
|
|
|
|
|
if(this.originAccount != this.personalInformation.account){
|
|
|
|
|
let res = await this.$get(this.api.queryAccountIsExist, {
|
|
|
|
|
account: this.personalInformation.account,
|
|
|
|
|
schoolId: this.personalInformation.schoolId
|
|
|
|
|
});
|
|
|
|
|
if(res.message.user.length){
|
|
|
|
|
this.$message.warning('该账号已存在');
|
|
|
|
|
this.accountReapeat = true
|
|
|
|
|
}else{
|
|
|
|
|
this.accountReapeat = false
|
|
|
|
|
}
|
|
|
|
|
}else{
|
|
|
|
|
this.accountReapeat = false
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
//取得头像地址
|
|
|
|
|
getRes(res) {
|
|
|
|
|
this.$store.commit('userPhoto',{avatar:res.message})
|
|
|
|
|
},
|
|
|
|
|
getdata() {
|
|
|
|
|
this.$get(`${this.api.userinfo}/${this.userId}`)
|
|
|
|
|
.then(res => {
|
|
|
|
|
this.personalInformation = res.data.userInfo[0]
|
|
|
|
|
this.personalInformation.idNumber = this.personalInformation.IDNumber
|
|
|
|
|
this.originAccount = this.personalInformation.account
|
|
|
|
|
this.archivesList = res.data.userPersonalFile
|
|
|
|
|
this.$nextTick(() => {
|
|
|
|
|
if(this.personalInformation.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.$get(this.api.queryCourseProfessionalClass,{ disciplineId: e.disciplineId }).then(res => {
|
|
|
|
|
this.$set(e, 'ProfessionalClassList', res.message);
|
|
|
|
|
}).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.message);
|
|
|
|
|
}).catch(res => {});
|
|
|
|
|
}else{
|
|
|
|
|
this.$set(e, 'ProfessionalList', []);
|
|
|
|
|
}
|
|
|
|
|
// if(e.provinceId){
|
|
|
|
|
// this.$get(this.api.queryCity,{provinceId: e.provinceId}).then(res => {
|
|
|
|
|
// this.$set(e, 'cityList', res.message);
|
|
|
|
|
// }).catch(res => {});
|
|
|
|
|
// }else{
|
|
|
|
|
// this.$set(e, 'cityList', []);
|
|
|
|
|
// }
|
|
|
|
|
console.log(11,window.scrollTo)
|
|
|
|
|
})
|
|
|
|
|
}else{
|
|
|
|
|
this.concatArch(1)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
.catch(err => {
|
|
|
|
|
console.log(err);
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
concatArch(isLoadData) {
|
|
|
|
|
this.archivesList = this.archivesList.concat({
|
|
|
|
|
isNew: true,
|
|
|
|
|
personalCareerId: '', //职业
|
|
|
|
|
schoolId: '', //院校
|
|
|
|
|
schoolName: '', //院校名称
|
|
|
|
|
subjectList: this.subjectList, //专业学科
|
|
|
|
|
disciplineId: '', //专业学科
|
|
|
|
|
disciplineName: '', //专业学科名称
|
|
|
|
|
ProfessionalClassList: [], //专业类
|
|
|
|
|
professionalClassId: '', //专业类
|
|
|
|
|
professionalClassName: '', //专业类名称
|
|
|
|
|
ProfessionalList: [], //专业
|
|
|
|
|
professionalId: '', //专业
|
|
|
|
|
professionalName: '', //专业名称
|
|
|
|
|
userId: this.userId,
|
|
|
|
|
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.personalInformation.email
|
|
|
|
|
this.emailVisible = true
|
|
|
|
|
},
|
|
|
|
|
bindPhone() {
|
|
|
|
|
this.phone = this.personalInformation.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.userid = this.userId
|
|
|
|
|
this.$post(this.api.examinePassword,data)
|
|
|
|
|
.then(res => {
|
|
|
|
|
if(res.errmessage == 'success'){
|
|
|
|
|
this.$message.success('更换成功')
|
|
|
|
|
this.passwordVisible = false
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
.catch(err => {
|
|
|
|
|
console.log(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.$get(this.api.queryCourseDiscipline).then(res => {
|
|
|
|
|
this.subjectList = res.message
|
|
|
|
|
}).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.$get(this.api.queryCourseProfessionalClass,{ disciplineId: item }).then(res => {
|
|
|
|
|
this.archivesList.map(e =>{
|
|
|
|
|
if(e.disciplineId == item){
|
|
|
|
|
e.ProfessionalClassList = res.message
|
|
|
|
|
e.disciplineName = obj.disciplineName
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}).catch(res => {});
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
getProfessionalClassData(value){
|
|
|
|
|
this.$get(this.api.queryCourseProfessionalClass,{ disciplineId: value }).then(res => {
|
|
|
|
|
this.ProfessionalClassList = res.message
|
|
|
|
|
}).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.message
|
|
|
|
|
e.professionalClassName = obj.professionalClassName
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}).catch(res => {});
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
getProfessionalData(value){
|
|
|
|
|
this.$get(this.api.queryCourseProfessional,{professionalClassId: value}).then(res => {
|
|
|
|
|
this.ProfessionalList = res.message
|
|
|
|
|
}).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.userId
|
|
|
|
|
})
|
|
|
|
|
if(isEmpty) return this.$message.warning('请选择职业')
|
|
|
|
|
if(this.accountReapeat) return this.$message.warning('该账号已存在')
|
|
|
|
|
if(this.personalInformation.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.personalInformation.idNumber)) return this.$message.warning('请输入正确的证件号码')
|
|
|
|
|
if(this.personalInformation.phone && !/^1[3456789]\d{9}$/.test(this.personalInformation.phone)) return this.$message.warning('请输入正确的手机号')
|
|
|
|
|
if(this.personalInformation.email && !/^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/.test(this.personalInformation.email)) return this.$message.warning('请输入正确的邮箱')
|
|
|
|
|
// this.personalInformation.userId = this.userId
|
|
|
|
|
let personalInformation = this.personalInformation
|
|
|
|
|
let userInfoEntity = {
|
|
|
|
|
idNumber: personalInformation.idNumber,
|
|
|
|
|
account: personalInformation.account,
|
|
|
|
|
cityId: personalInformation.cityId,
|
|
|
|
|
countries: personalInformation.countries,
|
|
|
|
|
dateBirth: personalInformation.dateBirth,
|
|
|
|
|
educationDegree: personalInformation.educationDegree,
|
|
|
|
|
email: personalInformation.email,
|
|
|
|
|
phone: personalInformation.phone,
|
|
|
|
|
provinceId: personalInformation.provinceId,
|
|
|
|
|
schoolId: personalInformation.schoolId,
|
|
|
|
|
sex: personalInformation.sex,
|
|
|
|
|
userId: personalInformation.userId,
|
|
|
|
|
userName: personalInformation.userName,
|
|
|
|
|
weChatID: personalInformation.weChatID,
|
|
|
|
|
}
|
|
|
|
|
let personalFileEntities = []
|
|
|
|
|
this.archivesList.forEach((n,k) => {
|
|
|
|
|
personalFileEntities.push({
|
|
|
|
|
cityId: n.cityId,
|
|
|
|
|
cityName: n.cityName,
|
|
|
|
|
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: this.userId
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
let data = {
|
|
|
|
|
userInfoEntity,
|
|
|
|
|
personalFileEntities
|
|
|
|
|
}
|
|
|
|
|
this.$put(this.api.userinfoUpdate,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.userId,
|
|
|
|
|
email: this.email,
|
|
|
|
|
types: 1
|
|
|
|
|
}
|
|
|
|
|
this.$post(this.api.sendEmailCode,data).then(res => {
|
|
|
|
|
if(res.errmessage == 'success'){
|
|
|
|
|
this.emailCountdown()
|
|
|
|
|
this.emailOpener = res.data
|
|
|
|
|
}
|
|
|
|
|
}).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.userId,
|
|
|
|
|
email: this.email,
|
|
|
|
|
types: 1,
|
|
|
|
|
code: this.emailCode,
|
|
|
|
|
opener: this.emailOpener
|
|
|
|
|
}
|
|
|
|
|
this.$put(this.api.bingEmail,data).then(res => {
|
|
|
|
|
if(res.errmessage == 'success'){
|
|
|
|
|
this.$message.success('绑定成功')
|
|
|
|
|
this.personalInformation.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('请输入正确的手机号')
|
|
|
|
|
let data = {
|
|
|
|
|
userId: this.userId,
|
|
|
|
|
phone: this.phone,
|
|
|
|
|
types: 2
|
|
|
|
|
}
|
|
|
|
|
this.$post(this.api.sendPhoneCode,data).then(res => {
|
|
|
|
|
if(res.errmessage == 'success'){
|
|
|
|
|
this.phoneCountdown()
|
|
|
|
|
this.phoneOpener = res.data
|
|
|
|
|
}
|
|
|
|
|
}).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.userId,
|
|
|
|
|
phone: this.phone,
|
|
|
|
|
types: 2,
|
|
|
|
|
code: this.phoneCode,
|
|
|
|
|
opener: this.phoneOpener
|
|
|
|
|
}
|
|
|
|
|
this.$put(this.api.bindPhone,data).then(res => {
|
|
|
|
|
if(res.errmessage == 'success'){
|
|
|
|
|
this.$message.success('绑定成功')
|
|
|
|
|
this.personalInformation.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>
|
