src/tabviews/home/defaulthome/index.jsx | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
src/tabviews/home/defaulthome/index.scss | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
src/tabviews/home/index.jsx | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 |
src/tabviews/home/defaulthome/index.jsx
@@ -1,10 +1,8 @@ import React, {Component} from 'react' import { Chart } from '@antv/g2' import { Tabs, Progress } from 'antd' import { Progress } from 'antd' import { InfoCircleOutlined, CaretUpOutlined, CaretDownOutlined } from '@ant-design/icons' import './index.scss' const { TabPane } = Tabs class DefaultHome extends Component { componentDidMount () { @@ -17,6 +15,8 @@ { year: '2018 年', sales: 38 }, { year: '2019 年', sales: 61 }, { year: '2020 年', sales: 45 }, { year: '2021 年', sales: 55 }, { year: '2022 年', sales: 49 }, ] const chart = new Chart({ container: 'home_page_id', @@ -222,12 +222,15 @@ </div> </div> </div> <Tabs defaultActiveKey="1"> <TabPane tab="维修总数" key="1"> <div className="sale-trend ant-col ant-col-xs-16"> <div className="home-board"> <div className="mk-home-title"> <span>维修总数</span> </div> <div className="mk-home-body"> <div className="sale-trend ant-col-left"> <div id="home_page_id"></div> </div> <div className="ant-col ant-col-xs-8"> <div className="ant-col-right"> <div className="antd-sales-rank"> <h4 className="antd-ranking-title">产品排名</h4> <ul className="antd-ranking-list"> @@ -274,8 +277,8 @@ </ul> </div> </div> </TabPane> </Tabs> </div> </div> </div> ) } src/tabviews/home/defaulthome/index.scss
@@ -53,6 +53,9 @@ right: 0; line-height: 1; cursor: default; .anticon { color: orange; } } } .antd-total { @@ -124,20 +127,41 @@ } } } .ant-tabs { box-sizing: border-box; margin: 0; padding: 0; color: rgba(0, 0, 0, 0.65); font-size: 14px; font-variant: tabular-nums; line-height: 1.5; list-style: none; font-feature-settings: "tnum"; .home-board { background: #ffffff; .mk-home-title { border-bottom: 1px solid #e8e8e8; margin: 0 0 16px 0; span { position: relative; background: #fff; border-radius: 2px; transition: all .3s; display: inline-block; padding: 12px 16px; color: #1890ff; } span::after { position: absolute; content: ' '; display: block; width: 100%; height: 2px; background: #1890ff; left: 0; bottom: -1px; } } .mk-home-body { .ant-col-left { display: inline-block; width: 66%; vertical-align: top; } .ant-col-right { display: inline-block; width: 34%; vertical-align: top; } .sale-trend { min-height: 400px; padding: 10px 20px; @@ -197,3 +221,4 @@ } } } } src/tabviews/home/index.jsx
@@ -72,10 +72,28 @@ Api.getCacheConfig(_param).then(result => { if (result.status) { if (result.LongParam) { let config = '' try { // 配置信息解析 config = JSON.parse(window.decodeURIComponent(window.atob(result.LongParam))) } catch (e) { console.warn('Parse Failure') config = '' } if (!config || !config.enabled) { this.setState({ loading: false, waitMenu: false, waitAction: false, view: 'default' }) } else { this.setState({ loading: false, view: 'custom' }) } } else { this.setState({ loading: false, @@ -87,6 +105,8 @@ } else { this.setState({ loading: false, waitMenu: false, waitAction: false, view: 'default' }) notification.warning({