@nocobase/client-v2 2.1.0-beta.25 → 2.1.0-beta.27

package/src/flow/models/actions/AssociateActionModel.tsx

@@ -0,0 +1,196 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import { FlowModel, FlowModelRenderer, tExpr, useFlowViewContext } from '@nocobase/flow-engine';
+import { useRequest } from 'ahooks';
+import { Button } from 'antd';
+import type { ButtonProps } from 'antd';
+import React from 'react';
+import { SkeletonFallback } from '../../components/SkeletonFallback';
+import { ActionModel, ActionSceneEnum } from '../base';
+import {
+  applyAssociateAction,
+  getAssociationTargetResourceSettings,
+  isAssociationBlockContext,
+} from './AssociationActionUtils';
+
+function AssociateSelectorGridRenderer({ options }: { options: any }) {
+  const ctx = useFlowViewContext();
+  const { data, loading } = useRequest(
+    async () => {
+      return await ctx.engine.loadOrCreateModel(options, {
+        delegateToParent: false,
+        delegate: ctx,
+        skipSave: !ctx.flowSettingsEnabled,
+      });
+    },
+    {
+      refreshDeps: [ctx, options],
+    },
+  );
+
+  if (loading || !data?.uid) {
+    return <SkeletonFallback style={{ margin: 16 }} />;
+  }
+  return <FlowModelRenderer model={data as FlowModel} fallback={<SkeletonFallback style={{ margin: 16 }} />} />;
+}
+
+function AssociateSelectorContent({ model }: { model: AssociateActionModel }) {
+  const ctx = useFlowViewContext();
+  const { Header, Footer, type } = ctx.view;
+  return (
+    <div>
+      <Header
+        title={
+          type === 'dialog' ? (
+            <div
+              style={{
+                padding: `${ctx.themeToken.paddingLG}px ${ctx.themeToken.paddingLG}px 0`,
+                marginBottom: -ctx.themeToken.marginSM,
+                backgroundColor: 'var(--colorBgLayout)',
+              }}
+            >
+              {ctx.t('Select record')}
+            </div>
+          ) : (
+            ctx.t('Select record')
+          )
+        }
+      />
+      <AssociateSelectorGridRenderer
+        options={{
+          parentId: ctx.view.inputArgs.parentId,
+          subKey: 'associate-selector-grid',
+          async: true,
+          delegateToParent: false,
+          subType: 'object',
+          use: 'BlockGridModel',
+        }}
+      />
+      <Footer>
+        {type === 'dialog' ? (
+          <div style={{ padding: `0 ${ctx.themeToken.paddingLG}px ${ctx.themeToken.paddingLG}px` }}>
+            <Button
+              type="primary"
+              onClick={async () => {
+                await model.associateSelectedRows();
+                ctx.view.close();
+              }}
+            >
+              {ctx.t('Submit')}
+            </Button>
+          </div>
+        ) : (
+          <Button
+            type="primary"
+            onClick={async () => {
+              await model.associateSelectedRows();
+              ctx.view.close();
+            }}
+          >
+            {ctx.t('Submit')}
+          </Button>
+        )}
+      </Footer>
+    </div>
+  );
+}
+
+export class AssociateActionModel extends ActionModel {
+  static scene = ActionSceneEnum.collection;
+  static capabilityActionName = 'update';
+
+  defaultPopupTitle = tExpr('Select record');
+  selectedRows: any[] = [];
+
+  defaultProps: ButtonProps = {
+    title: tExpr('Associate'),
+    icon: 'LinkOutlined',
+  };
+
+  getAclActionName() {
+    return 'update';
+  }
+
+  async associateSelectedRows() {
+    await applyAssociateAction(this.context, this.selectedRows);
+    this.selectedRows = [];
+  }
+}
+
+AssociateActionModel.define({
+  label: tExpr('Associate'),
+  sort: 15,
+  hide(ctx) {
+    return !isAssociationBlockContext(ctx);
+  },
+});
+
+AssociateActionModel.registerFlow({
+  key: 'associateSettings',
+  title: tExpr('Associate settings'),
+  on: 'click',
+  steps: {
+    openSelector: {
+      async handler(ctx, params) {
+        const blockModel = ctx.blockModel;
+        const targetResourceSettings = getAssociationTargetResourceSettings(ctx);
+        const openMode = ctx.inputArgs?.isMobileLayout ? 'embed' : ctx.inputArgs?.mode || params?.mode || 'drawer';
+        const size = ctx.inputArgs?.size || params?.size || 'medium';
+        const sizeToWidthMap: Record<string, Record<string, string | undefined>> = {
+          drawer: {
+            small: '30%',
+            medium: '50%',
+            large: '70%',
+          },
+          dialog: {
+            small: '40%',
+            medium: '50%',
+            large: '80%',
+          },
+          embed: {},
+        };
+
+        ctx.model.selectedRows = [];
+        await ctx.viewer.open({
+          type: openMode,
+          width: sizeToWidthMap[openMode][size],
+          inheritContext: false,
+          target: ctx.layoutContentElement,
+          inputArgs: {
+            parentId: ctx.model.uid,
+            scene: 'select',
+            dataSourceKey: targetResourceSettings.dataSourceKey,
+            collectionName: targetResourceSettings.collectionName,
+            rowSelectionProps: {
+              type: 'checkbox',
+              defaultSelectedRows: () => blockModel?.resource?.getData?.() || [],
+              renderCell: undefined,
+              selectedRowKeys: undefined,
+              onChange: (_, selectedRows) => {
+                ctx.model.selectedRows = selectedRows || [];
+              },
+            },
+          },
+          content: () => <AssociateSelectorContent model={ctx.model as AssociateActionModel} />,
+          styles: {
+            content: {
+              padding: 0,
+              backgroundColor: ctx.model.flowEngine.context.themeToken.colorBgLayout,
+              ...(openMode === 'embed' ? { position: 'absolute', top: 0, left: 0, right: 0, bottom: 0 } : {}),
+            },
+            body: {
+              padding: 0,
+            },
+          },
+        });
+      },
+    },
+  },
+});

package/src/flow/models/actions/AssociationActionUtils.ts

@@ -0,0 +1,90 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import type { FlowModelContext } from '@nocobase/flow-engine';
+
+export const getAssociationBlockResourceSettings = (ctx: FlowModelContext | any) => {
+  const blockModel = ctx?.blockModel || ctx?.model?.context?.blockModel;
+  return (
+    blockModel?.getResourceSettingsInitParams?.() ||
+    blockModel?.getStepParams?.('resourceSettings', 'init') ||
+    ctx?.model?.getStepParams?.('resourceSettings', 'init')
+  );
+};
+
+export const isAssociationBlockContext = (ctx: FlowModelContext | any) => {
+  return !!getAssociationBlockResourceSettings(ctx)?.associationName;
+};
+
+export const getAssociationTargetResourceSettings = (ctx: FlowModelContext | any) => {
+  const resourceSettings = getAssociationBlockResourceSettings(ctx);
+  const association = ctx?.blockModel?.association || ctx?.model?.context?.blockModel?.association;
+  const targetCollection = association?.targetCollection;
+
+  return {
+    dataSourceKey: targetCollection?.dataSourceKey || resourceSettings?.dataSourceKey,
+    collectionName: targetCollection?.name || association?.target || resourceSettings?.collectionName,
+  };
+};
+
+const callAssociationResourceAction = async (resource: any, action: 'add' | 'remove', values: any[]) => {
+  if (typeof resource?.[action] === 'function') {
+    return await resource[action]({ values });
+  }
+
+  return await resource?.runAction?.(action, {
+    data: values,
+  });
+};
+
+export const applyDisassociateAction = async (ctx: FlowModelContext | any) => {
+  const resource = ctx?.blockModel?.resource || ctx?.resource;
+  const collection = ctx?.blockModel?.collection || ctx?.collection;
+
+  if (!isAssociationBlockContext(ctx)) {
+    ctx.message?.error?.(ctx.t('No association block selected'));
+    return;
+  }
+  if (!resource) {
+    ctx.message?.error?.(ctx.t('No resource selected for disassociation'));
+    return;
+  }
+  if (!ctx.record) {
+    ctx.message?.error?.(ctx.t('No record selected for disassociation'));
+    return;
+  }
+
+  const filterByTk = collection?.getFilterByTK?.(ctx.record);
+  await callAssociationResourceAction(resource, 'remove', [filterByTk]);
+  await resource.refresh?.();
+  ctx.message?.success?.(ctx.t('Record disassociated successfully'));
+};
+
+export const applyAssociateAction = async (ctx: FlowModelContext | any, selectedRows: any[]) => {
+  const resource = ctx?.blockModel?.resource || ctx?.resource;
+  const collection = ctx?.blockModel?.collection || ctx?.collection;
+
+  if (!isAssociationBlockContext(ctx)) {
+    ctx.message?.error?.(ctx.t('No association block selected'));
+    return;
+  }
+  if (!resource) {
+    ctx.message?.error?.(ctx.t('No resource selected for association'));
+    return;
+  }
+  if (!selectedRows?.length) {
+    ctx.message?.warning?.(ctx.t('Please select at least one record'));
+    return;
+  }
+
+  const values = selectedRows.map((row) => collection?.getFilterByTK?.(row) ?? row).filter((value) => value != null);
+  await callAssociationResourceAction(resource, 'add', values);
+  await resource.refresh?.();
+  ctx.message?.success?.(ctx.t('Record associated successfully'));
+};

package/src/flow/models/actions/DisassociateActionModel.tsx

@@ -0,0 +1,57 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import { tExpr } from '@nocobase/flow-engine';
+import type { ButtonProps } from 'antd';
+import { ActionModel, ActionSceneEnum } from '../base';
+import { applyDisassociateAction, isAssociationBlockContext } from './AssociationActionUtils';
+
+export class DisassociateActionModel extends ActionModel {
+  static scene = ActionSceneEnum.record;
+  static capabilityActionName = 'update';
+
+  defaultProps: ButtonProps = {
+    type: 'link',
+    title: tExpr('Disassociate'),
+    icon: 'DisconnectOutlined',
+  };
+
+  getAclActionName() {
+    return 'update';
+  }
+}
+
+DisassociateActionModel.define({
+  label: tExpr('Disassociate'),
+  sort: 65,
+  hide(ctx) {
+    return !isAssociationBlockContext(ctx);
+  },
+});
+
+DisassociateActionModel.registerFlow({
+  key: 'disassociateSettings',
+  title: tExpr('Disassociate settings'),
+  on: 'click',
+  steps: {
+    confirm: {
+      use: 'confirm',
+      defaultParams: {
+        enable: true,
+        title: tExpr('Disassociate record'),
+        content: tExpr('Are you sure you want to disassociate it?'),
+      },
+    },
+    disassociate: {
+      async handler(ctx) {
+        await applyDisassociateAction(ctx);
+      },
+    },
+  },
+});

package/src/flow/models/actions/FilterActionModel.tsx

@@ -8,6 +8,7 @@
  */
 
 import { tExpr, MobilePopup, MultiRecordResource, useFlowSettingsContext } from '@nocobase/flow-engine';
+import type { CollectionFieldInterfaceDataSourceManager } from '@nocobase/flow-engine';
 import { isEmptyFilter, transformFilter } from '@nocobase/utils/client';
 import { ButtonProps, Popover, Transfer } from 'antd';
 import React from 'react';
@@ -15,6 +16,7 @@ import { FilterGroup, VariableFilterItem } from '../../components/filter';
 import { ActionModel, CollectionBlockModel } from '../base';
 import { FilterContainer } from '../../components/filter/FilterContainer';
 import _ from 'lodash';
+import { getFlowFieldInterfaceOptions } from '../../../flow-compat';
 
 export class FilterActionModel extends ActionModel {
   static scene = 'collection';
@@ -135,9 +137,11 @@ FilterActionModel.registerFlow({
           'x-component': (props) => {
             // eslint-disable-next-line react-hooks/rules-of-hooks
             const { model } = useFlowSettingsContext();
-            const dm = model?.context?.app?.dataSourceManager;
-            const fiMgr = dm?.collectionFieldInterfaceManager;
-            const filterable = getFilterableFields(model.context.blockModel.collection, fiMgr);
+            const filterable = getFilterableFields(
+              model.context.blockModel.collection,
+              model.context.dataSourceManager,
+              model.context.app?.dataSourceManager,
+            );
             const dataSource = filterable.map((field: any) => ({ key: field.name, title: field.title }));
             return (
               <Transfer
@@ -157,9 +161,11 @@ FilterActionModel.registerFlow({
       },
       defaultParams(ctx) {
         // 默认仅包含“可筛选”的字段（与 1.0 一致），以避免 JSON 等未提供 operators 的字段出现在默认允许集合中
-        const dm = ctx?.model?.context?.app?.dataSourceManager;
-        const fiMgr = dm?.collectionFieldInterfaceManager;
-        const names = getFilterableFields(ctx.blockModel.collection, fiMgr).map((field: any) => field.name);
+        const names = getFilterableFields(
+          ctx.blockModel.collection,
+          ctx.model?.context?.dataSourceManager,
+          ctx.model?.context?.app?.dataSourceManager,
+        ).map((field: any) => field.name);
         return {
           filterableFieldNames: names || [],
         };
@@ -304,13 +310,15 @@ FilterActionModel.registerFlow({
   },
 });
 
-function getFilterableFields(collection: any, fiMgr: any) {
+function getFilterableFields(
+  collection: any,
+  ...dataSourceManagers: Array<CollectionFieldInterfaceDataSourceManager | null | undefined>
+) {
   const fields = collection?.getFields?.() || [];
-  if (!fiMgr) return [];
   return fields.filter((field: any) => {
     if (!field?.interface) return false;
     if (field?.filterable === false) return false;
-    const fi = fiMgr.getFieldInterface(field.interface);
+    const fi = getFlowFieldInterfaceOptions(field.interface, ...dataSourceManagers);
     return !!fi?.filterable;
   });
 }

package/src/flow/models/actions/__tests__/AssociationActionModel.test.ts

@@ -0,0 +1,250 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import { describe, expect, it, vi } from 'vitest';
+import { BaseRecordResource, FlowEngine } from '@nocobase/flow-engine';
+import {
+  applyDisassociateAction,
+  ActionModel,
+  applyAssociateAction,
+  AssociateActionModel,
+  CollectionActionGroupModel,
+  DisassociateActionModel,
+  getAssociationTargetResourceSettings,
+  PopupActionModel,
+  RecordActionGroupModel,
+} from '../../..';
+
+class TestAssociationResource<T = any> extends BaseRecordResource<T> {
+  async refresh(): Promise<void> {}
+}
+
+const createEngine = () => {
+  const engine = new FlowEngine();
+  engine.registerModels({
+    ActionModel,
+    AssociateActionModel,
+    DisassociateActionModel,
+    PopupActionModel,
+    CollectionActionGroupModel,
+    RecordActionGroupModel,
+  });
+  return engine;
+};
+
+const createContext = (engine: FlowEngine, resourceSettingsInit: any) => {
+  const collection = {
+    options: {
+      availableActions: ['list', 'update'],
+    },
+    getFilterByTK: vi.fn((record) => record.id),
+  };
+  return {
+    engine,
+    collection,
+    blockModel: {
+      collection,
+      getResourceSettingsInitParams: () => resourceSettingsInit,
+    },
+  } as any;
+};
+
+describe('association action models', () => {
+  it('uses update permission for association operations', () => {
+    expect(AssociateActionModel.prototype.getAclActionName.call({})).toBe('update');
+    expect(DisassociateActionModel.prototype.getAclActionName.call({})).toBe('update');
+    expect(AssociateActionModel.capabilityActionName).toBe('update');
+    expect(DisassociateActionModel.capabilityActionName).toBe('update');
+  });
+
+  it('uses association target collection for selector table blocks', () => {
+    const ctx: any = {
+      blockModel: {
+        association: {
+          target: 'transports',
+          targetCollection: {
+            name: 'transports',
+            dataSourceKey: 'main',
+          },
+        },
+        getResourceSettingsInitParams: () => ({
+          dataSourceKey: 'main',
+          collectionName: 'orders',
+          associationName: 'products.transports',
+        }),
+      },
+    };
+
+    expect(getAssociationTargetResourceSettings(ctx)).toEqual({
+      dataSourceKey: 'main',
+      collectionName: 'transports',
+    });
+  });
+
+  it('shows Associate only in collection actions of association blocks', async () => {
+    const engine = createEngine();
+
+    const relationItems = await CollectionActionGroupModel.defineChildren(
+      createContext(engine, {
+        dataSourceKey: 'main',
+        collectionName: 'orders',
+        associationName: 'products.o2m_orders',
+      }),
+    );
+    const normalItems = await CollectionActionGroupModel.defineChildren(
+      createContext(engine, {
+        dataSourceKey: 'main',
+        collectionName: 'orders',
+      }),
+    );
+
+    expect(relationItems.map((item: any) => item.useModel)).toContain('AssociateActionModel');
+    expect(relationItems.map((item: any) => item.useModel)).not.toContain('DisassociateActionModel');
+    expect(normalItems.map((item: any) => item.useModel)).not.toContain('AssociateActionModel');
+  });
+
+  it('shows Disassociate only in record actions of association blocks', async () => {
+    const engine = createEngine();
+
+    const relationItems = await RecordActionGroupModel.defineChildren(
+      createContext(engine, {
+        dataSourceKey: 'main',
+        collectionName: 'orders',
+        associationName: 'products.o2m_orders',
+      }),
+    );
+    const normalItems = await RecordActionGroupModel.defineChildren(
+      createContext(engine, {
+        dataSourceKey: 'main',
+        collectionName: 'orders',
+      }),
+    );
+
+    expect(relationItems.map((item: any) => item.useModel)).toContain('DisassociateActionModel');
+    expect(relationItems.map((item: any) => item.useModel)).not.toContain('AssociateActionModel');
+    expect(normalItems.map((item: any) => item.useModel)).not.toContain('DisassociateActionModel');
+  });
+
+  it('disassociates the current record through association resource remove action', async () => {
+    const resource = {
+      runAction: vi.fn(async () => ({})),
+      refresh: vi.fn(async () => {}),
+    };
+    const collection = {
+      getFilterByTK: vi.fn(() => 12),
+    };
+    const ctx: any = {
+      blockModel: {
+        collection,
+        resource,
+        getResourceSettingsInitParams: () => ({
+          dataSourceKey: 'main',
+          collectionName: 'orders',
+          associationName: 'products.o2m_orders',
+        }),
+      },
+      record: {
+        id: 12,
+      },
+      message: {
+        success: vi.fn(),
+        error: vi.fn(),
+      },
+      t: (value: string) => value,
+    };
+
+    await applyDisassociateAction(ctx);
+
+    expect(collection.getFilterByTK).toHaveBeenCalledWith(ctx.record);
+    expect(resource.runAction).toHaveBeenCalledWith('remove', {
+      data: [12],
+    });
+    expect(resource.refresh).toHaveBeenCalled();
+    expect(ctx.message.success).toHaveBeenCalledWith('Record disassociated successfully');
+  });
+
+  it('associates selected records through association resource add action', async () => {
+    const resource = {
+      runAction: vi.fn(async () => ({})),
+      refresh: vi.fn(async () => {}),
+    };
+    const collection = {
+      getFilterByTK: vi.fn((record) => record.id),
+    };
+    const ctx: any = {
+      blockModel: {
+        collection,
+        resource,
+        getResourceSettingsInitParams: () => ({
+          dataSourceKey: 'main',
+          collectionName: 'orders',
+          associationName: 'products.o2m_orders',
+        }),
+      },
+      message: {
+        success: vi.fn(),
+        warning: vi.fn(),
+        error: vi.fn(),
+      },
+      t: (value: string) => value,
+    };
+
+    await applyAssociateAction(ctx, [{ id: 11 }, { id: 12 }]);
+
+    expect(collection.getFilterByTK).toHaveBeenCalledWith({ id: 11 });
+    expect(collection.getFilterByTK).toHaveBeenCalledWith({ id: 12 });
+    expect(resource.runAction).toHaveBeenCalledWith('add', {
+      data: [11, 12],
+    });
+    expect(resource.refresh).toHaveBeenCalled();
+    expect(ctx.message.success).toHaveBeenCalledWith('Record associated successfully');
+  });
+
+  it('uses nested association resource url when adding associated records', async () => {
+    const engine = createEngine();
+    const resource = engine.createResource(TestAssociationResource);
+    const api = {
+      request: vi.fn().mockResolvedValue({ data: { data: {} } }),
+    };
+    resource.setAPIClient(api as any);
+    resource.setResourceName('products.o2m_orders');
+    resource.setSourceId('362872646860800');
+
+    const ctx: any = {
+      blockModel: {
+        collection: {
+          getFilterByTK: vi.fn((record) => record.id),
+        },
+        resource,
+        getResourceSettingsInitParams: () => ({
+          dataSourceKey: 'main',
+          collectionName: 'orders',
+          associationName: 'products.o2m_orders',
+          sourceId: '362872646860800',
+        }),
+      },
+      message: {
+        success: vi.fn(),
+        warning: vi.fn(),
+        error: vi.fn(),
+      },
+      t: (value: string) => value,
+    };
+
+    await applyAssociateAction(ctx, [{ id: 11 }]);
+
+    expect(api.request).toHaveBeenCalledWith(
+      expect.objectContaining({
+        method: 'post',
+        url: 'products/362872646860800/o2m_orders:add',
+        data: [11],
+      }),
+    );
+  });
+});

package/src/flow/models/actions/index.ts

@@ -8,8 +8,11 @@
  */
 
 export * from './AddNewActionModel';
+export * from './AssociateActionModel';
+export * from './AssociationActionUtils';
 export * from './BulkDeleteActionModel';
 export * from './DeleteActionModel';
+export * from './DisassociateActionModel';
 export * from './EditActionModel';
 export * from './FilterActionModel';
 export * from './JSActionModel';