562 lines
18 KiB
Vue
562 lines
18 KiB
Vue
<template>
|
|
<process-common-layout class="page-box" :loading="loading" :process-key="ProcessKey.PROJECT_COMPLIANCE_EVALUATION.value">
|
|
<template v-slot:process>
|
|
<!--流程信息-->
|
|
<div class="process-part">
|
|
<div class="process-part-title">{{ $t('processInformation') }}</div>
|
|
<van-form input-align="right" label-width="7.2em">
|
|
<!--流程名称-->
|
|
<van-field v-model="processInfo.processName"
|
|
:label="$t('processName')"
|
|
type="textarea"
|
|
autosize
|
|
readonly
|
|
rows="1"
|
|
:placeholder="$t('pleaseEnter')+$t('processName')"
|
|
:border="false" />
|
|
<!--截止日期-->
|
|
<van-field v-model="processInfo.processDueDate"
|
|
:label="$t('expirationDate')"
|
|
type="textarea"
|
|
autosize
|
|
readonly
|
|
rows="1"
|
|
:placeholder="$t('pleaseSelect')+$t('expirationDate')"
|
|
:border="false" />
|
|
<!--车型项目信息-->
|
|
<van-field v-model="projectInfo.projectName"
|
|
:label="$t('projectCompliance.vehicleItemInfo')"
|
|
type="textarea"
|
|
autosize
|
|
readonly
|
|
rows="1"
|
|
:placeholder="$t('pleaseEnter')+$t('projectCompliance.vehicleItemInfo')"
|
|
:border="false" />
|
|
<!--属性及文本附件-->
|
|
<van-field :label="$t('projectCompliance.propertiesAndTextAttachments')"
|
|
type="textarea"
|
|
autosize
|
|
readonly
|
|
rows="1"
|
|
:placeholder="$t('pleaseEnter')+$t('projectCompliance.propertiesAndTextAttachments')"
|
|
:border="false">
|
|
<div slot="input" v-if="standardList && standardList.length > 0">
|
|
<div v-for="item in standardList" :key="item.id">{{ item.standardNumber }} {{ item.standardName }}</div>
|
|
</div>
|
|
</van-field>
|
|
<!--流程说明-->
|
|
<van-field v-model="processInfo.processDescription"
|
|
:label="$t('processExplain')"
|
|
type="textarea"
|
|
autosize
|
|
disabled
|
|
rows="1"
|
|
:placeholder="$t('pleaseEnter')+$t('processExplain')"
|
|
:border="false"
|
|
input-align="left"
|
|
class="vertical-form-item">
|
|
</van-field>
|
|
</van-form>
|
|
</div>
|
|
|
|
<!--项目评估-->
|
|
<div class="process-part">
|
|
<div class="process-part-title">{{ $t('projectCompliance.projectAppraisal') }}</div>
|
|
<z-expand-table :columns="columns"
|
|
:dataSource="dataSource"
|
|
bordered
|
|
rowKey="id"
|
|
:pagination="ipagination"
|
|
:scroll="{x: '100%'}"
|
|
form-is-depend="evaluationFeedback"
|
|
:extra-form="extraForm"
|
|
:all-disabled="true"
|
|
@change="handleTableChange">
|
|
|
|
<!--序号-->
|
|
<template v-slot:serialNumber="{text,record,index}">
|
|
{{ parseInt(index) + 1 }}
|
|
</template>
|
|
<template v-slot:content="{text}">
|
|
<div class="table-text" v-if="!!text" @click="handleShowContentDetail(text)">
|
|
{{ text && text !== 'null' ? text.replace(/<.*?>/ig, ' ') : '' }}
|
|
</div>
|
|
</template>
|
|
</z-expand-table>
|
|
</div>
|
|
|
|
<!--流程审批信息-->
|
|
<div class="process-part">
|
|
<div class="process-part-title">{{ $t('processApprovalInfo') }}</div>
|
|
<van-form input-align="right" ref="approvalForm">
|
|
<!--备注-->
|
|
<van-field v-model="approvalInfo.handleText"
|
|
:label="$t('remark')"
|
|
type="textarea"
|
|
autosize
|
|
rows="1"
|
|
:placeholder="$t('pleaseEnter')+$t('remark')"
|
|
:border="false"
|
|
input-align="left"
|
|
:rules="rules.handleText"
|
|
class="vertical-form-item">
|
|
</van-field>
|
|
<!--附件-->
|
|
<z-upload v-model="approvalInfo.handleFile" />
|
|
</van-form>
|
|
</div>
|
|
</template>
|
|
|
|
<template v-slot:operation>
|
|
<!--转办-->
|
|
<van-button class="operation-common-btn" @click="handleTurnTo">
|
|
<template #icon>
|
|
<van-icon class="iconfont" class-prefix="icon" name="xunhuan" />
|
|
</template>
|
|
{{ $t('turnTo') }}
|
|
</van-button>
|
|
<!--同意-->
|
|
<van-button icon="revoke" class="operation-common-btn" type="primary" @click="handleAgree">
|
|
<template #icon>
|
|
<van-icon class="iconfont" class-prefix="icon" name="check" />
|
|
</template>
|
|
{{ $t('agree') }}
|
|
</van-button>
|
|
<!--驳回-->
|
|
<van-button icon="revoke" class="operation-common-btn light-color-button" @click="handleReject">
|
|
<template #icon>
|
|
<van-icon class="iconfont" class-prefix="icon" name="close" />
|
|
</template>
|
|
{{ $t('reject') }}
|
|
</van-button>
|
|
</template>
|
|
|
|
<!--转办选人-->
|
|
<select-user ref="selectUser" @selected-change="continueTurnTo" />
|
|
|
|
<!--条款内容-->
|
|
<van-popup v-model="showContentDetail"
|
|
closeable
|
|
round
|
|
position="bottom"
|
|
safe-area-inset-bottom
|
|
:style="{ height: '50%' }">
|
|
<div class="content-detail-text" v-html="contentDetail"></div>
|
|
</van-popup>
|
|
</process-common-layout>
|
|
</template>
|
|
|
|
<script>
|
|
import ProcessCommonLayout from '../../../components/ProcessCommonLayout'
|
|
import { ProcessKey, ProjectComplianceEvaluationProcessNode } from '../../../enums/commonEnums'
|
|
import ZUpload from '../../../components/ZUpload'
|
|
import SelectUser from '../../../components/SelectUser'
|
|
import {
|
|
processTransfer,
|
|
queryProjectComplianceEvaluation,
|
|
agreeProjectComplianceEvaluation,
|
|
rejectProjectComplianceEvaluation
|
|
} from '../../../api/api'
|
|
import ZExpandTable from '../../../components/ZExpandTable'
|
|
|
|
export default {
|
|
name: 'ProjectComplianceEvaluationProcess',
|
|
components: { SelectUser, ZUpload, ProcessCommonLayout, ZExpandTable },
|
|
data () {
|
|
return {
|
|
ProcessKey,
|
|
loading: false,
|
|
processInfo: {}, // 流程信息
|
|
approvalInfo: {}, // 流程审批信息
|
|
rules: {
|
|
handleText: [{ required: false, message: this.$t('pleaseEnter') + this.$t('remark'), trigger: 'onBlur' }]
|
|
},
|
|
projectInfo: {}, // 项目信息
|
|
standardList: [], // 属性及文本附件的内容（多个标准）
|
|
basicColumns: [
|
|
// 序号
|
|
{
|
|
title: this.$t('serialNumber'),
|
|
width: 80,
|
|
dataIndex: 'id',
|
|
align: 'center',
|
|
scopedSlots: { customRender: 'serialNumber' }
|
|
},
|
|
// 标准编号/条款号
|
|
{
|
|
dataIndex: 'termNumber',
|
|
title: this.$t('projectCompliance.standardNumberClauseNumber'),
|
|
width: 150,
|
|
align: 'center'
|
|
},
|
|
// 标准名称/条款名称
|
|
{
|
|
dataIndex: 'termName',
|
|
title: this.$t('projectCompliance.standardNameClauseName'),
|
|
width: 160,
|
|
align: 'center'
|
|
},
|
|
// 条款内容
|
|
{
|
|
dataIndex: 'termText',
|
|
title: this.$t('projectCompliance.terms'),
|
|
width: 150,
|
|
align: 'center',
|
|
scopedSlots: { customRender: 'content' }
|
|
},
|
|
// 上一节点处理人
|
|
{
|
|
title: this.$t('projectCompliance.preNodeProcessesPeople'),
|
|
dataIndex: 'previousNodeHandler',
|
|
width: 150,
|
|
align: 'center'
|
|
},
|
|
// 评估结果
|
|
{
|
|
title: this.$t('projectCompliance.evaluationResult'),
|
|
dataIndex: 'evaluationFeedback_dictText',
|
|
width: 150,
|
|
align: 'center'
|
|
}
|
|
],
|
|
dataSource: [],
|
|
// 展开表格的配置项
|
|
extraForm: {
|
|
// 符合
|
|
'1': {
|
|
rules: {
|
|
// 依据描述
|
|
description: {
|
|
required: true,
|
|
message: this.$t('pleaseEnter') + this.$t('standardConsultation.basisDescription'),
|
|
trigger: 'blur'
|
|
},
|
|
// 佐证材料
|
|
fileId: {
|
|
required: false,
|
|
message: this.$t('pleaseUpload') + this.$t('standardConsultation.supportingMaterial'),
|
|
trigger: 'change'
|
|
}
|
|
},
|
|
formArr: [
|
|
{
|
|
fieldShowType: 1,
|
|
dbFieldTxt: this.$t('standardConsultation.basisDescription'),
|
|
dbFieldName: 'description'
|
|
},
|
|
{
|
|
fieldShowType: 2,
|
|
dbFieldTxt: this.$t('standardConsultation.supportingMaterial'),
|
|
dbFieldName: 'fileId',
|
|
fileType: 'pdf,doc,docx,pptx,ppt,jpg,jpeg,png,xls,xlsx,bmp'
|
|
}
|
|
]
|
|
},
|
|
// 不符合
|
|
'2': {
|
|
rules: {
|
|
// 不符合项
|
|
nonConformance: {
|
|
required: true,
|
|
message: this.$t('pleaseEnter') + this.$t('projectCompliance.nonConformanceTerm'),
|
|
trigger: 'blur'
|
|
},
|
|
// 应对措施
|
|
countermeasures: {
|
|
required: true,
|
|
message: this.$t('pleaseEnter') + this.$t('projectCompliance.solutions'),
|
|
trigger: 'blur'
|
|
},
|
|
// 预计整改完成日期
|
|
expectedTime: {
|
|
required: true,
|
|
message: this.$t('pleaseSelect') + this.$t('projectCompliance.estimatedDateOfCompletionOfRectification'),
|
|
trigger: 'change'
|
|
}
|
|
},
|
|
formArr: [
|
|
{
|
|
fieldShowType: 1,
|
|
dbFieldTxt: this.$t('projectCompliance.nonConformanceTerm'),
|
|
dbFieldName: 'nonConformance'
|
|
},
|
|
{
|
|
fieldShowType: 1,
|
|
dbFieldTxt: this.$t('projectCompliance.solutions'),
|
|
dbFieldName: 'countermeasures'
|
|
},
|
|
{
|
|
fieldShowType: 3,
|
|
dbFieldTxt: this.$t('projectCompliance.estimatedDateOfCompletionOfRectification'),
|
|
dbFieldName: 'expectedTime'
|
|
}
|
|
]
|
|
},
|
|
// 待验证
|
|
'3': {
|
|
rules: {
|
|
// 风险点
|
|
riskPoints: {
|
|
required: true,
|
|
message: this.$t('pleaseEnter') + this.$t('projectCompliance.riskPoint'),
|
|
trigger: 'blur'
|
|
},
|
|
// 验证方案
|
|
validateSolution: {
|
|
required: true,
|
|
message: this.$t('pleaseEnter') + this.$t('projectCompliance.proofScheme'),
|
|
trigger: 'blur'
|
|
},
|
|
// 预计整改完成日期
|
|
expectedTime: {
|
|
required: true,
|
|
message: this.$t('pleaseSelect') + this.$t('projectCompliance.estimatedDateOfCompletionOfRectification'),
|
|
trigger: 'change'
|
|
}
|
|
},
|
|
formArr: [
|
|
{
|
|
fieldShowType: 1,
|
|
dbFieldTxt: this.$t('projectCompliance.riskPoint'),
|
|
dbFieldName: 'riskPoints'
|
|
},
|
|
{
|
|
fieldShowType: 1,
|
|
dbFieldTxt: this.$t('projectCompliance.proofScheme'),
|
|
dbFieldName: 'validateSolution'
|
|
},
|
|
{
|
|
fieldShowType: 3,
|
|
dbFieldTxt: this.$t('projectCompliance.estimatedDateOfCompletionOfRectification'),
|
|
dbFieldName: 'expectedTime'
|
|
}
|
|
]
|
|
},
|
|
// 不涉及
|
|
'4': {
|
|
rules: {
|
|
// 不涉及原因
|
|
description: {
|
|
required: true,
|
|
message: this.$t('pleaseEnter') + this.$t('projectCompliance.noCauseInvolved'),
|
|
trigger: 'blur'
|
|
}
|
|
},
|
|
formArr: [
|
|
{
|
|
fieldShowType: 1,
|
|
dbFieldTxt: this.$t('projectCompliance.noCauseInvolved'),
|
|
dbFieldName: 'description'
|
|
}
|
|
]
|
|
}
|
|
},
|
|
showContentDetail: false,
|
|
contentDetail: null,
|
|
businessId: null,
|
|
/* 分页参数 */
|
|
ipagination: {
|
|
current: 1,
|
|
pageSize: 10,
|
|
pageSizeOptions: ['10', '30', '50', '100', '150', '200'],
|
|
showTotal: (total, range) => {
|
|
return range[0] + '-' + range[1] + ' ' + this.$t('total') + total + this.$t('strip')
|
|
},
|
|
showQuickJumper: true,
|
|
showSizeChanger: true,
|
|
total: 0
|
|
},
|
|
currentNode: null
|
|
}
|
|
},
|
|
computed: {
|
|
columns () {
|
|
const list = JSON.parse(JSON.stringify(this.basicColumns))
|
|
// 各部门主管级领导审批是评估人
|
|
if (this.currentNode === ProjectComplianceEvaluationProcessNode.departLeaderApproval.value) {
|
|
list[4] = {
|
|
// 评估人
|
|
title: this.$t('projectCompliance.evaluator'),
|
|
dataIndex: 'assessorName',
|
|
width: 150,
|
|
align: 'center',
|
|
scopedSlots: { customRender: 'text' }
|
|
}
|
|
}
|
|
return list
|
|
}
|
|
},
|
|
created () {
|
|
this.currentNode = this.$route.query.nodeId
|
|
this.initProcessData()
|
|
},
|
|
methods: {
|
|
/**
|
|
* 初始化流程数据
|
|
*/
|
|
initProcessData () {
|
|
const params = {
|
|
processInstanceId: this.$route.query.processInstanceId,
|
|
taskId: this.$route.query.taskId
|
|
}
|
|
this.loading = true
|
|
queryProjectComplianceEvaluation(params).then(res => {
|
|
if (res.success) {
|
|
const { result = {} } = res
|
|
this.processInfo = Object.assign({}, result.basicProcessInfoDTO || {})
|
|
this.approvalInfo = Object.assign({}, result.basicTaskInfoDTO || {})
|
|
// 处理车型项目信息
|
|
this.projectInfo = Object.assign({}, result.businessInfoDTO.processProjectAssess || {})
|
|
// 处理标准信息
|
|
this.standardList = result.businessInfoDTO.processProjectAssessLinkList || []
|
|
this.dataSource = result.businessInfoDTO.processProjectAssessTermList || []
|
|
this.businessId = result.businessId
|
|
} else {
|
|
this.$message(res.message)
|
|
}
|
|
}).finally(() => {
|
|
this.loading = false
|
|
})
|
|
},
|
|
async dealFormData () {
|
|
let flag = true, approvalInfo = {}
|
|
const approvalCheckResult = await this.validateForm('approvalForm')
|
|
if (approvalCheckResult) {
|
|
approvalInfo = { ...this.approvalInfo, taskId: this.$route.query.taskId }
|
|
} else {
|
|
flag = false
|
|
this.$message(this.$t('pleaseEnterRemarks'))
|
|
}
|
|
if (!flag) {
|
|
return false
|
|
}
|
|
return {
|
|
basicProcessInfoDTO: { ...this.processInfo },
|
|
businessInfoDTO: {
|
|
processProjectAssessTermList: JSON.parse(JSON.stringify(this.dataSource))
|
|
},
|
|
basicTaskInfoDTO: approvalInfo,
|
|
businessId: this.businessId
|
|
}
|
|
},
|
|
validateForm (formName) {
|
|
let flag = true
|
|
return new Promise(resolve => {
|
|
if (this.$refs[formName]) {
|
|
this.$refs[formName].validate().then(() => {
|
|
}).catch(() => {
|
|
flag = false
|
|
}).finally(() => {
|
|
resolve(flag)
|
|
})
|
|
} else {
|
|
resolve(flag)
|
|
}
|
|
})
|
|
},
|
|
/**
|
|
* 同意
|
|
*/
|
|
async handleAgree () {
|
|
this.rules.handleText[0].required = false
|
|
if (!this.approvalInfo.handleText) {
|
|
this.approvalInfo.handleText = '同意'
|
|
}
|
|
const formData = await this.dealFormData()
|
|
if (!formData) {
|
|
return
|
|
}
|
|
this.loading = true
|
|
agreeProjectComplianceEvaluation(formData).then(res => {
|
|
this.$message(res.message)
|
|
if (res.success) {
|
|
this.goBack()
|
|
}
|
|
}).finally(() => {
|
|
this.loading = false
|
|
})
|
|
},
|
|
/**
|
|
* 驳回
|
|
*/
|
|
async handleReject () {
|
|
this.rules.handleText[0].required = true
|
|
const formData = await this.dealFormData()
|
|
if (!formData) {
|
|
return
|
|
}
|
|
this.loading = true
|
|
rejectProjectComplianceEvaluation(formData).then(res => {
|
|
this.$message(res.message)
|
|
if (res.success) {
|
|
this.goBack()
|
|
}
|
|
}).finally(() => {
|
|
this.loading = false
|
|
})
|
|
},
|
|
/**
|
|
* 转办
|
|
*/
|
|
handleTurnTo () {
|
|
this.$refs.selectUser.open()
|
|
},
|
|
continueTurnTo (userId) {
|
|
const params = {
|
|
taskId: this.$route.query.taskId,
|
|
userId
|
|
}
|
|
this.loading = true
|
|
processTransfer(params).then(res => {
|
|
this.$message(res.message)
|
|
if (res.success) {
|
|
this.goBack()
|
|
}
|
|
}).finally(() => {
|
|
this.loading = false
|
|
})
|
|
},
|
|
goBack () {
|
|
let timer = setTimeout(() => {
|
|
clearTimeout(timer)
|
|
timer = null
|
|
this.$router.go(-1)
|
|
}, 700)
|
|
},
|
|
handleShowContentDetail (text) {
|
|
this.contentDetail = text
|
|
this.showContentDetail = true
|
|
},
|
|
handleTableChange (pagination) {
|
|
this.ipagination = pagination
|
|
}
|
|
},
|
|
// 组件内路由拦截
|
|
beforeRouteEnter (to, from, next) {
|
|
// 如果不是移动端支持的节点，就跳转NoMobile
|
|
if (!ProjectComplianceEvaluationProcessNode.propertyOfValue('isMobile', to.query.nodeId)) {
|
|
next({ path: '/noMobile' })
|
|
}
|
|
next()
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="less">
|
|
@import '~../../../assets/less/common.less';
|
|
|
|
.content-detail-text {
|
|
height: calc(100% - 54px);
|
|
margin-top: 54px;
|
|
padding: @pad-base;
|
|
overflow: auto;
|
|
word-break: break-word;
|
|
}
|
|
|
|
.table-text {
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
}
|
|
</style>
|