@nocobase/plugin-workflow-manual 0.18.0-alpha.9 → 0.19.0-alpha.10

package/src/client/WorkflowTodo.tsx

@@ -31,7 +31,7 @@ import WorkflowPlugin, {
 import { DetailsBlockProvider } from './instruction/DetailsBlockProvider';
 import { FormBlockProvider } from './instruction/FormBlockProvider';
 import { ManualFormType, manualFormTypes } from './instruction/SchemaConfig';
-import { NAMESPACE } from '../locale';
+import { NAMESPACE, useLang } from '../locale';
 
 const nodeCollection = {
   title: `{{t("Task", { ns: "${NAMESPACE}" })}}`,
@@ -211,6 +211,15 @@ const UserColumn = observer(
   { displayName: 'UserColumn' },
 );
 
+function UserJobStatusColumn(props) {
+  const record = useRecord();
+  const labelUnprocessed = useLang('Unprocessed');
+  if (record.execution.status && !record.status) {
+    return <Tag>{labelUnprocessed}</Tag>;
+  }
+  return props.children;
+}
+
 export const WorkflowTodo: React.FC & { Drawer: React.FC; Decorator: React.FC } = () => {
   return (
     <SchemaComponent
@@ -218,6 +227,7 @@ export const WorkflowTodo: React.FC & { Drawer: React.FC; Decorator: React.FC }
         NodeColumn,
         WorkflowColumn,
         UserColumn,
+        UserJobStatusColumn,
       }}
       schema={{
         type: 'void',
@@ -265,11 +275,35 @@ export const WorkflowTodo: React.FC & { Drawer: React.FC; Decorator: React.FC }
               useProps: '{{ useTableBlockProps }}',
             },
             properties: {
+              actions: {
+                type: 'void',
+                'x-decorator': 'TableV2.Column.Decorator',
+                'x-component': 'TableV2.Column',
+                'x-component-props': {
+                  width: 60,
+                },
+                title: '{{t("Actions")}}',
+                properties: {
+                  view: {
+                    type: 'void',
+                    'x-component': 'Action.Link',
+                    title: '{{t("View")}}',
+                    properties: {
+                      drawer: {
+                        'x-component': 'WorkflowTodo.Drawer',
+                      },
+                    },
+                  },
+                },
+              },
               node: {
                 type: 'void',
                 'x-decorator': 'TableV2.Column.Decorator',
                 'x-component': 'TableV2.Column',
-                title: `{{t("Task", { ns: "${NAMESPACE}" })}}`,
+                'x-component-props': {
+                  width: null,
+                },
+                title: `{{t("Task node", { ns: "${NAMESPACE}" })}}`,
                 properties: {
                   node: {
                     'x-component': 'NodeColumn',
@@ -281,7 +315,10 @@ export const WorkflowTodo: React.FC & { Drawer: React.FC; Decorator: React.FC }
                 type: 'void',
                 'x-decorator': 'TableV2.Column.Decorator',
                 'x-component': 'TableV2.Column',
-                title: `{{t("Workflow", { ns: "${NAMESPACE}" })}}`,
+                'x-component-props': {
+                  width: null,
+                },
+                title: `{{t("Workflow", { ns: "workflow" })}}`,
                 properties: {
                   workflow: {
                     'x-component': 'WorkflowColumn',
@@ -289,13 +326,18 @@ export const WorkflowTodo: React.FC & { Drawer: React.FC; Decorator: React.FC }
                   },
                 },
               },
-              createdAt: {
+              status: {
                 type: 'void',
                 'x-decorator': 'TableV2.Column.Decorator',
                 'x-component': 'TableV2.Column',
+                'x-component-props': {
+                  width: 100,
+                },
+                title: `{{t("Status", { ns: "workflow" })}}`,
                 properties: {
-                  createdAt: {
-                    type: 'string',
+                  status: {
+                    type: 'number',
+                    'x-decorator': 'UserJobStatusColumn',
                     'x-component': 'CollectionField',
                     'x-read-pretty': true,
                   },
@@ -305,6 +347,9 @@ export const WorkflowTodo: React.FC & { Drawer: React.FC; Decorator: React.FC }
                 type: 'void',
                 'x-decorator': 'TableV2.Column.Decorator',
                 'x-component': 'TableV2.Column',
+                'x-component-props': {
+                  width: 140,
+                },
                 title: `{{t("Assignee", { ns: "${NAMESPACE}" })}}`,
                 properties: {
                   user: {
@@ -313,35 +358,21 @@ export const WorkflowTodo: React.FC & { Drawer: React.FC; Decorator: React.FC }
                   },
                 },
               },
-              status: {
+              createdAt: {
                 type: 'void',
                 'x-decorator': 'TableV2.Column.Decorator',
                 'x-component': 'TableV2.Column',
+                'x-component-props': {
+                  width: 160,
+                },
                 properties: {
-                  status: {
+                  createdAt: {
+                    type: 'string',
                     'x-component': 'CollectionField',
                     'x-read-pretty': true,
                   },
                 },
               },
-              actions: {
-                type: 'void',
-                'x-decorator': 'TableV2.Column.Decorator',
-                'x-component': 'TableV2.Column',
-                title: '{{t("Actions")}}',
-                properties: {
-                  view: {
-                    type: 'void',
-                    'x-component': 'Action.Link',
-                    title: '{{t("View")}}',
-                    properties: {
-                      drawer: {
-                        'x-component': 'WorkflowTodo.Drawer',
-                      },
-                    },
-                  },
-                },
-              },
             },
           },
         },
@@ -381,16 +412,16 @@ function ActionBarProvider(props) {
 const ManualActionStatusContext = createContext<number | null>(null);
 
 function ManualActionStatusProvider({ value, children }) {
-  const { userJob } = useFlowContext();
+  const { userJob, execution } = useFlowContext();
   const button = useField();
   const buttonSchema = useFieldSchema();
 
   useEffect(() => {
-    if (userJob.status) {
+    if (execution.status || userJob.status) {
       button.disabled = true;
       button.visible = userJob.status === value && userJob.result._ === buttonSchema.name;
     }
-  }, [userJob, value, button, buttonSchema.name]);
+  }, [execution, userJob, value, button, buttonSchema.name]);
 
   return <ManualActionStatusContext.Provider value={value}>{children}</ManualActionStatusContext.Provider>;
 }
@@ -401,12 +432,12 @@ function useSubmit() {
   const { values, submit } = useForm();
   const buttonSchema = useFieldSchema();
   const { service } = useTableBlockContext();
-  const { userJob } = useFlowContext();
+  const { userJob, execution } = useFlowContext();
   const { name: actionKey } = buttonSchema;
   const { name: formKey } = buttonSchema.parent.parent;
   return {
     async run() {
-      if (userJob.status) {
+      if (execution.status || userJob.status) {
         return;
       }
       await submit();
@@ -437,7 +468,7 @@ function FlowContextProvider(props) {
       .resource('users_jobs')
       .get?.({
         filterByTk: id,
-        appends: ['node', 'workflow', 'workflow.nodes', 'execution', 'execution.jobs'],
+        appends: ['node', 'job', 'workflow', 'workflow.nodes', 'execution', 'execution.jobs'],
       })
       .then(({ data }) => {
         const { node, workflow: { nodes = [], ...workflow } = {}, execution, ...userJob } = data?.data ?? {};
@@ -498,18 +529,19 @@ function FlowContextProvider(props) {
 }
 
 function useFormBlockProps() {
-  const { userJob } = useFlowContext();
+  const { userJob, execution } = useFlowContext();
   const record = useRecord();
   const { data: user } = useCurrentUserContext();
   const { form } = useFormBlockContext();
 
-  const pattern = userJob.status
-    ? record
-      ? 'readPretty'
-      : 'disabled'
-    : user?.data?.id !== userJob.userId
-      ? 'disabled'
-      : 'editable';
+  const pattern =
+    execution.status || userJob.status
+      ? record
+        ? 'readPretty'
+        : 'disabled'
+      : user?.data?.id !== userJob.userId
+        ? 'disabled'
+        : 'editable';
 
   useEffect(() => {
     form?.setPattern(pattern);
@@ -594,7 +626,7 @@ function Decorator({ params = {}, children }) {
       pageSize: 20,
       sort: ['-createdAt'],
       ...params,
-      appends: ['user', 'node', 'workflow'],
+      appends: ['user', 'node', 'workflow', 'execution.status'],
       except: ['node.config', 'workflow.config', 'workflow.options'],
     },
     rowKey: 'id',