diff --git a/public/assets/afjc.png b/public/assets/afjc.png
new file mode 100644
index 0000000..ee7d00f
Binary files /dev/null and b/public/assets/afjc.png differ
diff --git a/public/assets/gxzgxnl.png b/public/assets/gxzgxnl.png
new file mode 100644
index 0000000..cff4524
Binary files /dev/null and b/public/assets/gxzgxnl.png differ
diff --git a/public/assets/jwnqsl.png b/public/assets/jwnqsl.png
index 1a3dbb6..c09b07a 100644
Binary files a/public/assets/jwnqsl.png and b/public/assets/jwnqsl.png differ
diff --git a/public/assets/syfgrkqk.png b/public/assets/syfgrkqk.png
new file mode 100644
index 0000000..9fe503f
Binary files /dev/null and b/public/assets/syfgrkqk.png differ
diff --git a/public/assets/szjc.png b/public/assets/szjc.png
index 8c752fe..0ff3b09 100644
Binary files a/public/assets/szjc.png and b/public/assets/szjc.png differ
diff --git a/src/views/Sygl/index.less b/src/views/Sygl/index.less
index f6a5dd6..f0be9e6 100644
--- a/src/views/Sygl/index.less
+++ b/src/views/Sygl/index.less
@@ -34,23 +34,43 @@
   }
 
   .tqyb-box{
-    margin-top:8px;
+    /*margin-top:8px;
     img{
       width: 85%;
-    }
+    }*/
+    width: 100%;
+    height: 25vh;
+    background: url("../../../public/assets/syfgrkqk.png") 0 0 no-repeat;
+    background-size: cover;
   }
   .tqyb-box1{
-    margin-top:8px;
-    img{
-      width: 86%;
-    }
+    width: 100%;
+    height: 25vh;
+    background: url("../../../public/assets/jwnqsl.png") 0 0 no-repeat;
+    background-size: cover;
+  }
+  .tqyb-box2{
+     width: 100%;
+     height: 24vh;
+     background: url("../../../public/assets/gxzgxnl.png") 0 0 no-repeat;
+     background-size: cover;
+   }
+  .tqyb-box3{
+    width: 100%;
+    height: 24vh;
+    background: url("../../../public/assets/szjc.png") 0 0 no-repeat;
+    background-size: cover;
   }
   .szjc-box{
-    padding-left: 20px;
+    /*padding-left: 20px;
     margin-top:8px;
     img{
-      width: 90%;
-    }
+      width: 23vw;
+    }*/
+    width: 100%;
+    height: 25vh;
+    background: url("../../../public/assets/afjc.png") 0 0 no-repeat;
+    background-size: cover;
   }
 
   .echarts-box{
diff --git a/src/views/Sygl/index.tsx b/src/views/Sygl/index.tsx
index 52d8331..63c5440 100644
--- a/src/views/Sygl/index.tsx
+++ b/src/views/Sygl/index.tsx
@@ -256,25 +256,25 @@ const SyglPage: React.FC = () => {
             <div className="echarts-box">
               <ReactEcharts
                 option={echartsOption}
-                style={{ width:"100%", height: 'calc( 100% - 10px )' }}
+                style={{ width:"100%", height: '25vh' }}
               />
             </div>
           </div>
         </div>
         <div className='box'>
           <div className='box-title'>
-            <div className='title-item'>重点水源</div>
-            <div className="tqyb-box1">
-              <img src={`${process.env.PUBLIC_URL}/assets/zdsy.png`} alt=""/>
-            </div>
+            <div className='title-item'>近五年取水量</div>
+          </div>
+          <div className="tqyb-box1">
+            {/*<img src={`${process.env.PUBLIC_URL}/assets/jwnqsl.png`} alt=""/>*/}
           </div>
         </div>
         <div className='box'>
           <div className='box-title'>
-            <div className='title-item'>天气预报</div>
-            <div className="tqyb-box">
-              <img src={`${process.env.PUBLIC_URL}/assets/tqyb.png`} alt=""/>
-            </div>
+            <div className='title-item'>水源覆盖人口情况</div>
+          </div>
+          <div className="tqyb-box">
+            {/*<img src={`${process.env.PUBLIC_URL}/assets/syfgrkqk.png`} alt=""/>*/}
           </div>
         </div>
       </div>
@@ -292,47 +292,26 @@ const SyglPage: React.FC = () => {
       <div className='right-box'>
         <div className='box'>
           <div className='box-title'>
-            <div className='title-item'>近五年取水量</div>
-            <div className="tqyb-box1">
-              <img src={`${process.env.PUBLIC_URL}/assets/jwnqsl.png`} alt=""/>
-            </div>
+            <div className='title-item'>各乡镇供需能力</div>
           </div>
-        </div>
-        <div className='box'>
-          <div className='box-title'>
-            <div className='title-item'>供需能力</div>
-            <div className="img-box">
-              <div style={{marginTop:"30px"}}>
-                <div className="img-txt">
-                  <img src={`${process.env.PUBLIC_URL}/assets/gxnl1.png`} alt=""/>
-                  <span>
-                    <span className="color">500</span>万吨
-                    <span>水源总量</span>
-                  </span>
-                </div>
-                <div className="img-txt">
-                  <img src={`${process.env.PUBLIC_URL}/assets/gxnl2.png`} alt=""/>
-                  <span>
-                    <span className="color">500</span>万吨
-                    <span>需水总量</span>
-                  </span>
-                </div>
-              </div>
-              <div className="echarts-box">
-                <ReactEcharts
-                  option={echartsOptionGxnl}
-                  style={{ width:"100%", height: 'calc( 100% - 10px )' }}
-                />
-              </div>
-            </div>
+          <div className="tqyb-box2">
+            {/*<img src={`${process.env.PUBLIC_URL}/assets/gxzgxnl.png`} alt=""/>*/}
           </div>
         </div>
         <div className='box'>
           <div className='box-title'>
             <div className='title-item'>水质监测</div>
-            <div className="szjc-box">
-              <img src={`${process.env.PUBLIC_URL}/assets/szjc.png`} alt=""/>
-            </div>
+          </div>
+          <div className="tqyb-box3">
+            {/*<img src={`${process.env.PUBLIC_URL}/assets/szjc.png`} alt=""/>*/}
+          </div>
+        </div>
+        <div className='box'>
+          <div className='box-title'>
+            <div className='title-item'>安防监测</div>
+          </div>
+          <div className="szjc-box">
+            {/*<img src={`${process.env.PUBLIC_URL}/assets/afjc.png`} alt=""/>*/}
           </div>
         </div>
       </div>
diff --git a/src/views/Zhsy/index.less b/src/views/Zhsy/index.less
index 8d91aaa..7ff3e7a 100644
--- a/src/views/Zhsy/index.less
+++ b/src/views/Zhsy/index.less
@@ -18,9 +18,11 @@
 
 .box {
   width: 30vw;
-  height: 28vh;
+  height: 30vh;
   min-height: 200px;
   margin-bottom: 10px;
+
+  zoom: 0.9;
 }
 
 .box-title {