Add workflow execution process

ui/src/components/workflow/WorkflowBaseInfoEditDialog.tsx

@@ -8,7 +8,8 @@ import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "
 import { Input } from "../ui/input";
 import { Button } from "../ui/button";
 import { useTranslation } from "react-i18next";
-import { memo, useState } from "react";
+import { memo, useEffect, useState } from "react";
+import { Textarea } from "../ui/textarea";
 
 type WorkflowNameEditDialogProps = {
   trigger: React.ReactNode;
@@ -30,6 +31,10 @@ const WorkflowNameBaseInfoDialog = ({ trigger }: WorkflowNameEditDialogProps) =>
     resolver: zodResolver(formSchema),
   });
 
+  useEffect(() => {
+    form.reset({ name: workflow.name, description: workflow.description });
+  }, [workflow]);
+
   const { t } = useTranslation();
 
   const [open, setOpen] = useState(false);
@@ -71,6 +76,7 @@ const WorkflowNameBaseInfoDialog = ({ trigger }: WorkflowNameEditDialogProps) =>
                         <Input
                           placeholder="请输入流程名称"
                           {...field}
+                          value={field.value}
                           defaultValue={workflow.name}
                           onChange={(e) => {
                             form.setValue("name", e.target.value);
@@ -90,9 +96,10 @@ const WorkflowNameBaseInfoDialog = ({ trigger }: WorkflowNameEditDialogProps) =>
                     <FormItem>
                       <FormLabel>说明</FormLabel>
                       <FormControl>
-                        <Input
+                        <Textarea
                           placeholder="请输入流程说明"
                           {...field}
+                          value={field.value}
                           defaultValue={workflow.description}
                           onChange={(e) => {
                             form.setValue("description", e.target.value);

ui/src/domain/workflow.ts

@@ -155,6 +155,10 @@ export const newWorkflowNode = (type: WorkflowNodeType, options: NewWorkflowNode
     };
   }
 
+  if (type == WorkflowNodeType.Condition) {
+    rs.validated = true;
+  }
+
   if (type === WorkflowNodeType.Branch) {
     rs = {
       ...rs,
@@ -350,6 +354,20 @@ export const allNodesValidated = (node: WorkflowNode | WorkflowBranchNode): bool
   return true;
 };
 
+export const getExecuteMethod = (node: WorkflowNode): { type: string; crontab: string } => {
+  if (node.type === WorkflowNodeType.Start) {
+    return {
+      type: (node.config?.executionMethod as string) ?? "",
+      crontab: (node.config?.crontab as string) ?? "",
+    };
+  } else {
+    return {
+      type: "",
+      crontab: "",
+    };
+  }
+};
+
 export type WorkflowBranchNode = {
   id: string;
   name: string;
@@ -428,4 +446,3 @@ export const workflowNodeDropdownList: WorkflowwNodeDropdwonItem[] = [
     },
   },
 ];
-

ui/src/pages/workflow/WorkflowDetail.tsx

@@ -96,8 +96,8 @@ const WorkflowDetail = () => {
               <WorkflowBaseInfoEditDialog
                 trigger={
                   <div className="flex flex-col space-y-1 cursor-pointer items-start">
-                    <div className="">{workflow.name ? workflow.name : "未命名工作流"}</div>
-                    <div className="text-sm text-muted-foreground">{workflow.description ? workflow.description : "添加流程说明"}</div>
+                    <div className="truncate  max-w-[200px]">{workflow.name ? workflow.name : "未命名工作流"}</div>
+                    <div className="text-sm text-muted-foreground truncate  max-w-[200px]">{workflow.description ? workflow.description : "添加流程说明"}</div>
                   </div>
                 }
               />

ui/src/pages/workflow/index.tsx

@@ -43,7 +43,7 @@ const Workflow = () => {
         if (!name) {
           name = "未命名工作流";
         }
-        return <div className="flex items-center">{name}</div>;
+        return <div className="max-w-[150px] truncate">{name}</div>;
       },
     },
     {
@@ -54,7 +54,7 @@ const Workflow = () => {
         if (!description) {
           description = "-";
         }
-        return description;
+        return <div className="max-w-[200px] truncate">{description}</div>;
       },
     },
     {
@@ -211,4 +211,3 @@ const Workflow = () => {
 };
 
 export default Workflow;
-

ui/src/providers/workflow/index.ts

@@ -1,6 +1,7 @@
 import {
   addBranch,
   addNode,
+  getExecuteMethod,
   getWorkflowOutputBeforeId,
   initWorkflow,
   removeBranch,
@@ -76,11 +77,15 @@ export const useWorkflowStore = create<WorkflowState>((set, get) => ({
     });
   },
   switchEnable: async () => {
+    const root = get().workflow.draft as WorkflowNode;
+    const executeMethod = getExecuteMethod(root);
     const resp = await save({
       id: (get().workflow.id as string) ?? "",
-      content: get().workflow.draft as WorkflowNode,
+      content: root,
       enabled: !get().workflow.enabled,
       hasDraft: false,
+      type: executeMethod.type,
+      crontab: executeMethod.crontab,
     });
     set((state: WorkflowState) => {
       return {
@@ -90,15 +95,21 @@ export const useWorkflowStore = create<WorkflowState>((set, get) => ({
           content: resp.content,
           enabled: resp.enabled,
           hasDraft: false,
+          type: resp.type,
+          crontab: resp.crontab,
         },
       };
     });
   },
   save: async () => {
+    const root = get().workflow.draft as WorkflowNode;
+    const executeMethod = getExecuteMethod(root);
     const resp = await save({
       id: (get().workflow.id as string) ?? "",
-      content: get().workflow.draft as WorkflowNode,
+      content: root,
       hasDraft: false,
+      type: executeMethod.type,
+      crontab: executeMethod.crontab,
     });
     set((state: WorkflowState) => {
       return {
@@ -107,6 +118,8 @@ export const useWorkflowStore = create<WorkflowState>((set, get) => ({
           id: resp.id,
           content: resp.content,
           hasDraft: false,
+          type: resp.type,
+          crontab: resp.crontab,
         },
       };
     });
@@ -205,4 +218,3 @@ export const useWorkflowStore = create<WorkflowState>((set, get) => ({
     return getWorkflowOutputBeforeId(get().workflow.draft as WorkflowNode, id, type);
   },
 }));
-