exam-h5/pages/addexam/addexam.vue

503 lines
14 KiB
Vue
Raw Normal View History

2025-07-16 10:14:15 +08:00
<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'>
<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格式,&lt;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
},
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>