Files
laws_chery_client/src/views/workCenter/newRegulationIntroductionProcess/NewRegulationIntroductionProcess.vue
T

615 lines
23 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<internal-detail-page :title="pageTitle" :content-padding="0" :loading="loading">
<!-- 标题右侧tab -->
<template v-slot:titleRightCustom v-if="!isLook">
<div class="table-operator-tab">
<a :class="(switchValue === 'base' ? 'table-operator-tab-active' : '') + ' ' + ($i18n.locale === EN ? 'switch-item-en' : 'switch-item')"
@click="switchChange('base')">{{ $t('basicInformation') }}
</a>
<a :class="(switchValue === 'user' ? 'table-operator-tab-active' : '') + ' ' + ($i18n.locale === EN ? 'switch-item-en' : 'switch-item')"
@click="switchChange('user')">{{ $t('personalInformation') }}
</a>
</div>
</template>
<!-- 基础信息 -->
<div v-show="switchValue === 'base'" class="detail-page-scroll-content">
<!-- 流程信息 -->
<div class="process-part-title">{{ $t('processInformation') }}</div>
<a-form :form="processInfoForm">
<a-row>
<a-col :span="12">
<!-- 流程名称 自动生成规则标准编号-标准名称-导入通知 -->
<a-form-item
:labelCol="$i18n.locale === EN ? labelColEn : labelCol"
:wrapperCol="$i18n.locale === EN ? wrapperColEn : wrapperCol"
:label="$t('processName')"
:colon="formItemColon">
<a-input :placeholder="$t('autoTakeout')"
disabled
:maxLength="50"
v-decorator="['processName', validatorRules.processName]" />
</a-form-item>
</a-col>
<!-- <a-col :span="12">-->
<!-- &lt;!&ndash; 截止日期 &ndash;&gt;-->
<!-- <a-form-item-->
<!-- :labelCol="$i18n.locale === EN ? labelColEn : labelCol"-->
<!-- :wrapperCol="$i18n.locale === EN ? wrapperColEn : wrapperCol"-->
<!-- :label="$t('expirationDate')"-->
<!-- :colon="formItemColon">-->
<!-- <a-date-picker :placeholder="disabled || isLook ? '' : $t('pleaseSelect') + $t('expirationDate')"-->
<!-- style="width: 100%"-->
<!-- :disabled="disabled || isLook"-->
<!-- value-format="YYYY-MM-DD"-->
<!-- v-decorator="['processDueDate']" />-->
<!-- </a-form-item>-->
<!-- </a-col>-->
<a-col :span="24">
<!-- 流程说明 -->
<a-form-item
:labelCol="$i18n.locale === EN ? longLabelColEn : longLabelCol"
:wrapperCol="$i18n.locale === EN ? longWrapperColEn : longWrapperCol"
:label="$t('processExplain')"
:colon="formItemColon">
<a-textarea :placeholder="disabled || isLook ? '' : $t('pleaseEnter') + $t('processExplain')"
:maxLength="500"
:rows="4"
:disabled="disabled || isLook"
v-decorator="['processDescription']" />
</a-form-item>
</a-col>
</a-row>
</a-form>
<!-- 业务基本信息 -->
<div class="process-part-title">{{ $t('basicServiceInformation') }}</div>
<!-- 节点1法规工程师发起 -->
<base-info-form v-if="currentNode === 1" ref="baseInfoRef" :disabled="isLook" :current-node="currentNode" @processNameChange="processNameChange"></base-info-form>
<!-- 节点2高级经理校对 -->
<!-- 节点3总监审核 -->
<!-- 节点4公司标准法规责任领导批准 -->
<!-- 节点5公司标准法规责任领导批准 -->
<base-info-form v-else ref="baseInfoRef" :current-node="currentNode" disabled></base-info-form>
<!-- 流程审批信息 -->
<div class="process-part-title">{{ $t('processApprovalInformation') }}</div>
<a-form :form="approvalInfoForm">
<!--备注-->
<a-form-item :labelCol="longLabelCol" :wrapperCol="longWrapperCol" :label="$t('remarks')" :colon="formItemColon">
<a-textarea :placeholder="isLook ? '' : $t('pleaseEnter') + $t('remarks')"
:maxLength="500"
:rows="4"
:disabled="isLook"
v-decorator="['handleText', validatorRules.handleText]" />
</a-form-item>
<!--附件-->
<a-form-item :labelCol="longLabelCol" :wrapperCol="longWrapperCol" :label="$t('attach')" :colon="formItemColon">
<j-upload v-decorator="['handleFile']"
return-id
multiple
:disabled="isLook" />
</a-form-item>
</a-form>
</div>
<!-- 人员信息 -->
<div v-show="switchValue === 'user'" class="detail-page-scroll-content p-0">
<process-detail-list ref="processDetailList" :processKey="ProcessKey.NEW_REGULATIONS_IMPORT.value">
<personnel-info slot="personnelInfo" ref="personnelInfo" :data="personnelInfoData" :currentNode="currentNodeId" :notPermissField="['relatedUserList']"></personnel-info>
</process-detail-list>
</div>
<!-- 操作按钮 -->
<div v-if="!isLook" class="detail-page-bottom-operate-box">
<!-- 加签 -->
<a-button v-if="$route.query.countersignFlag + '' === '1'" type="primary" ghost :loading="loading" @click="handleAddSign" icon="plus">{{ $t('countersign') }}</a-button>
<!-- 发起节点 -->
<template v-if="currentNode === 1">
<!-- 保存 -->
<a-button type="primary" ghost :loading="loading" @click="handleSave"><i class="iconfont icon-save"></i> {{ $t('preservation') }}</a-button>
<!-- 提交 -->
<a-button type="primary" :loading="loading" @click="handleStart" icon="upload">{{ $t('submit') }}</a-button>
</template>
<template v-else>
<!-- 转办 -->
<a-button type="primary" ghost :loading="loading" @click="handleTurnTo" icon="arrow-up">{{ $t('turnTo') }}</a-button>
<!-- 保存 -->
<a-button type="primary" ghost :loading="loading" @click="handleSave"><i class="iconfont icon-save"></i> {{ $t('preservation') }}</a-button>
<!-- 同意 -->
<a-button type="primary" :loading="loading" @click="handleAgree" icon="check">{{ $t('agree') }}</a-button>
<!-- 驳回 -->
<a-button type="danger" ghost :loading="loading" @click="handleReject" icon="close">{{ $t('reject') }}</a-button>
</template>
</div>
<!-- 选人弹框 -->
<user-select-modal ref="userSelectModal" type="radio" @change="userSelectModalChange"></user-select-modal>
<!-- 加签选人 -->
<user-select-modal ref="addSignUserSelect" type="radio" @change="addSignUserSelectChange"></user-select-modal>
</internal-detail-page>
</template>
<script>
import BaseInfoForm from './modules/BaseInfoForm'
import InternalDetailPage from '@/components/InternalDetailPage'
import ProcessDetailList from '@/components/ProcessDetailList'
import PersonnelInfo from '@/components/PersonnelInfo'
import UserSelectModal from '@/components/selection/UserSelectModal'
import { WorkCenterMixin } from '@/mixins/WorkCenterMixin'
import pick from 'lodash.pick'
import { NewRegulationsImportNodes, ProcessKey, ProcessType } from '../../../enums/commonEnums'
import {
newRegulationImportAgree,
newRegulationImportApproval,
newRegulationImportGetDataById,
newRegulationImportReject,
newRegulationImportSave,
getDataDraft,
processTransfer,
getLookData,
processAddSign,
newRegulationImportSubmit, processSave
} from '../../../api/workCenter'
export default {
name: 'NewRegulationIntroductionProcess',
components: {
BaseInfoForm,
InternalDetailPage,
ProcessDetailList,
PersonnelInfo,
UserSelectModal
},
mixins: [WorkCenterMixin],
computed: {
pageTitle () {
return this.$t('flowCenter') + this.$route.meta.title + '' + this.currentNodeName + ''
}
},
mounted () {
// 初始化节点
const nodeId = this.$route.query.nodeId
if (nodeId) {
this.currentNodeId = nodeId
if (nodeId === NewRegulationsImportNodes.initiated.value) {
// 法规工程师发起
this.currentNode = 1
} else if (nodeId === NewRegulationsImportNodes.seniorManagerProofread.value) {
// 高级经理校对
this.currentNode = 2
} else if (nodeId === NewRegulationsImportNodes.directorAudit.value) {
// 总监审核
this.currentNode = 3
} else if (nodeId === NewRegulationsImportNodes.responsibleLeaderApprovalOne.value) {
// 公司标准法规责任领导批准
this.currentNode = 4
} else if (nodeId === NewRegulationsImportNodes.responsibleLeaderApprovalTwo.value) {
// 公司标准法规责任领导批准
this.currentNode = 5
} else {
// 预留加签节点
this.currentNode = 999
}
}
// 获取人员信息结构
this.getPersonInfoStructure(ProcessKey.NEW_REGULATIONS_IMPORT.value, () => {
if (this.$route.query.processInstanceId) {
if (this.currentNode === 1) {
this.disabled = false
this.initPersonInfoData(true)
} else {
this.disabled = true
// 如果不是第一个节点,人员信息全部不可选
this.initPersonInfoData(false)
}
}
})
if (this.$route.query.isLook + '' === '1') {
// 是查看
this.isLook = true
// 人员信息全部不可选
this.initPersonInfoData(false)
// 查询数据
this.getProcessData('look', { snapshotId: this.$route.query.snapshotId })
} else {
if (this.$route.query.taskId && !this.$route.query.draftId) {
// 有流程id说明是从流程中心来的,需要初始化数据
this.getProcessData('todo', { taskId: this.$route.query.taskId })
}
if (this.$route.query.draftId) {
// 有草稿id,说明是从流程中心-草稿来的,需要初始化数据
this.getProcessData('draft', { draftId: this.$route.query.draftId, projectId: this.$route.query.projectId })
}
}
if (this.$route.query.taskName) {
// 说明是已发起流程
this.currentNodeName = this.$route.query.taskName
} else {
this.currentNodeName = '法规工程师发起'
}
},
data () {
return {
EN: 'en-us',
ProcessKey,
loading: false,
switchValue: 'base', // 头部tab选中值
disabled: false,
currentNode: 1, // 当前节点
currentNodeName: '',
currentNodeId: NewRegulationsImportNodes.initiated.value, // 当前节点id
model: {},
draftModel: null, // 草稿Json转化的对象
processInfoForm: this.$form.createForm(this),
labelCol: {
xs: { span: 24 },
sm: { span: 4 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 20 }
},
longLabelCol: {
xs: { span: 24 },
sm: { span: 2 }
},
longWrapperCol: {
xs: { span: 24 },
sm: { span: 22 }
},
labelColEn: {
xs: { span: 24 },
sm: { span: 6 }
},
wrapperColEn: {
xs: { span: 24 },
sm: { span: 18 }
},
longLabelColEn: {
xs: { span: 24 },
sm: { span: 3 }
},
longWrapperColEn: {
xs: { span: 24 },
sm: { span: 21 }
},
validatorRules: {
// 流程名称
processName: {
rules: [
{ required: true, message: this.$t('pleaseEnter') + this.$t('processName') }
],
validateTrigger: 'blur'
},
handleText: {
rules: [
{ required: false, message: this.$t('pleaseEnter') + this.$t('remarks') }
],
validateTrigger: 'blur'
}
},
formInline: {},
approvalInfoForm: this.$form.createForm(this), // 审批信息表单
personnelInfoData: [],
isLook: false
}
},
methods: {
// 根据流程id获取数据并回显
getProcessData (type, param) {
this.loading = true
let func
let params = {}
if (type === 'todo') {
func = newRegulationImportGetDataById
params = param.taskId
} else if (type === 'look') {
func = getLookData
params = param
} else {
func = getDataDraft
params = param
}
func(params).then(res => {
if (res.success) {
this.model = res.result
this.$nextTick(() => {
if (type === 'todo') {
// 初始化流程信息
this.processInfoForm.setFieldsValue(pick(this.model.basicProcessInfoDTO, 'processName', 'processDueDate', 'processDescription'))
}
// 有草稿json按草稿进来的回显
if (this.model.infoJsonStr) {
this.draftModel = JSON.parse(this.model.infoJsonStr)
// 初始化流程信息
this.processInfoForm.setFieldsValue(pick(this.draftModel.basicProcessInfoDTO, 'processName', 'processDueDate', 'processDescription'))
// 初始化流程审批信息
this.approvalInfoForm.setFieldsValue(pick(this.draftModel.basicTaskInfoDTO, 'handleText', 'handleFile'))
// 如果是节点1的保存回显人员信息
if (this.currentNode === 1) {
this.draftInitPersonInfo(this.draftModel.userInfoMap)
}
}
if (this.$refs.baseInfoRef) {
this.$refs.baseInfoRef.initData(this.draftModel ? this.draftModel.businessInfoDTO : this.model.businessInfoDTO)
}
})
// 初始化业务基本信息中组件内容
} else {
this.$message.warning(res.message)
}
}).finally(() => {
this.loading = false
})
},
// 头部tab改变
switchChange (value) {
this.switchValue = value
},
// 业务基本信息组件中获取到流程名称改变后的值
processNameChange (value) {
const param = { processName: value }
this.$nextTick(() => {
this.processInfoForm.setFieldsValue(pick(param, 'processName'))
})
},
// 保存
handleSave () {
if (this.loading) {
return
}
// 有任意一项填了即可
// 流程信息表单
const processInfoForm = this.processInfoForm.getFieldsValue()
// 流程审批信息
const approvalInfoForm = this.approvalInfoForm.getFieldsValue()
// 人员信息的数据, 处理成对象
const personnelObj = this.$refs.personnelInfo.getDataObj()
// 业务基本信息
const baseInfo = this.$refs.baseInfoRef.getData()
// 判断是否每一项都没填
const param = { ...processInfoForm, ...baseInfo, ...approvalInfoForm, ...personnelObj }
const flag = Object.values(param).some(v => !!v || v === 0)
if (!flag) {
// 提示至少填写一项
this.$message.warning(this.$t('pleaseFillInAtLeastOneItem'))
return
}
// 需要传给后端的数据
const paramObj = {}
// 流程信息
paramObj.basicProcessInfoDTO = Object.assign({}, processInfoForm)
paramObj.basicProcessInfoDTO.processInstanceId = this.$route.query.processInstanceId
paramObj.basicProcessInfoDTO.processType = ProcessType.NEW_REGULATIONS_IMPORT.value
// 流程审批信息
paramObj.basicTaskInfoDTO = Object.assign({}, approvalInfoForm)
paramObj.basicTaskInfoDTO.taskId = this.$route.query.taskId
// 业务信息
paramObj.businessInfoDTO = baseInfo
// 人员信息
paramObj.userInfoMap = personnelObj
// 草稿id
if (this.model.infoJsonStr) {
paramObj.draftId = this.model.id
}
// 草稿JSON
paramObj.infoJsonStr = JSON.stringify(paramObj)
this.loading = true
// 保存到草稿
processSave(paramObj).then(res => {
if (res.success) {
this.$message.success(res.message)
this.goBack()
} else {
this.$message.warning(res.message)
this.loading = false
}
})
},
// 节点一时候的提交
handleStart () {
if (this.loading) return
// 流程信息的校验
this.processInfoForm.validateFields((err, values) => {
// 流程审批信息的校验
this.approvalInfoForm.validateFields(async (approvalErr, approvalValues) => {
// 获取业务信息businessInfoDTO
const data = await this.$refs.baseInfoRef.getDataValidate()
if (!err && !approvalErr && data) {
// 人员信息的数据, 处理成对象
const personnelObj = this.$refs.personnelInfo.getDataObjVerify()
if (!personnelObj) {
this.switchValue = 'user'
return
}
this.loading = true
const paramObj = {} // 需要传给后端的数据
// 流程信息
paramObj.basicProcessInfoDTO = values
// 流程审批信息
paramObj.basicTaskInfoDTO = approvalValues
// 草稿id
if (this.model.infoJsonStr) {
paramObj.draftId = this.model.id
}
// 人员信息
paramObj.userInfoMap = personnelObj
// 业务信息
paramObj.businessInfoDTO = data
// JSON字符串
paramObj.infoJsonStr = JSON.stringify(paramObj)
let func
if (this.$route.query.taskId) {
// 有taskId说明是驳回的提交
func = newRegulationImportSubmit
paramObj.basicTaskInfoDTO.taskId = this.$route.query.taskId
} else {
func = newRegulationImportApproval
paramObj.saveSource = 3
}
func(paramObj).then(res => {
if (res.success) {
this.$message.success(res.message)
this.goBack()
} else {
this.$message.warning(res.message)
this.loading = false
}
})
} else {
this.switchValue = 'base'
}
})
})
},
// 加签
handleAddSign () {
if (this.loading) return
// 点击显示选人组件
this.$refs.addSignUserSelect.open()
},
// 加签选完人的回调
addSignUserSelectChange (userIds) {
this.loading = true
const param = {}
param.userId = userIds
param.taskId = this.$route.query.taskId
param.prcType = this.$route.query.prcType
processAddSign(param).then(res => {
if (res.success) {
this.$message.success(res.message)
// 加签完成更新人员信息
this.getPersonInfoStructure(ProcessKey.NEW_REGULATIONS_IMPORT.value, () => {
// 人员信息都不可选择
this.initPersonInfoData(false)
})
// 刷新审批列表
this.$refs.processDetailList.loadData()
} else {
this.$message.warning(res.message)
}
}).finally(() => {
this.loading = false
})
},
// 转办
handleTurnTo () {
if (this.loading) return
// 点击显示选人组件
this.$refs.userSelectModal.open()
},
// 转办选完人的回调
userSelectModalChange (userIds) {
this.approvalInfoForm.validateFields((err, values) => {
if (!err) {
this.loading = true
const param = Object.assign({}, values)
param.userId = userIds
param.taskId = this.$route.query.taskId
processTransfer(param).then(res => {
if (res.success) {
this.$message.success(res.message)
this.goBack()
} else {
this.$message.warning(res.message)
this.loading = false
}
})
}
})
},
// 同意
handleAgree () {
if (this.loading) return
this.validatorRules.handleText.rules[0].required = false
if (!this.approvalInfoForm.getFieldValue('handleText')) {
this.approvalInfoForm.setFieldsValue({ handleText: '同意' })
}
this.approvalInfoForm.validateFields((err, values) => {
if (!err) {
this.loading = true
// 保存快照需要的JSON start
const jasonObj = {}
// 流程信息表单
const processInfoForm = this.processInfoForm.getFieldsValue()
// 流程审批信息
const approvalInfoForm = this.approvalInfoForm.getFieldsValue()
// 业务基本信息
const baseInfo = this.$refs.baseInfoRef.getData()
// 流程信息
jasonObj.basicProcessInfoDTO = Object.assign({}, processInfoForm)
// 流程审批信息
jasonObj.basicTaskInfoDTO = Object.assign({}, approvalInfoForm)
// 业务信息
jasonObj.businessInfoDTO = baseInfo
// 保存快照需要的JSON end
const param = {}
param.basicTaskInfoDTO = Object.assign({}, values)
param.basicTaskInfoDTO.taskId = this.$route.query.taskId
// 草稿JSON
param.infoJsonStr = JSON.stringify(jasonObj)
newRegulationImportAgree(param).then(res => {
if (res.success) {
this.$message.success(res.message)
this.goBack()
} else {
this.$message.warning(res.message)
this.loading = false
}
})
}
})
},
// 驳回
handleReject () {
if (this.loading) return
this.validatorRules.handleText.rules[0].required = true
if (!this.approvalInfoForm.getFieldValue('handleText')) {
this.$message.warning(this.$t('pleaseEnterRemarks'))
this.switchValue = 'base'
}
this.$nextTick(() => {
this.approvalInfoForm.validateFields({ force: true }, (err, values) => {
if (!err) {
this.loading = true
// 保存快照需要的JSON start
const jasonObj = {}
// 流程信息表单
const processInfoForm = this.processInfoForm.getFieldsValue()
// 流程审批信息
const approvalInfoForm = this.approvalInfoForm.getFieldsValue()
// 业务基本信息
const baseInfo = this.$refs.baseInfoRef.getData()
// 流程信息
jasonObj.basicProcessInfoDTO = Object.assign({}, processInfoForm)
// 流程审批信息
jasonObj.basicTaskInfoDTO = Object.assign({}, approvalInfoForm)
// 业务信息
jasonObj.businessInfoDTO = baseInfo
// 保存快照需要的JSON end
const param = {}
param.basicTaskInfoDTO = Object.assign({}, values)
param.basicTaskInfoDTO.taskId = this.$route.query.taskId
// 草稿JSON
param.infoJsonStr = JSON.stringify(jasonObj)
newRegulationImportReject(param).then(res => {
if (res.success) {
this.$message.success(res.message)
this.goBack()
} else {
this.$message.warning(res.message)
this.loading = false
}
}).finally(() => {
this.validatorRules.handleText.rules[0].required = false
})
}
})
})
}
}
}
</script>
<style scoped lang="less">
@import '~@assets/less/common.less';
</style>