| 提交 | 用户 | 时间 | ||
| 3e359e | 1 | <template> |
| H | 2 | <!-- 发起人节点 --> |
| 3 | <StartUserNode | |
| 4 | v-if="currentNode && currentNode.type === NodeType.START_USER_NODE" | |
| 5 | :flow-node="currentNode" | |
| 6 | /> | |
| 7 | <!-- 审批节点 --> | |
| 8 | <UserTaskNode | |
| 9 | v-if="currentNode && currentNode.type === NodeType.USER_TASK_NODE" | |
| 10 | :flow-node="currentNode" | |
| 11 | @update:flow-node="handleModelValueUpdate" | |
| 12 | @find:parent-node="findFromParentNode" | |
| 13 | /> | |
| 14 | <!-- 抄送节点 --> | |
| 15 | <CopyTaskNode | |
| 16 | v-if="currentNode && currentNode.type === NodeType.COPY_TASK_NODE" | |
| 17 | :flow-node="currentNode" | |
| 18 | @update:flow-node="handleModelValueUpdate" | |
| 19 | /> | |
| 20 | <!-- 条件节点 --> | |
| 21 | <ExclusiveNode | |
| 22 | v-if="currentNode && currentNode.type === NodeType.CONDITION_BRANCH_NODE" | |
| 23 | :flow-node="currentNode" | |
| 24 | @update:model-value="handleModelValueUpdate" | |
| 25 | @find:parent-node="findFromParentNode" | |
| 26 | /> | |
| 27 | <!-- 并行节点 --> | |
| 28 | <ParallelNode | |
| 29 | v-if="currentNode && currentNode.type === NodeType.PARALLEL_BRANCH_NODE" | |
| 30 | :flow-node="currentNode" | |
| 31 | @update:model-value="handleModelValueUpdate" | |
| 32 | @find:parent-node="findFromParentNode" | |
| 33 | /> | |
| 34 | <!-- 包容分支节点 --> | |
| 35 | <InclusiveNode | |
| 36 | v-if="currentNode && currentNode.type === NodeType.INCLUSIVE_BRANCH_NODE" | |
| 37 | :flow-node="currentNode" | |
| 38 | @update:model-value="handleModelValueUpdate" | |
| 39 | @find:parent-node="findFromParentNode" | |
| 40 | /> | |
| c9a6f7 | 41 | <!-- 延迟器节点 --> |
| H | 42 | <DelayTimerNode |
| 43 | v-if="currentNode && currentNode.type === NodeType.DELAY_TIMER_NODE" | |
| 44 | :flow-node="currentNode" | |
| 45 | @update:flow-node="handleModelValueUpdate" | |
| 46 | /> | |
| 3e359e | 47 | <!-- 递归显示孩子节点 --> |
| H | 48 | <ProcessNodeTree |
| 49 | v-if="currentNode && currentNode.childNode" | |
| 50 | v-model:flow-node="currentNode.childNode" | |
| 51 | :parent-node="currentNode" | |
| 52 | @find:recursive-find-parent-node="recursiveFindParentNode" | |
| 53 | /> | |
| 54 | ||
| 55 | <!-- 结束节点 --> | |
| 56 | <EndEventNode | |
| 57 | v-if="currentNode && currentNode.type === NodeType.END_EVENT_NODE" | |
| 58 | :flow-node="currentNode" | |
| 59 | /> | |
| 60 | </template> | |
| 61 | <script setup lang="ts"> | |
| 62 | import StartUserNode from './nodes/StartUserNode.vue' | |
| 63 | import EndEventNode from './nodes/EndEventNode.vue' | |
| 64 | import UserTaskNode from './nodes/UserTaskNode.vue' | |
| 65 | import CopyTaskNode from './nodes/CopyTaskNode.vue' | |
| 66 | import ExclusiveNode from './nodes/ExclusiveNode.vue' | |
| 67 | import ParallelNode from './nodes/ParallelNode.vue' | |
| 68 | import InclusiveNode from './nodes/InclusiveNode.vue' | |
| c9a6f7 | 69 | import DelayTimerNode from './nodes/DelayTimerNode.vue' |
| 3e359e | 70 | import { SimpleFlowNode, NodeType } from './consts' |
| H | 71 | import { useWatchNode } from './node' |
| 72 | defineOptions({ | |
| 73 | name: 'ProcessNodeTree' | |
| 74 | }) | |
| 75 | const props = defineProps({ | |
| 76 | parentNode: { | |
| 77 | type: Object as () => SimpleFlowNode, | |
| 78 | default: () => null | |
| 79 | }, | |
| 80 | flowNode: { | |
| 81 | type: Object as () => SimpleFlowNode, | |
| 82 | default: () => null | |
| 83 | } | |
| 84 | }) | |
| 85 | const emits = defineEmits<{ | |
| 86 | 'update:flowNode': [node: SimpleFlowNode | undefined] | |
| 87 | 'find:recursiveFindParentNode': [ | |
| 88 | nodeList: SimpleFlowNode[], | |
| 89 | curentNode: SimpleFlowNode, | |
| 90 | nodeType: number | |
| 91 | ] | |
| 92 | }>() | |
| 93 | ||
| 94 | const currentNode = useWatchNode(props) | |
| 95 | ||
| 96 | // 用于删除节点 | |
| 97 | const handleModelValueUpdate = (updateValue) => { | |
| 98 | emits('update:flowNode', updateValue) | |
| 99 | } | |
| 100 | ||
| 101 | const findFromParentNode = (nodeList: SimpleFlowNode[], nodeType: number) => { | |
| 102 | emits('find:recursiveFindParentNode', nodeList, props.parentNode, nodeType) | |
| 103 | } | |
| 104 | ||
| 105 | // 递归从父节点中查询匹配的节点 | |
| 106 | const recursiveFindParentNode = ( | |
| 107 | nodeList: SimpleFlowNode[], | |
| 108 | findNode: SimpleFlowNode, | |
| 109 | nodeType: number | |
| 110 | ) => { | |
| 111 | if (!findNode) { | |
| 112 | return | |
| 113 | } | |
| 114 | if (findNode.type === NodeType.START_USER_NODE) { | |
| 115 | nodeList.push(findNode) | |
| 116 | return | |
| 117 | } | |
| 118 | ||
| 119 | if (findNode.type === nodeType) { | |
| 120 | nodeList.push(findNode) | |
| 121 | } | |
| 122 | emits('find:recursiveFindParentNode', nodeList, props.parentNode, nodeType) | |
| 123 | } | |
| 124 | </script> | |
| 125 | <style lang="scss" scoped></style> | |
