improve variable types

2025-06-07 21:19:51 +00:00 · 2025-05-20 11:01:04 +08:00 · 2025-05-20 11:01:04 +08:00 · 6353f0139b
commit 6353f0139b
parent 1e67e9333e
3 changed files with 160 additions and 26 deletions
--- a/ui/src/components/workflow/node/ConditionNode.tsx
+++ b/ui/src/components/workflow/node/ConditionNode.tsx
@ -5,7 +5,7 @@ import { Button, Card, Popover } from "antd";
 import SharedNode, { type SharedNodeProps } from "./_SharedNode";
 import AddNode from "./AddNode";
 import ConditionNodeConfigForm, { ConditionItem, ConditionNodeConfigFormFieldValues, ConditionNodeConfigFormInstance } from "./ConditionNodeConfigForm";
-import { Expr, WorkflowNodeConfigForCondition } from "@/domain/workflow";
+import { Expr, WorkflowNodeConfigForCondition, WorkflowNodeIoValueType } from "@/domain/workflow";
 import { produce } from "immer";
 import { useWorkflowStore } from "@/stores/workflow";
 import { useZustandShallowSelector } from "@/hooks";
@ -29,7 +29,15 @@ const ConditionNode = ({ node, disabled, branchId, branchIndex }: ConditionNodeP
  const formToExpression = (values: ConditionNodeConfigFormFieldValues): Expr => {
    // 创建单个条件的表达式
    const createComparisonExpr = (condition: ConditionItem): Expr => {
-      const left: Expr = { type: "var", selector: condition.leftSelector };
+      const selectors = condition.leftSelector.split("#");
+      const left: Expr = {
+        type: "var",
+        selector: {
+          id: selectors[0],
+          name: selectors[1],
+          type: selectors[2] as WorkflowNodeIoValueType,
+        },
+      };
      const right: Expr = { type: "const", value: condition.rightValue || "" };

      return {
--- a/ui/src/components/workflow/node/ConditionNodeConfigForm.tsx
+++ b/ui/src/components/workflow/node/ConditionNodeConfigForm.tsx
@ -1,5 +1,5 @@
 import { forwardRef, memo, useEffect, useImperativeHandle, useState } from "react";
-import { Button, Card, Form, Input, Select, Space, Radio } from "antd";
+import { Button, Card, Form, Input, Select, Space, Radio, DatePicker } from "antd";
 import { PlusOutlined, DeleteOutlined } from "@ant-design/icons";

 import {
@ -12,6 +12,7 @@ import {
  isVarExpr,
  WorkflowNode,
  workflowNodeIOOptions,
+  WorkflowNodeIoValueType,
 } from "@/domain/workflow";
 import { FormInstance } from "antd";
 import { useZustandShallowSelector } from "@/hooks";
@ -19,7 +20,7 @@ import { useWorkflowStore } from "@/stores/workflow";

 // 表单内部使用的扁平结构 - 修改后只保留必要字段
 export interface ConditionItem {
-  leftSelector: WorkflowNodeIOValueSelector;
+  leftSelector: string;
  operator: ComparisonOperator;
  rightValue: string;
 }
@ -50,7 +51,7 @@ const initFormModel = (): ConditionNodeConfigFormFieldValues => {
  return {
    conditions: [
      {
-        leftSelector: undefined as unknown as WorkflowNodeIOValueSelector,
+        leftSelector: "",
        operator: "==",
        rightValue: "",
      },
@ -71,7 +72,7 @@ const expressionToForm = (expr?: Expr): ConditionNodeConfigFormFieldValues => {
      // 确保左侧是变量，右侧是常量
      if (isVarExpr(expr.left) && isConstExpr(expr.right)) {
        conditions.push({
-          leftSelector: expr.left.selector,
+          leftSelector: `${expr.left.selector.id}#${expr.left.selector.name}#${expr.left.selector.type}`,
          operator: expr.op,
          rightValue: String(expr.right.value),
        });
@ -91,6 +92,38 @@ const expressionToForm = (expr?: Expr): ConditionNodeConfigFormFieldValues => {
  };
 };

+// 根据变量类型获取适当的操作符选项
+const getOperatorsByType = (type: string): { value: ComparisonOperator; label: string }[] => {
+  switch (type) {
+    case "number":
+    case "string":
+      return [
+        { value: "==", label: "等于 (==)" },
+        { value: "!=", label: "不等于 (!=)" },
+        { value: ">", label: "大于 (>)" },
+        { value: ">=", label: "大于等于 (>=)" },
+        { value: "<", label: "小于 (<)" },
+        { value: "<=", label: "小于等于 (<=)" },
+      ];
+    case "boolean":
+      return [{ value: "is", label: "为" }];
+    default:
+      return [];
+  }
+};
+
+// 从选择器字符串中提取变量类型
+const getVariableTypeFromSelector = (selector: string): string => {
+  if (!selector) return "string";
+
+  // 假设选择器格式为 "id#name#type"
+  const parts = selector.split("#");
+  if (parts.length >= 3) {
+    return parts[2].toLowerCase() || "string";
+  }
+  return "string";
+};
+
 const ConditionNodeConfigForm = forwardRef<ConditionNodeConfigFormInstance, ConditionNodeConfigFormProps>(
  ({ className, style, disabled, initialValues, onValuesChange, nodeId }, ref) => {
    const { getWorkflowOuptutBeforeId } = useWorkflowStore(useZustandShallowSelector(["updateNode", "getWorkflowOuptutBeforeId"]));
@ -127,6 +160,12 @@ const ConditionNodeConfigForm = forwardRef<ConditionNodeConfigFormInstance, Cond
    // 表单值变更处理
    const handleFormChange = (_: undefined, values: ConditionNodeConfigFormFieldValues) => {
      setFormModel(values);
+
+      if (onValuesChange) {
+        // 将表单值转换为表达式
+        const expression = formToExpression(values);
+        onValuesChange({ expression });
+      }
    };

    return (
@ -141,7 +180,6 @@ const ConditionNodeConfigForm = forwardRef<ConditionNodeConfigFormInstance, Cond
                  className="mb-3"
                  extra={fields.length > 1 ? <Button icon={<DeleteOutlined />} danger type="text" onClick={() => remove(name)} /> : null}
                >
-                  {/* 将三个表单项放在一行 */}
                  <div className="flex items-center gap-2">
                    {/* 左侧变量选择器 */}
                    <Form.Item {...restField} name={[name, "leftSelector"]} className="mb-0 flex-1" rules={[{ required: true, message: "请选择变量" }]}>
@ -150,24 +188,57 @@ const ConditionNodeConfigForm = forwardRef<ConditionNodeConfigFormInstance, Cond
                        options={previousNodes.map((item) => {
                          return workflowNodeIOOptions(item);
                        })}
-                      ></Select>
+                      />
                    </Form.Item>

-                    {/* 操作符 */}
-                    <Form.Item {...restField} name={[name, "operator"]} className="mb-0 w-32" rules={[{ required: true, message: "请选择" }]}>
-                      <Select>
-                        <Select.Option value="==">等于 (==)</Select.Option>
-                        <Select.Option value="!=">不等于 (!=)</Select.Option>
-                        <Select.Option value=">">大于 (&gt;)</Select.Option>
-                        <Select.Option value=">=">大于等于 (&gt;=)</Select.Option>
-                        <Select.Option value="<">小于 (&lt;)</Select.Option>
-                        <Select.Option value="<=">小于等于 (&lt;=)</Select.Option>
-                      </Select>
+                    {/* 操作符 - 动态根据变量类型改变选项 */}
+                    <Form.Item
+                      noStyle
+                      shouldUpdate={(prevValues, currentValues) => {
+                        return prevValues.conditions?.[name]?.leftSelector !== currentValues.conditions?.[name]?.leftSelector;
+                      }}
+                    >
+                      {({ getFieldValue }) => {
+                        const leftSelector = getFieldValue(["conditions", name, "leftSelector"]);
+                        const varType = getVariableTypeFromSelector(leftSelector);
+                        const operators = getOperatorsByType(varType);
+
+                        return (
+                          <Form.Item {...restField} name={[name, "operator"]} className="mb-0 w-32" rules={[{ required: true, message: "请选择" }]}>
+                            <Select options={operators} />
+                          </Form.Item>
+                        );
+                      }}
                    </Form.Item>

-                    {/* 右侧常量输入框 */}
-                    <Form.Item {...restField} name={[name, "rightValue"]} className="mb-0 flex-1" rules={[{ required: true, message: "请输入值" }]}>
-                      <Input placeholder="输入值" />
+                    {/* 右侧输入控件 - 根据变量类型使用不同的控件 */}
+                    <Form.Item
+                      noStyle
+                      shouldUpdate={(prevValues, currentValues) => {
+                        return prevValues.conditions?.[name]?.leftSelector !== currentValues.conditions?.[name]?.leftSelector;
+                      }}
+                    >
+                      {({ getFieldValue }) => {
+                        const leftSelector = getFieldValue(["conditions", name, "leftSelector"]);
+                        const varType = getVariableTypeFromSelector(leftSelector);
+
+                        return (
+                          <Form.Item {...restField} name={[name, "rightValue"]} className="mb-0 flex-1" rules={[{ required: true, message: "请输入值" }]}>
+                            {varType === "boolean" ? (
+                              <Select placeholder="选择值">
+                                <Select.Option value="true">是</Select.Option>
+                                <Select.Option value="false">否</Select.Option>
+                              </Select>
+                            ) : varType === "number" ? (
+                              <Input type="number" placeholder="输入数值" />
+                            ) : varType === "date" ? (
+                              <DatePicker style={{ width: "100%" }} placeholder="选择日期" format="YYYY-MM-DD" />
+                            ) : (
+                              <Input placeholder="输入值" />
+                            )}
+                          </Form.Item>
+                        );
+                      }}
                    </Form.Item>
                  </div>
                </Card>
@ -179,7 +250,7 @@ const ConditionNodeConfigForm = forwardRef<ConditionNodeConfigFormInstance, Cond
                  type="dashed"
                  onClick={() =>
                    add({
-                      leftSelector: undefined as unknown as WorkflowNodeIOValueSelector,
+                      leftSelector: "",
                      operator: "==",
                      rightValue: "",
                    })
@ -207,5 +278,57 @@ const ConditionNodeConfigForm = forwardRef<ConditionNodeConfigFormInstance, Cond
  }
 );

+// 表单值转换为表达式结构 (需要添加)
+const formToExpression = (values: ConditionNodeConfigFormFieldValues): Expr => {
+  const createComparisonExpr = (condition: ConditionItem): Expr => {
+    const [id, name, typeStr] = condition.leftSelector.split("#");
+
+    const type = typeStr as WorkflowNodeIoValueType;
+
+    const left: Expr = {
+      type: "var",
+      selector: { id, name, type },
+    };
+
+    let rightValue: any = condition.rightValue;
+    if (type === "number") {
+      rightValue = Number(condition.rightValue);
+    } else if (type === "boolean") {
+      rightValue = condition.rightValue === "true";
+    }
+
+    const right: Expr = {
+      type: "const",
+      value: rightValue,
+    };
+
+    return {
+      type: "compare",
+      op: condition.operator,
+      left,
+      right,
+    };
+  };
+
+  // 如果只有一个条件，直接返回比较表达式
+  if (values.conditions.length === 1) {
+    return createComparisonExpr(values.conditions[0]);
+  }
+
+  // 多个条件，通过逻辑运算符连接
+  let expr: Expr = createComparisonExpr(values.conditions[0]);
+
+  for (let i = 1; i < values.conditions.length; i++) {
+    expr = {
+      type: "logical",
+      op: values.logicalOperator,
+      left: expr,
+      right: createComparisonExpr(values.conditions[i]),
+    };
+  }
+
+  return expr;
+};
+
 export default memo(ConditionNodeConfigForm);

--- a/ui/src/domain/workflow.ts
+++ b/ui/src/domain/workflow.ts
@ -185,8 +185,11 @@ export type WorkflowNodeIO = {
 export type WorkflowNodeIOValueSelector = {
  id: string;
  name: string;
+  type: WorkflowNodeIoValueType;
 };

+export type WorkflowNodeIoValueType = "string" | "number" | "boolean";
+
 type WorkflowNodeIOOptions = {
  label: string;
  value: string;
@ -204,18 +207,18 @@ export const workflowNodeIOOptions = (node: WorkflowNode) => {
        case "certificate":
          rs.options.push({
            label: `${node.name} - ${output.label} - 是否有效`,
-            value: `${node.id}#${output.name}.validated`,
+            value: `${node.id}#${output.name}.validated#boolean`,
          });

          rs.options.push({
            label: `${node.name} - ${output.label} - 剩余天数`,
-            value: `${node.id}#${output.name}.daysLeft`,
+            value: `${node.id}#${output.name}.daysLeft#number`,
          });
          break;
        default:
          rs.options.push({
            label: `${node.name} - ${output.label}`,
-            value: `${node.id}#${output.name}`,
+            value: `${node.id}#${output.name}#${output.type}`,
          });
          break;
      }
@ -231,7 +234,7 @@ export const workflowNodeIOOptions = (node: WorkflowNode) => {

 type Value = string | number | boolean;

-export type ComparisonOperator = ">" | "<" | ">=" | "<=" | "==" | "!=";
+export type ComparisonOperator = ">" | "<" | ">=" | "<=" | "==" | "!=" | "is";

 export type LogicalOperator = "and" | "or" | "not";