439 lines
13 KiB
Vue
439 lines
13 KiB
Vue
<template>
|
||
<view class="app">
|
||
<view class="user">
|
||
<view class="title">
|
||
一、个人信息
|
||
</view>
|
||
<view class="item">
|
||
<span>姓名：</span>
|
||
<span class='addition'>{{personInfo.realName}}</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>手机号：</span>
|
||
<span class='addition'>{{personInfo.phone}}</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>身份证号：</span>
|
||
<span class='addition'>{{personInfo.userName}}</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>性别：</span>
|
||
<span class='addition'>{{personInfo.sex}}</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>出生日期：</span>
|
||
<span class='addition'>{{personInfo.birthday}}</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>电子邮箱：</span>
|
||
<span class='addition'>
|
||
{{personInfo.email}}
|
||
<!-- <u-input type="text" placeholder="请输入电子邮箱" v-model="personInfo.email" /> -->
|
||
</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>通讯地址：</span>
|
||
<span class='addition'>
|
||
{{personInfo.address}}
|
||
<!-- <u-input type="text" placeholder="请输入通讯地址" v-model="personInfo.address" /> -->
|
||
</span>
|
||
</view>
|
||
</view>
|
||
<view class="user">
|
||
<view class="title">
|
||
二、教育背景
|
||
</view>
|
||
<view class="item">
|
||
<span>最高学历：</span>
|
||
<span class='addition'>
|
||
{{personInfo.education==1?'初中':''}}
|
||
{{personInfo.education==2?'高中/中专':''}}
|
||
{{personInfo.education==3?'大专及以上':''}}
|
||
<!-- <u-radio-group v-model="personInfo.education" @change="">
|
||
<u-radio @change="" v-for="(item, index) in educationlist" :key="index" :name="item.label"
|
||
style="padding: 0 15rpx;" :disabled="item.checked">
|
||
{{item.name}}
|
||
</u-radio>
|
||
</u-radio-group> -->
|
||
</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>毕业院校：</span>
|
||
<span class='addition'>
|
||
{{personInfo.graduateSchool}}
|
||
<!-- <u-input type="text" placeholder="请输入毕业院校" v-model="personInfo.graduateSchool" /> -->
|
||
</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>专业：</span>
|
||
<span class='addition'>
|
||
{{personInfo.major}}
|
||
<!-- <u-input type="text" placeholder="请输入专业" v-model="personInfo.major" /> -->
|
||
</span>
|
||
</view>
|
||
</view>
|
||
<view class="user">
|
||
<view class="title">
|
||
三、报考信息
|
||
<span class='addition' @click="examshow=true"
|
||
style="margin-left:20rpx;padding:6rpx 20rpx;background: #4C7BC9;border-radius: 10rpx;color: #fff;">
|
||
选择考试
|
||
</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>考试名称：</span>
|
||
<span class='addition' v-if="personInfo.title">
|
||
{{personInfo.title}}
|
||
</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>考试日期：</span>
|
||
<span class='addition' v-if="personInfo.title">
|
||
{{personInfo.startDate}}至{{personInfo.endDate}}
|
||
</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>考试时间：</span>
|
||
<span class='addition' v-if="personInfo.title">
|
||
{{personInfo.startTime}}至{{personInfo.endTime}}
|
||
</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>考试费用：</span>
|
||
<span class='addition' v-if="personInfo.title" style="color:red">
|
||
￥{{personInfo.examFee}}
|
||
</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>考试类型：</span>
|
||
<span class='addition' v-if="personInfo.title">
|
||
{{personInfo.examType==2?'正式考试':""}}
|
||
{{personInfo.examType==3?'补考':""}}
|
||
</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>报考类别：</span>
|
||
<span class='addition'>
|
||
{{personInfo.regType == 1?"普通医疗护理员":""}}
|
||
{{personInfo.regType == 2?"老年医疗护理员":""}}
|
||
{{personInfo.regType == 3?"孕产妇和新生儿医疗护理员":""}}
|
||
<!-- <u-radio-group v-model="personInfo.regType" @change="">
|
||
<u-radio @change="" v-for="(item, index) in regTypelist" :key="index" :name="item.label"
|
||
style="padding: 15rpx;" :disabled="item.checked">
|
||
{{item.name}}
|
||
</u-radio>
|
||
</u-radio-group> -->
|
||
</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>培训经历：</span>
|
||
<span class='addition'>
|
||
<view class="item" style="height:60rpx;line-height: 60rpx;">
|
||
<span>机构名称：</span>
|
||
<span class='addition'>
|
||
{{personInfo.trainInstitution}}
|
||
<!-- <u-input type="text" placeholder="请输入机构名称" v-model="personInfo.trainInstitution" /> -->
|
||
</span>
|
||
</view>
|
||
<view class="item" style="height:60rpx;line-height: 60rpx;">
|
||
<span>培训时间：</span>
|
||
<!-- <span class='addition' @click="trainDateshow=true"
|
||
style="margin-left:50rpx;display: inline-block;padding: 10rpx;background-color: #4C7BC9;border-radius: 10rpx;color: #fff;">
|
||
选择时间区间
|
||
</span> -->
|
||
<span class='addition'>
|
||
{{personInfo.trainStartDate+'至'}}{{personInfo.trainEndDate}}
|
||
</span>
|
||
</view>
|
||
</span>
|
||
</view>
|
||
</view>
|
||
<view class="user">
|
||
<view class="title">
|
||
四、上传材料
|
||
</view>
|
||
<view class="item">
|
||
<span>身份证正面：</span>
|
||
<span class='addition'>
|
||
<u-image width="100%" height="300rpx" :src="personInfo.cardFront"></u-image>
|
||
<!-- <u-upload :action="action" :form-data="{
|
||
type:'cardFrontUrl'
|
||
}" :header="header" :file-list="fileList" :max-count="1" @on-uploaded="uploadedcardFront"></u-upload> -->
|
||
</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>身份证反面：</span>
|
||
<span class='addition'>
|
||
<u-image width="100%" height="300rpx" :src="personInfo.cardBack"></u-image>
|
||
<!-- <u-upload :action="action" :form-data="{
|
||
type:'cardBackUrl'
|
||
}" :header="header" :file-list="fileList" :max-count="1" @on-uploaded="uploadedcardBack"></u-upload> -->
|
||
</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>近期白底免冠证件照：</span>
|
||
<span class='addition'>
|
||
<u-image width="100%" height="300rpx" :src="personInfo.photo"></u-image>
|
||
<!-- <u-upload :action="action" :form-data="{
|
||
type:'photoUrl'
|
||
}" :header="header" :file-list="fileList" :max-count="1" @on-uploaded="uploadedphoto"></u-upload> -->
|
||
</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>学历证明：</span>
|
||
<span class='addition'>
|
||
<u-image width="100%" height="300rpx" :src="personInfo.certificate"></u-image>
|
||
<!-- <u-upload :action="action" :form-data="{
|
||
type:'certificateUrl'
|
||
}" :header="header" :file-list="fileList" :max-count="1" @on-uploaded="uploadedcertificate"></u-upload> -->
|
||
</span>
|
||
</view>
|
||
</view>
|
||
<view class="user">
|
||
<view class="title">
|
||
五、声明与签字
|
||
</view>
|
||
<view style="line-height: 40rpx;font-size: 32rpx;color:red;padding:0 10rpx">
|
||
本人确认以上信息真实有效，并同意考试机构核实相关信息。
|
||
</view>
|
||
<view class="Package">
|
||
签名：
|
||
<span style='color:#C5C3C3;padding-left: 10rpx;font-size: 30rpx;'></span>
|
||
<view class="checkboxs">
|
||
<view class="uppicture" @tap='signatureshow=true'>
|
||
<image v-if="!userSignaturePictureUrl" style="width: 36rpx;height: 36rpx;margin:8% 0 0 35%"
|
||
src="@/static/autograph.png" mode="">
|
||
</image>
|
||
<span v-if="!userSignaturePictureUrl">点此签名</span>
|
||
<image v-else :src="userSignaturePictureUrl" mode=""></image>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="item">
|
||
<span>日期：</span>
|
||
<span class='addition'>
|
||
{{personInfo.regTime}}
|
||
</span>
|
||
</view>
|
||
</view>
|
||
<view class="priceback">
|
||
<view class="queren" @tap='updata'>保存</view>
|
||
</view>
|
||
<u-toast ref="uToast" />
|
||
<u-mask :show="signatureshow" @click="signatureshow = false">
|
||
<view style="position:absolute;bottom:0;height:900rpx;width:100%;background-color: #fff;"
|
||
v-if='signatureshow'>
|
||
<signature @userSignaturePictureUrl='userSignaturePicture' @click.native.stop
|
||
style='background-color: #F4F5F7;width: 100%;height: 900rpx;'></signature>
|
||
</view>
|
||
</u-mask>
|
||
<u-select v-model="examshow" :list="examlist" @confirm="examconfirm" value-name="id"
|
||
label-name="title"></u-select>
|
||
<u-calendar v-model="trainDateshow" mode="range" @change="trainDatechange"></u-calendar>
|
||
<u-toast ref="uToast" />
|
||
</view>
|
||
</template>
|
||
<script>
|
||
import {
|
||
info
|
||
} from '@/api/user/index.js'
|
||
import {
|
||
getExamList,
|
||
save
|
||
} from '@/api/addexam/index.js'
|
||
import baseurl from '@/api/baseurl.js'
|
||
import signature from '@/components/signature/signature.vue'
|
||
export default {
|
||
components: {
|
||
signature
|
||
},
|
||
data() {
|
||
return {
|
||
examshow: false,
|
||
trainDateshow: false,
|
||
signatureshow: false,
|
||
userSignaturePictureUrl: null,
|
||
examlist: [],
|
||
educationlist: [{
|
||
name: '初中',
|
||
label: 1,
|
||
checked: false,
|
||
},
|
||
{
|
||
name: '高中/中专',
|
||
label: 2,
|
||
checked: false,
|
||
},
|
||
{
|
||
name: '大专及以上',
|
||
label: 3,
|
||
checked: false,
|
||
}
|
||
],
|
||
regTypelist: [{
|
||
name: '普通医疗护理员',
|
||
label: 1,
|
||
checked: false,
|
||
},
|
||
{
|
||
name: '老年医疗护理员',
|
||
label: 2,
|
||
checked: false,
|
||
},
|
||
{
|
||
name: '孕产妇和新生儿医疗护理员',
|
||
label: 3,
|
||
checked: false,
|
||
}
|
||
],
|
||
action: baseurl + '/exam/api/file/upload',
|
||
header: {
|
||
token: uni.getStorageSync('examh5token')
|
||
},
|
||
fileList: [],
|
||
personInfo: {},
|
||
}
|
||
},
|
||
onShow() {},
|
||
onLoad() {
|
||
this.getTodayDate()
|
||
this.myInfo()
|
||
},
|
||
methods: {
|
||
uploadedcertificate(res) {
|
||
this.personInfo.certificate = res[0].response.data.url
|
||
},
|
||
uploadedphoto(res) {
|
||
this.personInfo.photo = res[0].response.data.url
|
||
},
|
||
uploadedcardBack(res) {
|
||
this.personInfo.cardBack = res[0].response.data.url
|
||
},
|
||
uploadedcardFront(res) {
|
||
this.personInfo.cardFront = res[0].response.data.url
|
||
},
|
||
examconfirm(e) {
|
||
let obj = this.examlist.filter(el => el.id == e[0].value)
|
||
this.personInfo.title = e[0].label
|
||
this.personInfo.examId = e[0].value
|
||
this.personInfo.startTime = obj[0].startTime
|
||
this.personInfo.endTime = obj[0].endTime
|
||
this.personInfo.startDate = obj[0].startDate
|
||
this.personInfo.endDate = obj[0].endDate
|
||
this.personInfo.examFee = obj[0].examFee
|
||
this.personInfo.examType = obj[0].examType
|
||
},
|
||
trainDatechange(e) {
|
||
this.personInfo.trainEndDate = e.endDate
|
||
this.personInfo.trainStartDate = e.startDate
|
||
},
|
||
//签名
|
||
userSignaturePicture(data) {
|
||
let that = this
|
||
this.userSignaturePictureUrl = data
|
||
this.signatureshow = false
|
||
uni.uploadFile({
|
||
url: baseurl + '/exam/api/file/upload',
|
||
filePath: this.userSignaturePictureUrl,
|
||
name: 'file',
|
||
header: this.header,
|
||
formData: {
|
||
type: 'signPictureUrl'
|
||
},
|
||
timeout: 5000,
|
||
success(res) {
|
||
that.personInfo.signPicture = JSON.parse(res.data).data.url
|
||
}
|
||
})
|
||
},
|
||
//确认
|
||
updata() {
|
||
this.$delete(this.personInfo, 'id');
|
||
save(this.personInfo).then(res => {
|
||
if (res.code == 0) {
|
||
this.$refs.uToast.show({
|
||
title: '报名考试成功!',
|
||
type: 'success',
|
||
duration: '1500',
|
||
back: true
|
||
})
|
||
}
|
||
})
|
||
},
|
||
myInfo() {
|
||
info({
|
||
token: uni.getStorageSync('examh5token')
|
||
}).then(res => {
|
||
if (res.code == 0) {
|
||
uni.setStorageSync("examh5token", res.data.token)
|
||
uni.setStorageSync("examh5user", {
|
||
id: res.data.id,
|
||
phone: res.data.phone,
|
||
name: res.data.realName,
|
||
cardNo: res.data.userName
|
||
})
|
||
this.personInfo = {
|
||
...res.data,
|
||
...this.personInfo
|
||
}
|
||
this.personInfo.sex = this.getsex(res.data.userName)
|
||
this.personInfo.userId = res.data.id
|
||
this.personInfo.birthday = this.getbirthday(res.data.userName)
|
||
}
|
||
})
|
||
getExamList().then(res => {
|
||
this.examlist = res.data
|
||
})
|
||
},
|
||
getTodayDate() {
|
||
const today = new Date();
|
||
this.personInfo.regTime = today.toISOString().split('T')[0];
|
||
},
|
||
getsex(idCard) {
|
||
// 在Vue组件的方法中
|
||
if (!idCard || idCard.length !== 18) {
|
||
return '身份证号码不合法';
|
||
}
|
||
// 获取第17位字符
|
||
const genderChar = idCard.charAt(16);
|
||
// 判断是否为数字
|
||
if (isNaN(genderChar)) {
|
||
return '身份证号码不合法';
|
||
}
|
||
// 转换为数字并判断奇偶
|
||
const genderNum = parseInt(genderChar, 10);
|
||
return genderNum % 2 === 1 ? '男' : '女';
|
||
},
|
||
getbirthday(idCard) {
|
||
// 在Vue组件的方法中
|
||
if (!idCard) {
|
||
return '身份证号码不能为空';
|
||
}
|
||
// 处理18位身份证
|
||
if (idCard.length === 18) {
|
||
if (!/^\d{17}[\dXx]$/.test(idCard)) {
|
||
return '身份证号码格式不正确';
|
||
}
|
||
// 提取出生年月日 YYYYMMDD
|
||
const birthdayStr = idCard.substr(6, 8);
|
||
// 格式化为 YYYY-MM-DD
|
||
return `${birthdayStr.substr(0, 4)}-${birthdayStr.substr(4, 2)}-${birthdayStr.substr(6, 2)}`;
|
||
}
|
||
// 处理15位身份证
|
||
if (idCard.length === 15) {
|
||
if (!/^\d{15}$/.test(idCard)) {
|
||
return '身份证号码格式不正确';
|
||
}
|
||
// 提取出生年月日 YYMMDD
|
||
const birthdayStr = idCard.substr(6, 6);
|
||
// 格式化为 19YY-MM-DD (15位身份证都是19XX年出生的)
|
||
return `19${birthdayStr.substr(0, 2)}-${birthdayStr.substr(2, 2)}-${birthdayStr.substr(4, 2)}`;
|
||
}
|
||
return '身份证号码长度不正确';
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
<style lang="scss">
|
||
@import './addexam.scss'
|
||
</style> |