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-config/ConditionNodeConfig.vue | 222 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 222 insertions(+), 0 deletions(-)
diff --git a/src/components/SimpleProcessDesignerV2/src/nodes-config/ConditionNodeConfig.vue b/src/components/SimpleProcessDesignerV2/src/nodes-config/ConditionNodeConfig.vue
new file mode 100644
index 0000000..9020d65
--- /dev/null
+++ b/src/components/SimpleProcessDesignerV2/src/nodes-config/ConditionNodeConfig.vue
@@ -0,0 +1,222 @@
+<template>
+ <el-drawer
+ :append-to-body="true"
+ v-model="settingVisible"
+ :show-close="false"
+ :size="588"
+ :before-close="handleClose"
+ >
+ <template #header>
+ <div class="config-header">
+ <input
+ v-if="showInput"
+ type="text"
+ class="config-editable-input"
+ @blur="blurEvent()"
+ v-mountedFocus
+ v-model="currentNode.name"
+ :placeholder="currentNode.name"
+ />
+ <div v-else class="node-name"
+ >{{ currentNode.name }}
+ <Icon class="ml-1" icon="ep:edit-pen" :size="16" @click="clickIcon()"
+ /></div>
+
+ <div class="divide-line"></div>
+ </div>
+ </template>
+ <div>
+ <div class="mb-3 font-size-16px" v-if="currentNode.conditionSetting?.defaultFlow"
+ >鏈弧瓒冲叾瀹冩潯浠舵椂锛屽皢杩涘叆姝ゅ垎鏀紙璇ュ垎鏀笉鍙紪杈戝拰鍒犻櫎锛�</div
+ >
+ <div v-else>
+ <Condition ref="conditionRef" v-model="condition" />
+ </div>
+ </div>
+ <template #footer>
+ <el-divider />
+ <div>
+ <el-button type="primary" @click="saveConfig">纭� 瀹�</el-button>
+ <el-button @click="closeDrawer">鍙� 娑�</el-button>
+ </div>
+ </template>
+ </el-drawer>
+</template>
+<script setup lang="ts">
+import { SimpleFlowNode, ConditionType } from '../consts'
+import { getDefaultConditionNodeName } from '../utils'
+import { useFormFieldsAndStartUser, getConditionShowText } from '../node'
+import Condition from './components/Condition.vue'
+import { cloneDeep } from 'lodash-es'
+
+defineOptions({
+ name: 'ConditionNodeConfig'
+})
+const props = defineProps({
+ conditionNode: {
+ type: Object as () => SimpleFlowNode,
+ required: true
+ },
+ nodeIndex: {
+ type: Number,
+ required: true
+ }
+})
+const settingVisible = ref(false)
+const currentNode = ref<SimpleFlowNode>(props.conditionNode)
+const condition = ref<any>({
+ conditionType: ConditionType.RULE, // 璁剧疆榛樿鍊�
+ conditionExpression: '',
+ conditionGroups: {
+ and: true,
+ conditions: [
+ {
+ and: true,
+ rules: [
+ {
+ opCode: '==',
+ leftSide: '',
+ rightSide: ''
+ }
+ ]
+ }
+ ]
+ }
+})
+const open = () => {
+ // 濡傛灉鏈夊凡瀛樺湪鐨勯厤缃垯浣跨敤锛屽惁鍒欎娇鐢ㄩ粯璁ゅ��
+ if (currentNode.value.conditionSetting) {
+ condition.value = cloneDeep(currentNode.value.conditionSetting)
+ } else {
+ // 閲嶇疆涓洪粯璁ゅ��
+ condition.value = {
+ conditionType: ConditionType.RULE,
+ conditionExpression: '',
+ conditionGroups: {
+ and: true,
+ conditions: [
+ {
+ and: true,
+ rules: [
+ {
+ opCode: '==',
+ leftSide: '',
+ rightSide: ''
+ }
+ ]
+ }
+ ]
+ }
+ }
+ }
+ settingVisible.value = true
+}
+
+watch(
+ () => props.conditionNode,
+ (newValue) => {
+ currentNode.value = newValue
+ }
+)
+// 鏄剧ず鍚嶇О杈撳叆妗�
+const showInput = ref(false)
+
+const clickIcon = () => {
+ showInput.value = true
+}
+// 杈撳叆妗嗗け鍘荤劍鐐�
+const blurEvent = () => {
+ showInput.value = false
+ currentNode.value.name =
+ currentNode.value.name ||
+ getDefaultConditionNodeName(props.nodeIndex, currentNode.value?.conditionSetting?.defaultFlow)
+}
+
+defineExpose({ open }) // 鎻愪緵 open 鏂规硶锛岀敤浜庢墦寮�寮圭獥
+
+// 鍏抽棴
+const closeDrawer = () => {
+ settingVisible.value = false
+}
+
+const handleClose = async (done: (cancel?: boolean) => void) => {
+ const isSuccess = await saveConfig()
+ if (!isSuccess) {
+ done(true) // 浼犲叆 true 闃绘鍏抽棴
+ } else {
+ done()
+ }
+}
+
+/** 淇濆瓨閰嶇疆 */
+const fieldOptions = useFormFieldsAndStartUser() // 娴佺▼琛ㄥ崟瀛楁鍜屽彂璧蜂汉瀛楁
+const conditionRef = ref()
+const saveConfig = async () => {
+ if (!currentNode.value.conditionSetting?.defaultFlow) {
+ // 鏍￠獙琛ㄥ崟
+ const valid = await conditionRef.value.validate()
+ if (!valid) return false
+ const showText = getConditionShowText(
+ condition.value?.conditionType,
+ condition.value?.conditionExpression,
+ condition.value.conditionGroups,
+ fieldOptions
+ )
+ if (!showText) {
+ return false
+ }
+ currentNode.value.showText = showText
+ // 浣跨敤 cloneDeep 杩涜娣辨嫹璐�
+ currentNode.value.conditionSetting = cloneDeep({
+ ...currentNode.value.conditionSetting,
+ conditionType: condition.value?.conditionType,
+ conditionExpression:
+ condition.value?.conditionType === ConditionType.EXPRESSION
+ ? condition.value?.conditionExpression
+ : undefined,
+ conditionGroups:
+ condition.value?.conditionType === ConditionType.RULE
+ ? condition.value?.conditionGroups
+ : undefined
+ })
+ }
+ settingVisible.value = false
+ return true
+}
+</script>
+
+<style lang="scss" scoped>
+.condition-group-tool {
+ display: flex;
+ justify-content: space-between;
+ width: 500px;
+ margin-bottom: 20px;
+}
+
+.condition-group {
+ position: relative;
+
+ &:hover {
+ border-color: #0089ff;
+
+ .condition-group-delete {
+ opacity: 1;
+ }
+ }
+
+ .condition-group-delete {
+ position: absolute;
+ top: 0;
+ left: 0;
+ display: flex;
+ cursor: pointer;
+ opacity: 0;
+ }
+}
+
+::v-deep(.el-card__header) {
+ padding: 8px var(--el-card-padding);
+ border-bottom: 1px solid var(--el-card-border-color);
+ box-sizing: border-box;
+}
+</style>
--
Gitblit v1.8.0