1

src/views/securityCheck/components/graphicHome.vue

@@ -15,20 +15,21 @@ export default {
       type: Object,
     },
   },
-  watch:{
-    "texter":function(val){
-      if(val){
-        this.init();
-      }
-    }
-  },
+  // watch:{
+  //   "texter":function(val){
+  //     if(val){
+  //       alert(val)
+  //       this.init();
+  //     }
+  //   }
+  // },
   data() {
     return {};
   },
   mounted() {
-    if (this.texter) {
-      this.init();
-    }
+    // if (this.texter) {
+    //   this.init();
+    // }
   },
   methods: {
     init() {
@@ -51,6 +52,9 @@ export default {
       if (this.texter.data) {
         pillar.series[0].data = this.texter.data;
       }
+      if(this.texter.legend){
+        pillar.legend = this.texter.legend
+      }
       myChart.setOption(pillar);
       window.onresize = () => {
         myChart.resize();

src/views/securityCheck/views/cargoStatisticsHome.vue

@@ -17,7 +17,7 @@
             </div>
             <div class="chart_cont">
               <div class="chart_left">
-                <GraphicEchart :id="7" :texter="dataall" />
+                <GraphicEchart :id="7" :texter="dataall" ref="chart"/>
               </div>
               <div class="chart_right">
                 <div class="child">
@@ -396,6 +396,42 @@ export default {
           color: "#ffffff",
         },
         color: ["#9B73B4", "#66ACD4", "#85C997", "#F1B172", "#E86E5A"],
+        legend: {
+          left: "10%",
+          top: "35%",
+          align: "left",
+          itemGap: 18,
+          itemWidth: 20,
+          itemHeight: 20,
+          shadowBlur: 10,
+          shadowOffsetY: 0,
+          shadowOffsetX: 0,
+          borderColor: "#2a2a34",
+          borderWidth: 2,
+          textStyle: {
+            color: "#D8DDE3",
+            rich: {
+              name: {
+                verticalAlign: "right",
+                align: "left",
+                fontSize: 18,
+                color: "#D8DDE3",
+              },
+              percent: {
+                padding: [0, 0, 0, 10],
+                color: "#D8DDE3",
+                fontSize: 18,
+              },
+            },
+          },
+          formatter: (name) => {
+            const item = this.dataall.data.find((i) => {
+              return i.name === name;
+            });
+            const p = ((item.value / sum) * 100).toFixed(0);
+            return "{name|" + name + "}" + "{percent|" + p + "}" + " %";
+          },
+        }
       },
       dataLow: {
         name: "总件数",
@@ -434,11 +470,16 @@ export default {
       try {
         const result = await comprehensive({});
         let count = 0;
+        let arr = []
         //获取总件数：
         result.data.forEach((item) => {
           count += item.num;
+          let obj =  { value: item.num, name:item.risk}
+          arr.push(obj)
         });
         this.dataall.cont=count;
+        this.dataall.data=arr;
+        this.$refs.chart.init()
       } catch (error) {
         console.log(error);
       }