mt-flowbite-react
Version:
Official React components built for Flowbite and Tailwind CSS
207 lines (206 loc) • 7.88 kB
JavaScript
;
'use client';
Object.defineProperty(exports, "__esModule", { value: true });
exports.createResViewSlice = void 0;
const mtm_client_1 = require("../mtmapi/mtm.client");
const mtmapi_1 = require("../mtmapi/mtmapi");
const consts_1 = require("./consts");
const createResViewSlice = (set, get, initState) => {
return {
depth: 0,
isLoadingDetail: false,
isLoadingList: false,
isOpenNewForm: false,
debug: false,
openQuery: false,
items: [],
// isOpenDebug: false,
// setDebug(debug) {
// set({ ...get(), debug })
// },
async addItem(item) {
const pre = get();
const res = get().resView?.res;
if (res) {
return;
}
console.log('add item: ', item);
set({ ...pre, items: [...pre.items, item] });
//同步到后端
const addItemResult = await (0, mtmapi_1.mtmApiAddItem)(res, item);
console.log('add item result:', addItemResult);
},
setDepth(depth) {
if (depth > 0) {
console.log('setDepth call', depth);
set({ ...get(), depth });
}
},
cleanItems() {
set({ ...get(), items: [] });
},
setActivateId(activateId) {
set({ ...get(), activateId });
get().loadDetailData();
},
handleBacktoList() {
history.pushState({}, '', `${consts_1.RES_URL_ROOT} / ${get().resView?.res}`);
set({ ...get(), activateId: undefined, activateItem: undefined });
},
async listQuery(newValues) {
console.log('listQuery, state:', get());
const pre = get();
if (!pre.resView) {
console.log('resView 对象为空，跳过数据加载');
return;
}
const viewType = pre.resView.viewType;
const res = pre.resView.res;
// if (viewType == "list") {
set({
...pre,
isLoadingList: true,
queryParams: {
...pre.queryParams,
...newValues,
},
});
let parentIdField = pre.resView?.parentIdField;
if (!parentIdField) {
//如果没有具体指定上级过滤字段，则根据res 名称 生成。
parentIdField = pre.parentResView?.res;
}
const finnalParams = {
...pre.queryParams,
};
finnalParams[parentIdField] = pre.parentItemId;
const result = await (0, mtmapi_1.mtmApiCall)(res, '', finnalParams);
const responseItems = result.items;
set({
...get(),
isLoadingList: false,
items: [
...responseItems.map((ritem) => {
return {
...ritem,
};
}),
],
});
// } else if (pre.resView.viewType == "edit") {
// console.log("TODO: 加载 edit 数据")
// }
},
async loadDetailData() {
const pre = get();
set({ ...pre, isLoadingDetail: true });
const res = pre.resView.res;
if (pre.activateId) {
//TODO: 添加前端缓存
const activateItem = await (0, mtmapi_1.GetById)(res, pre.activateId);
set({ ...pre, isLoadingDetail: false, activateItem });
}
},
async updateItem(item) {
const pre = get();
console.log('TODO:更新item', item);
// ResStoreService.syncUpdate(pre.resName, item)
},
setOpenDebug: (isOpenDebug) => set((state) => {
return { isOpenDebug };
}),
setIsLoadingList: (isLoadingList) => set((state) => {
return { isLoadingList };
}),
setOpenNewForm: (isOpenNewForm) => set((state) => {
return { isOpenNewForm };
}),
setQueryParams: (queryParams) => set((state) => {
return { queryParams };
}),
setOpenQuery: (openQuery) => set((state) => {
return { openQuery };
}),
setOpenDeleteConfrom(isOpenDeleteConfrom) {
set({ ...get(), isOpenDeleteConfrom });
},
async deleteItem(id) {
const res = get().resView.res;
await (0, mtmapi_1.DeleteById)(res, id);
},
setDeleteItemId(deleteItemId) {
set({ ...get(), deleteItemId });
},
async LoadViewConfig() {
set({ ...get(), isLoadingResView: true });
const viewData = get().resView;
if (!viewData) {
//假如没有传入resView 的完整数据，则根据 resViewId 从后端加载。
console.log('TODO: 需要从后端根据 resViewId 加载 resView 数据');
}
const pre = get();
//从视图配置中，搜索相关的表单。
//补充： 这个方式过时。新的方式是，直接使用api加载。
const createItemForm = viewData.forms?.find((form) => {
return form.res == pre.resView?.res && form.action == 'create';
});
const queryForm = viewData?.forms?.find((form) => {
return form.res == pre.resView?.res && form.action == 'listquery';
});
const editForm = viewData?.forms?.find((form) => {
return form.res == pre.resView?.res && form.action == 'edit';
});
set({
...get(),
isLoadingResView: false,
resView: viewData,
newItemForm: createItemForm,
queryForm,
editForm,
});
},
isLoadingResView: false,
setLoadingResView(isLoadingResView) {
set({ ...get(), isLoadingResView });
},
activatedSubView: undefined,
setActivatedSubView(activatedSubView) {
set({ ...get(), activatedSubView });
},
parentItemId: undefined,
setParentItemId(parentItemId) {
if (parentItemId) {
set({ ...get(), parentItemId });
get().listQuery();
}
},
activatedTagId: undefined,
setActivatedTagId(activatedTagId) {
set({ ...get(), activatedTagId });
},
activateSubViewId: undefined,
setActivateSubViewId(activateSubViewId) {
const finedResView = get().resView.subViews.find((x) => x.id.toString() == activateSubViewId);
set({ ...get(), activateSubViewId, activateSubView: finedResView });
},
async setResView(resView) {
const pre = get();
// let depth = 0
//当前视图的深度为上级视图的深度+1
// if (pre.parentState) {
// const parentDepth = pre.parentState?.depth || 0
// depth = parentDepth + 1
// }
// const resView = pre.resView
if (!pre.resView.subViews) {
//嵌套视图中,还需要继续加载子视图配置，因为上级视图仅加载了他自己子视图。第三级的还没加载。
resView = await mtm_client_1.mtmClient.resView.getResViewById(pre.resView.id.toString());
// console.log("newResView:", newResView)
// set({ ...get(), resView: newResView })
}
set({ ...get(), resView });
},
...initState,
};
};
exports.createResViewSlice = createResViewSlice;