feat: support to set data loading mode (#3712)
* 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:
parent
99358ee796
commit
ba1e44c527
@ -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,
|
||||
};
|
||||
|
@ -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] = {
|
||||
|
@ -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,
|
||||
|
@ -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,
|
||||
|
@ -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];
|
||||
}
|
||||
|
||||
|
@ -24,6 +24,7 @@ export interface AllDataBlockProps {
|
||||
parentRecord?: CollectionRecord;
|
||||
requestService?: UseRequestService<any>;
|
||||
requestOptions?: UseRequestOptions;
|
||||
dataLoadingMode?: 'auto' | 'manual';
|
||||
[index: string]: any;
|
||||
}
|
||||
|
||||
|
@ -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]);
|
||||
|
@ -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 进行去重操作
|
||||
|
@ -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';
|
||||
|
@ -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",
|
||||
|
@ -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",
|
||||
|
@ -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",
|
||||
|
@ -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(継承)",
|
||||
|
@ -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": "필터 블록",
|
||||
|
@ -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",
|
||||
|
@ -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": "Таблица",
|
||||
|
@ -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",
|
||||
|
@ -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": "Таблиця",
|
||||
|
@ -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": "筛选区块",
|
||||
|
@ -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": "篩選區塊",
|
||||
|
@ -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,
|
@ -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);
|
||||
}
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
@ -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',
|
||||
|
@ -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',
|
||||
|
@ -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',
|
||||
|
@ -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',
|
||||
|
@ -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);
|
||||
},
|
||||
};
|
||||
};
|
||||
|
@ -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',
|
||||
|
@ -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
|
||||
|
@ -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}
|
||||
|
@ -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
|
||||
|
@ -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}
|
||||
|
@ -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}
|
||||
|
@ -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')}
|
||||
|
@ -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'],
|
||||
|
@ -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'],
|
||||
|
Loading…
Reference in New Issue
Block a user