Skip to content

GitLab

A
ant-design-pro
Commit 509e432c authored by ddcat1115's avatar ddcat1115
Browse files
Options

Merge branch 'v2' of https://github.com/ant-design/ant-design-pro into v2

parents 124802f1 c230fa84
Hide whitespace changes
Inline Side-by-side
Showing with 291 additions and 216 deletions
.roadhogrc.mock.js
View file @ 509e432c
...@@ -2,7 +2,6 @@ import mockjs from 'mockjs'; ...@@ -2,7 +2,6 @@ import mockjs from 'mockjs';
import { getRule, postRule } from './mock/rule'; import { getRule, postRule } from './mock/rule';
import { getActivities, getNotice, getFakeList, postFakeList } from './mock/api'; import { getActivities, getNotice, getFakeList, postFakeList } from './mock/api';
import { getFakeChartData } from './mock/chart'; import { getFakeChartData } from './mock/chart';
import { imgMap } from './mock/utils';
import { getProfileBasicData } from './mock/profile'; import { getProfileBasicData } from './mock/profile';
import { getProfileAdvancedData } from './mock/profile'; import { getProfileAdvancedData } from './mock/profile';
import { getNotices } from './mock/notices'; import { getNotices } from './mock/notices';
......
mock/api.js
View file @ 509e432c
import { getUrlParams } from './utils'; import { parse } from 'url';
const titles = [ const titles = [
'Alipay', 'Alipay',
...@@ -115,7 +115,7 @@ export function getFakeList(req, res, u) { ...@@ -115,7 +115,7 @@ export function getFakeList(req, res, u) {
url = req.url; // eslint-disable-line url = req.url; // eslint-disable-line
} }
const params = getUrlParams(url); const params = parse(url, true).query;
const count = (params.count * 1) || 20; const count = (params.count * 1) || 20;
......
mock/rule.js
View file @ 509e432c
import { getUrlParams } from './utils'; import { parse } from 'url';
// mock tableListDataSource // mock tableListDataSource
let tableListDataSource = []; let tableListDataSource = [];
...@@ -26,7 +26,7 @@ export function getRule(req, res, u) { ...@@ -26,7 +26,7 @@ export function getRule(req, res, u) {
url = req.url; // eslint-disable-line url = req.url; // eslint-disable-line
} }
const params = getUrlParams(url); const params = parse(url, true).query;
let dataSource = [...tableListDataSource]; let dataSource = [...tableListDataSource];
......
mock/utils.js deleted 100644 → 0
View file @ 124802f1
export const imgMap = {
user: 'https://gw.alipayobjects.com/zos/rmsportal/UjusLxePxWGkttaqqmUI.png',
a: 'https://gw.alipayobjects.com/zos/rmsportal/ZrkcSjizAKNWwJTwcadT.png',
b: 'https://gw.alipayobjects.com/zos/rmsportal/KYlwHMeomKQbhJDRUVvt.png',
c: 'https://gw.alipayobjects.com/zos/rmsportal/gabvleTstEvzkbQRfjxu.png',
d: 'https://gw.alipayobjects.com/zos/rmsportal/jvpNzacxUYLlNsHTtrAD.png',
};
// refers: https://www.sitepoint.com/get-url-parameters-with-javascript/
export function getUrlParams(url) {
const d = decodeURIComponent;
let queryString = url ? url.split('?')[1] : window.location.search.slice(1);
const obj = {};
if (queryString) {
queryString = queryString.split('#')[0]; // eslint-disable-line
const arr = queryString.split('&');
for (let i = 0; i < arr.length; i += 1) {
const a = arr[i].split('=');
let paramNum;
const paramName = a[0].replace(/\[\d*\]/, (v) => {
paramNum = v.slice(1, -1);
return '';
});
const paramValue = typeof (a[1]) === 'undefined' ? true : a[1];
if (obj[paramName]) {
if (typeof obj[paramName] === 'string') {
obj[paramName] = d([obj[paramName]]);
}
if (typeof paramNum === 'undefined') {
obj[paramName].push(d(paramValue));
} else {
obj[paramName][paramNum] = d(paramValue);
}
} else {
obj[paramName] = d(paramValue);
}
}
}
return obj;
}
export default {
getUrlParams,
imgMap,
};
src/common/menu.js
View file @ 509e432c
...@@ -113,11 +113,6 @@ const menuData = [{ ...@@ -113,11 +113,6 @@ const menuData = [{
name: '注册结果', name: '注册结果',
path: 'register-result', path: 'register-result',
}], }],
}, {
name: '使用文档',
icon: 'book',
path: 'http://pro.ant.design/docs/getting-started',
target: '_blank',
}]; }];
function formatter(data, parentPath = '', parentAuthority) { function formatter(data, parentPath = '', parentAuthority) {
......
src/components/Charts/Radar/index.js
View file @ 509e432c
...@@ -60,7 +60,9 @@ export default class Radar extends Component { ...@@ -60,7 +60,9 @@ export default class Radar extends Component {
const { legendData } = this.state; const { legendData } = this.state;
legendData[i] = newItem; legendData[i] = newItem;
const filteredLegendData = legendData.filter(l => l.checked).map(l => l.name); const filteredLegendData = legendData
.filter(l => l.checked)
.map(l => l.name);
if (this.chart) { if (this.chart) {
this.chart.filter('name', val => filteredLegendData.indexOf(val) > -1); this.chart.filter('name', val => filteredLegendData.indexOf(val) > -1);
...@@ -109,71 +111,76 @@ export default class Radar extends Component { ...@@ -109,71 +111,76 @@ export default class Radar extends Component {
return ( return (
<div className={styles.radar} style={{ height }}> <div className={styles.radar} style={{ height }}>
<div> {title && <h4>{title}</h4>}
{title && <h4>{title}</h4>} <Chart
<Chart scale={scale}
scale={scale} height={chartHeight}
height={chartHeight} forceFit={forceFit}
forceFit={forceFit} data={data}
data={data} padding={padding}
padding={padding} animate={animate}
animate={animate} onGetG2Instance={this.getG2Instance}
onGetG2Instance={this.getG2Instance} >
> <Tooltip />
<Tooltip /> <Coord type="polar" />
<Coord type="polar" /> <Axis
<Axis name="label"
name="label" line={null}
line={null} tickLine={null}
tickLine={null} grid={{
grid={{ lineStyle: {
lineStyle: { lineDash: null,
lineDash: null, },
}, hideFirstLine: false,
hideFirstLine: false, }}
}} />
/> <Axis
<Axis name="value"
name="value" grid={{
grid={{ type: 'polygon',
type: 'polygon', lineStyle: {
lineStyle: { lineDash: null,
lineDash: null, },
}, }}
}} />
/> <Geom
<Geom type="line" position="label*value" color={['name', colors]} size={1} /> type="line"
<Geom position="label*value"
type="point" color={['name', colors]}
position="label*value" size={1}
color={['name', colors]} />
shape="circle" <Geom
size={3} type="point"
/> position="label*value"
</Chart> color={['name', colors]}
{hasLegend && ( shape="circle"
<Row className={styles.legend}> size={3}
{legendData.map((item, i) => ( />
<Col </Chart>
span={24 / legendData.length} {hasLegend && (
key={item.name} <Row className={styles.legend}>
onClick={() => this.handleLegendClick(item, i)} {legendData.map((item, i) => (
> <Col
<div className={styles.legendItem}> span={24 / legendData.length}
<p> key={item.name}
<span onClick={() => this.handleLegendClick(item, i)}
className={styles.dot} >
style={{ backgroundColor: !item.checked ? '#aaa' : item.color }} <div className={styles.legendItem}>
/> <p>
<span>{item.name}</span> <span
</p> className={styles.dot}
<h6>{item.value}</h6> style={{
</div> backgroundColor: !item.checked ? '#aaa' : item.color,
</Col> }}
))} />
</Row> <span>{item.name}</span>
)} </p>
</div> <h6>{item.value}</h6>
</div>
</Col>
))}
</Row>
)}
</div> </div>
); );
} }
......
src/components/Ellipsis/index.d.ts
View file @ 509e432c
import * as React from "react"; import * as React from 'react';
export interface EllipsisProps { export interface EllipsisProps {
tooltip?: boolean; tooltip?: boolean;
length?: number; length?: number;
lines?: number; lines?: number;
style?: React.CSSProperties; style?: React.CSSProperties;
className?: string;
} }
export default class Ellipsis extends React.Component< export default class Ellipsis extends React.Component<EllipsisProps, any> {}
EllipsisProps,
any
> {}
src/components/FooterToolbar/demo/basic.md
View file @ 509e432c
--- ---
order: 0 order: 0
title: 演示 title:
- zh-CN: 演示
- en-US: demo
iframe: 400 iframe: 400
--- ---
## zh-CN
浮动固定页脚。 浮动固定页脚。
## en-US
Fixed to the footer.
````jsx ````jsx
import FooterToolbar from 'ant-design-pro/lib/FooterToolbar'; import FooterToolbar from 'ant-design-pro/lib/FooterToolbar';
import { Button } from 'antd'; import { Button } from 'antd';
ReactDOM.render( ReactDOM.render(
<div style={{ background: '#f7f7f7', padding: 24 }}> <div style={{ background: '#f7f7f7', padding: 24 }}>
<p>页面内容 页面内容 页面内容 页面内容</p> <p>Content Content Content Content</p>
<p>页面内容 页面内容 页面内容 页面内容</p> <p>Content Content Content Content</p>
<p>页面内容 页面内容 页面内容 页面内容</p> <p>Content Content Content Content</p>
<p>页面内容 页面内容 页面内容 页面内容</p> <p>Content Content Content Content</p>
<p>页面内容 页面内容 页面内容 页面内容</p> <p>Content Content Content Content</p>
<p>页面内容 页面内容 页面内容 页面内容</p> <p>Content Content Content Content</p>
<p>页面内容 页面内容 页面内容 页面内容</p> <p>Content Content Content Content</p>
<p>页面内容 页面内容 页面内容 页面内容</p> <p>Content Content Content Content</p>
<p>页面内容 页面内容 页面内容 页面内容</p> <p>Content Content Content Content</p>
<p>页面内容 页面内容 页面内容 页面内容</p> <p>Content Content Content Content</p>
<p>页面内容 页面内容 页面内容 页面内容</p> <p>Content Content Content Content</p>
<p>页面内容 页面内容 页面内容 页面内容</p> <p>Content Content Content Content</p>
<p>页面内容 页面内容 页面内容 页面内容</p> <p>Content Content Content Content</p>
<p>页面内容 页面内容 页面内容 页面内容</p> <p>Content Content Content Content</p>
<p>页面内容 页面内容 页面内容 页面内容</p> <p>Content Content Content Content</p>
<FooterToolbar extra="提示信息"> <FooterToolbar extra="extra information">
<Button>取消</Button> <Button>Cancel</Button>
<Button type="primary">提交</Button> <Button type="primary">Submit</Button>
</FooterToolbar> </FooterToolbar>
</div> </div>
, mountNode); , mountNode);
```` ````
\ No newline at end of file
src/components/FooterToolbar/index.en-US.md 0 → 100644
View file @ 509e432c
---
title: FooterToolbar
cols: 1
order: 6
---
A toolbar fixed at the bottom.
## Usage
It is fixed at the bottom of the content area and does not move along with the scroll bar, which is usually used for data collection and submission for long pages.
## API
Property | Description | Type | Default
---------|-------------|------|--------
children | toolbar content, align to the right | ReactNode | -
extra | extra information, align to the left | ReactNode | -
\ No newline at end of file
src/components/FooterToolbar/index.md → src/components/FooterToolbar/index.zh-CN.md
View file @ 509e432c
--- ---
title: title: FooterToolbar
en-US: FooterToolbar
zh-CN: FooterToolbar
subtitle: 底部工具栏 subtitle: 底部工具栏
cols: 1 cols: 1
order: 6 order: 6
......
src/components/GlobalHeader/index.js
View file @ 509e432c
import React, { PureComponent } from 'react'; import React, { PureComponent } from 'react';
import { Menu, Icon, Spin, Tag, Dropdown, Avatar, Divider } from 'antd'; import { Menu, Icon, Spin, Tag, Dropdown, Avatar, Divider, Tooltip } from 'antd';
import moment from 'moment'; import moment from 'moment';
import groupBy from 'lodash/groupBy'; import groupBy from 'lodash/groupBy';
import Debounce from 'lodash-decorators/debounce'; import Debounce from 'lodash-decorators/debounce';
...@@ -94,6 +94,16 @@ export default class GlobalHeader extends PureComponent { ...@@ -94,6 +94,16 @@ export default class GlobalHeader extends PureComponent {
console.log('enter', value); // eslint-disable-line console.log('enter', value); // eslint-disable-line
}} }}
/> />
<Tooltip title="使用文档">
<a
target="_blank"
href="http://pro.ant.design/docs/getting-started"
rel="noopener noreferrer"
className={styles.action}
>
<Icon type="question-circle-o" />
</a >
</Tooltip>
<NoticeIcon <NoticeIcon
className={styles.action} className={styles.action}
count={currentUser.notifyCount} count={currentUser.notifyCount}
......
src/components/GlobalHeader/index.less
View file @ 509e432c
...@@ -61,6 +61,7 @@ i.trigger { ...@@ -61,6 +61,7 @@ i.trigger {
> i { > i {
font-size: 16px; font-size: 16px;
vertical-align: middle; vertical-align: middle;
color: @text-color;
} }
&:hover, &:hover,
&:global(.ant-popover-open) { &:global(.ant-popover-open) {
......
src/components/PageHeader/index.js
View file @ 509e432c
...@@ -7,8 +7,7 @@ import styles from './index.less'; ...@@ -7,8 +7,7 @@ import styles from './index.less';
const { TabPane } = Tabs; const { TabPane } = Tabs;
export function getBreadcrumb(breadcrumbNameMap, url) {
function getBreadcrumb(breadcrumbNameMap, url) {
let breadcrumb = breadcrumbNameMap[url]; let breadcrumb = breadcrumbNameMap[url];
if (!breadcrumb) { if (!breadcrumb) {
Object.keys(breadcrumbNameMap).forEach((item) => { Object.keys(breadcrumbNameMap).forEach((item) => {
...@@ -20,6 +19,14 @@ function getBreadcrumb(breadcrumbNameMap, url) { ...@@ -20,6 +19,14 @@ function getBreadcrumb(breadcrumbNameMap, url) {
return breadcrumb || {}; return breadcrumb || {};
} }
// /userinfo/2144/id => ['/userinfo','/useinfo/2144,'/userindo/2144/id']
export function urlToList(url) {
const urllist = url.split('/').filter(i => i);
return urllist.map((urlItem, index) => {
return `/${urllist.slice(0, index + 1).join('/')}`;
});
}
export default class PageHeader extends PureComponent { export default class PageHeader extends PureComponent {
static contextTypes = { static contextTypes = {
routes: PropTypes.array, routes: PropTypes.array,
...@@ -62,11 +69,10 @@ export default class PageHeader extends PureComponent { ...@@ -62,11 +69,10 @@ export default class PageHeader extends PureComponent {
} }
conversionFromLocation = (routerLocation, breadcrumbNameMap) => { conversionFromLocation = (routerLocation, breadcrumbNameMap) => {
const { breadcrumbSeparator, linkElement = 'a' } = this.props; const { breadcrumbSeparator, linkElement = 'a' } = this.props;
// Convert the path to an array // Convert the url to an array
const pathSnippets = routerLocation.pathname.split('/').filter(i => i); const pathSnippets = urlToList(routerLocation.pathname);
// Loop data mosaic routing // Loop data mosaic routing
const extraBreadcrumbItems = pathSnippets.map((_, index) => { const extraBreadcrumbItems = pathSnippets.map((url, index) => {
const url = `/${pathSnippets.slice(0, index + 1).join('/')}`;
const currentBreadcrumb = getBreadcrumb(breadcrumbNameMap, url); const currentBreadcrumb = getBreadcrumb(breadcrumbNameMap, url);
const isLinkable = (index !== pathSnippets.length - 1) && currentBreadcrumb.component; const isLinkable = (index !== pathSnippets.length - 1) && currentBreadcrumb.component;
return currentBreadcrumb.name && !currentBreadcrumb.hideInBreadcrumb ? ( return currentBreadcrumb.name && !currentBreadcrumb.hideInBreadcrumb ? (
......
src/components/PageHeader/index.test.js 0 → 100644
View file @ 509e432c
import { getBreadcrumb, urlToList } from './index';
describe('test urlToList', () => {
it('A path', () => {
expect(urlToList('/userinfo')).toEqual(['/userinfo']);
});
it('Secondary path', () => {
expect(urlToList('/userinfo/2144')).toEqual([
'/userinfo',
'/userinfo/2144',
]);
});
it('Three paths', () => {
expect(urlToList('/userinfo/2144/addr')).toEqual([
'/userinfo',
'/userinfo/2144',
'/userinfo/2144/addr',
]);
});
});
const routerData = {
'/dashboard/analysis': {
name: '分析页',
},
'/userinfo': {
name: '用户列表',
},
'/userinfo/:id': {
name: '用户信息',
},
'/userinfo/:id/addr': {
name: '收货订单',
},
};
describe('test getBreadcrumb', () => {
it('Simple url', () => {
expect(getBreadcrumb(routerData, '/dashboard/analysis').name).toEqual(
'分析页'
);
});
it('Parameters url', () => {
expect(getBreadcrumb(routerData, '/userinfo/2144').name).toEqual(
'用户信息'
);
});
it('The middle parameter url', () => {
expect(getBreadcrumb(routerData, '/userinfo/2144/addr').name).toEqual(
'收货订单'
);
});
it('Loop through the parameters', () => {
const urlNameList = urlToList('/userinfo/2144/addr').map((url) => {
return getBreadcrumb(routerData, url).name;
});
expect(urlNameList).toEqual(['用户列表', '用户信息', '收货订单']);
});
it('a path', () => {
const urlNameList = urlToList('/userinfo').map((url) => {
return getBreadcrumb(routerData, url).name;
});
expect(urlNameList).toEqual(['用户列表']);
});
it('Secondary path', () => {
const urlNameList = urlToList('/userinfo/2144').map((url) => {
return getBreadcrumb(routerData, url).name;
});
expect(urlNameList).toEqual(['用户列表', '用户信息']);
});
});
src/components/SiderMenu/SiderMenu.js
View file @ 509e432c
...@@ -87,12 +87,12 @@ export default class SiderMenu extends PureComponent { ...@@ -87,12 +87,12 @@ export default class SiderMenu extends PureComponent {
} }
/** /**
* Get selected child nodes * Get selected child nodes
* /user/chen => /user/:id * /user/chen => ['user','/user/:id']
*/ */
getSelectedMenuKeys = (path) => { getSelectedMenuKeys = (path) => {
const flatMenuKeys = this.getFlatMenuKeys(this.menus); const flatMenuKeys = this.getFlatMenuKeys(this.menus);
return flatMenuKeys.filter((item) => { return flatMenuKeys.filter((item) => {
return pathToRegexp(`/${item}`).test(path); return pathToRegexp(`/${item}(.*)`).test(path);
}); });
} }
/** /**
......
src/components/StandardTable/index.js
View file @ 509e432c
import React, { PureComponent } from 'react'; import React, { PureComponent, Fragment } from 'react';
import { Table, Alert } from 'antd'; import { Table, Alert } from 'antd';
import styles from './index.less'; import styles from './index.less';
...@@ -84,7 +84,7 @@ class StandardTable extends PureComponent { ...@@ -84,7 +84,7 @@ class StandardTable extends PureComponent {
<div className={styles.tableAlert}> <div className={styles.tableAlert}>
<Alert <Alert
message={( message={(
<div> <Fragment>
已选择 <a style={{ fontWeight: 600 }}>{selectedRowKeys.length}</a> 项&nbsp;&nbsp; 已选择 <a style={{ fontWeight: 600 }}>{selectedRowKeys.length}</a> 项&nbsp;&nbsp;
{ {
needTotalList.map(item => ( needTotalList.map(item => (
...@@ -97,7 +97,7 @@ class StandardTable extends PureComponent { ...@@ -97,7 +97,7 @@ class StandardTable extends PureComponent {
) )
} }
<a onClick={this.cleanSelectedKeys} style={{ marginLeft: 24 }}>清空</a> <a onClick={this.cleanSelectedKeys} style={{ marginLeft: 24 }}>清空</a>
</div> </Fragment>
)} )}
type="info" type="info"
showIcon showIcon
......
src/layouts/BasicLayout.js
View file @ 509e432c
import React from 'react'; import React, { Fragment } from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { Layout, Icon, message } from 'antd'; import { Layout, Icon, message } from 'antd';
import DocumentTitle from 'react-document-title'; import DocumentTitle from 'react-document-title';
...@@ -230,9 +230,9 @@ class BasicLayout extends React.PureComponent { ...@@ -230,9 +230,9 @@ class BasicLayout extends React.PureComponent {
blankTarget: true, blankTarget: true,
}]} }]}
copyright={ copyright={
<div> <Fragment>
Copyright <Icon type="copyright" /> 2018 蚂蚁金服体验技术部出品 Copyright <Icon type="copyright" /> 2018 蚂蚁金服体验技术部出品
</div> </Fragment>
} }
/> />
</Footer> </Footer>
......
src/layouts/UserLayout.js
View file @ 509e432c
import React from 'react'; import React, { Fragment } from 'react';
import { Link, Redirect, Switch, Route } from 'dva/router'; import { Link, Redirect, Switch, Route } from 'dva/router';
import DocumentTitle from 'react-document-title'; import DocumentTitle from 'react-document-title';
import { Icon } from 'antd'; import { Icon } from 'antd';
...@@ -21,7 +21,7 @@ const links = [{ ...@@ -21,7 +21,7 @@ const links = [{
href: '', href: '',
}]; }];
const copyright = <div>Copyright <Icon type="copyright" /> 2018 蚂蚁金服体验技术部出品</div>; const copyright = <Fragment>Copyright <Icon type="copyright" /> 2018 蚂蚁金服体验技术部出品</Fragment>;
class UserLayout extends React.PureComponent { class UserLayout extends React.PureComponent {
getPageTitle() { getPageTitle() {
......
src/routes/Dashboard/Analysis.js
View file @ 509e432c
import React, { Component } from 'react'; import React, { Component, Fragment } from 'react';
import { connect } from 'dva'; import { connect } from 'dva';
import { import {
Row, Row,
...@@ -241,7 +241,7 @@ export default class Analysis extends Component { ...@@ -241,7 +241,7 @@ export default class Analysis extends Component {
}; };
return ( return (
<div> <Fragment>
<Row gutter={24}> <Row gutter={24}>
<Col {...topColResponsiveProps}> <Col {...topColResponsiveProps}>
<ChartCard <ChartCard
...@@ -482,7 +482,7 @@ export default class Analysis extends Component { ...@@ -482,7 +482,7 @@ export default class Analysis extends Component {
))} ))}
</Tabs> </Tabs>
</Card> </Card>
</div> </Fragment>
); );
} }
} }
src/routes/Dashboard/Monitor.js
View file @ 509e432c
import React, { PureComponent } from 'react'; import React, { PureComponent, Fragment } from 'react';
import { connect } from 'dva'; import { connect } from 'dva';
import { Row, Col, Card, Tooltip } from 'antd'; import { Row, Col, Card, Tooltip } from 'antd';
import numeral from 'numeral'; import numeral from 'numeral';
...@@ -35,7 +35,7 @@ export default class Monitor extends PureComponent { ...@@ -35,7 +35,7 @@ export default class Monitor extends PureComponent {
const { tags } = monitor; const { tags } = monitor;
return ( return (
<div> <Fragment>
<Row gutter={24}> <Row gutter={24}>
<Col xl={18} lg={24} md={24} sm={24} xs={24} style={{ marginBottom: 24 }}> <Col xl={18} lg={24} md={24} sm={24} xs={24} style={{ marginBottom: 24 }}>
<Card title="活动实时交易情况" bordered={false}> <Card title="活动实时交易情况" bordered={false}>
...@@ -164,7 +164,7 @@ export default class Monitor extends PureComponent { ...@@ -164,7 +164,7 @@ export default class Monitor extends PureComponent {
</Card> </Card>
</Col> </Col>
</Row> </Row>
</div> </Fragment>
); );
} }
} }
src/routes/Forms/StepForm/Step1.js
View file @ 509e432c
import React from 'react'; import React, { Fragment } from 'react';
import { connect } from 'dva'; import { connect } from 'dva';
import { Form, Input, Button, Select, Divider } from 'antd'; import { Form, Input, Button, Select, Divider } from 'antd';
import { routerRedux } from 'dva/router'; import { routerRedux } from 'dva/router';
...@@ -32,7 +32,7 @@ class Step1 extends React.PureComponent { ...@@ -32,7 +32,7 @@ class Step1 extends React.PureComponent {
}); });
}; };
return ( return (
<div> <Fragment>
<Form layout="horizontal" className={styles.stepForm} hideRequiredMark> <Form layout="horizontal" className={styles.stepForm} hideRequiredMark>
<Form.Item <Form.Item
{...formItemLayout} {...formItemLayout}
...@@ -112,7 +112,7 @@ class Step1 extends React.PureComponent { ...@@ -112,7 +112,7 @@ class Step1 extends React.PureComponent {
<h4>转账到银行卡</h4> <h4>转账到银行卡</h4>
<p>如果需要，这里可以放一些关于产品的常见问题说明。如果需要，这里可以放一些关于产品的常见问题说明。如果需要，这里可以放一些关于产品的常见问题说明。</p> <p>如果需要，这里可以放一些关于产品的常见问题说明。如果需要，这里可以放一些关于产品的常见问题说明。如果需要，这里可以放一些关于产品的常见问题说明。</p>
</div> </div>
</div> </Fragment>
); );
} }
} }
......
src/routes/Forms/StepForm/Step3.js
View file @ 509e432c
import React from 'react'; import React, { Fragment } from 'react';
import { connect } from 'dva'; import { connect } from 'dva';
import { Button, Row, Col } from 'antd'; import { Button, Row, Col } from 'antd';
import { routerRedux } from 'dva/router'; import { routerRedux } from 'dva/router';
...@@ -32,14 +32,14 @@ class Step3 extends React.PureComponent { ...@@ -32,14 +32,14 @@ class Step3 extends React.PureComponent {
</div> </div>
); );
const actions = ( const actions = (
<div> <Fragment>
<Button type="primary" onClick={onFinish}> <Button type="primary" onClick={onFinish}>
再转一笔 再转一笔
</Button> </Button>
<Button> <Button>
查看账单 查看账单
</Button> </Button>
</div> </Fragment>
); );
return ( return (
<Result <Result
......
src/routes/Forms/StepForm/index.js
View file @ 509e432c
import React, { PureComponent } from 'react'; import React, { PureComponent, Fragment } from 'react';
import { Route, Redirect, Switch } from 'dva/router'; import { Route, Redirect, Switch } from 'dva/router';
import { Card, Steps } from 'antd'; import { Card, Steps } from 'antd';
import PageHeaderLayout from '../../../layouts/PageHeaderLayout'; import PageHeaderLayout from '../../../layouts/PageHeaderLayout';
...@@ -24,7 +24,7 @@ export default class StepForm extends PureComponent { ...@@ -24,7 +24,7 @@ export default class StepForm extends PureComponent {
return ( return (
<PageHeaderLayout title="分步表单" content="将一个冗长或用户不熟悉的表单任务分成多个步骤，指导用户完成。"> <PageHeaderLayout title="分步表单" content="将一个冗长或用户不熟悉的表单任务分成多个步骤，指导用户完成。">
<Card bordered={false}> <Card bordered={false}>
<div> <Fragment>
<Steps current={this.getCurrentStep()} className={styles.steps}> <Steps current={this.getCurrentStep()} className={styles.steps}>
<Step title="填写转账信息" /> <Step title="填写转账信息" />
<Step title="确认转账信息" /> <Step title="确认转账信息" />
...@@ -44,7 +44,7 @@ export default class StepForm extends PureComponent { ...@@ -44,7 +44,7 @@ export default class StepForm extends PureComponent {
<Redirect exact from="/form/step-form" to="/form/step-form/info" /> <Redirect exact from="/form/step-form" to="/form/step-form/info" />
<Redirect to="/exception/404" /> <Redirect to="/exception/404" />
</Switch> </Switch>
</div> </Fragment>
</Card> </Card>
</PageHeaderLayout> </PageHeaderLayout>
); );
......
src/routes/Forms/TableForm.js
View file @ 509e432c
import React, { PureComponent } from 'react'; import React, { PureComponent, Fragment } from 'react';
import { Table, Button, Input, message, Popconfirm, Divider } from 'antd'; import { Table, Button, Input, message, Popconfirm, Divider } from 'antd';
import styles from './style.less'; import styles from './style.less';
...@@ -203,7 +203,7 @@ export default class TableForm extends PureComponent { ...@@ -203,7 +203,7 @@ export default class TableForm extends PureComponent {
}]; }];
return ( return (
<div> <Fragment>
<Table <Table
loading={this.state.loading} loading={this.state.loading}
columns={columns} columns={columns}
...@@ -221,7 +221,7 @@ export default class TableForm extends PureComponent { ...@@ -221,7 +221,7 @@ export default class TableForm extends PureComponent {
> >
新增成员 新增成员
</Button> </Button>
</div> </Fragment>
); );
} }
} }
src/routes/List/Articles.js
View file @ 509e432c
import React, { Component } from 'react'; import React, { Component, Fragment } from 'react';
import moment from 'moment'; import moment from 'moment';
import { connect } from 'dva'; import { connect } from 'dva';
import { Form, Card, Select, List, Tag, Icon, Avatar, Row, Col, Button } from 'antd'; import { Form, Card, Select, List, Tag, Icon, Avatar, Row, Col, Button } from 'antd';
...@@ -99,7 +99,7 @@ export default class SearchList extends Component { ...@@ -99,7 +99,7 @@ export default class SearchList extends Component {
) : null; ) : null;
return ( return (
<div> <Fragment>
<Card bordered={false}> <Card bordered={false}>
<Form layout="inline"> <Form layout="inline">
<StandardFormRow title="所属类目" block style={{ paddingBottom: 11 }}> <StandardFormRow title="所属类目" block style={{ paddingBottom: 11 }}>
...@@ -230,7 +230,7 @@ export default class SearchList extends Component { ...@@ -230,7 +230,7 @@ export default class SearchList extends Component {
)} )}
/> />
</Card> </Card>
</div> </Fragment>
); );
} }
} }
src/routes/Profile/AdvancedProfile.js
View file @ 509e432c
import React, { Component } from 'react'; import React, { Component, Fragment } from 'react';
import Debounce from 'lodash-decorators/debounce'; import Debounce from 'lodash-decorators/debounce';
import Bind from 'lodash-decorators/bind'; import Bind from 'lodash-decorators/bind';
import { connect } from 'dva'; import { connect } from 'dva';
...@@ -23,7 +23,7 @@ const menu = ( ...@@ -23,7 +23,7 @@ const menu = (
); );
const action = ( const action = (
<div> <Fragment>
<ButtonGroup> <ButtonGroup>
<Button>操作</Button> <Button>操作</Button>
<Button>操作</Button> <Button>操作</Button>
...@@ -32,7 +32,7 @@ const action = ( ...@@ -32,7 +32,7 @@ const action = (
</Dropdown> </Dropdown>
</ButtonGroup> </ButtonGroup>
<Button type="primary">主操作</Button> <Button type="primary">主操作</Button>
</div> </Fragment>
); );
const extra = ( const extra = (
...@@ -69,20 +69,20 @@ const tabList = [{ ...@@ -69,20 +69,20 @@ const tabList = [{
const desc1 = ( const desc1 = (
<div className={classNames(styles.textSecondary, styles.stepDescription)}> <div className={classNames(styles.textSecondary, styles.stepDescription)}>
<div> <Fragment>
曲丽丽 曲丽丽
<Icon type="dingding-o" style={{ marginLeft: 8 }} /> <Icon type="dingding-o" style={{ marginLeft: 8 }} />
</div> </Fragment>
<div>2016-12-12 12:32</div> <div>2016-12-12 12:32</div>
</div> </div>
); );
const desc2 = ( const desc2 = (
<div className={styles.stepDescription}> <div className={styles.stepDescription}>
<div> <Fragment>
周毛毛 周毛毛
<Icon type="dingding-o" style={{ color: '#00A0E9', marginLeft: 8 }} /> <Icon type="dingding-o" style={{ color: '#00A0E9', marginLeft: 8 }} />
</div> </Fragment>
<div><a href="">催一下</a></div> <div><a href="">催一下</a></div>
</div> </div>
); );
......
src/routes/Result/Error.js
View file @ 509e432c
import React from 'react'; import React, { Fragment } from 'react';
import { Button, Icon, Card } from 'antd'; import { Button, Icon, Card } from 'antd';
import Result from '../../components/Result'; import Result from '../../components/Result';
import PageHeaderLayout from '../../layouts/PageHeaderLayout'; import PageHeaderLayout from '../../layouts/PageHeaderLayout';
const extra = ( const extra = (
<div> <Fragment>
<div style={{ fontSize: 16, color: 'rgba(0, 0, 0, 0.85)', fontWeight: '500', marginBottom: 16 }}> <div style={{ fontSize: 16, color: 'rgba(0, 0, 0, 0.85)', fontWeight: '500', marginBottom: 16 }}>
您提交的内容有如下错误： 您提交的内容有如下错误：
</div> </div>
...@@ -16,7 +16,7 @@ const extra = ( ...@@ -16,7 +16,7 @@ const extra = (
<Icon style={{ color: '#f5222d', marginRight: 8 }} type="close-circle-o" />您的账户还不具备申请资格 <Icon style={{ color: '#f5222d', marginRight: 8 }} type="close-circle-o" />您的账户还不具备申请资格
<a style={{ marginLeft: 16 }}>立即升级 <Icon type="right" /></a> <a style={{ marginLeft: 16 }}>立即升级 <Icon type="right" /></a>
</div> </div>
</div> </Fragment>
); );
const actions = <Button type="primary">返回修改</Button>; const actions = <Button type="primary">返回修改</Button>;
......
src/routes/Result/Success.js
View file @ 509e432c
import React from 'react'; import React, { Fragment } from 'react';
import { Button, Row, Col, Icon, Steps, Card } from 'antd'; import { Button, Row, Col, Icon, Steps, Card } from 'antd';
import Result from '../../components/Result'; import Result from '../../components/Result';
import PageHeaderLayout from '../../layouts/PageHeaderLayout'; import PageHeaderLayout from '../../layouts/PageHeaderLayout';
...@@ -24,7 +24,7 @@ const desc2 = ( ...@@ -24,7 +24,7 @@ const desc2 = (
); );
const extra = ( const extra = (
<div> <Fragment>
<div style={{ fontSize: 16, color: 'rgba(0, 0, 0, 0.85)', fontWeight: '500', marginBottom: 20 }}> <div style={{ fontSize: 16, color: 'rgba(0, 0, 0, 0.85)', fontWeight: '500', marginBottom: 20 }}>
项目名称 项目名称
</div> </div>
...@@ -48,15 +48,15 @@ const extra = ( ...@@ -48,15 +48,15 @@ const extra = (
<Step title={<span style={{ fontSize: 14 }}>财务复核</span>} /> <Step title={<span style={{ fontSize: 14 }}>财务复核</span>} />
<Step title={<span style={{ fontSize: 14 }}>完成</span>} /> <Step title={<span style={{ fontSize: 14 }}>完成</span>} />
</Steps> </Steps>
</div> </Fragment>
); );
const actions = ( const actions = (
<div> <Fragment>
<Button type="primary">返回列表</Button> <Button type="primary">返回列表</Button>
<Button>查看项目</Button> <Button>查看项目</Button>
<Button>打 印</Button> <Button>打 印</Button>
</div> </Fragment>
); );
export default () => ( export default () => (
......
src/utils/request.js
View file @ 509e432c
...@@ -4,21 +4,21 @@ import { routerRedux } from 'dva/router'; ...@@ -4,21 +4,21 @@ import { routerRedux } from 'dva/router';
import store from '../index'; import store from '../index';
const codeMessage = { const codeMessage = {
200: '服务器成功返回请求的数据', 200: '服务器成功返回请求的数据。',
201: '新建或修改数据成功。', 201: '新建或修改数据成功。',
202: '一个请求已经进入后台排队（异步任务）', 202: '一个请求已经进入后台排队（异步任务）。',
204: '删除数据成功。', 204: '删除数据成功。',
400: '发出的请求有错误，服务器没有进行新建或修改数据,的操作。', 400: '发出的请求有错误，服务器没有进行新建或修改数据的操作。',
401: '用户没有权限（令牌、用户名、密码错误）。', 401: '用户没有权限（令牌、用户名、密码错误）。',
403: '用户得到授权，但是访问是被禁止的。', 403: '用户得到授权，但是访问是被禁止的。',
404: '发出的请求针对的是不存在的记录，服务器没有进行操作', 404: '发出的请求针对的是不存在的记录，服务器没有进行操作。',
406: '请求的格式不可得。', 406: '请求的格式不可得。',
410: '请求的资源被永久删除，且不会再得到的。', 410: '请求的资源被永久删除，且不会再得到的。',
422: '当创建一个对象时，发生一个验证错误。', 422: '当创建一个对象时，发生一个验证错误。',
500: '服务器发生错误，请检查服务器', 500: '服务器发生错误，请检查服务器。',
502: '网关错误', 502: '网关错误。',
503: '服务不可用，服务器暂时过载或维护', 503: '服务不可用，服务器暂时过载或维护。',
504: '网关超时', 504: '网关超时。',
}; };
function checkStatus(response) { function checkStatus(response) {
if (response.status >= 200 && response.status < 300) { if (response.status >= 200 && response.status < 300) {
...@@ -48,12 +48,21 @@ export default function request(url, options) { ...@@ -48,12 +48,21 @@ export default function request(url, options) {
}; };
const newOptions = { ...defaultOptions, ...options }; const newOptions = { ...defaultOptions, ...options };
if (newOptions.method === 'POST' || newOptions.method === 'PUT') { if (newOptions.method === 'POST' || newOptions.method === 'PUT') {
newOptions.headers = { if (!(newOptions.body instanceof FormData)) {
Accept: 'application/json', newOptions.headers = {
'Content-Type': 'application/json; charset=utf-8', Accept: 'application/json',
...newOptions.headers, 'Content-Type': 'application/json; charset=utf-8',
}; ...newOptions.headers,
newOptions.body = JSON.stringify(newOptions.body); };
newOptions.body = JSON.stringify(newOptions.body);
} else {
// newOptions.body is FormData
newOptions.headers = {
Accept: 'application/json',
'Content-Type': 'multipart/form-data',
...newOptions.headers,
};
}
} }
return fetch(url, newOptions) return fetch(url, newOptions)
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment