1

src/utils/app-ecahrts.js

@@ -55,6 +55,93 @@ export const eleCake = {
 
 //不同综合风险等级货物分布比例----饼图
 export const pillar = {
+  tooltip: {
+    trigger: 'item'
+  },
+
+  title: {
+    text: '主标题',
+    // 副标题
+    subtext: "50%",
+    // 主副标题间距
+    itemGap: 12,
+    x: 'center',
+    y: 'center',
+    top: '35%',
+    // 主标题样式
+    textStyle: {
+      fontSize: '16',
+      color: '#ffffff'
+    },
+    // itemStyle: {
+
+    //   normal: {
+    //     borderColor: 'red', //背景色
+    //   }
+    // },
+    // 副标题样式
+    subtextStyle: {
+      fontSize: '20',
+      fontWeight: '800',
+      color: '#ffffff'
+    }
+  },
+  series: [
+    {
+      name: 'Access From',
+      type: 'pie',
+      radius: ['60%', '90%'],
+      avoidLabelOverlap: false,
+      label: {
+        show: false,
+        position: 'center'
+      },
+      emphasis: {
+        label: {
+          show: false,
+          fontSize: '40',
+          fontWeight: 'bold'
+        }
+      },
+      labelLine: {
+        show: false
+      },
+      data: [
+      ]
+    },
+    {
+      name: '访问来源',
+      type: 'pie',
+      silent: 'ture',
+      radius: ['0%', '50%'],
+      avoidLabelOverlap: false,
+      itemStyle: {
+        normal: {
+          color: '#383C54'
+        }
+      },
+      label: {
+        show: false,
+        position: 'center'
+      },
+      // 自定义中心内容的话需要把这个关闭
+      emphasis: {
+        label: {
+          show: false,
+          fontSize: '30',
+          fontWeight: 'bold'
+        }
+      },
+      labelLine: {
+        show: false
+      },
+      data: [
+        { value: 100 },
+      ]
+    }
+  ],
+}
+export const pillars = {
   title: {
     text: '主标题',
     // 副标题

src/views/securityCheck/components/graphicHome.vue

@@ -1,41 +1,43 @@
 <template>
   <div class="echarts_cap">
-    <div :id="`chart_${id}`" style="height: 100%"></div>
+    <div :id="'echart' + texter.id" style="height: 100%" :key="texter.id"></div>
   </div>
 </template>
 <script>
 import { pillar } from "@/utils/app-ecahrts";
 export default {
   props: {
-    id: {
-      type: [String, Number],
-      default: 1,
-    },
     texter: {
       type: Object,
+      default: () => ({}),
     },
   },
   watch: {
-    texter: function (val) {
-      if (val) {
-        alert(val);
+    texter: {
+      handler(val) {
         this.init();
-      }
+      },
     },
   },
   data() {
     return {};
   },
-  // mounted() {
-  //   if (this.texter) {
-  //     this.init();
-  //   }
-  // },
+  created() {
+    // setTimeout(() => {
+    //   this.init();
+    // }, 2000);
+  },
+  mounted() {
+    setTimeout(() => {
+      this.init();
+    }, 4000);
+  },
   methods: {
     init() {
       let myChart = this.$echarts.init(
-        document.getElementById(`chart_${this.id}`)
-      ); //统计折线
+        document.getElementById("echart" + this.texter.id)
+      );
+      //统计折线
       pillar.series[0].data = this.texter.data;
       pillar.title.text = this.texter.name;
       pillar.title.subtext = this.texter.cont;
@@ -43,10 +45,12 @@ export default {
       pillar.series[0].color = this.texter.color;
       myChart.clear();
       myChart.setOption(pillar, true);
-      // myChart.setOption(pillar);
       window.onresize = () => {
         myChart.resize();
       };
+      myChart.on("click", (a, b) => {
+        this.$emit("echar");
+      });
     },
   },
 };

src/views/securityCheck/components/graphicHomecopy1.vue

@@ -0,0 +1,60 @@
+<template>
+  <div class="echarts_cap">
+    <div :id="`chart_${id}`" style="height: 100%"></div>
+  </div>
+</template>
+<script>
+import { pillars } from "@/utils/app-ecahrts";
+export default {
+  props: {
+    id: {
+      type: [String, Number],
+      default: 1,
+    },
+    texter: {
+      type: Object,
+    },
+  },
+  watch: {
+    texter: function (val) {
+      if (val) {
+        alert(val);
+        this.init();
+      }
+    },
+  },
+  data() {
+    return {};
+  },
+  // mounted() {
+  //   if (this.texter) {
+  //     this.init();
+  //   }
+  // },
+  methods: {
+    init() {
+      console.log(this.texter);
+      let myChart = this.$echarts.init(
+        document.getElementById(`chart_${this.id}`)
+      ); //统计折线
+      pillars.series[0].data = this.texter.data;
+      // pillars.title.text = this.texter.name;
+      // pillars.title.subtext = this.texter.cont;
+      // pillars.title.top = this.texter.top;
+      pillars.series[0].color = this.texter.color;
+      myChart.clear();
+      myChart.setOption(pillars, true);
+      // myChart.setOption(pillar);
+      window.onresize = () => {
+        myChart.resize();
+      };
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.echarts_cap {
+  width: 100%;
+  height: 100%;
+}
+</style>

src/views/securityCheck/views/cargoStatisticsHome.vue

@@ -6,6 +6,7 @@
         title="航空货物综合统计"
         @change="change"
         :withExportButton="false"
+        @search="search"
       />
     </div>
     <div class="comprehensive">
@@ -17,7 +18,7 @@
             </div>
             <div class="chart_cont">
               <div class="chart_left">
-                <GraphicEchart :id="7" :texter="dataall" ref="chart" />
+                <GraphicEchart :texter="dataall" ref="chart" @echar="echar" />
               </div>
               <div class="chart_right">
                 <div
@@ -34,46 +35,6 @@
                     <div class="child">占比：{{ item.proportion }}</div>
                   </div>
                 </div>
-                <!-- <div class="child">
-                  <div class="top">
-                    <div class="log"></div>
-                    <div class="name">低风险货物级</div>
-                  </div>
-                  <div class="boot">
-                    <div class="child">件数：100</div>
-                    <div class="child">占比：20%</div>
-                  </div>
-                </div>
-                <div class="child">
-                  <div class="top">
-                    <div class="log"></div>
-                    <div class="name">优先级</div>
-                  </div>
-                  <div class="boot">
-                    <div class="child">件数：100</div>
-                    <div class="child">占比：20%</div>
-                  </div>
-                </div>
-                <div class="child">
-                  <div class="top">
-                    <div class="log"></div>
-                    <div class="name">普通级</div>
-                  </div>
-                  <div class="boot">
-                    <div class="child">件数：100</div>
-                    <div class="child">占比：20%</div>
-                  </div>
-                </div>
-                <div class="child">
-                  <div class="top">
-                    <div class="log"></div>
-                    <div class="name">严控级</div>
-                  </div>
-                  <div class="boot">
-                    <div class="child">件数：100</div>
-                    <div class="child">占比：20%</div>
-                  </div>
-                </div> -->
               </div>
             </div>
           </div>
@@ -85,51 +46,35 @@
             </div>
             <div class="chart_cont">
               <div class="chart_left">
-                <GraphicEchart :id="8" :texter="dataLow" />
+                <GraphicEchart :texter="dataLow" @echar="echar" />
               </div>
               <div class="chart_right">
                 <div class="analysis">
                   <div class="analysis_cont">
                     <p>总件数</p>
-                    <span>100</span>
+                    <span>{{ dataLow.num }}</span>
                   </div>
                   <div class="analysis_cont">
                     <p>开包数</p>
-                    <span>10</span>
+                    <span>{{ dataLow.kxsNum }}</span>
                   </div>
                   <div class="analysis_cont">
                     <p>开包率</p>
-                    <span>10%</span>
+                    <span>{{ dataLow.proportion }}</span>
                   </div>
                 </div>
-                <div class="childcop">
-                  <div class="top">
-                    <div class="log"></div>
-                    <div class="name">移交</div>
-                  </div>
-                  <div class="boot">
-                    <div class="child">件数：100</div>
-                    <div class="child">占比：20%</div>
-                  </div>
-                </div>
-                <div class="childcop">
-                  <div class="top">
-                    <div class="log"></div>
-                    <div class="name">拒运</div>
-                  </div>
-                  <div class="boot">
-                    <div class="child">件数：100</div>
-                    <div class="child">占比：20%</div>
-                  </div>
-                </div>
-                <div class="childcop">
+                <div
+                  class="childcop"
+                  v-for="(item, index) in dataLow.data"
+                  :key="index"
+                >
                   <div class="top">
                     <div class="log"></div>
-                    <div class="name">放行</div>
+                    <div class="name">{{ item.name }}</div>
                   </div>
                   <div class="boot">
-                    <div class="child">件数：100</div>
-                    <div class="child">占比：20%</div>
+                    <div class="child">件数：{{ item.value }}</div>
+                    <div class="child">占比：{{ item.prot }}</div>
                   </div>
                 </div>
               </div>
@@ -143,51 +88,35 @@
             </div>
             <div class="chart_cont">
               <div class="chart_left">
-                <GraphicEchart :id="9" :texter="dataLow" />
+                <GraphicEchart :texter="dataLowcp" @echar="echar" />
               </div>
               <div class="chart_right">
                 <div class="analysis">
                   <div class="analysis_cont">
                     <p>总件数</p>
-                    <span>100</span>
+                    <span>{{ dataLowcp.num }}</span>
                   </div>
                   <div class="analysis_cont">
                     <p>开包数</p>
-                    <span>10</span>
+                    <span>{{ dataLowcp.kxsNum }}</span>
                   </div>
                   <div class="analysis_cont">
                     <p>开包率</p>
-                    <span>10%</span>
-                  </div>
-                </div>
-                <div class="childcop">
-                  <div class="top">
-                    <div class="log"></div>
-                    <div class="name">移交</div>
-                  </div>
-                  <div class="boot">
-                    <div class="child">件数：100</div>
-                    <div class="child">占比：20%</div>
-                  </div>
-                </div>
-                <div class="childcop">
-                  <div class="top">
-                    <div class="log"></div>
-                    <div class="name">拒运</div>
-                  </div>
-                  <div class="boot">
-                    <div class="child">件数：100</div>
-                    <div class="child">占比：20%</div>
+                    <span>{{ dataLowcp.proportion }}</span>
                   </div>
                 </div>
-                <div class="childcop">
+                <div
+                  class="childcop"
+                  v-for="(item, index) in dataLowcp.data"
+                  :key="index"
+                >
                   <div class="top">
                     <div class="log"></div>
-                    <div class="name">放行</div>
+                    <div class="name">{{ item.name }}</div>
                   </div>
                   <div class="boot">
-                    <div class="child">件数：100</div>
-                    <div class="child">占比：20%</div>
+                    <div class="child">件数：{{ item.value }}</div>
+                    <div class="child">占比：{{ item.prot }}</div>
                   </div>
                 </div>
               </div>
@@ -201,51 +130,35 @@
             </div>
             <div class="chart_cont">
               <div class="chart_left">
-                <GraphicEchart :id="10" :texter="dataLow" />
+                <GraphicEchart :texter="dataLowpt" @echar="echar" />
               </div>
               <div class="chart_right">
                 <div class="analysis">
                   <div class="analysis_cont">
                     <p>总件数</p>
-                    <span>100</span>
+                    <span>{{ dataLowpt.num }}</span>
                   </div>
                   <div class="analysis_cont">
                     <p>开包数</p>
-                    <span>10</span>
+                    <span>{{ dataLowpt.kxsNum }}</span>
                   </div>
                   <div class="analysis_cont">
                     <p>开包率</p>
-                    <span>10%</span>
-                  </div>
-                </div>
-                <div class="childcop">
-                  <div class="top">
-                    <div class="log"></div>
-                    <div class="name">移交</div>
-                  </div>
-                  <div class="boot">
-                    <div class="child">件数：100</div>
-                    <div class="child">占比：20%</div>
-                  </div>
-                </div>
-                <div class="childcop">
-                  <div class="top">
-                    <div class="log"></div>
-                    <div class="name">拒运</div>
-                  </div>
-                  <div class="boot">
-                    <div class="child">件数：100</div>
-                    <div class="child">占比：20%</div>
+                    <span>{{ dataLowpt.proportion }}</span>
                   </div>
                 </div>
-                <div class="childcop">
+                <div
+                  class="childcop"
+                  v-for="(item, index) in dataLowpt.data"
+                  :key="index"
+                >
                   <div class="top">
                     <div class="log"></div>
-                    <div class="name">放行</div>
+                    <div class="name">{{ item.name }}</div>
                   </div>
                   <div class="boot">
-                    <div class="child">件数：100</div>
-                    <div class="child">占比：20%</div>
+                    <div class="child">件数：{{ item.value }}</div>
+                    <div class="child">占比：{{ item.prot }}</div>
                   </div>
                 </div>
               </div>
@@ -259,51 +172,35 @@
             </div>
             <div class="chart_cont">
               <div class="chart_left">
-                <GraphicEchart :id="11" :texter="dataLow" />
+                <GraphicEchart :texter="dataLowyk" @echar="echar" />
               </div>
               <div class="chart_right">
                 <div class="analysis">
                   <div class="analysis_cont">
                     <p>总件数</p>
-                    <span>100</span>
+                    <span>{{ dataLowyk.num }}</span>
                   </div>
                   <div class="analysis_cont">
                     <p>开包数</p>
-                    <span>10</span>
+                    <span>{{ dataLowyk.kxsNum }}</span>
                   </div>
                   <div class="analysis_cont">
                     <p>开包率</p>
-                    <span>10%</span>
-                  </div>
-                </div>
-                <div class="childcop">
-                  <div class="top">
-                    <div class="log"></div>
-                    <div class="name">移交</div>
-                  </div>
-                  <div class="boot">
-                    <div class="child">件数：100</div>
-                    <div class="child">占比：20%</div>
+                    <span>{{ dataLowyk.proportion }}</span>
                   </div>
                 </div>
-                <div class="childcop">
-                  <div class="top">
-                    <div class="log"></div>
-                    <div class="name">拒运</div>
-                  </div>
-                  <div class="boot">
-                    <div class="child">件数：100</div>
-                    <div class="child">占比：20%</div>
-                  </div>
-                </div>
-                <div class="childcop">
+                <div
+                  class="childcop"
+                  v-for="(item, index) in dataLowyk.data"
+                  :key="index"
+                >
                   <div class="top">
                     <div class="log"></div>
-                    <div class="name">放行</div>
+                    <div class="name">{{ item.name }}</div>
                   </div>
                   <div class="boot">
-                    <div class="child">件数：100</div>
-                    <div class="child">占比：20%</div>
+                    <div class="child">件数：{{ item.value }}</div>
+                    <div class="child">占比：{{ item.prot }}</div>
                   </div>
                 </div>
               </div>
@@ -317,51 +214,35 @@
             </div>
             <div class="chart_cont">
               <div class="chart_left">
-                <GraphicEchart :id="12" :texter="dataLow" />
+                <GraphicEchart :texter="dataLowgf" @echar="echar" />
               </div>
               <div class="chart_right">
                 <div class="analysis">
                   <div class="analysis_cont">
                     <p>总件数</p>
-                    <span>100</span>
+                    <span>{{ dataLowgf.num }}</span>
                   </div>
                   <div class="analysis_cont">
                     <p>开包数</p>
-                    <span>10</span>
+                    <span>{{ dataLowgf.kxsNum }}</span>
                   </div>
                   <div class="analysis_cont">
                     <p>开包率</p>
-                    <span>10%</span>
-                  </div>
-                </div>
-                <div class="childcop">
-                  <div class="top">
-                    <div class="log"></div>
-                    <div class="name">移交</div>
-                  </div>
-                  <div class="boot">
-                    <div class="child">件数：100</div>
-                    <div class="child">占比：20%</div>
-                  </div>
-                </div>
-                <div class="childcop">
-                  <div class="top">
-                    <div class="log"></div>
-                    <div class="name">拒运</div>
-                  </div>
-                  <div class="boot">
-                    <div class="child">件数：100</div>
-                    <div class="child">占比：20%</div>
+                    <span>{{ dataLowgf.proportion }}</span>
                   </div>
                 </div>
-                <div class="childcop">
+                <div
+                  class="childcop"
+                  v-for="(item, index) in dataLowgf.data"
+                  :key="index"
+                >
                   <div class="top">
                     <div class="log"></div>
-                    <div class="name">放行</div>
+                    <div class="name">{{ item.name }}</div>
                   </div>
                   <div class="boot">
-                    <div class="child">件数：100</div>
-                    <div class="child">占比：20%</div>
+                    <div class="child">件数：{{ item.value }}</div>
+                    <div class="child">占比：{{ item.prot }}</div>
                   </div>
                 </div>
               </div>
@@ -376,10 +257,12 @@
 import GraphicEchart from "../components/graphicHome.vue";
 import SecurityCheckHeader from "../components/securityCheckHeader.vue";
 import { comprehensive } from "@/api/statistics/statistics.js";
+import { number } from "echarts";
 export default {
   data() {
     return {
       dataall: {
+        id: 1,
         name: "总件数",
         cont: "",
         data: [
@@ -438,13 +321,78 @@ export default {
         },
       },
       dataLow: {
+        id: 2,
         name: "总件数",
         cont: "500",
-        data: [
-          { value: 335, name: "1" },
-          { value: 310, name: "2" },
-          { value: 310, name: "3" },
-        ],
+        data: [],
+        top: "41%",
+        textStyle: {
+          fontSize: "20",
+          color: "#ffffff",
+        },
+        subtextStyle: {
+          fontSize: "36",
+          fontWeight: "800",
+          color: "#ffffff",
+        },
+        color: ["#6161BD", "#FAD153", "#DC5594"],
+      },
+      dataLowcp: {
+        id: 3,
+        name: "总件数",
+        cont: "500",
+        data: [],
+        top: "41%",
+        textStyle: {
+          fontSize: "20",
+          color: "#ffffff",
+        },
+        subtextStyle: {
+          fontSize: "36",
+          fontWeight: "800",
+          color: "#ffffff",
+        },
+        color: ["#6161BD", "#FAD153", "#DC5594"],
+      },
+      dataLowpt: {
+        id: 4,
+        name: "总件数",
+        cont: "500",
+        data: [],
+        top: "41%",
+        textStyle: {
+          fontSize: "20",
+          color: "#ffffff",
+        },
+        subtextStyle: {
+          fontSize: "36",
+          fontWeight: "800",
+          color: "#ffffff",
+        },
+        color: ["#6161BD", "#FAD153", "#DC5594"],
+      },
+      dataLowyk: {
+        id: 5,
+        name: "总件数",
+        cont: "500",
+        data: [],
+        top: "41%",
+        textStyle: {
+          fontSize: "20",
+          color: "#ffffff",
+        },
+        subtextStyle: {
+          fontSize: "36",
+          fontWeight: "800",
+          color: "#ffffff",
+        },
+        color: ["#6161BD", "#FAD153", "#DC5594"],
+      },
+      dataLowgf: {
+        id: 6,
+        name: "总件数",
+        cont: "500",
+        data: [],
         top: "38%",
         textStyle: {
           fontSize: "20",
@@ -457,6 +405,7 @@ export default {
         },
         color: ["#6161BD", "#FAD153", "#DC5594"],
       },
+      queryData: {},
     };
   },
   components: {
@@ -467,6 +416,21 @@ export default {
     this.getData();
   },
   methods: {
+    search(data) {
+      this.queryData = {
+        startTime: data[0][0],
+        endTime: data[0][1],
+        riskRating: data[1],
+        agentCode: data[2],
+      };
+    },
+    //点击跳转
+    echar() {
+      this.$router.push({
+        path: "/waybillTable",
+        query: this.queryData,
+      });
+    },
     change() {
       this.$router.push("./cargoTable");
     },
@@ -504,7 +468,148 @@ export default {
           element.proportion = element.value / counts;
           element.proportion = element.proportion.toFixed(2) * 100 + "%";
         });
+        result.data.forEach((res) => {
+          if (res.risk == "低风险") {
+            let arr = res.yjNum + res.jyNum + res.fxNum;
+            this.dataLow.data = [
+              {
+                name: "移交",
+                value: res.yjNum,
+                prot:
+                  arr == 0 ? "0%" : (res.yjNum / arr.toFixed(2)) * 100 + "%",
+              },
+              {
+                name: "拒运",
+                value: res.jyNum,
+                prot:
+                  arr == 0 ? "0%" : (res.jyNum / arr.toFixed(2)) * 100 + "%",
+              },
+              {
+                name: "放行",
+                value: res.fxNum,
+                prot:
+                  arr == 0 ? "0%" : (res.fxNum / arr.toFixed(2)) * 100 + "%",
+              },
+            ];
+            this.dataLow.color = ["#FAD153", "#DC5594", "#6161BD"];
+            this.dataLow.num = res.num;
+            this.dataLow.kxsNum = res.kxsNum;
+            this.dataLow.proportion =
+              (res.kxsNum / res.num).toFixed(2) * 100 + "%";
+          } else if (res.risk == "优先") {
+            let arr = res.yjNum + res.jyNum + res.fxNum;
+            this.dataLowcp.data = [
+              {
+                name: "移交",
+                value: res.yjNum,
+                prot:
+                  arr == 0 ? "0%" : (res.yjNum / arr).toFixed(2) * 100 + "%",
+              },
+              {
+                name: "拒运",
+                value: res.jyNum,
+                prot:
+                  arr == 0 ? "0%" : (res.jyNum / arr).toFixed(2) * 100 + "%",
+              },
+              {
+                name: "放行",
+                value: res.fxNum,
+                prot:
+                  arr == 0 ? "0%" : (res.fxNum / arr).toFixed(2) * 100 + "%",
+              },
+            ];
+            this.dataLowcp.color = ["#FAD153", "#DC5594", "#6161BD"];
+            this.dataLowcp.num = res.num;
+            this.dataLowcp.kxsNum = res.kxsNum;
+            this.dataLowcp.proportion =
+              (res.kxsNum / res.num).toFixed(2) * 100 + "%";
+          } else if (res.risk == "普通") {
+            let arr = res.yjNum + res.jyNum + res.fxNum;
+            this.dataLowpt.data = [
+              {
+                name: "移交",
+                value: res.yjNum,
+                prot:
+                  arr == 0 ? "0%" : (res.yjNum / arr).toFixed(2) * 100 + "%",
+              },
+              {
+                name: "拒运",
+                value: res.jyNum,
+                prot:
+                  arr == 0 ? "0%" : (res.jyNum / arr).toFixed(2) * 100 + "%",
+              },
+              {
+                name: "放行",
+                value: res.fxNum,
+                prot:
+                  arr == 0 ? "0%" : (res.fxNum / arr).toFixed(2) * 100 + "%",
+              },
+            ];
+            this.dataLowpt.color = ["#FAD153", "#DC5594", "#6161BD"];
+            this.dataLowpt.num = res.num;
+            this.dataLowpt.kxsNum = res.kxsNum;
+            this.dataLowpt.proportion =
+              (res.kxsNum / res.num).toFixed(2) * 100 + "%";
+          } else if (res.risk == "严控") {
+            let arr = res.yjNum + res.jyNum + res.fxNum;
+            this.dataLowyk.data = [
+              {
+                name: "移交",
+                value: res.yjNum,
+                prot:
+                  arr == 0 ? "0%" : (res.yjNum / arr).toFixed(2) * 100 + "%",
+              },
+              {
+                name: "拒运",
+                value: res.jyNum,
+                prot:
+                  arr == 0 ? "0%" : (res.jyNum / arr).toFixed(2) * 100 + "%",
+              },
+              {
+                name: "放行",
+                value: res.fxNum,
+                prot:
+                  arr == 0 ? "0%" : (res.fxNum / arr).toFixed(2) * 100 + "%",
+              },
+            ];
+            this.dataLowyk.color = ["#FAD153", "#DC5594", "#6161BD"];
+            this.dataLowyk.num = res.num;
+            this.dataLowyk.kxsNum = res.kxsNum;
+            this.dataLowyk.proportion =
+              (res.kxsNum / res.num).toFixed(2) * 100 + "%";
+          } else if (res.risk == "高风险") {
+            let arr = res.yjNum + res.jyNum + res.fxNum;
+            this.dataLowgf.data = [
+              {
+                name: "移交",
+                value: res.yjNum,
+                prot:
+                  arr == 0 ? "0%" : (res.yjNum / arr).toFixed(2) * 100 + "%",
+              },
+              {
+                name: "拒运",
+                value: res.jyNum,
+                prot:
+                  arr == 0
+                    ? "0%"
+                    : Math.floor((res.jyNum / arr).toFixed(2) * 100) + "%",
+              },
+              {
+                name: "放行",
+                value: res.fxNum,
+                prot:
+                  arr == 0 ? "0%" : (res.fxNum / arr).toFixed(2) * 100 + "%",
+              },
+            ];
+            this.dataLowgf.color = ["#FAD153", "#DC5594", "#6161BD"];
+            this.dataLowgf.num = res.num;
+            this.dataLowgf.kxsNum = res.kxsNum;
+            this.dataLowgf.proportion =
+              (res.kxsNum / res.num).toFixed(2) * 100 + "%";
+          }
+        });
         console.log(result.data, "11");
+        console.log(this.dataLowgf.data, "222");
         this.$refs.chart.init();
       } catch (error) {
         console.log(error);
@@ -547,7 +652,8 @@ export default {
   > .chart_right {
     width: 45%;
     height: 100%;
-    padding-right: 10%;
+    // padding-right: 10%;
+    padding-left: 1%;
     > .analysis {
       width: 100%;
       height: 60px;
@@ -557,7 +663,7 @@ export default {
       margin-bottom: 10px;
       margin-top: 20px;
       > .analysis_cont {
-        width: 30%;
+        // width: 30%;
         height: 100%;
         > p {
           font-size: 14px;