yudao
/
admin-vue3
mirror of https://gitee.com/yudaocode/yudao-ui-admin-vue3.git
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

【功能修复】 修复流程详情页面 请求模型视图接口两次的问题

pull/582/head
jason 2024-11-03 22:06:35 +08:00
parent 13272c2293
commit 65f0b2f8ab
3 changed files with 72 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/views/bpm/processInstance/detail/ProcessInstanceBpmnViewer.vue
View File

@ -6,31 +6,28 @@
<script lang="ts" setup>
import { propTypes } from '@/utils/propTypes'
import { MyProcessViewer } from '@/components/bpmnProcessDesigner/package'
import * as ProcessInstanceApi from '@/api/bpm/processInstance'
defineOptions({ name: 'BpmProcessInstanceBpmnViewer' })
const props = defineProps({
loading: propTypes.bool.def(false), // 是否加载中
id: propTypes.string, // 流程实例的编号
bpmnXml: propTypes.string // BPMN XML
bpmnXml: propTypes.string, // BPMN XML
modelView: propTypes.object
})
const view = ref({
bpmnXml: ''
}) // BPMN 流程图数据
/** 只有 loading 完成时，才去加载流程列表 */
watch(
() => props.loading,
async (value) => {
// 重置
view.value = {
bpmnXml: ''
}
() => props.modelView,
async (newModelView) => {
// 加载最新
if (value && props.id) {
view.value = await ProcessInstanceApi.getProcessInstanceBpmnModelView(props.id)
if (newModelView) {
//@ts-ignore
view.value = newModelView
}
}
)

62
src/views/bpm/processInstance/detail/ProcessInstanceSimpleViewer.vue
View File

@ -8,45 +8,71 @@ import { propTypes } from '@/utils/propTypes'
import { TaskStatusEnum } from '@/api/bpm/task'
import { SimpleFlowNode, NodeType } from '@/components/SimpleProcessDesignerV2/src/consts'
import { SimpleProcessViewer } from '@/components/SimpleProcessDesignerV2/src/'
import * as ProcessInstanceApi from '@/api/bpm/processInstance'
defineOptions({ name: 'BpmProcessInstanceSimpleViewer' })
const props = defineProps({
loading: propTypes.bool.def(false), // 是否加载中
id: propTypes.string // 流程实例的编号
modelView: propTypes.object
})
const simpleModel = ref()
// 用户任务
const tasks = ref([])
// 流程实例
const processInstance = ref()
/** 只有 loading 完成时，才去加载流程列表 */
// /** 只有 loading 完成时，才去加载流程列表 */
// watch(
// () => props.loading,
// async (value) => {
// if (value && props.id) {
// const modelView = await ProcessInstanceApi.getProcessInstanceBpmnModelView(props.id)
// if (modelView) {
// tasks.value = modelView.tasks
// processInstance.value = modelView.processInstance
// // 已经拒绝的活动节点编号集合，只包括 UserTask
// const rejectedTaskActivityIds: string[] = modelView.rejectedTaskActivityIds
// // 进行中的活动节点编号集合， 只包括 UserTask
// const unfinishedTaskActivityIds: string[] = modelView.unfinishedTaskActivityIds
// // 已经完成的活动节点编号集合， 包括 UserTask、Gateway 等
// const finishedActivityIds: string[] = modelView.finishedTaskActivityIds
// // 已经完成的连线节点编号集合，只包括 SequenceFlow
// const finishedSequenceFlowActivityIds: string[] = modelView.finishedSequenceFlowActivityIds
// setSimpleModelNodeTaskStatus(
// modelView.simpleModel,
// modelView.processInstance.status,
// rejectedTaskActivityIds,
// unfinishedTaskActivityIds,
// finishedActivityIds,
// finishedSequenceFlowActivityIds
// )
// simpleModel.value = modelView.simpleModel
// }
// }
// }
// )
watch(
() => props.loading,
async (value) => {
if (value && props.id) {
const modelView = await ProcessInstanceApi.getProcessInstanceBpmnModelView(props.id)
if (modelView) {
tasks.value = modelView.tasks
processInstance.value = modelView.processInstance
() => props.modelView,
async (newModelView) => {
if (newModelView) {
if (newModelView) {
tasks.value = newModelView.tasks
processInstance.value = newModelView.processInstance
// 已经拒绝的活动节点编号集合，只包括 UserTask
const rejectedTaskActivityIds: string[] = modelView.rejectedTaskActivityIds
const rejectedTaskActivityIds: string[] = newModelView.rejectedTaskActivityIds
// 进行中的活动节点编号集合， 只包括 UserTask
const unfinishedTaskActivityIds: string[] = modelView.unfinishedTaskActivityIds
const unfinishedTaskActivityIds: string[] = newModelView.unfinishedTaskActivityIds
// 已经完成的活动节点编号集合， 包括 UserTask、Gateway 等
const finishedActivityIds: string[] = modelView.finishedTaskActivityIds
const finishedActivityIds: string[] = newModelView.finishedTaskActivityIds
// 已经完成的连线节点编号集合，只包括 SequenceFlow
const finishedSequenceFlowActivityIds: string[] = modelView.finishedSequenceFlowActivityIds
const finishedSequenceFlowActivityIds: string[] = newModelView.finishedSequenceFlowActivityIds
setSimpleModelNodeTaskStatus(
modelView.simpleModel,
modelView.processInstance.status,
newModelView.simpleModel,
newModelView.processInstance.status,
rejectedTaskActivityIds,
unfinishedTaskActivityIds,
finishedActivityIds,
finishedSequenceFlowActivityIds
)
simpleModel.value = modelView.simpleModel
simpleModel.value = newModelView.simpleModel
}
}
}

23
src/views/bpm/processInstance/detail/index.vue
View File

@ -79,15 +79,15 @@
v-show="
processDefinition.modelType && processDefinition.modelType === BpmModelType.SIMPLE
"
:id="`${id}`"
:loading="processInstanceLoading"
:model-view="processModelView"
/>
<ProcessInstanceBpmnViewer
v-show="
processDefinition.modelType && processDefinition.modelType === BpmModelType.BPMN
"
:id="`${id}`"
:loading="processInstanceLoading"
:model-view="processModelView"
/>
</div>
</el-tab-pane>
@ -153,7 +153,7 @@ const message = useMessage() // 消息弹窗
const processInstanceLoading = ref(false) // 流程实例的加载中
const processInstance = ref<any>({}) // 流程实例
const processDefinition = ref<any>({}) // 流程定义
const processModelView = ref<any>({}) // 流程模型视图
const operationButtonRef = ref() // 操作按钮组件 ref
const auditIcons = {
1: audit1,
@ -173,6 +173,8 @@ const detailForm = ref({
/** 获得详情 */
const getDetail = () => {
getApprovalDetail()
getProcessModelView()
}
/** 加载流程实例 */
@ -238,6 +240,21 @@ const getApprovalDetail = async () => {
}
}
/** 获取流程模型视图*/
const getProcessModelView = async () => {
if (BpmModelType.BPMN === processDefinition.value?.modelType) {
// 重置，解决 BPMN 流程图刷新不会重新渲染问题
processModelView.value = {
bpmnXml: ''
}
}
const data = await ProcessInstanceApi.getProcessInstanceBpmnModelView(props.id)
if (data) {
processModelView.value = data
}
}
// 审批节点信息
const activityNodes = ref<ProcessInstanceApi.ApprovalNodeInfo[]>([])
/**