diff --git a/src/views/bpm/processInstance/create/ProcessDefinitionDetail.vue b/src/views/bpm/processInstance/create/ProcessDefinitionDetail.vue index 5944c253af2b16790f849ac7f903f9ef9d642b74..8856fac79efad56e26e1b1c429aede691552712f 100644 --- a/src/views/bpm/processInstance/create/ProcessDefinitionDetail.vue +++ b/src/views/bpm/processInstance/create/ProcessDefinitionDetail.vue @@ -157,25 +157,24 @@ const initProcessInfo = async (row: any, formVariables?: any) => { } /** 预测流程节点会因为输入的参数值而产生新的预测结果值，所以需重新预测一次 */ -// TODO @芋艿：这里我执行填写表单的时候不知道为啥一直报错，先注释了 @lesan：可以和群里的小北说下 -// watch( -// detailForm.value, -// (newValue) => { -// if (newValue && Object.keys(newValue.value).length > 0) { -// // 记录之前的节点审批人 -// tempStartUserSelectAssignees.value = startUserSelectAssignees.value -// startUserSelectAssignees.value = {} -// // 加载最新的审批详情 -// getApprovalDetail({ -// id: props.selectProcessDefinition.id, -// processVariablesStr: JSON.stringify(newValue.value) // 解决 GET 无法传递对象的问题，后端 String 再转 JSON -// }) -// } -// }, -// { -// immediate: true -// } -// ) +watch( + detailForm.value, + (newValue) => { + if (newValue && Object.keys(newValue.value).length > 0) { + // 记录之前的节点审批人 + tempStartUserSelectAssignees.value = startUserSelectAssignees.value + startUserSelectAssignees.value = {} + // 加载最新的审批详情 + getApprovalDetail({ + id: props.selectProcessDefinition.id, + processVariablesStr: JSON.stringify(newValue.value) // 解决 GET 无法传递对象的问题，后端 String 再转 JSON + }) + } + }, + { + immediate: true + } +) /** 获取审批详情 */ const getApprovalDetail = async (row: any) => { @@ -184,7 +183,7 @@ const getApprovalDetail = async (row: any) => { const data = await ProcessInstanceApi.getApprovalDetail({ processDefinitionId: row.id, activityId: NodeId.START_USER_NODE_ID, - processVariablesStr: JSON.stringify(row.processVariablesStr) // 解决 GET 无法传递对象的问题，后端 String 再转 JSON + processVariablesStr: row.processVariablesStr // 解决 GET 无法传递对象的问题，后端 String 再转 JSON }) if (!data) { diff --git a/src/views/bpm/processInstance/detail/ProcessInstanceOperationButton.vue b/src/views/bpm/processInstance/detail/ProcessInstanceOperationButton.vue index 4ad4e591231716b43a4efc9de0820e9013533a35..137d91bdc6ef96d4cd944cb89d2d314cef7c76f3 100644 --- a/src/views/bpm/processInstance/detail/ProcessInstanceOperationButton.vue +++ b/src/views/bpm/processInstance/detail/ProcessInstanceOperationButton.vue @@ -44,6 +44,18 @@ :rows="4" /> + + + () // 运行中的任务 const approveForm = ref({}) // 审批通过时，额外的补充信息 const approveFormFApi = ref({}) // approveForms 的 fAPi const nodeTypeName = ref('审批') // 节点类型名称 +const activityNodes = ref([]) // 审批节点信息 +const dialogVisibleSelectApproveUser = ref(false) // 是否显示节点审批人选择框 // 审批通过意见表单 const reasonRequire = ref() @@ -556,14 +572,16 @@ const signRef = ref() const approveSignFormRef = ref() const approveReasonForm = reactive({ reason: '', - signPicUrl: '' + signPicUrl: '', + nextAssignees: {} }) const approveReasonRule = computed(() => { return { reason: [ { required: reasonRequire.value, message: nodeTypeName + '意见不能为空', trigger: 'blur' } ], - signPicUrl: [{ required: true, message: '签名不能为空', trigger: 'change' }] + signPicUrl: [{ required: true, message: '签名不能为空', trigger: 'change' }], + nextAssignees: [{ required: true, message: '审批人不能为空', trigger: 'blur' }] } }) // 拒绝表单 @@ -663,6 +681,11 @@ watch( } ) +/** 选择下一个节点的审批人 */ +const selectUserConfirm = (id: string, userList: any[]) => { + approveReasonForm.nextAssignees[id] = userList?.map((item: any) => item.id) +} + /** 弹出气泡卡 */ const openPopover = async (type: string) => { if (type === 'approve') { @@ -672,6 +695,7 @@ const openPopover = async (type: string) => { message.warning('表单校验不通过，请先完善表单!!') return } + initNextTaskSelectAssigneeFormField() } if (type === 'return') { // 获取退回节点 @@ -694,6 +718,34 @@ const closePropover = (type: string, formRef: FormInstance | undefined) => { formRef.resetFields() } popOverVisible.value[type] = false + dialogVisibleSelectApproveUser.value = false +} + +/** // 流程通过时，根据表单变量查询新的流程节点，判断下一个节点类型是否为自选审批人 */ +const initNextTaskSelectAssigneeFormField = async () => { + // 获取修改的流程变量, 暂时只支持流程表单 + const variables = getUpdatedProcessInstanceVariables() + const param = { + processInstanceId: props.processInstance.id, + processVariablesStr: JSON.stringify(variables) + } + const res = await ProcessInstanceApi.getApprovalDetail(param) + //当前待审批节点id + const activityId = res.todoTask?.taskDefinitionKey + if (res.activityNodes && res.activityNodes.length > 0) { + // 找到当前节点的索引 + const currentNodeIndex = res.activityNodes.findIndex((node) => node.id === activityId) + const nextNode = res.activityNodes[currentNodeIndex + 1] + if ( + nextNode.candidateStrategy === CandidateStrategy.START_USER_SELECT && + !nextNode.tasks && + nextNode.candidateUsers?.length === 0 + ) { + // 自选审批人，则弹出选择审批人弹窗 + activityNodes.value = [nextNode] + dialogVisibleSelectApproveUser.value = true + } + } } /** 处理审批通过和不通过的操作 */ @@ -711,13 +763,21 @@ const handleAudit = async (pass: boolean, formRef: FormInstance | undefined) => } if (pass) { - // 获取修改的流程变量, 暂时只支持流程表单 + // 如果需要自选审批人，则校验自选审批人 + if ( + dialogVisibleSelectApproveUser.value && + Object.keys(approveReasonForm.nextAssignees).length === 0 + ) { + message.warning('下一个节点的审批人不能为空!') + return + } const variables = getUpdatedProcessInstanceVariables() // 审批通过数据 const data = { id: runningTask.value.id, reason: approveReasonForm.reason, - variables // 审批通过, 把修改的字段值赋于流程实例变量 + variables, // 审批通过, 把修改的字段值赋于流程实例变量 + nextAssignees: approveReasonForm.nextAssignees // 下个自选节点选择的审批人信息 } // 签名 if (runningTask.value.signEnable) { @@ -733,6 +793,7 @@ const handleAudit = async (pass: boolean, formRef: FormInstance | undefined) => } await TaskApi.approveTask(data) popOverVisible.value.approve = false + dialogVisibleSelectApproveUser.value = false message.success('审批通过成功') } else { // 审批不通过数据 @@ -1009,6 +1070,11 @@ const validateNormalForm = async () => { } } +/** + * TODO @小北 TO @芋道 + * 问题：这里存在一种场景会出现问题，流程发起后，A节点审批完成，B节点没有可编辑的流程字段且B节点为自选审批人节点，会导致流程审批人为空， + * 原因：因为没有可编辑的流程字段时props.writableFields为空，参数variables传递时也为空 + */ /** 从可以编辑的流程表单字段，获取需要修改的流程实例的变量 */ const getUpdatedProcessInstanceVariables = () => { const variables = {} diff --git a/src/views/bpm/processInstance/detail/ProcessInstanceSimpleViewer.vue b/src/views/bpm/processInstance/detail/ProcessInstanceSimpleViewer.vue index e1d11091dd6400c27cdbc0e812fd6a4a6b75a998..87f8119df476b7b33b505e42ca60661f64b27b6b 100644 --- a/src/views/bpm/processInstance/detail/ProcessInstanceSimpleViewer.vue +++ b/src/views/bpm/processInstance/detail/ProcessInstanceSimpleViewer.vue @@ -42,13 +42,13 @@ watch( const finishedSequenceFlowActivityIds: string[] = newModelView.finishedSequenceFlowActivityIds setSimpleModelNodeTaskStatus( newModelView.simpleModel, - newModelView.processInstance.status, + newModelView.processInstance?.status, rejectedTaskActivityIds, unfinishedTaskActivityIds, finishedActivityIds, finishedSequenceFlowActivityIds ) - simpleModel.value = newModelView.simpleModel + simpleModel.value = newModelView.simpleModel ? newModelView.simpleModel : {} } } ) @@ -171,5 +171,4 @@ const setSimpleModelNodeTaskStatus = ( } - + diff --git a/src/views/bpm/processInstance/detail/index.vue b/src/views/bpm/processInstance/detail/index.vue index 9809f7a8d0236ad18ef091a1cf2d28253dbd4b17..46ecaaeef7edd79034437f8cb7b5a7934aec2df8 100644 --- a/src/views/bpm/processInstance/detail/index.vue +++ b/src/views/bpm/processInstance/detail/index.vue @@ -179,7 +179,6 @@ const writableFields: Array = [] // 表单可以编辑的字段 /** 获得详情 */ const getDetail = () => { getApprovalDetail() - getProcessModelView() }