369 lines
10 KiB
Vue
369 lines
10 KiB
Vue
<template>
|
|
<view>
|
|
<Navbar title="审批详情" />
|
|
<div class="content">
|
|
<Title title="基本信息" />
|
|
<u-form
|
|
labelPosition="left"
|
|
:model="formData"
|
|
ref="addressForm"
|
|
labelWidth="120"
|
|
:labelStyle="{ fontWeight: 400, fontSize: '12px', color: 'rgba(15, 39, 75, 0.6)' }"
|
|
>
|
|
<!-- 姓名 -->
|
|
<u-form-item label="姓名" borderBottom>
|
|
<u-input
|
|
v-model="formData.name"
|
|
disabled
|
|
disabledColor="#fff"
|
|
border="none"
|
|
inputAlign="right"
|
|
fontSize="12"
|
|
style="font-weight: 500"
|
|
/>
|
|
</u-form-item>
|
|
<!-- 联系方式 -->
|
|
<u-form-item label="联系方式" borderBottom>
|
|
<u-input
|
|
v-model="formData.phone"
|
|
disabled
|
|
disabledColor="#fff"
|
|
border="none"
|
|
inputAlign="right"
|
|
fontSize="12"
|
|
style="font-weight: 500"
|
|
/>
|
|
</u-form-item>
|
|
<!-- 性别 -->
|
|
<u-form-item label="性别" borderBottom>
|
|
<u-input
|
|
v-model="formData.sex"
|
|
disabled
|
|
disabledColor="#fff"
|
|
border="none"
|
|
inputAlign="right"
|
|
fontSize="12"
|
|
style="font-weight: 500"
|
|
/>
|
|
</u-form-item>
|
|
<!-- 出生日期 -->
|
|
<!-- <u-form-item label="出生日期" borderBottom>
|
|
<u-input
|
|
v-model="formData.birthday"
|
|
disabled
|
|
disabledColor="#fff"
|
|
border="none"
|
|
inputAlign="right"
|
|
fontSize="12"
|
|
style="font-weight: 500"
|
|
/>
|
|
</u-form-item> -->
|
|
<!-- 身份证号 -->
|
|
<u-form-item label="身份证号码" borderBottom>
|
|
<u-input
|
|
v-model="formData.idCard"
|
|
disabled
|
|
disabledColor="#fff"
|
|
border="none"
|
|
inputAlign="right"
|
|
fontSize="12"
|
|
style="font-weight: 500"
|
|
/>
|
|
</u-form-item>
|
|
<!-- 工种 -->
|
|
<u-form-item label="岗位" borderBottom>
|
|
<u-input
|
|
v-model="formData.postName"
|
|
disabled
|
|
disabledColor="#fff"
|
|
border="none"
|
|
inputAlign="right"
|
|
fontSize="12"
|
|
style="font-weight: 500"
|
|
/>
|
|
</u-form-item>
|
|
<!-- 特种工种 -->
|
|
<u-form-item label="特殊工种" borderBottom v-if="formData.workType">
|
|
<u-input
|
|
v-model="formData.workType"
|
|
disabled
|
|
disabledColor="#fff"
|
|
border="none"
|
|
inputAlign="right"
|
|
fontSize="12"
|
|
style="font-weight: 500"
|
|
/>
|
|
</u-form-item>
|
|
</u-form>
|
|
|
|
<Title title="人脸照片" />
|
|
<div class="id-card">
|
|
<u--image
|
|
v-if="formData.faceUrl"
|
|
:showLoading="true"
|
|
:src="formData.faceUrl"
|
|
width="100px"
|
|
height="50px"
|
|
radius="4"
|
|
style="margin-right: 18px"
|
|
@click="clickImg(formData.faceUrl)"
|
|
/>
|
|
</div>
|
|
<div>
|
|
<Title title="体检文件" />
|
|
<Preview :dataList="formData.physicalExaminationFile" />
|
|
</div>
|
|
<div>
|
|
<Title title="保险文件" />
|
|
<Preview :dataList="formData.insuranceFile" />
|
|
</div>
|
|
<div>
|
|
<Title title="其他附件" />
|
|
<Preview :dataList="formData.otherFile" />
|
|
</div>
|
|
<div v-if="isLeave">
|
|
<Title title="离场原因" />
|
|
<u--textarea v-model="formData.reason" height="105" :disabled="true" />
|
|
</div>
|
|
<Title title="审批意见" />
|
|
<u--textarea v-model="approvalOpinion" placeholder="请输入内容" count height="105" :disabled="isDetail" @blur="filter" />
|
|
<Title title="审批记录" />
|
|
<Steps :data="approvalRecordList" />
|
|
<TabbarBtn
|
|
v-if="!isDetail"
|
|
:showBtn="opt.finalCheck != 0 ? true : false"
|
|
@reject="reject"
|
|
@handlePermit="handlePermit"
|
|
@handleEnd="handleEnd"
|
|
/>
|
|
</div>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import Steps from 'pages/component/Steps'
|
|
import TabbarBtn from './component/TabbarBtn'
|
|
import { approvalHistory, submitPersonApproval, getSubPersonnelDetails } from '@/api/project'
|
|
import config from '@/config'
|
|
import { filterInput } from '@/utils/regular'
|
|
|
|
export default {
|
|
components: { Steps, TabbarBtn },
|
|
data() {
|
|
return {
|
|
opt: {},
|
|
isDetail: false,
|
|
isLeave: false,
|
|
showBtn: true,
|
|
idCardImgs: [
|
|
/* 'https://img.yzcdn.cn/vant/cat.jpeg', 'https://cdn.uviewui.com/uview/album/1.jpg' */
|
|
],
|
|
formData: {
|
|
name: '',
|
|
phone: '',
|
|
sex: '',
|
|
// birthday: '',
|
|
idCard: '',
|
|
postName: '', // 岗位
|
|
workType: '', // 特种工种
|
|
facePhoto: [], // 人脸照片
|
|
physicalExaminationFile: [], // 体检文件
|
|
insuranceFile: [], // 保险文件
|
|
otherFile: [] // 其他附件
|
|
},
|
|
// 审批意见
|
|
approvalOpinion: '',
|
|
// 审批记录
|
|
approvalRecordList: []
|
|
}
|
|
},
|
|
onLoad(opt) {
|
|
this.opt = JSON.parse(opt.params)
|
|
console.log('🚀 ~ onLoad ~ this.opt:', this.opt)
|
|
this.isDetail = this.opt.isDetail
|
|
this.isLeave = opt.isLeave && opt.isLeave === 'true'
|
|
this.getSubPersonnelDetails()
|
|
this.getApprovalRecord()
|
|
},
|
|
methods: {
|
|
// 过滤输入框
|
|
filter() {
|
|
this.approvalOpinion = filterInput(this.approvalOpinion)
|
|
},
|
|
// 图片预览
|
|
clickImg(url) {
|
|
uni.previewImage({
|
|
urls: [url]
|
|
})
|
|
},
|
|
// 获取人员详情
|
|
async getSubPersonnelDetails() {
|
|
const params = {
|
|
uuid: this.opt.uuid
|
|
}
|
|
const res = await getSubPersonnelDetails(params)
|
|
console.log('人员详情', res)
|
|
if (res.code === 200) {
|
|
this.formData = res.data
|
|
this.formData.faceUrl = config.fileUrl + this.formData.faceUrl
|
|
}
|
|
},
|
|
// 获取审批记录
|
|
async getApprovalRecord() {
|
|
const params = {
|
|
taskId: this.opt.taskId
|
|
}
|
|
console.log('🚀 ~ getApprovalRecord ~ params:', params)
|
|
const res = await approvalHistory(params)
|
|
console.log('审批记录', res)
|
|
if (res.code === 200) {
|
|
this.approvalRecordList = res.data
|
|
console.log('🚀 ~ getApprovalRecord ~ this.approvalRecordList:', this.approvalRecordList)
|
|
}
|
|
},
|
|
// 驳回
|
|
reject(val) {
|
|
console.log('驳回原因-->父元素:', val)
|
|
const params = {
|
|
proId: this.opt.proId,
|
|
supId: this.opt.supId,
|
|
supUuid: this.opt.supUuid,
|
|
taskId: this.opt.taskId,
|
|
procInstId: this.opt.procInsId,
|
|
finalCheck: this.opt.finalCheck,
|
|
reason: this.approvalOpinion,
|
|
agree: '2',
|
|
rejectReason: val
|
|
}
|
|
if (this.isLoading) {
|
|
uni.showToast({
|
|
title: '请勿重复提交',
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
this.isLoading = true
|
|
console.log('🚀 ~ reject ~ params:', params)
|
|
submitPersonApproval(params)
|
|
.then(res => {
|
|
console.log('驳回', res)
|
|
if (res.code === 200) {
|
|
uni.showToast({
|
|
title: '驳回成功',
|
|
icon: 'none'
|
|
})
|
|
setTimeout(() => {
|
|
uni.navigateBack()
|
|
this.isLoading = false
|
|
}, 800)
|
|
}
|
|
})
|
|
.catch(err => {
|
|
console.log('🚀 ~ err:', err)
|
|
setTimeout(() => {
|
|
uni.navigateBack()
|
|
this.isLoading = false
|
|
}, 300)
|
|
})
|
|
},
|
|
// 通过
|
|
handlePermit() {
|
|
if (this.isLoading) {
|
|
uni.showToast({
|
|
title: '请勿重复提交',
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
this.isLoading = true
|
|
const params = {
|
|
proId: this.opt.proId,
|
|
supId: this.opt.supId,
|
|
supUuid: this.opt.supUuid,
|
|
taskId: this.opt.taskId,
|
|
procInstId: this.opt.procInsId,
|
|
finalCheck: this.opt.finalCheck,
|
|
reason: this.approvalOpinion,
|
|
agree: '1'
|
|
}
|
|
console.log('🚀 ~ handlePermit ~ params:', params)
|
|
submitPersonApproval(params)
|
|
.then(res => {
|
|
console.log('通过', res)
|
|
if (res.code === 200) {
|
|
uni.showToast({
|
|
title: '审批成功',
|
|
icon: 'none'
|
|
})
|
|
setTimeout(() => {
|
|
uni.navigateBack()
|
|
this.isLoading = false
|
|
}, 800)
|
|
}
|
|
})
|
|
.catch(err => {
|
|
console.log('🚀 ~ err:', err)
|
|
setTimeout(() => {
|
|
uni.navigateBack()
|
|
this.isLoading = false
|
|
}, 300)
|
|
})
|
|
},
|
|
// 终审
|
|
handleEnd() {
|
|
if (this.isLoading) {
|
|
uni.showToast({
|
|
title: '请勿重复提交',
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
this.isLoading = true
|
|
const params = {
|
|
proId: this.opt.proId,
|
|
supId: this.opt.supId,
|
|
supUuid: this.opt.supUuid,
|
|
taskId: this.opt.taskId,
|
|
procInstId: this.opt.procInsId,
|
|
finalCheck: this.opt.finalCheck,
|
|
reason: this.approvalOpinion,
|
|
agree: '3'
|
|
}
|
|
console.log('🚀 ~ handleEnd ~ params:', params)
|
|
submitPersonApproval(params)
|
|
.then(res => {
|
|
console.log('通过', res)
|
|
if (res.code === 200) {
|
|
uni.showToast({
|
|
title: '终审成功',
|
|
icon: 'none'
|
|
})
|
|
setTimeout(() => {
|
|
uni.navigateBack()
|
|
this.isLoading = false
|
|
}, 800)
|
|
}
|
|
})
|
|
.catch(err => {
|
|
console.log('🚀 ~ err:', err)
|
|
setTimeout(() => {
|
|
uni.navigateBack()
|
|
this.isLoading = false
|
|
}, 300)
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.content {
|
|
padding: 0 20px;
|
|
|
|
.id-card {
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
}
|
|
}
|
|
</style>
|