diff --git a/src/assets/images/zhhm/jb.png b/src/assets/images/zhhm/jb.png
new file mode 100644
index 0000000..27888bc
--- /dev/null
+++ b/src/assets/images/zhhm/jb.png
Binary files differ

diff --git a/src/assets/images/zhhm/jb.png b/src/assets/images/zhhm/jb.png
new file mode 100644
index 0000000..27888bc
--- /dev/null
+++ b/src/assets/images/zhhm/jb.png
Binary files differ
diff --git a/src/views/oneMap/ConstructionEvaluation/JSPGRightBox.vue b/src/views/oneMap/ConstructionEvaluation/JSPGRightBox.vue
index 3f696aa..f72791f 100644
--- a/src/views/oneMap/ConstructionEvaluation/JSPGRightBox.vue
+++ b/src/views/oneMap/ConstructionEvaluation/JSPGRightBox.vue
@@ -17,16 +17,53 @@
       </div>
     </div>
     <!-- 2023 -->
-    <div class="managementBox" v-if="activedname == '2023'"></div>
-    <div class="managementBoxA" v-if="activedname == '2024'"></div>
-    <div class="managementBoxB" v-if="activedname == '2025'"></div>
+    <div class="managementBox">
+      <!-- 循环 -->
+      <div class="listBox">
+        <div class="title">立法及长效机制</div>
+        <div class="progress">
+          <div class="ratio flex flex-align-center">
+            <div class="one">年度进度</div>
+            <div class="two"><div class="in"><div class="zb" :style="{width:`${30}%`}"></div></div></div>
+            <div class="three">70%</div>
+          </div>
+          <div class="ratio flex flex-align-center">
+            <div class="one">总体进度</div>
+            <div class="two"><div class="in"><div class="zb" :style="{width:`${60}%`}"></div></div></div>
+            <div class="three">70%</div>
+          </div>
+        </div>
+      </div>
+    </div>
   </div>
   <!-- 满意度 -->
   <div class="SatisfactionLevel">
     <div class="ListBoxHeader">
       <div class="ListBoxHeader_font">满意度</div>
     </div>
-    <div class="mydImg"></div>
+    <div class="mydContent">
+      <div class="list flex flex-justcontent-spacebetween">
+        <div class="mydBox flex flex-justcontent-spacebetween flex-align-center" style="width:49%">
+          <div class="left">目标</div>
+          <div class="right">96.17%</div>
+        </div>
+        <div class="mydBox flex flex-justcontent-spacebetween flex-align-center" style="width:49%">
+          <div class="left">结果</div>
+          <div class="right">96.17%</div>
+        </div>
+      </div>
+      <div class="list flex flex-justcontent-spacebetween">
+        <div class="listBox flex flex-justcontent-spacebetween">问卷数<span>324</span></div>
+        <div class="listBox flex flex-justcontent-spacebetween">反馈数<span>324</span></div>
+        <div class="listBox flex flex-justcontent-spacebetween">五星评分数<span>324</span></div>
+      </div>
+      <div class="list">
+        <div class="mydBox flex flex-justcontent-spacebetween flex-align-center">
+          <div class="left">满意率</div>
+          <div class="right">96.17%<span>明细</span></div>
+        </div>
+      </div>
+    </div>
   </div>
 </template>
 
@@ -51,8 +88,8 @@
 
   .subRightBox {
     width: 450px;
-    margin: 5px auto;
-    height: 35px;
+    margin:10px auto;
+    height:35px;
     display: flex;
     cursor: pointer;
     font-size: 14px;
@@ -74,37 +111,146 @@
     }
   }
   .managementBox {
-    margin: 5px auto;
-    width: 430px;
+    padding: 0 10px;
     height: calc(100% - 95px);
-    background: url('@/assets/images/Sponge_screen/jx2023.png') no-repeat;
-    background-size: 100% 100%;
-  }
-  .managementBoxA {
-    margin: 5px auto;
-    width: 430px;
-    height: calc(100% - 95px);
-    background: url('@/assets/images/Sponge_screen/js2024.png') no-repeat;
-    background-size: 100% 100%;
-  }
-  .managementBoxB {
-    margin: 5px auto;
-    width: 430px;
-    height: calc(100% - 95px);
-    background: url('@/assets/images/Sponge_screen/jx2025.png') no-repeat;
-    background-size: 100% 100%;
+    overflow: auto;
+    .listBox{
+      background:rgba(7, 86, 128, 0.6);
+      border: 1px solid #1CF5FC;
+      padding: 0 10px;
+      overflow: hidden;
+      margin-bottom:10px;
+      .title{
+        line-height: 34px;
+        font-weight: 500;
+        font-size: 14px;
+        color: #1CF5FC;
+      }
+      .progress{
+        overflow: hidden;
+        .ratio{
+          padding-bottom: 10px;
+          overflow: hidden;
+          font-weight: 400;
+          font-size: 14px;
+          color: #FFFFFF;
+          .one{
+            width: 64px;
+          }
+          .two{
+            flex:1;
+            height: 16px;
+            border-radius: 2px;
+            border: 1px solid rgba(223, 254, 255, 0.15);
+            padding: 5px 9px;
+            overflow: hidden;
+            .in{
+              height: 100%;
+              background: rgba(94, 167, 255, 0.3);
+              border-radius: 2px;
+            }
+            .zb{
+              background: linear-gradient(90deg, rgba(0, 246, 255, 0.3) 40%,rgba(0, 246, 255, 0.85) 80%, rgba(197, 253, 255, 1) 100%);
+              height: 100%;
+              border-radius: 2px;
+              position: relative;
+              &::after{
+                content: '';
+                width:7px;
+                height:7px;
+                background: rgba(197, 253, 255, 1);
+                position: absolute;
+                right:0;
+                top:50%;
+                transform: translateY(-50%);
+                border-radius: 50%;
+                box-shadow: 0 0 10px rgba(223, 254, 255, 1);
+              }
+            }
+          }
+          .three{
+            width: 46px;
+            text-align: right;
+          }
+        }
+      }
+    }
   }
 }
 .SatisfactionLevel {
   width: 450px;
   height: 180px;
   // background: red;
-  .mydImg {
+  .mydContent {
     margin: 5px auto;
     width: 430px;
     height: calc(100% - 60px);
-    background: url('@/assets/images/Sponge_screen/mydJS.png') no-repeat;
-    background-size: 100% 100%;
+    .list{
+      overflow: hidden;
+      margin-bottom: 10px;
+    }
+    .mydBox{
+      height: 32px;
+      background: rgba(7, 86, 128, 0.6);
+      border: 1px solid #02B9C3;
+      box-shadow: 0 0 10px #02B9C3 inset;
+      font-weight: 400;
+      font-size: 14px;
+      color: #FFFFFF;
+      border-left: 2px solid rgba(0, 242, 255, 1);
+      padding-left: 35px;
+      padding-right: 10px;
+      position: relative;
+      &::before{
+        content: '';
+        width: 12px;
+        height: 10px;
+        background: url('@/assets/images/zhhm/jb.png') no-repeat;
+        background-size: 100% 100%;
+        position: absolute;
+        left: 12px;
+        top: 50%;
+        transform: translateY(-50%);
+      }
+      &::after{
+        content: '';
+        width: 27px;
+        height: 1px;
+        background:rgba(0, 242, 255, 1);
+        position: absolute;
+        left: 50%;
+        top: 50%;
+        transform: translate(-50%,-50%);
+      }
+      .right{
+        font-weight: 500;
+        font-size: 16px;
+        color: #FFED98;
+        font-family: DINPro;
+        span{
+          font-weight: 400;
+          font-size: 14px;
+          color: #5FE889;
+          margin-left: 10px;
+        }
+      }
+    }
+    .listBox{
+      width: 32%;
+      line-height: 32px;
+      background: linear-gradient(0deg, #102755 0%, #009DAB 0%, #034D66 100%);
+      border-radius: 4px;
+      border: 1px solid #1CF5FC;
+      font-weight: 400;
+      font-size: 14px;
+      color: #FFFFFF;
+      padding: 0 10px;
+      span{
+        font-weight: 500;
+        font-size: 16px;
+        color: #12F9FF;
+      }
+    }
   }
 }
 .ListBoxHeader {