511 lines
15 KiB
Vue
511 lines
15 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'>
|
||
<u-input type="text" placeholder="请输入电子邮箱" v-model="personInfo.email" />
|
||
</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>通讯地址：</span>
|
||
<span class='addition'>
|
||
<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'>
|
||
<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'>
|
||
<u-input type="text" placeholder="请输入毕业院校" v-model="personInfo.graduateSchool" />
|
||
</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>专业(如适用)：</span>
|
||
<span class='addition'>
|
||
<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'>
|
||
<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="padding: 10rpx 0;">
|
||
<span>机构名称：</span>
|
||
<span class='addition'>
|
||
<u-input type="text" placeholder="请输入机构名称" v-model="personInfo.trainInstitution" />
|
||
</span>
|
||
</view>
|
||
<view class="item" style="padding: 10rpx 0;">
|
||
<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>
|
||
<view class="" v-if="personInfo.trainStartDate" style="padding: 16rpx 0;">
|
||
{{personInfo.trainStartDate+'至'}}{{personInfo.trainEndDate}}
|
||
</view>
|
||
</view>
|
||
</span>
|
||
</view>
|
||
</view>
|
||
<view class="user">
|
||
<view class="title">
|
||
四、上传材料
|
||
</view>
|
||
<view class="item">
|
||
<span>身份证正面：</span>
|
||
<span class='addition'>
|
||
<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-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" style="line-height: 50rpx;">
|
||
<span>近期白底免冠证件照(1寸,JPG格式,<20KB)：</span>
|
||
<span class='addition'>
|
||
<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" style="line-height: 50rpx;">
|
||
<span>学历证明(毕业证或学信网截图)：</span>
|
||
<span class='addition'>
|
||
<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: {
|
||
"address": "",
|
||
"cardBack": "",
|
||
"cardCopy": "", // 身份证正反面复印件
|
||
"cardFront": "",
|
||
"certificate": "",
|
||
"education": 0,
|
||
"email": "",
|
||
"examId": "",
|
||
startTime: undefined,
|
||
endTime: undefined,
|
||
startDate: undefined,
|
||
endDate: undefined,
|
||
"graduateSchool": "",
|
||
"major": "",
|
||
"phone": "",
|
||
"photo": "",
|
||
"physicalReport": "", //健康体检报告
|
||
"realName": "",
|
||
"regTime": "",
|
||
"regType": 0,
|
||
"signPicture": "",
|
||
"title": "",
|
||
"trainEndDate": "",
|
||
"trainInstitution": "",
|
||
"trainStartDate": "",
|
||
"userId": "",
|
||
"userName": "",
|
||
examFee: undefined,
|
||
},
|
||
}
|
||
},
|
||
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() {
|
||
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.realName = res.data.realName
|
||
this.personInfo.userId = res.data.id
|
||
this.personInfo.phone = res.data.phone
|
||
this.personInfo.userName = res.data.userName
|
||
this.personInfo.sex = this.getsex(res.data.userName)
|
||
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 '身份证号码长度不正确';
|
||
},
|
||
argAdd(arg1, arg2) {
|
||
// 加法函数
|
||
var _this = this,
|
||
r1 = 0,
|
||
r2 = 0,
|
||
m = 0;
|
||
try {
|
||
r1 = arg1.toString().split(".")[1].length
|
||
} catch (e) {}
|
||
try {
|
||
r2 = arg2.toString().split(".")[1].length
|
||
} catch (e) {}
|
||
m = Math.pow(10, Math.max(r1, r2))
|
||
return _this.argDiv((_this.argMul(arg1, m) + _this.argMul(arg2, m)), m)
|
||
},
|
||
argSubtr(arg1, arg2) {
|
||
// 减法函数
|
||
var _this = this,
|
||
r1 = 0,
|
||
r2 = 0,
|
||
m = 0;
|
||
try {
|
||
r1 = arg1.toString().split(".")[1].length
|
||
} catch (e) {}
|
||
try {
|
||
r2 = arg2.toString().split(".")[1].length
|
||
} catch (e) {}
|
||
m = Math.pow(10, Math.max(r1, r2));
|
||
return _this.argDiv((_this.argMul(arg1, m) - _this.argMul(arg2, m)), m)
|
||
},
|
||
argMul(arg1, arg2) {
|
||
// 乘法函数
|
||
var _this = this,
|
||
m = 0,
|
||
s1 = arg1.toString(),
|
||
s2 = arg2.toString();
|
||
try {
|
||
m += s1.split(".")[1].length
|
||
} catch (e) {}
|
||
try {
|
||
m += s2.split(".")[1].length
|
||
} catch (e) {}
|
||
return Number(s1.replace(".", "")) * Number(s2.replace(".", "")) / Math.pow(10, m)
|
||
},
|
||
argDiv(arg1, arg2) {
|
||
// 除法函数
|
||
var _this = this,
|
||
t1 = 0,
|
||
t2 = 0,
|
||
r1, r2;
|
||
try {
|
||
t1 = arg1.toString().split(".")[1].length
|
||
} catch (e) {}
|
||
try {
|
||
t2 = arg2.toString().split(".")[1].length
|
||
} catch (e) {}
|
||
r1 = Number(arg1.toString().replace(".", ""))
|
||
r2 = Number(arg2.toString().replace(".", ""))
|
||
return _this.argMul((r1 / r2), Math.pow(10, t2 - t1));
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
<style lang="scss">
|
||
@import './addexam.scss'
|
||
</style> |