Skip to content

A
app-manage-console
提交 47889177 authored 作者: vipcxj's avatar vipcxj
浏览文件
操作

文档模块改为动态加载

上级 ebe802bf
显示空白字符变更
内嵌 并排
正在显示 包含 116 行增加 和 63 行删除
package-lock.json
浏览文件 @ 47889177
...@@ -17276,9 +17276,9 @@ ...@@ -17276,9 +17276,9 @@
} }
}, },
"react-async-wrapper": { "react-async-wrapper": {
"version": "1.0.4", "version": "1.0.5",
"resolved": "https://registry.npmjs.org/react-async-wrapper/-/react-async-wrapper-1.0.4.tgz", "resolved": "https://registry.npmjs.org/react-async-wrapper/-/react-async-wrapper-1.0.5.tgz",
"integrity": "sha512-gHY931fE8/8Oqj6mzN6NhGUcJuJ5noYTtXhieZY/NQtKBhD7EAEMl75lZDEKqsoBx+q7Yqhu3qwEJdQBG1yvvw==", "integrity": "sha512-I56yhQARAtOVQH2sjD1BYGt9pBgbYrD0WeBoyyzgG7i+FB3nuu2hd1mVYY5Rp1jf6T8wni31un5x52ckUak4lQ==",
"requires": { "requires": {
"hoist-non-react-statics": "^2.5.0", "hoist-non-react-statics": "^2.5.0",
"is-promise": "^2.1.0" "is-promise": "^2.1.0"
......
package.json
浏览文件 @ 47889177
...@@ -35,7 +35,7 @@ ...@@ -35,7 +35,7 @@
"moment": "^2.22.1", "moment": "^2.22.1",
"prop-types": "^15.6.1", "prop-types": "^15.6.1",
"react": "^16.3.2", "react": "^16.3.2",
"react-async-wrapper": "^1.0.4", "react-async-wrapper": "^1.0.5",
"react-dom": "^16.3.2", "react-dom": "^16.3.2",
"react-json-view": "^1.16.1", "react-json-view": "^1.16.1",
"react-markdown": "^3.3.0", "react-markdown": "^3.3.0",
......
src/routes/main/modules/api-doc/dynamic-interface/index.js
浏览文件 @ 47889177
import { makeAsync } from 'react-async-wrapper'; import React from 'react';
import md from '../markdown'; import cs from 'classnames';
import ReactMarkdown from 'react-markdown';
import { Spin } from 'antd';
import { AsyncComponent } from 'react-async-wrapper';
import { userApi } from '../../../../../services/interfaces';
import Code from '../code';
import styles from '../markdown.less';
import { processError } from '../../../../../utils/error';
export default (match) => { const MarkDownWithLoading = ({ loading, source, height }) => (
const linkBase = `${match.url}/dynamic-interface`; <Spin spinning={loading} style={{ height, maxHeight: height }}>
const pathBase = `${match.path}/dynamic-interface`; <ReactMarkdown
return [ source={source}
['addFamily', '新增两清'], className={cs({
['addHouse', '新增房屋'], 'markdown-body': true,
['addPeople', '新增人口'], [styles.markdown]: true,
['approveXieYi', '协议报审'], })}
['getClerks', '获取经办人'], renderers={{
['getXieYiPdf', '获取协议pdf'], code: Code,
['importFangYuan', '导入房源'], }}
['isLiangQingLocked', '查询两清是否锁定'], />
['isXieYiApproved', '查询协议是否审核'], </Spin>
['isXieYiLocked', '查询协议是否锁定'], );
['lockLiangQing', '锁定两清'],
['lockXieYi', '锁定协议'], export default (match, infoes, size) => {
['removeFamily', '删除两清'], const pathBase = `${match.path}/interface`;
['removeFangYuan', '删除房源'], // return [
['removeHouse', '删除房屋'], // ['addFamily', '新增两清'],
['removePeople', '删除人口'], // ['addHouse', '新增房屋'],
['requestCancelXieYi', '申请撤销协议'], // ['addPeople', '新增人口'],
['requestUnLockLiangQing', '申请解锁两清'], // ['approveXieYi', '协议报审'],
['updateFamily', '更新两清'], // ['getClerks', '获取经办人'],
['updateHouse', '更新房屋'], // ['getXieYiPdf', '获取协议pdf'],
['updatePeople', '更新人口'], // ['importFangYuan', '导入房源'],
['updateXieYi', '更新协议'], // ['isLiangQingLocked', '查询两清是否锁定'],
['whetherCancelXieYi', '是否协议已撤销'], // ['isXieYiApproved', '查询协议是否审核'],
['whetherUnLockLiangQing', '是否两清已解锁'], // ['isXieYiLocked', '查询协议是否锁定'],
].map(([name, showName]) => ({ // ['lockLiangQing', '锁定两清'],
// ['lockXieYi', '锁定协议'],
// ['removeFamily', '删除两清'],
// ['removeFangYuan', '删除房源'],
// ['removeHouse', '删除房屋'],
// ['removePeople', '删除人口'],
// ['requestCancelXieYi', '申请撤销协议'],
// ['requestUnLockLiangQing', '申请解锁两清'],
// ['updateFamily', '更新两清'],
// ['updateHouse', '更新房屋'],
// ['updatePeople', '更新人口'],
// ['updateXieYi', '更新协议'],
// ['whetherCancelXieYi', '是否协议已撤销'],
// ['whetherUnLockLiangQing', '是否两清已解锁'],
// ]
return infoes.map(({ name, showName }) => ({
name, name,
showName, showName: showName || name,
link: `${linkBase}/${name}`, key: `interface/${name}`,
path: `${pathBase}/${name}`, path: `${pathBase}/${name}`,
component: makeAsync({})(import(`./${name}.md`).then(content => content.default || content).then(md)), // component: makeAsync({})(import(`./${name}.md`).then(content => content.default || content).then(md)),
render: () => (
<div style={{
padding: 12,
background: '#fafafa',
width: '100%',
height: size.height,
overflow: 'scroll',
}}
>
<AsyncComponent
batch
onError={processError}
asyncProps={{
source: async () => userApi.getInterfaceDocument(name),
}}
>
<MarkDownWithLoading height={size.height - 24} />
</AsyncComponent>
</div>
),
})); }));
}; };
src/routes/main/modules/api-doc/index.less
浏览文件 @ 47889177
...@@ -16,8 +16,11 @@ ...@@ -16,8 +16,11 @@
} }
} }
.leftMenu { .leftMenu {
width:250px; width:300px;
height: 100%; height: 100%;
padding-top: 12px;
padding-bottom: 12px;
padding-left: 8px;
float: left; float: left;
overflow-y: scroll; overflow-y: scroll;
} }
......
src/routes/main/modules/api-doc/main.js
浏览文件 @ 47889177
/* eslint-disable no-undef */ /* eslint-disable no-undef */
import React from 'react'; import React from 'react';
import cs from 'classnames'; import { Spin, Tree } from 'antd';
import { Link, Route, Switch } from 'dva/router'; import { connect } from 'dva';
import { Route, Switch, routerRedux } from 'dva/router';
import { makeAsync } from 'react-async-wrapper';
import 'github-markdown-css'; import 'github-markdown-css';
import { withSize } from '../../../../components/hoc/size'; import { withSize } from '../../../../components/hoc/size';
import { userApi } from '../../../../services/interfaces';
import { processError } from '../../../../utils/error';
import styles from './index.less'; import styles from './index.less';
import mdIndex from './index.md'; import mdIndex from './index.md';
import mdAuth from './auth.md'; import mdAuth from './auth.md';
...@@ -12,34 +16,31 @@ import mdDyInt from './dynamic-interface/index.md'; ...@@ -12,34 +16,31 @@ import mdDyInt from './dynamic-interface/index.md';
import createPages from './dynamic-interface'; import createPages from './dynamic-interface';
import md from './markdown'; import md from './markdown';
const TreeNode = Tree.TreeNode;
class DocMainPage extends React.PureComponent { class DocMainPage extends React.PureComponent {
onSelect = match => (key) => {
this.props.dispatch(routerRedux.push(`${match.url}/${key}`));
};
render() { render() {
const { match, size } = this.props; const { match, size, infoes, loading } = this.props;
const pages = createPages(match); const pages = loading ? [] : createPages(match, infoes, size);
return ( return (
<Spin spinning={loading} style={{ height: size.height, maxHeight: size.height }}>
<div className={styles.main} style={{ height: size.height }}> <div className={styles.main} style={{ height: size.height }}>
<div className={cs('markdown-body', styles.leftMenu)}> <div className={styles.leftMenu}>
<ul className={styles.catalogue}> <Tree defaultExpandAll onSelect={this.onSelect(match)}>
<li> <TreeNode title="前置说明" key="index" />
<Link to={`${match.url}/index`}>前置说明</Link> <TreeNode title="登录与认证" key="auth" />
</li> <TreeNode title="作用域" key="domain" />
<li> <TreeNode title="动态接口" key="interface">
<Link to={`${match.url}/auth`}>登录与认证</Link>
</li>
<li>
<Link to={`${match.url}/domain`}>作用域</Link>
</li>
<li>
<Link to={`${match.url}/dynamic-interface`}>动态接口</Link>
<ul>
{ {
pages.map(page => ( pages.map(page => (
<li key={page.name}><Link to={page.link}>{ page.showName }</Link></li> <TreeNode title={page.showName} key={page.key} />
)) ))
} }
</ul> </TreeNode>
</li> </Tree>
</ul>
</div> </div>
<div className={styles.contents}> <div className={styles.contents}>
<Switch> <Switch>
...@@ -49,14 +50,21 @@ class DocMainPage extends React.PureComponent { ...@@ -49,14 +50,21 @@ class DocMainPage extends React.PureComponent {
<Route path={`${match.path}/dynamic-interface`} exact component={md(mdDyInt)} /> <Route path={`${match.path}/dynamic-interface`} exact component={md(mdDyInt)} />
{ {
pages.map(page => ( pages.map(page => (
<Route key={page.name} path={page.path} component={page.component} /> <Route key={page.name} path={page.path} render={page.render} />
)) ))
} }
</Switch> </Switch>
</div> </div>
</div> </div>
</Spin>
); );
} }
} }
export default withSize(DocMainPage); export default makeAsync({
batch: true,
onError: processError,
asyncProps: {
infoes: async () => userApi.getAllInterfaceInfoes(),
},
})(withSize(connect()(DocMainPage)));
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论