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

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

2. add:增加api文档模块
上级 b6d22c63
......@@ -16375,9 +16375,9 @@
"integrity": "sha512-H0nT+KHADICdFgflNZ0A6+EBcExajxY8XM100tKOT5Oidhdo/0bAi26ffBhraEls4FIi8Lm4917tMq8LIWN7Qg=="
},
"react-async-wrapper": {
"version": "0.0.7",
"resolved": "https://registry.npmjs.org/react-async-wrapper/-/react-async-wrapper-0.0.7.tgz",
"integrity": "sha512-NMFd94ES0KUoHWYFu+cgYsYyiaVSfblYOgHMeWxxYJ/lPoN64o1Ad8bkhe+HcEIYEhZ8AhlO5F2CvCTNj0on2Q==",
"version": "0.1.0",
"resolved": "https://registry.npmjs.org/react-async-wrapper/-/react-async-wrapper-0.1.0.tgz",
"integrity": "sha512-Bd/Azo0X1Qd+KCUUAOi9+H2y7YqX9XV3gJkd5H1uBgA7ZSr/9HIdIj/1VnIuwojLgnOPDHt6aqEBs7mfgIJFHw==",
"requires": {
"is-promise": "2.1.0"
}
......@@ -16641,13 +16641,13 @@
}
},
"react-router-4-compat": {
"version": "0.1.4",
"resolved": "https://registry.npmjs.org/react-router-4-compat/-/react-router-4-compat-0.1.4.tgz",
"integrity": "sha512-ZDsQsrIf4yohd/wSNz5s9E9mh+PdgOrymIY28Xqz+cWWJR6x8S9OCeL41kutWIwfzvp481akbgasnegPw+inbQ==",
"version": "0.1.8",
"resolved": "https://registry.npmjs.org/react-router-4-compat/-/react-router-4-compat-0.1.8.tgz",
"integrity": "sha512-n79qyA2kq7fF8OXeDrkUwoJ9/lN9vv+Q/ehwpL2eewYY63+CUlNeBlL5uqbSLODPIAUvqzC0vqoFa7kQZTbJMg==",
"requires": {
"hoist-non-react-statics": "2.5.0",
"invariant": "2.2.4",
"react-async-wrapper": "0.0.7"
"react-async-wrapper": "0.1.0"
}
},
"react-router-dom": {
......
......@@ -28,11 +28,11 @@
"moment": "^2.18.1",
"prop-types": "^15.6.1",
"react": "^16.2.0",
"react-async-wrapper": "^0.0.7",
"react-async-wrapper": "^0.1.0",
"react-dom": "^16.2.0",
"react-json-view": "^1.11.4",
"react-markdown": "^3.3.0",
"react-router-4-compat": "^0.1.4",
"react-router-4-compat": "^0.1.8",
"resolve-pathname": "^2.1.0",
"uuid": "^3.1.0",
"word-wrap": "^1.2.3",
......
/* eslint-disable */
export default [{
export default [/*{
name: 'test-menu',
showName: '测试',
modules: [{
......@@ -9,4 +9,4 @@ export default [{
route: 'api-doc',
},
}],
}];
}*/];
/* eslint-disable no-param-reassign */
import React from 'react';
import PropTypes from 'prop-types';
import { Menu, Breadcrumb, Icon } from 'antd';
import { connect } from 'dva';
import { Link } from 'dva/router';
import styles from './header.less';
import { makePath } from '../../utils/helper';
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 {
componentDidMount() {
......@@ -17,6 +81,7 @@ class HeaderPane extends React.Component {
}
render() {
const { dispatch, user, domain, domainList, routes, params } = this.props;
const nRoutes = normRoutes(routes);
const userTitle = (
<span>
<Icon type="user" />
......@@ -37,20 +102,15 @@ class HeaderPane extends React.Component {
}
};
const joinPath = (paths) => {
return (paths || []).map((path) => {
let out = path;
if (out.startsWith('/')) {
out = out.substring(1);
}
if (out.endsWith('/')) {
out = out.substring(0, out.length - 1);
}
return out;
}).join('/');
if (paths && paths.length > 0) {
// eslint-disable-next-line
return `/${paths[paths.length - 1]}`;
}
return '/';
};
const breadsProps = {
className: styles.breads,
routes,
routes: nRoutes,
params,
itemRender(route, _params, _routes, paths) {
if (!paths || !paths.length) {
......@@ -60,7 +120,7 @@ class HeaderPane extends React.Component {
return <Icon type="home" />;
}
const bread = route.name ? route.name : route.path;
return <Link to={`/${joinPath(paths)}`}>{ bread }</Link>;
return <Link to={joinPath(paths)}>{ bread }</Link>;
},
};
const menuProps = {
......
......@@ -8,6 +8,10 @@
float: left;
margin-left: 16px;
}
:global .ant-breadcrumb {
line-height: inherit;
font-size: 12px;
}
.menu {
float: right;
......
import React from 'react';
// import React from 'react';
import { connect } from 'dva';
import ReactMarkdown from 'react-markdown';
import 'github-markdown-css';
import mdIndex from './index.md';
import mdAuth from './auth.md';
// import mdIndex from './index.md';
// import mdAuth from './auth.md';
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({
indexRoute: {
component: md(mdIndex),
},
childRoutes: [
{
path: 'auth',
name: '登录与验证',
component: md(mdAuth),
},
],
childRoutes: [{
path: 'main',
name: '文档',
component: Main,
}],
}));
.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格式,并且有如下形式:
......@@ -28,7 +26,3 @@
所以返回的json数据里部分属性可能以引用的形式存在。需要进一步解析。
若使用java,可以用fastjson的[JSONPath](https://github.com/alibaba/fastjson/wiki/JSONPath)来进行解析。
若使用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 }) => {
return children;
return children || null;
};
export default Monk;
......@@ -81,23 +81,23 @@ const getThisBase = (theThis) => {
export const thisPush = (theThis, pathOrLoc, withContext = true) => {
checkThis(theThis);
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) => {
checkThis(theThis);
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) => {
checkThis(theThis);
return theThis.props.router.history.go(n);
return theThis.props.router.go(n);
};
export const thisGoBack = (theThis) => {
checkThis(theThis);
return theThis.props.router.history.goBack();
return theThis.props.router.goBack();
};
export const thisGoForward = (theThis) => {
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论