loadDataOnce 直接改成 fetch 配置项,而不存在 store 中

This commit is contained in:
liaoxuezhi 2019-05-13 20:42:47 +08:00
parent 92e69db860
commit 645ec8a6e1
2 changed files with 46 additions and 38 deletions

View File

@ -65,7 +65,8 @@ interface CRUDProps extends RendererProps {
filterDefaultVisible?: boolean; filterDefaultVisible?: boolean;
syncResponse2Query?: boolean; syncResponse2Query?: boolean;
keepItemSelectionOnPageChange?: boolean; keepItemSelectionOnPageChange?: boolean;
loadDataOnce: boolean; loadDataOnce?: boolean;
source?: string;
} }
export default class CRUD extends React.Component<CRUDProps, any> { export default class CRUD extends React.Component<CRUDProps, any> {
@ -109,7 +110,8 @@ export default class CRUD extends React.Component<CRUDProps, any> {
'keepItemSelectionOnPageChange', 'keepItemSelectionOnPageChange',
'labelTpl', 'labelTpl',
'labelField', 'labelField',
'loadDataOnce' 'loadDataOnce',
'source'
]; ];
static defaultProps: Partial<CRUDProps> = { static defaultProps: Partial<CRUDProps> = {
toolbarInline: true, toolbarInline: true,
@ -162,7 +164,6 @@ export default class CRUD extends React.Component<CRUDProps, any> {
const {location, store, pageField, perPageField, syncLocation, loadDataOnce} = this.props; const {location, store, pageField, perPageField, syncLocation, loadDataOnce} = this.props;
this.mounted = true; this.mounted = true;
store.setLoadDataOnce(loadDataOnce);
if (syncLocation && location && (location.query || location.search)) { if (syncLocation && location && (location.query || location.search)) {
store.updateQuery( store.updateQuery(
@ -209,10 +210,6 @@ export default class CRUD extends React.Component<CRUDProps, any> {
store.setFilterTogglable(!!nextProps.filterTogglable, nextProps.filterDefaultVisible); store.setFilterTogglable(!!nextProps.filterTogglable, nextProps.filterDefaultVisible);
} }
if (this.props.loadDataOnce !== nextProps.loadDataOnce) {
store.setLoadDataOnce(!!nextProps.loadDataOnce);
}
if (props.syncLocation && props.location && props.location.search !== nextProps.location.search) { if (props.syncLocation && props.location && props.location.search !== nextProps.location.search) {
// 同步地址栏,那么直接检测 query 是否变了,变了就重新拉数据 // 同步地址栏,那么直接检测 query 是否变了,变了就重新拉数据
store.updateQuery( store.updateQuery(
@ -538,6 +535,8 @@ export default class CRUD extends React.Component<CRUDProps, any> {
keepItemSelectionOnPageChange, keepItemSelectionOnPageChange,
pickerMode, pickerMode,
env, env,
loadDataOnce,
source
} = this.props; } = this.props;
// reload 需要清空用户选择。 // reload 需要清空用户选择。
@ -570,6 +569,8 @@ export default class CRUD extends React.Component<CRUDProps, any> {
errorMessage: messages && messages.fetchFailed, errorMessage: messages && messages.fetchFailed,
autoAppend: true, autoAppend: true,
forceReload, forceReload,
loadDataOnce,
source,
silent, silent,
pageField, pageField,
perPageField, perPageField,

View File

@ -18,6 +18,7 @@ import {
} from '../types'; } from '../types';
import * as qs from 'qs'; import * as qs from 'qs';
import pick = require("lodash/pick"); import pick = require("lodash/pick");
import { resolveVariableAndFilter } from '../utils/tpl-builtin';
class ServerError extends Error { class ServerError extends Error {
@ -33,7 +34,6 @@ export const CRUDStore = ServiceStore
page: 1, page: 1,
perPage: 10, perPage: 10,
total: 0, total: 0,
loadDataOnce: false, // 配置数据是否一次性加载,如果是这样,由前端来完成分页,排序等功能。
mode: 'normal', mode: 'normal',
hasNext: false, hasNext: false,
selectedAction: types.frozen(), selectedAction: types.frozen(),
@ -102,11 +102,19 @@ export const CRUDStore = ServiceStore
const fetchInitData:(api:Api, data?:object, options?:fetchOptions & { const fetchInitData:(api:Api, data?:object, options?:fetchOptions & {
forceReload?: boolean; forceReload?: boolean;
loadDataOnce?: boolean; // 配置数据是否一次性加载,如果是这样,由前端来完成分页,排序等功能。
source?: string; // 支持自定义属于映射,默认不配置,读取 rows 或者 items
loadDataMode?: boolean; loadDataMode?: boolean;
syncResponse2Query?: boolean; syncResponse2Query?: boolean;
}) => Promise<any> = flow(function *getInitData(api:string, data:object, options?:fetchOptions) { }) => Promise<any> = flow(function *getInitData(api:string, data:object, options:fetchOptions & {
forceReload?: boolean;
loadDataOnce?: boolean; // 配置数据是否一次性加载,如果是这样,由前端来完成分页,排序等功能。
source?: string; // 支持自定义属于映射,默认不配置,读取 rows 或者 items
loadDataMode?: boolean;
syncResponse2Query?: boolean;
} = {}) {
try { try {
if (options && options.forceReload === false && self.loadDataOnce && self.total) { if (options.forceReload === false && options.loadDataOnce && self.total) {
let items = self.items.concat(); let items = self.items.concat();
if (self.query.orderBy) { if (self.query.orderBy) {
@ -128,17 +136,17 @@ export const CRUDStore = ServiceStore
self.fetching = false; self.fetching = false;
} }
options && options.silent || self.markFetching(true); options.silent || self.markFetching(true);
const ctx:any = createObject(self.data, { const ctx:any = createObject(self.data, {
...self.query, ...self.query,
[options && options.pageField || 'page']: self.page, [options.pageField || 'page']: self.page,
[options && options.perPageField || 'perPage']: self.perPage, [options.perPageField || 'perPage']: self.perPage,
...data ...data
}); });
// 一次性加载不要发送 perPage 属性 // 一次性加载不要发送 perPage 属性
if (self.loadDataOnce) { if (options.loadDataOnce) {
delete ctx[options && options.perPageField || 'perPage']; delete ctx[options.perPageField || 'perPage'];
} }
const json:Payload = yield (getRoot(self) as IRendererStore).fetcher(api, ctx, { const json:Payload = yield (getRoot(self) as IRendererStore).fetcher(api, ctx, {
@ -148,7 +156,7 @@ export const CRUDStore = ServiceStore
fetchCancel = null; fetchCancel = null;
if (!json.ok) { if (!json.ok) {
self.updateMessage(json.msg || options && options.errorMessage || '获取失败', true); self.updateMessage(json.msg || options.errorMessage || '获取失败', true);
(getRoot(self) as IRendererStore).notify('error', json.msg); (getRoot(self) as IRendererStore).notify('error', json.msg);
} else { } else {
if (!json.data) { if (!json.data) {
@ -165,8 +173,6 @@ export const CRUDStore = ServiceStore
} }
const { const {
items,
rows,
total, total,
count, count,
page, page,
@ -174,21 +180,27 @@ export const CRUDStore = ServiceStore
...rest ...rest
} = result; } = result;
if (!Array.isArray(items) && !Array.isArray(rows)) { let items:Array<any>;
if (options.source) {
items = resolveVariableAndFilter(options.source, result, '| raw');
} else {
items = result.items || result.rows;
}
if (!Array.isArray(items)) {
throw new Error('返回数据格式不正确payload.data.items 必须是数组'); throw new Error('返回数据格式不正确payload.data.items 必须是数组');
} else {
// 确保成员是对象。
items.map((item:any) => typeof item === 'string' ? {text: item} : item);
} }
// 点击加载更多数据 // 点击加载更多数据
let rowsData = [] let rowsData = []
if (options && options.loadDataMode && Array.isArray(self.data.items)) { if (options.loadDataMode && Array.isArray(self.data.items)) {
rowsData = self.data.items.concat(items || rows); rowsData = self.data.items.concat(items);
} else { } else {
// 第一次的时候就是直接加载请求的数据 // 第一次的时候就是直接加载请求的数据
rowsData = items || rows; rowsData = items;
}
if (Array.isArray(rowsData)) {
rowsData = rowsData.map((item:any) => typeof item === 'string' ? {text: item} : item)
} }
const data = { const data = {
@ -199,7 +211,7 @@ export const CRUDStore = ServiceStore
...rest ...rest
}; };
if (self.loadDataOnce) { if (options.loadDataOnce) {
if (self.query.orderBy) { if (self.query.orderBy) {
const dir = /desc/i.test(self.query.orderDir) ? -1 : 1; const dir = /desc/i.test(self.query.orderDir) ? -1 : 1;
rowsData = sortArray(rowsData, self.query.orderBy, dir); rowsData = sortArray(rowsData, self.query.orderBy, dir);
@ -210,7 +222,7 @@ export const CRUDStore = ServiceStore
self.items.replace(rowsData); self.items.replace(rowsData);
self.reInitData(data); self.reInitData(data);
options && options.syncResponse2Query !== false && updateQuery(pick(rest, Object.keys(self.query)), undefined, options && options.pageField || 'page', options && options.perPageField || 'perPage'); options.syncResponse2Query !== false && updateQuery(pick(rest, Object.keys(self.query)), undefined, options.pageField || 'page', options.perPageField || 'perPage');
self.total = parseInt(data.total || data.count, 10) || 0; self.total = parseInt(data.total || data.count, 10) || 0;
typeof page !== 'undefined' && (self.page = parseInt(page, 10)); typeof page !== 'undefined' && (self.page = parseInt(page, 10));
@ -222,10 +234,10 @@ export const CRUDStore = ServiceStore
self.hasNext = !!hasNext; self.hasNext = !!hasNext;
} }
self.updateMessage(json.msg || options && options.successMessage); self.updateMessage(json.msg || options.successMessage);
// 配置了获取成功提示后提示,默认是空不会提示。 // 配置了获取成功提示后提示,默认是空不会提示。
if (options && options.successMessage) { if (options.successMessage) {
(getRoot(self) as IRendererStore).notify('success', self.msg); (getRoot(self) as IRendererStore).notify('success', self.msg);
} }
} }
@ -272,7 +284,7 @@ export const CRUDStore = ServiceStore
self.markSaving(false); self.markSaving(false);
if (!json.ok) { if (!json.ok) {
self.updateMessage(json.msg || options && options.errorMessage || '保存失败', true); self.updateMessage(json.msg || options.errorMessage || '保存失败', true);
(getRoot(self) as IRendererStore).notify('error', self.msg); (getRoot(self) as IRendererStore).notify('error', self.msg);
throw new ServerError(self.msg); throw new ServerError(self.msg);
} else { } else {
@ -280,7 +292,7 @@ export const CRUDStore = ServiceStore
__saved: Date.now() __saved: Date.now()
}); });
self.updatedAt = Date.now(); self.updatedAt = Date.now();
self.updateMessage(json.msg || options && options.successMessage || '保存成功'); self.updateMessage(json.msg || options.successMessage || '保存成功');
(getRoot(self) as IRendererStore).notify('success', self.msg); (getRoot(self) as IRendererStore).notify('success', self.msg);
} }
return json.data; return json.data;
@ -313,10 +325,6 @@ export const CRUDStore = ServiceStore
self.hasInnerModalOpen = value; self.hasInnerModalOpen = value;
} }
const setLoadDataOnce = function(value:boolean) {
self.loadDataOnce = value;
}
return { return {
setPristineQuery, setPristineQuery,
updateQuery, updateQuery,
@ -328,8 +336,7 @@ export const CRUDStore = ServiceStore
setFilterVisible, setFilterVisible,
setSelectedItems, setSelectedItems,
setUnSelectedItems, setUnSelectedItems,
setInnerModalOpened, setInnerModalOpened
setLoadDataOnce
}; };
}); });