1

src/utils/app-ecahrts.js

@@ -112,7 +112,7 @@ export const eleCake = {
 //不同综合风险等级货物分布比例----饼图
 export const pillar = {
   tooltip: {
-    trigger: 'item'
+    trigger: 'item',
   },
 
   title: {
@@ -173,7 +173,13 @@ export const pillar = {
       avoidLabelOverlap: false,
       itemStyle: {
         normal: {
-          color: '#383C54'
+          color: '#383C54',
+          // label: {
+          //   show: true,
+          //   formatter: function (a, b, c) {
+          //     return a.data + "%";
+          //   }
+          // }
         }
       },
       label: {

src/views/securityCheck/components/graphicHome.vue

@@ -39,6 +39,9 @@ export default {
       pillar.title.subtext = this.texter.kaer
         ? this.texter.cont + "%"
         : this.texter.cont;
+      pillar.tooltip.formatter = this.texter.formatter
+        ? this.texter.formatter
+        : "";
       pillar.title.top = this.texter.top;
       pillar.series[0].color = this.texter.color;
       pillar.series[0].name = this.texter.name2;

src/views/securityCheck/views/cargoCharts.vue

@@ -19,17 +19,23 @@
         <p>不同综合风险等级货物分布比例</p>
       </div>
       <div class="content_classification">
-        <div class="chart"><GraphicEchart :texter="dataall" /></div>
-        <div class="chart"><GraphicEchart :texter="datarisk" /></div>
         <div class="chart">
-          <GraphicEchart :texter="dataLowrisk" />
+          <GraphicEchart :texter="dataall" @echar="echar" />
         </div>
-        <div class="chart"><GraphicEchart :texter="datafirst" /></div>
         <div class="chart">
-          <GraphicEchart :texter="dataordinary" />
+          <GraphicEchart :texter="datarisk" @echar="echar" />
         </div>
         <div class="chart">
-          <GraphicEchart :texter="datastrictly" />
+          <GraphicEchart :texter="dataLowrisk" @echar="echar" />
+        </div>
+        <div class="chart">
+          <GraphicEchart :texter="datafirst" @echar="echar" />
+        </div>
+        <div class="chart">
+          <GraphicEchart :texter="dataordinary" @echar="echar" />
+        </div>
+        <div class="chart">
+          <GraphicEchart :texter="datastrictly" @echar="echar" />
         </div>
       </div>
     </div>
@@ -44,6 +50,7 @@ import { agent } from "@/api/statistics/statistics.js";
 export default {
   data() {
     return {
+      queryData: {},
       dataall: {
         id: 7,
         name: "总件数",
@@ -67,6 +74,7 @@ export default {
       datarisk: {
         id: 8,
         kaer: 1,
+        formatter: "{c}%",
         name: "高风险",
         cont: "70%",
         top: "35%",
@@ -87,6 +95,7 @@ export default {
       },
       dataLowrisk: {
         id: 9,
+        formatter: "{c}%",
         kaer: 1,
         name: "低风险",
         cont: "70%",
@@ -109,6 +118,7 @@ export default {
       datafirst: {
         id: 10,
         kaer: 1,
+        formatter: "{c}%",
         name: "优先级",
         cont: "10%",
         top: "35%",
@@ -130,6 +140,7 @@ export default {
       dataordinary: {
         id: 11,
         kaer: 1,
+        formatter: "{c}%",
         name: "普通级",
         cont: "10%",
         top: "35%",
@@ -151,6 +162,7 @@ export default {
       datastrictly: {
         id: 12,
         kaer: 1,
+        formatter: "{c}%",
         name: "严控级",
         cont: "10%",
         top: "35%",
@@ -179,10 +191,22 @@ export default {
     // this.init();
   },
   methods: {
-    //默认查询条件
     search(data) {
+      this.queryData = {
+        startTime: data[0][0],
+        endTime: data[0][1],
+        riskRating: data[1],
+        agentCode: data[2],
+      };
       this.relationDate(data);
     },
+    //点击跳转
+    echar() {
+      this.$router.push({
+        path: "/waybillTable",
+        query: this.queryData,
+      });
+    },
     //货物关联统计接口
     async relationDate(data) {
       try {
@@ -302,7 +326,6 @@ export default {
             },
           ];
         }
-        console.log(result);
       } catch (error) {
         console.log(error);
       }
@@ -324,6 +347,9 @@ export default {
       window.onresize = () => {
         myChart.resize();
       };
+      myChart.on("click", (a, b) => {
+        this.echar();
+      });
     },
   },
 };