jz

src/utils/request.js

@@ -2,7 +2,7 @@ import axios from "axios";
 import { ElMessage } from "element-plus";
 import tools from "@/utils/tools";
 import router from "../router";
-axios.defaults.baseURL = 'https://jzzf.longyou.gov.cn:998/'
+// axios.defaults.baseURL = 'https://jzzf.longyou.gov.cn:998/'
 axios.defaults.timeout = 120000;
 
 // HTTP request 拦截器

src/view/echarts_jz/eP1.vue

@@ -1,296 +1,297 @@
 <template>
-    <div ref="chart" style="width: 100%; height: 180px"></div>
+  <div ref="chart" style="width: 100%; height: 180px"></div>
-  </template>
+</template>
     
-    <script setup>
+<script setup>
-  import { onMounted, reactive, ref, onBeforeMount, onBeforeUnmount } from "vue";
+import { onMounted, reactive, ref, onBeforeMount, onBeforeUnmount,watch } from "vue";
-  // 局部引入echarts核心模块
+// 局部引入echarts核心模块
-  import * as echarts from "echarts";
+import * as echarts from "echarts";
-  const props = defineProps({
+const props = defineProps({
-    list: {
+  list: {
-      type: Array,
+    type: String,
-      default: () => {
+    default: () => {
-        return {};
+      return '';
+    },
+  },
+});
+const data = reactive({
+  option: {},
+  dataValue: 86,
+});
+let angle = 0; // 角度
+const chart = ref(); // 创建DOM引用
+const getOption = () => {
+  data.option = {
+    title: {
+      text: `{v|${data.dataValue}}{unit|%}`,
+      x: "center",
+      y: "center",
+      textStyle: {
+        rich: {
+          v: {
+            fontSize: 25,
+            color: "#fff",
+          },
+          unit: {
+            fontSize: 25,
+            color: "#fff",
+          },
+        },
       },
     },
-  });
+    series: [
-  const data = reactive({
+      /** 绘制内部圆弧-1 <right-top> */
-    option: {},
+      {
-  });
+        type: "custom",
-  let angle = 0; // 角度
+        coordinateSystem: "none",
-  let dataValue = 86;
+        renderItem: (params, api) => {
-  const chart = ref(); // 创建DOM引用
+          return {
-  const getOption = () => {
+            type: "arc",
-    data.option = {
+            shape: {
-      title: {
+              cx: api.getWidth() / 2,
-        text: `{v|${dataValue}}{unit|%}`,
+              cy: api.getHeight() / 2,
-        x: "center",
+              r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.92,
-        y: "center",
+              startAngle: ((270 + angle) * Math.PI) / 180,
-        textStyle: {
+              endAngle: ((360 + angle) * Math.PI) / 180,
-          rich: {
-            v: {
-              fontSize: 25,
-              color: "#fff",
             },
-            unit: {
+            style: {
-              fontSize: 25,
+              fill: "transparent",
-              color: "#fff",
+              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: data.dataValue,
+            itemStyle: {
+              color: "RGBA(0, 225, 248, 1)",
             },
           },
+          {
+            name: "未完成",
+            value: 100 - data.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,
         },
       },
-      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 time;
-    var myChart = echarts.init(chart.value);
+const setChart = () => {
-    myChart.setOption(data.option);
+  var myChart = echarts.init(chart.value);
-    time = setInterval(() => {
+  myChart.setOption(data.option);
-      angle = angle + 2;
+  time = setInterval(() => {
-      myChart.setOption(data.option, true);
+    angle = angle + 2;
-    }, 100);
+    myChart.setOption(data.option, true);
-  };
+  }, 100);
-  onBeforeUnmount(() => {
+};
-    if (time) {
+onBeforeUnmount(() => {
-      clearInterval(time);
+  if (time) {
-    }
+    clearInterval(time);
-  });
+  }
-  // 使用生命钩子
+});
-  onBeforeMount(() => {
+// 使用生命钩子
-    setTimeout(() => {
+onBeforeMount(() => {
-      getOption();
+  setTimeout(() => {
-      setChart();
+    data.dataValue=props.list;
-    }, 600);
+    getOption();
-  });
+    setChart();
-  </script>
+  }, 600);
+});
+</script>
     
     <style scoped></style>

src/view/echarts_jz/eP2.vue

@@ -3,7 +3,14 @@
 </template>
 
 <script setup>
-import { onMounted, reactive, ref, onBeforeMount, defineProps,watch } from "vue";
+import {
+  onMounted,
+  reactive,
+  ref,
+  onBeforeMount,
+  defineProps,
+  watch,
+} from "vue";
 // 局部引入echarts核心模块
 import * as echarts from "echarts";
 const props = defineProps({
@@ -19,35 +26,27 @@ const data = reactive({
 //职称结构取数
 
 var rich = {
-  name: {
+  white: {
-    color: "#666666",
+    color: "#65FDFD",
-    fontSize: 14,
+    align: "center",
-    padding: [8, 30, 0, 30],
+    fontSize: 18,
-    fontWeight: "400",
+    // padding: [21, 0],
-    align: "left",
   },
-  value: {
+  yellow: {
-    color: "#333",
+    color: "#ffc20e",
-    fontSize: 15,
+    fontSize: 18,
-    padding: [0, 30, 8, 30],
+    padding: [5, 4],
-    fontWeight: "500",
+    align: "center",
-    align: "left",
   },
-  percent: {
+  total: {
-    color: "#FFF",
+    color: "#ffc20e",
-    align: "right",
+    fontSize: 18,
-    fontSize: 15,
+    align: "center",
-    fontWeight: "500",
-    //padding: [0, 5]
   },
-  hr: {
+  blue: {
-    borderColor: "#DFDFDF",
+    color: "#49dff0",
-    width: "100%",
+    fontSize: 16,
-    borderWidth: 1,
+    align: "center",
-    height: 0,
-  },
-  cir: {
-    fontSize: 26,
   },
 };
 var colorList = ["#3BAEFF", "#41EDD5", "#FFC371", "#797AFF"];
@@ -95,10 +94,15 @@ const getOption = () => {
             color: "white", // 改变标示文字的颜色
             fontSize: 18, //文字大小
           },
-          formatter: "{b}:{c}" + "个\n\n",
+          normal: {
-          borderWidth: 20,
+            formatter: function (param) {
-          borderRadius: 4,
+              return "{white|" + param.name + "}\n{yellow|" + param.value + "}";
-          padding: [0, -100],
+            },
+            borderWidth: 20,
+            borderRadius: 4,
+            padding: [0, -50],
+            rich: rich,
+          },
         },
         labelLine: {
           normal: {
@@ -151,14 +155,17 @@ const setChart = () => {
   // 使用刚指定的配置项和数据显示图表。
   myChart.setOption(data.option);
 };
-watch(()=>props.list,()=>{
+watch(
-  data.list=props.list
+  () => props.list,
-  getOption();
+  () => {
-  setChart();
+    data.list = props.list;
-})
+    getOption();
+    setChart();
+  }
+);
 onBeforeMount(() => {
   setTimeout(() => {
-    data.list=props.list
+    data.list = props.list;
     getOption();
     setChart();
   }, 600);

src/view/echarts_jz/eP3.vue

@@ -8,7 +8,25 @@ import { onMounted, onBeforeMount, reactive, ref } from "vue";
 import * as echarts from "echarts";
 const emit = defineEmits(["shuju"]);
 const props = defineProps({
-  list: {
+  list1: {
+    type: Array,
+    default: () => {
+      return [];
+    },
+  },
+  list2: {
+    type: Array,
+    default: () => {
+      return [];
+    },
+  },
+  list3: {
+    type: Array,
+    default: () => {
+      return [];
+    },
+  },
+  year: {
     type: Array,
     default: () => {
       return [];
@@ -43,13 +61,11 @@ const colors = [
 ];
 // const valueList = [20, 53, 47, 65, 29, 11, 10];
 const data = reactive({
-  list: [],
   option: {},
-  Max: 20000,
   valueList: [4504, 16086, 6130, 2844, 4967, 179, 1685, 5010],
   valueList2: [1181, 2177, 3720, 3711, 4642, 1654, 3395, 5552],
   valueList3: [1181, 2177, 3720, 3711, 4642, 1654, 3395, 5552],
-  xxname: ["1月", "2月", "3月", "4月","5月"],
+  year: [],
 });
 // 注册5个面图形:左侧、前面、右面、上面、下面
 //c0:左下角，c1：右下角,c2:右上角，c3：左上角
@@ -403,7 +419,7 @@ const getOption = () => {
     xAxis: [
       {
         type: "category",
-        data: data.xxname,
+        data: data.year,
         axisLine: {
           show: false,
         },
@@ -417,13 +433,13 @@ const getOption = () => {
           color: "#fff",
           fontSize: 16,
           formatter: function (value) {
-            return value.length > 3 ? value.slice(0, 2) + "..." : value;
+            return value.length > 4 ? value.slice(0, 3) + "..." : value;
           },
         },
       },
       {
         type: "category",
-        data: data.xxname,
+        data: data.year,
         axisLine: {
           show: false,
         },
@@ -441,7 +457,7 @@ const getOption = () => {
     ],
     yAxis: {
       min: 0,
-      max: data.Max,
+    
       // interval: 100,
       type: "value",
       axisLine: {
@@ -756,31 +772,12 @@ const setChart = () => {
     emit("shuju", params.name, params.seriesIndex);
   });
 };
-const getMaxCeilingValue = (arr) => {
-  let max = Math.max(...arr); // 找到数组中的最大值
-  return Math.ceil(max / 100) * 100; // 将最大值向上取整到最近的100的倍数
-};
-const setChart1 = () => {
-  data.valueList = [];
-  data.xxname = [];
-  if (data.list.length !== 0) {
-    data.list.forEach((item) => {
-      data.xxname.push(item.name); //信息名
-      data.valueList.push(item.num); //信息数
-    });
-  }
-};
-
 onBeforeMount(() => {
   setTimeout(() => {
-    data.xxname.forEach((item, index) => {
+    data.year=props.year;
-      props.list.forEach((itemm, indexx) => {
+    data.valueList=props.list1;
-        if (item == itemm.xzjd) {
+    data.valueList2=props.list2;
-          data.valueList[index] = itemm.qrrs;
+    data.valueList3=props.list3;
-          data.valueList2[index] = itemm.qcrs;
-        }
-      });
-    });
     getOption();
     setChart();
   }, 800);

src/view/echarts_jz/eP4.vue

@@ -8,22 +8,22 @@
   import * as echarts from "echarts";
   const props = defineProps({
     list: {
-      type: Array,
+      type: String,
       default: () => {
-        return {};
+        return '';
       },
     },
   });
   const data = reactive({
     option: {},
+    dataValue: 0,
   });
   let angle = 0; // 角度
-  let dataValue = 86;
   const chart = ref(); // 创建DOM引用
   const getOption = () => {
     data.option = {
       title: {
-        text: `{v|${dataValue}}{unit|%}`,
+        text: `{v|${data.dataValue}}{unit|次}`,
         x: "center",
         y: "center",
         textStyle: {
@@ -224,14 +224,14 @@
           animation: false, // 关闭饼图动画
           data: [
             {
-              value: dataValue,
+              value: data.dataValue,
               itemStyle: {
                 color: "RGBA(0, 139, 255, 1)",
               },
             },
             {
               name: "未完成",
-              value: 100 - dataValue,
+              value: 100 - data.dataValue,
               label: {
                 show: false,
               },
@@ -287,6 +287,7 @@
   // 使用生命钩子
   onBeforeMount(() => {
     setTimeout(() => {
+      data.dataValue=props.list
       getOption();
       setChart();
     }, 600);

src/view/echarts_jz/zwfw1.vue

@@ -40,34 +40,6 @@ const data1 = ref([
 
 const getOption = () => {
   data.option = {
-    // legend: {
-    //   selectedMode: false,
-    //   itemWidth: 10,
-    //   itemHeight: 10,
-    //   itemGap: 10,
-    //   icon: "circle",
-    //   data: ["2.0收件数", "", "总收件数"],
-    //   bottom: "3%",
-    //   width: 380,
-    //   textStyle: {
-    //     color: "#ffffff", // 修改图例颜色为红色
-    //   },
-    //   formatter: function (params) {
-    //     var num = "";
-    //     for (let i = 0; i < data.dataList.length; i++) {
-    //       if (data.dataList[i].name == params) {
-    //         num = data.dataList[i].value;
-    //       }
-    //     }
-    //     if(params == "总收件数"){
-    //       return params + "   " +num;
-    //     }else{
-    //       return params + "  " +num;
-    //     }
-
-    //   },
-    // },
-
     title: [
       {
         text: `${data.percent}%`,

src/view/sy_map.vue

@@ -98,8 +98,11 @@
             <div
               class="content_item"
               v-for="(item, index) in tsbqTotal"
-              :class="{ choose: item.id == choose.person }"
+              :class="{
-              @click="buten2(item)"
+                choose: item.id == choose.person,
+                Tsactive: !item.click,
+              }"
+              @click="item.click ? buten2(item) : ''"
               :key="index"
             >
               <div class="content_item_name">{{ item.name }}</div>
@@ -120,8 +123,9 @@
               :class="{
                 choose: yaosuList.includes(item.name),
                 wz: item.wz == true,
+                Tsactive: !item.click,
               }"
-              @click="changeys(item.name)"
+              @click="item.click ? changeys(item.name) : ''"
               :key="index"
             >
               <img :src="item.img" class="zyys_content_item_left" />
@@ -779,6 +783,13 @@ const PopulationRatio = ref([
 ]);
 //特殊标签左侧数据
 const tsbqTotal = ref([]);
+const lingshibiaoqian = reactive([
+  {
+    id: "临时标签",
+    name: "临时标签",
+    tagId: "555",
+  },
+]);
 const data = reactive({
   serviceCircleList: [],
   fwqCoordinates: [], //服务圈经度
@@ -817,8 +828,8 @@ const yaosuTotal = ref([
     name: "体育场所",
     img: j0,
     wz: false,
+    click: true,
   },
-
   {
     id: 1,
     name: "幼儿园",
@@ -827,6 +838,7 @@ const yaosuTotal = ref([
     wz: false,
     tooltip: "zyysmc",
     url: "/api/ggfwyth/ysyzt/getZyys?zyyslx=幼儿园",
+    click: true,
   },
   {
     id: 2,
@@ -836,6 +848,7 @@ const yaosuTotal = ref([
     wz: false,
     tooltip: "zyysmc",
     url: "/api/ggfwyth/ysyzt/getZyys?zyyslx=小学",
+    click: true,
   },
   {
     id: 3,
@@ -845,6 +858,7 @@ const yaosuTotal = ref([
     wz: false,
     tooltip: "zyysmc",
     url: "/api/ggfwyth/ysyzt/getZyys?zyyslx=初中",
+    click: true,
   },
   {
     id: 4,
@@ -854,6 +868,7 @@ const yaosuTotal = ref([
     wz: false,
     tooltip: "zyysmc",
     url: "/api/ggfwyth/ysyzt/getZyys?zyyslx=高中",
+    click: true,
   },
   {
     id: 5,
@@ -863,12 +878,14 @@ const yaosuTotal = ref([
     wz: false,
     tooltip: "zyysmc",
     url: "/api/ggfwyth/ysyzt/getZyys?zyyslx=医院",
+    click: true,
   },
   {
     id: 6,
     name: "南孔书院",
     img: j6,
     wz: false,
+    click: true,
   },
   {
     id: 7,
@@ -877,12 +894,14 @@ const yaosuTotal = ref([
     img_map: j7_map,
     wz: false,
     tooltip: "name",
+    click: true,
   },
   {
     id: 8,
     name: "汽车充电桩",
     img: j8,
     wz: true,
+    click: true,
   },
   {
     id: 9,
@@ -892,6 +911,7 @@ const yaosuTotal = ref([
     wz: true,
     tooltip: "zyysmc",
     url: "/api/ggfwyth/ysyzt/getZyys?zyyslx=卫生服务中心",
+    click: true,
   },
   {
     id: 10,
@@ -901,15 +921,133 @@ const yaosuTotal = ref([
     wz: true,
     url: "/api/ggfwyth/ysyzt/getAeds",
     tooltip: "siteAddress",
+    click: true,
   },
   {
     id: 11,
     name: "摄像头",
     img: j11,
     img_map: j11_map,
-    wz: false,
+    wz: true,
     url: "/api/ggfwyth/ysyzt/getJashsxt",
     tooltip: "sbmc",
+    click: true,
+  },
+
+  {
+    id: 25,
+    name: "菜市场",
+    img: j0,
+    wz: true,
+    click: false,
+  },
+  {
+    id: 26,
+    name: "停车场",
+    img: j0,
+    wz: true,
+    click: false,
+  },
+ 
+  {
+    id: 21,
+    name: "党群服务中心",
+    img: j0,
+    wz: true,
+    click: false,
+  },
+  {
+    id: 22,
+    name: "残疾人之家",
+    img: j0,
+    wz: true,
+    click: false,
+  },
+  {
+    id: 23,
+    name: "百姓健身房",
+    img: j0,
+    wz: true,
+    click: false,
+  },
+  {
+    id: 31,
+    name: "绿色跑道",
+    img: j0,
+    wz: true,
+    click: false,
+  },
+  {
+    id: 24,
+    name: "便民服务中心",
+    img: j0,
+    wz: true,
+    click: false,
+  },
+
+  {
+    id: 27,
+    name: "老年活动室",
+    img: j0,
+    wz: true,
+    click: false,
+  },
+  {
+    id: 28,
+    name: "篮球场",
+    img: j0,
+    wz: false,
+    click: false,
+  },
+  {
+    id: 29,
+    name: "足球场",
+    img: j0,
+    wz: false,
+    click: false,
+  },
+  {
+    id: 30,
+    name: "文化广场",
+    img: j0,
+    wz: false,
+    click: false,
+  },
+
+  {
+    id: 32,
+    name: "公厕",
+    img: j0,
+    wz: false,
+    click: false,
+  },
+  {
+    id: 33,
+    name: "文化礼堂",
+    img: j0,
+    wz: false,
+    click: false,
+  },
+  {
+    id: 34,
+    name: "农家书屋",
+    img: j0,
+    wz: false,
+    click: false,
+  },
+  {
+    id: 20,
+    name: "助餐点",
+    img: j0,
+    wz: false,
+    click: false,
+  },
+  {
+    id: 35,
+    name: "乡贤馆",
+    img: j0,
+    wz: false,
+    click: false,
   },
 ]);
 //选中的资源要素
@@ -1180,8 +1318,7 @@ const getCssj = async () => {
     .then((res) => {
       if (res.code == 200) {
         cssj = JSON.parse(res.data);
-        console.log(1111111111,cssj);
+        console.log(1111111111, cssj);
-        
       }
     });
 };
@@ -2493,6 +2630,7 @@ const getDataBq = async (jd, cs) => {
                 name: itemm.bq,
                 rksl: itemm.rs || 0,
                 tagId: itemm.tagId,
+                click: true,
               });
               b = 1;
             }
@@ -2503,9 +2641,20 @@ const getDataBq = async (jd, cs) => {
               name: item.name,
               rksl: 0,
               tagId: item.tagId,
+              click: true,
             });
           }
         });
+        //添加临时标签
+        lingshibiaoqian.forEach((item, index) => {
+          tsbqTotal.value.push({
+            id: item.name,
+            name: item.name,
+            rksl: 0,
+            tagId: item.tagId,
+            click: false,
+          });
+        });
       }
     });
 };
@@ -2527,6 +2676,17 @@ const getDataBqFirst = async () => {
           name: item.bq,
           rksl: item.rs || 0,
           tagId: item.tagId,
+          click: true,
+        });
+      });
+      //添加临时标签
+      lingshibiaoqian.forEach((item, index) => {
+        tsbqTotal.value.push({
+          id: item.name,
+          name: item.name,
+          rksl: 0,
+          tagId: item.tagId,
+          click: false,
         });
       });
     }
@@ -2777,9 +2937,12 @@ const zyys_choose_cs = ref("");
 const changeys = (name) => {
   if (yaosuList.value.includes(name)) {
     yaosuList.value = yaosuList.value.filter((ch) => ch !== name);
-    yaosuIcon.value[name].sj.forEach((item, index) => {
+    if (yaosuIcon.value[name]) {
-      map.removeOverlay(yaosuIcon.value[name].sj[index].overlay);
+      yaosuIcon.value[name].sj.forEach((item, index) => {
-    });
+        map.removeOverlay(yaosuIcon.value[name].sj[index].overlay);
+      });
+    }
+
     if (name == zyys_choose_cs.value) {
       zyys_dk.value.forEach((item, index) => {
         map.removeOverlay(item);
@@ -2818,9 +2981,10 @@ const changeys = (name) => {
       name == "卫生服务中心"
     ) {
       getZyys(url, name, img, img_map, tooltip);
-    }
+    } else if (name == "养老机构") {
-    if (name == "养老机构") {
       getZyys2(name, img, img_map, tooltip);
+    } else {
+      loadingss.value = false;
     }
   }
 };
@@ -3000,7 +3164,7 @@ const loadCs_zyys = async (jdname) => {
       zyysCenter.push({
         id: v.id,
         name: v.properties.name,
-        jdname:jdname,
+        jdname: jdname,
         center: v.properties.center,
       });
     }
@@ -3020,57 +3184,11 @@ const get_dk_zyys = async (sj, xd, ssly) => {
   zyys_jd.forEach((item) => {
     loadCs_zyys(item);
   });
-  zyysDk.forEach((dk) => {
+  // zyysDk.forEach((dk) => {
-    let pdK = true; //判断sj有没有对应地块，没有就赋值0
+  //   let pdK = true; //判断sj有没有对应地块，没有就赋值0
-    sj.forEach((item, index) => {
+  //   sj.forEach((item, index) => {
-      if (item.committee == dk.name) {
-        pdK = false;
-        let a = {
-          ...dk,
-          zt: item.zt,
-        };
-        zyys_data.value.point.push(a);
-      }
-    });
-    if (pdK) {
-      let a = {
-        ...dk,
-        zt: 0,
-      };
-      zyys_data.value.point.push(a);
-    }
-  });
-  zyysCenter.forEach((center) => {
-    let pdK = true; //判断sj有没有对应地块，没有就赋值0
-    sj.forEach((item, index) => {
-      if (item.committee == center.name) {
-        pdK = false;
-        let b = {
-          ...center,
-          num: item.num,
-          town: item.town,
-          committee: item.committee,
-          ssly: ssly,
-          xd: xd,
-        };
-        zyys_data.value.center.push(b);
-      }
-    });
-    if (pdK) {
-      let b = {
-          ...center,
-          num: 0,
-          town: center.jdname,
-          committee: center.name,
-          ssly: ssly,
-          xd: xd,
-        };
-        zyys_data.value.center.push(b);
-    }
-  });
-  // sj.forEach((item, index) => {
-  //   zyysDk.forEach((dk) => {
   //     if (item.committee == dk.name) {
+  //       pdK = false;
   //       let a = {
   //         ...dk,
   //         zt: item.zt,
@@ -3078,8 +3196,19 @@ const get_dk_zyys = async (sj, xd, ssly) => {
   //       zyys_data.value.point.push(a);
   //     }
   //   });
-  //   zyysCenter.forEach((center) => {
+  //   if (pdK) {
+  //     let a = {
+  //       ...dk,
+  //       zt: 0,
+  //     };
+  //     zyys_data.value.point.push(a);
+  //   }
+  // });
+  // zyysCenter.forEach((center) => {
+  //   let pdK = true; //判断sj有没有对应地块，没有就赋值0
+  //   sj.forEach((item, index) => {
   //     if (item.committee == center.name) {
+  //       pdK = false;
   //       let b = {
   //         ...center,
   //         num: item.num,
@@ -3091,7 +3220,42 @@ const get_dk_zyys = async (sj, xd, ssly) => {
   //       zyys_data.value.center.push(b);
   //     }
   //   });
+  //   if (pdK) {
+  //     let b = {
+  //         ...center,
+  //         num: '',
+  //         town: center.jdname,
+  //         committee: center.name,
+  //         ssly: ssly,
+  //         xd: xd,
+  //       };
+  //       zyys_data.value.center.push(b);
+  //   }
   // });
+  sj.forEach((item, index) => {
+    zyysDk.forEach((dk) => {
+      if (item.committee == dk.name) {
+        let a = {
+          ...dk,
+          zt: item.zt,
+        };
+        zyys_data.value.point.push(a);
+      }
+    });
+    zyysCenter.forEach((center) => {
+      if (item.committee == center.name) {
+        let b = {
+          ...center,
+          num: item.num,
+          town: item.town,
+          committee: item.committee,
+          ssly: ssly,
+          xd: xd,
+        };
+        zyys_data.value.center.push(b);
+      }
+    });
+  });
 };
 //资源要素(渲染地块)
 const xr_dk_center_zyys = async () => {
@@ -5005,7 +5169,9 @@ onMounted(async () => {
         font-size: 18px;
         border-radius: 5px;
       }
-
+      .Tsactive {
+        cursor: not-allowed;
+      }
       // .content_item:last-child {
       //   box-sizing: border-box;
       //   display: flex;
@@ -5200,7 +5366,9 @@ onMounted(async () => {
           font-size: 16px;
         }
       }
-
+      .Tsactive {
+        cursor: not-allowed;
+      }
       .wz {
         width: 150px;
       }
@@ -5590,6 +5758,10 @@ onMounted(async () => {
 .detail {
   z-index: 998;
 }
+//设置无法点击
+.Tsactive {
+  cursor: not-allowed;
+}
 </style>
 <style lang="scss" scoped>
 // 分页

src/view/table_gk/gk_jz.vue

@@ -9,7 +9,10 @@
           </div>
         </div>
         <eP3
-          :list="data.jsbgl"
+          :list1="data.gzf.fwsl"
+          :list2="data.gzf.rzsl"
+          :list3="data.gzf.bzxzlzf"
+          :year="data.gzf.year"
           v-if="showEchart"
           style="width: 95%; margin-top: 10px"
           @shuju="jsSj"
@@ -34,7 +37,7 @@
               {{ item }}
             </div>
           </div>
-          <eP2 :list="data.wfjw.list"></eP2>
+          <eP2 :list="data.wfjw.list" v-if="showEchart"></eP2>
         </div>
       </div>
     </div>
@@ -50,13 +53,13 @@
           <div class="shang_item">
             <div class="title" @click="openTable('物业小区')">物业小区</div>
             <div class="i">
-              <zwfw1 :list="data.fgl.list1" v-if="showEchart" />
+              <zwfw1 :list="data.fgl.wyxqsl" v-if="showEchart" />
             </div>
           </div>
           <div class="shang_item">
             <div class="title" @click="openTable('专业物业')">专业物业</div>
             <div class="i">
-              <zwfw2 :list="data.fgl.list2" v-if="showEchart" />
+              <zwfw2 :list="data.fgl.wyfgl" v-if="showEchart" />
             </div>
           </div>
         </div>
@@ -71,24 +74,20 @@
         </div>
         <div class="wlsq">
           <el-table
-            :data="data.tableData1"
+            :data="data.wlsq"
             style="width: 100%; height: 550px"
             class="table_border"
             :row-style="rowState"
             :header-cell-style="tableHeaderColor"
           >
             <el-table-column
-              prop="name"
+              prop="sqmc"
               label="社区名称"
               show-overflow-tooltip
             />
+            <el-table-column prop="dz" label="社区位置" show-overflow-tooltip />
             <el-table-column
-              prop="address"
+              prop="fgfw"
-              label="社区位置"
-              show-overflow-tooltip
-            />
-            <el-table-column
-              prop="text"
               label="社区材料"
               show-overflow-tooltip
             />
@@ -107,11 +106,11 @@
         </div>
         <div class="zzgc">
           <div class="zzgc_item">
-            <eP1></eP1>
+            <eP1 :list="data.zzzlts.bjl"></eP1>
             <div class="zzgc_item_title">按期办结率</div>
           </div>
           <div class="zzgc_item">
-            <eP4></eP4>
+            <eP4 :list="data.zzzlts.jccs"></eP4>
             <div class="zzgc_item_title">专项检查次数</div>
           </div>
         </div>
@@ -127,44 +126,50 @@
         <div class="phqgz">
           <div class="phqgz_title">
             <img src="@/assets/images/jz/sjx.png" alt="" />
-            <div class="phqgz_title_text">已改造：3300户</div>
+            <div class="phqgz_title_text">已改造：{{ data.phq.ygz }}户</div>
           </div>
           <el-table
-            :data="data.tableData2"
+            :data="data.phq.phqgzs"
             style="width: 100%; height: 480px"
             class="table-style"
             :row-style="rowState"
             :header-cell-style="tableHeaderColor"
-            
           >
             <el-table-column
-              prop="starttime"
+              prop="kgsj"
               label="开始时间"
               width="120"
               show-overflow-tooltip
             />
 
             <el-table-column
-              prop="endtime"
+              prop="jgsj"
               label="结束时间"
               width="120"
               show-overflow-tooltip
             />
             <el-table-column
-              prop="address"
+              prop="xmdz"
               label="地点"
               width="132"
               show-overflow-tooltip
             />
             <el-table-column
-              prop="title"
+              prop="xmmc"
               label="名称"
               width="132"
               show-overflow-tooltip
             />
-            <el-table-column prop="finish" label="详情" width="120" fixed="right">
+            <el-table-column
+              prop="finish"
+              label="详情"
+              width="120"
+              fixed="right"
+            >
               <template #default="scope">
-                <div @click="goDetail(scope.row)" style="cursor: pointer;">查看详情</div>
+                <div @click="goDetail(scope.row)" style="cursor: pointer">
+                  查看详情
+                </div>
               </template>
             </el-table-column>
           </el-table>
@@ -208,85 +213,50 @@ import Dialog from "../dialog/dialog.vue";
 import DialogEcTy from "../dialog/dialogEcTy.vue";
 import dialog_bzxzf from "../echarts_jz/dialog_bzxzf.vue";
 const data = reactive({
-  wfjw: {
+  gzf:{
-    list: [],
+    yaer:[],
+    list1:[],
+    list2:[],
+    list3:[],
   },
+  //覆盖率
   fgl: {
-    list1: {
+    wyfgl: {
-      finish: 60,
+      finish: 0,
       total: 100,
-      percent: 60,
+      percent: 0,
     },
-    list2: {
+    wyxqsl: {
-      finish: "40",
+      finish: 0,
-      total: "100",
+      total: 100,
-      percent: "40",
+      percent: 0,
     },
-  }, //覆盖率
+  },
-  tableData1: [
+  //住宅工程
-    {
+  zzzlts: {
-      name: "金隅智慧园",
+    bjl: 0,
-      address: "金隅智慧园",
+    jccs: 0,
-      text: "金隅智慧园疫情防控演练",
+  },
-    },
+  //未来社区
-    {
+  wlsq: [],
-      name: "金隅智慧园",
+  //棚户区改造
-      address: "金隅智慧园",
+  phq: {
-      text: "金隅智慧园疫情防控演练",
+    ygz: 0,
-    },
+    phqgzs: [],
-    {
+  },
-      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: "城镇",
+    城镇: [
+      { name: "已解危数", value: 0 },
+      { name: "已腾空解危数", value: 0 },
+    ],
+    农村: [
+      { name: "已解危数", value: 0 },
+      { name: "已腾空解危数", value: 0 },
+    ],
+    list: [],
   },
   //保障型住房
 
@@ -308,14 +278,6 @@ const data = reactive({
     { name: "大街乡", num: 15 },
   ],
 });
-const wfjwsj_cz = [
-  { name: "已解危数", value: 150 },
-  { name: "已腾空解危数", value: 100 },
-];
-const wfjwsj_nc = [
-  { name: "已解危数", value: 250 },
-  { name: "已腾空解危数", value: 100 },
-];
 // 表格样式
 const tableHeaderColor = (arg) => {
   return {
@@ -425,31 +387,44 @@ const jsSj = (name, index) => {
 const showEchart = ref(false);
 const chooseWfjw = (val) => {
   data.wfjw.choose = val;
-  if (val == "城镇") {
+  data.wfjw.list=data.wfjw[val];
-    data.wfjw.list = wfjwsj_cz;
+  console.log(data.wfjw.list);
-  } else if (val == "农村") {
-    data.wfjw.list = wfjwsj_nc;
-  }
 };
 //查看详情
 const goDetail = () => {};
+//获取数据
 const getData = async () => {
-  showEchart.value = true;
+  await http.get("/api/ggfwyth/zysjOverview").then((res) => {
-  data.wfjw.list = wfjwsj_cz;
+    if (res.code == 200) {
-  // await http.get("/api/ggfwyth/health").then((res) => {
+      //公租房
-  //   if (res.code == 200) {
+      data.gzf.year=res.data.gzf.year;
-  //     data.medicalInsurance = res.data.medicalInsurance;
+      data.gzf.fwsl=res.data.gzf.fwsl;
-  //     data.lmb = res.data.lmb;
+      data.gzf.rzsl=res.data.gzf.rzsl;
-  //     data.mz = res.data.mz;
+      data.gzf.bzxzlzf=res.data.gzf.bzxzlzf;
-  //     // data.jkda = res.data.jkda;
+      //危房解危
-  //     data.jsbgl = res.data.jsbgl;
+      data.wfjw["城镇"][0].value = res.data.wfjw.cz.yjws;
-  //     data.fyglrs = res.data.fyglrs;
+      data.wfjw["城镇"][1].value = res.data.wfjw.cz.tkjws;
-  //     data.jktj = res.data.jktj;
+      data.wfjw["农村"][0].value = res.data.wfjw.nc.yjws;
-  //     data.jkhd = res.data.jkhd;
+      data.wfjw["农村"][1].value = res.data.wfjw.nc.tkjws;
-  //     data.lxbx = res.data.lxbx;
+      data.wfjw.list=data.wfjw["城镇"];
+      //覆盖率
+      data.fgl.wyfgl.finish = res.data.fgl.wyfgl;
+      data.fgl.wyfgl.percent = res.data.fgl.wyfgl;
+      data.fgl.wyxqsl.finish = res.data.fgl.wyxqsl;
+      data.fgl.wyxqsl.percent = res.data.fgl.wyxqsl;
+      //未来社区
+      data.wlsq = res.data.wlsq;
+      //住宅工程质量提升
+      data.zzzlts.bjl = res.data.zzzlts.bjl;
+      data.zzzlts.jccs = res.data.zzzlts.jccs;
+      //棚户区改造
+      data.phq.ygz = res.data.phq.ygz;
+      data.phq.phqgzs = res.data.phq.phqgzs;
 
-  //   }
+      //
-  // });
+      showEchart.value = true;
+    }
+  });
 };
 
 onBeforeMount(async () => {
@@ -880,7 +855,7 @@ onMounted(() => {});
 }
 </style>
 <style scoped>
-   .table-style >>> .el-table__body tr:hover > td {
+.table-style >>> .el-table__body tr:hover > td {
-      background-color: #2f4b74!important;
+  background-color: #2f4b74 !important;
-    }
+}
 </style>