563 lines
13 KiB
Vue
563 lines
13 KiB
Vue
<template>
|
||
<view class="index-wrap">
|
||
<view class="title-h1">
|
||
请先完善个人信息
|
||
</view>
|
||
<view class="item-list">
|
||
<view class="item">
|
||
<view class="title"><text>*</text>学历(必选)</view>
|
||
<view class="option">
|
||
<view class="subject-item" :class="eduLevel===3?'on':''" @click="changeEduLevel(3)">研究生</view>
|
||
<view class="subject-item" :class="eduLevel===2?'on':''" @click="changeEduLevel(2)">本科</view>
|
||
<view class="subject-item" :class="eduLevel===1?'on':''" @click="changeEduLevel(1)">专科</view>
|
||
</view>
|
||
</view>
|
||
<view class="item">
|
||
<view class="title"><text>*</text>专业类(必选)</view>
|
||
<view class="input-wrap">
|
||
<view class="input-value" :class="specialtyName!== ''?'':'placeholder'"
|
||
@click="showZhuanYeDialog(true)">
|
||
{{specialtyName !== ''? specialtyName: "请选择专业类"}}
|
||
</view>
|
||
<view class="icon-select">
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="btn-wrap">
|
||
<view class="btn" @click="commitForm">
|
||
确认提交
|
||
</view>
|
||
</view>
|
||
<uni-popup ref="pop_zhuanye" type="bottom" style="background: #fff !important;">
|
||
<view class="layer-inner">
|
||
<view class="head">
|
||
<text>选择专业类</text>
|
||
<view class="close-btn" @click="showZhuanYeDialog(false)"></view>
|
||
</view>
|
||
<view class="content">
|
||
<view class="li" :class="item.value == specialtyName?'on':''" v-for="(item,index) in showSpecialtyList"
|
||
:key="index" @click="checkSpecialty(item)">
|
||
<text>{{item.label}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</uni-popup>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import api from "@/packageCa/apiCa/user.js"
|
||
export default {
|
||
data() {
|
||
return {
|
||
schoolName: "", //
|
||
eduLevel: 2, //3研究生，2本科，1专科
|
||
specialtyName: "", //
|
||
showSpecialtyList: [{
|
||
label: '哲学',
|
||
value: '哲学'
|
||
},
|
||
{
|
||
label: '经济学',
|
||
value: '经济学'
|
||
},
|
||
{
|
||
label: '法学',
|
||
value: '法学'
|
||
},
|
||
{
|
||
label: '教育学',
|
||
value: '教育学'
|
||
},
|
||
{
|
||
label: '文学',
|
||
value: '文学'
|
||
},
|
||
{
|
||
label: '历史学',
|
||
value: '历史学'
|
||
},
|
||
{
|
||
label: '理学',
|
||
value: '理学'
|
||
},
|
||
{
|
||
label: '工学',
|
||
value: '工学'
|
||
},
|
||
{
|
||
label: '农学',
|
||
value: '农学'
|
||
},
|
||
{
|
||
label: '医学',
|
||
value: '医学'
|
||
},
|
||
{
|
||
label: '管理学',
|
||
value: '管理学'
|
||
},
|
||
{
|
||
label: '艺术学',
|
||
value: '艺术学'
|
||
},
|
||
{
|
||
label: '军事学',
|
||
value: '军事学'
|
||
},
|
||
{
|
||
label: '交叉学科',
|
||
value: '交叉学科'
|
||
},],
|
||
specialtyOption1: [{
|
||
label: '农林牧渔大类',
|
||
value: '农林牧渔大类'
|
||
},
|
||
{
|
||
label: '资源环境与安全大类',
|
||
value: '资源环境与安全大类'
|
||
},
|
||
{
|
||
label: '能源动力与材料大类',
|
||
value: '能源动力与材料大类'
|
||
},
|
||
{
|
||
label: '土木建筑大类',
|
||
value: '土木建筑大类'
|
||
},
|
||
{
|
||
label: '水利大类',
|
||
value: '水利大类'
|
||
},
|
||
{
|
||
label: '装备制造大类',
|
||
value: '装备制造大类'
|
||
},
|
||
{
|
||
label: '生物与化工大类',
|
||
value: '生物与化工大类'
|
||
},
|
||
{
|
||
label: '轻工纺织大类',
|
||
value: '轻工纺织大类'
|
||
},
|
||
{
|
||
label: '食品药品与粮食',
|
||
value: '食品药品与粮食'
|
||
},
|
||
{
|
||
label: '交通运输大类',
|
||
value: '交通运输大类'
|
||
},
|
||
{
|
||
label: '电子信息大类',
|
||
value: '电子信息大类'
|
||
},
|
||
{
|
||
label: '医药卫生大类',
|
||
value: '医药卫生大类'
|
||
},
|
||
{
|
||
label: '财经商贸大类',
|
||
value: '财经商贸大类'
|
||
},
|
||
{
|
||
label: '旅游大类',
|
||
value: '旅游大类'
|
||
},
|
||
{
|
||
label: '文化艺术大类',
|
||
value: '文化艺术大类'
|
||
},
|
||
{
|
||
label: '新闻传播大类',
|
||
value: '新闻传播大类'
|
||
},
|
||
{
|
||
label: '教育与体育大类',
|
||
value: '教育与体育大类'
|
||
},
|
||
{
|
||
label: '公安与司法大类',
|
||
value: '公安与司法大类'
|
||
},
|
||
{
|
||
label: '公共管理与服务大类',
|
||
value: '公共管理与服务大类'
|
||
},
|
||
],
|
||
specialtyOption2: [{
|
||
label: '哲学',
|
||
value: '哲学'
|
||
},
|
||
{
|
||
label: '经济学',
|
||
value: '经济学'
|
||
},
|
||
{
|
||
label: '法学',
|
||
value: '法学'
|
||
},
|
||
{
|
||
label: '教育学',
|
||
value: '教育学'
|
||
},
|
||
{
|
||
label: '文学',
|
||
value: '文学'
|
||
},
|
||
{
|
||
label: '历史学',
|
||
value: '历史学'
|
||
},
|
||
{
|
||
label: '理学',
|
||
value: '理学'
|
||
},
|
||
{
|
||
label: '工学',
|
||
value: '工学'
|
||
},
|
||
{
|
||
label: '农学',
|
||
value: '农学'
|
||
},
|
||
{
|
||
label: '医学',
|
||
value: '医学'
|
||
},
|
||
{
|
||
label: '管理学',
|
||
value: '管理学'
|
||
},
|
||
{
|
||
label: '艺术学',
|
||
value: '艺术学'
|
||
},
|
||
{
|
||
label: '军事学',
|
||
value: '军事学'
|
||
},
|
||
{
|
||
label: '交叉学科',
|
||
value: '交叉学科'
|
||
},
|
||
],
|
||
|
||
}
|
||
},
|
||
computed: {
|
||
},
|
||
created() {
|
||
// this.getUserInfor();
|
||
},
|
||
methods: {
|
||
async getUserInfor(){
|
||
const res = await api.getUserBasisInfo();
|
||
if (res.Result == 1) {
|
||
const data = res.Data.data;
|
||
this.specialtyName=data.SpecialtyName;
|
||
this.eduLevel=data.EduLevel;
|
||
} else {
|
||
uni.showToast({
|
||
title: res.Message,
|
||
icon: "none"
|
||
})
|
||
}
|
||
},
|
||
//显示专业弹窗
|
||
showZhuanYeDialog(type){
|
||
if(type==false){
|
||
this.$refs.pop_zhuanye.close();
|
||
}else{
|
||
this.$refs.pop_zhuanye.open('bottom');
|
||
}
|
||
},
|
||
// 改变学历
|
||
changeEduLevel(INDEX){
|
||
if(INDEX == 1){
|
||
this.showSpecialtyList = this.specialtyOption1;
|
||
}else {
|
||
this.showSpecialtyList = this.specialtyOption2;
|
||
}
|
||
this.specialtyName = "";
|
||
this.eduLevel = INDEX;
|
||
},
|
||
//选中专业类
|
||
checkSpecialty(ITEM) {
|
||
this.specialtyName = ITEM.value;
|
||
this.showZhuanYeDialog(false)
|
||
},
|
||
//确认表单
|
||
async commitForm() {
|
||
if (this.specialtyName == "") {
|
||
uni.showToast({
|
||
title: "请先选择专业类",
|
||
icon: "none"
|
||
})
|
||
return;
|
||
}
|
||
uni.showLoading({
|
||
title: "保存中..."
|
||
})
|
||
let mobileCode = this.code;
|
||
const data = {
|
||
//SchoolName: this.schoolName,
|
||
EduLevel: this.eduLevel,
|
||
SpecialtyName: this.specialtyName,
|
||
//Phone: this.mobile,
|
||
//StartYear: this.startYear
|
||
}
|
||
const res = await api.saveUserBasisInfo(mobileCode,data);
|
||
uni.hideLoading();
|
||
if (res.Result == 1) {
|
||
uni.navigateBack()
|
||
} else {
|
||
uni.showToast({
|
||
title: res.Message,
|
||
icon: "none"
|
||
})
|
||
}
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
<style lang="scss" scoped>
|
||
.index-wrap {
|
||
padding: 40rpx 20rpx 60rpx;
|
||
|
||
.title-h1 {
|
||
font-size: 36rpx;
|
||
color: #000000;
|
||
font-weight: 600;
|
||
margin-bottom: 40rpx;
|
||
}
|
||
|
||
.item-list {
|
||
.item {
|
||
padding-bottom: 20px;
|
||
|
||
.title {
|
||
font-size: 28rpx;
|
||
color: #333;
|
||
margin-bottom: 20rpx;
|
||
text{
|
||
color:red;
|
||
}
|
||
}
|
||
|
||
.input-wrap {
|
||
width: 670rpx;
|
||
height: 84rpx;
|
||
border-radius: 12rpx;
|
||
border: 2rpx solid #EEEEEE;
|
||
padding: 0 20rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.icon-input {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAMAAABF0y+mAAAAM1BMVEUAAAAwMDAyMjIzMzMyMjIwMDAzMzMyMjIzMzMyMjIzMzMzMzM0NDQwMDAzMzMzMzMzMzNtKHn7AAAAEHRSTlMAIN+/fzDvYM9wn49AEK9QVfMC+gAAAGNJREFUKM/VzTsSgDAIRVEiIf8o+1+tGcOkIjQ2etvDPOAbdV/bztzBzH6DFHjULD21zURTUf0XHg1OM55KqolqNkuGHe63BtEwSIY5wyAuI7+KgmUQ5i5nEgrmkmXxwlWFV91t2QjwOGHVAgAAAABJRU5ErkJggg==") no-repeat;
|
||
background-size: 100%;
|
||
}
|
||
.icon-select {
|
||
width: 16rpx;
|
||
height: 16rpx;
|
||
margin-left: 24rpx;
|
||
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAS5JREFUWEftltsRgjAQRXehEeyACQ1IJUolYiXSiRRAMnQgjTDRZdCJCOQhhB/yH+7JZnMWhI0XbpwPO8Bega4CjLELIuYeG7IBgJJznmGSJDcAOHsMV6MKAngAQLQRQEMA91c5jhsBFBjHcRSGIUH4rkLTtm3aNWEPQVfhbSFiWlVV+fGAT4h3OJ32S0SMsTMi0qtYbanhPwBrO0FKmQkhCvV0oypeQ0xSylwIcR2WdnIWLAxRkPXG7nUSgJoyCILTAoom5aZTTTU7DfuXQU3pKqrZ8NEmHJL+AaENNwJQRGVjy4ZzfjB5y8Y/JBbK7hRb1zWNXO0yBjBV9lA0OgIrAB2EbbhxDwxPMaZsl3BnAKUS9EQjRMxosunKbSUil4+57LHuAZeQuT07wF6BJ0iYZ7lPYQRvAAAAAElFTkSuQmCC") no-repeat;
|
||
background-size: 100%;
|
||
}
|
||
|
||
.input-value {
|
||
width: 580rpx;
|
||
height: 84rpx;
|
||
font-size: 28rpx;
|
||
color: #333;
|
||
line-height: 84rpx;
|
||
padding-left: 20rpx;
|
||
|
||
&.placeholder {
|
||
font-size: 28rpx;
|
||
color: #999;
|
||
}
|
||
|
||
&::-webkit-input-placeholder {
|
||
font-size: 28rpx;
|
||
color: #999;
|
||
}
|
||
}
|
||
.mb-input-value {
|
||
width: 440rpx;
|
||
height: 84rpx;
|
||
font-size: 28rpx;
|
||
color: #333;
|
||
border-radius: 12rpx;
|
||
border: 2rpx solid #EEEEEE;
|
||
line-height: 84rpx;
|
||
padding-left: 40rpx;
|
||
&::-webkit-input-placeholder {
|
||
font-size: 28rpx;
|
||
color: #999;
|
||
}
|
||
}
|
||
.get-code-btn {
|
||
width: 240rpx;
|
||
height: 80rpx;
|
||
margin-left: 30rpx;
|
||
line-height: 80rpx;
|
||
background-color: #1b88ff;
|
||
border-radius: 12rpx;
|
||
font-size: 32rpx;
|
||
text-align: center;
|
||
color: #ffffff;
|
||
z-index: 9;
|
||
&.disable {
|
||
background: #9f9f9f;
|
||
}
|
||
}
|
||
}
|
||
|
||
.option {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content: space-around;
|
||
.subject-item {
|
||
width: 210rpx;
|
||
height: 76rpx;
|
||
background: #F3F4F6;
|
||
border-radius: 12rpx;
|
||
font-size: 28rpx;
|
||
color: #333;
|
||
margin-bottom: 20rpx;
|
||
margin-right: 30rpx;
|
||
text-align: center;
|
||
line-height: 76rpx;
|
||
|
||
&:nth-child(3n) {
|
||
margin-right: 0;
|
||
}
|
||
|
||
&.on {
|
||
background: #F3F4F6;
|
||
color: #1677ff;
|
||
}
|
||
|
||
&.disadble {
|
||
color: #bbb;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.btn-wrap {
|
||
position: fixed;
|
||
bottom: 100rpx;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
display: flex;
|
||
justify-content: center;
|
||
z-index: 9;
|
||
|
||
.btn {
|
||
width: 688rpx;
|
||
height: 88rpx;
|
||
line-height: 88rpx;
|
||
text-align: center;
|
||
background: #1677ff;
|
||
font-size: 32rpx;
|
||
color: #fff;
|
||
border-radius: 60rpx;
|
||
|
||
&.disable {
|
||
background: #F3F4F6;
|
||
color: #bbb;
|
||
}
|
||
}
|
||
}
|
||
.layer-inner {
|
||
background:#fff;
|
||
border-radius:10px 10px 0 0;
|
||
.head {
|
||
position: relative;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
height: 120rpx;
|
||
width: 100%;
|
||
font-size: 34rpx;
|
||
color: #000000;
|
||
|
||
.close-btn {
|
||
position: absolute;
|
||
top: 39rpx;
|
||
right: 27rpx;
|
||
width: 52rpx;
|
||
height: 52rpx;
|
||
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAQAAAADQ4RFAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QAAKqNIzIAAAAHdElNRQfmChMLCDGRh9c8AAAAmklEQVQ4y7WUMQ7DMAhFnzpmRO3979ABqVN8m/YWdLGcqEkM+lI92Qb+R3wAPgRPjMoxnOANQRCsLGnIwtq98X5pCZvRuucLHuMxY9tYGvffD0tYdsA2ZbsEvWabAp4b09SPDlYp0t4JSAt0YPOhYEH4ja0m+jg+QvzMfKuh/CE9oRBCyQVxhTYSGlYYDWEIpXGXFou0woRl+QUj09L9Yg66GgAAAABJRU5ErkJggg==") center no-repeat;
|
||
background-size: 50%;
|
||
}
|
||
}
|
||
|
||
.content {
|
||
max-height: 640rpx;
|
||
overflow: auto;
|
||
padding: 0 40rpx;
|
||
|
||
.li {
|
||
position: relative;
|
||
height: 114rpx;
|
||
line-height: 114rpx;
|
||
border-bottom: 2rpx solid #f5f5f5;
|
||
|
||
text {
|
||
font-size: 30rpx;
|
||
color: #000000;
|
||
margin-right: 20rpx;
|
||
}
|
||
|
||
&.on {
|
||
text {
|
||
color: #1b88ff;
|
||
}
|
||
|
||
&::after {
|
||
position: absolute;
|
||
right: 10rpx;
|
||
top: 50%;
|
||
transform: translateY(-50%);
|
||
content: "";
|
||
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAZCAMAAACM5megAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAATlBMVEUbiP8biP8biP8biP8biP8biP8biP8biP8biP8biP8biP8biP8biP8biP8biP8biP8biP8biP8biP8biP8biP8biP8biP8biP8biP8AAAAx8hE2AAAAGHRSTlMAH0f2c0SVAfc7bv6JI/hS+UhR+1D0jxRK42VSAAAAAWJLR0QZ7G61iAAAAAd0SU1FB+YKFBEcF+FCm4sAAABsSURBVCjPzdHHDoAwDANQs1cLlJn//1KGEIKqrY+QY/QOiQ2QiRgA4iTlRCTjJC9+QsqPSMVJ3ShGdCuiwgToegu5zrWQ+6MX8j39QMaby41MILoLmWC6JzKkgGFHI+voQKxGTLMshACrdu83CdwKBKKZxqUAAAAASUVORK5CYII=") no-repeat;
|
||
background-size: 100%;
|
||
display: block;
|
||
width: 35rpx;
|
||
height: 25rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.op-block {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 30rpx 40rpx 0;
|
||
width: 670rpx;
|
||
height: 115rpx;
|
||
|
||
.commit-btn {
|
||
width: 361rpx;
|
||
height: 77rpx;
|
||
line-height: 77rpx;
|
||
text-align: center;
|
||
background-color: #1b88ff;
|
||
border-radius: 38rpx;
|
||
font-size: 30rpx;
|
||
color: #ffffff;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style> |