疗休养
This commit is contained in:
Paidax
@@ -0,0 +1,366 @@
|
||||
const BASE = {
|
||||
template: /*language=HTML*/ `
|
||||
<div>
|
||||
<div>
|
||||
<el-form :model="formData" ref="formRef" label-width="0" :rules="formRules" size="small">
|
||||
<el-descriptions :column="2" border class="descriptions-form">
|
||||
<el-descriptions-item label="姓名">
|
||||
<el-form-item prop="userName">
|
||||
<el-input v-model="formData.userName" readonly size="small"></el-input>
|
||||
</el-form-item>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="工号">
|
||||
<el-form-item prop="loginName">
|
||||
<el-input v-model="formData.loginName" readonly size="small"></el-input>
|
||||
</el-form-item>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="身份证件">
|
||||
<el-form-item prop="idCard">
|
||||
<el-input v-model="formData.idCard" placeholder="请输入身份证号码" maxlength="18"></el-input>
|
||||
</el-form-item>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="手机号">
|
||||
<el-form-item prop="mobile">
|
||||
<el-input v-model="formData.mobile" placeholder="请输入联系电话" maxlength="32"></el-input>
|
||||
</el-form-item>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="所属工会" :span="2">
|
||||
<el-form-item prop="unionName">
|
||||
<el-input v-model="formData.unionName" readonly size="small"></el-input>
|
||||
</el-form-item>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="报名酒店">
|
||||
<el-form-item prop="baseName">
|
||||
<el-input v-model="formData.baseName" readonly size="small"></el-input>
|
||||
</el-form-item>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="出行时间">
|
||||
<el-form-item prop="specificTime">
|
||||
<el-date-picker
|
||||
v-model="formData.specificTime"
|
||||
type="date"
|
||||
value-format="yyyy-MM-dd"
|
||||
placeholder="选择日期"
|
||||
:picker-options="datePickerOptions"
|
||||
:default-value="defaultPickerDate">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item label="签字" :span="3">
|
||||
<el-form-item prop="sign">
|
||||
<sign :is_value_base64="false" :qz.sync="formData.sign"
|
||||
prefix="RAPY" ref="sign"></sign>
|
||||
</el-form-item>
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item label="相关文件" :span="3">
|
||||
<div style="display: flex;justify-content: space-around">
|
||||
<div style="display: flex">
|
||||
<el-checkbox size="medium" style="width: 70%;color: #F56C6C;white-space: nowrap"
|
||||
@change="readChangeSafe" v-model="hasReadSafe">
|
||||
我已查看
|
||||
<span @click="openReadSafe" style="color: #0e5996; text-decoration: underline">
|
||||
《安全告知书》
|
||||
</span>
|
||||
<el-tag @click="openReadSafe" size="medium" effect="dark">查看</el-tag>
|
||||
</el-checkbox>
|
||||
</div>
|
||||
<div style="display: flex;" v-if="formData.specificTime && formData.sign">
|
||||
<el-checkbox size="medium" style="width: 70%;color: #F56C6C;white-space: nowrap"
|
||||
@change="readChange" v-model="hasRead">
|
||||
我已查看
|
||||
<span @click="openRead" style="color: #0e5996; text-decoration: underline">
|
||||
《定点自由行申请表》
|
||||
</span>
|
||||
<el-tag @click="openRead" size="medium" effect="dark">查看</el-tag>
|
||||
</el-checkbox>
|
||||
</div>
|
||||
</div>
|
||||
</el-descriptions-item>
|
||||
|
||||
</el-descriptions>
|
||||
|
||||
</el-form>
|
||||
|
||||
<el-row justify="end" type="flex" class="mt10">
|
||||
<el-button v-if="showButton" @click="joinSubmit" type="primary">提交报名</el-button>
|
||||
</el-row>
|
||||
</div>
|
||||
|
||||
<el-dialog title="安全告知书" :visible.sync="readVisibleSafe" :close-on-click-modal="false"
|
||||
:close-on-press-escape="false" append-to-body>
|
||||
<iframe
|
||||
:src="readSafeUrl + '#toolbar=0'"
|
||||
width="100%"
|
||||
height="550px"
|
||||
frameborder="0"
|
||||
></iframe>
|
||||
<el-row justify="end" type="flex" class="mt10">
|
||||
<el-button @click="onReadSafe" type="primary">我已阅读确认</el-button>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
|
||||
|
||||
<el-dialog title="定点自由行申请表" :visible.sync="readVisible" :close-on-click-modal="false"
|
||||
:close-on-press-escape="false" append-to-body>
|
||||
<iframe
|
||||
:src="readUrl"
|
||||
width="100%"
|
||||
height="550px"
|
||||
frameborder="0"
|
||||
></iframe>
|
||||
<el-row justify="end" type="flex" class="mt10">
|
||||
<el-button @click="onRead" type="primary">我已阅读确认</el-button>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
`,
|
||||
props: {
|
||||
config_data: { type: Object, required: true},
|
||||
},
|
||||
data(){
|
||||
return{
|
||||
id: '',
|
||||
index: '',
|
||||
enrollId: '',
|
||||
fromUrlByMy: '',
|
||||
baseData: {},
|
||||
formData: {
|
||||
userName: "",
|
||||
loginName: "",
|
||||
unionName: "",
|
||||
idCard: "",
|
||||
mobile: "",
|
||||
specificTime: '',
|
||||
sign: '',
|
||||
bedInfo: {},
|
||||
companionList: [],
|
||||
},
|
||||
formRules: {
|
||||
userName: [{required: false, message: "必填", trigger: ["change", "blur"]}],
|
||||
loginName: [{required: false, message: "必填", trigger: ["change", "blur"]}],
|
||||
specificTime: [{required: false, message: "必填", trigger: ["change", "blur"]}],
|
||||
},
|
||||
// 出行日期相关
|
||||
timeVisible: false,
|
||||
|
||||
// 定点疗休养申请表相关
|
||||
readVisible: false,
|
||||
hasRead: false,
|
||||
clickRead: false,
|
||||
readUrl: '',
|
||||
|
||||
// 修改其他线路相关
|
||||
editOther: '',
|
||||
|
||||
// 安全告知书相关
|
||||
readVisibleSafe: false,
|
||||
clickReadSafe: false,
|
||||
hasReadSafe: false,
|
||||
readSafeUrl: '',
|
||||
|
||||
showButton: true,
|
||||
|
||||
startTime: '',
|
||||
endTime: '',
|
||||
datePickerOptions: {
|
||||
disabledDate: (time) => {
|
||||
// 如果没有设置时间范围，允许选择所有日期
|
||||
if (!this.startTime || !this.endTime) {
|
||||
return false;
|
||||
}
|
||||
|
||||
// 将当前日期转换为 yyyy-MM-dd 格式字符串进行比较
|
||||
const currentDateStr = this.formatDate(time);
|
||||
|
||||
// 直接比较日期字符串（因为都是 yyyy-MM-dd 格式）
|
||||
return currentDateStr < this.startTime ||
|
||||
currentDateStr > this.endTime
|
||||
}
|
||||
},
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 将 Date 对象格式化为 yyyy-MM-dd
|
||||
formatDate(date) {
|
||||
const year = date.getFullYear();
|
||||
const month = (date.getMonth() + 1).toString().padStart(2, '0');
|
||||
const day = date.getDate().toString().padStart(2, '0');
|
||||
return year + '-' + month + '-' + day;
|
||||
},
|
||||
// 展示安全告知书
|
||||
async openReadSafe(){
|
||||
let pdfStreamUrl = encodeURIComponent(CREATE_PREVIEW_URL(this.config_data.files[0].id)) //将路径转码
|
||||
this.readSafeUrl = '/assets/platform/plugins/pdfJs/web/viewer.html?file=' + pdfStreamUrl
|
||||
this.readVisibleSafe = true
|
||||
|
||||
},
|
||||
onReadSafe() {
|
||||
this.clickReadSafe = true
|
||||
this.hasReadSafe = true
|
||||
this.readVisibleSafe = false
|
||||
},
|
||||
readChangeSafe() {
|
||||
if (this.clickReadSafe === false) {
|
||||
// this.$message.error('请先阅读《安全告知书》')
|
||||
this.hasReadSafe = false
|
||||
} else {
|
||||
this.hasReadSafe = true
|
||||
}
|
||||
},
|
||||
// 展示申请表
|
||||
async openRead(){
|
||||
const url = '/platform/theRapyRecuperation/baseManagement/showBaseApplyPdf?baseName='
|
||||
+ (this.formData.baseName ? this.formData.baseName : '') + '&specificTime=' + (this.formData.specificTime ? this.formData.specificTime : '')
|
||||
+ '&sign=' + (this.formData.sign ? this.formData.sign : '') + '&idCard=' + (this.formData.idCard ? this.formData.idCard : '')
|
||||
|
||||
let pdfStreamUrl = encodeURIComponent(url) //将路径转码
|
||||
this.readUrl = '/assets/platform/plugins/pdfJs/web/viewer.html?file=' + pdfStreamUrl
|
||||
|
||||
// this.readUrl = url
|
||||
this.readVisible = true
|
||||
// this.$nextTick(() => {
|
||||
// pdfh5 = new Pdfh5('#basePdf', {
|
||||
// pdfurl: url,
|
||||
// });
|
||||
// })
|
||||
},
|
||||
onRead() {
|
||||
this.clickRead = true
|
||||
this.hasRead = true
|
||||
this.readVisible = false
|
||||
},
|
||||
readChange() {
|
||||
if (this.clickRead === false) {
|
||||
// this.$message.error('请先阅读《定点自由行申请表》')
|
||||
this.hasRead = false
|
||||
}
|
||||
},
|
||||
//修改时查询报名信息，进行回显
|
||||
async findSignUpInfoById() {
|
||||
const res = await $.post('/platform/theRapyRecuperation/line/enroll/findSignUpInfoById', {
|
||||
id: this.enrollId,
|
||||
editOther: this.editOther
|
||||
})
|
||||
if (res.code === 0) {
|
||||
this.formData = res.data
|
||||
this.formData.bedInfo = {}
|
||||
this.formData.companionList = []
|
||||
this.$forceUpdate()
|
||||
}
|
||||
},
|
||||
async getTimeArray(){
|
||||
const resp = await $.post('/platform/theRapyRecuperation/baseManagement/getTimeArray', {
|
||||
id: this.id
|
||||
})
|
||||
if (resp.code === 0) {
|
||||
this.startTime = resp.data.minDate
|
||||
this.endTime = resp.data.maxDate
|
||||
}
|
||||
},
|
||||
async getData() {
|
||||
const res = await $.get('/platform/theRapyRecuperation/baseManagement/selectBaseAllInfo', {
|
||||
id: this.id
|
||||
})
|
||||
if (res.code === 0) {
|
||||
this.baseData = res.data
|
||||
this.formData.baseName = this.baseData.baseName
|
||||
}
|
||||
},
|
||||
async join(){
|
||||
if (this.fromUrlByMy !== 'editDo') {
|
||||
if (this.editOther) {
|
||||
this.$set(this.formData, 'baseName', this.baseData.baseName)
|
||||
this.$set(this.formData, 'takePartInLineId', null)
|
||||
this.$set(this.formData, 'takePartInUnionId', null)
|
||||
this.$set(this.formData, 'takePartInTravelAgencyId', null)
|
||||
this.$set(this.formData, 'takePartInBaseManagementId', this.baseData.id)
|
||||
} else {
|
||||
this.formData = {
|
||||
userName: "${@shiro.getPrincipalProperty('username')}",
|
||||
loginName: "${@shiro.getPrincipalProperty('loginname')}",
|
||||
unionName: "${@shiro.getPrincipalProperty('union').getUnionname()}",
|
||||
idCard: "${@shiro.getPrincipalProperty('idcard')}",
|
||||
mobile: "${@shiro.getPrincipalProperty('mobile')}",
|
||||
baseName: this.baseData.baseName,
|
||||
takePartInBaseManagementId: this.baseData.id,
|
||||
companionList: [],
|
||||
}
|
||||
}
|
||||
}
|
||||
if(this.index == 3) {
|
||||
await this.getTimeArray()
|
||||
}
|
||||
},
|
||||
joinSubmit(){
|
||||
if (this.hasReadSafe === false) {
|
||||
this.$message.error('请先阅读《安全告知书》')
|
||||
return
|
||||
}
|
||||
if (!this.formData.sign) {
|
||||
this.$message.error('请签字')
|
||||
return
|
||||
}
|
||||
if (this.hasRead === false) {
|
||||
this.$message.error('请先阅读《定点自由行申请表》')
|
||||
return
|
||||
}
|
||||
this.formData.editOther = this.editOther ? this.editOther : ''
|
||||
const cloneData = clone(this.formData)
|
||||
|
||||
this.$confirm('请确保信息填写无误，是否确认提交？', '提示', {
|
||||
confirmButtonText: '提交',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(async () => {
|
||||
this.showButton = false
|
||||
const loading = this.$loading({
|
||||
lock: true,
|
||||
text: '数据提交中...',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
})
|
||||
const resp = await $.post('/platform/theRapyRecuperation/line/enroll/doSignUpForBaseManagement', {
|
||||
enroll: JSON.stringify(cloneData),
|
||||
})
|
||||
loading.close()
|
||||
if (resp.code === 0) {
|
||||
this.$message.success('报名成功')
|
||||
this.$emit('success')
|
||||
// vant.Dialog.alert({
|
||||
// title: '提示',
|
||||
// message: '报名成功',
|
||||
// }).then(() => {
|
||||
// location.replace('/platform/mobile/theRapyRecuperation/myRecuperation?index=' + this.index)
|
||||
// })
|
||||
} else {
|
||||
this.$message.warning(resp.msg)
|
||||
this.showButton = true
|
||||
}
|
||||
})
|
||||
|
||||
},
|
||||
async initData(data){
|
||||
this.id = data.id
|
||||
this.index = data.index
|
||||
this.enrollId = data.enrollId
|
||||
this.fromUrlByMy = data.fromUrlByMy
|
||||
this.editOther = data.editOther
|
||||
|
||||
await this.getData()
|
||||
|
||||
if (this.enrollId || this.editOther) {
|
||||
await this.findSignUpInfoById()
|
||||
}
|
||||
await this.join()
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
defaultPickerDate() {
|
||||
return this.startTime ? new Date(this.startTime) : new Date();
|
||||
},
|
||||
},
|
||||
}
|
||||
Reference in New Issue
Block a user