[Improvement][UI] Unified local parameters UI (#11190)

dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-custom-params.ts

@@ -33,120 +33,76 @@ export function useCustomParams({
 }): IJsonItem[] {
   const { t } = useI18n()
 
-  if (isSimple) {
+  return [
-    return [
+    {
-      {
+      type: 'custom-parameters',
-        type: 'custom-parameters',
+      field: field,
-        field: field,
+      name: t(`project.node.${name}`),
-        name: t(`project.node.${name}`),
+      class: 'btn-custom-parameters',
-        class: 'btn-custom-parameters',
+      span,
-        span,
+      children: [
-        children: [
+        {
-          {
+          type: 'input',
-            type: 'input',
+          field: 'prop',
-            field: 'prop',
+          span: 6,
-            span: 10,
+          class: 'input-param-key',
-            class: 'input-param-key',
+          props: {
-            props: {
+            placeholder: t('project.node.prop_tips'),
-              placeholder: t('project.node.prop_tips'),
+            maxLength: 256
-              maxLength: 256
-            },
-            validate: {
-              trigger: ['input', 'blur'],
-              required: true,
-              validator(validate: any, value: string) {
-                if (!value) {
-                  return new Error(t('project.node.prop_tips'))
-                }
-
-                const sameItems = model[field].filter(
-                  (item: { prop: string }) => item.prop === value
-                )
-
-                if (sameItems.length > 1) {
-                  return new Error(t('project.node.prop_repeat'))
-                }
-              }
-            }
           },
-          {
+          validate: {
-            type: 'input',
+            trigger: ['input', 'blur'],
-            field: 'value',
+            required: true,
-            span: 10,
+            validator(validate: any, value: string) {
-            class: 'input-param-value',
+              if (!value) {
-            props: {
+                return new Error(t('project.node.prop_tips'))
-              placeholder: t('project.node.value_tips'),
+              }
-              maxLength: 256
-            }
-          }
-        ]
-      }
-    ]
-  } else {
-    return [
-      {
-        type: 'custom-parameters',
-        field: field,
-        name: t(`project.node.${name}`),
-        class: 'btn-custom-parameters',
-        span,
-        children: [
-          {
-            type: 'input',
-            field: 'prop',
-            span: 6,
-            class: 'input-param-key',
-            props: {
-              placeholder: t('project.node.prop_tips'),
-              maxLength: 256
-            },
-            validate: {
-              trigger: ['input', 'blur'],
-              required: true,
-              validator(validate: any, value: string) {
-                if (!value) {
-                  return new Error(t('project.node.prop_tips'))
-                }
 
-                const sameItems = model[field].filter(
+              const sameItems = model[field].filter(
-                  (item: { prop: string }) => item.prop === value
+                (item: { prop: string }) => item.prop === value
-                )
+              )
 
-                if (sameItems.length > 1) {
+              if (sameItems.length > 1) {
-                  return new Error(t('project.node.prop_repeat'))
+                return new Error(t('project.node.prop_repeat'))
-                }
               }
             }
-          },
-          {
-            type: 'select',
-            field: 'direct',
-            span: 4,
-            options: DIRECT_LIST,
-            value: 'IN'
-          },
-          {
-            type: 'select',
-            field: 'type',
-            span: 6,
-            options: TYPE_LIST,
-            value: 'VARCHAR'
-          },
-          {
-            type: 'input',
-            field: 'value',
-            span: 6,
-            class: 'input-param-value',
-            props: {
-              placeholder: t('project.node.value_tips'),
-              maxLength: 256
-            }
           }
-        ]
+        },
-      }
+        {
-    ]
+          type: 'select',
-  }
+          field: 'direct',
+          span: 4,
+          options: DIRECT_LIST,
+          value: 'IN',
+          props: {
+            disabled: isSimple
+          }
+        },
+        {
+          type: 'select',
+          field: 'type',
+          span: 6,
+          options: TYPE_LIST,
+          value: 'VARCHAR',
+          props: {
+            disabled: isSimple
+          }
+        },
+        {
+          type: 'input',
+          field: 'value',
+          span: 6,
+          class: 'input-param-value',
+          props: {
+            placeholder: t('project.node.value_tips'),
+            maxLength: 256
+          }
+        }
+      ]
+    }
+  ]
 }
+
 export const TYPE_LIST = [
   {
     value: 'VARCHAR',