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 20:45:51 +08:00
parent 50355bc34a
commit 8f61270028
8 changed files with 61 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
lib/components/article/detail2/web.module.less
View File

@ -1,3 +1,5 @@
.container {
width: 950px;
display: flex;
flex-direction: column;
flex: 1;
}

1
lib/components/article/detail3/web.d.ts vendored
View File

@ -5,6 +5,7 @@ export default function Render(props: WebComponentProps<EntityDict, 'article', f
oakId: string;
content: string;
name: string;
width: string;
}, {
gotoArticleEdit: (articleId: string) => void;
onRemoveArticle: (id: string) => void;

8
lib/components/article/detail3/web.js
View File

@ -10,7 +10,7 @@ var editor_for_react_1 = require("@wangeditor/editor-for-react");
var web_module_less_1 = tslib_1.__importDefault(require("./web.module.less"));
function Render(props) {
var method = props.methods, data = props.data;
var _a = props.data, content = _a.content, name = _a.name, oakId = _a.oakId;
var _a = props.data, content = _a.content, name = _a.name, oakId = _a.oakId, width = _a.width;
var t = method.t, onRemoveArticle = method.onRemoveArticle, gotoArticleEdit = method.gotoArticleEdit, copy = method.copy;
var editorConfig = {
readOnly: true,
@ -23,8 +23,8 @@ function Render(props) {
setValue(content);
}
}, [content]);
return ((0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: web_module_less_1.default.rightContainer }, { children: (0, jsx_runtime_1.jsx)(antd_1.Row, { children: (0, jsx_runtime_1.jsx)(antd_1.Col, tslib_1.__assign({ xs: 24, sm: 16 }, { children: (0, jsx_runtime_1.jsx)(antd_1.Form, tslib_1.__assign({ colon: true, labelCol: { span: 4 }, wrapperCol: { span: 20 } }, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(antd_1.Form.Item, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(editor_for_react_1.Editor, { defaultConfig: editorConfig, value: value, mode: "default", style: {
width: 750
} }) }) }) }) })) })) }) })));
return ((0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: web_module_less_1.default.container }, { children: (0, jsx_runtime_1.jsx)(antd_1.Row, { children: (0, jsx_runtime_1.jsx)(antd_1.Col, tslib_1.__assign({ xs: 24, sm: 16 }, { children: (0, jsx_runtime_1.jsx)(editor_for_react_1.Editor, { defaultConfig: editorConfig, value: value, mode: "default", style: {
width: width === 'xs' ? '100vw' : 750,
} }) })) }) })));
}
exports.default = Render;

5
lib/components/article/detail3/web.module.less
View File

@ -1,3 +1,6 @@
.container {
width: 950px;
// display: flex;
// flex-direction: column;
// flex: 1;
width: 100%;
}

2
lib/pages/article/doc/web.d.ts vendored
View File

@ -25,11 +25,11 @@ export default function render(props: WebComponentProps<EntityDict, "articleMenu
articleId: string;
name: string;
isArticle: boolean;
isChildren: boolean;
logo: string;
openKeys: string[];
selectedKeys: string[];
selectedArticleId: string;
width: string;
}, {
gotoUpsert: (id?: string) => void;
gotoUpsertById: (id: string) => void;

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

@ -4,29 +4,46 @@ var tslib_1 = require("tslib");
var jsx_runtime_1 = require("react/jsx-runtime");
var antd_1 = require("antd");
var confirm = antd_1.Modal.confirm;
var react_1 = require("react");
var web_module_less_1 = tslib_1.__importDefault(require("./web.module.less"));
var useFeatures_1 = tslib_1.__importDefault(require("../../../hooks/useFeatures"));
var detail3_1 = tslib_1.__importDefault(require("../../../components/article/detail3"));
var SubMenu = antd_1.Menu.SubMenu;
var Sider = antd_1.Layout.Sider, Content = antd_1.Layout.Content;
function render(props) {
var _a = props.data, arr = _a.arr, treeData = _a.treeData, id = _a.id, parentId = _a.parentId, articleId = _a.articleId, name = _a.name, content = _a.content, oakFullpath = _a.oakFullpath, isArticle = _a.isArticle, isChildren = _a.isChildren, logo = _a.logo, openKeys = _a.openKeys, selectedKeys = _a.selectedKeys, selectedArticleId = _a.selectedArticleId;
var _b = props.methods, t = _b.t, gotoUpsert = _b.gotoUpsert, gotoUpsertById = _b.gotoUpsertById, gotoArticleUpsert = _b.gotoArticleUpsert, onRemoveArticleMenu = _b.onRemoveArticleMenu, gotoEdit = _b.gotoEdit, gotoEditByParentId = _b.gotoEditByParentId, gotoArticleEdit = _b.gotoArticleEdit, onRemoveArticle = _b.onRemoveArticle, gotoArticleEditByArticleMenuId = _b.gotoArticleEditByArticleMenuId, getOpenKeys = _b.getOpenKeys;
var _a = props.data, arr = _a.arr, treeData = _a.treeData, id = _a.id, parentId = _a.parentId, articleId = _a.articleId, name = _a.name, content = _a.content, oakFullpath = _a.oakFullpath, isArticle = _a.isArticle, logo = _a.logo, openKeys = _a.openKeys, selectedKeys = _a.selectedKeys, selectedArticleId = _a.selectedArticleId, width = _a.width;
var _b = props.methods, t = _b.t, gotoArticleUpsert = _b.gotoArticleUpsert, getOpenKeys = _b.getOpenKeys;
var features = (0, useFeatures_1.default)();
var renderMenuItems = function (data) {
var _c = tslib_1.__read((0, react_1.useState)(false), 2), open = _c[0], setOpen = _c[1];
var renderMenuItems = function (data, callback) {
return data === null || data === void 0 ? void 0 : data.map(function (menuItem) {
if (menuItem.children || menuItem.isLeaf) {
return ((0, jsx_runtime_1.jsx)(antd_1.Menu.SubMenu, tslib_1.__assign({ icon: menuItem.logo ? ((0, jsx_runtime_1.jsx)(antd_1.Image, { height: 26, width: 26, src: menuItem.logo, preview: false })) : null, title: (0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ style: { marginLeft: 8 } }, { children: menuItem.title })), onTitleClick: function (e) {
getOpenKeys(e.key, treeData, openKeys);
} }, { children: renderMenuItems(menuItem.children) }), menuItem.key));
} }, { children: renderMenuItems(menuItem.children, callback) }), menuItem.key));
}
return ((0, jsx_runtime_1.jsx)(antd_1.Menu.Item, tslib_1.__assign({ onClick: function (e) {
gotoArticleUpsert(e.key, selectedKeys);
if (typeof callback === 'function') {
callback();
}
} }, { 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: 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 }))] }))) })));
if ((treeData === null || treeData === void 0 ? void 0 : treeData.length) === 0) {
return ((0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: web_module_less_1.default.container }, { children: (0, jsx_runtime_1.jsx)(antd_1.Empty, { image: antd_1.Empty.PRESENTED_IMAGE_SIMPLE }) })));
}
if (width === 'xs') {
return ((0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: web_module_less_1.default.container }, { children: [(0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: web_module_less_1.default.article_v }, { children: [(0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: web_module_less_1.default.menu, onClick: function () {
setOpen(true);
} }, { children: "\u5E2E\u52A9\u6587\u6863" })), (0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: web_module_less_1.default.editor }, { 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 }))] })), (0, jsx_runtime_1.jsx)(antd_1.Drawer, tslib_1.__assign({ className: web_module_less_1.default.drawerPanel, open: open, onClose: function () {
setOpen(false);
}, width: 256 }, { 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, function () {
setOpen(false);
}) })) })) }))] })));
}
return ((0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: web_module_less_1.default.container }, { 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)(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 }))] })) })));
}
exports.default = render;

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

@ -1,9 +1,6 @@
.container {
background: var(--oak-bg-color-container);
// box-shadow: 0 2px 3px #0000001a;
// border-radius: 3px;
// padding: 30px 32px;
// min-height: 450px;
min-height: 100vh;
.article {
display: flex;
@ -15,13 +12,21 @@
.editor {
display: flex;
margin-left: 20px;
.rightContainer {
width: 950px;
}
}
}
.article_v {
display: flex;
flex-direction: column;
.menu {
display: flex;
}
.editor {
display: flex;
}
}
}
@ -37,6 +42,7 @@
}
}
}
.siderPanel {
flex-shrink: 0;
height: 100%;
@ -55,10 +61,13 @@
height: 100%;
overflow-y: auto;
}
.ant-layout-sider-trigger {
// text-align: left;
// padding-left: 16px;
// border-right: 1px solid var(--oak-border-color);
}
}
}
.drawerPanel {
:global {
.ant-drawer-body {
padding: 0 !important;
}
}
}

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

@ -13,7 +13,7 @@ import {
Drawer,
} from 'antd';
const { confirm } = Modal;
import type { MenuProps } from "antd";
import type { MenuProps } from "antd";
import React, { useState, useEffect, useCallback } from "react";
import classNames from "classnames";
import Style from "./web.module.less";