From a1d7e81859f554f3a53680cc35f0f49bf1f77098 Mon Sep 17 00:00:00 2001
From: wwf <1971391498@qq.com>
Date: 星期四, 14 五月 2026 14:37:02 +0800
Subject: [PATCH] 导入项目
---
src/components/SimpleProcessDesignerV2/src/nodes/InclusiveNode.vue | 244 ++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 244 insertions(+), 0 deletions(-)
diff --git a/src/components/SimpleProcessDesignerV2/src/nodes/InclusiveNode.vue b/src/components/SimpleProcessDesignerV2/src/nodes/InclusiveNode.vue
new file mode 100644
index 0000000..51c44d4
--- /dev/null
+++ b/src/components/SimpleProcessDesignerV2/src/nodes/InclusiveNode.vue
@@ -0,0 +1,244 @@
+<template>
+ <div class="branch-node-wrapper">
+ <div class="branch-node-container">
+ <div
+ v-if="readonly"
+ class="branch-node-readonly"
+ :class="`${useTaskStatusClass(currentNode?.activityStatus)}`"
+ >
+ <span class="iconfont icon-inclusive icon-size inclusive"></span>
+ </div>
+ <el-button v-else class="branch-node-add" color="#345da2" @click="addCondition" plain
+ >娣诲姞鏉′欢</el-button
+ >
+ <div
+ class="branch-node-item"
+ v-for="(item, index) in currentNode.conditionNodes"
+ :key="index"
+ >
+ <template v-if="index == 0">
+ <div class="branch-line-first-top"> </div>
+ <div class="branch-line-first-bottom"></div>
+ </template>
+ <template v-if="index + 1 == currentNode.conditionNodes?.length">
+ <div class="branch-line-last-top"></div>
+ <div class="branch-line-last-bottom"></div>
+ </template>
+ <div class="node-wrapper">
+ <div class="node-container">
+ <div
+ class="node-box"
+ :class="[
+ { 'node-config-error': !item.showText },
+ `${useTaskStatusClass(item.activityStatus)}`
+ ]"
+ >
+ <div class="branch-node-title-container">
+ <div v-if="!readonly && showInputs[index]">
+ <input
+ type="text"
+ class="editable-title-input"
+ @blur="blurEvent(index)"
+ v-mountedFocus
+ v-model="item.name"
+ />
+ </div>
+ <div v-else class="branch-title" @click="clickEvent(index)"> {{ item.name }} </div>
+ </div>
+ <div class="branch-node-content" @click="conditionNodeConfig(item.id)">
+ <div class="branch-node-text" :title="item.showText" v-if="item.showText">
+ {{ item.showText }}
+ </div>
+ <div class="branch-node-text" v-else>
+ {{ NODE_DEFAULT_TEXT.get(NodeType.CONDITION_NODE) }}
+ </div>
+ </div>
+ <div
+ class="node-toolbar"
+ v-if="!readonly && index + 1 !== currentNode.conditionNodes?.length"
+ >
+ <div class="toolbar-icon">
+ <Icon
+ color="#0089ff"
+ icon="ep:circle-close-filled"
+ :size="18"
+ @click="deleteCondition(index)"
+ />
+ </div>
+ </div>
+ <div
+ class="branch-node-move move-node-left"
+ v-if="!readonly && index != 0 && index + 1 !== currentNode.conditionNodes?.length"
+ @click="moveNode(index, -1)"
+ >
+ <Icon icon="ep:arrow-left" />
+ </div>
+
+ <div
+ class="branch-node-move move-node-right"
+ v-if="
+ !readonly &&
+ currentNode.conditionNodes &&
+ index < currentNode.conditionNodes.length - 2
+ "
+ @click="moveNode(index, 1)"
+ >
+ <Icon icon="ep:arrow-right" />
+ </div>
+ </div>
+ <NodeHandler v-model:child-node="item.childNode" :current-node="item" />
+ </div>
+ </div>
+ <ConditionNodeConfig :node-index="index" :condition-node="item" :ref="item.id" />
+ <!-- 閫掑綊鏄剧ず瀛愯妭鐐� -->
+ <ProcessNodeTree
+ v-if="item && item.childNode"
+ :parent-node="item"
+ v-model:flow-node="item.childNode"
+ @find:recursive-find-parent-node="recursiveFindParentNode"
+ />
+ </div>
+ </div>
+ <NodeHandler
+ v-if="currentNode"
+ v-model:child-node="currentNode.childNode"
+ :current-node="currentNode"
+ />
+ </div>
+</template>
+
+<script setup lang="ts">
+import NodeHandler from '../NodeHandler.vue'
+import ProcessNodeTree from '../ProcessNodeTree.vue'
+import {
+ SimpleFlowNode,
+ NodeType,
+ ConditionType,
+ DEFAULT_CONDITION_GROUP_VALUE,
+ NODE_DEFAULT_TEXT
+} from '../consts'
+import { useTaskStatusClass } from '../node'
+import { getDefaultInclusiveConditionNodeName } from '../utils'
+import { generateUUID } from '@/utils'
+import ConditionNodeConfig from '../nodes-config/ConditionNodeConfig.vue'
+import { cloneDeep } from 'lodash-es'
+const { proxy } = getCurrentInstance() as any
+defineOptions({
+ name: 'InclusiveNode'
+})
+const props = defineProps({
+ flowNode: {
+ type: Object as () => SimpleFlowNode,
+ required: true
+ }
+})
+// 瀹氫箟浜嬩欢锛屾洿鏂扮埗缁勪欢
+const emits = defineEmits<{
+ 'update:modelValue': [node: SimpleFlowNode | undefined]
+ 'find:parentNode': [nodeList: SimpleFlowNode[], nodeType: number]
+ 'find:recursiveFindParentNode': [
+ nodeList: SimpleFlowNode[],
+ curentNode: SimpleFlowNode,
+ nodeType: number
+ ]
+}>()
+// 鏄惁鍙
+const readonly = inject<Boolean>('readonly')
+
+const currentNode = ref<SimpleFlowNode>(props.flowNode)
+
+watch(
+ () => props.flowNode,
+ (newValue) => {
+ currentNode.value = newValue
+ }
+)
+
+const showInputs = ref<boolean[]>([])
+// 澶卞幓鐒︾偣
+const blurEvent = (index: number) => {
+ showInputs.value[index] = false
+ const conditionNode = currentNode.value.conditionNodes?.at(index) as SimpleFlowNode
+ conditionNode.name =
+ conditionNode.name ||
+ getDefaultInclusiveConditionNodeName(index, conditionNode.conditionSetting?.defaultFlow)
+}
+
+// 鐐瑰嚮鏉′欢鍚嶇О
+const clickEvent = (index: number) => {
+ showInputs.value[index] = true
+}
+
+const conditionNodeConfig = (nodeId: string) => {
+ if (readonly) {
+ return
+ }
+ const conditionNode = proxy.$refs[nodeId][0]
+ conditionNode.open()
+}
+
+// 鏂板鏉′欢
+const addCondition = () => {
+ const conditionNodes = currentNode.value.conditionNodes
+ if (conditionNodes) {
+ const len = conditionNodes.length
+ let lastIndex = len - 1
+ const conditionData: SimpleFlowNode = {
+ id: 'Flow_' + generateUUID(),
+ name: '鍖呭鏉′欢' + len,
+ showText: '',
+ type: NodeType.CONDITION_NODE,
+ childNode: undefined,
+ conditionNodes: [],
+ conditionSetting: {
+ defaultFlow: false,
+ conditionType: ConditionType.RULE,
+ conditionGroups: cloneDeep(DEFAULT_CONDITION_GROUP_VALUE)
+ }
+ }
+ conditionNodes.splice(lastIndex, 0, conditionData)
+ }
+}
+
+// 鍒犻櫎鏉′欢
+const deleteCondition = (index: number) => {
+ const conditionNodes = currentNode.value.conditionNodes
+ if (conditionNodes) {
+ conditionNodes.splice(index, 1)
+ if (conditionNodes.length == 1) {
+ const childNode = currentNode.value.childNode
+ // 鏇存柊姝よ妭鐐逛负鍚庣画瀛╁瓙鑺傜偣
+ emits('update:modelValue', childNode)
+ }
+ }
+}
+
+// 绉诲姩鑺傜偣
+const moveNode = (index: number, to: number) => {
+ // -1 锛氬悜宸� 1锛� 鍚戝彸
+ if (currentNode.value.conditionNodes) {
+ currentNode.value.conditionNodes[index] = currentNode.value.conditionNodes.splice(
+ index + to,
+ 1,
+ currentNode.value.conditionNodes[index]
+ )[0]
+ }
+}
+// 閫掑綊浠庣埗鑺傜偣涓煡璇㈠尮閰嶇殑鑺傜偣
+const recursiveFindParentNode = (
+ nodeList: SimpleFlowNode[],
+ node: SimpleFlowNode,
+ nodeType: number
+) => {
+ if (!node || node.type === NodeType.START_USER_NODE) {
+ return
+ }
+ if (node.type === nodeType) {
+ nodeList.push(node)
+ }
+ // 鏉′欢鑺傜偣 (NodeType.CONDITION_NODE) 姣旇緝鐗规畩銆傞渶瑕佽皟鐢ㄥ叾鐖惰妭鐐规潯浠跺垎鏀妭鐐癸紙NodeType.INCLUSIVE_BRANCH_NODE) 缁х画鏌ユ壘
+ emits('find:parentNode', nodeList, nodeType)
+}
+</script>
+
+<style lang="scss" scoped></style>
--
Gitblit v1.8.0