管理大屏右侧降序

web/client/src/sections/quanju/containers/footer/build/Rightbottom.js

@@ -54,7 +54,7 @@ function Rightbottom(props) {
       textStyle: {
         color: '#fff',
       },
-      formatter: (values) => `${values.seriesName}<br /> ${values.marker} ${values.name}<b>${values.value}</b>公里`,
+      formatter: (values) => `${values.seriesName}<br /> ${values.marker} ${values.name}<b>${values.value}</b>条`,
     },
     legend: {
       orient: "vertical",

web/client/src/sections/quanju/containers/footer/build/Rightcenter.js

@@ -83,7 +83,7 @@ const RNAKS = [FIRST, SECOND, THIRD]
     <div className='build-right-center'>
       <div className='build-right-center-top'>
         <img src="/assets/images/quanju/gonglugongcheng.png"></img>
-        <div>在建公路工程数量</div>
+        <div>在建公路工程数量/个</div>
         <h2>{sundata}</h2>
       </div>
       <AutoRollComponent content={renderContent()}

web/client/src/sections/quanju/containers/footer/build/index.js

@@ -36,10 +36,10 @@ const Build = (props) => {
     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]))}))
-        console.log(alltype,'打他啊')
+        // console.log(alltype,'打他啊')
         setdata(alltype.filter(item=>item.name==='县'||item.name==="乡"||item.name==='村'))
         setbuildingnumber(res.payload.data)
-        console.log(res.payload.data,'哈哈哈')
+        // console.log(res.payload.data,'哈哈哈')
         
     }
 
@@ -118,7 +118,9 @@ const Build = (props) => {
             <Module title={"各种状态公路数量统计"} style={{ width: "100%",
             height:" 33%"
             }} customize = {true}>
-               {buildingnumber&&buildingnumber.buildedRoad!==0&&totalgongli!==0?<div className='build-left-top'>
+              <div style={{height:"100%",position:"relative"}} >
+                <span style={{position:"absolute",width:"10%",color:"#FFF",backgroundColor:'rgba(216, 240, 255, 0.1)',right:"5%",textAlign:"center"}}>条</span>
+              {buildingnumber&&buildingnumber.buildedRoad!==0&&totalgongli!==0?<div className='build-left-top'>
                     <div className='build-left-top-item'>
                     <div>
                             {/* <i>&#9658;</i> */}
@@ -137,6 +139,7 @@ const Build = (props) => {
                         <div>{buildingnumber?.buildedRoad || 0}</div>
                     </div>
                </div>:<NoData/>}
+              </div>
             </Module>
             <Module title={"各乡镇道路分布统计"} style={{ width: "100%",
             height:" 33%",marginTop:'3%'
@@ -203,7 +206,7 @@ const Build = (props) => {
                 {safetyData&&sunsafetyData!==0?<RightBottom  width='100%'
           height='100%'
           text='道路总公里'
-          total={sunsafetyData}
+          total={keepThreeNum(sundata)}
            data={keepThreeNum(safetyData)}/>:<NoData/>}
             </Module>
         </div>

web/client/src/sections/quanju/containers/footer/build/style.less

@@ -178,7 +178,7 @@
             align-items: center;
             justify-content: center;
             position: absolute;
-             left: 16%;
+             left: 15%;
              top:38%;
                 h2{
                     font-size: 1.25rem;
@@ -278,7 +278,7 @@
                 justify-content: center;
                 position: absolute;
                 align-items: center;
-                 left: 19%;
+                 left: 15%;
                  top:38%;
                     h2{
                         font-size: 1.25rem;

web/client/src/sections/quanju/containers/footer/guanli/LeftItem.js

@@ -15,7 +15,7 @@ export default function LeftItem({datas}) {
                 textStyle: {
                   color: '#fff',
                 },
-                formatter: (values) => `  ${values.name}<b>${datas.processed}个</b>`,
+                formatter: (values) => `${values.name}<b>${datas.processed}条</b>`,
               },
             title: {
             text: `${(datas.processed*100/datas.total).toFixed(2)}%`,
@@ -78,6 +78,7 @@ export default function LeftItem({datas}) {
         },
         series: [{
             type: 'bar',
+            showBackground: true,//这里只有显示背景才能出现背景灰色的线
             data: [{
                 name: '已处理',
                 value: (datas.processed*100/datas.total).toFixed(2),
@@ -97,34 +98,15 @@ export default function LeftItem({datas}) {
             coordinateSystem: 'polar',
             roundCap: true,
             barWidth: 8,
-            barGap: '-100%', // 两环重叠
-            z: 2,
-        },{ // 灰色环
-            type: 'bar',
-            data: [{
-                value: 100,
-                itemStyle: {
-                    color: '#092B7B ',
-                    shadowColor: 'rgba(0, 0, 0, 0.2)',
-                    shadowBlur: 5,
-                    shadowOffsetY: 2
-                }
-            }],
-            coordinateSystem: 'polar',
-            roundCap: true,
-            barWidth: 8,
-            barGap: '-100%', // 两环重叠
-            z: 1
-          }]
+        },
+        ]
       }
-      
-    
-      
         chartInstance.setOption(option);
     
       }, [])
   return (
     <div className='guanli-left-item'>
+        <span style={{position:"absolute",width:"10%",color:"#FFF",backgroundColor:'rgba(216, 240, 255, 0.1)',right:"5%",textAlign:"center",top:"2%"}}>条</span>
         <div className='guanli-left-item-left'>
             <span>{datas.name}</span>
             <div>{datas.total} <span>个</span></div>

web/client/src/sections/quanju/containers/footer/guanli/index.js

@@ -14,7 +14,7 @@ const Guanli = (props) => {
     const [rightitemlist,setrightitemlist] = useState()
     const requestleftDatas = async()=>{
         const res = await dispatch(getjiandmanage())
-       res.payload.data.sort((a,b)=>{
+       res.payload.data?.sort((a,b)=>{
             return parseInt(b.total) - parseInt(a.total)
           })
         setleftDatas(res.payload.data)

web/client/src/sections/quanju/containers/footer/guanli/style.less

@@ -19,6 +19,7 @@
         .guanli-left-item{
             box-sizing: border-box;
             width: 85%;
+            position: relative;
             // height: 30%;
             height: 24vh;
             margin: 0 auto 3%;