From c09e51648e3aaccf3f9a81c2091861dfc433d1fe Mon Sep 17 00:00:00 2001
From: xlsea <m@xlsea.cn>
Date: Fri, 5 Jul 2024 14:51:41 +0800
Subject: [PATCH] =?UTF-8?q?feat(sj=5Fpreview):=20=E6=96=B0=E5=A2=9E?=
 =?UTF-8?q?=E6=9D=A1=E4=BB=B6=E8=A1=A8=E8=BE=BE=E5=BC=8F=E6=89=8B=E5=8A=A8?=
 =?UTF-8?q?=E6=A0=A1=E9=AA=8C=E6=8C=89=E9=92=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common/dynamic-input.vue       | 20 +++++++-----
 .../workflow/modules/drawer/branch-drawer.vue | 31 ++++++++++++++-----
 .../workflow/modules/drawer/start-drawer.vue  |  2 +-
 3 files changed, 38 insertions(+), 15 deletions(-)

diff --git a/src/components/common/dynamic-input.vue b/src/components/common/dynamic-input.vue
index c46151a..ba5bd60 100644
--- a/src/components/common/dynamic-input.vue
+++ b/src/components/common/dynamic-input.vue
@@ -69,9 +69,9 @@ const handleUpdateType = (index: number) => {
 
 <template>
   <NDynamicInput v-model:value="content" item-style="margin-bottom: 0;" :on-create="onCreate" #="{ index }">
-    <NGrid :x-gap="16">
+    <NGrid>
       <NFormItemGi
-        :span="8"
+        :span="7"
         ignore-path-change
         :show-label="false"
         :rule="dynamicInputRule"
@@ -79,9 +79,9 @@ const handleUpdateType = (index: number) => {
       >
         <NInput v-model:value="content[index].key" placeholder="key" @keydown.enter.prevent />
       </NFormItemGi>
-      <NGi :span="1" class="h-34px lh-34px">=</NGi>
+      <NGi :span="2" class="h-34px text-center lh-34px">=</NGi>
       <NFormItemGi
-        :span="8"
+        :span="7"
         ignore-path-change
         :show-label="false"
         :rule="dynamicInputRule"
@@ -109,8 +109,14 @@ const handleUpdateType = (index: number) => {
           @keydown.enter.prevent
         />
       </NFormItemGi>
-      <NFormItemGi :span="3" class="w-130px" ignore-path-change :show-label="false" :path="`${path}[${index}].type`">
-        <div :span="1" class="h-34px lh-34px">(</div>
+      <NFormItemGi
+        :span="3"
+        class="ml-12px w-115px"
+        ignore-path-change
+        :show-label="false"
+        :path="`${path}[${index}].type`"
+      >
+        <div class="h-34px lh-34px">(</div>
         <NSelect
           v-model:value="content[index].type"
           class="mx-3px"
@@ -119,7 +125,7 @@ const handleUpdateType = (index: number) => {
           @keydown.enter.prevent
           @update:value="handleUpdateType(index)"
         />
-        <div :span="1" class="h-34px lh-34px">)</div>
+        <div class="h-34px lh-34px">)</div>
       </NFormItemGi>
     </NGrid>
   </NDynamicInput>
diff --git a/src/components/workflow/modules/drawer/branch-drawer.vue b/src/components/workflow/modules/drawer/branch-drawer.vue
index 98aa087..74b8554 100644
--- a/src/components/workflow/modules/drawer/branch-drawer.vue
+++ b/src/components/workflow/modules/drawer/branch-drawer.vue
@@ -72,25 +72,30 @@ const save = () => {
     .catch(() => window.$message?.warning('请检查表单信息'));
 };
 
+const nodeExpressionFeedback = ref('');
+
 const checkNodeExpression = async () => {
   if (!form.value.decision?.nodeExpression) {
-    return Promise.reject(new Error('请填写条件表达式'));
+    nodeExpressionFeedback.value = '请填写条件表达式';
+    return;
   }
   const { error, data } = await fetchCheckNodeExpression(form.value.decision!);
   if (!error) {
     if (data.key !== 1) {
-      return Promise.reject(data.value ?? '请检查条件表达式');
+      nodeExpressionFeedback.value = data.value || '请检查条件表达式';
+      return;
     }
   } else {
-    return Promise.reject(new Error('接口请求失败'));
+    nodeExpressionFeedback.value = '接口请求失败';
+    return;
   }
-  return Promise.resolve();
+  nodeExpressionFeedback.value = '';
 };
 
 const rules: FormRules = {
   decision: {
     expressionType: [{ required: true, message: '请选择表达式类型', trigger: 'change', type: 'number' }],
-    nodeExpression: [{ required: true, validator: checkNodeExpression, trigger: 'blur' }]
+    nodeExpression: [{ required: true, message: '请填写条件表达式', trigger: 'blur' }]
   }
 };
 </script>
@@ -132,12 +137,24 @@ const rules: FormRules = {
             </NSpace>
           </NRadioGroup>
         </NFormItem>
-        <NFormItem path="decision.nodeExpression" label="条件表达式">
+        <NFormItem
+          path="decision.nodeExpression"
+          label="条件表达式"
+          validation-status="error"
+          :feedback="nodeExpressionFeedback"
+        >
           <CodeMirror v-model="form.decision!.nodeExpression" placeholder="请输入条件表达式" />
         </NFormItem>
-        <NFormItem path="decision.checkContents" label="模拟上下文">
+        <NFormItem
+          path="decision.checkContents"
+          label="模拟上下文"
+          :show-feedback="form.decision?.checkContents && form.decision.checkContents.length === 0"
+        >
           <DynamicInput v-model:value="form.decision!.checkContents!" path="decision.checkContents" />
         </NFormItem>
+        <NFormItem :show-label="false" :show-feedback="false">
+          <NButton type="primary" ghost block @click="checkNodeExpression">校验条件表达式</NButton>
+        </NFormItem>
       </NForm>
 
       <template #footer>
diff --git a/src/components/workflow/modules/drawer/start-drawer.vue b/src/components/workflow/modules/drawer/start-drawer.vue
index 24bd45f..c939de4 100644
--- a/src/components/workflow/modules/drawer/start-drawer.vue
+++ b/src/components/workflow/modules/drawer/start-drawer.vue
@@ -210,7 +210,7 @@ const rules: Record<RuleKey, FormItemRule> = {
             </NFormItem>
           </NGi>
         </NGrid>
-        <NFormItem path="wfContext" label="工作流上下文">
+        <NFormItem path="wfContext" label="工作流上下文" :show-feedback="false">
           <DynamicInput v-model:value="form.wfContexts!" path="wfContexts" />
         </NFormItem>
         <NFormItem path="workflowStatus" label="节点状态">