职站学生端小程序版
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.

547 lines
16 KiB

4 days ago
<template>
<view class="page">
<view class="block">
<view class="p-title">
<image class="icon" src="https://eduvessel.com/images/occupationlab/user.svg" mode="widthFix"></image> 账号信息
</view>
<view class="form-list">
<view class="line">
<view class="name">
<button class="avatar-btn" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
<image class="avatar" :src="hrUserInfo.avatar" mode=""></image>
</button>
</view>
<view class="val">修改头像</view>
<uni-icons class="arrow" type="right" size="18" color="#ababab"></uni-icons>
</view>
<view class="line">
<view class="name">学号</view>
<view class="val">{{ userAccount.workNumber }}</view>
</view>
<view class="line">
<view class="name">手机号</view>
<view class="val">{{ userAccount.phone }}</view>
<view class="action" @click="$util.to('/user/phone/phone')">更换</view>
</view>
<view class="line">
<view class="name">邮箱</view>
<view class="val">{{ hrUserInfo.email }}</view>
<view class="action" @click="$util.to('/user/email/email')">{{ hrUserInfo.email ? '更换' : '添加'}}</view>
</view>
<view class="line">
<view class="name">密码</view>
<view class="val">xxxxxx</view>
<view class="action" @click="$util.to('/user/password/password')">更换</view>
</view>
4 days ago
</view>
</view>
<view class="block">
<view class="p-title">
<image class="icon" src="https://eduvessel.com/images/occupationlab/basic.svg" mode="widthFix"></image> 基本信息
</view>
<view class="form-list">
<view class="line">
<view class="name">姓名</view>
<input type="text" placeholder="请输入姓名" v-model="hrUserInfo.userName" />
</view>
<view class="line">
<view class="name">性别</view>
<uni-data-picker class="picker-input" placeholder="请选择性别" popup-title="请选择性别" preload :clear-icon="false" :localdata="sex" v-model="hrUserInfo.sex"></uni-data-picker>
</view>
<view class="line">
<view class="name">出生日期</view>
<uni-datetime-picker class="picker-date" type="date" placeholder="请选择出生日期" :clear-icon="false" v-model="hrUserInfo.dateBirth" />
<!-- <uni-icons class="arrow" type="right" size="18" color="#ababab"></uni-icons> -->
</view>
<view class="line">
<view class="name">身份证号</view>
<input type="text" placeholder="请输入身份证号" v-model="hrUserInfo.idNumber" />
<uni-icons class="arrow" type="right" size="18" color="#ababab"></uni-icons>
</view>
<view class="line">
<view class="name">所在国家</view>
<view class="val">中国</view>
</view>
<view class="line">
<view class="name">所在省份</view>
<uni-data-picker class="picker-input" placeholder="请选择省份" popup-title="请选择省份" preload :clear-icon="false" :localdata="provinces" v-model="hrUserInfo.provinceId" @change="getCity"></uni-data-picker>
</view>
<view class="line">
<view class="name">所在城市</view>
<uni-data-picker class="picker-input" placeholder="请选择城市" popup-title="请选择城市" preload :clear-icon="false" :localdata="cities" v-model="hrUserInfo.cityId"></uni-data-picker>
</view>
<view class="line">
<view class="name">受教育程度</view>
<uni-data-picker class="picker-input" placeholder="请选择受教育程度" popup-title="请选择受教育程度" preload :clear-icon="false" :localdata="educationDegreeList" v-model="hrUserInfo.educationDegree"></uni-data-picker>
</view>
<view class="line">
<view class="name">当前所在学校</view>
<view class="val">{{ hrUserInfo.schoolName }}</view>
</view>
</view>
4 days ago
</view>
<view class="block">
<view class="arch-title">
<view class="p-title">
<image class="icon" src="https://eduvessel.com/images/occupationlab/files.svg" mode="widthFix"></image> &nbsp;个人档案
</view>
<uni-icons class="plus" type="plus" size="20" color="#007EFF" @click="addArch"></uni-icons>
</view>
<view class="archives">
<view v-for="(archive, i) in archivesList" :key="i" class="form-list archive" v-show="!i || showArch">
<view class="line">
<view class="name">职业</view>
<uni-data-picker class="picker-input" placeholder="请选择职业" popup-title="请选择职业" preload :clear-icon="false" :localdata="occupationList" v-model="archive.personalCareerId"></uni-data-picker>
</view>
<view class="line">
<view class="name">所在国家</view>
<view class="val">中国</view>
</view>
<view class="line">
<view class="name">学校名称</view>
<uni-data-picker class="picker-input" placeholder="请选择学校" popup-title="请选择学校" preload :clear-icon="false" :localdata="schoolList" v-model="archive.schoolId"></uni-data-picker>
4 days ago
</view>
<view class="line">
<view class="name">专业学科</view>
<uni-data-picker class="picker-input" placeholder="请选择专业学科" popup-title="请选择专业学科" preload :clear-icon="false" :localdata="subjectList" v-model="archive.disciplineId" @change="e => getItemProfessionalClass(e, i)"></uni-data-picker>
</view>
<view class="line">
<view class="name">专业类</view>
<uni-data-picker class="picker-input" placeholder="请选择专业类" popup-title="请选择专业类" preload :clear-icon="false" :localdata="archive.ProfessionalClassList" v-model="archive.professionalClassId" @change="e => getItemProfessional(e, i)"></uni-data-picker>
</view>
<view class="line">
<view class="name">专业</view>
<uni-data-picker class="picker-input" placeholder="请选择专业" popup-title="请选择专业" preload :clear-icon="false" :localdata="archive.ProfessionalList" v-model="archive.professionalId"></uni-data-picker>
</view>
<uni-icons class="del" type="trash" size="20" color="#ccc" @click="delArchive(i)"></uni-icons>
4 days ago
</view>
</view>
<view class="fold" v-if="archivesList.length > 1">
<view :class="{ active: showArch }" @click="showArch = !showArch">
展开更多
<uni-icons class="plus" type="bottom" size="20" color="#007EFF"></uni-icons>
</view>
4 days ago
</view>
</view>
<view class="btn-wrap">
<view class="btn" @click="submit">保存</view>
</view>
4 days ago
</view>
</template>
<script>
import OSS from '@/libs/Oss/upload'
import { queryProvince, queryCity, querySchool, queryUserInfoDetails, updateAvatars, courseDiscipline, courseProfessionalClass, courseProfessional, updatePersonCenter, deleteProfile } from '@/apis/modules/user.js'
4 days ago
export default {
data() {
return {
hrUserInfo: {
name:'',
workNumber:'',
password:"",
phone:'',
email:'',
provinceName:'',
cityName:'',
schoolName:'',
professionalName:'',
experimentName:'',
sex: 1,
dateBirth: '',
educationDegree: ''
},
userAccount: {},
sex: [{
text: '男',
value: 1
}, {
text: '女',
value: 2
}],
occupationList: [{
value: 1,
text: '学生'
},{
value: 2,
text: '老师'
}],
provinces:[],
cities: [],
educationDegreeList: [
{
text: '专科',
value: 1
},
{
text: '本科',
value: 2
},
{
text: '硕士',
value: 3
},
{
text: '博士',
value: 4
},
{
text: '其他',
value: 5
}
],
subjectList: [], //专业学科
schoolList: [],
showArch: false,
archivesList: [],
archivesForm: {
personalCareerId: '',
schoolId: '',
schoolName: '',
ProfessionalClassList: [],
professionalClassId: '',
professionalClassName: '',
ProfessionalList: [],
disciplineId: '',
disciplineName: '',
professionalId: '',
professionalName: '',
},
4 days ago
}
},
onShow() {
this.getInfo()
this.getProvince()
this.getSchool()
this.getSubject()
4 days ago
},
methods: {
// 获取个人信息
async getInfo() {
const { result } = await queryUserInfoDetails()
const { hrUserInfo: u, personalFileList: p } = result
u.avatar = u.userAvatars || 'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png'
this.hrUserInfo = u
this.userAccount = result.userAccount
u.provinceId && this.getCity()
if (p.length) {
p.forEach(async (e, k) => {
e.ProfessionalClassList = []
e.ProfessionalList = []
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) {
const { list } = await courseProfessionalClass({ disciplineId: e.disciplineId })
list.forEach(e => {
e.value = e.professionalClassId
e.text = e.professionalClassName
})
this.$set(e, 'ProfessionalClassList', list)
}
if (e.professionalClassId) {
const { list } = await courseProfessional({ professionalClassId: e.professionalClassId })
list.forEach(e => {
e.value = e.professionalId
e.text = e.professionalName
})
this.$set(e, 'ProfessionalList', list)
}
})
this.archivesList = p
} else {
this.concatArch()
4 days ago
}
},
// 获取省份
async getProvince() {
const { list } = await queryProvince()
list.forEach(e => {
e.value = e.provinceId
e.text = e.provinceName
4 days ago
})
this.provinces = list
},
// 获取城市
async getCity(val) {
if (this.hrUserInfo.provinceId) {
const { list } = await queryCity({
provinceId: this.hrUserInfo.provinceId
})
4 days ago
list.forEach(e => {
e.value = e.cityId
e.text = e.cityName
4 days ago
})
this.cities = list
} else {
this.cities = []
}
if (val) this.hrUserInfo.cityId = ''
},
// 获取学校
async getSchool(){
const { list } = await querySchool()
list.forEach(e => {
e.value = e.schoolId
e.text = e.schoolName
})
this.schoolList = list
},
// 上传头像回调
onChooseAvatar(e) {
OSS(e.detail.avatarUrl, ({ url }) => {
updateAvatars(url).then(res => {
this.getInfo()
}).catch(e => {})
4 days ago
})
},
foldArch() {
this.showArch = !this.showArch
},
// 获取学科类别
async getSubject(){
const { list } = await courseDiscipline()
list.forEach(e => {
e.value = e.disciplineId
e.text = e.disciplineName
})
this.subjectList = list
4 days ago
},
// 清除学科类别
clearClass(){
this.archivesForm.professionalClassId = '',
this.archivesForm.professionalId = ''
},
clearItemClass(index){
this.archivesList[index].professionalClassId = ''
this.archivesList[index].professionalClassName = ''
this.archivesList[index].professionalId = ''
this.archivesList[index].professionalName = ''
},
async getItemProfessionalClass(e, index){
this.clearItemClass(index)
if(e.detail.value.length){
const id = e.detail.value[0].value
let obj = {}
obj = this.subjectList.find(r =>{
return r.disciplineId === id
});
const { list } = await courseProfessionalClass({ disciplineId: id })
list.forEach(e => {
e.value = e.professionalClassId
e.text = e.professionalClassName
})
this.archivesList.map(e =>{
if(e.disciplineId == id){
e.ProfessionalClassList = list
e.disciplineName = obj.disciplineName
4 days ago
}
})
}
4 days ago
},
// 清除专业类
clearProfess(){
this.archivesForm.professionalId = ''
4 days ago
},
clearItemProfess(index){
this.archivesList[index].professionalId = ''
this.archivesList[index].professionalName = ''
4 days ago
},
async getItemProfessional(e, index){
this.clearItemProfess(index)
if(e.detail.value.length){
const id = e.detail.value[0].value
const { list } = await courseProfessional({ professionalClassId: id })
list.forEach(e => {
e.value = e.professionalId
e.text = e.professionalName
})
this.archivesList.map(e =>{
if(e.professionalClassId == id){
let obj = {}
obj = e.ProfessionalClassList.find(r =>{
return r.professionalClassId === id
})
e.ProfessionalList = list
e.professionalClassName = obj.professionalClassName
}
})
}
4 days ago
},
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
}
})
}
},
concatArch() {
this.archivesList = this.archivesList.concat({
countries: '中国',
personalCareerId: '',
schoolId: '',
schoolName: '',
subjectList: this.subjectList,
disciplineId: '',
disciplineName: '',
ProfessionalClassList: [],
professionalClassId: '',
professionalClassName: '',
ProfessionalList: [],
professionalId: '',
professionalName: '',
personalFileId: ''
})
4 days ago
},
addArch() {
let isEmpty = false
this.archivesList.forEach((n,k) => {
if(!n.personalCareerId) isEmpty = true
})
if(isEmpty) return this.$util.errMsg('请选择职业')
this.showArch = true
this.concatArch()
},
delArchive(i) {
const that = this
uni.showModal({
title: '提示',
content: '确定要删除吗?',
success(res) {
if (res.confirm) {
const id = that.archivesList[i].personalFileId
that.archivesList.splice(i, 1)
id && deleteProfile(id)
}
}
})
},
// 保存
async submit() {
const { hrUserInfo: u, userAccount: a } = this
if (u.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(u.idNumber)) return this.$util.errMsg('请输入正确的身份证号码!')
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: u.userId
})
})
const data = {
userId: u.userId,
userAccountList: [{
id: a.accountId,
account: a.account,
userId: a.userId,
}],
hrUserInfo: {
provinceId: u.provinceId,
cityId: u.cityId,
countries: '中国',
dateBirth: u.dateBirth,
educationDegree: u.educationDegree,
idNumber: u.idNumber,
schoolId: u.schoolId,
sex: u.sex,
userId: u.userId,
userName: u.userName,
wechatId: u.wechatId
},
personalFileList,
}
updatePersonCenter(data)
this.$util.sucMsg('保存成功')
4 days ago
},
}
}
</script>
<style scoped lang="scss">
.page {
padding-bottom: 130rpx;
}
.avatar-btn {
display: inline-block;
padding: 0;
margin: 0 28rpx 0 0;
line-height: 0;
border: 0 !important;
background-color: transparent;
outline: none;
border-radius: 50%;
.avatar {
width: 50rpx;
height: 50rpx;
border: 0;
4 days ago
}
}
.arch-title {
4 days ago
display: flex;
justify-content: space-between;
align-items: center;
4 days ago
}
.archive {
position: relative;
padding: 30rpx;
margin-bottom: 30rpx;
border: 1px dashed #d2d2d2;
border-radius: 20rpx;
.del {
position: absolute;
top: 10rpx;
right: 10rpx;
}
}
.fold {
padding-bottom: 20rpx;
text-align: center;
font-size: 24rpx;
color: #006EFF;
span {
cursor: pointer;
i {
transition: .5s;
}
&.active i {
transform: rotate(180deg);
}
}
4 days ago
}
</style>