Skip to content

GitLab

A
ant-design-pro
Commit 9fc2c15a authored by ddcat1115's avatar ddcat1115
Browse files
Options

update result pages

parent 1152d6d4
Hide whitespace changes
Inline Side-by-side
Showing with 55 additions and 32 deletions
src/components/Result/demo/classic.md
View file @ 9fc2c15a
...@@ -12,28 +12,41 @@ import { Button, Row, Col, Icon, Steps } from 'antd'; ...@@ -12,28 +12,41 @@ import { Button, Row, Col, Icon, Steps } from 'antd';
const { Step } = Steps; const { Step } = Steps;
const desc1 = ( const desc1 = (
<div style={{ fontSize: 14 }}> <div style={{ fontSize: 12, color: 'rgba(0, 0, 0, 0.45)' }}>
<div style={{ marginTop: 4, marginBottom: 8 }}>曲丽丽 <Icon type="dingding-o" /></div> <div style={{ margin: '8px 0 4px' }}>
曲丽丽<Icon style={{ marginLeft: 8 }} type="dingding-o" />
</div>
<div>2016-12-12 12:32</div> <div>2016-12-12 12:32</div>
</div> </div>
); );
const desc2 = ( const desc2 = (
<div style={{ fontSize: 14 }}> <div style={{ fontSize: 12 }}>
<div style={{ marginTop: 4, marginBottom: 8 }}>周毛毛 <Icon type="dingding-o" style={{ color: '#00A0E9' }} /></div> <div style={{ margin: '8px 0 4px' }}>
周毛毛<Icon type="dingding-o" style={{ color: '#00A0E9', marginLeft: 8 }} />
</div>
<div><a href="">催一下</a></div> <div><a href="">催一下</a></div>
</div> </div>
); );
const extra = ( const extra = (
<div> <div>
<div style={{ fontSize: 16, color: 'rgba(0, 0, 0, 0.65)', fontWeight: '600', marginBottom: 16 }}> <div style={{ fontSize: 16, color: 'rgba(0, 0, 0, 0.85)', fontWeight: '500', marginBottom: 20 }}>
项目名称 项目名称
</div> </div>
<Row style={{ color: 'rgba(0, 0, 0, 0.65)', marginBottom: 20 }}> <Row style={{ marginBottom: 16 }}>
<Col span={6}>项目 ID：23421</Col> <Col xs={24} sm={12} md={12} lg={12} xl={6}>
<Col span={6}>负责人：曲丽丽</Col> <span style={{ color: 'rgba(0, 0, 0, 0.85)' }}>项目 ID：</span>
<Col span={12}>生效时间：2016-12-12 ~ 2017-12-12</Col> 23421
</Col>
<Col xs={24} sm={12} md={12} lg={12} xl={6}>
<span style={{ color: 'rgba(0, 0, 0, 0.85)' }}>负责人：</span>
曲丽丽
</Col>
<Col xs={24} sm={24} md={24} lg={24} xl={12}>
<span style={{ color: 'rgba(0, 0, 0, 0.85)' }}>生效时间：</span>
2016-12-12 ~ 2017-12-12
</Col>
</Row> </Row>
<Steps progressDot current={1}> <Steps progressDot current={1}>
<Step title="创建项目" description={desc1} /> <Step title="创建项目" description={desc1} />
...@@ -59,6 +72,7 @@ ReactDOM.render( ...@@ -59,6 +72,7 @@ ReactDOM.render(
description="提交结果页用于反馈一系列操作任务的处理结果，如果仅是简单操作，使用 Message 全局提示反馈即可。本文字区域可以展示简单的补充说明，如果有类似展示“单据”的需求，下面这个灰色区域可以呈现比较复杂的内容。" description="提交结果页用于反馈一系列操作任务的处理结果，如果仅是简单操作，使用 Message 全局提示反馈即可。本文字区域可以展示简单的补充说明，如果有类似展示“单据”的需求，下面这个灰色区域可以呈现比较复杂的内容。"
extra={extra} extra={extra}
actions={actions} actions={actions}
style={{ width: '100%' }}
/> />
, mountNode); , mountNode);
```` ````
src/components/Result/demo/error.md
View file @ 9fc2c15a
...@@ -11,16 +11,16 @@ import { Button, Icon } from 'antd'; ...@@ -11,16 +11,16 @@ import { Button, Icon } from 'antd';
const extra = ( const extra = (
<div> <div>
<div style={{ fontSize: 16, color: 'rgba(0, 0, 0, 0.65)', fontWeight: '600', marginBottom: 16 }}> <div style={{ fontSize: 16, color: 'rgba(0, 0, 0, 0.85)', fontWeight: '500', marginBottom: 16 }}>
您提交的内容有如下错误： 您提交的内容有如下错误：
</div> </div>
<div style={{ marginBottom: 8 }}> <div style={{ marginBottom: 16 }}>
<Icon style={{ color: '#f04134', marginRight: 8 }} type="close-circle" />您的账户已被冻结 <Icon style={{ color: '#f04134', marginRight: 8 }} type="close-circle-o" />您的账户已被冻结
<a style={{ marginLeft: 24 }}>立即解冻 <Icon type="right" /></a> <a style={{ marginLeft: 16 }}>立即解冻 <Icon type="right" /></a>
</div> </div>
<div> <div>
<Icon style={{ color: '#f04134', marginRight: 8 }} type="close-circle" />您的账户还不具备申请资格 <Icon style={{ color: '#f04134', marginRight: 8 }} type="close-circle-o" />您的账户还不具备申请资格
<a style={{ marginLeft: 24 }}>立即升级 <Icon type="right" /></a> <a style={{ marginLeft: 16 }}>立即升级 <Icon type="right" /></a>
</div> </div>
</div> </div>
); );
......
src/components/Result/index.less
View file @ 9fc2c15a
...@@ -34,8 +34,8 @@ ...@@ -34,8 +34,8 @@
} }
.extra { .extra {
background: rgba(245, 245, 245, 0.5); background: #fafafa;
padding: 16px 40px; padding: 24px 40px;
margin-top: 24px; margin-top: 24px;
border-radius: @border-radius-sm; border-radius: @border-radius-sm;
text-align: left; text-align: left;
......
src/routes/Result/Error.js
View file @ 9fc2c15a
...@@ -5,16 +5,16 @@ import PageHeaderLayout from '../../layouts/PageHeaderLayout'; ...@@ -5,16 +5,16 @@ import PageHeaderLayout from '../../layouts/PageHeaderLayout';
const extra = ( const extra = (
<div> <div>
<div style={{ fontSize: 16, color: 'rgba(0, 0, 0, 0.65)', fontWeight: '600', marginBottom: 16 }}> <div style={{ fontSize: 16, color: 'rgba(0, 0, 0, 0.85)', fontWeight: '500', marginBottom: 16 }}>
您提交的内容有如下错误： 您提交的内容有如下错误：
</div> </div>
<div style={{ marginBottom: 8 }}> <div style={{ marginBottom: 16 }}>
<Icon style={{ color: '#f04134', marginRight: 8 }} type="close-circle-o" />您的账户已被冻结 <Icon style={{ color: '#f04134', marginRight: 8 }} type="close-circle-o" />您的账户已被冻结
<a style={{ marginLeft: 24 }}>立即解冻 <Icon type="right" /></a> <a style={{ marginLeft: 16 }}>立即解冻 <Icon type="right" /></a>
</div> </div>
<div> <div>
<Icon style={{ color: '#f04134', marginRight: 8 }} type="close-circle-o" />您的账户还不具备申请资格 <Icon style={{ color: '#f04134', marginRight: 8 }} type="close-circle-o" />您的账户还不具备申请资格
<a style={{ marginLeft: 24 }}>立即升级 <Icon type="right" /></a> <a style={{ marginLeft: 16 }}>立即升级 <Icon type="right" /></a>
</div> </div>
</div> </div>
); );
...@@ -30,7 +30,7 @@ export default () => ( ...@@ -30,7 +30,7 @@ export default () => (
description="请核对并修改以下信息后，再重新提交。" description="请核对并修改以下信息后，再重新提交。"
extra={extra} extra={extra}
actions={actions} actions={actions}
style={{ marginTop: 30, marginBottom: 30 }} style={{ marginTop: 48, marginBottom: 16 }}
/> />
</Card> </Card>
</PageHeaderLayout> </PageHeaderLayout>
......
src/routes/Result/Success.js
View file @ 9fc2c15a
...@@ -6,8 +6,8 @@ import PageHeaderLayout from '../../layouts/PageHeaderLayout'; ...@@ -6,8 +6,8 @@ import PageHeaderLayout from '../../layouts/PageHeaderLayout';
const { Step } = Steps; const { Step } = Steps;
const desc1 = ( const desc1 = (
<div style={{ fontSize: 14 }}> <div style={{ fontSize: 12, color: 'rgba(0, 0, 0, 0.45)' }}>
<div style={{ margin: '4px 0' }}> <div style={{ margin: '8px 0 4px' }}>
曲丽丽<Icon style={{ marginLeft: 8 }} type="dingding-o" /> 曲丽丽<Icon style={{ marginLeft: 8 }} type="dingding-o" />
</div> </div>
<div>2016-12-12 12:32</div> <div>2016-12-12 12:32</div>
...@@ -15,8 +15,8 @@ const desc1 = ( ...@@ -15,8 +15,8 @@ const desc1 = (
); );
const desc2 = ( const desc2 = (
<div style={{ fontSize: 14 }}> <div style={{ fontSize: 12 }}>
<div style={{ margin: '4px 0' }}> <div style={{ margin: '8px 0 4px' }}>
周毛毛<Icon type="dingding-o" style={{ color: '#00A0E9', marginLeft: 8 }} /> 周毛毛<Icon type="dingding-o" style={{ color: '#00A0E9', marginLeft: 8 }} />
</div> </div>
<div><a href="">催一下</a></div> <div><a href="">催一下</a></div>
...@@ -25,13 +25,22 @@ const desc2 = ( ...@@ -25,13 +25,22 @@ const desc2 = (
const extra = ( const extra = (
<div> <div>
<div style={{ fontSize: 16, color: 'rgba(0, 0, 0, 0.65)', fontWeight: '600', marginBottom: 16 }}> <div style={{ fontSize: 16, color: 'rgba(0, 0, 0, 0.85)', fontWeight: '500', marginBottom: 20 }}>
项目名称 项目名称
</div> </div>
<Row style={{ color: 'rgba(0, 0, 0, 0.65)', marginBottom: 20 }}> <Row style={{ marginBottom: 16 }}>
<Col span={6}>项目 ID：23421</Col> <Col xs={24} sm={12} md={12} lg={12} xl={6}>
<Col span={6}>负责人：曲丽丽</Col> <span style={{ color: 'rgba(0, 0, 0, 0.85)' }}>项目 ID：</span>
<Col span={12}>生效时间：2016-12-12 ~ 2017-12-12</Col> 23421
</Col>
<Col xs={24} sm={12} md={12} lg={12} xl={6}>
<span style={{ color: 'rgba(0, 0, 0, 0.85)' }}>负责人：</span>
曲丽丽
</Col>
<Col xs={24} sm={24} md={24} lg={24} xl={12}>
<span style={{ color: 'rgba(0, 0, 0, 0.85)' }}>生效时间：</span>
2016-12-12 ~ 2017-12-12
</Col>
</Row> </Row>
<Steps progressDot current={1}> <Steps progressDot current={1}>
<Step title="创建项目" description={desc1} /> <Step title="创建项目" description={desc1} />
...@@ -62,7 +71,7 @@ export default () => ( ...@@ -62,7 +71,7 @@ export default () => (
“单据”的需求，下面这个灰色区域可以呈现比较复杂的内容。" “单据”的需求，下面这个灰色区域可以呈现比较复杂的内容。"
extra={extra} extra={extra}
actions={actions} actions={actions}
style={{ marginTop: 30, marginBottom: 30 }} style={{ marginTop: 48, marginBottom: 16 }}
/> />
</Card> </Card>
</PageHeaderLayout> </PageHeaderLayout>
......
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