11111
hhr
parent
2e62008066
commit
cb1075baf1
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 933 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 445 B |
Binary file not shown.
|
After Width: | Height: | Size: 504 B |
Binary file not shown.
|
After Width: | Height: | Size: 2.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 70 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 103 KiB |
|
|
@ -1,37 +1,223 @@
|
||||||
.content{
|
.content {
|
||||||
position:relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.left-box{
|
.left-box {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
z-index: 100;
|
z-index: 100;
|
||||||
}
|
}
|
||||||
|
|
||||||
.right-box{
|
.right-box {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
z-index: 100;
|
z-index: 100;
|
||||||
}
|
}
|
||||||
|
|
||||||
.box{
|
.box {
|
||||||
width: 30vw;
|
width: 30vw;
|
||||||
height: 28vh;
|
height: 28vh;
|
||||||
min-height: 200px;
|
min-height: 200px;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.box-title{
|
.box-title {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
padding: 5px 30px;
|
height: 10%;
|
||||||
|
padding: 0 30px;
|
||||||
background: url("../../../public/assets/title.png") 0 0 no-repeat;
|
background: url("../../../public/assets/title.png") 0 0 no-repeat;
|
||||||
background-size: contain;
|
background-size: 100% 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.title-item{
|
.title-item {
|
||||||
margin-right: 20px;
|
margin-right: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.box1,.box4{
|
||||||
|
height: 90%;
|
||||||
|
padding: 10px;
|
||||||
|
background: url("../../../public/assets/box_bg3.png") 0 0 no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box1-bian,.box4-bian {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box1-content,.box4-content {
|
||||||
|
margin: 0 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box1-content-top {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box1-content-top-img {
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.box1-content-top-img img {
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box1-content-top-text {
|
||||||
|
text-indent: 2em;
|
||||||
|
font-size: 0.8em;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box1-content-bottom {
|
||||||
|
margin-top: 10px;
|
||||||
|
text-indent: 2em;
|
||||||
|
font-size: 0.8em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box1-content-top-text span, .box1-content-bottom span {
|
||||||
|
color: yellow;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box2 {
|
||||||
|
height: 90%;
|
||||||
|
background: url("../../../public/assets/box_bg3.png") 0 0 no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box3 {
|
||||||
|
height: 90%;
|
||||||
|
width: 100%;
|
||||||
|
padding: 10px;
|
||||||
|
background: url("../../../public/assets/box_bg3.png") 0 0 no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box3-content {
|
||||||
|
margin-top: 4px;
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box3-item {
|
||||||
|
margin-top: 4px;
|
||||||
|
width: 50%;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box3-item-title {
|
||||||
|
background: url("../../../public/assets/box3_title.png") 0 bottom no-repeat;
|
||||||
|
background-size: 50% 60%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box3-content-bottom {
|
||||||
|
margin-top: 10px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.box3-item-img img {
|
||||||
|
width: 50px;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box3-item-data-top {
|
||||||
|
color: #1FE6A4;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box3-item-data-btm {
|
||||||
|
padding: 1px 4px;
|
||||||
|
margin-top: 10px;
|
||||||
|
background: url("../../../public/assets/box3_time.png") 0 0 no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box3-item-arrow {
|
||||||
|
text-align: center;
|
||||||
|
margin: 0 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.box3-item-arrow-btm img {
|
||||||
|
width: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box4-content-item{
|
||||||
|
text-indent: 2em;
|
||||||
|
margin: 20px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box4-content-item span{
|
||||||
|
color: yellow;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box5{
|
||||||
|
height: 90%;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box5-title{
|
||||||
|
display: flex;
|
||||||
|
background: url("../../../public/assets/box5_title.png") 0 0 no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
padding: 6px 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box5-title-item{
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.box5-list{
|
||||||
|
display: flex;
|
||||||
|
padding: 6px 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box5-li{
|
||||||
|
text-align: center;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box5-li-num{
|
||||||
|
width: 12px;
|
||||||
|
height: 12px;
|
||||||
|
line-height: 12px;
|
||||||
|
text-align: center;
|
||||||
|
background: url("../../../public/assets/box5_num.png") 0 0 no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.width-10{
|
||||||
|
width: 10%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.width-20{
|
||||||
|
width: 20%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.width-30{
|
||||||
|
width: 30%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box5 .box5-list:nth-child(even){
|
||||||
|
background: rgba(0,88,188,0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.box5 .box5-list:nth-child(odd){
|
||||||
|
background: rgba(0,88,188,0.6);
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,9 +1,157 @@
|
||||||
import {Modal, Tabs, Switch} from 'antd'
|
import {Modal, Tabs, Switch} from 'antd'
|
||||||
import React, {useMemo, useState} from 'react';
|
import React, {useEffect, useMemo, useState} from 'react';
|
||||||
import "./index.less"
|
import "./index.less"
|
||||||
|
import ReactEcharts from "echarts-for-react";
|
||||||
|
|
||||||
const SyglPage: React.FC = () => {
|
const SyglPage: React.FC = () => {
|
||||||
|
const [echartsOption, setEchartsOption] = useState({});
|
||||||
|
|
||||||
|
// @ts-ignore
|
||||||
|
const getOption = () => {
|
||||||
|
const data0 = [1, 1, 1, 1, 1];
|
||||||
|
const option = {
|
||||||
|
textStyle: {
|
||||||
|
color: "#C9C9C9",
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
type: "scroll",
|
||||||
|
orient: 'vertical',
|
||||||
|
selectedMode: false,
|
||||||
|
right: "40%",
|
||||||
|
top: "15%",
|
||||||
|
textStyle: {
|
||||||
|
color: "#ffffff",
|
||||||
|
fontSize: 14,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
grid: {
|
||||||
|
containLabel: true,
|
||||||
|
left: "3%",
|
||||||
|
top: "20%",
|
||||||
|
bottom: "0%",
|
||||||
|
right: "0%",
|
||||||
|
},
|
||||||
|
xAxis: {
|
||||||
|
type: "category",
|
||||||
|
data: [
|
||||||
|
"2018",
|
||||||
|
"2019",
|
||||||
|
"2020",
|
||||||
|
"2021",
|
||||||
|
"2022",
|
||||||
|
],
|
||||||
|
axisLine: {
|
||||||
|
show: true,
|
||||||
|
lineStyle: {
|
||||||
|
color: "#ffffff",
|
||||||
|
opacity: 0.9,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
margin: 20, //刻度标签与轴线之间的距离。
|
||||||
|
textStyle: {
|
||||||
|
fontFamily: "Microsoft YaHei",
|
||||||
|
color: "#FFF",
|
||||||
|
},
|
||||||
|
fontSize: 12,
|
||||||
|
fontStyle: "bold"
|
||||||
|
},
|
||||||
|
},
|
||||||
|
yAxis: {
|
||||||
|
name: "(万元)",
|
||||||
|
max: 600,
|
||||||
|
min: 0,
|
||||||
|
nameTextStyle: {
|
||||||
|
color: '#fff',
|
||||||
|
opacity: 0.9
|
||||||
|
},
|
||||||
|
type: "value",
|
||||||
|
axisLine: {
|
||||||
|
show: true,
|
||||||
|
lineStyle: {
|
||||||
|
color: "#ffffff",
|
||||||
|
opacity: 0.9,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
splitLine: {
|
||||||
|
show: true,
|
||||||
|
lineStyle: {
|
||||||
|
color: 'rgba(255,255,255,0.3)',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
textStyle: {
|
||||||
|
fontFamily: "Microsoft YaHei",
|
||||||
|
color: "#FFF",
|
||||||
|
},
|
||||||
|
fontSize: 12,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
type: "bar",
|
||||||
|
data: [360, 340, 300, 360, 500],
|
||||||
|
barMaxWidth: "auto",
|
||||||
|
barWidth: 30,
|
||||||
|
itemStyle: {
|
||||||
|
color: {
|
||||||
|
x: 0,
|
||||||
|
y: 0,
|
||||||
|
x2: 0,
|
||||||
|
y2: 1,
|
||||||
|
type: "linear",
|
||||||
|
global: false,
|
||||||
|
colorStops: [{
|
||||||
|
offset: 0,
|
||||||
|
color: "#00A9FF",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
offset: 1,
|
||||||
|
color: "#66DDFF",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
// color: [, "#018bc1", "#96e092", "#DE9FB1", "#f06e90", "#f89e92",],
|
||||||
|
{//一蓝底
|
||||||
|
data: data0,
|
||||||
|
type: "pictorialBar",
|
||||||
|
barMaxWidth: "20",
|
||||||
|
symbol: "diamond",
|
||||||
|
color: "#66DDFF",
|
||||||
|
symbolOffset: ['0', "50%"],
|
||||||
|
symbolSize: [30, 10],
|
||||||
|
zlevel: 2,
|
||||||
|
},
|
||||||
|
{//一蓝盖
|
||||||
|
data: [360, 340, 300, 360, 500],
|
||||||
|
type: "pictorialBar",
|
||||||
|
barMaxWidth: "20",
|
||||||
|
symbol: "diamond",
|
||||||
|
symbolPosition: "end",
|
||||||
|
color: "#77C9FF",
|
||||||
|
symbolOffset: ['0', "-45%"],
|
||||||
|
symbolSize: [30, 10],
|
||||||
|
zlevel: 2,
|
||||||
|
},
|
||||||
|
|
||||||
|
],
|
||||||
|
|
||||||
|
markArea: {
|
||||||
|
silent: true,
|
||||||
|
|
||||||
|
}
|
||||||
|
};
|
||||||
|
setEchartsOption(option);
|
||||||
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
getOption();
|
||||||
|
}, []);
|
||||||
return (
|
return (
|
||||||
<div className='content'>
|
<div className='content'>
|
||||||
<div className='left-box'>
|
<div className='left-box'>
|
||||||
|
|
@ -13,16 +161,140 @@ const SyglPage: React.FC = () => {
|
||||||
<div className='title-item'>大事记</div>
|
<div className='title-item'>大事记</div>
|
||||||
<div className='title-item'>美丽水厂</div>
|
<div className='title-item'>美丽水厂</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div className='box1'>
|
||||||
|
<img className='box1-bian' src={`${process.env.PUBLIC_URL}/assets/bian.png`} alt=""/>
|
||||||
|
<div className='box1-content'>
|
||||||
|
<div className='box1-content-top'>
|
||||||
|
<div className='box1-content-top-img'>
|
||||||
|
<img className='box1-bian' src={`${process.env.PUBLIC_URL}/assets/img2.png`} alt=""/>
|
||||||
|
</div>
|
||||||
|
<div className='box1-content-top-text'>
|
||||||
|
咸丰县水利局坚持把抓好农村饮水安全、助力脱贫攻坚放在中心位置，切实履行行业扶贫责任，扎实抓好精准扶贫农村饮水安全工程建设，全面解决建档立卡贫困人口“饮水难”问题，我县共投入<span>25804.04</span>万元推进实施6批次精准扶贫农村饮水安全工程。
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='box1-content-bottom'>
|
||||||
|
新建或改造农村供水工程369个（处），改善或提高<span>24.46</span>万农村居民的饮水条件（包括<span>14.99</span>万建档立卡贫困人口），同步建设高效智慧的农村供水管理平台，实现从源头到龙头全过程精细化管理。
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<img className='box1-bian' src={`${process.env.PUBLIC_URL}/assets/bian.png`} alt=""/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className='box'>
|
<div className='box'>
|
||||||
<div className='box-title'>
|
<div className='box-title'>
|
||||||
<div className='title-item'>工程投资</div>
|
<div className='title-item'>工程投资</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div className='box2'>
|
||||||
|
<ReactEcharts
|
||||||
|
option={echartsOption}
|
||||||
|
style={{width: "100%", height: 'calc( 100% - 10px )'}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className='box'>
|
<div className='box'>
|
||||||
<div className='box-title'>
|
<div className='box-title'>
|
||||||
<div className='title-item'>工程成效</div>
|
<div className='title-item'>工程成效</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div className='box3'>
|
||||||
|
<div className='box3-content'>
|
||||||
|
<div className='box3-item'>
|
||||||
|
<div className='box3-item-title'>
|
||||||
|
自来水普及率
|
||||||
|
</div>
|
||||||
|
<div className='box3-content-bottom'>
|
||||||
|
<div className='box3-item-img'>
|
||||||
|
<img src={`${process.env.PUBLIC_URL}/assets/box3_1.png`} alt=""/>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-data'>
|
||||||
|
<div className='box3-item-data-top'>91.23%</div>
|
||||||
|
<div className='box3-item-data-btm'>2018年</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-arrow'>
|
||||||
|
<div className='box3-item-arrow-top'>5.2%</div>
|
||||||
|
<div className='box3-item-arrow-btm'>
|
||||||
|
<img src={`${process.env.PUBLIC_URL}/assets/box3_arrow.png`} alt=""/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-data'>
|
||||||
|
<div className='box3-item-data-top'>91.23%</div>
|
||||||
|
<div className='box3-item-data-btm'>2021年</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item'>
|
||||||
|
<div className='box3-item-title'>
|
||||||
|
集中供水率
|
||||||
|
</div>
|
||||||
|
<div className='box3-content-bottom'>
|
||||||
|
<div className='box3-item-img'>
|
||||||
|
<img src={`${process.env.PUBLIC_URL}/assets/box3_2.png`} alt=""/>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-data'>
|
||||||
|
<div className='box3-item-data-top'>91.23%</div>
|
||||||
|
<div className='box3-item-data-btm'>2018年</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-arrow'>
|
||||||
|
<div className='box3-item-arrow-top'>5.2%</div>
|
||||||
|
<div className='box3-item-arrow-btm'>
|
||||||
|
<img src={`${process.env.PUBLIC_URL}/assets/box3_arrow.png`} alt=""/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-data'>
|
||||||
|
<div className='box3-item-data-top'>91.23%</div>
|
||||||
|
<div className='box3-item-data-btm'>2021年</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item'>
|
||||||
|
<div className='box3-item-title'>
|
||||||
|
供水保证率
|
||||||
|
</div>
|
||||||
|
<div className='box3-content-bottom'>
|
||||||
|
<div className='box3-item-img'>
|
||||||
|
<img src={`${process.env.PUBLIC_URL}/assets/box3_3.png`} alt=""/>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-data'>
|
||||||
|
<div className='box3-item-data-top'>91.23%</div>
|
||||||
|
<div className='box3-item-data-btm'>2018年</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-arrow'>
|
||||||
|
<div className='box3-item-arrow-top'>5.2%</div>
|
||||||
|
<div className='box3-item-arrow-btm'>
|
||||||
|
<img src={`${process.env.PUBLIC_URL}/assets/box3_arrow.png`} alt=""/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-data'>
|
||||||
|
<div className='box3-item-data-top'>91.23%</div>
|
||||||
|
<div className='box3-item-data-btm'>2021年</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item'>
|
||||||
|
<div className='box3-item-title'>
|
||||||
|
水质达标率
|
||||||
|
</div>
|
||||||
|
<div className='box3-content-bottom'>
|
||||||
|
<div className='box3-item-img'>
|
||||||
|
<img src={`${process.env.PUBLIC_URL}/assets/box3_4.png`} alt=""/>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-data'>
|
||||||
|
<div className='box3-item-data-top'>91.23%</div>
|
||||||
|
<div className='box3-item-data-btm'>2018年</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-arrow'>
|
||||||
|
<div className='box3-item-arrow-top'>5.2%</div>
|
||||||
|
<div className='box3-item-arrow-btm'>
|
||||||
|
<img src={`${process.env.PUBLIC_URL}/assets/box3_arrow.png`} alt=""/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-data'>
|
||||||
|
<div className='box3-item-data-top'>91.23%</div>
|
||||||
|
<div className='box3-item-data-btm'>2021年</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className='right-box'>
|
<div className='right-box'>
|
||||||
|
|
@ -30,16 +302,173 @@ const SyglPage: React.FC = () => {
|
||||||
<div className='box-title'>
|
<div className='box-title'>
|
||||||
<div className='title-item'>洪水简报</div>
|
<div className='title-item'>洪水简报</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div className='box4'>
|
||||||
|
<img className='box4-bian' src={`${process.env.PUBLIC_URL}/assets/bian.png`} alt=""/>
|
||||||
|
<div className='box4-content'>
|
||||||
|
<div className='box4-content-item'>全省3月供水指数<span>83.2</span>，环比增长<span>1.23</span>%，其中清坪镇、小乡村排名前三；XXX、XXX、XXX排名倒三；</div>
|
||||||
|
<div className='box4-content-item'>全省3月城乡供水水量<span>4.3</span>亿m³，环比增长-<span>0.09%</span>，水质自检率68.2%，自检合格率97.9%;</div>
|
||||||
|
<div className='box4-content-item'>全省3月累计受理<span>13</span>个群众投诉件，已办结<span>11</span>个，其中完成整改<span>9</span>个，持续整改<span>0</span>个，办结率<span>84.6%</span>;</div>
|
||||||
|
</div>
|
||||||
|
<img className='box4-bian' src={`${process.env.PUBLIC_URL}/assets/bian.png`} alt=""/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className='box'>
|
<div className='box'>
|
||||||
<div className='box-title'>
|
<div className='box-title'>
|
||||||
<div className='title-item'>在建工程</div>
|
<div className='title-item'>在建工程</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div className='box5'>
|
||||||
|
<div className='box5-title'>
|
||||||
|
<div className='box5-title-item width-10'>序号</div>
|
||||||
|
<div className='box5-title-item width-20'>工程名称</div>
|
||||||
|
<div className='box5-title-item width-20'>投资金额</div>
|
||||||
|
<div className='box5-title-item width-30'>建设内容</div>
|
||||||
|
<div className='box5-title-item width-20'>工程进度</div>
|
||||||
|
</div>
|
||||||
|
<div className='box5-list'>
|
||||||
|
<div className='box5-li width-10'>
|
||||||
|
<div className='box5-li-num '>1</div>
|
||||||
|
</div>
|
||||||
|
<div className='box5-li width-20'>XXX工程</div>
|
||||||
|
<div className='box5-li width-20'>200万</div>
|
||||||
|
<div className='box5-li width-30'>建设内容文字占位</div>
|
||||||
|
<div className='box5-li width-20'>89%</div>
|
||||||
|
</div>
|
||||||
|
<div className='box5-list'>
|
||||||
|
<div className='box5-li width-10'>
|
||||||
|
<div className='box5-li-num '>2</div>
|
||||||
|
</div>
|
||||||
|
<div className='box5-li width-20'>XXX工程</div>
|
||||||
|
<div className='box5-li width-20'>200万</div>
|
||||||
|
<div className='box5-li width-30'>建设内容文字占位</div>
|
||||||
|
<div className='box5-li width-20'>89%</div>
|
||||||
|
</div>
|
||||||
|
<div className='box5-list'>
|
||||||
|
<div className='box5-li width-10'>
|
||||||
|
<div className='box5-li-num '>3</div>
|
||||||
|
</div>
|
||||||
|
<div className='box5-li width-20'>XXX工程</div>
|
||||||
|
<div className='box5-li width-20'>200万</div>
|
||||||
|
<div className='box5-li width-30'>建设内容文字占位</div>
|
||||||
|
<div className='box5-li width-20'>89%</div>
|
||||||
|
</div>
|
||||||
|
<div className='box5-list'>
|
||||||
|
<div className='box5-li width-10'>
|
||||||
|
<div className='box5-li-num '>4</div>
|
||||||
|
</div>
|
||||||
|
<div className='box5-li width-20'>XXX工程</div>
|
||||||
|
<div className='box5-li width-20'>200万</div>
|
||||||
|
<div className='box5-li width-30'>建设内容文字占位</div>
|
||||||
|
<div className='box5-li width-20'>89%</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className='box'>
|
<div className='box'>
|
||||||
<div className='box-title'>
|
<div className='box-title'>
|
||||||
<div className='title-item'>智慧化成效</div>
|
<div className='title-item'>智慧化成效</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div className='box3'>
|
||||||
|
<div className='box3-content'>
|
||||||
|
<div className='box3-item'>
|
||||||
|
<div className='box3-item-title'>
|
||||||
|
运营成本率
|
||||||
|
</div>
|
||||||
|
<div className='box3-content-bottom'>
|
||||||
|
<div className='box3-item-img'>
|
||||||
|
<img src={`${process.env.PUBLIC_URL}/assets/box6_1.png`} alt=""/>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-data'>
|
||||||
|
<div className='box3-item-data-top'>91.23%</div>
|
||||||
|
<div className='box3-item-data-btm'>2018年</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-arrow'>
|
||||||
|
<div className='box3-item-arrow-top'>5.2%</div>
|
||||||
|
<div className='box3-item-arrow-btm'>
|
||||||
|
<img src={`${process.env.PUBLIC_URL}/assets/box3_arrow.png`} alt=""/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-data'>
|
||||||
|
<div className='box3-item-data-top'>91.23%</div>
|
||||||
|
<div className='box3-item-data-btm'>2021年</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item'>
|
||||||
|
<div className='box3-item-title'>
|
||||||
|
供水漏损率
|
||||||
|
</div>
|
||||||
|
<div className='box3-content-bottom'>
|
||||||
|
<div className='box3-item-img'>
|
||||||
|
<img src={`${process.env.PUBLIC_URL}/assets/box6_2.png`} alt=""/>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-data'>
|
||||||
|
<div className='box3-item-data-top'>91.23%</div>
|
||||||
|
<div className='box3-item-data-btm'>2018年</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-arrow'>
|
||||||
|
<div className='box3-item-arrow-top'>5.2%</div>
|
||||||
|
<div className='box3-item-arrow-btm'>
|
||||||
|
<img src={`${process.env.PUBLIC_URL}/assets/box3_arrow.png`} alt=""/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-data'>
|
||||||
|
<div className='box3-item-data-top'>91.23%</div>
|
||||||
|
<div className='box3-item-data-btm'>2021年</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item'>
|
||||||
|
<div className='box3-item-title'>
|
||||||
|
巡检养护率
|
||||||
|
</div>
|
||||||
|
<div className='box3-content-bottom'>
|
||||||
|
<div className='box3-item-img'>
|
||||||
|
<img src={`${process.env.PUBLIC_URL}/assets/box6_3.png`} alt=""/>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-data'>
|
||||||
|
<div className='box3-item-data-top'>91.23%</div>
|
||||||
|
<div className='box3-item-data-btm'>2018年</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-arrow'>
|
||||||
|
<div className='box3-item-arrow-top'>5.2%</div>
|
||||||
|
<div className='box3-item-arrow-btm'>
|
||||||
|
<img src={`${process.env.PUBLIC_URL}/assets/box3_arrow.png`} alt=""/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-data'>
|
||||||
|
<div className='box3-item-data-top'>91.23%</div>
|
||||||
|
<div className='box3-item-data-btm'>2021年</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item'>
|
||||||
|
<div className='box3-item-title'>
|
||||||
|
便民服务率
|
||||||
|
</div>
|
||||||
|
<div className='box3-content-bottom'>
|
||||||
|
<div className='box3-item-img'>
|
||||||
|
<img src={`${process.env.PUBLIC_URL}/assets/box6_4.png`} alt=""/>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-data'>
|
||||||
|
<div className='box3-item-data-top'>91.23%</div>
|
||||||
|
<div className='box3-item-data-btm'>2018年</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-arrow'>
|
||||||
|
<div className='box3-item-arrow-top'>5.2%</div>
|
||||||
|
<div className='box3-item-arrow-btm'>
|
||||||
|
<img src={`${process.env.PUBLIC_URL}/assets/box3_arrow.png`} alt=""/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='box3-item-data'>
|
||||||
|
<div className='box3-item-data-top'>91.23%</div>
|
||||||
|
<div className='box3-item-data-btm'>2021年</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue