1

src/api/statistics/statistics.js

@@ -52,4 +52,13 @@ export function emergency(query) {
     method: 'POST',
     data: query
   })
+}
+
+// 代理人
+export function emergencys(query) {
+  return request({
+    url: '/system/waybill/countinfo',
+    method: 'get',
+    data: query
+  })
 }

src/views/securityCheck/components/securityCheckHeader.vue

@@ -268,20 +268,20 @@ export default {
         this.search();
       },
     },
-    "formData.beginDate": {
-      handler(val, oldVal) {
-        if (oldVal) {
-          this.search();
-        }
-      },
-    },
-    "formData.endDate": {
-      handler(val, oldVal) {
-        if (oldVal) {
-          this.search();
-        }
-      },
-    },
+    // "formData.beginDate": {
+    //   handler(val, oldVal) {
+    //     if (oldVal) {
+    //       this.search();
+    //     }
+    //   },
+    // },
+    // "formData.endDate": {
+    //   handler(val, oldVal) {
+    //     if (oldVal) {
+    //       this.search();
+    //     }
+    //   },
+    // },
     selectOptions: {
       handler(val) {
         if (val.length) {

src/views/securityCheck/views/agentHome.vue

@@ -20,34 +20,20 @@
                 <GraphicEchart :texter="dataall" />
               </div>
               <div class="chart_right pt90">
-                <div class="child">
+                <div
+                  class="child"
+                  v-for="(item, index) in dataall.data"
+                  :key="index"
+                >
                   <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 class="log" :style="{ background: item.color }"></div>
+                    <div class="name" @click="echar">{{ item.name }}</div>
                   </div>
                   <div class="boot">
-                    <div class="child">件数：100</div>
-                    <div class="child">占比：20%</div>
+                    <div class="child" @click="echar">
+                      件数：{{ item.value }}
+                    </div>
+                    <div class="child">占比：{{ item.proportion }}</div>
                   </div>
                 </div>
               </div>
@@ -61,51 +47,37 @@
             </div>
             <div class="chart_cont">
               <div class="chart_left">
-                <GraphicEchart :id="2" :texter="dataLow" />
+                <GraphicEchart :texter="dataLowpt" />
               </div>
               <div class="chart_right">
                 <div class="analysis">
-                  <div class="analysis_cont">
+                  <div class="analysis_cont" @click="echar">
                     <p>总件数</p>
-                    <span>100</span>
+                    <span>{{ dataLowpt.num }}</span>
                   </div>
-                  <div class="analysis_cont">
+                  <div class="analysis_cont" @click="echar">
                     <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" @click="echar">
+                      件数：{{ item.value }}
+                    </div>
+                    <div class="child">占比：{{ item.prot }}</div>
                   </div>
                 </div>
               </div>
@@ -119,51 +91,37 @@
             </div>
             <div class="chart_cont">
               <div class="chart_left">
-                <GraphicEchart :id="3" :texter="dataLow" />
+                <GraphicEchart :texter="dataLow" />
               </div>
               <div class="chart_right">
                 <div class="analysis">
-                  <div class="analysis_cont">
+                  <div class="analysis_cont" @click="echar">
                     <p>总件数</p>
-                    <span>100</span>
+                    <span>{{ dataLow.num }}</span>
                   </div>
-                  <div class="analysis_cont">
+                  <div class="analysis_cont" @click="echar">
                     <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="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>
-                </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 class="child" @click="echar">
+                      件数：{{ item.value }}
+                    </div>
+                    <div class="child">占比：{{ item.prot }}</div>
                   </div>
                 </div>
               </div>
@@ -177,51 +135,37 @@
             </div>
             <div class="chart_cont">
               <div class="chart_left">
-                <GraphicEchart :id="4" :texter="dataLow" />
+                <GraphicEchart :texter="dataLowgf" />
               </div>
               <div class="chart_right">
                 <div class="analysis">
-                  <div class="analysis_cont">
+                  <div class="analysis_cont" @click="echar">
                     <p>总件数</p>
-                    <span>100</span>
+                    <span>{{ dataLowgf.num }}</span>
                   </div>
-                  <div class="analysis_cont">
+                  <div class="analysis_cont" @click="echar">
                     <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" @click="echar">
+                      件数：{{ item.value }}
+                    </div>
+                    <div class="child">占比：{{ item.prot }}</div>
                   </div>
                 </div>
               </div>
@@ -235,12 +179,13 @@
 <script>
 import GraphicEchart from "../components/graphicHome.vue";
 import SecurityCheckHeader from "../components/securityCheckHeader.vue";
-import { emergency } from "@/api/statistics/statistics.js";
+import { emergencys } from "@/api/statistics/statistics.js";
 export default {
   data() {
     return {
+      queryData: {},
       dataall: {
-        id: 13,
+        id: 20,
         name: "总件数",
         cont: "500",
         data: [
@@ -260,7 +205,50 @@ export default {
         },
         color: ["#66ACD4", "#F1B172", "#E86E5A"],
       },
+      dataLowpt: {
+        id: 21,
+        name: "总件数",
+        cont: "500",
+        data: [
+          { value: 335, name: "1" },
+          { value: 310, name: "2" },
+          { value: 310, name: "3" },
+        ],
+        top: "38%",
+        textStyle: {
+          fontSize: "20",
+          color: "#ffffff",
+        },
+        subtextStyle: {
+          fontSize: "36",
+          fontWeight: "800",
+          color: "#ffffff",
+        },
+        color: ["#6161BD", "#FAD153", "#DC5594"],
+      },
       dataLow: {
+        id: 22,
+        name: "总件数",
+        cont: "500",
+        data: [
+          { value: 335, name: "1" },
+          { value: 310, name: "2" },
+          { value: 310, name: "3" },
+        ],
+        top: "38%",
+        textStyle: {
+          fontSize: "20",
+          color: "#ffffff",
+        },
+        subtextStyle: {
+          fontSize: "36",
+          fontWeight: "800",
+          color: "#ffffff",
+        },
+        color: ["#6161BD", "#FAD153", "#DC5594"],
+      },
+      dataLowgf: {
+        id: 23,
         name: "总件数",
         cont: "500",
         data: [
@@ -286,12 +274,29 @@ export default {
     this.getData();
   },
   methods: {
+    search(data) {
+      this.queryData = {
+        startTime: data[0][0],
+        endTime: data[0][1],
+        riskRating: data[1],
+        agentCode: data[2],
+      };
+      this.getData();
+    },
+
+    //点击跳转
+    echar() {
+      this.$router.push({
+        path: "/waybillTable",
+        query: this.queryData,
+      });
+    },
     change() {
-      this.$router.push("./agentTable");
+      this.$router.push("");
     },
     async getData() {
       try {
-        const result = await emergency({});
+        const result = await emergencys(this.queryData);
         let count = 0;
         let counts = 0;
         let arr = [];
@@ -304,7 +309,200 @@ export default {
         this.dataall.cont = count;
         this.dataall.data = arr;
         this.dataall.color = [];
-        console.log(result);
+        this.dataall.data.forEach((element) => {
+          if (element.name == "高风险") {
+            element.color = "#E86E5A";
+          } else if (element.name == "严控") {
+            element.color = "#9B73B4";
+          } else if (element.name == "优先") {
+            element.color = "#85C997";
+          } else if (element.name == "低风险") {
+            element.color = "#F1B172";
+          } else if (element.name == "普通") {
+            element.color = "#66ACD4";
+          }
+          counts += element.value;
+          this.dataall.color.push(element.color);
+        });
+        this.dataall.data.forEach((element) => {
+          element.proportion = element.value / counts;
+          element.proportion =
+            Math.floor(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%"
+                    : Math.floor((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%"
+                    : Math.floor((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 =
+              Math.floor((res.kxsNum / res.num).toFixed(2) * 100) + "%";
+            this.dataLow.cont = arr;
+          } else if (res.risk == "优先") {
+            let arr = res.yjNum + res.jyNum + res.fxNum;
+            this.dataLowcp.data = [
+              {
+                name: "移交",
+                value: res.yjNum,
+                prot:
+                  arr == 0
+                    ? "0%"
+                    : Math.floor((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%"
+                    : Math.floor((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 =
+              Math.floor((res.kxsNum / res.num).toFixed(2) * 100) + "%";
+            this.dataLowcp.cont = arr;
+          } else if (res.risk == "普通") {
+            let arr = res.yjNum + res.jyNum + res.fxNum;
+            this.dataLowpt.data = [
+              {
+                name: "移交",
+                value: res.yjNum,
+                prot:
+                  arr == 0
+                    ? "0%"
+                    : Math.floor((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%"
+                    : Math.floor((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 =
+              Math.floor((res.kxsNum / res.num).toFixed(2) * 100) + "%";
+            this.dataLowpt.cont = arr;
+          } else if (res.risk == "严控") {
+            let arr = res.yjNum + res.jyNum + res.fxNum;
+            this.dataLowyk.data = [
+              {
+                name: "移交",
+                value: res.yjNum,
+                prot:
+                  arr == 0
+                    ? "0%"
+                    : Math.floor((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%"
+                    : Math.floor((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 =
+              Math.floor((res.kxsNum / res.num).toFixed(2) * 100) + "%";
+            this.dataLowyk.cont = arr;
+          } else if (res.risk == "高风险") {
+            let arr = res.yjNum + res.jyNum + res.fxNum;
+            this.dataLowgf.data = [
+              {
+                name: "移交",
+                value: res.yjNum,
+                prot:
+                  arr == 0
+                    ? "0%"
+                    : Math.floor((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%"
+                    : Math.floor((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 =
+              Math.floor((res.kxsNum / res.num).toFixed(2) * 100) + "%";
+            this.dataLowgf.cont = arr;
+          }
+        });
+        this.$refs.chart.init();
       } catch (error) {
         console.log(error);
       }
@@ -350,7 +548,8 @@ export default {
   > .chart_right {
     width: 45%;
     height: 100%;
-    padding-right: 20%;
+    padding-left: 1%;
+    // padding-right: 20%;
     > .analysis {
       width: 100%;
       height: 60px;
@@ -360,7 +559,7 @@ export default {
       margin-bottom: 10px;
       margin-top: 20px;
       > .analysis_cont {
-        width: 30%;
+        // width: 30%;
         height: 100%;
         > p {
           font-size: 14px;
@@ -378,7 +577,7 @@ export default {
       }
     }
     > .child {
-      width: 100%;
+      width: 68%;
       > .top {
         width: 100%;
         height: 37px;
@@ -428,7 +627,7 @@ export default {
       }
     }
     > .childcop {
-      width: 100%;
+      width: 68%;
       > .top {
         width: 100%;
         height: 37px;

src/views/securityCheck/views/cargoCharts.vue

@@ -51,6 +51,7 @@ export default {
   data() {
     return {
       queryData: {},
+      queryDatacopy: {},
       dataall: {
         id: 7,
         name: "总件数",
@@ -210,12 +211,20 @@ export default {
     //货物关联统计接口
     async relationDate(data) {
       try {
-        let params = {
-          beginDate: data[0][0],
-          endDate: data[0][1],
-          levelId: data[1],
-          proxyId: data[2],
-        };
+        let params = {};
+        console.log(this.$route.query, "11111111");
+        if (this.$route.query) {
+          params = this.$route.query;
+          this.queryDatacopy = params;
+        } else {
+          let params = {
+            startTime: data[0][0],
+            endDate: data[0][1],
+            levelId: data[1],
+            proxyId: data[2],
+          };
+          this.queryDatacopy = params;
+        }
         // console.log(params);
         const result = await agent(params);
         if (result.status == 200) {
@@ -329,7 +338,10 @@ export default {
       }
     },
     change() {
-      this.$router.push("./cargoRelevanceTable");
+      this.$router.push({
+        path: "./cargoRelevanceTable",
+        query: this.queryDatacopy,
+      });
     },
     init(arr, arrx, Low, firs, pt, strictly) {
       let myChart = this.$echarts.init(

src/views/securityCheck/views/cargoRelevanceTable.vue

@@ -258,6 +258,14 @@ export default {
     async getData() {
       try {
         this.loading = true;
+        // console.log(this.$route.query);
+        // if (this.$route.query) {
+        //   const { startTime, endDate, levelId, proxyId } = this.$route.query;
+        //   this.FormData[startTime] = startTime;
+        //   this.FormData[startTime] = endDate;
+        //   this.FormData[startTime] = levelId;
+        //   this.FormData[startTime] = proxyId;
+        // }
         const result = await agent(this.FormData);
         if (result.status === 200) {
           this.tableData = result.data;
@@ -275,6 +283,7 @@ export default {
     changeHandler() {
       this.$router.push({
         path: "./cargoCharts",
+        query: this.FormData,
       });
     },
     searchHandler(arr) {

src/views/securityCheck/views/securityChannelHome.vue

@@ -52,9 +52,9 @@ export default {
         query: this.queryData,
       });
     },
-    // change() {
-    //   this.$router.push("./agentTable");
-    // },
+    change() {
+      this.$router.push("./agentTable");
+    },
     async relationDate(data) {
       try {
         let params = {