diff --git a/web/client/src/sections/quanju/containers/footer/conserve/action/index.js b/web/client/src/sections/quanju/containers/footer/conserve/action/index.js index e69de29b..09142754 100644 --- a/web/client/src/sections/quanju/containers/footer/conserve/action/index.js +++ b/web/client/src/sections/quanju/containers/footer/conserve/action/index.js @@ -0,0 +1,17 @@ +'use strict'; + +import { basicAction } from '@peace/utils' +import { ApiTable } from '$utils' + +//获取路政列表 +export function getHighways() { + return dispatch => basicAction({ + type: 'get', + dispatch: dispatch, + actionType: 'GET_HIGHWAYS', + url: `${ApiTable.getHighways}`, + msg: { error: '获取路政列表失败' }, + reducer: { name: 'highways' } + }); +} +//获取道路养护统计及列表 diff --git a/web/client/src/sections/quanju/containers/footer/conserve/index.js b/web/client/src/sections/quanju/containers/footer/conserve/index.js index 9eda76b9..93338e64 100644 --- a/web/client/src/sections/quanju/containers/footer/conserve/index.js +++ b/web/client/src/sections/quanju/containers/footer/conserve/index.js @@ -3,11 +3,14 @@ import Left from './left' import Right from './right' import { connect } from 'react-redux' import { getdaolutongji } from '../../../actions/example' +import { getHighways } from './action' const Conserve = (props) => { const [roadData, setRoadData] = useState() + const [highwaysData, setHighwaysData] = useState() + const [loading, setLoading] = useState(true) const { dispatch } = props useEffect(() => { @@ -15,12 +18,15 @@ const Conserve = (props) => { setLoading(false) setRoadData(res.payload.data || {}) }) + dispatch(getHighways()).then(res =>{ + setHighwaysData(res.payload.data || []) + }) }, []) return (
- +
) } diff --git a/web/client/src/sections/quanju/containers/footer/conserve/right.js b/web/client/src/sections/quanju/containers/footer/conserve/right.js index 98464eec..2d5cfeaf 100644 --- a/web/client/src/sections/quanju/containers/footer/conserve/right.js +++ b/web/client/src/sections/quanju/containers/footer/conserve/right.js @@ -4,12 +4,12 @@ import RightCenter from './right/right-center' import RightTop from './right/right-top' const Right = (props) => { - const { roadData } = props + const { highwaysData } = props return (
- - - + + +
) } diff --git a/web/client/src/sections/quanju/containers/footer/conserve/right/right-center.js b/web/client/src/sections/quanju/containers/footer/conserve/right/right-center.js index 053bdb42..64147c84 100644 --- a/web/client/src/sections/quanju/containers/footer/conserve/right/right-center.js +++ b/web/client/src/sections/quanju/containers/footer/conserve/right/right-center.js @@ -2,47 +2,56 @@ import React from 'react' import Module from '../../../public/module' import { Col, Row } from 'antd' -const RightCenter = () => { +// const unit =['个','个',] +const icon = [ + 'assets/images/quanju/jiancha.png', + 'assets/images/quanju/yushui.png', + 'assets/images/quanju/lupai.png', + 'assets/images/quanju/zerenpai.png' +] +const RightCenter = (props) => { + const { highwaysData } = props const style = { height: "31%", marginTop: "3%" } const textStyle = { fontSize: 14, color: '#E9F7FF' } const numStyle = { color: '#fff', fontSize: 21, fontFamily: 'YouSheBiaoTiHei', textShadow: '0px 0px 8px #1C60FE', marginTop: 8 } - + const list = highwaysData?.slice(4, 8).map((h,index)=>{ + return { + id:h.id, + name:h.name, + count:h.count, + // unit:unit[index], + icon:icon[index] + } + }) + const arrayChunk = (array, size) => { + let data = [] + for (let i = 0; i < array.length; i += size) { + data.push(array.slice(i, i + size)) + } + return data + } + let lists = list ? arrayChunk(list, 2) : [] return ( <>
- - - icon -
-
检查井
-
89个
+ { + lists?.map((item, index) => { + return
+ { + item?.map(i => ( +
+ icon +
+
{i.name}
+
{`${i.count}个`}
+
+
+ )) + }
- - - icon - -
雨水口
-
61个
-
- - - - - icon - -
路牌名
-
2230个
-
- - - icon - -
养护责任牌
-
1217个
-
- -
+ }) + }
diff --git a/web/client/src/sections/quanju/containers/footer/conserve/right/right-top.js b/web/client/src/sections/quanju/containers/footer/conserve/right/right-top.js index c2d68d16..e264b79d 100644 --- a/web/client/src/sections/quanju/containers/footer/conserve/right/right-top.js +++ b/web/client/src/sections/quanju/containers/footer/conserve/right/right-top.js @@ -1,47 +1,61 @@ import { Col, Row } from 'antd' -import React from 'react' +import React, { useState, useEffect } from 'react' import Module from '../../../public/module' + +const iconSrc = [ + 'assets/images/quanju/biaoxian.png', + 'assets/images/quanju/renxing.png', + 'assets/images/quanju/biaozhi.png', + 'assets/images/quanju/fanghu.png' +] +const unit = ['km', '处', '个', 'km'] + const RightTop = (props) => { + const { highwaysData } = props const style = { height: "31%", marginTop: "3%" } const textStyle = { fontSize: 14, color: '#E9F7FF' } const numStyle = { color: '#fff', fontSize: 21, fontFamily: 'YouSheBiaoTiHei', textShadow: '0px 0px 8px #1C60FE', marginTop: 8 } + const list = highwaysData?.slice(0, 4).map((h,index)=>{ + return { + id:h.id, + name:h.name, + count:h.count, + unit:unit[index], + icon:iconSrc[index] + + } + }) + + const arrayChunk = (array, size) => { + let data = [] + for (let i = 0; i < array.length; i += size) { + data.push(array.slice(i, i + size)) + } + return data + } + let lists = list ? arrayChunk(list, 2) : [] return ( <>
- - - icon -
-
标线
-
1352km
+ { + lists?.map((item, index) => { + return
+ { + item?.map(i => ( +
+ icon +
+
{i.name}
+
{`${i.count}${i.unit}`}
+
+
+ )) + }
- - - icon - -
人行道
-
80处
-
- - - - - icon - -
标志牌
-
4563个
-
- - - icon - -
防护栏
-
1054km
-
- -
+ }) + }