Skip to content

GitLab

A
ant-design-pro
Commit aa833043 authored by nikogu's avatar nikogu
Browse files
Options

clost: https://github.com/ant-design/test2/issues/12

parent 21dba8bc
Hide whitespace changes
Inline Side-by-side
Showing with 57 additions and 24 deletions
src/routes/Dashboard/Analysis.js
View file @ aa833043
...@@ -88,7 +88,7 @@ export default class Analysis extends Component { ...@@ -88,7 +88,7 @@ export default class Analysis extends Component {
salesTypeData, salesTypeData,
salesTypeDataOnline, salesTypeDataOnline,
salesTypeDataOffline, salesTypeDataOffline,
} = chart; } = chart;
const salesPieData = salesType === 'all' ? const salesPieData = salesType === 'all' ?
salesTypeData salesTypeData
...@@ -253,30 +253,60 @@ export default class Analysis extends Component { ...@@ -253,30 +253,60 @@ export default class Analysis extends Component {
<TabPane tab="销售额" key="sales"> <TabPane tab="销售额" key="sales">
<Row gutter={72}> <Row gutter={72}>
<Col xl={16} lg={12} md={12} sm={24} xs={24}> <Col xl={16} lg={12} md={12} sm={24} xs={24}>
<Bar <div className={styles.salesBar}>
height={292} <Bar
title="销售额趋势" height={292}
data={salesData} title="销售额趋势"
/> data={salesData}
/>
</div>
</Col> </Col>
<Col xl={8} lg={12} md={12} sm={24} xs={24}> <Col xl={8} lg={12} md={12} sm={24} xs={24}>
<h4 className={styles.rankingTitle}>门店销售额排名</h4> <div className={styles.salesRank}>
<ul className={styles.rankingList}> <h4 className={styles.rankingTitle}>门店销售额排名</h4>
{ <ul className={styles.rankingList}>
rankingListData.map((item, i) => ( {
<li key={item.title}> rankingListData.map((item, i) => (
<span className={(i < 3) && styles.active}>{i + 1}</span> <li key={item.title}>
<span>{item.title}</span> <span className={(i < 3) && styles.active}>{i + 1}</span>
<span>{numeral(item.total).format('0,0')}</span> <span>{item.title}</span>
</li> <span>{numeral(item.total).format('0,0')}</span>
)) </li>
} ))
</ul> }
</ul>
</div>
</Col> </Col>
</Row> </Row>
</TabPane> </TabPane>
<TabPane tab="访问量" key="visits"> <TabPane tab="访问量" key="views">
访问量没有, 因为偷懒了 <Row gutter={72}>
<Col xl={16} lg={12} md={12} sm={24} xs={24}>
<div className={styles.salesBar}>
<Bar
height={292}
title="访问量趋势"
data={salesData}
/>
</div>
</Col>
<Col xl={8} lg={12} md={12} sm={24} xs={24}>
<div className={styles.salesRank}>
<h4 className={styles.rankingTitle}>门店访问量排名</h4>
<ul className={styles.rankingList}>
{
rankingListData.map((item, i) => (
<li key={item.title}>
<span className={(i < 3) && styles.active}>{i + 1}</span>
<span>{item.title}</span>
<span>{numeral(item.total).format('0,0')}</span>
</li>
))
}
</ul>
</div>
</Col>
</Row>
</TabPane> </TabPane>
</Tabs> </Tabs>
</div> </div>
...@@ -390,4 +420,4 @@ export default class Analysis extends Component { ...@@ -390,4 +420,4 @@ export default class Analysis extends Component {
</div> </div>
); );
} }
} }
src/routes/Dashboard/Analysis.less
View file @ aa833043
...@@ -57,10 +57,13 @@ ...@@ -57,10 +57,13 @@
} }
.salesCard { .salesCard {
.salesBar {
padding: 0 0 24px 24px;
}
.salesRank {
padding: 0 24px 24px 0;
}
:global { :global {
.ant-tabs-content {
padding: 0 24px 24px 24px;
}
.ant-tabs-bar { .ant-tabs-bar {
padding-left: 24px; padding-left: 24px;
.ant-tabs-nav .ant-tabs-tab { .ant-tabs-nav .ant-tabs-tab {
......
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