|
|
|
@ -2,6 +2,7 @@ import React, { useState, useEffect } from 'react' |
|
|
|
import Lun from "../right/lunbo" |
|
|
|
import { getRoadmaintain, getdaolutongji } from "../../../../actions/example" |
|
|
|
import moment from 'moment' |
|
|
|
// import { Spin } from 'antd'
|
|
|
|
|
|
|
|
|
|
|
|
const Right = (props) => { |
|
|
|
@ -34,6 +35,8 @@ const Right = (props) => { |
|
|
|
return ( |
|
|
|
|
|
|
|
<div style={{ width: "100%", height: "100%" }}> |
|
|
|
{/* <Spin spinning={!nums} tip="Loading" style={{ width: "100%", height: "100%" }}> */} |
|
|
|
|
|
|
|
{ |
|
|
|
list.map((item, index) => { |
|
|
|
console.log(list); |
|
|
|
@ -57,31 +60,35 @@ const Right = (props) => { |
|
|
|
) |
|
|
|
}) |
|
|
|
} |
|
|
|
{/* </Spin> */} |
|
|
|
</div> |
|
|
|
) |
|
|
|
} |
|
|
|
return ( |
|
|
|
<> |
|
|
|
|
|
|
|
<div style={{ width: "100%", height: "100%", float: "right", marginRight: "1%", position: "relative" }}> |
|
|
|
|
|
|
|
<div style={{ width: "100%", height: "43%", position: "relative", left: "1%" }}> |
|
|
|
{/* <Spin spinning={!roads} tip="Loading" ></Spin> */} |
|
|
|
<div style={{ width: "96%", position: "relative", left: "2%" }}> |
|
|
|
<p style={{ position: "absolute", color: "rgba(216,240,255,0.8)", top: "10px" }}>占比<span style={{ fontFamily: " PingFangSC-Regular, PingFang SC" }}>{((roads?.["县"] / (roads?.["乡"] + roads?.["村"] + roads?.["县"])) * 100).toFixed(2)}</span>%</p> |
|
|
|
<p style={{ width: "50%", position: "absolute", right: "0%", textAlign: "right", fontFamily: "YouSheBiaoTiHei", fontSize: "24px", color: "#F5FCFF", marginLeft: "10%" }}>{roads?.["县"].toFixed(0)}<span style={{ color: "#F5FCFF", fontSize: "16px", fontFamily: "PingFangSC-Regular, PingFang SC", marginLeft: "5%" }}>个</span><span style={{ fontSize: "18px", color: "rgba(216,240,255,0.8)", fontFamily: "PingFangSC-Regular, PingFang SC", marginLeft: "5%" }}>县涵洞</span></p> |
|
|
|
</div> |
|
|
|
<div style={{ width: "96%", position: "relative", left: "2%", height: "50%" }}> |
|
|
|
<div style={{ width: (roads?.["县"] / (roads?.["乡"] + roads?.["村"] + roads?.["县"])).toFixed(4) * 100 + "%" || "", height: "20%", transform: "skewX(-45deg)", backgroundColor: "#18ABFF", float: "left", marginTop: "5.6%" }}> |
|
|
|
<div style={{ width: parseInt((roads?.["县"] / (roads?.["乡"] + roads?.["村"] + roads?.["县"])) * 100) + "%" || "", height: "20%", transform: "skewX(-45deg)", backgroundColor: "#18ABFF", float: "left", marginTop: "5.6%" }}> |
|
|
|
|
|
|
|
</div> |
|
|
|
{/* <div style={{ width: "15%", height: "20%", backgroundColor: "#df0001", float: "left", marginTop: "5.6%" }}> |
|
|
|
|
|
|
|
</div> */} |
|
|
|
<div style={{ width: ((roads?.["乡"] + roads?.["村"]) / (roads?.["乡"] + roads?.["村"] + roads?.["县"])).toFixed(4) * 100 + "%" || "", height: "20%", transform: "skewX(-45deg)", backgroundColor: "#0A72FF", float: "left", marginTop: "5.6%" }}></div> |
|
|
|
<div style={{ width: parseInt(((roads?.["乡"] + roads?.["村"]) / (roads?.["乡"] + roads?.["村"] + roads?.["县"])) * 100) + "%" || "", height: "20%", transform: "skewX(-45deg)", backgroundColor: "#0A72FF", float: "left", marginTop: "5.6%" }}></div> |
|
|
|
</div> |
|
|
|
<div style={{ width: "96%", position: "relative", left: "2%" }}> |
|
|
|
<p style={{ width: "50%", position: "absolute", color: "rgba(216,240,255,0.8)", fontSize: "18px" }}>乡村涵洞<span style={{ marginLeft: "4%", fontFamily: "YouSheBiaoTiHei", fontSize: "24px", color: "#F5FCFF" }}>{(roads?.["乡"] + roads?.["村"]).toFixed(0)}</span><span style={{ marginLeft: "4%" }}>个</span></p> |
|
|
|
<p style={{ position: "absolute", right: "0", color: "rgba(216,240,255,0.8)", top: "10px" }}>占比<span>{(((roads?.["乡"] + roads?.["村"]) / (roads?.["乡"] + roads?.["村"] + roads?.["县"])) * 100).toFixed(2)}</span><span>%</span></p> |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
<div style={{ height: "80%", width: "100%", position: "relative", left: "5%", top: "-8%" }}> |
|
|
|
<div style={{ width: "100%", height: "40px"/* , backgroundColor: "#fff" */, position: "relative" }}> |
|
|
|
|
