feat: Add SwitchOperatorOptions to Select of Switch #1739 (#2033)

### What problem does this PR solve? feat: Add SwitchOperatorOptions to Select of Switch #1739 ### Type of change - [x] New Feature (non-breaking change which adds functionality)
infiniflow · Aug 21, 2024 · 85247e6 · 85247e6
1 parent 17ada63
commit 85247e6
Show file tree

Hide file tree

Showing 7 changed files with 110 additions and 10 deletions.
diff --git a/web/.umirc.ts b/web/.umirc.ts
@@ -30,7 +30,7 @@ export default defineConfig({
   copy: ['src/conf.json'],
   proxy: {
     '/v1': {
-      target: 'http://localhost:9380/',
+      target: 'http://123.60.95.134:9380/',
       changeOrigin: true,
       ws: true,
       logger: console,

diff --git a/web/src/locales/en.ts b/web/src/locales/en.ts
@@ -815,6 +815,24 @@ The above is the content you need to summarize.`,
       password: 'Password',
       switch: 'Switch',
       logicalOperator: 'Logical operator',
+      switchOperatorOptions: {
+        equal: 'equal',
+        notEqual: 'notEqual',
+        gt: 'Greater than',
+        ge: 'Greater equal',
+        lt: 'Less than',
+        le: 'Less equal',
+        contains: 'Contains',
+        notContains: 'Not contains',
+        startWith: 'Start with',
+        endWith: 'End with',
+        empty: 'Empty',
+        notEmpty: 'Not empty',
+      },
+      switchLogicOperatorOptions: {
+        and: 'And',
+        or: 'Or',
+      },
     },
     footer: {
       profile: 'All rights reserved @ React',

diff --git a/web/src/locales/zh-traditional.ts b/web/src/locales/zh-traditional.ts
@@ -773,6 +773,24 @@ export default {
       password: '密碼',
       switch: '條件',
       logicalOperator: '操作符',
+      switchOperatorOptions: {
+        equal: '等於',
+        notEqual: '不等於',
+        gt: '大於',
+        ge: '大於等於',
+        lt: '小於',
+        le: '小於等於',
+        contains: '包含',
+        notContains: '不包含',
+        startWith: '開始是',
+        endWith: '結束是',
+        empty: '為空',
+        notEmpty: '不為空',
+      },
+      switchLogicOperatorOptions: {
+        and: '與',
+        or: '或',
+      },
     },
     footer: {
       profile: '“保留所有權利 @ react”',

diff --git a/web/src/locales/zh.ts b/web/src/locales/zh.ts
@@ -791,6 +791,24 @@ export default {
       password: '密码',
       switch: '条件',
       logicalOperator: '操作符',
+      switchOperatorOptions: {
+        equal: '等于',
+        notEqual: '不等于',
+        gt: '大于',
+        ge: '大于等于',
+        lt: '小于',
+        le: '小于等于',
+        contains: '包含',
+        notContains: '不包含',
+        startWith: '开始是',
+        endWith: '结束是',
+        empty: '为空',
+        notEmpty: '不为空',
+      },
+      switchLogicOperatorOptions: {
+        and: '与',
+        or: '或',
+      },
     },
     footer: {
       profile: 'All rights reserved @ React',

diff --git a/web/src/pages/flow/constant.tsx b/web/src/pages/flow/constant.tsx
@@ -2635,3 +2635,20 @@ export const ExeSQLOptions = ['mysql', 'postgresql', 'mariadb'].map((x) => ({
 }));
 
 export const SwitchElseTo = 'end_cpn_id';
+
+export const SwitchOperatorOptions = [
+  { value: '=', label: 'equal' },
+  { value: '≠', label: 'notEqual' },
+  { value: '>', label: 'gt' },
+  { value: '≥', label: 'ge' },
+  { value: '<', label: 'lt' },
+  { value: '≤', label: 'le' },
+  { value: 'contains', label: 'contains' },
+  { value: 'not contains', label: 'notContains' },
+  { value: 'start with', label: 'startWith' },
+  { value: 'end with', label: 'endWith' },
+  { value: 'empty', label: 'empty' },
+  { value: 'not empty', label: 'notEmpty' },
+];
+
+export const SwitchLogicOperatorOptions = ['and', 'or'];
diff --git a/web/src/pages/flow/exesql-form/index.tsx b/web/src/pages/flow/exesql-form/index.tsx
@@ -58,7 +58,7 @@ const ExeSQLForm = ({ onValuesChange, form }: IOperatorForm) => {
       >
         <InputNumber></InputNumber>
       </Form.Item>
-      <TopNItem initialValue={30} max={100000}></TopNItem>
+      <TopNItem initialValue={30} max={1000}></TopNItem>
     </Form>
   );
 };

diff --git a/web/src/pages/flow/switch-form/index.tsx b/web/src/pages/flow/switch-form/index.tsx
@@ -1,7 +1,13 @@
 import { CloseOutlined } from '@ant-design/icons';
 import { Button, Card, Form, Input, Select, Typography } from 'antd';
+import { useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
-import { Operator, SwitchElseTo } from '../constant';
+import {
+  Operator,
+  SwitchElseTo,
+  SwitchLogicOperatorOptions,
+  SwitchOperatorOptions,
+} from '../constant';
 import { useBuildFormSelectOptions } from '../form-hooks';
 import { IOperatorForm, ISwitchForm } from '../interface';
 import { getOtherFieldValues } from '../utils';
@@ -28,6 +34,20 @@ const SwitchForm = ({ onValuesChange, node, form }: IOperatorForm) => {
     return conditions?.filter((x) => !!x).map((x) => x?.to) ?? [];
   };
 
+  const switchOperatorOptions = useMemo(() => {
+    return SwitchOperatorOptions.map((x) => ({
+      value: x.value,
+      label: t(`flow.switchOperatorOptions.${x.label}`),
+    }));
+  }, [t]);
+
+  const switchLogicOperatorOptions = useMemo(() => {
+    return SwitchLogicOperatorOptions.map((x) => ({
+      value: x,
+      label: t(`flow.switchLogicOperatorOptions.${x}`),
+    }));
+  }, [t]);
+
   return (
     <Form
       labelCol={{ span: 8 }}
@@ -60,13 +80,19 @@ const SwitchForm = ({ onValuesChange, node, form }: IOperatorForm) => {
                   />
                 }
               >
-                <Form.Item
-                  label={t('flow.logicalOperator')}
-                  name={[field.name, 'logical_operator']}
-                >
-                  <Input />
+                <Form.Item noStyle dependencies={[field.name, 'items']}>
+                  {({ getFieldValue }) =>
+                    getFieldValue(['conditions', field.name, 'items'])?.length >
+                      1 && (
+                      <Form.Item
+                        label={t('flow.logicalOperator')}
+                        name={[field.name, 'logical_operator']}
+                      >
+                        <Select options={switchLogicOperatorOptions} />
+                      </Form.Item>
+                    )
+                  }
                 </Form.Item>
-
                 <Form.Item label={t('flow.to')} name={[field.name, 'to']}>
                   <Select
                     allowClear
@@ -113,7 +139,10 @@ const SwitchForm = ({ onValuesChange, node, form }: IOperatorForm) => {
                               labelCol={subLabelCol}
                               wrapperCol={subWrapperCol}
                             >
-                              <Input placeholder="operator" />
+                              <Select
+                                placeholder="operator"
+                                options={switchOperatorOptions}
+                              />
                             </Form.Item>
                             <Form.Item
                               label={'value'}