提交 d4bc4b5d authored 作者: vipcxj's avatar vipcxj

1. fix:临时修复面包屑问题

2. add:增加api文档模块
上级 b6d22c63
...@@ -16375,9 +16375,9 @@ ...@@ -16375,9 +16375,9 @@
"integrity": "sha512-H0nT+KHADICdFgflNZ0A6+EBcExajxY8XM100tKOT5Oidhdo/0bAi26ffBhraEls4FIi8Lm4917tMq8LIWN7Qg==" "integrity": "sha512-H0nT+KHADICdFgflNZ0A6+EBcExajxY8XM100tKOT5Oidhdo/0bAi26ffBhraEls4FIi8Lm4917tMq8LIWN7Qg=="
}, },
"react-async-wrapper": { "react-async-wrapper": {
"version": "0.0.7", "version": "0.1.0",
"resolved": "https://registry.npmjs.org/react-async-wrapper/-/react-async-wrapper-0.0.7.tgz", "resolved": "https://registry.npmjs.org/react-async-wrapper/-/react-async-wrapper-0.1.0.tgz",
"integrity": "sha512-NMFd94ES0KUoHWYFu+cgYsYyiaVSfblYOgHMeWxxYJ/lPoN64o1Ad8bkhe+HcEIYEhZ8AhlO5F2CvCTNj0on2Q==", "integrity": "sha512-Bd/Azo0X1Qd+KCUUAOi9+H2y7YqX9XV3gJkd5H1uBgA7ZSr/9HIdIj/1VnIuwojLgnOPDHt6aqEBs7mfgIJFHw==",
"requires": { "requires": {
"is-promise": "2.1.0" "is-promise": "2.1.0"
} }
...@@ -16641,13 +16641,13 @@ ...@@ -16641,13 +16641,13 @@
} }
}, },
"react-router-4-compat": { "react-router-4-compat": {
"version": "0.1.4", "version": "0.1.8",
"resolved": "https://registry.npmjs.org/react-router-4-compat/-/react-router-4-compat-0.1.4.tgz", "resolved": "https://registry.npmjs.org/react-router-4-compat/-/react-router-4-compat-0.1.8.tgz",
"integrity": "sha512-ZDsQsrIf4yohd/wSNz5s9E9mh+PdgOrymIY28Xqz+cWWJR6x8S9OCeL41kutWIwfzvp481akbgasnegPw+inbQ==", "integrity": "sha512-n79qyA2kq7fF8OXeDrkUwoJ9/lN9vv+Q/ehwpL2eewYY63+CUlNeBlL5uqbSLODPIAUvqzC0vqoFa7kQZTbJMg==",
"requires": { "requires": {
"hoist-non-react-statics": "2.5.0", "hoist-non-react-statics": "2.5.0",
"invariant": "2.2.4", "invariant": "2.2.4",
"react-async-wrapper": "0.0.7" "react-async-wrapper": "0.1.0"
} }
}, },
"react-router-dom": { "react-router-dom": {
......
...@@ -28,11 +28,11 @@ ...@@ -28,11 +28,11 @@
"moment": "^2.18.1", "moment": "^2.18.1",
"prop-types": "^15.6.1", "prop-types": "^15.6.1",
"react": "^16.2.0", "react": "^16.2.0",
"react-async-wrapper": "^0.0.7", "react-async-wrapper": "^0.1.0",
"react-dom": "^16.2.0", "react-dom": "^16.2.0",
"react-json-view": "^1.11.4", "react-json-view": "^1.11.4",
"react-markdown": "^3.3.0", "react-markdown": "^3.3.0",
"react-router-4-compat": "^0.1.4", "react-router-4-compat": "^0.1.8",
"resolve-pathname": "^2.1.0", "resolve-pathname": "^2.1.0",
"uuid": "^3.1.0", "uuid": "^3.1.0",
"word-wrap": "^1.2.3", "word-wrap": "^1.2.3",
......
/* eslint-disable */ /* eslint-disable */
export default [{ export default [/*{
name: 'test-menu', name: 'test-menu',
showName: '测试', showName: '测试',
modules: [{ modules: [{
...@@ -9,4 +9,4 @@ export default [{ ...@@ -9,4 +9,4 @@ export default [{
route: 'api-doc', route: 'api-doc',
}, },
}], }],
}]; }*/];
/* eslint-disable no-param-reassign */
import React from 'react'; import React from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { Menu, Breadcrumb, Icon } from 'antd'; import { Menu, Breadcrumb, Icon } from 'antd';
import { connect } from 'dva'; import { connect } from 'dva';
import { Link } from 'dva/router'; import { Link } from 'dva/router';
import styles from './header.less'; import styles from './header.less';
import { makePath } from '../../utils/helper';
const SubMenu = Menu.SubMenu; const SubMenu = Menu.SubMenu;
const normRoutes = (routes) => {
if (routes && routes.length > 0) {
const out = [];
let base = '/';
for (let i = 0; i < routes.length; ++i) {
const route = routes[i];
if (route.path) {
base = makePath(base, route.path, false);
if (out.length === 0 || out[out.length - 1].path !== base) {
out.push({ ...route, path: base });
}
}
}
return out;
}
return routes;
};
// const makeRelativePath = (base, path) => {
// if (path === undefined || path === null || !base || !base.startsWith('/')) {
// throw new Error(`Invalid arguments: '${base}' / '${path}'`);
// }
// if (!path.startsWith('/')) {
// return path;
// }
// if (!base.endsWith('/')) {
// base = `${base}/`;
// }
// if (base.length > path.length) {
// if (base === `${path}/`) {
// return '';
// }
// throw new Error(`Invalid arguments: '${base}' / '${path}'`);
// }
// if (path.startsWith(base)) {
// return path.slice(base.length);
// }
// throw new Error(`Invalid arguments: '${base}' / '${path}'`);
// };
//
// const normRoutes2 = (routes) => {
// if (routes && routes.length > 0) {
// const out = [];
// let base = '/';
// for (let i = 0; i < routes.length; ++i) {
// const route = routes[i];
// const path = route.path || '';
// const newBase = makePath(base, path);
// if (out.length === 0 || out[out.length - 1].path !== newBase) {
// if (path === '/') {
// out.push(route);
// } else {
// out.push({ ...route, path: makeRelativePath(base, path) });
// }
// }
// base = newBase;
// }
// return out;
// }
// return routes;
// };
class HeaderPane extends React.Component { class HeaderPane extends React.Component {
componentDidMount() { componentDidMount() {
...@@ -17,6 +81,7 @@ class HeaderPane extends React.Component { ...@@ -17,6 +81,7 @@ class HeaderPane extends React.Component {
} }
render() { render() {
const { dispatch, user, domain, domainList, routes, params } = this.props; const { dispatch, user, domain, domainList, routes, params } = this.props;
const nRoutes = normRoutes(routes);
const userTitle = ( const userTitle = (
<span> <span>
<Icon type="user" /> <Icon type="user" />
...@@ -37,20 +102,15 @@ class HeaderPane extends React.Component { ...@@ -37,20 +102,15 @@ class HeaderPane extends React.Component {
} }
}; };
const joinPath = (paths) => { const joinPath = (paths) => {
return (paths || []).map((path) => { if (paths && paths.length > 0) {
let out = path; // eslint-disable-next-line
if (out.startsWith('/')) { return `/${paths[paths.length - 1]}`;
out = out.substring(1);
} }
if (out.endsWith('/')) { return '/';
out = out.substring(0, out.length - 1);
}
return out;
}).join('/');
}; };
const breadsProps = { const breadsProps = {
className: styles.breads, className: styles.breads,
routes, routes: nRoutes,
params, params,
itemRender(route, _params, _routes, paths) { itemRender(route, _params, _routes, paths) {
if (!paths || !paths.length) { if (!paths || !paths.length) {
...@@ -60,7 +120,7 @@ class HeaderPane extends React.Component { ...@@ -60,7 +120,7 @@ class HeaderPane extends React.Component {
return <Icon type="home" />; return <Icon type="home" />;
} }
const bread = route.name ? route.name : route.path; const bread = route.name ? route.name : route.path;
return <Link to={`/${joinPath(paths)}`}>{ bread }</Link>; return <Link to={joinPath(paths)}>{ bread }</Link>;
}, },
}; };
const menuProps = { const menuProps = {
......
...@@ -8,6 +8,10 @@ ...@@ -8,6 +8,10 @@
float: left; float: left;
margin-left: 16px; margin-left: 16px;
} }
:global .ant-breadcrumb {
line-height: inherit;
font-size: 12px;
}
.menu { .menu {
float: right; float: right;
......
import React from 'react'; // import React from 'react';
import { connect } from 'dva'; import { connect } from 'dva';
import ReactMarkdown from 'react-markdown'; // import mdIndex from './index.md';
import 'github-markdown-css'; // import mdAuth from './auth.md';
import mdIndex from './index.md';
import mdAuth from './auth.md';
import route from '../../../../components/hoc/routes'; import route from '../../../../components/hoc/routes';
import Main from './main';
const md = mdString => () => <ReactMarkdown className="markdown-body" source={mdString} />; // const md = mdString => () => (
// <div style={{
// padding: '1em',
// background: '#fafafa',
// }}
// >
// <ReactMarkdown className="markdown-body" source={mdString} />
// </div>
// );
export default connect(({ apiDoc }) => ({ apiDoc }))(route({ export default connect(({ apiDoc }) => ({ apiDoc }))(route({
indexRoute: { childRoutes: [{
component: md(mdIndex), path: 'main',
}, name: '文档',
childRoutes: [ component: Main,
{ }],
path: 'auth',
name: '登录与验证',
component: md(mdAuth),
},
],
})); }));
.main {
width:100%;
height: 100%;
margin:0 auto;
overflow:auto;
_display:inline-block;
.catalogue {
width:200px;
height: 100%;
float:left;
background:#6F0;
}
.contents {
margin-left: 200px;
height: 100%;
background:#FC0;
}
}
# API Document
# 前置说明 # 前置说明
1. 接口的返回基本都是json格式,并且有如下形式: 1. 接口的返回基本都是json格式,并且有如下形式:
...@@ -28,7 +26,3 @@ ...@@ -28,7 +26,3 @@
所以返回的json数据里部分属性可能以引用的形式存在。需要进一步解析。 所以返回的json数据里部分属性可能以引用的形式存在。需要进一步解析。
若使用java,可以用fastjson的[JSONPath](https://github.com/alibaba/fastjson/wiki/JSONPath)来进行解析。 若使用java,可以用fastjson的[JSONPath](https://github.com/alibaba/fastjson/wiki/JSONPath)来进行解析。
若使用javascript,可以用npm上的一个库[fastjson_ref_resolver](https://www.npmjs.com/package/fastjson_ref_resolver)来进一步处理。 若使用javascript,可以用npm上的一个库[fastjson_ref_resolver](https://www.npmjs.com/package/fastjson_ref_resolver)来进一步处理。
## 目录
- [登录与验证](auth)
/* eslint-disable no-undef */
import React from 'react';
import { Link, Route, Switch } from 'dva/router';
import { Affix } from 'antd';
import ReactMarkdown from 'react-markdown';
import 'github-markdown-css';
import styles from './index.less';
import mdIndex from './index.md';
import mdAuth from './auth.md';
import mdDyInt from './dynamic-interface.md';
const md = mdString => props => (
<div style={{
padding: '1em',
background: '#fafafa',
}}
>
<ReactMarkdown {...props} className="markdown-body" source={mdString} />
</div>
);
class DocMainPage extends React.Component {
render() {
const { match } = this.props;
return (
<div className={styles.main} ref={(node) => { this.container = node && node.parentElement; }}>
<Affix target={() => this.container}>
<ul className={styles.catalogue}>
<li>
<Link to={`${match.url}/index`}>前置说明</Link>
</li>
<li>
<Link to={`${match.url}/auth`}>登录与认证</Link>
</li>
<li>
<Link to={`${match.url}/dynamic-interface`}>动态接口</Link>
</li>
</ul>
</Affix>
<div className={styles.contents}>
<Switch>
<Route path={`${match.path}/index`} component={md(mdIndex)} />
<Route path={`${match.path}/auth`} component={md(mdAuth)} />
<Route path={`${match.path}/dynamic-interface`} component={md(mdDyInt)} />
</Switch>
</div>
</div>
);
}
}
export default DocMainPage;
const Monk = ({ children }) => { const Monk = ({ children }) => {
return children; return children || null;
}; };
export default Monk; export default Monk;
...@@ -81,23 +81,23 @@ const getThisBase = (theThis) => { ...@@ -81,23 +81,23 @@ const getThisBase = (theThis) => {
export const thisPush = (theThis, pathOrLoc, withContext = true) => { export const thisPush = (theThis, pathOrLoc, withContext = true) => {
checkThis(theThis); checkThis(theThis);
const route = processPath(getThisBase(theThis), pathOrLoc, withContext); const route = processPath(getThisBase(theThis), pathOrLoc, withContext);
return theThis.props.router.history.push(route); return theThis.props.router.push(route);
}; };
export const thisReplace = (theThis, pathOrLoc, withContext = true) => { export const thisReplace = (theThis, pathOrLoc, withContext = true) => {
checkThis(theThis); checkThis(theThis);
const route = processPath(getThisBase(theThis), pathOrLoc, withContext); const route = processPath(getThisBase(theThis), pathOrLoc, withContext);
return theThis.props.router.history.replace(route); return theThis.props.router.replace(route);
}; };
export const thisGo = (theThis, n) => { export const thisGo = (theThis, n) => {
checkThis(theThis); checkThis(theThis);
return theThis.props.router.history.go(n); return theThis.props.router.go(n);
}; };
export const thisGoBack = (theThis) => { export const thisGoBack = (theThis) => {
checkThis(theThis); checkThis(theThis);
return theThis.props.router.history.goBack(); return theThis.props.router.goBack();
}; };
export const thisGoForward = (theThis) => { export const thisGoForward = (theThis) => {
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论