|
|
|
@ -11,38 +11,90 @@ import Module from '../../public/module' |
|
|
|
import RightBottom from './Rightbottom' |
|
|
|
import AutoRollComponent from './AutoRollComponent' |
|
|
|
import './style.less' |
|
|
|
import {getdaolutongji} from '../../../actions/example' |
|
|
|
import {getdaolutongji,getxuanchuan} from '../../../actions/example' |
|
|
|
const Build = (props) => { |
|
|
|
const { dispatch } = props |
|
|
|
let data = [ |
|
|
|
{ value: 435, name: "县道" }, |
|
|
|
{ value: 679, name: "乡道" }, |
|
|
|
{ value: 848, name: "村道" }, |
|
|
|
let data1 = [ |
|
|
|
{name: "县", value: 207}, |
|
|
|
{name: "乡", value: 729}, |
|
|
|
{name: "村", value: 1938} |
|
|
|
] |
|
|
|
const safetyData = [ |
|
|
|
{name: '一级公路', value: 42}, |
|
|
|
{name: '二级公路', value: 17}, |
|
|
|
{name: '三级公路', value: 17}, |
|
|
|
{name: '四级公路', value: 30}, |
|
|
|
// const safetyData = [
|
|
|
|
// {name: '一级公路', value: 42},
|
|
|
|
// {name: '二级公路', value: 17},
|
|
|
|
// {name: '三级公路', value: 17},
|
|
|
|
// {name: '四级公路', value: 30},
|
|
|
|
|
|
|
|
|
|
|
|
] |
|
|
|
// ]
|
|
|
|
const [buildingnumber,setbuildingnumber] = useState(0) |
|
|
|
const [data,setdata] = useState([]) |
|
|
|
const [xuandata,setxuandata] = useState(null) |
|
|
|
|
|
|
|
//获取道路管理数据
|
|
|
|
const requestbuildingnumber = async ()=>{ |
|
|
|
const res = await dispatch(getdaolutongji()); |
|
|
|
let alltype = Object.keys(res.payload.data?.roadType || {}).map((item)=>({name:item,value:Number(keepThreeNum(res.payload.data.roadType[item]))})) |
|
|
|
setdata(alltype.filter(item=>item.name!=='null')) |
|
|
|
setbuildingnumber(res.payload.data) |
|
|
|
// console.log(res.payload.data,'哈哈哈')
|
|
|
|
console.log(res.payload.data,'哈哈哈') |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
//获取宣传栏数据
|
|
|
|
const requestxuanchuanlan = async ()=>{ |
|
|
|
const res = await dispatch(getxuanchuan()); |
|
|
|
|
|
|
|
// setdata(alltype.filter(item=>item.name!=='null'))
|
|
|
|
setxuandata(res.payload.data) |
|
|
|
console.log(res.payload.data,'宣传栏数据') |
|
|
|
|
|
|
|
} |
|
|
|
let t1 = Object.values(buildingnumber?.townRoad || {}) |
|
|
|
|
|
|
|
let totalgongli = t1.length!==0 ? t1.reduce((x,y)=>x+y.mileage,0):0 //乡镇道路占比总公里数
|
|
|
|
let totalcount = t1.length !==0 ? t1.reduce((x,y)=>x+y.roadCount,0):0 //乡镇道路占比公路总条数
|
|
|
|
|
|
|
|
// let sungongli = alltype.reduce((x,y)=>x+y.value,0)
|
|
|
|
|
|
|
|
const keepThreeNum=(value)=> { |
|
|
|
let resValue = 0 |
|
|
|
//小数点的位置
|
|
|
|
let index = value&&value.toString().indexOf('.') + 1 |
|
|
|
//小数的位数
|
|
|
|
let num = value&&Math.abs(Number(value)).toString().length - index |
|
|
|
if(index && num > 3){ |
|
|
|
resValue = value&&Number(value).toFixed(3) |
|
|
|
} else { |
|
|
|
resValue = value |
|
|
|
} |
|
|
|
return resValue |
|
|
|
} |
|
|
|
let datas = Object.keys(buildingnumber?.townRoad || {}).map((item)=>({name:item,number:buildingnumber.townRoad[item].roadCount,gongli:Number(keepThreeNum(buildingnumber.townRoad[item].mileage))})) |
|
|
|
|
|
|
|
|
|
|
|
//道路等级数据
|
|
|
|
let alldengji = Object.keys(buildingnumber?.roadLevel || {}).map((item)=>({name:item,value:Number(keepThreeNum(buildingnumber.roadLevel[item]))})) |
|
|
|
|
|
|
|
let onlineproject = Object.keys(buildingnumber?.townProject||{}).map((item)=>({name:item,total:buildingnumber.townProject[item]})) |
|
|
|
let sunonlineproject = onlineproject.reduce((x,y)=>x+y.total,0) |
|
|
|
let safetyData = alldengji.filter(item=>item.name!=='null') |
|
|
|
let sundata = data.reduce((x,y)=>x+y.value,0) |
|
|
|
let sunsafetyData = safetyData.reduce((x,y)=>x+y.value,0) |
|
|
|
console.log(safetyData,'好凶猛') |
|
|
|
console.log(data1,'对比') |
|
|
|
// console.log(totalgongli,"好好的")
|
|
|
|
// console.log(keepThreeNum(totalgongli),'jjjjj')
|
|
|
|
useEffect(()=>{ |
|
|
|
requestbuildingnumber() |
|
|
|
requestbuildingnumber(); |
|
|
|
requestxuanchuanlan() |
|
|
|
},[]) |
|
|
|
const datas = new Array(15) |
|
|
|
datas.fill({ |
|
|
|
name:"东乡镇", |
|
|
|
number:"11111", |
|
|
|
gongli:'9999' |
|
|
|
},0,15) |
|
|
|
// const datas = new Array(15)
|
|
|
|
// datas.fill({
|
|
|
|
// name:"东乡镇",
|
|
|
|
// number:"11111",
|
|
|
|
// gongli:'9999'
|
|
|
|
// },0,15)
|
|
|
|
const rendercontent = ()=>{ |
|
|
|
return (<div className='build-left-center-content'> |
|
|
|
{datas.map(({name,number,gongli},index)=><div className='build-left-center-item' key={index}> |
|
|
|
@ -65,7 +117,7 @@ const Build = (props) => { |
|
|
|
<span/> |
|
|
|
<span>在建公路数量</span> |
|
|
|
</div> |
|
|
|
<div>{buildingnumber.buildingRoad || 0}</div> |
|
|
|
<div>{buildingnumber?.buildingRoad || 0}</div> |
|
|
|
</div> |
|
|
|
<img src='/assets/images/quanju/zhuangtaigonglui.png' className='build-left-top-center'/> |
|
|
|
<div className='build-left-top-item'> |
|
|
|
@ -74,7 +126,7 @@ const Build = (props) => { |
|
|
|
<span/> |
|
|
|
<span>已建公路数量</span> |
|
|
|
</div> |
|
|
|
<div>{buildingnumber.buildedRoad || 0}</div> |
|
|
|
<div>{buildingnumber?.buildedRoad || 0}</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</Module> |
|
|
|
@ -87,14 +139,14 @@ const Build = (props) => { |
|
|
|
<img src='/assets/images/quanju/gonglugongli.png'></img> |
|
|
|
<div> |
|
|
|
<span>公路公里数/公里</span> |
|
|
|
<span>1234,123</span> |
|
|
|
<span>{keepThreeNum(totalgongli)}</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div> |
|
|
|
<img src='/assets/images/quanju/gongluzong.png'></img> |
|
|
|
<div> |
|
|
|
<span>公路公里数/公里</span> |
|
|
|
<span>1234,123</span> |
|
|
|
<span>公路总数/条</span> |
|
|
|
<span>{totalcount||0}</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -115,7 +167,7 @@ const Build = (props) => { |
|
|
|
width='100%' |
|
|
|
height='100%' |
|
|
|
text='道路总公里' |
|
|
|
total={2344.13} |
|
|
|
total={keepThreeNum(sundata)} |
|
|
|
// colorList={colorList}
|
|
|
|
// underColorList={underColorList}
|
|
|
|
/> |
|
|
|
@ -134,7 +186,7 @@ const Build = (props) => { |
|
|
|
<Module title={"各乡镇在建公路工程"} style={{ width: "100%", |
|
|
|
height:" 33%",marginTop:'3%' |
|
|
|
}} customize = {true}> |
|
|
|
<Rightcenter/> |
|
|
|
<Rightcenter data={onlineproject} sundata={sunonlineproject}/> |
|
|
|
</Module> |
|
|
|
<Module title={"公路等级统计"} style={{ width: "100%", |
|
|
|
height:" 30%",marginTop:'3%' |
|
|
|
@ -142,8 +194,8 @@ const Build = (props) => { |
|
|
|
<RightBottom width='100%' |
|
|
|
height='100%' |
|
|
|
text='道路总公里' |
|
|
|
total={2344.13} |
|
|
|
data={safetyData}/> |
|
|
|
total={sunsafetyData} |
|
|
|
data={keepThreeNum(safetyData)}/> |
|
|
|
</Module> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
dengyinhuan
3 years ago