refactor(plugin-workflow): change tasks api

2025-05-05 05:29:26 +08:00 · 2025-04-09 22:21:26 +08:00 · 2025-04-09 22:21:26 +08:00 · e7ca77a171
commit e7ca77a171
parent 3c5ff51472
5 changed files with 104 additions and 74 deletions
--- a/packages/core/client/src/schema-component/antd/list/index.ts
+++ b/packages/core/client/src/schema-component/antd/list/index.ts
@ -8,3 +8,4 @@
 */

 export * from './List';
+export { useListBlockContext } from './List.Decorator';
--- a/packages/plugins/@nocobase/plugin-workflow-manual/src/client/WorkflowTodo.tsx
+++ b/packages/plugins/@nocobase/plugin-workflow-manual/src/client/WorkflowTodo.tsx
@ -33,9 +33,12 @@ import {
  useActionContext,
  useCurrentUserContext,
  useFormBlockContext,
-  useTableBlockContext,
+  useListBlockContext,
  List,
  OpenModeProvider,
+  ActionContextProvider,
+  useRequest,
+  CollectionRecordProvider,
 } from '@nocobase/client';
 import WorkflowPlugin, {
  DetailsBlockProvider,
@ -46,12 +49,14 @@ import WorkflowPlugin, {
  EXECUTION_STATUS,
  JOB_STATUS,
  WorkflowTitle,
+  TASK_STATUS,
 } from '@nocobase/plugin-workflow/client';

 import { NAMESPACE, useLang } from '../locale';
 import { FormBlockProvider } from './instruction/FormBlockProvider';
 import { ManualFormType, manualFormTypes } from './instruction/SchemaConfig';
 import { TaskStatusOptionsMap } from '../common/constants';
+import { useNavigate, useParams } from 'react-router-dom';

 function TaskStatusColumn(props) {
  const recordData = useCollectionRecordData();
@ -291,11 +296,12 @@ function useSubmit() {
  const { values, submit } = useForm();
  const field = useField();
  const buttonSchema = useFieldSchema();
-  const { service } = useTableBlockContext();
+  const { service } = useListBlockContext();
  const { userJob, execution } = useFlowContext();
  const { name: actionKey } = buttonSchema;
  const { name: formKey } = buttonSchema.parent.parent;
  const { assignedValues = {} } = buttonSchema?.['x-action-settings'] ?? {};
+
  return {
    async run() {
      if (execution.status || userJob.status) {
@ -611,57 +617,35 @@ function ContentDetailWithTitle(props) {

 function TaskItem() {
  const token = useAntdToken();
-  const [visible, setVisible] = useState(false);
  const record = useCollectionRecordData();
-  const { t } = useTranslation();
-  // const { defaultOpenMode } = useOpenModeContext();
-  // const { openPopup } = usePopupUtils();
-  // const { isPopupVisibleControlledByURL } = usePopupSettings();
-  const onOpen = useCallback((e: React.MouseEvent) => {
-    const targetElement = e.target as Element; // 将事件目标转换为Element类型
-    const currentTargetElement = e.currentTarget as Element;
-    if (currentTargetElement.contains(targetElement)) {
-      setVisible(true);
-      // if (!isPopupVisibleControlledByURL()) {
-      // } else {
-      //   openPopup({
-      //     // popupUidUsedInURL: 'job',
-      //     customActionSchema: {
-      //       type: 'void',
-      //       'x-uid': 'job-view',
-      //       'x-action-context': {
-      //         dataSource: 'main',
-      //         collection: 'workflowManualTasks',
-      //         doNotUpdateContext: true,
-      //       },
-      //       properties: {},
-      //     },
-      //   });
-      // }
-    }
-    e.stopPropagation();
-  }, []);
+  const navigate = useNavigate();
+  const onOpen = useCallback(
+    (e: React.MouseEvent) => {
+      const targetElement = e.target as Element; // 将事件目标转换为Element类型
+      const currentTargetElement = e.currentTarget as Element;
+      if (currentTargetElement.contains(targetElement)) {
+        navigate(`./${record.id}`);
+      }
+      e.stopPropagation();
+    },
+    [navigate, record.id],
+  );

  return (
-    <>
-      <Card
-        onClick={onOpen}
-        hoverable
-        size="small"
-        title={record.title}
-        extra={<WorkflowTitle {...record.workflow} />}
-        className={css`
-          .ant-card-extra {
-            color: ${token.colorTextDescription};
-          }
-        `}
-      >
-        <ContentDetail />
-      </Card>
-      <PopupContextProvider visible={visible} setVisible={setVisible} openMode="modal">
-        <Drawer />
-      </PopupContextProvider>
-    </>
+    <Card
+      onClick={onOpen}
+      hoverable
+      size="small"
+      title={record.title}
+      extra={<WorkflowTitle {...record.workflow} />}
+      className={css`
+        .ant-card-extra {
+          color: ${token.colorTextDescription};
+        }
+      `}
+    >
+      <ContentDetail />
+    </Card>
  );
 }

@ -734,7 +718,9 @@ function TodoExtraActions() {
 export const manualTodo = {
  title: `{{t("My manual tasks", { ns: "${NAMESPACE}" })}}`,
  collection: 'workflowManualTasks',
+  action: 'listMine',
  useActionParams: useTodoActionParams,
-  component: TaskItem,
-  extraActions: TodoExtraActions,
+  Actions: TodoExtraActions,
+  Item: TaskItem,
+  Detail: Drawer,
 };
--- a/packages/plugins/@nocobase/plugin-workflow-manual/src/server/actions.ts
+++ b/packages/plugins/@nocobase/plugin-workflow-manual/src/server/actions.ts
@ -7,7 +7,7 @@
 * For more information, please refer to: https://www.nocobase.com/agreement.
 */

-import { Context, utils } from '@nocobase/actions';
+import actions, { Context, utils } from '@nocobase/actions';
 import WorkflowPlugin, { EXECUTION_STATUS, JOB_STATUS } from '@nocobase/plugin-workflow';

 import ManualInstruction from './ManualInstruction';
@ -111,3 +111,24 @@ export async function submit(context: Context, next) {

  plugin.resume(task.job);
 }
+
+export async function listMine(context, next) {
+  context.action.mergeParams({
+    filter: {
+      userId: context.state.currentUser.id,
+      $or: [
+        {
+          'workflow.enabled': true,
+        },
+        {
+          'workflow.enabled': false,
+          status: {
+            $ne: JOB_STATUS.PENDING,
+          },
+        },
+      ],
+    },
+  });
+
+  return actions.list(context, next);
+}
--- a/packages/plugins/@nocobase/plugin-workflow/src/client/WorkflowTasks.tsx
+++ b/packages/plugins/@nocobase/plugin-workflow/src/client/WorkflowTasks.tsx
@ -14,6 +14,8 @@ import React, { createContext, useCallback, useContext, useEffect, useMemo, useS
 import { Link, Outlet, useNavigate, useParams } from 'react-router-dom';

 import {
+  ActionContextProvider,
+  CollectionRecordProvider,
  css,
  PinnedPluginListProvider,
  SchemaComponent,
@ -58,9 +60,11 @@ const contentClass = css`
 export interface TaskTypeOptions {
  title: string;
  collection: string;
+  action: string;
  useActionParams: Function;
-  component: React.ComponentType;
-  extraActions?: React.ComponentType;
+  Actions?: React.ComponentType;
+  Item: React.ComponentType;
+  Detail: React.ComponentType;
  // children?: TaskTypeOptions[];
 }

@ -79,7 +83,7 @@ function MenuLink({ type }: any) {

  return (
    <Link
-      to={`/admin/workflow/tasks/${type}`}
+      to={`/admin/workflow/tasks/${type}/${TASK_STATUS.PENDING}`}
      className={css`
        display: flex;
        align-items: center;
@ -99,7 +103,7 @@ function MenuLink({ type }: any) {
  );
 }

-const TASK_STATUS = {
+export const TASK_STATUS = {
  ALL: 'all',
  PENDING: 'pending',
  COMPLETED: 'completed',
@ -109,7 +113,7 @@ function StatusTabs() {
  const navigate = useNavigate();
  const { taskType, status = TASK_STATUS.PENDING } = useParams();
  const type = useCurrentTaskType();
-  const { extraActions: ExtraActions } = type;
+  const { Actions } = type;
  return (
    <Tabs
      activeKey={status}
@ -136,9 +140,9 @@ function StatusTabs() {
        },
      ]}
      tabBarExtraContent={
-        ExtraActions
+        Actions
          ? {
-              right: <ExtraActions />,
+              right: <Actions />,
            }
          : {}
      }
@ -171,18 +175,36 @@ function useCurrentTaskType() {
  );
 }

+function PopupContext(props: any) {
+  const { popupId } = useParams();
+  const navigate = useNavigate();
+  return (
+    <ActionContextProvider
+      visible={Boolean(popupId)}
+      setVisible={(visible) => {
+        if (!visible) {
+          navigate(-1);
+        }
+      }}
+      openMode="modal"
+    >
+      <CollectionRecordProvider record={{ id: popupId }}>{props.children}</CollectionRecordProvider>
+    </ActionContextProvider>
+  );
+}
+
 export function WorkflowTasks() {
  const compile = useCompile();
  const { setTitle } = useDocumentTitle();
  const navigate = useNavigate();
-  const { taskType, status = TASK_STATUS.PENDING } = useParams();
+  const { taskType, status = TASK_STATUS.PENDING, popupId } = useParams();
  const {
    token: { colorBgContainer },
  } = useToken();

  const items = useTaskTypeItems();

-  const { title, collection, useActionParams, component: Component } = useCurrentTaskType();
+  const { title, collection, action = 'list', useActionParams, Item, Detail } = useCurrentTaskType();

  const params = useActionParams(status);

@ -234,7 +256,7 @@ export function WorkflowTasks() {
              'x-decorator': 'List.Decorator',
              'x-decorator-props': {
                collection,
-                action: 'list',
+                action,
                params: {
                  pageSize: 20,
                  sort: ['-createdAt'],
@ -284,17 +306,21 @@ export function WorkflowTasks() {
                        item: {
                          type: 'object',
                          'x-decorator': 'List.Item',
-                          'x-component': Component,
+                          'x-component': Item,
                          'x-read-pretty': true,
                        },
                      },
                    },
                  },
                },
+                popup: {
+                  type: 'void',
+                  'x-decorator': PopupContext,
+                  'x-component': Detail,
+                },
              },
            }}
          />
-          <Outlet />
        </SchemaComponentContext.Provider>
      </Layout>
    </Layout>
@ -309,7 +335,7 @@ function WorkflowTasksLink() {
  return types.length ? (
    <Tooltip title={lang('Workflow todos')}>
      <Button>
-        <Link to={`/admin/workflow/tasks/${types[0]}`} onClick={reload}>
+        <Link to={`/admin/workflow/tasks/${types[0]}/${TASK_STATUS.PENDING}`} onClick={reload}>
          <Badge count={total} size="small">
            <CheckCircleOutlined />
          </Badge>
@ -370,7 +396,7 @@ function TasksCountsProvider(props: any) {
  return <TasksCountsContext.Provider value={{ reload, total, counts }}>{props.children}</TasksCountsContext.Provider>;
 }

-export const TasksProvider = (props: any) => {
+export function TasksProvider(props: any) {
  const isLoggedIn = useIsLoggedIn();

  const content = (
@ -390,4 +416,4 @@ export const TasksProvider = (props: any) => {
  );

  return isLoggedIn ? <TasksCountsProvider>{content}</TasksCountsProvider> : content;
-};
+}
--- a/packages/plugins/@nocobase/plugin-workflow/src/client/index.tsx
+++ b/packages/plugins/@nocobase/plugin-workflow/src/client/index.tsx
@ -120,15 +120,10 @@ export default class PluginWorkflowClient extends Plugin {
    });

    this.router.add('admin.workflow.tasks', {
-      path: '/admin/workflow/tasks/:taskType/:status?',
+      path: '/admin/workflow/tasks/:taskType/:status/:popupId?',
      Component: WorkflowTasks,
    });

-    this.router.add('admin.workflow.tasks.popup', {
-      path: '/admin/workflow/tasks/:taskType/:status/popups/*',
-      Component: PagePopups,
-    });
-
    this.app.pluginSettingsManager.add(NAMESPACE, {
      icon: 'PartitionOutlined',
      title: `{{t("Workflow", { ns: "${NAMESPACE}" })}}`,
@ -193,3 +188,4 @@ export { default as useStyles } from './style';
 export { Trigger, useTrigger } from './triggers';
 export * from './utils';
 export * from './variable';
+export { TASK_STATUS } from './WorkflowTasks';