ruiling/tachybase_todo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: support to set data loading mode (#3712)

Browse Source 
* feat: add setDataLoadingModeSettingItem

* feat: support to set data loading mode

* chore: add translation

* chore: refresh the block immediately after the configuration has been changed

* feat: the data loading mode should also work for the filter buttons

* feat: support old version

* fix: data scope

* fix: fix known bugs

* fix: add setting for table selector

* test: fix e2e
This commit is contained in:
Zeke Zhang 2024-03-14 18:10:54 +08:00 committed by GitHub
parent 99358ee796
commit ba1e44c527
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
36 changed files with 275 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/core/client/src/block-provider/DetailsBlockProvider.tsx
View File

@ -38,7 +38,7 @@ const InternalDetailsBlockProvider = (props) => {
filterOption: service?.params?.[0]?.filter,
});
useEffect(() => {
if (!_.isEmpty(filter)) {
if (!_.isEmpty(filter) && !service.loading) {
service?.run({ ...service?.params?.[0], filter });
}
}, [JSON.stringify(filter)]);
@ -80,7 +80,7 @@ export const useDetailsBlockProps = () => {
})
.catch(console.error);
}
}, [ctx.service.loading]);
}, [ctx.form, ctx.service?.data?.data, ctx.service.loading]);
return {
form: ctx.form,
};

13
packages/core/client/src/block-provider/TableBlockProvider.tsx
View File

@ -145,7 +145,15 @@ export const useTableBlockProps = () => {
field.componentProps.pagination.total = ctx?.service?.data?.meta?.count;
field.componentProps.pagination.current = ctx?.service?.data?.meta?.page;
}
}, [ctx?.service?.loading]);
}, [
ctx?.field?.data?.selectedRowKeys,
ctx?.service?.data?.data,
ctx?.service?.data?.meta?.count,
ctx?.service?.data?.meta?.page,
ctx?.service?.data?.meta?.pageSize,
ctx?.service?.loading,
field,
]);
return {
childrenColumnName: ctx.childrenColumnName,
loading: ctx?.service?.loading,
@ -199,6 +207,9 @@ export const useTableBlockProps = () => {
const storedFilter = block.service.params?.[1]?.filters || {};
if (selectedRow.includes(record[ctx.rowKey])) {
if (block.dataLoadingMode === 'manual') {
return block.clearData();
}
delete storedFilter[uid];
} else {
storedFilter[uid] = {

2
packages/core/client/src/block-provider/TableFieldProvider.tsx
View File

@ -148,7 +148,7 @@ export const useTableFieldProps = () => {
field.data = field.data || {};
field.data.selectedRowKeys = ctx?.field?.data?.selectedRowKeys;
}
}, [ctx?.service?.loading]);
}, [ctx?.field?.data?.selectedRowKeys, ctx?.service?.data?.data, ctx?.service?.loading, field]);
return {
size: 'middle',
loading: ctx?.service?.loading,

11
packages/core/client/src/block-provider/TableSelectorProvider.tsx
View File

@ -290,7 +290,16 @@ export const useTableSelectorProps = () => {
field.componentProps.pagination.total = ctx?.service?.data?.meta?.count;
field.componentProps.pagination.current = ctx?.service?.data?.meta?.page;
}
}, [ctx?.service?.loading]);
}, [
collectionField?.foreignKey,
ctx?.field?.data?.selectedRowKeys,
ctx?.service?.data?.data,
ctx?.service?.data?.meta?.count,
ctx?.service?.data?.meta?.page,
ctx?.service?.data?.meta?.pageSize,
ctx?.service?.loading,
field,
]);
return {
loading: ctx?.service?.loading,
showIndex: false,

19
packages/core/client/src/block-provider/hooks/index.ts
View File

@ -11,6 +11,7 @@ import { useReactToPrint } from 'react-to-print';
import {
AssociationFilter,
useCollectionRecord,
useDataLoadingMode,
useDataSourceHeaders,
useFormActiveFields,
useFormBlockContext,
@ -198,6 +199,10 @@ export const useCreateActionProps = () => {
const collectValues = useCollectValuesToSubmit();
const action = record.isNew ? actionField.componentProps.saveMode || 'create' : 'update';
const filterKeys = actionField.componentProps.filterKeys?.checked || [];
const dataLoadingMode = useDataLoadingMode();
console.log('dataLoadingMode', dataLoadingMode);
return {
async onClick() {
const { onSuccess, skipValidator, triggerWorkflows } = actionSchema?.['x-action-settings'] ?? {};
@ -426,6 +431,10 @@ export const useFilterBlockActionProps = () => {
block.defaultFilter,
]);
if (block.dataLoadingMode === 'manual' && _.isEmpty(mergedFilter)) {
return block.clearData();
}
return block.doFilter(
{
...param,
@ -436,11 +445,10 @@ export const useFilterBlockActionProps = () => {
);
}),
);
actionField.data.loading = false;
} catch (error) {
console.error(error);
actionField.data.loading = false;
}
actionField.data.loading = false;
},
};
};
@ -466,6 +474,10 @@ export const useResetBlockActionProps = () => {
const target = targets.find((target) => target.uid === block.uid);
if (!target) return;
if (block.dataLoadingMode === 'manual') {
return block.clearData();
}
const param = block.service.params?.[0] || {};
// 保留原有的 filter
const storedFilter = block.service.params?.[1]?.filters || {};
@ -1208,6 +1220,9 @@ export const useAssociationFilterBlockProps = () => {
[filterKey]: value,
};
} else {
if (block.dataLoadingMode === 'manual') {
return block.clearData();
}
delete storedFilter[key];
}

1
packages/core/client/src/data-source/data-block/DataBlockProvider.tsx
View File

@ -24,6 +24,7 @@ export interface AllDataBlockProps {
parentRecord?: CollectionRecord;
requestService?: UseRequestService<any>;
requestOptions?: UseRequestOptions;
dataLoadingMode?: 'auto' | 'manual';
[index: string]: any;
}

6
packages/core/client/src/data-source/data-block/DataBlockRequestProvider.tsx
View File

@ -6,11 +6,13 @@ import { CollectionRecordProvider, CollectionRecord } from '../collection-record
import { AllDataBlockProps, useDataBlockProps } from './DataBlockProvider';
import { useDataBlockResource } from './DataBlockResourceProvider';
import { useDataSourceHeaders } from '../utils';
import { useDataLoadingMode } from '../../modules/blocks/data-blocks/details-multi/setDataLoadingModeSettingsItem';
export const BlockRequestContext = createContext<UseRequestResult<any>>(null);
BlockRequestContext.displayName = 'BlockRequestContext';
function useCurrentRequest<T>(options: Omit<AllDataBlockProps, 'type'>) {
const dataLoadingMode = useDataLoadingMode();
const resource = useDataBlockResource();
const { action, params = {}, record, requestService, requestOptions } = options;
if (params.filterByTk === undefined) {
@ -36,13 +38,13 @@ function useCurrentRequest<T>(options: Omit<AllDataBlockProps, 'type'>) {
// 因为修改 Schema 会导致 params 对象发生变化，所以这里使用 `DeepCompare`
useDeepCompareEffect(() => {
if (action) {
if (action && dataLoadingMode === 'auto') {
request.run();
}
}, [params, action, record]);
useUpdateEffect(() => {
if (action) {
if (action && dataLoadingMode === 'auto') {
request.run();
}
}, [resource]);

23
packages/core/client/src/filter-provider/FilterProvider.tsx
View File

@ -1,10 +1,12 @@
import { useField, useFieldSchema } from '@formily/react';
import { uniqBy } from 'lodash';
import React, { createContext, useEffect, useRef } from 'react';
import React, { createContext, useCallback, useEffect, useRef } from 'react';
import { useBlockRequestContext } from '../block-provider/BlockProvider';
import { CollectionFieldOptions_deprecated, useCollection_deprecated } from '../collection-manager';
import { removeNullCondition } from '../schema-component';
import { mergeFilter, useAssociatedFields } from './utils';
import { useDataLoadingMode } from '../modules/blocks/data-blocks/details-multi/setDataLoadingModeSettingsItem';
import { GeneralField } from '@formily/core';
enum FILTER_OPERATOR {
AND = '$and',
@ -40,6 +42,8 @@ export interface DataBlock {
doFilter: (params: any, params2?: any) => Promise<void>;
/** 清除筛选区块设置的筛选参数 */
clearFilter: (uid: string) => void;
/** 将数据区块的数据置为空 */
clearData: () => void;
/** 数据区块表中所有的关系字段 */
associatedFields?: CollectionFieldOptions_deprecated[];
/** 数据区块表中所有的外键字段 */
@ -50,6 +54,11 @@ export interface DataBlock {
service?: any;
/** 数据区块所的 DOM 容器 */
dom: HTMLElement;
/**
* auto: 数据区块会在初始渲染时请求数据
* manual: 只有当点击了筛选按钮，才会请求数据
*/
dataLoadingMode?: 'auto' | 'manual';
}
interface FilterContextValue {
@ -89,13 +98,14 @@ export const DataBlockCollector = ({
const fieldSchema = useFieldSchema();
const associatedFields = useAssociatedFields();
const container = useRef(null);
const dataLoadingMode = useDataLoadingMode();
const shouldApplyFilter =
field.decoratorType !== 'FilterFormBlockProvider' &&
field.decoratorType !== 'FormBlockProvider' &&
field.decoratorProps.blockType !== 'filter';
const addBlockToDataBlocks = () => {
const addBlockToDataBlocks = useCallback(() => {
recordDataBlocks({
uid: fieldSchema['x-uid'],
title: field.componentProps.title,
@ -106,6 +116,7 @@ export const DataBlockCollector = ({
defaultFilter: params?.filter || {},
service,
dom: container.current,
dataLoadingMode,
clearFilter(uid: string) {
const param = this.service.params?.[0] || {};
const storedFilter = this.service.params?.[1]?.filters || {};
@ -124,12 +135,15 @@ export const DataBlockCollector = ({
{ filters: storedFilter },
);
},
clearData() {
this.service.mutate(undefined);
},
});
};
}, [associatedFields, collection, dataLoadingMode, field, fieldSchema, params?.filter, recordDataBlocks, service]);
useEffect(() => {
if (shouldApplyFilter) addBlockToDataBlocks();
}, [params?.filter, service]);
}, [params.filter, service, dataLoadingMode, shouldApplyFilter, addBlockToDataBlocks]);
useEffect(() => {
return () => {
@ -163,6 +177,7 @@ export const useFilterBlock = () => {
// 这里的值有可能会变化，所以需要更新
existingBlock.service = block.service;
existingBlock.defaultFilter = block.defaultFilter;
existingBlock.dataLoadingMode = block.dataLoadingMode;
return;
}
// 由于 setDataBlocks 是异步操作，所以上面的 existingBlock 在判断时有可能用的是旧的 dataBlocks,所以下面还需要根据 uid 进行去重操作

1
packages/core/client/src/index.ts
View File

@ -58,3 +58,4 @@ export * from './modules/blocks/BlockSchemaToolbar';
export * from './modules/blocks/data-blocks/table';
export * from './modules/blocks/data-blocks/form';
export * from './modules/blocks/data-blocks/table-selector';
export * from './modules/blocks/data-blocks/details-multi/setDataLoadingModeSettingsItem';

4
packages/core/client/src/locale/en_US.json
View File

@ -104,6 +104,10 @@
"Submit": "Submit",
"Close": "Close",
"Set the data scope": "Set the data scope",
"Set data loading mode": "Set data loading mode",
"Automatically load data": "Automatically load data",
"Load data after filtering": "Load data after filtering",
"Data loading mode": "Data loading mode",
"Data blocks": "Data blocks",
"Filter blocks": "Filter blocks",
"Table": "Table",

4
packages/core/client/src/locale/es_ES.json
View File

@ -99,6 +99,10 @@
"Submit": "Enviar",
"Close": "Cerrar",
"Set the data scope": "Establecer el ámbito de los datos",
"Data loading mode": "Modo de carga de datos",
"Set data loading mode": "Establecer el modo de carga de datos",
"Automatically load data": "Cargar datos",
"Load data after filtering": "Cargar datos después de filtrar",
"Data blocks": "Bloques de datos",
"Filter blocks": "Bloques de filtro",
"Table": "Tabla",

4
packages/core/client/src/locale/fr_FR.json
View File

@ -99,6 +99,10 @@
"Submit": "Envoyer",
"Close": "Fermer",
"Set the data scope": "Définir la portée des données",
"Data loading mode": "Mode de chargement des données",
"Set data loading mode": "Définir le mode de chargement des données",
"Automatically load data": "Charger automatiquement les données",
"Load data after filtering": "Charger les données après filtrage",
"Data blocks": "Blocs de données",
"Filter blocks": "Blocs de filtre",
"Table": "Tableau",

4
packages/core/client/src/locale/ja_JP.json
View File

@ -102,6 +102,10 @@
"Submit": "送信",
"Close": "閉じる",
"Set the data scope": "データ範囲の設定",
"Data loading mode": "データ読み込みモード",
"Set data loading mode": "データ読み込みモードの設定",
"Automatically load data": "データを自動的に読み込む",
"Load data after filtering": "フィルタリング後にデータを読み込む",
"Data blocks": "データブロック",
"Filter blocks": "フィルターブロック",
"Table OID(Inheritance)": "データテーブルOID(継承)",

4
packages/core/client/src/locale/ko_KR.json
View File

@ -122,6 +122,10 @@
"Submit": "제출",
"Close": "닫기",
"Set the data scope": "데이터 범위 설정",
"Data loading mode": "데이터 로드 모드",
"Set data loading mode": "데이터 로드 모드 설정",
"Automatically load data": "데이터 자동 로드",
"Load data after filtering": "필터링 후 데이터 로드",
"Block": "블록",
"Data blocks": "데이터 블록",
"Filter blocks": "필터 블록",

4
packages/core/client/src/locale/pt_BR.json
View File

@ -73,6 +73,10 @@
"Submit": "Enviar",
"Close": "Fechar",
"Set the data scope": "Definir o escopo de dados",
"Data loading mode": "Modo de carregamento de dados",
"Set data loading mode": "Definir modo de carregamento de dados",
"Automatically load data": "Carregar dados automaticamente",
"Load data after filtering": "Carregar dados após filtragem",
"Data blocks": "Blocos de dados",
"Filter blocks": "Blocos de filtro",
"Table": "Tabela",

6
packages/core/client/src/locale/ru_RU.json
View File

@ -69,6 +69,10 @@
"Submit": "Отправить",
"Close": "Закрыть",
"Set the data scope": "Установить область данных",
"Data loading mode": "Режим загрузки данных",
"Set data loading mode": "Установить режим загрузки данных",
"Automatically load data": "Автоматически загружать данные",
"Load data after filtering": "Загружать данные после фильтрации",
"Data blocks": "Блоки данных",
"Filter blocks": "Просеивающие блоки",
"Table": "Таблица",
@ -555,4 +559,4 @@
"Home page": "Домашняя страница",
"Handbook": "Руководство пользователя",
"License": "Лицензия"
}
}

6
packages/core/client/src/locale/tr_TR.json
View File

@ -69,6 +69,10 @@
"Submit": "Gönder",
"Close": "Kapat",
"Set the data scope": "Veri kapsamını ayarla",
"Data loading mode": "Veri yükleme modu",
"Set data loading mode": "Veri yükleme modunu ayarla",
"Automatically load data": "Veriyi otomatik yükle",
"Load data after filtering": "Filtrelemeden sonra veriyi yükle",
"Data blocks": "Veri Blokları",
"Filter blocks": "Filtre blokları",
"Table": "Tablo",
@ -552,4 +556,4 @@
"Home page": "Anasayfa",
"Handbook": "Kullanıcı kılavuzu",
"License": "Lisans"
}
}

4
packages/core/client/src/locale/uk_UA.json
View File

@ -99,6 +99,10 @@
"Submit": "Відправити",
"Close": "Закрити",
"Set the data scope": "Встановити обсяг даних",
"Data loading mode": "Режим завантаження даних",
"Set data loading mode": "Встановити режим завантаження даних",
"Automatically load data": "Автоматично завантажувати дані",
"Load data after filtering": "Завантажувати дані після фільтрації",
"Data blocks": "Блоки даних",
"Filter blocks": "Блоки фільтрів",
"Table": "Таблиця",

4
packages/core/client/src/locale/zh-CN.json
View File

@ -122,6 +122,10 @@
"Submit": "提交",
"Close": "关闭",
"Set the data scope": "设置数据范围",
"Data loading mode": "数据加载方式",
"Set data loading mode": "设置数据加载方式",
"Automatically load data": "自动加载数据",
"Load data after filtering": "筛选后才加载数据",
"Block": "区块",
"Data blocks": "数据区块",
"Filter blocks": "筛选区块",

4
packages/core/client/src/locale/zh-TW.json
View File

@ -122,6 +122,10 @@
"Submit": "提交",
"Close": "關閉",
"Set the data scope": "設定資料範圍",
"Data loading mode": "資料加載方式",
"Set data loading mode": "設定資料加載方式",
"Automatically load data": "自動加載資料",
"Load data after filtering": "篩選後才加載資料",
"Block": "區塊",
"Data blocks": "資料區塊",
"Filter blocks": "篩選區塊",

9
packages/core/client/src/modules/blocks/data-blocks/details-multi/multiDataDetailsBlockSettings.ts → packages/core/client/src/modules/blocks/data-blocks/details-multi/multiDataDetailsBlockSettings.tsx
View File

@ -8,6 +8,7 @@ import { useCollection_deprecated, useSortFields } from '../../../../collection-
import { removeNullCondition, useDesignable } from '../../../../schema-component';
import { SchemaSettingsBlockTitleItem, SchemaSettingsTemplate } from '../../../../schema-settings';
import { SchemaSettingsDataScope } from '../../../../schema-settings/SchemaSettingsDataScope';
import { setDataLoadingModeSettingsItem, useDataLoadingMode } from './setDataLoadingModeSettingsItem';
export const multiDataDetailsBlockSettings = new SchemaSettings({
name: 'blockSettings:multiDataDetails',
@ -26,6 +27,7 @@ export const multiDataDetailsBlockSettings = new SchemaSettings({
const field = useField();
const { service } = useDetailsBlockContext();
const { dn } = useDesignable();
const dataLoadingMode = useDataLoadingMode();
return {
collectionName: name,
defaultFilter: fieldSchema?.['x-decorator-props']?.params?.filter || {},
@ -36,7 +38,11 @@ export const multiDataDetailsBlockSettings = new SchemaSettings({
params.filter = filter;
field.decoratorProps.params = params;
fieldSchema['x-decorator-props']['params'] = params;
service.run({ ...service.params?.[0], filter });
if (dataLoadingMode === 'auto') {
service.run({ ...service.params?.[0], filter });
}
dn.emit('patch', {
schema: {
['x-uid']: fieldSchema['x-uid'],
@ -164,6 +170,7 @@ export const multiDataDetailsBlockSettings = new SchemaSettings({
};
},
},
setDataLoadingModeSettingsItem,
{
name: 'template',
Component: SchemaSettingsTemplate,

71
packages/core/client/src/modules/blocks/data-blocks/details-multi/setDataLoadingModeSettingsItem.tsx Normal file
View File

@ -0,0 +1,71 @@
import { ISchema, useField, useFieldSchema } from '@formily/react';
import _ from 'lodash';
import React from 'react';
import { useTranslation } from 'react-i18next';
import { useDesignable } from '../../../../schema-component';
import { SchemaSettingsModalItem, useCollectionState } from '../../../../schema-settings';
import { useCollection_deprecated } from '../../../../collection-manager/hooks/useCollection_deprecated';
import { useDataBlockProps, useDataBlockRequest } from '../../../../data-source';
export const setDataLoadingModeSettingsItem = {
name: 'setDataLoadingMode',
Component: SetDataLoadingMode,
};
export function useDataLoadingMode() {
const { dataLoadingMode } = useDataBlockProps() || {};
return dataLoadingMode || 'auto';
}
export function SetDataLoadingMode() {
const { dn } = useDesignable();
const { t } = useTranslation();
const field = useField();
const fieldSchema = useFieldSchema();
const { name } = useCollection_deprecated();
const { getEnableFieldTree, getOnLoadData } = useCollectionState(name);
const request = useDataBlockRequest();
return (
<SchemaSettingsModalItem
title={t('Set data loading mode')}
scope={{ getEnableFieldTree, name, getOnLoadData }}
schema={
{
type: 'object',
title: t('Data loading mode'),
properties: {
dataLoadingMode: {
'x-decorator': 'FormItem',
'x-component': 'Radio.Group',
default: fieldSchema['x-decorator-props']?.dataLoadingMode || 'auto',
enum: [
{ value: 'auto', label: t('Automatically load data') },
{ value: 'manual', label: t('Load data after filtering') },
],
},
},
} as ISchema
}
onSubmit={({ dataLoadingMode }) => {
_.set(fieldSchema, 'x-decorator-props.dataLoadingMode', dataLoadingMode);
field.decoratorProps.dataLoadingMode = dataLoadingMode;
dn.emit('patch', {
schema: {
['x-uid']: fieldSchema['x-uid'],
'x-decorator-props': {
...fieldSchema['x-decorator-props'],
},
},
});
dn.refresh();
if (dataLoadingMode === 'auto') {
request.run();
} else {
request.mutate(undefined);
}
}}
/>
);
}

3
packages/core/client/src/modules/blocks/data-blocks/grid-card/gridCardBlockSettings.ts
View File

@ -18,6 +18,7 @@ import {
import { SchemaSettingsTemplate } from '../../../../schema-settings';
import { columnCountMarks } from './utils';
import { SchemaSettingsDataScope } from '../../../../schema-settings/SchemaSettingsDataScope';
import { setDataLoadingModeSettingsItem } from '../details-multi/setDataLoadingModeSettingsItem';
export const gridCardBlockSettings = new SchemaSettings({
name: 'blockSettings:gridCard',
@ -90,7 +91,6 @@ export const gridCardBlockSettings = new SchemaSettings({
const { form } = useFormBlockContext();
const field = useField();
const { dn } = useDesignable();
const defaultSort = fieldSchema?.['x-decorator-props']?.params?.sort || [];
return {
collectionName: name,
@ -224,6 +224,7 @@ export const gridCardBlockSettings = new SchemaSettings({
};
},
},
setDataLoadingModeSettingsItem,
{
name: 'RecordsPerPage',
type: 'select',

2
packages/core/client/src/modules/blocks/data-blocks/list/listBlockSettings.ts
View File

@ -8,6 +8,7 @@ import { useCollection_deprecated, useSortFields } from '../../../../collection-
import { removeNullCondition, useDesignable } from '../../../../schema-component';
import { SchemaSettingsBlockTitleItem, SchemaSettingsTemplate } from '../../../../schema-settings';
import { SchemaSettingsDataScope } from '../../../../schema-settings/SchemaSettingsDataScope';
import { setDataLoadingModeSettingsItem } from '../details-multi/setDataLoadingModeSettingsItem';
export const listBlockSettings = new SchemaSettings({
name: 'blockSettings:list',
@ -156,6 +157,7 @@ export const listBlockSettings = new SchemaSettings({
};
},
},
setDataLoadingModeSettingsItem,
{
name: 'RecordsPerPage',
type: 'select',

11
packages/core/client/src/modules/blocks/data-blocks/table-selector/tableSelectorBlockSettings.ts
View File

@ -12,6 +12,7 @@ import {
} from '../../../../collection-manager';
import { removeNullCondition, useDesignable } from '../../../../schema-component';
import { SchemaSettingsDataScope } from '../../../../schema-settings/SchemaSettingsDataScope';
import { setDataLoadingModeSettingsItem, useDataLoadingMode } from '../details-multi/setDataLoadingModeSettingsItem';
export const tableSelectorBlockSettings = new SchemaSettings({
name: 'blockSettings:tableSelector',
@ -26,6 +27,7 @@ export const tableSelectorBlockSettings = new SchemaSettings({
const { form } = useFormBlockContext();
const { service, extraFilter } = useTableSelectorContext();
const { dn } = useDesignable();
const dataLoadingMode = useDataLoadingMode();
const onDataScopeSubmit = useCallback(
({ filter }) => {
filter = removeNullCondition(filter);
@ -43,7 +45,11 @@ export const tableSelectorBlockSettings = new SchemaSettings({
serviceFilter = extraFilter;
}
}
service.run({ ...service.params?.[0], filter: serviceFilter, page: 1 });
if (dataLoadingMode === 'auto') {
service.run({ ...service.params?.[0], filter: serviceFilter, page: 1 });
}
dn.emit('patch', {
schema: {
['x-uid']: fieldSchema['x-uid'],
@ -51,7 +57,7 @@ export const tableSelectorBlockSettings = new SchemaSettings({
},
});
},
[dn, field.decoratorProps, fieldSchema, service, extraFilter],
[field.decoratorProps, fieldSchema, extraFilter, dataLoadingMode, dn, service],
);
return {
@ -223,6 +229,7 @@ export const tableSelectorBlockSettings = new SchemaSettings({
return !dragSort;
},
},
setDataLoadingModeSettingsItem,
{
name: 'RecordsPerPage',
type: 'select',

15
packages/core/client/src/modules/blocks/data-blocks/table/tableBlockSettings.tsx
View File

@ -21,6 +21,7 @@ import { useTranslation } from 'react-i18next';
import { ArrayItems } from '@formily/antd-v5';
import { FixedBlockDesignerItem } from '../../../../schema-component/antd/page/FixedBlockDesignerItem';
import { SchemaSettings } from '../../../../application/schema-settings/SchemaSettings';
import { setDataLoadingModeSettingsItem, useDataLoadingMode } from '../details-multi/setDataLoadingModeSettingsItem';
export const tableBlockSettings = new SchemaSettings({
name: 'blockSettings:table',
@ -138,6 +139,7 @@ export const tableBlockSettings = new SchemaSettings({
const { form } = useFormBlockContext();
const { service } = useTableBlockContext();
const { dn } = useDesignable();
const dataLoadingMode = useDataLoadingMode();
const onDataScopeSubmit = useCallback(
({ filter }) => {
filter = removeNullCondition(filter);
@ -146,10 +148,14 @@ export const tableBlockSettings = new SchemaSettings({
field.decoratorProps.params = params;
fieldSchema['x-decorator-props']['params'] = params;
const filters = service.params?.[1]?.filters || {};
service.run(
{ ...service.params?.[0], filter: mergeFilter([...Object.values(filters), filter]), page: 1 },
{ filters },
);
if (dataLoadingMode === 'auto') {
service.run(
{ ...service.params?.[0], filter: mergeFilter([...Object.values(filters), filter]), page: 1 },
{ filters },
);
}
dn.emit('patch', {
schema: {
['x-uid']: fieldSchema['x-uid'],
@ -290,6 +296,7 @@ export const tableBlockSettings = new SchemaSettings({
return !dragSort;
},
},
setDataLoadingModeSettingsItem,
{
name: 'RecordsPerPage',
type: 'select',

21
packages/core/client/src/schema-component/antd/filter/useFilterActionProps.ts
View File

@ -5,6 +5,8 @@ import { useTranslation } from 'react-i18next';
import { useBlockRequestContext } from '../../../block-provider';
import { useCollection_deprecated, useCollectionManager_deprecated } from '../../../collection-manager';
import { mergeFilter } from '../../../filter-provider/utils';
import { useDataLoadingMode } from '../../../modules/blocks/data-blocks/details-multi/setDataLoadingModeSettingsItem';
import _ from 'lodash';
export const useGetFilterOptions = () => {
const { getCollectionFields } = useCollectionManager_deprecated();
@ -168,6 +170,8 @@ export const useFilterActionProps = () => {
export const useFilterFieldProps = ({ options, service, params }) => {
const { t } = useTranslation();
const field = useField<Field>();
const dataLoadingMode = useDataLoadingMode();
return {
options,
onSubmit(values) {
@ -176,6 +180,10 @@ export const useFilterFieldProps = ({ options, service, params }) => {
// filter parameter for the filter action
const filter = removeNullCondition(values?.filter);
if (dataLoadingMode === 'manual' && _.isEmpty(filter)) {
return service.mutate(undefined);
}
const filters = service.params?.[1]?.filters || {};
filters[`filterAction`] = filter;
service.run(
@ -193,15 +201,24 @@ export const useFilterFieldProps = ({ options, service, params }) => {
const filter = params.filter;
const filters = service.params?.[1]?.filters || {};
delete filters[`filterAction`];
service.run(
const newParams = [
{
...service.params?.[0],
filter: mergeFilter([...Object.values(filters), filter]),
page: 1,
},
{ filters },
);
];
field.title = t('Filter');
if (dataLoadingMode === 'manual') {
service.params = newParams;
return service.mutate(undefined);
}
service.run(...newParams);
},
};
};

2
packages/core/client/src/schema-component/antd/form-v2/Form.Settings.tsx
View File

@ -16,6 +16,7 @@ import {
import { SchemaSettingsDataScope } from '../../../schema-settings/SchemaSettingsDataScope';
import { useDesignable } from '../../hooks';
import { removeNullCondition } from '../filter';
import { setDataLoadingModeSettingsItem } from '../../../modules/blocks/data-blocks/details-multi/setDataLoadingModeSettingsItem';
/**
* @deprecated
@ -169,6 +170,7 @@ export const formDetailsSettings = new SchemaSettings({
};
},
},
setDataLoadingModeSettingsItem,
{
name: 'sortingRules',
type: 'modal',

2
packages/core/client/src/schema-component/antd/grid-card/GridCard.Decorator.tsx
View File

@ -22,7 +22,7 @@ const InternalGridCardBlockProvider = (props) => {
if (!service?.loading) {
form.setValuesIn(field.address.concat('list').toString(), service?.data?.data);
}
}, [service?.data?.data, service?.loading]);
}, [field.address, form, service?.data?.data, service?.loading]);
return wrapSSR(
<GridCardBlockContext.Provider

2
packages/core/client/src/schema-component/antd/grid-card/GridCard.Designer.tsx
View File

@ -21,6 +21,7 @@ import { useDesignable } from '../../hooks';
import { removeNullCondition } from '../filter';
import { defaultColumnCount, gridSizes, pageSizeOptions, screenSizeMaps, screenSizeTitleMaps } from './options';
import { SchemaSettingsDataScope } from '../../../schema-settings/SchemaSettingsDataScope';
import { SetDataLoadingMode } from '../../../modules/blocks/data-blocks/details-multi/setDataLoadingModeSettingsItem';
const columnCountMarks = [1, 2, 3, 4, 6, 8, 12, 24].reduce((obj, cur) => {
obj[cur] = cur;
@ -209,6 +210,7 @@ export const GridCardDesigner = () => {
});
}}
/>
<SetDataLoadingMode />
<SchemaSettingsSelectItem
title={t('Records per page')}
value={field.decoratorProps?.params?.pageSize || 20}

2
packages/core/client/src/schema-component/antd/list/List.Decorator.tsx
View File

@ -23,7 +23,7 @@ const InternalListBlockProvider = (props) => {
if (!service?.loading) {
form.setValuesIn(field.address.concat('list').toString(), service?.data?.data);
}
}, [service?.data?.data, service?.loading]);
}, [field.address, form, service?.data?.data, service?.loading]);
return (
<ListBlockContext.Provider

2
packages/core/client/src/schema-component/antd/list/List.Designer.tsx
View File

@ -19,6 +19,7 @@ import { useSchemaTemplate } from '../../../schema-templates';
import { useDesignable } from '../../hooks';
import { removeNullCondition } from '../filter';
import { SchemaSettingsDataScope } from '../../../schema-settings/SchemaSettingsDataScope';
import { SetDataLoadingMode } from '../../../modules/blocks/data-blocks/details-multi/setDataLoadingModeSettingsItem';
/**
* @deprecated - 已使用 SchemaSettings 替代
@ -154,6 +155,7 @@ export const ListDesigner = () => {
});
}}
/>
<SetDataLoadingMode />
<SchemaSettingsSelectItem
title={t('Records per page')}
value={field.decoratorProps?.params?.pageSize || 20}

5
packages/core/client/src/schema-component/antd/table-v2/TableBlockDesigner.tsx
View File

@ -26,6 +26,7 @@ import { removeNullCondition } from '../filter';
import { useCompile } from '../../';
import { SchemaSettingsDataScope } from '../../../schema-settings/SchemaSettingsDataScope';
import { FixedBlockDesignerItem } from '../page/FixedBlockDesignerItem';
import { SetDataLoadingMode } from '../../../modules/blocks/data-blocks/details-multi/setDataLoadingModeSettingsItem';
export const EditSortField = () => {
const { fields } = useCollection_deprecated();
@ -66,7 +67,7 @@ export const EditSortField = () => {
};
export const TableBlockDesigner = () => {
const { name, title, sortable } = useCollection_deprecated();
const { name, title } = useCollection_deprecated();
const { getCollectionField, getCollection } = useCollectionManager_deprecated();
const field = useField();
const fieldSchema = useFieldSchema();
@ -75,7 +76,6 @@ export const TableBlockDesigner = () => {
const { service } = useTableBlockContext();
const { t } = useTranslation();
const { dn } = useDesignable();
const record = useRecord();
const defaultSort = fieldSchema?.['x-decorator-props']?.params?.sort || [];
const defaultResource = fieldSchema?.['x-decorator-props']?.resource;
@ -268,6 +268,7 @@ export const TableBlockDesigner = () => {
}}
/>
)}
<SetDataLoadingMode />
<SchemaSettingsSelectItem
title={t('Records per page')}
value={field.decoratorProps?.params?.pageSize || 20}

2
packages/core/client/src/schema-component/antd/table-v2/TableSelectorDesigner.tsx
View File

@ -23,6 +23,7 @@ import { removeNullCondition } from '../filter';
import { VariableInput, getShouldChange } from '../../../schema-settings/VariableInput/VariableInput';
import { RecordPickerContext } from '../../antd/record-picker';
import { SchemaSettingsDataScope } from '../../../schema-settings/SchemaSettingsDataScope';
import { SetDataLoadingMode } from '../../../modules/blocks/data-blocks/details-multi/setDataLoadingModeSettingsItem';
export const TableSelectorDesigner = () => {
const { name, title } = useCollection_deprecated();
@ -126,6 +127,7 @@ export const TableSelectorDesigner = () => {
}}
/>
)}
<SetDataLoadingMode />
{!dragSort && (
<SchemaSettingsModalItem
title={t('Set default sorting rules')}

17
packages/plugins/@nocobase/plugin-gantt/src/client/Gantt.Settings.tsx
View File

@ -6,9 +6,11 @@ import {
SchemaSettingsSelectItem,
SchemaSettingsTemplate,
removeNullCondition,
setDataLoadingModeSettingsItem,
useCollection,
useCollection_deprecated,
useCompile,
useDataLoadingMode,
useDesignable,
useFormBlockContext,
} from '@nocobase/client';
@ -206,6 +208,7 @@ export const oldGanttSettings = new SchemaSettings({
const field = useField();
const { service } = useGanttBlockContext();
const { dn } = useDesignable();
const dataLoadingMode = useDataLoadingMode();
return {
collectionName: name,
defaultFilter: fieldSchema?.['x-decorator-props']?.params?.filter || {},
@ -216,7 +219,11 @@ export const oldGanttSettings = new SchemaSettings({
params.filter = filter;
field.decoratorProps.params = params;
fieldSchema['x-decorator-props']['params'] = params;
service.run({ ...service.params?.[0], filter });
if (dataLoadingMode === 'auto') {
service.run({ ...service.params?.[0], filter });
}
dn.emit('patch', {
schema: {
['x-uid']: fieldSchema['x-uid'],
@ -373,6 +380,7 @@ export const ganttSettings = new SchemaSettings({
};
},
},
setDataLoadingModeSettingsItem,
{
name: 'endDateField',
Component: SchemaSettingsSelectItem,
@ -446,6 +454,7 @@ export const ganttSettings = new SchemaSettings({
const field = useField();
const { service } = useGanttBlockContext();
const { dn } = useDesignable();
const dataLoadingMode = useDataLoadingMode();
return {
collectionName: name,
defaultFilter: fieldSchema?.['x-decorator-props']?.params?.filter || {},
@ -456,7 +465,11 @@ export const ganttSettings = new SchemaSettings({
params.filter = filter;
field.decoratorProps.params = params;
fieldSchema['x-decorator-props']['params'] = params;
service.run({ ...service.params?.[0], filter });
if (dataLoadingMode === 'auto') {
service.run({ ...service.params?.[0], filter });
}
dn.emit('patch', {
schema: {
['x-uid']: fieldSchema['x-uid'],

17
packages/plugins/@nocobase/plugin-map/src/client/block/MapBlock.Settings.tsx
View File

@ -12,11 +12,12 @@ import {
SchemaSettingsTemplate,
mergeFilter,
useCollection,
useCollectionManager,
useDesignable,
useFormBlockContext,
SchemaSettings,
useCollectionManager_deprecated,
setDataLoadingModeSettingsItem,
useDataLoadingMode,
} from '@nocobase/client';
import lodash from 'lodash';
import { useMapTranslation } from '../locale';
@ -127,6 +128,7 @@ export const mapBlockSettings = new SchemaSettings({
};
},
},
setDataLoadingModeSettingsItem,
{
name: 'defaultZoomLevel',
Component: SchemaSettingsModalItem,
@ -177,6 +179,7 @@ export const mapBlockSettings = new SchemaSettings({
const field = useField();
const { service } = useMapBlockContext();
const { dn } = useDesignable();
const dataLoadingMode = useDataLoadingMode();
return {
collectionName: name,
defaultFilter: fieldSchema?.['x-decorator-props']?.params?.filter || {},
@ -187,10 +190,14 @@ export const mapBlockSettings = new SchemaSettings({
field.decoratorProps.params = params;
fieldSchema['x-decorator-props']['params'] = params;
const filters = service.params?.[1]?.filters || {};
service.run(
{ ...service.params?.[0], filter: mergeFilter([...Object.values(filters), filter]), page: 1 },
{ filters },
);
if (dataLoadingMode === 'auto') {
service.run(
{ ...service.params?.[0], filter: mergeFilter([...Object.values(filters), filter]), page: 1 },
{ filters },
);
}
dn.emit('patch', {
schema: {
['x-uid']: fieldSchema['x-uid'],