diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes-config/condition-node-config.vue b/apps/web-antd/src/components/simple-process-design/components/nodes-config/condition-node-config.vue index cc4376efc..11e0da4b4 100644 --- a/apps/web-antd/src/components/simple-process-design/components/nodes-config/condition-node-config.vue +++ b/apps/web-antd/src/components/simple-process-design/components/nodes-config/condition-node-config.vue @@ -144,8 +144,8 @@ function clickIcon() { showInput.value = true; } -// 输入框失去焦点 -function blurEvent() { +// 修改节点名称 +function changeNodeName() { showInput.value = false; currentNode.value.name = currentNode.value.name || @@ -166,7 +166,8 @@ defineExpose({ open }); // 提供 open 方法,用于打开弹窗 v-if="showInput" type="text" class="mr-2 w-48" - @blur="blurEvent()" + @blur="changeNodeName()" + @press-enter="changeNodeName()" v-model:value="currentNode.name" :placeholder="currentNode.name" /> diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes-config/copy-task-node-config.vue b/apps/web-antd/src/components/simple-process-design/components/nodes-config/copy-task-node-config.vue index 7bbe3b3cf..658392f83 100644 --- a/apps/web-antd/src/components/simple-process-design/components/nodes-config/copy-task-node-config.vue +++ b/apps/web-antd/src/components/simple-process-design/components/nodes-config/copy-task-node-config.vue @@ -75,9 +75,8 @@ const [Drawer, drawerApi] = useVbenDrawer({ const currentNode = useWatchNode(props); // 节点名称 -const { nodeName, showInput, clickIcon, blurEvent, inputRef } = useNodeName( - BpmNodeTypeEnum.COPY_TASK_NODE, -); +const { nodeName, showInput, clickIcon, changeNodeName, inputRef } = + useNodeName(BpmNodeTypeEnum.COPY_TASK_NODE); // 激活的 Tab 标签页 const activeTabName = ref('user'); @@ -216,7 +215,8 @@ defineExpose({ showCopyTaskNodeConfig }); // 暴露方法给父组件 ref="inputRef" type="text" class="config-editable-input" - @blur="blurEvent()" + @blur="changeNodeName()" + @press-enter="changeNodeName()" v-model:value="nodeName" :placeholder="nodeName" /> diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes-config/delay-timer-node-config.vue b/apps/web-antd/src/components/simple-process-design/components/nodes-config/delay-timer-node-config.vue index 89f58161b..c8c8511a5 100644 --- a/apps/web-antd/src/components/simple-process-design/components/nodes-config/delay-timer-node-config.vue +++ b/apps/web-antd/src/components/simple-process-design/components/nodes-config/delay-timer-node-config.vue @@ -45,9 +45,8 @@ const props = defineProps({ // 当前节点 const currentNode = useWatchNode(props); // 节点名称 -const { nodeName, showInput, clickIcon, blurEvent, inputRef } = useNodeName( - BpmNodeTypeEnum.DELAY_TIMER_NODE, -); +const { nodeName, showInput, clickIcon, changeNodeName, inputRef } = + useNodeName(BpmNodeTypeEnum.DELAY_TIMER_NODE); // 抄送人表单配置 const formRef = ref(); // 表单 Ref @@ -161,7 +160,8 @@ defineExpose({ openDrawer }); // 暴露方法给父组件 ref="inputRef" type="text" class="mr-2 w-48" - @blur="blurEvent()" + @blur="changeNodeName()" + @press-enter="changeNodeName()" v-model:value="nodeName" :placeholder="nodeName" /> diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes-config/router-node-config.vue b/apps/web-antd/src/components/simple-process-design/components/nodes-config/router-node-config.vue index f377d7d5a..e10f7a84c 100644 --- a/apps/web-antd/src/components/simple-process-design/components/nodes-config/router-node-config.vue +++ b/apps/web-antd/src/components/simple-process-design/components/nodes-config/router-node-config.vue @@ -41,9 +41,8 @@ const processNodeTree = inject>('processNodeTree'); /** 当前节点 */ const currentNode = useWatchNode(props); /** 节点名称 */ -const { nodeName, showInput, clickIcon, blurEvent, inputRef } = useNodeName( - BpmNodeTypeEnum.ROUTER_BRANCH_NODE, -); +const { nodeName, showInput, clickIcon, changeNodeName, inputRef } = + useNodeName(BpmNodeTypeEnum.ROUTER_BRANCH_NODE); const routerGroups = ref([]); const nodeOptions = ref([]); const conditionRef = ref([]); @@ -209,7 +208,8 @@ defineExpose({ openDrawer }); // 暴露方法给父组件 v-if="showInput" type="text" class="mr-2 w-48" - @blur="blurEvent()" + @blur="changeNodeName()" + @press-enter="changeNodeName()" v-model:value="nodeName" :placeholder="nodeName" /> diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes-config/start-user-node-config.vue b/apps/web-antd/src/components/simple-process-design/components/nodes-config/start-user-node-config.vue index eb0d7e704..0c12a2104 100644 --- a/apps/web-antd/src/components/simple-process-design/components/nodes-config/start-user-node-config.vue +++ b/apps/web-antd/src/components/simple-process-design/components/nodes-config/start-user-node-config.vue @@ -52,9 +52,8 @@ const deptOptions = inject>('deptList'); // 当前节点 const currentNode = useWatchNode(props); // 节点名称 -const { nodeName, showInput, clickIcon, blurEvent, inputRef } = useNodeName( - BpmNodeTypeEnum.START_USER_NODE, -); +const { nodeName, showInput, clickIcon, changeNodeName, inputRef } = + useNodeName(BpmNodeTypeEnum.START_USER_NODE); // 激活的 Tab 标签页 const activeTabName = ref('user'); @@ -150,7 +149,8 @@ defineExpose({ showStartUserNodeConfig }); v-if="showInput" type="text" class="config-editable-input" - @blur="blurEvent()" + @blur="changeNodeName()" + @press-enter="changeNodeName()" v-model:value="nodeName" :placeholder="nodeName" /> diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes-config/trigger-node-config.vue b/apps/web-antd/src/components/simple-process-design/components/nodes-config/trigger-node-config.vue index 952c77261..b051f3195 100644 --- a/apps/web-antd/src/components/simple-process-design/components/nodes-config/trigger-node-config.vue +++ b/apps/web-antd/src/components/simple-process-design/components/nodes-config/trigger-node-config.vue @@ -72,9 +72,8 @@ const [Drawer, drawerApi] = useVbenDrawer({ // 当前节点 const currentNode = useWatchNode(props); // 节点名称 -const { nodeName, showInput, clickIcon, blurEvent, inputRef } = useNodeName( - BpmNodeTypeEnum.TRIGGER_NODE, -); +const { nodeName, showInput, clickIcon, changeNodeName, inputRef } = + useNodeName(BpmNodeTypeEnum.TRIGGER_NODE); // 触发器表单配置 const formRef = ref(); // 表单 Ref @@ -392,7 +391,8 @@ onMounted(() => { v-if="showInput" type="text" class="config-editable-input" - @blur="blurEvent()" + @blur="changeNodeName()" + @press-enter="changeNodeName()" v-model:value="nodeName" :placeholder="nodeName" /> diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes-config/user-task-node-config.vue b/apps/web-antd/src/components/simple-process-design/components/nodes-config/user-task-node-config.vue index 9da410f1d..441a2b7ef 100644 --- a/apps/web-antd/src/components/simple-process-design/components/nodes-config/user-task-node-config.vue +++ b/apps/web-antd/src/components/simple-process-design/components/nodes-config/user-task-node-config.vue @@ -114,9 +114,8 @@ const [Drawer, drawerApi] = useVbenDrawer({ }); // 节点名称配置 -const { nodeName, showInput, clickIcon, blurEvent, inputRef } = useNodeName( - BpmNodeTypeEnum.USER_TASK_NODE, -); +const { nodeName, showInput, clickIcon, changeNodeName, inputRef } = + useNodeName(BpmNodeTypeEnum.USER_TASK_NODE); // 激活的 Tab 标签页 const activeTabName = ref('user'); @@ -589,7 +588,8 @@ onMounted(() => { ref="inputRef" type="text" class="config-editable-input" - @blur="blurEvent()" + @blur="changeNodeName()" + @press-enter="changeNodeName()" v-model:value="nodeName" :placeholder="nodeName" /> diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes/copy-task-node.vue b/apps/web-antd/src/components/simple-process-design/components/nodes/copy-task-node.vue index 32deb8992..5f07ffa5c 100644 --- a/apps/web-antd/src/components/simple-process-design/components/nodes/copy-task-node.vue +++ b/apps/web-antd/src/components/simple-process-design/components/nodes/copy-task-node.vue @@ -32,7 +32,7 @@ const readonly = inject('readonly'); // 监控节点的变化 const currentNode = useWatchNode(props); // 节点名称编辑 -const { showInput, blurEvent, clickTitle, inputRef } = useNodeName2( +const { showInput, changeNodeName, clickTitle, inputRef } = useNodeName2( currentNode, BpmNodeTypeEnum.COPY_TASK_NODE, ); @@ -71,7 +71,8 @@ function deleteNode() { v-if="!readonly && showInput" type="text" class="editable-title-input" - @blur="blurEvent()" + @blur="changeNodeName()" + @press-enter="changeNodeName()" v-model:value="currentNode.name" :placeholder="currentNode.name" /> diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes/delay-timer-node.vue b/apps/web-antd/src/components/simple-process-design/components/nodes/delay-timer-node.vue index 5e55fad99..4d5835e44 100644 --- a/apps/web-antd/src/components/simple-process-design/components/nodes/delay-timer-node.vue +++ b/apps/web-antd/src/components/simple-process-design/components/nodes/delay-timer-node.vue @@ -30,7 +30,7 @@ const readonly = inject('readonly'); // 监控节点的变化 const currentNode = useWatchNode(props); // 节点名称编辑 -const { showInput, blurEvent, clickTitle, inputRef } = useNodeName2( +const { showInput, changeNodeName, clickTitle, inputRef } = useNodeName2( currentNode, BpmNodeTypeEnum.DELAY_TIMER_NODE, ); @@ -68,7 +68,8 @@ function deleteNode() { v-if="!readonly && showInput" type="text" class="editable-title-input" - @blur="blurEvent()" + @blur="changeNodeName()" + @press-enter="changeNodeName()" v-model:value="currentNode.name" :placeholder="currentNode.name" /> diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes/exclusive-node.vue b/apps/web-antd/src/components/simple-process-design/components/nodes/exclusive-node.vue index 6a716b3e8..5b9b5983d 100644 --- a/apps/web-antd/src/components/simple-process-design/components/nodes/exclusive-node.vue +++ b/apps/web-antd/src/components/simple-process-design/components/nodes/exclusive-node.vue @@ -73,8 +73,8 @@ watch( { deep: true }, ); -// 失去焦点 -function blurEvent(index: number) { +// 修改节点名称 +function changeNodeName(index: number) { showInputs.value[index] = false; const conditionNode = currentNode.value.conditionNodes?.at( index, @@ -214,7 +214,8 @@ function recursiveFindParentNode( " type="text" class="editable-title-input" - @blur="blurEvent(index)" + @blur="changeNodeName(index)" + @press-enter="changeNodeName(index)" v-model:value="item.name" /> diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes/inclusive-node.vue b/apps/web-antd/src/components/simple-process-design/components/nodes/inclusive-node.vue index caf15c937..14cb94ff7 100644 --- a/apps/web-antd/src/components/simple-process-design/components/nodes/inclusive-node.vue +++ b/apps/web-antd/src/components/simple-process-design/components/nodes/inclusive-node.vue @@ -77,8 +77,8 @@ watch( }, { deep: true }, ); -// 失去焦点 -function blurEvent(index: number) { +// 修改节点名称 +function changeNodeName(index: number) { showInputs.value[index] = false; const conditionNode = currentNode.value.conditionNodes?.at( index, @@ -217,7 +217,8 @@ function recursiveFindParentNode( " type="text" class="editable-title-input" - @blur="blurEvent(index)" + @blur="changeNodeName(index)" + @press-enter="changeNodeName(index)" v-model:value="item.name" /> diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes/parallel-node.vue b/apps/web-antd/src/components/simple-process-design/components/nodes/parallel-node.vue index 8ead12916..1d543c0ba 100644 --- a/apps/web-antd/src/components/simple-process-design/components/nodes/parallel-node.vue +++ b/apps/web-antd/src/components/simple-process-design/components/nodes/parallel-node.vue @@ -66,8 +66,8 @@ watch( }, { deep: true }, ); -// 失去焦点 -function blurEvent(index: number) { +// 修改节点名称 +function changeNodeName(index: number) { showInputs.value[index] = false; const conditionNode = currentNode.value.conditionNodes?.at( index, @@ -175,7 +175,8 @@ function recursiveFindParentNode( " type="text" class="input-max-width editable-title-input" - @blur="blurEvent(index)" + @blur="changeNodeName(index)" + @press-enter="changeNodeName(index)" v-model:value="item.name" /> diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes/router-node.vue b/apps/web-antd/src/components/simple-process-design/components/nodes/router-node.vue index 35df60b87..91c86b96e 100644 --- a/apps/web-antd/src/components/simple-process-design/components/nodes/router-node.vue +++ b/apps/web-antd/src/components/simple-process-design/components/nodes/router-node.vue @@ -33,7 +33,7 @@ const readonly = inject('readonly'); // 监控节点的变化 const currentNode = useWatchNode(props); // 节点名称编辑 -const { showInput, blurEvent, clickTitle, inputRef } = useNodeName2( +const { showInput, changeNodeName, clickTitle, inputRef } = useNodeName2( currentNode, BpmNodeTypeEnum.ROUTER_BRANCH_NODE, ); @@ -71,7 +71,8 @@ function deleteNode() { v-if="!readonly && showInput" type="text" class="editable-title-input" - @blur="blurEvent()" + @blur="changeNodeName()" + @press-enter="changeNodeName()" v-model:value="currentNode.name" :placeholder="currentNode.name" /> diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes/start-user-node.vue b/apps/web-antd/src/components/simple-process-design/components/nodes/start-user-node.vue index e9055ef28..f2fd76e66 100644 --- a/apps/web-antd/src/components/simple-process-design/components/nodes/start-user-node.vue +++ b/apps/web-antd/src/components/simple-process-design/components/nodes/start-user-node.vue @@ -37,7 +37,7 @@ const tasks = inject>('tasks', ref([])); // 监控节点变化 const currentNode = useWatchNode(props); // 节点名称编辑 -const { showInput, blurEvent, clickTitle, inputRef } = useNodeName2( +const { showInput, changeNodeName, clickTitle, inputRef } = useNodeName2( currentNode, BpmNodeTypeEnum.START_USER_NODE, ); @@ -85,7 +85,8 @@ function nodeClick() { v-if="!readonly && showInput" type="text" class="editable-title-input" - @blur="blurEvent()" + @blur="changeNodeName()" + @press-enter="changeNodeName()" v-model:value="currentNode.name" :placeholder="currentNode.name" /> diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes/trigger-node.vue b/apps/web-antd/src/components/simple-process-design/components/nodes/trigger-node.vue index 84f7f3d4e..f373ae065 100644 --- a/apps/web-antd/src/components/simple-process-design/components/nodes/trigger-node.vue +++ b/apps/web-antd/src/components/simple-process-design/components/nodes/trigger-node.vue @@ -35,7 +35,7 @@ const readonly = inject('readonly'); // 监控节点的变化 const currentNode = useWatchNode(props); // 节点名称编辑 -const { showInput, blurEvent, clickTitle, inputRef } = useNodeName2( +const { showInput, changeNodeName, clickTitle, inputRef } = useNodeName2( currentNode, BpmNodeTypeEnum.TRIGGER_NODE, ); @@ -73,7 +73,8 @@ function deleteNode() { v-if="!readonly && showInput" type="text" class="editable-title-input" - @blur="blurEvent()" + @blur="changeNodeName()" + @press-enter="changeNodeName()" v-model:value="currentNode.name" :placeholder="currentNode.name" /> diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes/user-task-node.vue b/apps/web-antd/src/components/simple-process-design/components/nodes/user-task-node.vue index 57ea49467..120eff145 100644 --- a/apps/web-antd/src/components/simple-process-design/components/nodes/user-task-node.vue +++ b/apps/web-antd/src/components/simple-process-design/components/nodes/user-task-node.vue @@ -36,7 +36,7 @@ const tasks = inject>('tasks', ref([])); // 监控节点变化 const currentNode = useWatchNode(props); // 节点名称编辑 -const { showInput, blurEvent, clickTitle, inputRef } = useNodeName2( +const { showInput, changeNodeName, clickTitle, inputRef } = useNodeName2( currentNode, BpmNodeTypeEnum.USER_TASK_NODE, ); @@ -91,7 +91,8 @@ function findReturnTaskNodes( v-if="!readonly && showInput" type="text" class="editable-title-input" - @blur="blurEvent()" + @blur="changeNodeName()" + @press-enter="changeNodeName()" v-model:value="currentNode.name" :placeholder="currentNode.name" /> diff --git a/apps/web-antd/src/components/simple-process-design/helpers.ts b/apps/web-antd/src/components/simple-process-design/helpers.ts index 26f91ad73..c346de209 100644 --- a/apps/web-antd/src/components/simple-process-design/helpers.ts +++ b/apps/web-antd/src/components/simple-process-design/helpers.ts @@ -628,8 +628,8 @@ export function useNodeName(nodeType: BpmNodeTypeEnum) { function clickIcon() { showInput.value = true; } - // 节点名称输入框失去焦点 - function blurEvent() { + // 修改节点名称 + function changeNodeName() { showInput.value = false; nodeName.value = nodeName.value || (NODE_DEFAULT_NAME.get(nodeType) as string); @@ -648,7 +648,7 @@ export function useNodeName(nodeType: BpmNodeTypeEnum) { showInput, inputRef, clickIcon, - blurEvent, + changeNodeName, }; } @@ -670,8 +670,8 @@ export function useNodeName2( } }); - // 节点名称输入框失去焦点 - function blurEvent() { + // 修改节点名称 + function changeNodeName() { showInput.value = false; node.value.name = node.value.name || (NODE_DEFAULT_NAME.get(nodeType) as string); @@ -685,7 +685,7 @@ export function useNodeName2( showInput, inputRef, clickTitle, - blurEvent, + changeNodeName, }; }