From 47f83048b0ce6a052aa8b438c6a8b885307182c0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=87=AA=E5=B8=A6=E5=A4=A7=E4=BD=AC=E6=B0=94=E5=9C=BA?= <188633308@qq.com> Date: Thu, 17 Jun 2021 15:12:33 +0800 Subject: [PATCH] =?UTF-8?q?update=20=E9=A6=96=E9=A1=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web-react/src/components/container/index.jsx | 5 +- web-react/src/pages/home/charts.jsx | 115 +++++++++++++++++++ web-react/src/pages/home/index.jsx | 21 ++++ web-react/src/pages/home/index.less | 4 +- web-react/src/pages/home/list.jsx | 103 +++++++++++++++++ web-react/src/pages/home/notice.jsx | 34 ++++++ web-react/src/pages/home/statistics.jsx | 61 ++++++++++ web-react/src/pages/home/task.jsx | 65 +++++++++++ 8 files changed, 406 insertions(+), 2 deletions(-) create mode 100644 web-react/src/pages/home/charts.jsx create mode 100644 web-react/src/pages/home/list.jsx create mode 100644 web-react/src/pages/home/notice.jsx create mode 100644 web-react/src/pages/home/statistics.jsx create mode 100644 web-react/src/pages/home/task.jsx diff --git a/web-react/src/components/container/index.jsx b/web-react/src/components/container/index.jsx index 00dac50..d3c57fb 100644 --- a/web-react/src/components/container/index.jsx +++ b/web-react/src/components/container/index.jsx @@ -17,7 +17,10 @@ export default class Container extends Component { } render() { - const className = this.getMode(this.props.mode) + let className = this.getMode(this.props.mode) + if (this.props.className) { + className += ` ${this.props.className}` + } return (
{this.props.children}
diff --git a/web-react/src/pages/home/charts.jsx b/web-react/src/pages/home/charts.jsx new file mode 100644 index 0000000..8f63b22 --- /dev/null +++ b/web-react/src/pages/home/charts.jsx @@ -0,0 +1,115 @@ +import React, { Component } from 'react' +import { Card, Dropdown, Form, Menu } from 'antd' +import { AntIcon } from 'components' +import * as echarts from 'echarts' + +const options = { + tooltip: { + trigger: 'axis', + }, + legend: { + show: false, + }, + grid: { + left: '3%', + right: '4%', + bottom: '3%', + containLabel: true, + }, + xAxis: { + type: 'category', + boundaryGap: false, + data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'], + }, + yAxis: { + type: 'value', + }, + series: [ + { + name: '邮件营销', + type: 'line', + stack: '总量', + data: [120, 132, 101, 134, 90, 230, 210], + }, + { + name: '联盟广告', + type: 'line', + stack: '总量', + data: [220, 182, 191, 234, 290, 330, 310], + }, + { + name: '视频广告', + type: 'line', + stack: '总量', + data: [150, 232, 201, 154, 190, 330, 410], + }, + { + name: '直接访问', + type: 'line', + stack: '总量', + data: [320, 332, 301, 334, 390, 330, 320], + }, + { + name: '搜索引擎', + type: 'line', + stack: '总量', + data: [820, 932, 901, 934, 1290, 1330, 1320], + }, + ] +} + +export default class charts extends Component { + + componentDidMount() { + const chartDom = this.refs.chart + const myChart = echarts.init(chartDom) + myChart.setOption(options) + window.addEventListener('resize', () => { + myChart.resize() + }) + } + + render() { + return ( + +
+ + + 宁波市 + 鄞州区 + + } + > + + 宁波市 + + + + + + + 2021 + 2020 + 2019 + + } + > + + 2021 + + + + +
+
+ + ) + } +} diff --git a/web-react/src/pages/home/index.jsx b/web-react/src/pages/home/index.jsx index f2b5a96..dc6292d 100644 --- a/web-react/src/pages/home/index.jsx +++ b/web-react/src/pages/home/index.jsx @@ -6,6 +6,12 @@ import { Container, Image, AntIcon } from 'components' import moment from 'moment' import './index.less' +import Statistics from './statistics' +import Task from './task' +import List from './list' +import Notice from './notice' +import Charts from './charts' + const { getState, subscribe } = store const storePath = 'user' @@ -62,6 +68,21 @@ export default class index extends Component {
+ + + + + + + + + + + + + + + ) } diff --git a/web-react/src/pages/home/index.less b/web-react/src/pages/home/index.less index f4d12ef..ffd71ba 100644 --- a/web-react/src/pages/home/index.less +++ b/web-react/src/pages/home/index.less @@ -33,7 +33,9 @@ -webkit-line-clamp: 2; } .ant-card-meta-description { - .ant-row-flex { + .ant-row { + line-height: 24px; + height: 24px; } } diff --git a/web-react/src/pages/home/list.jsx b/web-react/src/pages/home/list.jsx new file mode 100644 index 0000000..e1884d3 --- /dev/null +++ b/web-react/src/pages/home/list.jsx @@ -0,0 +1,103 @@ +import React, { Component } from 'react' +import { Card, Table } from 'antd' + +const tabList = [ + { + key: '1', + tab: '新建项目', + }, + { + key: '2', + tab: '正在签约项目', + }, + { + key: '3', + tab: '完成签约项目', + }, + { + key: '4', + tab: '项目进度', + }, +] + +const columns = [ + { + title: '区域', + dataIndex: 'area', + }, + { + title: '项目名称', + dataIndex: 'title', + }, + { + title: '户数', + dataIndex: 'count', + }, + { + title: '时间', + dataIndex: 'date', + }, +] + +const data = [ + { + key: '1', + area: '海曙区', + title: '曙光电影院地块', + count: 13, + date: '2021-01-01', + }, + { + key: '2', + area: '江北区', + title: '大庆新村地块旧城区改建项目', + count: 322, + date: '2021-01-01', + }, + { + key: '3', + area: '宁海县', + title: '桥头胡街道旧城区改造华驰文教地块', + count: 1, + date: '2021-01-01', + }, + { + key: '4', + area: '慈溪市', + title: '七二三南延道路工程', + count: 1, + date: '2021-01-01', + }, + { + key: '5', + area: '北仑区', + title: '原粮食局宿舍楼1号、2号楼（太河路北延工程）', + count: 32, + date: '2021-01-01', + }, +] + +export default class list extends Component { + + state = { + key: '1' + } + + render() { + return ( + this.setState({ key })} + > + + + ) + } +} diff --git a/web-react/src/pages/home/notice.jsx b/web-react/src/pages/home/notice.jsx new file mode 100644 index 0000000..6cbe72f --- /dev/null +++ b/web-react/src/pages/home/notice.jsx @@ -0,0 +1,34 @@ +import React, { Component } from 'react' +import { Card, List } from 'antd' +import { AntIcon } from 'components' +import moment from 'moment' + +const data = [ + { title: '关于2020年度房屋征收评估机构信用考核情况的通报' }, + { title: '关于2020年度房屋征收评估机构信用考核情况的通报' }, + { title: '关于2020年度房屋征收评估机构信用考核情况的通报' }, +] + +export default class notice extends Component { + render() { + return ( + 更多} + > + ( + + } + /> + + ) + } /> + + ) + } +} diff --git a/web-react/src/pages/home/statistics.jsx b/web-react/src/pages/home/statistics.jsx new file mode 100644 index 0000000..b8c6d5a --- /dev/null +++ b/web-react/src/pages/home/statistics.jsx @@ -0,0 +1,61 @@ +import React, { Component } from 'react' +import { Card, Col, Dropdown, Menu, Row, Statistic } from 'antd' +import { AntIcon } from 'components' + +export default class statistics extends Component { + render() { + return ( + + + + + + + + + + + + + + + + + + + + + + + + + 当月活跃用户 + 当年活跃用户 + + } + > + + 当月活跃用户 + + + + } + prefix={ + + }> + + + + + + + ) + } +} diff --git a/web-react/src/pages/home/task.jsx b/web-react/src/pages/home/task.jsx new file mode 100644 index 0000000..992f039 --- /dev/null +++ b/web-react/src/pages/home/task.jsx @@ -0,0 +1,65 @@ +import React, { Component } from 'react' +import { Avatar, Card, Col, Row, Tooltip } from 'antd' + +const data = [ + { + title: '市区雷公巷地块项目选择评估机构及上传相关材料(软件开发人员)', + avatar: 'https://tb1.bdstatic.com/tb/steam.jpeg', + }, + { + title: '宁海县山河岭6号地块备案(胡靖)', + avatar: + 'https://gss0.bdstatic.com/6LZ1dD3d1sgCo2Kml5_Y_D3/sys/portrait/item/tb.1.ac342cde.2vNGrtpPcIUN6lJpSnty3g?t=1615176031', + }, + { title: '宁海县盛宁线力洋至胡陈段公路工程田交朱村 地块备案(胡靖)' }, + { + title: '慈溪市慈溪市危旧房改造一期（西门小区A1区块）项目备案(陆承)', + avatar: + 'https://gss0.bdstatic.com/6LZ1dD3d1sgCo2Kml5_Y_D3/sys/portrait/item/tb.1.54e2faca.uBtqRshdnVUXL9XFfQMTwg?t=1604074726', + }, + { title: '江北区孔浦成片危旧住宅区改造项目（六号区块）备案(成薇)' }, + { title: '镇海区宁镇路改扩建工程（庄市段）备案(董力)' }, + { title: '鄞州区茶桃公路（同谷路—金峨路延伸段）项目备案(软件开发人员)' }, + { title: '鄞州区咸祥大嵩湖工程备案(软件开发人员)' }, + { title: '江北区三官堂大桥及接线工程项目备案(成薇)' }, +] + +export default class list extends Component { + render() { + return ( + 更多}> + { + data.map((item, i) => { + return ( + + + {item.title} + + } + description={ + + { + item.avatar && + + + + } + + + 软件开发人员 + 2020-01-01 + + + + } + /> + + ) + }) + } + + ) + } +}