diff --git a/weapp/src/packages/components/inputPicker/index.jsx b/weapp/src/packages/components/inputPicker/index.jsx
new file mode 100644
index 00000000..f6b4b197
--- /dev/null
+++ b/weapp/src/packages/components/inputPicker/index.jsx
@@ -0,0 +1,48 @@
+/*
+* 输入框筛选选择器
+*/
+import React, { useState, useEffect } from 'react'
+import { View, Picker, Image, Input } from '@tarojs/components'
+import arrowIcon from '../../../static/img/patrol/arrow-down.svg'
+import './index.scss'
+
+export default function InputPicker(props) {
+  const { title, placeholder, selector, value, onInput } = props
+  const [curSelector, setCurSelector] = useState([])
+
+  useEffect(() => {
+    setCurSelector(selector)
+  }, [])
+
+  function handleInput({ detail: { value: v } }) {
+    onInput(v)
+    if (v) {
+      setCurSelector(selector.filter(item => item.includes(v)))
+    } else {
+      setCurSelector(selector)
+    }
+  }
+
+  const handlePickerChange = (e) => {
+    onInput(curSelector[e.detail.value])
+  }
+
+  return (
+    <View className='input-picker'>
+      <View className='input-box'>
+        <View className='title'>{title}</View>
+        <Input
+          className='input'
+          type='text'
+          placeholder={placeholder}
+          border={false}
+          value={value}
+          onInput={handleInput}
+        />
+      </View>
+      <Picker mode='selector' range={curSelector} onChange={handlePickerChange}>
+        <Image src={arrowIcon} className='img' />
+      </Picker>
+    </View>
+  )
+}
\ No newline at end of file
diff --git a/weapp/src/packages/components/inputPicker/index.scss b/weapp/src/packages/components/inputPicker/index.scss
new file mode 100644
index 00000000..5a167df3
--- /dev/null
+++ b/weapp/src/packages/components/inputPicker/index.scss
@@ -0,0 +1,30 @@
+.input-picker {
+  display: flex;
+  justify-content: space-between;
+  height: 96px;
+  align-items: center;
+  background-color: #fff;
+  margin-bottom: 5px;
+
+  .input-box {
+    padding: 12px 0;
+    flex-grow: 1;
+    display: flex;
+    align-items: center;
+
+    .title {
+      margin-left: 30px;
+    }
+
+    .input {
+      margin-left: 20px;
+      flex-grow: 1;
+    }
+  }
+
+  .img {
+    width: 24px;
+    height: 14px;
+    margin: 0 30px;
+  }
+}
\ No newline at end of file
diff --git a/weapp/src/packages/patrol/index.jsx b/weapp/src/packages/patrol/index.jsx
index 36390b54..aa7140d9 100644
--- a/weapp/src/packages/patrol/index.jsx
+++ b/weapp/src/packages/patrol/index.jsx
@@ -7,86 +7,158 @@ import {
   Button,
   Image,
   Input,
-  Textarea,
   Picker
 } from '@tarojs/components';
-import { AtForm, AtInput, AtButton, AtTextarea, AtImagePicker, AtTimeline } from 'taro-ui';
-// import InputPicker from '../components/inputPicker';
+import { AtButton, AtTextarea, AtImagePicker } from 'taro-ui';
+import InputPicker from '../components/inputPicker';
+import request from '@/services/request';
+import { postReport } from '@/services/api';
 import './index.scss';
 import arrowIcon from '../../static/img/patrol/arrow-down.svg';
 
 const Index = () => {
-  const [isPatrol, setIsPatrol] = useState(true) // 巡查 or 养护
-  const [prjTypeSelector, setPrjTypeSelector] = useState([])
-  const [roadSelector, setRoadSelector] = useState([])
-  const [projectType, setProjectType] = useState('')
-  const [road, setRoad] = useState('')
+  const [reportType, setReportType] = useState('patrol') // 上报类型
+  const [projectType, setProjectType] = useState('') // 工程类型
+  const [road, setRoad] = useState('') // 所在道路
+  const [roadSectionStart, setRoadSectionStart] = useState('') // 路段 Start
+  const [roadSectionEnd, setRoadSectionEnd] = useState('') // 路段 End
+  const [address, setAddress] = useState('') // 具体位置
+  const [content, setContent] = useState('') // 巡查内容
+  const [scenePic, setScenePic] = useState([]) // 现场图片
+  const [conserveBeforePic, setConserveBeforePic] = useState([]) // 养护前图片
+  const [conserveUnderwayPic, setConserveUnderwayPic] = useState([]) // 养护中图片
+  const [conserveAfterPic, setConserveAfterPic] = useState([]) // 养护后图片
 
-  const [images, setimages] = useState([])
+  const [roadStartSelector, setRoadStartSelector] = useState([])
+  const [roadEndSelector, setRoadEndSelector] = useState([])
 
-  const reportType = [
-    {
-      value: '巡查',
-      text: '巡查',
-      checked: true
-    },
-    {
-      value: '养护',
-      text: '养护',
-      checked: false
-    }
-  ]
+  const rPrjTypeSelector = ['道路', '桥梁', '涵洞', '其他']
+  const rRoadSelector = ['富山一路', '金沙大道', '玉湖路']
+
+  const rRoadStartSelector = ['一段', '二段', '三段']
+  const rRoadEndSelector = ['一段', '二段', '三段']
 
   useEffect(() => {
-    const prjTypeSelector = ['道路', '桥梁', '涵洞', '其他']
-    const roadSelector = ['富山一路', '金沙大道', '玉湖路']
-    setPrjTypeSelector(prjTypeSelector)
-    setRoadSelector(roadSelector)
+    setRoadStartSelector(rRoadStartSelector)
+    setRoadEndSelector(rRoadEndSelector)
   }, [])
 
-  useEffect(() => {
-    if (projectType) {
-      setPrjTypeSelector(prjTypeSelector.filter(s => s.includes(projectType)))
+  function report() {
+    let data = {
+      reportType,
+      projectType,
+      road,
+      roadSectionStart,
+      roadSectionEnd,
+      address,
+      content,
+      longitude: 37.000000000000,
+      latitude: 69.000000000000
     }
-  }, [projectType])
-  // useEffect(() => {
-  //   if (projectType) {
-  //     setPrjTypeSelector(prjTypeSelector.filter(s => s.includes(projectType)))
-  //   }
-  // }, [projectType])
-
-  function onTypeChange(e) {
-    if (e.detail.value === '巡查') {
-      setIsPatrol(true)
+    if (reportType === 'patrol') {
+      data['scenePic'] = scenePic.length > 0 && scenePic.map(item => item.url)
     } else {
-      setIsPatrol(false)
+      data['conserveBeforePic'] = conserveBeforePic.length > 0 && conserveBeforePic.map(item => item.url)
+      data['conserveUnderwayPic'] = conserveUnderwayPic.length > 0 && conserveUnderwayPic.map(item => item.url)
+      data['conserveAfterPic'] = conserveAfterPic.length > 0 && conserveAfterPic.map(item => item.url)
     }
+    for (var key in data) {
+      if (!data[key]) {
+        Taro.showToast({ title: '请完善信息', icon: 'none' })
+        return
+      }
+    }
+    if (rPrjTypeSelector.indexOf(data.projectType) === -1) {
+      Taro.showToast({ title: '工程类型错误', icon: 'none' })
+      return
+    }
+    request.post(postReport(), data).then(res => {
+      if (res.statusCode == 200 || res.statusCode == 204) {
+        Taro.showToast({ title: '上报成功', icon: 'none' })
+      } else {
+        Taro.showToast({ title: res.data.message || '请求出错', icon: 'none' })
+      }
+    }, err => {
+      Taro.showToast({ title: err.message || '请求出错', icon: 'none' })
+    })
   }
 
-  function onPrjTypeChange(e) {
-    setProjectType(selector[e.detail.value])
+  function handleInput({ detail: { value } }, type) {
+    switch (type) {
+      case 'roadSectionStart':
+        setRoadSectionStart(value)
+        if (value) {
+          setRoadStartSelector(rRoadStartSelector.filter(item => item.includes(value)))
+        } else {
+          setRoadStartSelector(rRoadStartSelector)
+        }
+        break;
+      case 'roadSectionEnd':
+        setRoadSectionEnd(value)
+        if (value) {
+          setRoadEndSelector(rRoadEndSelector.filter(item => item.includes(value)))
+        } else {
+          setRoadEndSelector(rRoadEndSelector)
+        }
+        break;
+      case 'address':
+        setAddress(value)
+        break;
+      case 'content':
+        setContent(value)
+      default:
+        break;
+    }
   }
 
-  function onImgPickerChange(files) {
-    setimages(files)
+  function handleTypeChange(e) {
+    setReportType(e.detail.value)
   }
-  function onImageClick(index, file) {
+
+  function handleImgChange(files, type) {
+    switch (type) {
+      case 'scenePic':
+        setScenePic(files)
+        break;
+      case 'conserveBeforePic':
+        setConserveBeforePic(files)
+        break;
+      case 'conserveUnderwayPic':
+        setConserveUnderwayPic(files)
+        break;
+      case 'conserveAfterPic':
+        setConserveAfterPic(files)
+        break;
+      default:
+        break;
+    }
+  }
+  function handleImgClick(index, file) {
     Taro.previewImage({
       urls: [file.url] // 需要预览的图片http链接列表
     })
   }
 
-  useEffect(() => {
-    console.log(images);
-  }, [images])
+  const typeList = [
+    {
+      value: 'patrol',
+      text: '巡查',
+      checked: true
+    },
+    {
+      value: 'conserve',
+      text: '养护',
+      checked: false
+    }
+  ]
 
   return (
-    <View>
+    <View className='patrol'>
       <View className='report-type'>
         <View className='text'>上报类型</View>
-        <RadioGroup onChange={onTypeChange}>
+        <RadioGroup onChange={handleTypeChange}>
           {
-            reportType.map((item, i) => {
+            typeList.map((item, i) => {
               return (
                 <Radio
                   key={i}
@@ -103,107 +175,88 @@ const Index = () => {
         </RadioGroup>
       </View>
 
-      <View className='input-picker'>
-        <AtInput
-          className='input'
-          title='工程类型：'
-          type='text'
-          placeholder='请选择工程类型'
-          border={false}
-          value={projectType}
-          onChange={value => setProjectType(value)}
-        />
-        <Picker mode='selector' range={prjTypeSelector} onChange={onPrjTypeChange}>
-          <Image src={arrowIcon} className='img-r' />
-        </Picker>
-      </View>
-      <View className='input-picker'>
-        <AtInput
-          className='input'
-          title='所在道路：'
-          type='text'
-          placeholder='请选择您所在的道路'
-          border={false}
-          value={road}
-          onChange={value => setRoad(value)}
-        />
-        <Picker mode='selector' range={roadSelector} onChange={onPrjTypeChange}>
-          <Image src={arrowIcon} className='img-r' />
-        </Picker>
-      </View>
-
-      {/* <InputPicker 
-        className='input-picker'
+      <InputPicker
         title='工程类型：'
         placeholder='请选择工程类型'
         value={projectType}
-        onChange={setProjectType}
-        selector={prjTypeSelector}
+        onInput={setProjectType}
+        selector={rPrjTypeSelector}
       />
-      <InputPicker 
-        className='input-picker'
+      <InputPicker
         title='所在道路：'
-        placeholder='请选择您所在的道路'
+        placeholder='请选择或输入您所在的道路'
         value={road}
-        onChange={setRoad}
-        selector={roadSelector}
-      /> */}
+        onInput={setRoad}
+        selector={rRoadSelector}
+      />
 
-      <View className='input-picker'>
-        <AtInput
+      <View className='road-section'>
+        <View className='title'>所属路段：</View>
+        <Input
           className='input'
-          title='所属路段：'
           type='text'
           placeholder='路段名称'
           border={false}
-        // value={this.state.value}
-        // onChange={this.handleChange.bind(this, 'value')}
+          value={roadSectionStart}
+          onInput={e => handleInput(e, 'roadSectionStart')}
         />
-        <Picker mode='selector' range={roadSelector} onChange={onPrjTypeChange}>
+        <Picker
+          mode='selector'
+          range={roadStartSelector}
+          onChange={e => setRoadSectionStart(roadStartSelector[e.detail.value])}
+        >
           <Image src={arrowIcon} className='img-l' />
         </Picker>
-        <AtInput
+        <View>至&nbsp;</View>
+        <Input
           className='input'
           type='text'
           placeholder='路段名称'
           border={false}
-        // value={this.state.value}
-        // onChange={this.handleChange.bind(this, 'value')}
+          value={roadSectionEnd}
+          onInput={e => handleInput(e, 'roadSectionEnd')}
         />
-        <Picker mode='selector' range={roadSelector} onChange={onPrjTypeChange}>
+        <Picker
+          mode='selector'
+          range={roadEndSelector}
+          onChange={e => setRoadSectionEnd(roadEndSelector[e.detail.value])}
+        >
           <Image src={arrowIcon} className='img-r' />
         </Picker>
       </View>
 
-      <AtTextarea
-        count={false}
-        title='具体位置：'
-        placeholder='具体位置：根据定位自动获取，可手动修改'
-      // value={this.state.value}
-      // onChange={this.handleChange.bind(this, 'value')}
-      />
+      <View className='address'>
+        <View className='title'>具体位置：</View>
+        <Input
+          className='input'
+          type='text'
+          placeholder='根据定位自动获取，可手动修改'
+          value={address}
+          onInput={e => handleInput(e, 'address')}
+        />
+      </View>
+
       <AtTextarea
         count={false}
         title='巡查内容：'
         placeholder='请输入巡查内容'
-      // value={this.state.value}
-      // onChange={this.handleChange.bind(this, 'value')}
+        value={content}
+        onChange={(v, e) => handleInput(e, 'content')}
       />
-
       {
-        isPatrol ?
-          <View className='patrol-picker'>
+        reportType === 'patrol' ?
+          <View className='patrol-img'>
             现场图片：
             <AtImagePicker
               className='img-picker'
-              count={3 - images.length}
-              showAddBtn={images.length >= 3 ? false : true}
-              files={images}
-              onChange={onImgPickerChange}
-              onImageClick={onImageClick}
+              count={3 - scenePic.length}
+              showAddBtn={scenePic.length >= 3 ? false : true}
+              files={scenePic}
+              onChange={files => handleImgChange(files, 'scenePic')}
+              onImageClick={handleImgClick}
             />
           </View> :
-          <View className='conserve-picker'>
+          <View className='conserve-img'>
             养护图片:
             <View className='horizontal-line hl-one'>
               <View className='circle c-one'></View>
@@ -211,9 +264,11 @@ const Index = () => {
             </View>
             <AtImagePicker
               className='img-picker'
-              count={3}
-              files={images}
-              onChange={onImgPickerChange}
+              count={3 - conserveBeforePic.length}
+              showAddBtn={conserveBeforePic.length >= 3 ? false : true}
+              files={conserveBeforePic}
+              onChange={files => handleImgChange(files, 'conserveBeforePic')}
+              onImageClick={handleImgClick}
             />
             <View className='horizontal-line hl-two'>
               <View className='circle c-two'></View>
@@ -221,9 +276,11 @@ const Index = () => {
             </View>
             <AtImagePicker
               className='img-picker'
-              count={3}
-              files={images}
-              onChange={onImgPickerChange}
+              count={3 - conserveUnderwayPic.length}
+              showAddBtn={conserveUnderwayPic.length >= 3 ? false : true}
+              files={conserveUnderwayPic}
+              onChange={files => handleImgChange(files, 'conserveUnderwayPic')}
+              onImageClick={handleImgClick}
             />
             <View className='horizontal-line hl-three'>
               <View className='circle c-three'></View>
@@ -231,15 +288,15 @@ const Index = () => {
             </View>
             <AtImagePicker
               className='img-picker'
-              count={3}
-              files={images}
-              onChange={onImgPickerChange}
+              count={3 - conserveAfterPic.length}
+              showAddBtn={conserveAfterPic.length >= 3 ? false : true}
+              files={conserveAfterPic}
+              onChange={files => handleImgChange(files, 'conserveAfterPic')}
+              onImageClick={handleImgClick}
             />
           </View>
       }
-
-      <AtButton formType='submit' type='primary' className='sub-btn'>上报</AtButton>
-
+      <AtButton type='primary' className='sub-btn' onClick={report}>上报</AtButton>
     </View>
   )
 }
diff --git a/weapp/src/packages/patrol/index.scss b/weapp/src/packages/patrol/index.scss
index 83057e4b..186500ad 100644
--- a/weapp/src/packages/patrol/index.scss
+++ b/weapp/src/packages/patrol/index.scss
@@ -3,6 +3,10 @@ page {
   width: 100vw;
   background-color: #f6f6f6;
 
+  .patrol {
+    font-size: 28px;
+  }
+
   .report-type {
     height: 96px;
     background-color: #fff;
@@ -20,32 +24,58 @@ page {
     }
   }
 
-  .input-picker {
+  .road-section {
     display: flex;
     justify-content: space-between;
+    height: 96px;
     align-items: center;
     background-color: #fff;
     margin-bottom: 5px;
 
+    .title {
+      margin-left: 30px;
+    }
+
+    .input {
+      width: 200px;
+    }
+
     .img-r {
       width: 24px;
       height: 14px;
       margin-right: 30px;
-      // margin-left: 10px;
     }
     .img-l {
       width: 24px;
       height: 14px;
+      margin-right: 10px;
+    }
+  }
+
+  .address {
+    background-color: #fff;
+    display: flex;
+    align-items: center;
+    height: 96px;
+    margin-bottom: 5px;
+
+    .title {
+      margin-left: 30px;
+    }
+
+    .input {
+      margin-left: 20px;
+      flex-grow: 1;
     }
   }
 
-  .patrol-picker {
+  .patrol-img {
     background-color: #fff;
     padding: 20px;
 
   }
 
-  .conserve-picker {
+  .conserve-img {
     background-color: #fff;
     padding: 20px;
 
diff --git a/weapp/src/packages/patrolView/index.jsx b/weapp/src/packages/patrolView/index.jsx
index 04792eea..2b768793 100644
--- a/weapp/src/packages/patrolView/index.jsx
+++ b/weapp/src/packages/patrolView/index.jsx
@@ -35,7 +35,7 @@ function Index() {
     throw new Error(error);
   }
   useEffect(() => {
-    request.get(getReportList(),{}, { hideErrorToast: true, hideLoading: true }).then(res => {
+    request.get(getReportList(), {}, { hideErrorToast: true, hideLoading: true }).then(res => {
       if (res.statusCode == 200) {
         console.log(res);
         setListData(res.data)
diff --git a/weapp/src/services/api.js b/weapp/src/services/api.js
index bc0f6aeb..dab3cd0f 100644
--- a/weapp/src/services/api.js
+++ b/weapp/src/services/api.js
@@ -11,6 +11,10 @@ export const getReportList = () => {
   return `/report/list`;
 };
 
+export const postReport = () => {
+  return `/report`;
+};
+
 //行业查询
 export const getIndustryUrl = () => {
   return `/elec/business/industry`
diff --git a/web/client/src/sections/quanju/actions/example.js b/web/client/src/sections/quanju/actions/example.js
index e7336031..5d95fef1 100644
--- a/web/client/src/sections/quanju/actions/example.js
+++ b/web/client/src/sections/quanju/actions/example.js
@@ -34,7 +34,7 @@ export function getjiandmanage() {
         dispatch: dispatch,
         actionType: 'GET_JIANDMANAGE',
         url: ApiTable.getzhichaomanager,
-        msg: { error: '获取治超监测点处理数据信息' },
+        msg: { error: '获取治超监测点处理数据信息失败' },
         // reducer: { name: 'members' }
     });
 }
@@ -47,7 +47,19 @@ export function getjiandetail() {
         dispatch: dispatch,
         actionType: 'GET_JIANDETAIL',
         url: ApiTable.getzhichaodetail,
-        msg: { error: '获取治超监测点处理数据信息' },
+        msg: { error: '获取治超监测点处理数据信息失败' },
+        // reducer: { name: 'members' }
+    });
+}
+
+//获取宣传数据
+export function getxuanchuan() {
+    return dispatch => basicAction({
+        type: 'get',
+        dispatch: dispatch,
+        actionType: 'GET_XUANCHUAN',
+        url: ApiTable.getpropagata,
+        msg: { error: '获取宣传信息失败' },
         // reducer: { name: 'members' }
     });
 }
diff --git a/web/client/src/sections/quanju/containers/footer/build/Leftbottom.js b/web/client/src/sections/quanju/containers/footer/build/Leftbottom.js
index d2b731cb..01857791 100644
--- a/web/client/src/sections/quanju/containers/footer/build/Leftbottom.js
+++ b/web/client/src/sections/quanju/containers/footer/build/Leftbottom.js
@@ -24,6 +24,8 @@ function Leftbottom(props) {
   const chartTitle = '道路总公里';
   const title = '基础设施安全监测版块';
   let name = [], emptyName = []
+  console.log(data,'传入的值')
+  console.log(emptyName,'第二个')
   // const name = data?.map(d)
   data?.forEach(d => {
     name.push(d.name)
@@ -132,18 +134,60 @@ function Leftbottom(props) {
     tooltip: {
       trigger: "item",
     },
-    legend: {
-      orient: "vertical",
-      itemWidth: 10,
-      itemHeight: 10,
-      right: '30%',
-      top: 'center',
-      align: 'left',
-      data: name,
-      textStyle: {
-        color: "#fff",
+//      title: {
+//    text:total,//主标题文本
+//    left:'20%',
+//   //  top:'35%',
+//      subtext:chartTitle,//副标题文本
+//      textStyle:{
+//        fontFamily : "YouSheBiaoTiHei",
+//        fontSize: 20,
+//        color:'#FFFFFF',
+//        marginLeft:'20%',
+//        align:'center'
+//        },
+//        subtextStyle:{
+//          fontFamily : "PingFangSC-Medium PingFang SC",
+//          fontSize: 12,
+//          fontWeight:500,
+//          color:'#E9F7FF',
+//          align:'center'
+
+//     }
+// },
+legend: {
+  orient: "vertical",
+  itemWidth: 10,
+  itemHeight: 10,
+  // right: '30%',
+  right: '10%',
+  top: 'center',
+  align: 'left',
+  data: name,
+  formatter: (name) => {
+    for (let i = 0; i < option.series[1].data.length; i += 1) {
+      if (name === option.series[1].data[i].name) {
+        let arr = [`{a|${name}}`, `{b|${option.series[1].data[i].value}}`]
+        return arr.join('\t');
+      }
+    }
+  },
+  textStyle: {
+    rich: {
+      a: {
+        color: '#E9F7FF',
+        fontSize: 14,
+        padding:[0,10]
       },
-    },
+      b: {
+        fontSize: 16,
+        fontFamily: 'YouSheBiaoTiHei',
+        color: '#fff',
+        padding:[0,0,0,15]
+      },
+    }
+  }
+},
     grid: {
       left: '10%'
     },
@@ -219,12 +263,12 @@ function Leftbottom(props) {
     return ()=>{
       // clearInterval(changePieInterval)
     }
-}, []);
+}, [data]);
 
   return (
     <div className='build-left-bottom'>
      <div className='build-left-bottom-title'>
-        <h2>3234.23</h2>
+        <h2>{total}</h2>
         <span>道路总公里</span>
      </div>
       <img src='/assets/images/quanju/chart-circle.png'></img>
diff --git a/web/client/src/sections/quanju/containers/footer/build/Rightbottom.js b/web/client/src/sections/quanju/containers/footer/build/Rightbottom.js
index 2c8107f0..d18477ed 100644
--- a/web/client/src/sections/quanju/containers/footer/build/Rightbottom.js
+++ b/web/client/src/sections/quanju/containers/footer/build/Rightbottom.js
@@ -53,12 +53,34 @@ function Rightbottom(props) {
       orient: "vertical",
       itemWidth: 10,
       itemHeight: 10,
-      right: '30%',
+      // right: '30%',
+      left: '50%',
       top: 'center',
       align: 'left',
-      textStyle: {
-        color: "#fff",
+      data: name,
+      formatter: (name) => {
+        for (let i = 0; i < option.series[1].data.length; i += 1) {
+          if (name === option.series[1].data[i].name) {
+            let arr = [`{a|${name}}`, `{b|${option.series[1].data[i].value}}`]
+            return arr.join('\t');
+          }
+        }
       },
+      textStyle: {
+        rich: {
+          a: {
+            color: '#E9F7FF',
+            fontSize: 14,
+            padding:[0,10]
+          },
+          b: {
+            fontSize: 16,
+            fontFamily: 'YouSheBiaoTiHei',
+            color: '#fff',
+            padding:[0,0,0,15]
+          },
+        }
+      }
     },
     grid: {
       left: '10%'
@@ -133,14 +155,14 @@ function Rightbottom(props) {
     // }
     myChart.setOption(option);
     return ()=>{
-      clearInterval(changePieInterval)
+      // clearInterval(changePieInterval)
     }
-}, []);
+}, [data]);
 
   return (
     <div className='build-right-bottom'>
       <div className='build-right-bottom-title'>
-        <h2>3234.23</h2>
+        <h2>{total||0}</h2>
         <span>道路总公里</span>
      </div>
       <img src='/assets/images/quanju/chart-circle.png'></img>
diff --git a/web/client/src/sections/quanju/containers/footer/build/Rightcenter.js b/web/client/src/sections/quanju/containers/footer/build/Rightcenter.js
index 0c716667..e5cbeb9c 100644
--- a/web/client/src/sections/quanju/containers/footer/build/Rightcenter.js
+++ b/web/client/src/sections/quanju/containers/footer/build/Rightcenter.js
@@ -1,32 +1,33 @@
 import React from 'react'
 import './style.less'
 import AutoRollComponent from './AutoRollComponent'
-export default function Rightcenter() {
-  const data =[ {name: '莲塘镇', total: 12739},
-  {name: '向塘镇', total: 2445},
-  {name: '蒋巷镇', total: 2035},
-  {name: '幽兰镇', total: 1999},
-  {name: '塘南镇', total: 1915},
-  {name: '武阳镇', total: 1842},
-  {name: '冈上镇', total: 1446},
-  {name: '广福镇', total: 1063},
-  {name: '三江镇', total: 851},
-  {name: '泾口乡', total: 657},
-   {name: '南新镇', total: 640},
-   {name: '八一乡', total: 569},
-   {name: '黄马乡', total: 541},
-   {name: '塔城乡', total: 534},
-   {name: '富山乡', total: 515},
-   {name: '东新乡', total: 513},
-   {name: '银三角', total: 513},
-   {name: '八月湖街道', total: 513},]
-   const province = undefined
+export default function Rightcenter({data,sundata}) {
+  // const data =[ {name: '莲塘镇', total: 12739},
+  // {name: '向塘镇', total: 2445},
+  // {name: '蒋巷镇', total: 2035},
+  // {name: '幽兰镇', total: 1999},
+  // {name: '塘南镇', total: 1915},
+  // {name: '武阳镇', total: 1842},
+  // {name: '冈上镇', total: 1446},
+  // {name: '广福镇', total: 1063},
+  // {name: '三江镇', total: 851},
+  // {name: '泾口乡', total: 657},
+  //  {name: '南新镇', total: 640},
+  //  {name: '八一乡', total: 569},
+  //  {name: '黄马乡', total: 541},
+  //  {name: '塔城乡', total: 534},
+  //  {name: '富山乡', total: 515},
+  //  {name: '东新乡', total: 513},
+  //  {name: '银三角', total: 513},
+  //  {name: '八月湖街道', total: 513},]
+  //  const province = undefined
   const FIRST = "linear-gradient(360deg, rgba(43, 180, 211, 0.1) 0%, rgba(43, 180, 211, 0.4) 100%)"
 const SECOND = "linear-gradient(360deg, rgba(255, 209, 86, 0.1) 0%, rgba(255, 209, 86, 0.4) 100%)"
 const THIRD = "linear-gradient(360deg, rgba(148, 148, 255, 0.1) 0%, rgba(148, 148, 255, 0.4) 100%)"
 const OTHER = "linear-gradient(360deg, rgba(28, 96, 253, 0) 0%, rgba(28, 96, 253, 0.2) 100%)"
 let TOTALS = data?.map(({ name, total }, index) => {
-  let max = province ? data.length * 30 + 100 : data.length * 500 + 100
+  let max = Math.max(...data.map(item=>item.total))
+  console.log(data.map(item=>item.total),'好朋友吗')
   return {
     name,
     value: total,
@@ -35,7 +36,7 @@ let TOTALS = data?.map(({ name, total }, index) => {
 })
 let new_TOTALS = TOTALS && TOTALS.length > 10 ? TOTALS.slice(0, 10) : TOTALS
 function Cell(props) {
-  const { name, rank, value, percent, style = {} } = props
+  const { name, rank, value, percent, style = {},cebg } = props
   let bg = RNAKS[rank] || OTHER
   console.log(percent,'百分比')
   return <div style={{
@@ -57,9 +58,11 @@ function Cell(props) {
       <div style={{ display: 'flex', justifyContent: "space-between", alignItems: "center", height: 13 }}>
        <div style={{display:'flex', width:"85%"}}>
           <div style={{
+            position:'relative',
           width: percent, height: 5,
-          background: "linear-gradient(270deg, #1C60FE 0%, rgba(28, 96, 254, 0) 100%)"
-            }} />
+          background: cebg || "linear-gradient(270deg, #1C60FE 0%, rgba(28, 96, 254, 0) 100%)"
+            }} >{cebg?<span style={{position:'absolute',right:'0',top:'0',backgroundColor:"#FFF",height:"5px",width:"5px",borderRadius:"2.5px"}}/>:""}</div>
+            
             <div style={{width:`calc(100% - ${percent})`,background:'rgba(255,255,255,0.0800)'}}/>
           </div>
         <div style={{ marginLeft: 10, fontSize: 12,color:"#FFFFFF" }}>{value}</div>
@@ -68,11 +71,11 @@ function Cell(props) {
   </div>
 }
 const renderContent = () => {
-  return <div >
-    {new_TOTALS?.map(({ name, value, percent }, index) => {
-      return <Cell key={index} rank={index} name={name} value={value} percent={percent} />
-    })}
-  </div>
+ 
+  return new_TOTALS?.map(({ name, value, percent }, index) => {
+      return <Cell key={index} rank={index} name={name} value={value} percent={percent} cebg={index===0?'linear-gradient(63deg, rgba(16, 39, 75, 1) 0%, rgba(7, 185, 254, 1) 100%)':undefined}/>
+    })
+  
 }
 const RNAKS = [FIRST, SECOND, THIRD]
  
@@ -81,7 +84,7 @@ const RNAKS = [FIRST, SECOND, THIRD]
       <div className='build-right-center-top'>
         <img src="/assets/images/quanju/gonglugongcheng.png"></img>
         <div>在线公路工程数量</div>
-        <h2>1234,123</h2>
+        <h2>{sundata}</h2>
       </div>
       <AutoRollComponent content={renderContent()}
     containerStyle={{ position: "relative", height: "65%", }}
diff --git a/web/client/src/sections/quanju/containers/footer/build/index.js b/web/client/src/sections/quanju/containers/footer/build/index.js
index bbfac6ca..cc0736fe 100644
--- a/web/client/src/sections/quanju/containers/footer/build/index.js
+++ b/web/client/src/sections/quanju/containers/footer/build/index.js
@@ -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>
diff --git a/web/client/src/sections/quanju/containers/footer/build/style.less b/web/client/src/sections/quanju/containers/footer/build/style.less
index 6e534f0f..beae659e 100644
--- a/web/client/src/sections/quanju/containers/footer/build/style.less
+++ b/web/client/src/sections/quanju/containers/footer/build/style.less
@@ -141,6 +141,10 @@
                     display: flex ;
                     width: 100%;
                     height: 28px;
+                    align-items: center;
+                    &:hover{
+                        background: linear-gradient(270deg, rgba(0,124,230,0) 0%, rgba(0,70,200,0.8700) 100%);
+                    }
                     span{
                         flex:1;
                         text-align: center;
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..aca6e2bc 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,27 @@
+'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' }
+    });
+}
+//获取道路养护统计及列表
+export function getRoadMaintenances() {
+    return dispatch => basicAction({
+        type: 'get',
+        dispatch: dispatch,
+        actionType: 'GET_ROAD_MAINTENANCES',
+        url: ApiTable.getRoadMaintenance,
+        msg: { error: '获取道路养护列表失败' },
+        reducer: { name: 'RoadMaintenances' }
+    });
+}
diff --git a/web/client/src/sections/quanju/containers/footer/conserve/chart/pie-chart.js b/web/client/src/sections/quanju/containers/footer/conserve/chart/pie-chart.js
index f3f26f3e..75ec1b77 100644
--- a/web/client/src/sections/quanju/containers/footer/conserve/chart/pie-chart.js
+++ b/web/client/src/sections/quanju/containers/footer/conserve/chart/pie-chart.js
@@ -5,7 +5,6 @@ import * as echarts from 'echarts';
 const PieChart = (props) => {
 
   const { width, height, data, colorList, underColorList, total, text } = props
-
   const chartRef = useRef(null);
   let name = [], emptyName = []
   // const name = data?.map(d)
@@ -26,13 +25,34 @@ const PieChart = (props) => {
         orient: "vertical",
         itemWidth: 10,
         itemHeight: 10,
-        right: '30%',
+        // right: '30%',
+        left: '50%',
         top: 'center',
         align: 'left',
         data: name,
-        textStyle: {
-          color: "#fff",
+        formatter: (name) => {
+          for (let i = 0; i < option.series[1].data.length; i += 1) {
+            if (name === option.series[1].data[i].name) {
+              let arr = [`{a|${name}}`, `{b|${option.series[1].data[i].value}}`]
+              return arr.join('\t');
+            }
+          }
         },
+        textStyle: {
+          rich: {
+            a: {
+              color: '#E9F7FF',
+              fontSize: 14,
+              padding:[0,2]
+            },
+            b: {
+              fontSize: 16,
+              fontFamily: 'YouSheBiaoTiHei',
+              color: '#fff',
+              padding:[0,0,0,10]
+            },
+          }
+        }
       },
       grid: {
         left: '10%'
@@ -58,13 +78,55 @@ const PieChart = (props) => {
       //     },
       //   },
       // ],
+      graphic: {
+        elements: [
+          {
+            type: 'image',
+            style: {
+              image: 'assets/images/quanju/chart-circle.png',
+              width: 120,
+              height: 120,
+              align: 'center',
+              // x:90,
+              // y:100
+            },
+            left: '14%',
+            top: 'center',
+
+            bounding: 'raw'
+            // position: ['40%', '40%'],
+          },
+          {
+            type: 'text',
+            style: {
+              text: text,
+              align: 'center',
+              fill: '#fff',
+              font: '12px "YouSheBiaoTiHei", sans-serif',
+            },
+            left: '17%',
+            top: '55%',
+          },
+          {
+            type: 'text',
+            style: {
+              text: total,
+              align: 'center',
+              fill: '#fff',
+              font: '20px "YouSheBiaoTiHei", sans-serif',
+            },
+            left: '18.5%',
+            top: 'center',
+          },
+        ],
+      },
       series: [
         {
           name: "底层背景",
           type: "pie",
           hoverAnimation: false,
           legendHoverLink: false,
-          radius: ["60%", "72%"],
+          radius: ["58%", "67%"],
           center: ['25%', '50%'],
           color: underColorList,
           label: {
@@ -82,7 +144,7 @@ const PieChart = (props) => {
         {
           name: "已绿化里程统计",
           type: "pie",
-          radius: ["67%", "80%"],
+          radius: ["65%", "75%"],
           center: ['25%', '50%'],
           color: colorList,
           label: {
@@ -99,7 +161,7 @@ const PieChart = (props) => {
         chartInstance.resize()
       }
     })
-  }, [])
+  }, [data])
   return (
     <div style={{ width: width || '100%', height: height || '100%' }}>
       <div ref={chartRef} style={{ width: '100%', height: '100%' }}></div>
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..750f3285 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,15 @@ import Left from './left'
 import Right from './right'
 import { connect } from 'react-redux'
 import { getdaolutongji } from '../../../actions/example'
+import { getHighways, getRoadMaintenances } from './action'
 
 
 const Conserve = (props) => {
 
     const [roadData, setRoadData] = useState()
+    const [highwaysData, setHighwaysData] = useState()
+    const [roadMaintenances, setRoadMaintenances] = useState()
+
     const [loading, setLoading] = useState(true)
     const { dispatch } = props
     useEffect(() => {
@@ -15,12 +19,18 @@ const Conserve = (props) => {
             setLoading(false)
             setRoadData(res.payload.data || {})
         })
+        dispatch(getHighways()).then(res =>{
+            setHighwaysData(res.payload.data || [])
+        })
+        dispatch(getRoadMaintenances()).then(res =>{
+            setRoadMaintenances(res.payload.data || [])
+        })
     }, [])
 
     return (
         <div style={{ display: 'flex', width: '100%', height: '100%', justifyContent: 'space-between' }}>
             <Left roadData={roadData} loading={loading} />
-            <Right roadData={roadData} loading={loading} />
+            <Right highwaysData={highwaysData} roadMaintenances={roadMaintenances}/>
         </div>
     )
 }
diff --git a/web/client/src/sections/quanju/containers/footer/conserve/left/left-bottom.js b/web/client/src/sections/quanju/containers/footer/conserve/left/left-bottom.js
index 82097322..37394a3a 100644
--- a/web/client/src/sections/quanju/containers/footer/conserve/left/left-bottom.js
+++ b/web/client/src/sections/quanju/containers/footer/conserve/left/left-bottom.js
@@ -2,11 +2,6 @@ import React from 'react'
 import Module from '../../../public/module'
 import PieChart from '../chart/pie-chart';
 
-let data = [
-  { value: 435, name: "县道" },
-  { value: 679, name: "乡道" },
-  { value: 848, name: "村道" },
-]
 let colorList = [
   "rgba(7,185,254,1)",
   "rgba(28,96,254,1)",
@@ -17,18 +12,29 @@ let underColorList = [
   "rgba(28,96,254,0.5)",
   "rgba(4,251,240,0.5)",
 ]
-const LeftBottom = () => {
+const LeftBottom = (props) => {
   const style = { height: "31%", marginTop: "3%" }
+  const { roadData } = props
+  const list = roadData?.greenMileage || {}
+  let grade = ['县道', '乡道', '村道']
+  let totalData = null
+  const value = Object.values(list)?.map((s, index) => {
+    totalData += s.isGreen
+    return {
+      name: grade[index],
+      value: s.isGreen.toFixed(3)
+    }
+  })
+
   return (
     <>
       <Module style={style} title={"已绿化里程统计"}>
-        {/* <div ref = {chartRef} style={{ width: '100%', height: '100%' }}></div> */}
         <PieChart
-          data={data}
+          data={value}
           width='100%'
           height='100%'
           text='已绿化里程'
-          total={2344.13}
+          total={totalData?.toFixed(3) || 0}
           colorList={colorList}
           underColorList={underColorList}
         />
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..b96513e2 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,roadMaintenances } = props
     return (
         <div style={{ display: 'flex', flexDirection: 'column', width: "23%", height: "100%", marginRight: "1%", }}>
-            <RightTop roadData={roadData} />
-            <RightCenter roadData={roadData} />
-            <RightBottom roadData={roadData} />
+            <RightTop  highwaysData={highwaysData}/>
+            <RightCenter highwaysData={highwaysData}/>
+            <RightBottom roadMaintenances={roadMaintenances}/>
         </div>
     )
 }
diff --git a/web/client/src/sections/quanju/containers/footer/conserve/right/right-bottom.js b/web/client/src/sections/quanju/containers/footer/conserve/right/right-bottom.js
index 744165df..919bcdc0 100644
--- a/web/client/src/sections/quanju/containers/footer/conserve/right/right-bottom.js
+++ b/web/client/src/sections/quanju/containers/footer/conserve/right/right-bottom.js
@@ -2,12 +2,6 @@ import React from 'react'
 import Module from '../../../public/module'
 import PieChart from '../chart/pie-chart';
 
-let data = [
-  { value: 435, name: "道路" },
-  { value: 679, name: "桥梁" },
-  { value: 848, name: "涵洞" },
-  { value: 666, name: "其他" },
-]
 let colorList = [
   "rgba(7,185,254,1)",
   "rgba(28,96,254,1)",
@@ -20,18 +14,49 @@ let underColorList = [
   "rgba(4,251,240,0.5)",
   "rgba(255,194,20,0.5)"
 ]
-const RightBottom = () => {
+
+const type = ['road', 'culvert', 'bridge']
+
+const RightBottom = (props) => {
+  const { roadMaintenances } = props
+  let totalData = null
+  let typesNum = null
+  const list = roadMaintenances?.reportCount?.map((r, index) => {
+    totalData += Number(r.count)
+    if (r.projectType === type[index]) {
+      typesNum += Number(r.count)
+    }
+    switch (r.projectType) {
+      case 'road':
+        return {
+          name: '道路',
+          value: r.count
+        };
+      case 'culvert':
+        return {
+          name: '涵洞',
+          value: r.count
+        };
+      case 'bridge':
+        return {
+          name: '桥梁',
+          value: r.count
+        }
+    }
+  }).filter(f => f !== undefined)
+  const otherNum = totalData - typesNum
+  otherNum !== null && list?.push({ name: '其他', value: otherNum })
   const style = { height: "31%", marginTop: "3%" }
   return (
     <>
       <Module style={style} title={"养护完成情况"}>
         {/* <div ref = {chartRef} style={{ width: '100%', height: '100%' }}></div> */}
         <PieChart
-          data={data}
+          data={list}
           width='100%'
           height='100%'
           text='养护总数'
-          total={2344.13}
+          total={totalData || 0}
           colorList={colorList}
           underColorList={underColorList}
         />
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 6689f500..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: 24, fontFamily: 'YouSheBiaoTiHei', textShadow: '0px 0px 8px #1C60FE', marginTop: 8 }
-
+  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 (
       <>
           <Module style={style} title={"各类附属设施数量统计"}>
           <div style={{ paddingLeft: '8%' }}>
-          <Row style={{ marginTop: 20, justifyContent: 'space-around' }}>
-            <Col style={{ display: 'flex', width: '50%' }}>
-              <img src='assets/images/quanju/jiancha.png' alt='icon' />
-              <div style={{ marginLeft: 10 }}>
-                <div style={textStyle}>检查井</div>
-                <div style={numStyle}>89个</div>
+          {
+            lists?.map((item, index) => {
+              return <div style={{ display: 'flex', marginTop: "5%", justifyContent: 'space-around' }} key={index}>
+                {
+                  item?.map(i => (
+                    <div style={{ display: 'flex', width: '50%' }} key={i.id}>
+                      <img src={i.icon} alt='icon' style={{ width: '36%', height: '100%' }} />
+                      <div style={{ marginLeft: 10 }}>
+                        <div style={textStyle}>{i.name}</div>
+                        <div style={numStyle}>{`${i.count}个`}</div>
+                      </div>
+                    </div>
+                  ))
+                }
               </div>
-            </Col>
-            <Col style={{ display: 'flex', width: '50%' }}>
-              <img src='assets/images/quanju/yushui.png' alt='icon' />
-              <span style={{ marginLeft: 10 }}>
-                <div style={textStyle}>雨水口</div>
-                <div style={numStyle}>61个</div>
-              </span>
-            </Col>
-          </Row>
-          <Row style={{ marginTop: 20, justifyContent: 'space-around' }}>
-            <Col style={{ display: 'flex', width: '50%' }}>
-              <img src='assets/images/quanju/lupai.png' alt='icon' />
-              <span style={{ marginLeft: 10 }}>
-                <div style={textStyle}>路牌名</div>
-                <div style={numStyle}>2230个</div>
-              </span>
-            </Col>
-            <Col span={12} style={{ display: 'flex', width: '50%' }}>
-              <img src='assets/images/quanju/zerenpai.png' alt='icon' />
-              <span style={{ marginLeft: 10 }}>
-                <div style={textStyle}>养护责任牌</div>
-                <div style={numStyle}>1217个</div>
-              </span>
-            </Col>
-          </Row>
+            })
+          }
         </div>
           </Module>
       </>
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 6e1cd0c6..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 RightTop = () => {
+
+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: 20, fontFamily: 'YouSheBiaoTiHei', textShadow: '0px 0px 8px #1C60FE', marginTop: 8 }
+  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 (
     <>
       <Module style={style} title={"道路设施数量统计"}>
         <div style={{ paddingLeft: '8%' }}>
-          <Row style={{ marginTop: "5%", justifyContent: 'space-around' }}>
-            <Col style={{ display: 'flex', width: '50%' }}>
-              <img src='assets/images/quanju/biaoxian.png' alt='icon' />
-              <div style={{ marginLeft: 10 }}>
-                <div style={textStyle}>标线</div>
-                <div style={numStyle}>1352km</div>
+          {
+            lists?.map((item, index) => {
+              return <div style={{ display: 'flex', marginTop: "5%", justifyContent: 'space-around' }} key={index}>
+                {
+                  item?.map(i => (
+                    <div style={{ display: 'flex', width: '50%' }} key={i.id}>
+                      <img src={i.icon} alt='icon' style={{ width: '36%', height: '100%' }} />
+                      <div style={{ marginLeft: 10 }}>
+                        <div style={textStyle}>{i.name}</div>
+                        <div style={numStyle}>{`${i.count}${i.unit}`}</div>
+                      </div>
+                    </div>
+                  ))
+                }
               </div>
-            </Col>
-            <Col style={{ display: 'flex', width: '50%' }}>
-              <img src='assets/images/quanju/renxing.png' alt='icon' />
-              <span style={{ marginLeft: 10 }}>
-                <div style={textStyle}>人行道</div>
-                <div style={numStyle}>80处</div>
-              </span>
-            </Col>
-          </Row>
-          <Row style={{ justifyContent: 'space-around' }}>
-            <Col style={{ display: 'flex', width: '50%' }}>
-              <img src='assets/images/quanju/biaozhi.png' alt='icon' />
-              <span style={{ marginLeft: 10 }}>
-                <div style={textStyle}>标志牌</div>
-                <div style={numStyle}>4563个</div>
-              </span>
-            </Col>
-            <Col span={12} style={{ display: 'flex', width: '50%' }}>
-              <img src='assets/images/quanju/fanghu.png' alt='icon' />
-              <span style={{ marginLeft: 10 }}>
-                <div style={textStyle}>防护栏</div>
-                <div style={numStyle}>1054km</div>
-              </span>
-            </Col>
-          </Row>
+            })
+          }
         </div>
       </Module>
     </>
diff --git a/web/client/src/sections/quanju/containers/footer/guanli/index.js b/web/client/src/sections/quanju/containers/footer/guanli/index.js
index 4557fdaf..e421b50d 100644
--- a/web/client/src/sections/quanju/containers/footer/guanli/index.js
+++ b/web/client/src/sections/quanju/containers/footer/guanli/index.js
@@ -59,7 +59,7 @@ const Guanli = (props) => {
             <div className = "guanli-right-top">
                 <img src="/assets/images/quanju/zhicaolog.png"></img>
                 <span>已处理</span>
-                <span>{rightDatas.processed||0}</span>
+                <span>{rightDatas?.processed||0}</span>
                 <span>件</span>
             </div>
             <div className='guanli-right-title'>
diff --git a/web/client/src/sections/quanju/containers/footer/guanli/style.less b/web/client/src/sections/quanju/containers/footer/guanli/style.less
index ac6fba18..f7620451 100644
--- a/web/client/src/sections/quanju/containers/footer/guanli/style.less
+++ b/web/client/src/sections/quanju/containers/footer/guanli/style.less
@@ -153,7 +153,7 @@
                 font-weight: 400;
                 color: rgba(216,240,255,0.8000);
                 line-height: 20px;
-                // flex:1;
+                flex:1;
                 text-align: center;
                 // &:nth-child(1){
                     
diff --git a/web/client/src/utils/webapi.js b/web/client/src/utils/webapi.js
index a1772ef0..7e609424 100644
--- a/web/client/src/utils/webapi.js
+++ b/web/client/src/utils/webapi.js
@@ -60,12 +60,20 @@ export const ApiTable = {
     getzhichaodetail: '/manage/overspeed',
 
     //大屏运营 —— 公交车辆层级信息
-    getBusTier:'/operation/car_level'
-};
+    getBusTier:'/operation/car_level',
+
+    //获取路政列表
+    getHighways: 'road_manage',
 
+    //获取道路养护统计及列表
+    getRoadMaintenance: 'conserve/statistic',
 
+    //获取宣传数据
+    getpropagata:'publicity',
 
 
+};
+
 
 export const RouteTable = {
     apiRoot: '/api/root',