1

src/view/echart_analyze/right2.vue

@@ -10,6 +10,7 @@ import * as echarts from "echarts";
 const chart = ref(); // 创建DOM引用
 
 const colors = [
+
   {
     left: "rgba(234, 162, 57, .16)",
     right: "rgba(234, 162, 57, .6)",
@@ -31,41 +32,7 @@ const colors = [
     bottom: "rgba(60, 143, 255, .46)",
     front: "rgba(60, 143, 255, .66)",
   },
-  {
+
-    left: "rgba(234, 162, 57, .16)",
-    right: "rgba(234, 162, 57, .6)",
-    top: "rgba(234, 162, 57, 1)",
-    bottom: "rgba(234, 162, 57, .46)",
-    front: "rgba(234, 162, 57, .66)",
-  },
-  {
-    left: "rgba(14, 252, 255, .16)",
-    right: "rgba(14, 252, 255, .6)",
-    top: "rgba(14, 252, 255, 1)",
-    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)",
-  },
-  {
-    left: "rgba(234, 162, 57, .16)",
-    right: "rgba(234, 162, 57, .6)",
-    top: "rgba(234, 162, 57, 1)",
-    bottom: "rgba(234, 162, 57, .46)",
-    front: "rgba(234, 162, 57, .66)",
-  },
-  {
-    left: "rgba(14, 252, 255, .16)",
-    right: "rgba(14, 252, 255, .6)",
-    top: "rgba(14, 252, 255, 1)",
-    bottom: "rgba(14, 252, 255,  .46)",
-    front: "rgba(14, 252, 255, .66)",
-  },
 ];
 const maxList = [90, 90, 90, 90, 90, 90, 90];
 const valueList = [20, 53, 47, 65, 29, 11, 50];
@@ -216,7 +183,8 @@ const option = {
         color: "#fff",
         fontSize: 16,
         formatter: function (value) {
-          return value.length > 2 ? value.slice(0, 2) + "..." : value;
+
+          return value.length > 3 ? value.slice(0, 2) + "..." : value;
         },
       },
     },
@@ -367,7 +335,7 @@ const option = {
                 xAxisPoint: api.coord([api.value(0), 0]),
               },
               style: {
-                fill: colors[params.dataIndexInside]["bottom"],
+                fill: colors[`${params.dataIndexInside % 3}`]["bottom"],
               },
             },
             {
@@ -381,7 +349,7 @@ const option = {
                 xAxisPoint: api.coord([api.value(0), 0]),
               },
               style: {
-                fill: colors[params.dataIndexInside]["left"],
+                fill: colors[`${params.dataIndexInside % 3}`]["left"],
               },
             },
             {
@@ -395,7 +363,7 @@ const option = {
                 xAxisPoint: api.coord([api.value(0), 0]),
               },
               style: {
-                fill: colors[params.dataIndexInside]["front"],
+                fill: colors[`${params.dataIndexInside % 3}`]["front"],
               },
             },
             {
@@ -409,7 +377,7 @@ const option = {
                 xAxisPoint: api.coord([api.value(0), 0]),
               },
               style: {
-                fill: colors[params.dataIndexInside]["right"],
+                fill: colors[`${params.dataIndexInside % 3}`]["right"],
               },
             },
             {
@@ -423,7 +391,7 @@ const option = {
                 xAxisPoint: api.coord([api.value(0), 0]),
               },
               style: {
-                fill: colors[params.dataIndexInside]["top"],
+                fill: colors[`${params.dataIndexInside % 3}`]["top"],
               },
             },
           ],
@@ -442,7 +410,7 @@ const option = {
         position: "top",
         color: "#ffffff",
         formatter: function (data) {
-          return data.value;
+          return data.value -5;
         },
       },
       itemStyle: {

src/view/yl.vue

@@ -204,7 +204,7 @@
           <div
             class="history1"
             @click="
-              showDialog('居家养老服务照料中心', '/api/ggfwyth/yljgzlzxList')
+              showDialog('居家养老服务照料中心', '/api/ggfwyth/yljgzlzxList','num')
             "
           >
             <div>
@@ -364,6 +364,16 @@ const yl_column = ref([
     property: "rzlrsl",
   },
 ]);
+const yl_column2 = ref([
+  {
+    label: "机构名称",
+    property: "mc",
+  },
+  {
+    label: "机构地址",
+    property: "dz",
+  },
+]);
 // 表格分页
 const pagination = reactive({
   total: 100,
@@ -379,10 +389,15 @@ const chooseVillage = (village) => {
   tableType.url = "/api/ggfwyth/zcxxList";
   getTownDetail();
 };
-const showDialog = (title, url) => {
+const showDialog = (title, url,coulumn) => {
   tableType.title = title;
   tableType.url = url;
+  if(coulumn=='num'){
+    tableType.columns = yl_column2.value;
+  }else{
      tableType.columns = yl_column.value;
+  }
+ 
   getTable(url, pagination.currentPage);
 };
 //获取表格数据