diff --git a/src/assets/images/jz/sjx.png b/src/assets/images/jz/sjx.png
new file mode 100644
index 0000000..db2fe14
Binary files /dev/null and b/src/assets/images/jz/sjx.png differ
diff --git a/src/assets/images/jz/wfjw1.png b/src/assets/images/jz/wfjw1.png
new file mode 100644
index 0000000..fb805da
Binary files /dev/null and b/src/assets/images/jz/wfjw1.png differ
diff --git a/src/assets/images/jz/wfjw2.png b/src/assets/images/jz/wfjw2.png
new file mode 100644
index 0000000..da5f591
Binary files /dev/null and b/src/assets/images/jz/wfjw2.png differ
diff --git a/src/view/echarts_jz/eP1.vue b/src/view/echarts_jz/eP1.vue
new file mode 100644
index 0000000..f092f5e
--- /dev/null
+++ b/src/view/echarts_jz/eP1.vue
@@ -0,0 +1,296 @@
+<template>
+    <div ref="chart" style="width: 100%; height: 180px"></div>
+  </template>
+    
+    <script setup>
+  import { onMounted, reactive, ref, onBeforeMount, onBeforeUnmount } from "vue";
+  // 局部引入echarts核心模块
+  import * as echarts from "echarts";
+  const props = defineProps({
+    list: {
+      type: Array,
+      default: () => {
+        return {};
+      },
+    },
+  });
+  const data = reactive({
+    option: {},
+  });
+  let angle = 0; // 角度
+  let dataValue = 86;
+  const chart = ref(); // 创建DOM引用
+  const getOption = () => {
+    data.option = {
+      title: {
+        text: `{v|${dataValue}}{unit|%}`,
+        x: "center",
+        y: "center",
+        textStyle: {
+          rich: {
+            v: {
+              fontSize: 25,
+              color: "#fff",
+            },
+            unit: {
+              fontSize: 25,
+              color: "#fff",
+            },
+          },
+        },
+      },
+      series: [
+        /** 绘制内部圆弧-1 <right-top> */
+        {
+          type: "custom",
+          coordinateSystem: "none",
+          renderItem: (params, api) => {
+            return {
+              type: "arc",
+              shape: {
+                cx: api.getWidth() / 2,
+                cy: api.getHeight() / 2,
+                r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.92,
+                startAngle: ((270 + angle) * Math.PI) / 180,
+                endAngle: ((360 + angle) * Math.PI) / 180,
+              },
+              style: {
+                fill: "transparent",
+                stroke: "#00E0DB",
+                lineWidth: 2,
+              },
+              silent: true,
+            };
+          },
+          data: [0],
+        },
+        /** 绘制内部圆弧-2 <left-bottom> */
+        {
+          type: "custom",
+          coordinateSystem: "none",
+          renderItem: (params, api) => {
+            return {
+              type: "arc",
+              shape: {
+                cx: api.getWidth() / 2,
+                cy: api.getHeight() / 2,
+                r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.92,
+                startAngle: ((90 + angle) * Math.PI) / 180,
+                endAngle: ((180 + angle) * Math.PI) / 180,
+              },
+              style: {
+                fill: "transparent",
+                stroke: "#00E0DB",
+                lineWidth: 2,
+              },
+              silent: true,
+            };
+          },
+          data: [0],
+        },
+        /** 绘制外部圆弧-1 <right-bottom> */
+        {
+          type: "custom",
+          coordinateSystem: "none",
+          renderItem: (params, api) => {
+            return {
+              type: "arc",
+              shape: {
+                cx: api.getWidth() / 2,
+                cy: api.getHeight() / 2,
+                r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.98,
+                startAngle: ((355 + -angle) * Math.PI) / 180,
+                endAngle: ((120 + -angle) * Math.PI) / 180,
+              },
+              style: {
+                fill: "transparent",
+                stroke: "#00E0DB",
+                lineWidth: 2.6,
+              },
+              silent: true,
+            };
+          },
+          data: [0],
+        },
+        /** 绘制外部圆弧-2 <left-top> */
+        {
+          type: "custom",
+          coordinateSystem: "none",
+          renderItem: (params, api) => {
+            return {
+              type: "arc",
+              shape: {
+                cx: api.getWidth() / 2,
+                cy: api.getHeight() / 2,
+                r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.98,
+                startAngle: ((175 + -angle) * Math.PI) / 180,
+                endAngle: ((300 + -angle) * Math.PI) / 180,
+              },
+              style: {
+                fill: "transparent",
+                stroke: "#00E0DB",
+                lineWidth: 2.6,
+              },
+              silent: true,
+            };
+          },
+          data: [0],
+        },
+        /** 绘制外部圆弧-1-开始圆点 <right-bottom> */
+        {
+          type: "custom",
+          coordinateSystem: "none",
+          renderItem: (params, api) => {
+            let x0 = api.getWidth() / 2;
+            let y0 = api.getHeight() / 2;
+            let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.98;
+            return {
+              type: "circle",
+              shape: {
+                /** 角度355° 外弧1开始角度 */
+                cx: x0 + r * Math.cos(((355 + -angle) * Math.PI) / 180),
+                cy: y0 + r * Math.sin(((355 + -angle) * Math.PI) / 180),
+                r: 4,
+              },
+              style: {
+                fill: "#00E0DB",
+                stroke: "#00E0DB",
+              },
+              silent: true,
+            };
+          },
+          data: [0],
+        },
+        /** 绘制外部圆弧-2-开始圆点 <left-top> */
+        {
+          type: "custom",
+          coordinateSystem: "none",
+          renderItem: (params, api) => {
+            let x0 = api.getWidth() / 2;
+            let y0 = api.getHeight() / 2;
+            let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.98;
+            return {
+              type: "circle",
+              shape: {
+                /** 角度175° 外弧2开始角度 */
+                cx: x0 + r * Math.cos(((175 + -angle) * Math.PI) / 180),
+                cy: y0 + r * Math.sin(((175 + -angle) * Math.PI) / 180),
+                r: 4,
+              },
+              style: {
+                fill: "#00E0DB",
+                stroke: "#00E0DB",
+              },
+              silent: true,
+            };
+          },
+          data: [0],
+        },
+        /** 内心圆 */
+        {
+          type: "custom",
+          coordinateSystem: "none",
+          renderItem: (params, api) => {
+            return {
+              type: "circle",
+              shape: {
+                cx: api.getWidth() / 2,
+                cy: api.getHeight() / 2,
+                r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.38,
+                startAngle: ((175 + angle) * Math.PI) / 180,
+                endAngle: ((300 + angle) * Math.PI) / 180,
+              },
+              style: {
+                fill: "transparent",
+                stroke: "#00374C80",
+                lineWidth: 2.6,
+              },
+              silent: true,
+            };
+          },
+          data: [0],
+        },
+        /** 饼图 */
+        {
+          name: "已完成",
+          type: "pie",
+          startAngle: 90,
+          z: 0,
+          label: {
+            position: "center",
+          },
+          radius: ["86%", "64%"],
+          silent: true,
+          animation: false, // 关闭饼图动画
+          data: [
+            {
+              value: dataValue,
+              itemStyle: {
+                color: "RGBA(0, 225, 248, 1)",
+              },
+            },
+            {
+              name: "未完成",
+              value: 100 - dataValue,
+              label: {
+                show: false,
+              },
+              itemStyle: {
+                color: "#003E7A",
+              },
+            },
+          ],
+        },
+        /** 饼图上刻度 */
+        {
+          type: "gauge",
+          center: ["50%", "50%"],
+          radius: "110%", // 错位调整此处
+          startAngle: 0,
+          endAngle: 360,
+          splitNumber: 8,
+          axisLine: {
+            show: false,
+          },
+          splitLine: {
+            // length: 39,
+            length: "25%",
+            lineStyle: {
+              width: 5,
+              color: "#002837", // 不动
+            },
+          },
+          axisTick: {
+            show: false,
+          },
+          axisLabel: {
+            show: false,
+          },
+        },
+      ],
+    };
+  };
+  var time;
+  const setChart = () => {
+    var myChart = echarts.init(chart.value);
+    myChart.setOption(data.option);
+    time = setInterval(() => {
+      angle = angle + 2;
+      myChart.setOption(data.option, true);
+    }, 100);
+  };
+  onBeforeUnmount(() => {
+    if (time) {
+      clearInterval(time);
+    }
+  });
+  // 使用生命钩子
+  onBeforeMount(() => {
+    setTimeout(() => {
+      getOption();
+      setChart();
+    }, 600);
+  });
+  </script>
+    
+    <style scoped></style>
\ No newline at end of file
diff --git a/src/view/echarts_jz/eP3.vue b/src/view/echarts_jz/eP3.vue
index 3ebb754..3187942 100644
--- a/src/view/echarts_jz/eP3.vue
+++ b/src/view/echarts_jz/eP3.vue
@@ -33,6 +33,13 @@ const colors = [
     bottom: "rgba(14, 252, 255,  .46)",
     front: "rgba(14, 252, 255, .66)",
   },
+  {
+    left: "rgba(60, 143, 255, .16)",
+    right: "rgba(60, 143, 255, .6)",
+    top: "rgba(60, 143, 255, 1)",
+    bottom: "rgba(60, 143, 255,  .46)",
+    front: "rgba(60, 143, 255, .66)",
+  },
 ];
 // const valueList = [20, 53, 47, 65, 29, 11, 10];
 const data = reactive({
@@ -41,7 +48,8 @@ const data = reactive({
   Max: 20000,
   valueList: [4504, 16086, 6130, 2844, 4967, 179, 1685, 5010],
   valueList2: [1181, 2177, 3720, 3711, 4642, 1654, 3395, 5552],
-  xxname: ["2020", "2021", "2022", "2023"],
+  valueList3: [1181, 2177, 3720, 3711, 4642, 1654, 3395, 5552],
+  xxname: ["1月", "2月", "3月", "4月","5月"],
 });
 // 注册5个面图形:左侧、前面、右面、上面、下面
 //c0:左下角，c1：右下角,c2:右上角，c3：左上角
@@ -55,8 +63,8 @@ const CubeLeft_1 = echarts.graphic.extendShape({
     // 会canvas的应该都能看得懂，shape是从custom传入的
     const xAxisPoint = shape.xAxisPoint;
     const c0 = [shape.x - 40, shape.y];
-    const c1 = [shape.x - 27, shape.y - 14];
-    const c2 = [xAxisPoint[0] - 27, xAxisPoint[1] - 14];
+    const c1 = [shape.x - 30, shape.y - 10];
+    const c2 = [xAxisPoint[0] - 30, xAxisPoint[1] - 10];
     const c3 = [xAxisPoint[0] - 40, xAxisPoint[1]];
     ctx
       .moveTo(c0[0], c0[1])
@@ -75,8 +83,8 @@ const CubeFront_1 = echarts.graphic.extendShape({
     // 会canvas的应该都能看得懂，shape是从custom传入的
     const xAxisPoint = shape.xAxisPoint;
     const c0 = [shape.x - 40, shape.y];
-    const c1 = [shape.x - 18, shape.y];
-    const c2 = [xAxisPoint[0] - 18, xAxisPoint[1]];
+    const c1 = [shape.x - 28, shape.y];
+    const c2 = [xAxisPoint[0] - 28, xAxisPoint[1]];
     const c3 = [xAxisPoint[0] - 40, xAxisPoint[1]];
     ctx
       .moveTo(c0[0], c0[1])
@@ -93,10 +101,10 @@ const CubeRight_1 = echarts.graphic.extendShape({
   },
   buildPath: function (ctx, shape) {
     const xAxisPoint = shape.xAxisPoint;
-    const c0 = [shape.x - 18, shape.y];
-    const c1 = [shape.x - 5, shape.y - 14];
-    const c2 = [xAxisPoint[0] - 5, xAxisPoint[1] - 14];
-    const c3 = [xAxisPoint[0] - 18, xAxisPoint[1]];
+    const c0 = [shape.x - 28, shape.y];
+    const c1 = [shape.x - 17, shape.y - 10];
+    const c2 = [xAxisPoint[0] - 18, xAxisPoint[1] - 10];
+    const c3 = [xAxisPoint[0] - 28, xAxisPoint[1]];
     ctx
       .moveTo(c0[0], c0[1])
       .lineTo(c1[0], c1[1])
@@ -112,9 +120,9 @@ const CubeTop_1 = echarts.graphic.extendShape({
   },
   buildPath: function (ctx, shape) {
     const c0 = [shape.x - 40, shape.y];
-    const c1 = [shape.x - 18, shape.y];
-    const c2 = [shape.x - 5, shape.y - 14];
-    const c3 = [shape.x - 27, shape.y - 14];
+    const c1 = [shape.x - 28, shape.y];
+    const c2 = [shape.x - 18, shape.y - 10];
+    const c3 = [shape.x - 30, shape.y - 10];
     ctx
       .moveTo(c0[0], c0[1])
       .lineTo(c1[0], c1[1])
@@ -133,9 +141,9 @@ const CubeBottom_1 = echarts.graphic.extendShape({
     const xAxisPoint = shape.xAxisPoint;
 
     const c0 = [xAxisPoint[0] - 40, xAxisPoint[1]];
-    const c1 = [xAxisPoint[0] - 18, xAxisPoint[1]];
-    const c2 = [xAxisPoint[0] - 5, xAxisPoint[1] - 14];
-    const c3 = [xAxisPoint[0] - 27, xAxisPoint[1] - 14];
+    const c1 = [xAxisPoint[0] - 28, xAxisPoint[1]];
+    const c2 = [xAxisPoint[0] - 18, xAxisPoint[1] - 10];
+    const c3 = [xAxisPoint[0] - 30, xAxisPoint[1] - 10];
 
     ctx
       .moveTo(c0[0], c0[1])
@@ -160,10 +168,10 @@ const CubeLeft_2 = echarts.graphic.extendShape({
   buildPath: function (ctx, shape) {
     // 会canvas的应该都能看得懂，shape是从custom传入的
     const xAxisPoint = shape.xAxisPoint;
-    const c0 = [shape.x - 0, shape.y];
-    const c1 = [shape.x + 13, shape.y - 14];
-    const c2 = [xAxisPoint[0] + 13, xAxisPoint[1] - 14];
-    const c3 = [xAxisPoint[0] - 0, xAxisPoint[1]];
+    const c0 = [shape.x - 15, shape.y];
+    const c1 = [shape.x - 2, shape.y - 10];
+    const c2 = [xAxisPoint[0] - 2, xAxisPoint[1] - 10];
+    const c3 = [xAxisPoint[0] - 15, xAxisPoint[1]];
     ctx
       .moveTo(c0[0], c0[1])
       .lineTo(c1[0], c1[1])
@@ -180,10 +188,10 @@ const CubeFront_2 = echarts.graphic.extendShape({
   buildPath: function (ctx, shape) {
     // 会canvas的应该都能看得懂，shape是从custom传入的
     const xAxisPoint = shape.xAxisPoint;
-    const c0 = [shape.x - 0, shape.y];
-    const c1 = [shape.x + 22, shape.y];
-    const c2 = [xAxisPoint[0] + 22, xAxisPoint[1]];
-    const c3 = [xAxisPoint[0] - 0, xAxisPoint[1]];
+    const c0 = [shape.x - 15, shape.y];
+    const c1 = [shape.x -3, shape.y];
+    const c2 = [xAxisPoint[0] -3, xAxisPoint[1]];
+    const c3 = [xAxisPoint[0] - 15, xAxisPoint[1]];
     ctx
       .moveTo(c0[0], c0[1])
       .lineTo(c1[0], c1[1])
@@ -199,10 +207,10 @@ const CubeRight_2 = echarts.graphic.extendShape({
   },
   buildPath: function (ctx, shape) {
     const xAxisPoint = shape.xAxisPoint;
-    const c0 = [shape.x + 22, shape.y];
-    const c1 = [shape.x + 35, shape.y - 14];
-    const c2 = [xAxisPoint[0] + 35, xAxisPoint[1] - 14];
-    const c3 = [xAxisPoint[0] + 22, xAxisPoint[1]];
+    const c0 = [shape.x -3, shape.y];
+    const c1 = [shape.x + 10, shape.y - 10];
+    const c2 = [xAxisPoint[0] + 10, xAxisPoint[1] - 10];
+    const c3 = [xAxisPoint[0] - 3, xAxisPoint[1]];
     ctx
       .moveTo(c0[0], c0[1])
       .lineTo(c1[0], c1[1])
@@ -217,10 +225,10 @@ const CubeTop_2 = echarts.graphic.extendShape({
     y: 0,
   },
   buildPath: function (ctx, shape) {
-    const c0 = [shape.x - 0, shape.y];
-    const c1 = [shape.x + 22, shape.y];
-    const c2 = [shape.x + 35, shape.y - 14];
-    const c3 = [shape.x + 13, shape.y - 14];
+    const c0 = [shape.x - 15, shape.y];
+    const c1 = [shape.x - 3, shape.y];
+    const c2 = [shape.x + 10, shape.y - 10];
+    const c3 = [shape.x - 2, shape.y - 10];
     ctx
       .moveTo(c0[0], c0[1])
       .lineTo(c1[0], c1[1])
@@ -238,10 +246,10 @@ const CubeBottom_2 = echarts.graphic.extendShape({
     // 会canvas的应该都能看得懂，shape是从custom传入的
     const xAxisPoint = shape.xAxisPoint;
 
-    const c0 = [xAxisPoint[0] - 0, xAxisPoint[1]];
-    const c1 = [xAxisPoint[0] + 22, xAxisPoint[1]];
-    const c2 = [xAxisPoint[0] + 35, xAxisPoint[1] - 14];
-    const c3 = [xAxisPoint[0] + 13, xAxisPoint[1] - 14];
+    const c0 = [xAxisPoint[0] - 15, xAxisPoint[1]];
+    const c1 = [xAxisPoint[0] -3, xAxisPoint[1]];
+    const c2 = [xAxisPoint[0] + 10, xAxisPoint[1] - 10];
+    const c3 = [xAxisPoint[0] -2, xAxisPoint[1] - 10];
 
     ctx
       .moveTo(c0[0], c0[1])
@@ -259,15 +267,123 @@ echarts.graphic.registerShape("CubeTop_2", CubeTop_2);
 echarts.graphic.registerShape("CubeBottom_2", CubeBottom_2);
 
 // ------------------------------
+const CubeLeft_3 = echarts.graphic.extendShape({
+  shape: {
+    x: 0,
+    y: 0,
+  },
+  buildPath: function (ctx, shape) {
+    // 会canvas的应该都能看得懂，shape是从custom传入的
+    const xAxisPoint = shape.xAxisPoint;
+    const c0 = [shape.x + 15, shape.y];
+    const c1 = [shape.x + 28, shape.y - 10];
+    const c2 = [xAxisPoint[0] + 28, xAxisPoint[1] - 10];
+    const c3 = [xAxisPoint[0] + 15, xAxisPoint[1]];
+    ctx
+      .moveTo(c0[0], c0[1])
+      .lineTo(c1[0], c1[1])
+      .lineTo(c2[0], c2[1])
+      .lineTo(c3[0], c3[1])
+      .closePath();
+  },
+});
+const CubeFront_3 = echarts.graphic.extendShape({
+  shape: {
+    x: 0,
+    y: 0,
+  },
+  buildPath: function (ctx, shape) {
+    // 会canvas的应该都能看得懂，shape是从custom传入的
+    const xAxisPoint = shape.xAxisPoint;
+    const c0 = [shape.x + 15, shape.y];
+    const c1 = [shape.x + 27, shape.y];
+    const c2 = [xAxisPoint[0] + 27, xAxisPoint[1]];
+    const c3 = [xAxisPoint[0] + 15, xAxisPoint[1]];
+    ctx
+      .moveTo(c0[0], c0[1])
+      .lineTo(c1[0], c1[1])
+      .lineTo(c2[0], c2[1])
+      .lineTo(c3[0], c3[1])
+      .closePath();
+  },
+});
+const CubeRight_3 = echarts.graphic.extendShape({
+  shape: {
+    x: 0,
+    y: 0,
+  },
+  buildPath: function (ctx, shape) {
+    const xAxisPoint = shape.xAxisPoint;
+    const c0 = [shape.x + 27, shape.y];
+    const c1 = [shape.x + 40, shape.y - 10];
+    const c2 = [xAxisPoint[0] + 40, xAxisPoint[1] - 10];
+    const c3 = [xAxisPoint[0] + 27, xAxisPoint[1]];
+    ctx
+      .moveTo(c0[0], c0[1])
+      .lineTo(c1[0], c1[1])
+      .lineTo(c2[0], c2[1])
+      .lineTo(c3[0], c3[1])
+      .closePath();
+  },
+});
+const CubeTop_3 = echarts.graphic.extendShape({
+  shape: {
+    x: 0,
+    y: 0,
+  },
+  buildPath: function (ctx, shape) {
+    const c0 = [shape.x + 15, shape.y];
+    const c1 = [shape.x + 27, shape.y];
+    const c2 = [shape.x + 40, shape.y - 10];
+    const c3 = [shape.x + 28, shape.y - 10];
+    ctx
+      .moveTo(c0[0], c0[1])
+      .lineTo(c1[0], c1[1])
+      .lineTo(c2[0], c2[1])
+      .lineTo(c3[0], c3[1])
+      .closePath();
+  },
+});
+const CubeBottom_3 = echarts.graphic.extendShape({
+  shape: {
+    x: 0,
+    y: 0,
+  },
+  buildPath: function (ctx, shape) {
+    // 会canvas的应该都能看得懂，shape是从custom传入的
+    const xAxisPoint = shape.xAxisPoint;
+
+    const c0 = [xAxisPoint[0] + 15, xAxisPoint[1]];
+    const c1 = [xAxisPoint[0] + 27, xAxisPoint[1]];
+    const c2 = [xAxisPoint[0] + 40, xAxisPoint[1] - 10];
+    const c3 = [xAxisPoint[0] + 28, xAxisPoint[1] - 10];
+
+    ctx
+      .moveTo(c0[0], c0[1])
+      .lineTo(c1[0], c1[1])
+      .lineTo(c2[0], c2[1])
+      .lineTo(c3[0], c3[1])
+      .closePath();
+  },
+});
+
+echarts.graphic.registerShape("CubeLeft_3", CubeLeft_3);
+echarts.graphic.registerShape("CubeFront_3", CubeFront_3);
+echarts.graphic.registerShape("CubeRight_3", CubeRight_3);
+echarts.graphic.registerShape("CubeTop_3", CubeTop_3);
+echarts.graphic.registerShape("CubeBottom_3", CubeBottom_3);
+
+//--------------------------------
 const getOption = () => {
   data.option = {
     legend: {
       data: [
-        "适龄生育妇女",
-        "育龄妇女",
+        "房屋数量",
+        "入住数量",
+        "保障性租赁住房"
       ],
       top: "0%",
-      right: "30%",
+      right: "10%",
       textStyle: {
         fontSize: 16,
         color: "#ffffff",
@@ -275,7 +391,7 @@ const getOption = () => {
     },
     tooltip: {
       trigger: "axis",
-      formatter: "{b0}:</br>{a0}:{c0}</br>{a1}:{c1}",
+      formatter: "{b0}:</br>{a0}:{c0}</br>{a1}:{c1}</br>{a2}:{c2}",
     },
     grid: {
       left: 0,
@@ -353,7 +469,7 @@ const getOption = () => {
     series: [
       {
         xAxisIndex: 0,
-        name: "适龄生育妇女",
+        name: "房屋数量",
         type: "custom",
         renderItem: (params, api) => {
           const location = api.coord([api.value(0), api.value(1)]);
@@ -446,7 +562,7 @@ const getOption = () => {
       },
       {
         xAxisIndex: 0,
-        name: "育龄妇女",
+        name: "入住数量",
         type: "custom",
         renderItem: (params, api) => {
           const location = api.coord([api.value(0), api.value(1)]);
@@ -537,44 +653,98 @@ const getOption = () => {
         },
         data: data.valueList2,
       },
-      //顶部字体
       {
-        type: "bar",
-        xAxisIndex: 1,
-        label: {
+        xAxisIndex: 0,
+        name: "保障性租赁住房",
+        type: "custom",
+        renderItem: (params, api) => {
+          const location = api.coord([api.value(0), api.value(1)]);
+
+          return {
+            type: "group",
+            children: [
+              {
+                type: "CubeBottom_3",
+                shape: {
+                  api,
+                  xValue: api.value(0),
+                  yValue: api.value(1),
+                  x: location[0],
+                  y: location[1],
+                  xAxisPoint: api.coord([api.value(0), 0]),
+                },
+                style: {
+                  fill: colors[2]["bottom"],
+                },
+              },
+              {
+                type: "CubeLeft_3",
+                shape: {
+                  api,
+                  xValue: api.value(0),
+                  yValue: api.value(1),
+                  x: location[0],
+                  y: location[1],
+                  xAxisPoint: api.coord([api.value(0), 0]),
+                },
+                style: {
+                  fill: colors[2]["left"],
+                },
+              },
+              {
+                type: "CubeFront_3",
+                shape: {
+                  api,
+                  xValue: api.value(0),
+                  yValue: api.value(1),
+                  x: location[0],
+                  y: location[1],
+                  xAxisPoint: api.coord([api.value(0), 0]),
+                },
+                style: {
+                  fill: colors[2]["front"],
+                },
+              },
+              {
+                type: "CubeRight_3",
+                shape: {
+                  api,
+                  xValue: api.value(0),
+                  yValue: api.value(1),
+                  x: location[0],
+                  y: location[1],
+                  xAxisPoint: api.coord([api.value(0), 0]),
+                },
+                style: {
+                  fill: colors[2]["right"],
+                },
+              },
+              {
+                type: "CubeTop_3",
+                shape: {
+                  api,
+                  xValue: api.value(0),
+                  yValue: api.value(1),
+                  x: location[0],
+                  y: location[1],
+                  xAxisPoint: api.coord([api.value(0), 0]),
+                },
+                style: {
+                  fill: colors[2]["top"],
+                },
+              },
+            ],
+          };
+        },
+        //设置图例颜色
+        itemStyle: {
           show: true,
-          fontSize: 18,
-          position: "top",
-          color: "#ffffff",
-          formatter: function (data) {
-            return data.value - 5;
+          color: {
+            type: "linear",
+            colorStops: [{ offset: 1, color: "rgba(60, 143, 255, 1)" }],
           },
         },
-        itemStyle: {
-          color: "rgba(221, 242, 255, 0)",
-        },
-
-        data: data.valueList.map((item) => parseInt(item) + 5),
-        barWidth: 30,
-      },
-      {
-        type: "bar",
-        xAxisIndex: 1,
-        label: {
-          show: true,
-          fontSize: 18,
-          position: "top",
-          color: "#ffffff",
-          formatter: function (data) {
-            return data.value - 5;
-          },
-        },
-        itemStyle: {
-          color: "rgba(221, 242, 255, 0)",
-        },
-
-        data: data.valueList2.map((item) => parseInt(item) + 5),
-        barWidth: 20,
+        data: data.valueList3,
       },
     ],
   };
diff --git a/src/view/echarts_jz/eP4.vue b/src/view/echarts_jz/eP4.vue
new file mode 100644
index 0000000..ae5de51
--- /dev/null
+++ b/src/view/echarts_jz/eP4.vue
@@ -0,0 +1,296 @@
+<template>
+    <div ref="chart" style="width: 100%; height: 180px"></div>
+  </template>
+    
+    <script setup>
+  import { onMounted, reactive, ref, onBeforeMount, onBeforeUnmount } from "vue";
+  // 局部引入echarts核心模块
+  import * as echarts from "echarts";
+  const props = defineProps({
+    list: {
+      type: Array,
+      default: () => {
+        return {};
+      },
+    },
+  });
+  const data = reactive({
+    option: {},
+  });
+  let angle = 0; // 角度
+  let dataValue = 86;
+  const chart = ref(); // 创建DOM引用
+  const getOption = () => {
+    data.option = {
+      title: {
+        text: `{v|${dataValue}}{unit|%}`,
+        x: "center",
+        y: "center",
+        textStyle: {
+          rich: {
+            v: {
+              fontSize: 25,
+              color: "#fff",
+            },
+            unit: {
+              fontSize: 25,
+              color: "#fff",
+            },
+          },
+        },
+      },
+      series: [
+        /** 绘制内部圆弧-1 <right-top> */
+        {
+          type: "custom",
+          coordinateSystem: "none",
+          renderItem: (params, api) => {
+            return {
+              type: "arc",
+              shape: {
+                cx: api.getWidth() / 2,
+                cy: api.getHeight() / 2,
+                r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.92,
+                startAngle: ((270 + angle) * Math.PI) / 180,
+                endAngle: ((360 + angle) * Math.PI) / 180,
+              },
+              style: {
+                fill: "transparent",
+                stroke: "#008BFF",
+                lineWidth: 2,
+              },
+              silent: true,
+            };
+          },
+          data: [0],
+        },
+        /** 绘制内部圆弧-2 <left-bottom> */
+        {
+          type: "custom",
+          coordinateSystem: "none",
+          renderItem: (params, api) => {
+            return {
+              type: "arc",
+              shape: {
+                cx: api.getWidth() / 2,
+                cy: api.getHeight() / 2,
+                r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.92,
+                startAngle: ((90 + angle) * Math.PI) / 180,
+                endAngle: ((180 + angle) * Math.PI) / 180,
+              },
+              style: {
+                fill: "transparent",
+                stroke: "#008BFF",
+                lineWidth: 2,
+              },
+              silent: true,
+            };
+          },
+          data: [0],
+        },
+        /** 绘制外部圆弧-1 <right-bottom> */
+        {
+          type: "custom",
+          coordinateSystem: "none",
+          renderItem: (params, api) => {
+            return {
+              type: "arc",
+              shape: {
+                cx: api.getWidth() / 2,
+                cy: api.getHeight() / 2,
+                r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.98,
+                startAngle: ((355 + -angle) * Math.PI) / 180,
+                endAngle: ((120 + -angle) * Math.PI) / 180,
+              },
+              style: {
+                fill: "transparent",
+                stroke: "#008BFF",
+                lineWidth: 2.6,
+              },
+              silent: true,
+            };
+          },
+          data: [0],
+        },
+        /** 绘制外部圆弧-2 <left-top> */
+        {
+          type: "custom",
+          coordinateSystem: "none",
+          renderItem: (params, api) => {
+            return {
+              type: "arc",
+              shape: {
+                cx: api.getWidth() / 2,
+                cy: api.getHeight() / 2,
+                r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.98,
+                startAngle: ((175 + -angle) * Math.PI) / 180,
+                endAngle: ((300 + -angle) * Math.PI) / 180,
+              },
+              style: {
+                fill: "transparent",
+                stroke: "#008BFF",
+                lineWidth: 2.6,
+              },
+              silent: true,
+            };
+          },
+          data: [0],
+        },
+        /** 绘制外部圆弧-1-开始圆点 <right-bottom> */
+        {
+          type: "custom",
+          coordinateSystem: "none",
+          renderItem: (params, api) => {
+            let x0 = api.getWidth() / 2;
+            let y0 = api.getHeight() / 2;
+            let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.98;
+            return {
+              type: "circle",
+              shape: {
+                /** 角度355° 外弧1开始角度 */
+                cx: x0 + r * Math.cos(((355 + -angle) * Math.PI) / 180),
+                cy: y0 + r * Math.sin(((355 + -angle) * Math.PI) / 180),
+                r: 4,
+              },
+              style: {
+                fill: "#008BFF",
+                stroke: "#008BFF",
+              },
+              silent: true,
+            };
+          },
+          data: [0],
+        },
+        /** 绘制外部圆弧-2-开始圆点 <left-top> */
+        {
+          type: "custom",
+          coordinateSystem: "none",
+          renderItem: (params, api) => {
+            let x0 = api.getWidth() / 2;
+            let y0 = api.getHeight() / 2;
+            let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.98;
+            return {
+              type: "circle",
+              shape: {
+                /** 角度175° 外弧2开始角度 */
+                cx: x0 + r * Math.cos(((175 + -angle) * Math.PI) / 180),
+                cy: y0 + r * Math.sin(((175 + -angle) * Math.PI) / 180),
+                r: 4,
+              },
+              style: {
+                fill: "#008BFF",
+                stroke: "#008BFF",
+              },
+              silent: true,
+            };
+          },
+          data: [0],
+        },
+        /** 内心圆 */
+        {
+          type: "custom",
+          coordinateSystem: "none",
+          renderItem: (params, api) => {
+            return {
+              type: "circle",
+              shape: {
+                cx: api.getWidth() / 2,
+                cy: api.getHeight() / 2,
+                r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.38,
+                startAngle: ((175 + angle) * Math.PI) / 180,
+                endAngle: ((300 + angle) * Math.PI) / 180,
+              },
+              style: {
+                fill: "transparent",
+                stroke: "#00374C80",
+                lineWidth: 2.6,
+              },
+              silent: true,
+            };
+          },
+          data: [0],
+        },
+        /** 饼图 */
+        {
+          name: "已完成",
+          type: "pie",
+          startAngle: 90,
+          z: 0,
+          label: {
+            position: "center",
+          },
+          radius: ["86%", "64%"],
+          silent: true,
+          animation: false, // 关闭饼图动画
+          data: [
+            {
+              value: dataValue,
+              itemStyle: {
+                color: "RGBA(0, 139, 255, 1)",
+              },
+            },
+            {
+              name: "未完成",
+              value: 100 - dataValue,
+              label: {
+                show: false,
+              },
+              itemStyle: {
+                color: "#003E7A",
+              },
+            },
+          ],
+        },
+        /** 饼图上刻度 */
+        {
+          type: "gauge",
+          center: ["50%", "50%"],
+          radius: "110%", // 错位调整此处
+          startAngle: 0,
+          endAngle: 360,
+          splitNumber: 8,
+          axisLine: {
+            show: false,
+          },
+          splitLine: {
+            // length: 39,
+            length: "25%",
+            lineStyle: {
+              width: 5,
+              color: "#002837", // 不动
+            },
+          },
+          axisTick: {
+            show: false,
+          },
+          axisLabel: {
+            show: false,
+          },
+        },
+      ],
+    };
+  };
+  var time;
+  const setChart = () => {
+    var myChart = echarts.init(chart.value);
+    myChart.setOption(data.option);
+    time = setInterval(() => {
+      angle = angle + 2;
+      myChart.setOption(data.option, true);
+    }, 100);
+  };
+  onBeforeUnmount(() => {
+    if (time) {
+      clearInterval(time);
+    }
+  });
+  // 使用生命钩子
+  onBeforeMount(() => {
+    setTimeout(() => {
+      getOption();
+      setChart();
+    }, 600);
+  });
+  </script>
+    
+    <style scoped></style>
\ No newline at end of file
diff --git a/src/view/echarts_jz/zwfw1.vue b/src/view/echarts_jz/zwfw1.vue
index 86908d1..cbe1845 100644
--- a/src/view/echarts_jz/zwfw1.vue
+++ b/src/view/echarts_jz/zwfw1.vue
@@ -3,7 +3,7 @@
 </template>
 
 <script setup>
-import { onMounted, reactive, ref ,onBeforeMount } from "vue";
+import { onMounted, reactive, ref, onBeforeMount } from "vue";
 // 局部引入echarts核心模块
 import * as echarts from "echarts";
 const props = defineProps({
@@ -31,87 +31,12 @@ const data = reactive({
 const chart = ref(); // 创建DOM引用
 
 //内圈数据
-var data2 = [
-  {
-    value: data.dataList[0].value,
-    name: "2.0收件数",
-    itemStyle: {
-      normal: {
-        color: new echarts.graphic.LinearGradient(0, 1, 1, 0, [
-          {
-            offset: 0,
-            color: "rgba(255, 224, 0, 0.29)",
-          },
-          {
-            offset: 1,
-            color: "rgba(255, 224, 0, 1)",
-          },
-        ]),
-        shadowColor: "rgba(1,1,1,0.5)",
-        shadowBlur: 1,
-      },
-    },
-  },
-  {
-    value: data.dataList[1].value - data.dataList[0].value,
-    name: "",
-    itemStyle: {
-      normal: {
-        color: "rgba(255, 224, 0, 0.1)", // 未完成的圆环的颜色
-        label: {
-          show: false,
-        },
-        labelLine: {
-          show: false,
-        },
-      },
-      emphasis: {
-        color: "rgba(255, 224, 0, 0.1)", // 未完成的圆环的颜色
-      },
-    },
-  },
-  {
-    value: data.dataList[1].value,
-    name: "总收件数",
-    itemStyle: {
-      normal: {
-        color: "rgba(0,0,0,0)",
-      },
-    },
-  },
-];
+const  data2 = ref([
+
+]);
 //外圈数据
-const data1 = [
-  {
-    value: data.dataList[1].value,
-    name: "",
-    itemStyle: {
-      normal: {
-        borderWidth: 1,
-        borderColor: "rgba(193, 229, 255, .1)",
-        color: new echarts.graphic.LinearGradient(1, 1, 1, 0, [
-          {
-            offset: 1,
-            color: "rgba(127, 242, 255, .2)",
-          },
-          {
-            offset: 0,
-            color: "rgba(109, 195, 255, 0)",
-          },
-        ]),
-      },
-    },
-  },
-  {
-    value: data.dataList[1].value,
-    name: "",
-    itemStyle: {
-      normal: {
-        color: "rgba(0,0,0,0)",
-      },
-    },
-  },
-];
+const data1 = ref([
+]);
 
 const getOption = () => {
   data.option = {
@@ -139,14 +64,14 @@ const getOption = () => {
     //     }else{
     //       return params + "  " +num;
     //     }
-        
+
     //   },
     // },
 
     title: [
       {
         text: `${data.percent}%`,
-        right: "18%",
+        right: "38%",
         bottom: "40%",
         textStyle: {
           color: "#ffffff",
@@ -160,7 +85,7 @@ const getOption = () => {
         type: "pie",
         hoverAnimation: false,
         radius: ["60%", "80%"],
-        center: ["53%", "54%"],
+        center: ["50%", "54%"],
         startAngle: 180,
         label: {
           normal: {
@@ -168,11 +93,11 @@ const getOption = () => {
             position: "center",
           },
         },
-        data: data2,
+        data: data2.value,
       },
       {
         type: "pie",
-        center: ["53%", "54%"],
+        center: ["50%", "54%"],
         radius: ["80%", "95%"],
         hoverAnimation: false,
         startAngle: 180,
@@ -182,12 +107,93 @@ const getOption = () => {
             position: "center",
           },
         },
-        data: data1,
+        data: data1.value,
       },
     ],
   };
 };
-
+const change = () => {
+  data2.value = [
+    {
+      value: data.dataList[0].value,
+      name: "2.0收件数",
+      itemStyle: {
+        normal: {
+          color: new echarts.graphic.LinearGradient(0, 1, 1, 0, [
+            {
+              offset: 0,
+              color: "rgba(255, 224, 0, 0.29)",
+            },
+            {
+              offset: 1,
+              color: "rgba(255, 224, 0, 1)",
+            },
+          ]),
+          shadowColor: "rgba(1,1,1,0.5)",
+          shadowBlur: 1,
+        },
+      },
+    },
+    {
+      value: data.dataList[1].value - data.dataList[0].value,
+      name: "",
+      itemStyle: {
+        normal: {
+          color: "rgba(255, 224, 0, 0.1)", // 未完成的圆环的颜色
+          label: {
+            show: false,
+          },
+          labelLine: {
+            show: false,
+          },
+        },
+        emphasis: {
+          color: "rgba(255, 224, 0, 0.1)", // 未完成的圆环的颜色
+        },
+      },
+    },
+    {
+      value: data.dataList[1].value,
+      name: "总收件数",
+      itemStyle: {
+        normal: {
+          color: "rgba(0,0,0,0)",
+        },
+      },
+    },
+  ];
+  data1.value = [
+    {
+      value: data.dataList[1].value,
+      name: "",
+      itemStyle: {
+        normal: {
+          borderWidth: 1,
+          borderColor: "rgba(193, 229, 255, .1)",
+          color: new echarts.graphic.LinearGradient(1, 1, 1, 0, [
+            {
+              offset: 1,
+              color: "rgba(127, 242, 255, .2)",
+            },
+            {
+              offset: 0,
+              color: "rgba(109, 195, 255, 0)",
+            },
+          ]),
+        },
+      },
+    },
+    {
+      value: data.dataList[1].value,
+      name: "",
+      itemStyle: {
+        normal: {
+          color: "rgba(0,0,0,0)",
+        },
+      },
+    },
+  ];
+};
 const setChart = () => {
   var myChart = echarts.init(chart.value);
   myChart.setOption(data.option);
@@ -196,14 +202,14 @@ const setChart = () => {
 // 使用生命钩子
 onBeforeMount(() => {
   setTimeout(() => {
-    data.dataList[0].value=props.list.finish;
-    data.dataList[1].value=props.list.total;
-    data.percent=props.list.percent;
+    data.dataList[0].value = props.list.finish;
+    data.dataList[1].value = props.list.total;
+    data.percent = props.list.percent;
+    change();
     getOption();
     setChart();
   }, 600);
 });
-
 </script>
 
 <style scoped></style>
\ No newline at end of file
diff --git a/src/view/echarts_jz/zwfw2.vue b/src/view/echarts_jz/zwfw2.vue
index 7dd0b5c..a878595 100644
--- a/src/view/echarts_jz/zwfw2.vue
+++ b/src/view/echarts_jz/zwfw2.vue
@@ -3,7 +3,7 @@
 </template>
 
 <script setup>
-import { onMounted, reactive, ref ,onBeforeMount } from "vue";
+import { onMounted, reactive, ref, onBeforeMount } from "vue";
 // 局部引入echarts核心模块
 import * as echarts from "echarts";
 const props = defineProps({
@@ -31,91 +31,12 @@ const data = reactive({
 const chart = ref(); // 创建DOM引用
 
 //内圈数据
-var data2 = [
-  {
-    value: data.dataList[0].value,
-    name: "2.0收件数",
-    itemStyle: {
-      normal: {
-        color: new echarts.graphic.LinearGradient(0, 1, 1, 0, [
-          {
-            offset: 0,
-            color: "rgba(0, 255, 250, 0.29)",
-          },
-          {
-            offset: 0.5,
-            color: "rgba(0, 255, 250, 0.8)",
-          },
-          {
-            offset: 1,
-            color: "rgba(0, 255, 250, 1)",
-          },
-        ]),
-        shadowColor: "rgba(1,1,1,0.5)",
-        shadowBlur: 1,
-      },
-    },
-  },
-  {
-    value: data.dataList[1].value - data.dataList[0].value,
-    name: "",
-    itemStyle: {
-      normal: {
-        color: "#095b9b", // 未完成的圆环的颜色
-        label: {
-          show: false,
-        },
-        labelLine: {
-          show: false,
-        },
-      },
-      emphasis: {
-        color: "#095b9b", // 未完成的圆环的颜色
-      },
-    },
-  },
-  {
-    value: data.dataList[1].value,
-    name: "总收件数",
-    itemStyle: {
-      normal: {
-        color: "rgba(0,0,0,0)",
-      },
-    },
-  },
-];
+const  data2 = ref([
+
+]);
 //外圈数据
-const data1 = [
-  {
-    value: data.dataList[1].value,
-    name: "",
-    itemStyle: {
-      normal: {
-        borderWidth: 1,
-        borderColor: "rgba(193, 229, 255, .1)",
-        color: new echarts.graphic.LinearGradient(1, 1, 1, 0, [
-          {
-            offset: 1,
-            color: "rgba(127, 242, 255, .2)",
-          },
-          {
-            offset: 0,
-            color: "rgba(109, 195, 255, 0)",
-          },
-        ]),
-      },
-    },
-  },
-  {
-    value: data.dataList[1].value,
-    name: "",
-    itemStyle: {
-      normal: {
-        color: "rgba(0,0,0,0)",
-      },
-    },
-  },
-];
+const data1 = ref([
+]);
 
 const getOption = () => {
   data.option = {
@@ -143,14 +64,14 @@ const getOption = () => {
     //     }else{
     //       return params + "  " +num;
     //     }
-        
+
     //   },
     // },
 
     title: [
       {
         text: `${data.percent}%`,
-        right: "18%",
+        right: "38%",
         bottom: "40%",
         textStyle: {
           color: "#ffffff",
@@ -164,7 +85,7 @@ const getOption = () => {
         type: "pie",
         hoverAnimation: false,
         radius: ["60%", "80%"],
-        center: ["53%", "54%"],
+        center: ["50%", "54%"],
         startAngle: 180,
         label: {
           normal: {
@@ -172,11 +93,11 @@ const getOption = () => {
             position: "center",
           },
         },
-        data: data2,
+        data: data2.value,
       },
       {
         type: "pie",
-        center: ["53%", "54%"],
+        center: ["50%", "54%"],
         radius: ["80%", "95%"],
         hoverAnimation: false,
         startAngle: 180,
@@ -186,12 +107,97 @@ const getOption = () => {
             position: "center",
           },
         },
-        data: data1,
+        data: data1.value,
       },
     ],
   };
 };
-
+const change = () => {
+  data2.value = [
+    {
+      value: data.dataList[0].value,
+      name: "2.0收件数",
+      itemStyle: {
+        normal: {
+        color: new echarts.graphic.LinearGradient(0, 1, 1, 0, [
+          {
+            offset: 0,
+            color: "rgba(0, 255, 250, 0.29)",
+          },
+          {
+            offset: 0.5,
+            color: "rgba(0, 255, 250, 0.8)",
+          },
+          {
+            offset: 1,
+            color: "rgba(0, 255, 250, 1)",
+          },
+        ]),
+        shadowColor: "rgba(1,1,1,0.5)",
+        shadowBlur: 1,
+      },
+      },
+    },
+    {
+      value: data.dataList[1].value - data.dataList[0].value,
+      name: "",
+      itemStyle: {
+        normal: {
+          color: "#095b9b", // 未完成的圆环的颜色
+          label: {
+            show: false,
+          },
+          labelLine: {
+            show: false,
+          },
+        },
+        emphasis: {
+          color: "#095b9b", // 未完成的圆环的颜色
+        },
+      },
+    },
+    {
+      value: data.dataList[1].value,
+      name: "总收件数",
+      itemStyle: {
+        normal: {
+          color: "rgba(0,0,0,0)",
+        },
+      },
+    },
+  ];
+  data1.value = [
+    {
+      value: data.dataList[1].value,
+      name: "",
+      itemStyle: {
+        normal: {
+        borderWidth: 1,
+        borderColor: "rgba(193, 229, 255, .1)",
+        color: new echarts.graphic.LinearGradient(1, 1, 1, 0, [
+          {
+            offset: 1,
+            color: "rgba(127, 242, 255, .2)",
+          },
+          {
+            offset: 0,
+            color: "rgba(109, 195, 255, 0)",
+          },
+        ]),
+      },
+      },
+    },
+    {
+      value: data.dataList[1].value,
+      name: "",
+      itemStyle: {
+        normal: {
+          color: "rgba(0,0,0,0)",
+        },
+      },
+    },
+  ];
+};
 const setChart = () => {
   var myChart = echarts.init(chart.value);
   myChart.setOption(data.option);
@@ -200,14 +206,14 @@ const setChart = () => {
 // 使用生命钩子
 onBeforeMount(() => {
   setTimeout(() => {
-    data.dataList[0].value=props.list.finish;
-    data.dataList[1].value=props.list.total;
-    data.percent=props.list.percent;
+    data.dataList[0].value = props.list.finish;
+    data.dataList[1].value = props.list.total;
+    data.percent = props.list.percent;
+    change();
     getOption();
     setChart();
   }, 600);
 });
-
 </script>
 
 <style scoped></style>
\ No newline at end of file
diff --git a/src/view/sy_map.vue b/src/view/sy_map.vue
index 229dead..92909de 100644
--- a/src/view/sy_map.vue
+++ b/src/view/sy_map.vue
@@ -2903,7 +2903,7 @@ const createZyys = (polygon, indexx, name, tooltip) => {
           } else {
             zyysCenter.length = 0;
             zyysDk.length = 0;
-            await get_dk_zyys(polygon.fgfwrs);
+            await get_dk_zyys(polygon.fgfwrs,polygon.startAge,polygon.endAge);
             xr_dk_center_zyys();
           }
 
@@ -2955,7 +2955,7 @@ const loadCs_zyys = async (name) => {
     }
   }
 };
-const get_dk_zyys = async (sj) => {
+const get_dk_zyys = async (sj,start,end) => {
   zyys_dk.value.length = 0;
   zyys_center.value.length = 0;
   zyys_data.value.point.length = 0;
@@ -2966,8 +2966,6 @@ const get_dk_zyys = async (sj) => {
       zyys_jd.push(itemN.town);
     }
   });
-  console.log(1111111111111, zyys_jd);
-
   zyys_jd.forEach((item) => {
     loadCs_zyys(item);
   });
@@ -2979,7 +2977,7 @@ const get_dk_zyys = async (sj) => {
     });
     zyysCenter.forEach((center) => {
       if (item.committee == center.name) {
-        let a = { ...center, num: item.num,town: item.town,committee: item.committee};
+        let a = { ...center, num: item.num,town: item.town,committee: item.committee,startAge:start,endAge:end };
         zyys_data.value.center.push(a);
       }
     });
@@ -3074,10 +3072,10 @@ const Xr_zyysNum = (polygon, indexx) => {
   zyys_center.value[indexx].addEventListener("click", () => {
     console.log(polygon);
     // cfCsZs.value = polygon.name;
-    open_detail_zyys(polygon.town, polygon.committee);
+    open_detail_zyys(polygon.town, polygon.committee,polygon.startAge,polygon.endAge);
   });
 };
-const open_detail_zyys = (town,committee) => {
+const open_detail_zyys = (town,committee,start,end) => {
   let age = "";
   dialogShow.value = true;
   http
@@ -3086,7 +3084,7 @@ const open_detail_zyys = (town,committee) => {
         pagination.pageSize
       }&committee=${committee}&town=${
         town
-      }`
+      }&startAge=${start}&endAge=${end}`
     )
     .then((res) => {
       if (res.code == 200) {
diff --git a/src/view/table_gk/gk_jz.vue b/src/view/table_gk/gk_jz.vue
index dd17ab7..3d0585b 100644
--- a/src/view/table_gk/gk_jz.vue
+++ b/src/view/table_gk/gk_jz.vue
@@ -1,14 +1,18 @@
 <template>
   <div class="module11">
     <div class="displayFlex left_bg">
-      <div class="flex1" style="margin-top: 10px">
+      <div class="flex1">
         <div class="yd_title left_1">
           <div class="animate-border">
             <i></i>
             <i></i>
           </div>
         </div>
-        <eP3 :list="data.jsbgl" v-if="showEchart"></eP3>
+        <eP3
+          :list="data.jsbgl"
+          v-if="showEchart"
+          style="width: 95%; margin-top: 10px"
+        ></eP3>
       </div>
       <div class="flex1">
         <div class="yd_title left_2">
@@ -17,10 +21,23 @@
             <i></i>
           </div>
         </div>
-        <eP2
-          :list="data.medicalInsurance.ffrc"
-          :year="data.medicalInsurance.year"
-        ></eP2>
+        <div class="wfjw">
+          <div class="wfjw_choose">
+            <div
+              class="wfjw_choose_item"
+              v-for="(item, index) in data.wfjw.chooselist"
+              :class="data.wfjw.choose == item ? 'active' : 'unactive'"
+              :key="index"
+              @click="chooseWfjw(item)"
+            >
+              {{ item }}
+            </div>
+          </div>
+          <eP2
+            :list="data.medicalInsurance.ffrc"
+            :year="data.medicalInsurance.year"
+          ></eP2>
+        </div>
       </div>
     </div>
     <div class="displayFlex center_bg">
@@ -35,13 +52,13 @@
           <div class="shang_item">
             <div class="title">物业小区</div>
             <div class="i">
-              <zwfw1 :list="data.fgl.list1" />
+              <zwfw1 :list="data.fgl.list1" v-if="showEchart" />
             </div>
           </div>
           <div class="shang_item">
             <div class="title">专业物业</div>
             <div class="i">
-              <zwfw2 :list="data.fgl.list2"/>
+              <zwfw2 :list="data.fgl.list2" v-if="showEchart" />
             </div>
           </div>
         </div>
@@ -54,9 +71,23 @@
             <i></i>
           </div>
         </div>
+        <div class="wlsq">
+          <el-table
+            :data="data.tableData1"
+            style="width: 100%; height: 500px"
+            class="table_border"
+            :row-style="rowState"
+            :header-cell-style="tableHeaderColor"
+          >
+            <el-table-column prop="name" label="社区名称" />
+            <el-table-column prop="address" label="社区位置" />
+            <el-table-column prop="text" label="社区材料" />
+          </el-table>
+        </div>
       </div>
     </div>
     <div class="displayFlex right_bg">
+      <!-- 住宅工程质量提升行动 -->
       <div class="flex1">
         <div class="yd_title right_1">
           <div class="animate-border">
@@ -64,7 +95,18 @@
             <i></i>
           </div>
         </div>
+        <div class="zzgc">
+          <div class="zzgc_item">
+            <eP1></eP1>
+            <div class="zzgc_item_title">按期办结率</div>
+          </div>
+          <div class="zzgc_item">
+            <eP4></eP4>
+            <div class="zzgc_item_title">专项检查次数</div>
+          </div>
+        </div>
       </div>
+      <!-- 棚户区改造 -->
       <div class="flex1">
         <div class="yd_title right_2">
           <div class="animate-border">
@@ -72,6 +114,30 @@
             <i></i>
           </div>
         </div>
+        <div class="phqgz">
+          <div class="phqgz_title">
+            <img src="@/assets/images/jz/sjx.png" alt="" />
+            <div class="phqgz_title_text">已改造：3300户</div>
+          </div>
+          <el-table
+            :data="data.tableData2"
+            style="width: 100%; height: 500px"
+            class="table_border"
+            :row-style="rowState"
+            :header-cell-style="tableHeaderColor"
+          >
+            <el-table-column prop="starttime" label="开始时间" width="132" />
+
+            <el-table-column prop="endtime" label="结束时间" width="131" />
+            <el-table-column prop="address" label="地点" width="132" />
+            <el-table-column prop="title" label="名称" width="132" />
+            <el-table-column prop="finish" label="详情">
+              <template #default="scope">
+                <div style="text-align: center">查看详情</div>
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
       </div>
     </div>
   </div>
@@ -79,34 +145,127 @@
   
   <script setup>
 import { ref, reactive, onMounted, onBeforeMount } from "vue";
+import eP1 from "../echarts_jz/eP1.vue";
 import eP2 from "../echarts_jz/eP2.vue";
 import eP3 from "../echarts_jz/eP3.vue";
+import eP4 from "../echarts_jz/eP4.vue";
 import http from "@/utils/request.js";
 import zwfw1 from "../echarts_jz/zwfw1.vue";
 import zwfw2 from "../echarts_jz/zwfw2.vue";
 const data = reactive({
-  medicalInsurance: {}, //医疗保险
+  medicalInsurance: {},
   fgl: {
     list1: {
-      finish: "60",
-      total: "100",
-      percent: "60",
+      finish: 60,
+      total: 100,
+      percent: 60,
     },
     list2: {
       finish: "40",
       total: "100",
       percent: "40",
     },
-  },//覆盖率
-  jkda: {
-    jdfs: "336993",
-    jdl: "91.82",
-    jtysqyl: "49.37",
-  }, //健康档案
-  
+  }, //覆盖率
+  tableData1: [
+    {
+      name: "金隅智慧园",
+      address: "金隅智慧园",
+      text: "金隅智慧园疫情防控演练",
+    },
+    {
+      name: "金隅智慧园",
+      address: "金隅智慧园",
+      text: "金隅智慧园疫情防控演练",
+    },
+    {
+      name: "金隅智慧园",
+      address: "金隅智慧园",
+      text: "金隅智慧园疫情防控演练",
+    },
+    {
+      name: "金隅智慧园",
+      address: "金隅智慧园",
+      text: "金隅智慧园疫情防控演练",
+    },
+  ],
+  tableData2: [
+    {
+      starttime: "2023-11-01",
+      endtime: "2023-11-30",
+      address: "金隅智慧园",
+      title: "金隅智慧园疫情防控演练",
+    },
+    {
+      starttime: "2023-11-01",
+      endtime: "2023-11-30",
+      address: "金隅智慧园",
+      title: "金隅智慧园疫情防控演练",
+    },
+    {
+      starttime: "2023-11-01",
+      endtime: "2023-11-30",
+      address: "金隅智慧园",
+      title: "金隅智慧园疫情防控演练",
+    },
+    {
+      starttime: "2023-11-01",
+      endtime: "2023-11-30",
+      address: "金隅智慧园",
+      title: "金隅智慧园疫情防控演练",
+    },
+    {
+      starttime: "2023-11-01",
+      endtime: "2023-11-30",
+      address: "金隅智慧园",
+      title: "金隅智慧园疫情防控演练",
+    },
+    {
+      starttime: "2023-11-01",
+      endtime: "2023-11-30",
+      address: "金隅智慧园",
+      title: "金隅智慧园疫情防控演练",
+    },
+  ],
+  //危房解危
+  wfjw: {
+    chooselist: ["城镇", "农村"],
+    choose: "城镇",
+  },
 });
+// 表格样式
+const tableHeaderColor = (arg) => {
+  return {
+    paddingLeft: "10px",
+    letterSpacing: "1px",
+    fontSize: "15px",
+    height: "32px",
+    backgroundColor: "#455F8A",
+    color: "#fff",
+  };
+};
+const rowState = (row) => {
+  if (row.rowIndex % 2 == 0) {
+    return {
+      letterSpacing: "1px",
+      fontSize: "14px",
+      height: "36px",
+      backgroundColor: "rgba(31, 63, 113, 1)",
+      color: "#fff",
+    };
+  } else if (row.rowIndex % 2 !== 0) {
+    return {
+      letterSpacing: "1px",
+      fontSize: "14px",
+      height: "36px",
+      backgroundColor: "rgba(43, 74, 121, 1)",
+      color: "#fff",
+    };
+  }
+};
 const showEchart = ref(false);
-
+const chooseWfjw=(val)=>{
+  data.wfjw.choose = val
+}
 const getData = async () => {
   showEchart.value = true;
   // await http.get("/api/ggfwyth/health").then((res) => {
@@ -358,32 +517,146 @@ onMounted(() => {});
 .font {
   font-size: 18px !important;
 }
-.shang {
-  margin-top:20px;
+//危房解危
+.wfjw {
+  width: 95%;
+  margin-top: 10px;
+  .wfjw_choose {
     display: flex;
-    justify-content: space-around;
-    &_item {
-      width: 45%;
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      .title {
-        width: 50%;
-        background-image: url(@/assets/images/sy/zwfw_title.png);
-        background-repeat: no-repeat;
-        background-size: 100% 100%;
-        text-align: center;
-        font-weight: 400;
-        font-size: 16px;
-        color: #ffffff;
-        line-height: 20px;
-        letter-spacing: 2px;
-      }
-      .i {
-        width: 100%;
-        height: 200px;
-      }
+    align-items: center;
+    .wfjw_choose_item {
+      margin-right: 20px;
+      cursor: pointer;
+      width: 84px;
+      height: 32px;
+      text-align: center;
+      line-height: 32px;
+      padding: 6px;
+      font-family: PingFangSC, PingFang SC;
+      font-weight: 500;
+      font-size: 14px;
+      color: #ffffff;
+    }
+    .active {
+      background-image: url(@/assets/images/jz/wfjw1.png);
+      background-repeat: no-repeat;
+      background-size: 100% 100%;
+    }
+    .unactive {
+      background-image: url(@/assets/images/jz/wfjw2.png);
+      background-repeat: no-repeat;
+      background-size: 100% 100%;
     }
   }
+}
+//覆盖率
+.shang {
+  margin-top: 20px;
+  display: flex;
+  justify-content: space-around;
+  &_item {
+    width: 45%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    .title {
+      width: 50%;
+      background-image: url(@/assets/images/sy/zwfw_title.png);
+      background-repeat: no-repeat;
+      background-size: 100% 100%;
+      text-align: center;
+      font-weight: 400;
+      font-size: 16px;
+      color: #ffffff;
+      line-height: 20px;
+      letter-spacing: 2px;
+    }
+    .i {
+      width: 100%;
+      height: 200px;
+    }
+  }
+}
+//未来社区
+.wlsq {
+  width: 95%;
+  margin-top: 20px;
+}
+//住宅工程
+.zzgc {
+  margin-top: 10px;
+  display: flex;
+  box-sizing: border-box;
+  // justify-content: space-between;
+  padding: 20px;
+  .zzgc_item {
+    width: 48%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    .zzgc_item_title {
+      margin-top: 20px;
+      font-family: PingFangSC, PingFang SC;
+      font-weight: 500;
+      font-size: 16px;
+      color: #ffffff;
+      line-height: 22px;
+      letter-spacing: 2px;
+      background: radial-gradient(
+        224% 77% at 50% 100%,
+        rgba(63, 194, 252, 0.64) 0%,
+        rgba(63, 194, 252, 0) 100%,
+        rgba(255, 255, 255, 0) 100%
+      );
+    }
+  }
+}
+//棚户区改造
+.phqgz {
+  width: 95%;
+  .phqgz_title {
+    display: flex;
+    align-items: center;
+    padding: 20px;
+    img {
+      width: 30px;
+      height: 30px;
+    }
+    .phqgz_title_text {
+      font-family: PingFangSC, PingFang SC;
+      font-weight: 400;
+      font-size: 16px;
+      color: #62f3ff;
+      line-height: 22px;
+      letter-spacing: 1px;
+    }
+  }
+  :deep(.el-table td.el-table__cell, .el-table th.el-table__cell.is-leaf) {
+    border: none !important;
+    padding-left: 10px !important;
+  }
+
+  :deep(.el-table td.el-table__cell) {
+    padding-left: 10px;
+  }
+}
+
+:deep(.el-table--enable-row-hover .el-table__body tr:hover > td) {
+  background-color: #2f4b74;
+}
+
+:deep(.el-table__empty-block) {
+  background-color: #122560;
+}
+
+:deep(.el-table .el-table__row) {
+  border-bottom: none;
+}
+:deep(.el-table) {
+  background: rgba(32, 64, 115, 1);
+
+  --el-table-border-color: none;
+  border: 1px solid #7aceff;
+}
 </style>
   
\ No newline at end of file