gx

src/components/header.vue

@@ -131,18 +131,14 @@ const data = reactive({
     },
   ],
   urlLeft: [
-    {
-      name: "评估模型",
-      url: "/home/index/table",
-    },
-    {
-      name: "要素一张图",
-      url: "/home/index/map",
-    },
     {
       name: "总体概览",
       url: "/home/index",
     },
+    {
+      name: "评估模型",
+      url: "/home/index/table",
+    },
     // {
     //   name: "养老",
     //   url: "/home/yl",
@@ -159,6 +155,10 @@ const data = reactive({
     //   name: "救助",
     //   url: "/home/work",
     // },
+    {
+      name: "要素一张图",
+      url: "/home/index/map",
+    },
     {
       name: "智能分析",
       url: "/home/analyze",

src/view/echart_analyze/dialog_jjlxfb.vue

@@ -35,31 +35,38 @@ const colors = [
   },
 ];
 const maxList = ref([
-  190, 190, 190, 190, 190, 190, 190, 190, 190, 190, 190, 190, 190, 190, 190,
+  18000, 18000, 18000, 18000, 18000, 18000, 18000, 18000, 18000, 18000, 18000,
+  18000, 18000, 18000, 18000,
 ]);
 // const valueList = [20, 53, 47, 65, 29, 11, 10];
 const data = reactive({
   list: [],
   option: {},
-  Max: 200,
+  Max: 20000,
-  valueList: [20, 53, 47, 65, 29, 11, 10, 20, 53, 47, 65, 29, 11, 10, 30],
+  valueList: [
-  valueList2: [120, 153, 47, 65, 29, 11, 10, 20, 53, 47, 65, 29, 11, 10, 30],
+    4504, 16086, 6130, 2844, 4967, 179, 1685, 5010, 633, 569, 219, 5152, 40,
+    631, 536,
+  ],
+  valueList2: [
+    1181, 2177, 3720, 3711, 4642, 1654, 3395, 5552, 2651, 3468, 5078, 1944,
+    1959, 4593, 3823,
+  ],
   xxname: [
+    "龙洲街道",
     "东华街道",
-    "大街乡",
+    "湖镇镇",
-    "塔石镇",
     "小南海镇",
-    "模环乡",
+    "溪口镇",
     "横山镇",
-    "沐尘畲族乡",
+    "塔石镇",
-    "石佛乡",
+    "詹家镇",
     "罗家乡",
     "庙下乡",
-    "溪口镇",
+    "沐尘畲族乡",
+    "模环乡",
+    "石佛乡",
     "社阳乡",
-    "詹家镇",
+    "大街乡",
-    "龙洲街道",
-    "湖镇镇",
   ],
 });
 // 注册5个面图形:左侧、前面、右面、上面、下面
@@ -294,7 +301,7 @@ const getOption = () => {
     },
     tooltip: {
       trigger: "axis",
-      //   formatter: "{b0}:{c1}",
+        formatter: "{b0}:</br>{a0}:{c0}</br>{a1}:{c1}",
     },
     grid: {
       left: 0,
@@ -630,6 +637,45 @@ const getOption = () => {
         },
         data: data.valueList2,
       },
+      //顶部字体
+      {
+        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.valueList.map((item) => parseInt(item) + 5),
+        barWidth: 20,
+      },
+      {
+        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,
+      },
     ],
   };
 };

src/view/echarts_yl/table_pie.vue

@@ -0,0 +1,272 @@
+<template>
+  <div ref="chart" style="width: 100%; height: 260px"></div>
+</template>
+
+<script setup>
+import { onBeforeMount, reactive, defineProps, ref, nextTick } from "vue";
+// 局部引入echarts核心模块
+import * as echarts from "echarts";
+
+const chart = ref(); // 创建DOM引用
+
+const props = defineProps({
+  list1: {
+    type: Array,
+    default: () => {
+      return [];
+    },
+  },
+  list2: {
+    type: Array,
+    default: () => {
+      return [];
+    },
+  },
+  year: {
+    type: Array,
+    default: () => {
+      return [];
+    },
+  },
+});
+
+const data = reactive({
+  list1: [],
+  list2: [],
+  year: [],
+  option: {},
+});
+const getOption = () => {
+  data.option = {
+    tooltip: {
+      trigger: "axis",
+      formatter: "{b0}<br />{a1}:{c1} <br />{a3}:{c3} ",
+    },
+    legend: {
+      data: ["职工养老保险发放人次", "城乡养老保险发放人次"],
+      top: "8%",
+      right: "11%",
+      textStyle: {
+        fontSize: 16,
+        color: "#ffffff",
+      },
+    },
+    grid: {
+      left: "1%",
+      right: "10%",
+      bottom: "0%",
+      containLabel: true,
+    },
+    calculable: true,
+    xAxis: [
+      {
+        type: "category",
+        axisLabel: {
+          //坐标轴刻度标签的相关设置
+          textStyle: {
+            color: "#ffffff",
+            fontSize: 16,
+          },
+        },
+        data: data.year,
+      },
+      {
+        axisTick: false,
+        type: "category",
+        data: data.year,
+        axisLabel: {
+          show: false,
+        },
+      },
+    ],
+
+    yAxis: [
+      {
+        type: "value",
+        splitLine: {
+          show: true,
+          lineStyle: {
+            color: "rgba(226, 226, 226, 0.3)",
+            fontSize: 16,
+            width: 1,
+          },
+        },
+        axisLabel: {
+          //坐标轴刻度标签的相关设置
+          textStyle: {
+            color: "#ffffff",
+          },
+        },
+      },
+      {
+        type: "value",
+        splitLine: {
+          show: false,
+          lineStyle: {
+            type: "solid",
+            color: "rgb(221, 242, 255,0.1)",
+          },
+        },
+        axisLine: {
+          show: false,
+          lineStyle: {
+            type: "dotted",
+          },
+        },
+        axisLabel: {
+          show: false,
+          fontSize: 16,
+          fontFamily: "MicrosoftYaHei",
+          color: "#ffffff",
+          lineHeight: 19,
+        },
+      },
+    ],
+    series: [
+      {
+        z: 1,
+        name: "上部1",
+        type: "pictorialBar",
+        symbolPosition: "end",
+        data: data.list1,
+        symbol: "diamond",
+        symbolOffset: ["-60%", "-50%"],
+        symbolSize: [16, 8],
+        itemStyle: {
+          borderColor: "#2fffa4",
+          color: "rgba(142, 187, 255, 1)",
+        },
+      },
+      {
+        z: 1,
+        name: "职工养老保险发放人次",
+        type: "bar",
+        barGap: 0.3 /*多个并排柱子设置柱子之间的间距*/,
+        data: data.list1,
+        barWidth: "18%",
+        itemStyle: {
+          color: {
+            type: "linear",
+            x: 0,
+            x2: 1,
+            y: 0,
+            y2: 0,
+            colorStops: [
+              { offset: 0, color: "rgba(142, 187, 255, .7)" },
+              { offset: 0.5, color: "rgba(142, 187, 255, .7)" },
+              { offset: 0.5, color: "rgba(142, 187, 255, .3)" },
+              { offset: 1, color: "rgba(142, 187, 255, .5)" },
+            ],
+          },
+        },
+        // itemStyle: {
+        //   color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+        //     {
+        //       offset: 0,
+        //       color: "rgba(142, 187, 255, 1)",
+        //     },
+        //     {
+        //       offset: 1,
+        //       color: "rgba(142, 187, 255, 0.20)",
+        //     },
+        //   ]),
+        // },
+        label: {
+          show: true,
+          position: "top",
+          color: "#ffffff",
+          formatter: function (data) {
+            return data.value;
+          },
+        },
+      },
+      {
+        z: 2,
+        name: "上部1",
+        type: "pictorialBar",
+        symbolPosition: "end",
+        data: data.list2,
+        symbol: "diamond",
+        symbolOffset: ["62%", "-50%"],
+        symbolSize: [16, 8],
+        itemStyle: {
+          borderColor: "#32ffee",
+          color: "rgba(23, 237, 255, 1)",
+        },
+      },
+      {
+        name: "城乡养老保险发放人次",
+        type: "bar",
+        data: data.list2,
+        // barGap: "-50%",
+        barGap: 0.3 /*多个并排柱子设置柱子之间的间距*/,
+        barWidth: "18%",
+        itemStyle: {
+          color: {
+            type: "linear",
+            x: 0,
+            x2: 1,
+            y: 0,
+            y2: 0,
+            colorStops: [
+              { offset: 0, color: "rgba(23, 237, 255, .7)" },
+              { offset: 0.5, color: "rgba(23, 237, 255, .7)" },
+              { offset: 0.5, color: "rgba(23, 237, 255, .3)" },
+              { offset: 1, color: "rgba(23, 237, 255, .5)" },
+            ],
+          },
+        },
+        // itemStyle: {
+        //   color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+        //     {
+        //       offset: 0,
+        //       color: "rgba(23, 237, 255, 1)",
+        //     },
+        //     {
+        //       offset: 1,
+        //       color: "rgba(23, 237, 255, 0.20)",
+        //     },
+        //   ]),
+        // },
+        label: {
+          show: true,
+          position: "top",
+          color: "#ffffff",
+          formatter: function (data) {
+            return data.value;
+          },
+        },
+      },
+      {
+        type: "bar",
+        xAxisIndex: 1,
+        yAxisIndex: 1,
+        itemStyle: {
+          color: "rgba(221, 242, 255, 0.1)",
+        },
+        data: data.year.map(() => 100),
+        barWidth: 50,
+      },
+    ],
+  };
+};
+const setChart = () => {
+  // Vue3中： 需要引入
+  var myChart = echarts.init(chart.value);
+  // 使用刚指定的配置项和数据显示图表。
+  myChart.setOption(data.option);
+};
+
+// 使用生命钩子
+onBeforeMount(() => {
+  setTimeout(() => {
+    data.list1 = props.list1;
+    data.list2 = props.list2;
+    data.year = props.year;
+    getOption();
+    setChart();
+  }, 600);
+});
+</script>
+
+<style scoped></style>

src/view/person/index.vue

@@ -21,7 +21,8 @@
           <div class="my-info-item">
             <div class="my-info-label">证件号码</div>
             <div class="my-info-content">
-              <p>{{ baseInfo.identNo }}</p>
+              <p>******************</p>
+               <!-- <p>{{ baseInfo.identNo }}</p> -->
             </div>
           </div>
           <div class="my-info-item">
@@ -408,6 +409,17 @@ const getData = (nm, identNo) => {
             item.show = Number(res.data[item.jkName]);
           }
         });
+        if(res.data.yljlx){
+          data.value=[
+            {
+              type:res.data.yljlx,
+              date:res.data.yljffrq,
+              sum:res.data.yljffje
+            }
+          ]
+        }else{
+           data.value=[]
+        }
         // console.log(dataMyTag.myTag, 555);
       }
     });

src/view/sy_table.vue

@@ -36,9 +36,9 @@
         </div>
       </div>
     </div>
-    <div class="displayFlex right_bg">
+    <div class="displayFlex right_bg" v-if="gk">
       <div class="formText">
-        <div class="formText_top">
+        <div class="formText_top" v-if="show_7yx">
           <div class="yd_title left_1">
             <div class="animate-border">
               <i></i>
@@ -102,7 +102,7 @@
           </div>
         </div>
         <div class="formText_bootom">
-          <div class="yd_title left_2">
+          <div class="yd_title left_2" :style="{'margin-top': show_7yx ? '40px' : '0px'}">
             <div class="animate-border">
               <i></i>
               <i></i>
@@ -143,11 +143,15 @@
         </div>
       </div>
     </div>
+    <work v-if="gaikuangList.work"></work>
+    <education v-if="gaikuangList.education"></education>
+    <yl v-if="gaikuangList.yl"></yl>
+    <hygiene v-if="gaikuangList.hygiene"></hygiene>
   </div>
 </template>
 
 <script setup>
-import { ref, reactive, onMounted } from "vue";
+import { ref, reactive, onMounted, computed } from "vue";
 import icon1 from "@/assets/sy-table/sy-table9.png";
 import icon2 from "@/assets/sy-table/sy-table10.png";
 import icon3 from "@/assets/sy-table/sy-table11.png";
@@ -164,7 +168,10 @@ import Bj1 from "@/assets/sy-table/sy-table7.png";
 import Bj2 from "@/assets/sy-table/sy-table4.png";
 import Bj3 from "@/assets/sy-table/sy-table5.png";
 import Bj4 from "@/assets/sy-table/sy-table6.png";
-
+import work from "./table_gk/gk_work.vue";
+import education from "./table_gk/gk_education.vue";
+import yl from "./table_gk/gk_yl.vue";
+import hygiene from "./table_gk/gk_hygiene.vue";
 import { useRouter, useRoute } from "vue-router";
 import http from "@/utils/request.js";
 import { ElMessage } from "element-plus";
@@ -186,7 +193,7 @@ const goto = (url, val) => {
 
 const data = reactive({
   taps1: "6",
-  taps: "0",
+  taps: "1",
   tabPosition: [
     {
       id: "0",
@@ -216,18 +223,22 @@ const data = reactive({
       son: [
         {
           id: "0",
-          name: "学前教育助学服务",
+          name: "概况",
         },
         {
           id: "1",
-          name: "义务教育服务",
+          name: "学前教育助学服务",
         },
         {
           id: "2",
-          name: "普通高中助学服务",
+          name: "义务教育服务",
         },
         {
           id: "3",
+          name: "普通高中助学服务",
+        },
+        {
+          id: "4",
           name: "中等职业教育助学服务",
         },
       ],
@@ -256,14 +267,18 @@ const data = reactive({
       son: [
         {
           id: "0",
-          name: "公共卫生服务",
+          name: "概况",
         },
         {
           id: "1",
-          name: "医疗保险服务",
+          name: "公共卫生服务",
         },
         {
           id: "2",
+          name: "医疗保险服务",
+        },
+        {
+          id: "3",
           name: "计划生育扶助服务",
         },
       ],
@@ -276,10 +291,14 @@ const data = reactive({
       son: [
         {
           id: "0",
-          name: "养老助老服务",
+          name: "概况",
         },
         {
           id: "1",
+          name: "养老助老服务",
+        },
+        {
+          id: "2",
           name: "养老保险服务",
         },
       ],
@@ -308,14 +327,18 @@ const data = reactive({
       son: [
         {
           id: "0",
-          name: "社会救助服务",
+          name: "概况",
         },
         {
           id: "1",
-          name: "法律援助服务",
+          name: "社会救助服务",
         },
         {
           id: "2",
+          name: "法律援助服务",
+        },
+        {
+          id: "3",
           name: "扶残助残服务",
         },
       ],
@@ -462,13 +485,48 @@ const data = reactive({
   ],
   Bj: [Bj, Bj1, Bj2, Bj3, Bj4],
 });
+const gaikuangList = reactive({
+  work: false,
+  education: false,
+  yl: false,
+  hygiene: false,
+});
+//是否显示七优享
+const show_7yx=ref(true);
+const gk = computed(() => {
+  if (
+    gaikuangList.work ||
+    gaikuangList.hygiene ||
+    gaikuangList.education ||
+    gaikuangList.yl
+  ) {
+    return false;
+  } else {
+    return true;
+  }
+});
 
 const tapshow = (parentId, childId) => {
-  // console.log(parentId, childId, "菜单名");
+  console.log(parentId, childId, "菜单名");
   data.taps1 = parentId.id;
   data.taps = childId;
+  if (
+    childId == 0 &&
+    (parentId.name == "弱有所扶" ||
+      parentId.name == "学有所教" ||
+      parentId.name == "老有所养" ||
+      parentId.name == "病有所医")
+  ) {
+    gaikuang(parentId.name);
+  } else {
+    // gaikuangList.work = false;
+    // gaikuangList.education = false;
+    // gaikuangList.yl = false;
+    // gaikuangList.hygiene = false;
+      for (let name in gaikuangList) {
+      gaikuangList[name]=false;
+  }
     getData(parentId.name, parentId.son[childId].name);
-
     // 菜单名匹配
     const menuName = [
       "幼有善育",
@@ -483,7 +541,11 @@ const tapshow = (parentId, childId) => {
     const firstChar = parentId.name.charAt(0);
     const matchingMenu = menuName.find((name) => name.charAt(0) === firstChar);
     if (matchingMenu) {
+      show_7yx.value=true;
       sevenYX(matchingMenu);
+    }else{
+      show_7yx.value=false;
+    }
   }
 };
 const toggleVisibility = (val) => {
@@ -494,9 +556,25 @@ const toggleVisibility = (val) => {
       parent.visible = !parent.visible;
     }
   });
-  tapshow(val,0)
+  console.log(val);
-};
 
+  tapshow(val, 0);
+};
+const gaikuang = (name) => {
+  console.log(4444, name);
+  for (let name in gaikuangList) {
+      gaikuangList[name]=false;
+  }
+  if (name == "弱有所扶") {
+    gaikuangList.work = true;
+  } else if (name == "学有所教") {
+    gaikuangList.education = true;
+  } else if (name == "老有所养") {
+    gaikuangList.yl = true;
+  } else if (name == "病有所医") {
+    gaikuangList.hygiene = true;
+  }
+};
 // 服务表格样式
 const tableHeaderColor = (arg) => {
   return {
@@ -545,7 +623,8 @@ const getData = async (name, fullName) => {
               Bj: data.Bj[imageIndex],
               name: item.sx,
               text: item.bmfxqk,
-              progress: item.xh,
+              // progress: item.xh,
+              progress: '95',
             });
           });
         }
@@ -866,7 +945,7 @@ onMounted(() => {
   background-size: 100% 100%;
   // cursor: pointer;
   margin-bottom: 30px;
-  margin-top: 40px;
+  // margin-top: 40px;
 }
 </style>
 <style lang="scss" scoped>

vite.config.js

@@ -15,8 +15,8 @@ export default defineConfig({
       // 第一个代理
       "/api": {
         // 匹配到啥来进行方向代理
-        target: "http://10.0.0.65:8095/", //刘进
+        // target: "http://10.0.0.65:8095/", //刘进
-        // target: "http://220.191.238.50:996/", //线上
+        target: "http://220.191.238.50:996/", //线上
         changeOrigin: true, //是否支持跨域
         //rewrite: (path) => path.replace(/^\/api/, '') // 如果不需要api 直接把路径上的api 替换成空，这个
       },