Oak-Team
/
oak-general-business
9
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 38 Wiki Activity

帮助文档

This commit is contained in:
qsc 2023-07-03 18:19:51 +08:00
parent 3318724ea6
commit 907c3152c0
11 changed files with 435 additions and 263 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
lib/pages/article/doc/web.js
View File

@ -25,7 +25,7 @@ function render(props) {
} }, { children: menuItem.label }), menuItem.key));
});
};
return ((0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: web_module_less_1.default.container }, { children: (treeData === null || treeData === void 0 ? void 0 : treeData.length) === 0 ? ((0, jsx_runtime_1.jsx)(antd_1.Empty, { image: antd_1.Empty.PRESENTED_IMAGE_SIMPLE })) : ((0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: web_module_less_1.default.article }, { children: [(0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: web_module_less_1.default.menu }, { children: (0, jsx_runtime_1.jsx)(Sider, tslib_1.__assign({ theme: "light", width: 256, className: web_module_less_1.default.siderPanel }, { children: (0, jsx_runtime_1.jsx)(antd_1.Menu, tslib_1.__assign({ openKeys: openKeys, selectedKeys: selectedKeys, style: { width: 256 }, mode: "inline" }, { children: renderMenuItems(treeData) })) })) })), (0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: web_module_less_1.default.editor, style: {
return ((0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: web_module_less_1.default.container }, { children: (treeData === null || treeData === void 0 ? void 0 : treeData.length) === 0 ? ((0, jsx_runtime_1.jsx)(antd_1.Empty, { image: antd_1.Empty.PRESENTED_IMAGE_SIMPLE })) : ((0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: web_module_less_1.default.article }, { children: [(0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: web_module_less_1.default.menu }, { children: (0, jsx_runtime_1.jsx)(Sider, tslib_1.__assign({ theme: "light", width: 275, className: web_module_less_1.default.siderPanel }, { children: (0, jsx_runtime_1.jsx)(antd_1.Menu, tslib_1.__assign({ openKeys: openKeys, selectedKeys: selectedKeys, style: { width: 256 }, mode: "inline" }, { children: renderMenuItems(treeData) })) })) })), (0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: web_module_less_1.default.editor, style: {
marginLeft: 300
} }, { children: (selectedArticleId === null || selectedArticleId === void 0 ? void 0 : selectedArticleId.length) > 0 ? ((0, jsx_runtime_1.jsx)(detail3_1.default, { oakAutoUnmount: true, oakId: selectedArticleId, oakPath: "$article-detail2-".concat(selectedArticleId) })) : null }))] }))) })));
}

3
lib/pages/article/doc/web.module.less
View File

@ -51,7 +51,8 @@
:global {
.ant-layout-sider-children {
height: calc(100% - 48px);
// height: calc(100% - 48px);
height: 100%;
overflow-y: auto;
}
.ant-layout-sider-trigger {

238
lib/pages/articleMenu/list/index.js
View File

@ -16,6 +16,15 @@ exports.default = OakComponent({
},
entity: 1,
entityId: 1,
article$articleMenu: {
$entity: 'article',
data: {
id: 1,
name: 1,
content: 1,
articleMenuId: 1,
}
},
extraFile$entity: {
$entity: 'extraFile',
data: {
@ -38,108 +47,149 @@ exports.default = OakComponent({
},
},
},
sorters: [
{
sorter: {
$attr: {
$$createAt$$: 1,
},
$direction: 'asc',
},
},
],
isList: true,
pagination: {
currentPage: 1,
pageSize: 20,
more: true,
},
formData: function (_a) {
var _this = this;
var articleMenu = _a.data;
var articles = articleMenu.flatMap(function (menu) {
return menu['article$articleMenu'];
});
var newArticleMenus = articleMenu === null || articleMenu === void 0 ? void 0 : articleMenu.map(function (ele) {
var _a;
return tslib_1.__assign(tslib_1.__assign({}, ele), { logo: _this.features.extraFile.getUrl((_a = ele === null || ele === void 0 ? void 0 : ele.extraFile$entity) === null || _a === void 0 ? void 0 : _a.find(function (ele) { return ele.tag1 === 'logo'; })) });
});
var newArticles = articles === null || articles === void 0 ? void 0 : articles.map(function (ele) { return ({
id: ele === null || ele === void 0 ? void 0 : ele.id,
name: ele === null || ele === void 0 ? void 0 : ele.name,
parent: ele === null || ele === void 0 ? void 0 : ele.articleMenuId,
parentId: ele === null || ele === void 0 ? void 0 : ele.articleMenuId,
isArticle: true,
type: 'article',
}); });
var arr = tslib_1.__spreadArray(tslib_1.__spreadArray([], tslib_1.__read(newArticleMenus), false), tslib_1.__read(newArticles), false);
var rootNodes = arr === null || arr === void 0 ? void 0 : arr.filter(function (node) { return !node.parent; });
var treeData = rootNodes === null || rootNodes === void 0 ? void 0 : rootNodes.map(function (rootNode) {
var _a;
return {
label: rootNode.name,
key: (_a = rootNode.id) === null || _a === void 0 ? void 0 : _a.toString(),
isArticle: rootNode.isArticle,
logo: rootNode === null || rootNode === void 0 ? void 0 : rootNode.logo,
children: _this.buildTreeData(arr, rootNode.id),
};
});
return {
articleMenu: articleMenu,
treeData: treeData,
};
},
filters: [],
lifetimes: {
ready: function () {
return tslib_1.__awaiter(this, void 0, void 0, function () {
var articles, articleMenus, newArticleMenus, newArticles, arr, rootNodes, treeData;
var _this = this;
return tslib_1.__generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, this.features.cache.refresh('article', {
data: {
id: 1,
name: 1,
content: 1,
articleMenuId: 1,
},
})];
case 1:
articles = (_a.sent()).data;
return [4 /*yield*/, this.features.cache.refresh('articleMenu', {
data: {
id: 1,
name: 1,
isArticle: 1,
isLeaf: 1,
parent: {
id: 1,
name: 1,
isArticle: 1,
isLeaf: 1,
},
extraFile$entity: {
$entity: 'extraFile',
data: {
id: 1,
tag1: 1,
origin: 1,
bucket: 1,
objectId: 1,
filename: 1,
extra1: 1,
extension: 1,
type: 1,
entity: 1,
entityId: 1,
},
filter: {
tag1: {
$in: ['logo'],
},
},
},
},
sorter: [
{
$attr: {
$$createAt$$: 1,
},
$direction: 'asc',
},
],
})];
case 2:
articleMenus = (_a.sent()).data;
newArticleMenus = articleMenus === null || articleMenus === void 0 ? void 0 : articleMenus.map(function (ele) {
var _a;
return tslib_1.__assign(tslib_1.__assign({}, ele), { logo: _this.features.extraFile.getUrl((_a = ele === null || ele === void 0 ? void 0 : ele.extraFile$entity) === null || _a === void 0 ? void 0 : _a.find(function (ele) { return ele.tag1 === 'logo'; })) });
});
newArticles = articles === null || articles === void 0 ? void 0 : articles.map(function (ele) { return ({
id: ele === null || ele === void 0 ? void 0 : ele.id,
name: ele === null || ele === void 0 ? void 0 : ele.name,
parent: ele === null || ele === void 0 ? void 0 : ele.articleMenuId,
parentId: ele === null || ele === void 0 ? void 0 : ele.articleMenuId,
isArticle: true,
type: 'article',
}); });
arr = tslib_1.__spreadArray(tslib_1.__spreadArray([], tslib_1.__read(newArticleMenus), false), tslib_1.__read(newArticles), false);
rootNodes = arr === null || arr === void 0 ? void 0 : arr.filter(function (node) { return !node.parent; });
treeData = rootNodes === null || rootNodes === void 0 ? void 0 : rootNodes.map(function (rootNode) {
var _a;
return {
label: rootNode.name,
key: (_a = rootNode.id) === null || _a === void 0 ? void 0 : _a.toString(),
isArticle: rootNode.isArticle,
logo: rootNode === null || rootNode === void 0 ? void 0 : rootNode.logo,
children: _this.buildTreeData(arr, rootNode.id),
};
});
this.setState({
treeData: treeData,
});
return [2 /*return*/];
}
});
});
},
// async ready() {
// const { data: articles } = await this.features.cache.refresh(
// 'article',
// {
// data: {
// id: 1,
// name: 1,
// content: 1,
// articleMenuId: 1,
// },
// }
// );
// const { data: articleMenus } = await this.features.cache.refresh(
// 'articleMenu',
// {
// data: {
// id: 1,
// name: 1,
// isArticle: 1,
// isLeaf: 1,
// parent: {
// id: 1,
// name: 1,
// isArticle: 1,
// isLeaf: 1,
// },
// extraFile$entity: {
// $entity: 'extraFile',
// data: {
// id: 1,
// tag1: 1,
// origin: 1,
// bucket: 1,
// objectId: 1,
// filename: 1,
// extra1: 1,
// extension: 1,
// type: 1,
// entity: 1,
// entityId: 1,
// },
// filter: {
// tag1: {
// $in: ['logo'],
// },
// },
// },
// },
// sorter: [
// {
// $attr: {
// $$createAt$$: 1,
// },
// $direction: 'asc',
// },
// ],
// }
// );
// const newArticleMenus = articleMenus?.map((ele) => {
// return {
// ...ele,
// logo: this.features.extraFile.getUrl(
// ele?.extraFile$entity?.find(
// (ele) => ele.tag1 === 'logo'
// )
// ),
// };
// });
// const newArticles = articles?.map((ele) => ({
// id: ele?.id,
// name: ele?.name,
// parent: ele?.articleMenuId,
// parentId: ele?.articleMenuId,
// isArticle: true,
// type: 'article',
// }));
// const arr: any[] = [...newArticleMenus, ...newArticles];
// const rootNodes = arr?.filter((node) => !node.parent);
// const treeData = rootNodes?.map((rootNode) => {
// return {
// label: rootNode.name,
// key: rootNode.id?.toString(),
// isArticle: rootNode.isArticle,
// logo: rootNode?.logo,
// children: this.buildTreeData(arr, rootNode.id),
// };
// });
// this.setState({
// treeData,
// })
// },
},
data: {
selectArticleMenuId: '',

5
lib/pages/articleMenu/list/web.d.ts vendored
View File

@ -15,6 +15,11 @@ export default function render(props: WebComponentProps<EntityDict, 'articleMenu
selectArticleId: string;
entity: string;
entityId: string;
pagination?: {
pageSize: number;
total: number;
currentPage: number;
};
}, {
gotoUpsertById: (id: string) => void;
gotoArticleUpsert: (articleId: string) => void;

13
lib/pages/articleMenu/list/web.js
View File

@ -8,8 +8,9 @@ var pageHeader_1 = tslib_1.__importDefault(require("../../../components/common/p
var detail_1 = tslib_1.__importDefault(require("../../../components/article/detail"));
var cell_1 = tslib_1.__importDefault(require("../../../components/articleMenu/cell"));
function render(props) {
var _a = props.data, entity = _a.entity, entityId = _a.entityId, treeData = _a.treeData, selectArticleMenuId = _a.selectArticleMenuId, selectArticleId = _a.selectArticleId, oakFullpath = _a.oakFullpath, oakLegalActions = _a.oakLegalActions;
var _b = props.methods, t = _b.t, gotoUpsertById = _b.gotoUpsertById, gotoArticleUpsert = _b.gotoArticleUpsert, onRemoveArticleMenu = _b.onRemoveArticleMenu, gotoEdit = _b.gotoEdit;
var _a = props.data, entity = _a.entity, entityId = _a.entityId, treeData = _a.treeData, selectArticleMenuId = _a.selectArticleMenuId, selectArticleId = _a.selectArticleId, oakFullpath = _a.oakFullpath, oakLegalActions = _a.oakLegalActions, oakPagination = _a.oakPagination;
var _b = props.methods, t = _b.t, gotoUpsertById = _b.gotoUpsertById, gotoArticleUpsert = _b.gotoArticleUpsert, onRemoveArticleMenu = _b.onRemoveArticleMenu, gotoEdit = _b.gotoEdit, setCurrentPage = _b.setCurrentPage, setPageSize = _b.setPageSize;
var _c = oakPagination || {}, pageSize = _c.pageSize, total = _c.total, currentPage = _c.currentPage;
var renderMenuItems = function (data) {
return data === null || data === void 0 ? void 0 : data.map(function (menuItem) {
if (menuItem.children) {
@ -29,6 +30,12 @@ function render(props) {
};
return ((0, jsx_runtime_1.jsx)(pageHeader_1.default, tslib_1.__assign({ title: "\u5206\u7C7B\u7BA1\u7406" }, { children: (0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: web_module_less_1.default.container }, { children: [(0, jsx_runtime_1.jsx)(antd_1.Space, tslib_1.__assign({ style: { marginBottom: 16 } }, { children: (0, jsx_runtime_1.jsx)(antd_1.Button, tslib_1.__assign({ type: "primary", onClick: function () {
gotoEdit();
} }, { children: "\u65B0\u589E" })) })), (treeData === null || treeData === void 0 ? void 0 : treeData.length) === 0 ? ((0, jsx_runtime_1.jsx)(antd_1.Empty, { image: antd_1.Empty.PRESENTED_IMAGE_SIMPLE })) : ((0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: web_module_less_1.default.article }, { children: [(0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: web_module_less_1.default.menu }, { children: (0, jsx_runtime_1.jsx)(antd_1.Menu, tslib_1.__assign({ style: { width: 256 }, mode: "inline" }, { children: renderMenuItems(treeData) })) })), (0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: web_module_less_1.default.editor }, { children: [selectArticleMenuId ? ((0, jsx_runtime_1.jsx)(cell_1.default, { oakAutoUnmount: true, oakId: selectArticleMenuId, oakPath: "$articleMenu-cell-".concat(selectArticleMenuId), entity: entity, entityId: entityId })) : null, selectArticleId ? ((0, jsx_runtime_1.jsx)(detail_1.default, { oakAutoUnmount: true, oakId: selectArticleId, oakPath: "$article-detail-".concat(selectArticleId) })) : null] }))] })))] })) })));
} }, { children: "\u65B0\u589E" })) })), (treeData === null || treeData === void 0 ? void 0 : treeData.length) === 0 ? ((0, jsx_runtime_1.jsx)(antd_1.Empty, { image: antd_1.Empty.PRESENTED_IMAGE_SIMPLE })) : ((0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: web_module_less_1.default.rightContent }, { children: [(0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: web_module_less_1.default.article }, { children: [(0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: web_module_less_1.default.menu }, { children: (0, jsx_runtime_1.jsx)(antd_1.Menu, tslib_1.__assign({ style: { width: 256 }, mode: "inline" }, { children: renderMenuItems(treeData) })) })), (0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: web_module_less_1.default.editor }, { children: [selectArticleMenuId ? ((0, jsx_runtime_1.jsx)(cell_1.default, { oakAutoUnmount: true, oakId: selectArticleMenuId, oakPath: "$articleMenu-cell-".concat(selectArticleMenuId), entity: entity, entityId: entityId })) : null, selectArticleId ? ((0, jsx_runtime_1.jsx)(detail_1.default, { oakAutoUnmount: true, oakId: selectArticleId, oakPath: "$article-detail-".concat(selectArticleId) })) : null] }))] })), (0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: web_module_less_1.default.pagination }, { children: (0, jsx_runtime_1.jsx)(antd_1.Pagination, { className: web_module_less_1.default.pagination, total: total, current: currentPage || 1, pageSize: 20,
// pageSizeOptions={pageSize}
onChange: function (current) {
setCurrentPage(current);
}, onShowSizeChange: function (pageSize) {
setPageSize(pageSize);
} }) }))] })))] })) })));
}
exports.default = render;

44
lib/pages/articleMenu/list/web.module.less
View File

@ -3,26 +3,38 @@
box-shadow: 0 2px 3px #0000001a;
border-radius: 3px;
padding: 30px 32px;
.article {
.rightContent {
display: flex;
flex-direction: row;
flex: 1;
flex-direction: column;
.menu {
display: flex;
}
.editor {
display: flex;
flex: 1;
margin-left: 20px;
.rightContainer {
width: 950px;
.article {
display: flex;
flex-direction: row;
flex: 1;
.menu {
display: flex;
}
.editor {
display: flex;
flex: 1;
margin-left: 20px;
.rightContainer {
// width: 950px;
}
}
}
.pagination {
display: flex;
align-items: flex-end;
justify-content: center;
}
}
}
@ -40,4 +52,4 @@
flex: 1;
}
}
}
}

3
src/pages/article/doc/web.module.less
View File

@ -51,7 +51,8 @@
:global {
.ant-layout-sider-children {
height: calc(100% - 48px);
// height: calc(100% - 48px);
height: 100%;
overflow-y: auto;
}
.ant-layout-sider-trigger {

2
src/pages/article/doc/web.tsx
View File

@ -158,7 +158,7 @@ export default function render(
<div className={Style.menu}>
<Sider
theme="light"
width={256}
width={275}
className={Style.siderPanel}
>
<Menu

253
src/pages/articleMenu/list/index.ts
View File

@ -23,6 +23,15 @@ export default OakComponent({
},
entity: 1,
entityId: 1,
article$articleMenu: {
$entity: 'article',
data: {
id: 1,
name: 1,
content: 1,
articleMenuId: 1,
}
},
extraFile$entity: {
$entity: 'extraFile',
data: {
@ -45,106 +54,154 @@ export default OakComponent({
},
},
},
sorters: [
{
sorter: {
$attr: {
$$createAt$$: 1,
},
$direction: 'asc',
},
},
],
isList: true,
pagination: {
currentPage: 1,
pageSize: 20,
more: true,
},
formData({ data: articleMenu }) {
const articles = articleMenu.flatMap(function (menu) {
return menu['article$articleMenu'];
});
const newArticleMenus = articleMenu?.map((ele) => {
return {
...ele,
logo: this.features.extraFile.getUrl(
ele?.extraFile$entity?.find(
(ele) => ele.tag1 === 'logo'
)
),
};
});
const newArticles = articles?.map((ele) => ({
id: ele?.id,
name: ele?.name,
parent: ele?.articleMenuId,
parentId: ele?.articleMenuId,
isArticle: true,
type: 'article',
}));
const arr: any[] = [...newArticleMenus, ...newArticles];
const rootNodes = arr?.filter((node) => !node.parent);
const treeData = rootNodes?.map((rootNode) => {
return {
label: rootNode.name,
key: rootNode.id?.toString(),
isArticle: rootNode.isArticle,
logo: rootNode?.logo,
children: this.buildTreeData(arr, rootNode.id),
};
});
return {
articleMenu,
treeData,
};
},
filters: [],
lifetimes: {
async ready() {
const { data: articles } = await this.features.cache.refresh(
'article',
{
data: {
id: 1,
name: 1,
content: 1,
articleMenuId: 1,
},
}
);
const { data: articleMenus } = await this.features.cache.refresh(
'articleMenu',
{
data: {
id: 1,
name: 1,
isArticle: 1,
isLeaf: 1,
parent: {
id: 1,
name: 1,
isArticle: 1,
isLeaf: 1,
},
extraFile$entity: {
$entity: 'extraFile',
data: {
id: 1,
tag1: 1,
origin: 1,
bucket: 1,
objectId: 1,
filename: 1,
extra1: 1,
extension: 1,
type: 1,
entity: 1,
entityId: 1,
},
filter: {
tag1: {
$in: ['logo'],
},
},
},
},
sorter: [
{
$attr: {
$$createAt$$: 1,
},
$direction: 'asc',
},
],
}
);
// async ready() {
// const { data: articles } = await this.features.cache.refresh(
// 'article',
// {
// data: {
// id: 1,
// name: 1,
// content: 1,
// articleMenuId: 1,
// },
// }
// );
// const { data: articleMenus } = await this.features.cache.refresh(
// 'articleMenu',
// {
// data: {
// id: 1,
// name: 1,
// isArticle: 1,
// isLeaf: 1,
// parent: {
// id: 1,
// name: 1,
// isArticle: 1,
// isLeaf: 1,
// },
// extraFile$entity: {
// $entity: 'extraFile',
// data: {
// id: 1,
// tag1: 1,
// origin: 1,
// bucket: 1,
// objectId: 1,
// filename: 1,
// extra1: 1,
// extension: 1,
// type: 1,
// entity: 1,
// entityId: 1,
// },
// filter: {
// tag1: {
// $in: ['logo'],
// },
// },
// },
// },
// sorter: [
// {
// $attr: {
// $$createAt$$: 1,
// },
// $direction: 'asc',
// },
// ],
// }
// );
const newArticleMenus = articleMenus?.map((ele) => {
return {
...ele,
logo: this.features.extraFile.getUrl(
ele?.extraFile$entity?.find(
(ele) => ele.tag1 === 'logo'
)
),
};
});
const newArticles = articles?.map((ele) => ({
id: ele?.id,
name: ele?.name,
parent: ele?.articleMenuId,
parentId: ele?.articleMenuId,
isArticle: true,
type: 'article',
}));
const arr: any[] = [...newArticleMenus, ...newArticles];
const rootNodes = arr?.filter((node) => !node.parent);
const treeData = rootNodes?.map((rootNode) => {
return {
label: rootNode.name,
key: rootNode.id?.toString(),
isArticle: rootNode.isArticle,
logo: rootNode?.logo,
children: this.buildTreeData(arr, rootNode.id),
};
});
this.setState({
treeData,
})
},
// const newArticleMenus = articleMenus?.map((ele) => {
// return {
// ...ele,
// logo: this.features.extraFile.getUrl(
// ele?.extraFile$entity?.find(
// (ele) => ele.tag1 === 'logo'
// )
// ),
// };
// });
// const newArticles = articles?.map((ele) => ({
// id: ele?.id,
// name: ele?.name,
// parent: ele?.articleMenuId,
// parentId: ele?.articleMenuId,
// isArticle: true,
// type: 'article',
// }));
// const arr: any[] = [...newArticleMenus, ...newArticles];
// const rootNodes = arr?.filter((node) => !node.parent);
// const treeData = rootNodes?.map((rootNode) => {
// return {
// label: rootNode.name,
// key: rootNode.id?.toString(),
// isArticle: rootNode.isArticle,
// logo: rootNode?.logo,
// children: this.buildTreeData(arr, rootNode.id),
// };
// });
// this.setState({
// treeData,
// })
// },
},
data: {
selectArticleMenuId: '',
@ -152,8 +209,8 @@ export default OakComponent({
treeData: [] as DataNode[],
},
properties: {
entity: '',
entityId: '',
entity: '',
entityId: '',
},
actions: ['create', 'update', 'remove'],
methods: {
@ -190,10 +247,10 @@ export default OakComponent({
});
},
async gotoArticleUpsert(articleId: string) {
this.setState({
selectArticleId: articleId,
selectArticleMenuId: '',
});
this.setState({
selectArticleId: articleId,
selectArticleMenuId: '',
});
},
gotoEdit(id?: string) {
if (id) {

44
src/pages/articleMenu/list/web.module.less
View File

@ -3,26 +3,38 @@
box-shadow: 0 2px 3px #0000001a;
border-radius: 3px;
padding: 30px 32px;
.article {
.rightContent {
display: flex;
flex-direction: row;
flex: 1;
flex-direction: column;
.menu {
display: flex;
}
.editor {
display: flex;
flex: 1;
margin-left: 20px;
.rightContainer {
width: 950px;
.article {
display: flex;
flex-direction: row;
flex: 1;
.menu {
display: flex;
}
.editor {
display: flex;
flex: 1;
margin-left: 20px;
.rightContainer {
// width: 950px;
}
}
}
.pagination {
display: flex;
align-items: flex-end;
justify-content: center;
}
}
}
@ -40,4 +52,4 @@
flex: 1;
}
}
}
}

91
src/pages/articleMenu/list/web.tsx
View File

@ -1,5 +1,5 @@
import React, { useState, useEffect, useCallback } from "react";
import { Space, Button, Menu, Image, Empty } from 'antd';
import { Space, Button, Menu, Image, Empty, Pagination } from 'antd';
import classNames from "classnames";
import Style from "./web.module.less";
import { WebComponentProps } from "oak-frontend-base";
@ -10,11 +10,11 @@ import ArticleMenuCell from '../../../components/articleMenu/cell';
interface DataNode {
label: string;
title: string;
key: string;
isArticle?: boolean;
children?: DataNode[];
label: string;
title: string;
key: string;
isArticle?: boolean;
children?: DataNode[];
}
export default function render(
props: WebComponentProps<
@ -29,6 +29,11 @@ export default function render(
selectArticleId: string;
entity: string;
entityId: string;
pagination?: {
pageSize: number;
total: number;
currentPage: number;
};
},
{
gotoUpsertById: (id: string) => void;
@ -46,6 +51,7 @@ export default function render(
selectArticleId,
oakFullpath,
oakLegalActions,
oakPagination,
} = props.data;
const {
t,
@ -53,7 +59,10 @@ export default function render(
gotoArticleUpsert,
onRemoveArticleMenu,
gotoEdit,
setCurrentPage,
setPageSize,
} = props.methods;
const { pageSize, total, currentPage } = oakPagination || {};
const renderMenuItems = (data: any) => {
return data?.map((menuItem: any) => {
if (menuItem.children) {
@ -87,7 +96,7 @@ export default function render(
<Menu.Item
key={menuItem.key}
onClick={(e) => {
if (menuItem.type === 'article') {
if (menuItem.type === 'article') {
gotoArticleUpsert(e.key);
} else {
gotoUpsertById(e.key);
@ -115,33 +124,51 @@ export default function render(
{treeData?.length === 0 ? (
<Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
) : (
<div className={Style.article}>
<div className={Style.menu}>
<Menu
style={{ width: 256 }}
mode="inline"
>
{renderMenuItems(treeData)}
</Menu>
<div className={Style.rightContent}>
<div className={Style.article}>
<div className={Style.menu}>
<Menu
style={{ width: 256 }}
mode="inline"
>
{renderMenuItems(treeData)}
</Menu>
</div>
<div className={Style.editor}>
{selectArticleMenuId ? (
<ArticleMenuCell
oakAutoUnmount={true}
oakId={selectArticleMenuId}
oakPath={`$articleMenu-cell-${selectArticleMenuId}`}
entity={entity}
entityId={entityId}
/>
) : null}
{selectArticleId ? (
<ArticleDetail
oakAutoUnmount={true}
oakId={selectArticleId}
oakPath={`$article-detail-${selectArticleId}`}
/>
) : null}
</div>
</div>
<div className={Style.editor}>
{selectArticleMenuId ? (
<ArticleMenuCell
oakAutoUnmount={true}
oakId={selectArticleMenuId}
oakPath={`$articleMenu-cell-${selectArticleMenuId}`}
entity={entity}
entityId={entityId}
<div className={Style.pagination}>
<Pagination
className={Style.pagination}
total={total}
current={currentPage || 1}
pageSize={20}
// pageSizeOptions={pageSize}
onChange={(current) => {
setCurrentPage(current);
}}
onShowSizeChange={(pageSize) => {
setPageSize(pageSize);
}}
/>
) : null}
{selectArticleId ? (
<ArticleDetail
oakAutoUnmount={true}
oakId={selectArticleId}
oakPath={`$article-detail-${selectArticleId}`}
/>
) : null}
</div>
</div>
</div>
)}
</div>