添加统计分析接口

public/config.js

@@ -90,6 +90,18 @@ window.DATACONTENT_ID = {
   airportTreeId: 58, //基础数据-机场信息维护-公司列表-id
   bagTableId: 55, //基础数据-特殊行李维护-表格-id
 
+  /***-----统计分析------***/
+
+  stOrderId: 18012,
+  stOrderChartId: 18013,
+  stCalId: 18014,
+  stFigntsId: 18015,
+  stSpeedId: 18016,
+  stBaggageId: 18017,
+  stMapId: 18018,
+  stCountryId: 18019,
+  stTerminalId: 18020,
+
   // 数据统计
   airlineOptions: 1806, // 航线下拉
   areaOptions: 1807, // 大区/基地分公司下拉

src/layout/components/Echarts/commonChartsChinaMap.vue

@@ -34,6 +34,18 @@ export default {
       desc: 300 // 防抖时间
     }
   },
+  watch: {
+    // 监听数据变化 重绘图形
+    option: {
+      handler (obj) {
+        // 初始数据和额外的配置数据耦合
+        const objData = _.merge(this.options, obj)
+        // 生成柱状图
+        this.myChart.setOption(objData)
+      },
+      deep: true
+    }
+  },
   mounted () {
     // 初始数据和额外的配置数据耦合
     const objData = _.merge(this.options, this.option)

src/views/statisticalAnalysis/components/index.vue

@@ -89,34 +89,14 @@
                 <PieCharts id="pie-charts" :option="pieOption" />
               </div>
               <div class="total-data-info">
-                <div class="total-data-info-list">
-                  <div class="pie-data-list">
-                    <span class="icon icon1"></span>
-                    <span class="text">多收</span>
-                  </div>
-                  <div class="pie-data-list flex-wrap">
-                    <span class="text flex1">数量：33327</span>
-                    <span class="text flex1">占比：40%</span>
-                  </div>
-                </div>
-                <div class="total-data-info-list">
-                  <div class="pie-data-list">
-                    <span class="icon icon2"></span>
-                    <span class="text">少收</span>
-                  </div>
-                  <div class="pie-data-list flex-wrap">
-                    <span class="text flex1">数量：33327</span>
-                    <span class="text flex1">占比：40%</span>
-                  </div>
-                </div>
-                <div class="total-data-info-list">
+                <div v-for="(item,index) in baggageData" :key="index" class="total-data-info-list">
                   <div class="pie-data-list">
-                    <span class="icon icon3"></span>
-                    <span class="text">破损</span>
+                    <span :class="'icon'+(index+1)" class="icon"></span>
+                    <span class="text">{{item.name}}</span>
                   </div>
                   <div class="pie-data-list flex-wrap">
-                    <span class="text flex1">数量：33327</span>
-                    <span class="text flex1">占比：40%</span>
+                    <span class="text flex1">数量：{{item.num}}</span>
+                    <span class="text flex1">占比：{{item.pag}}%</span>
                   </div>
                 </div>
               </div>
@@ -139,7 +119,7 @@
             <div class="content-list-box-bp-title">航站运输排行</div>
             <div class="terminal-transportation mt36">
               <vue-seamless-scroll class="scrollTable" :class-option="defaultOption">
-                <div class="terminal-transportation-list flex-wrap" v-for="item in terminalData" :key="item.id">
+                <div class="terminal-transportation-list flex-wrap" v-for="(item,index) in terminalData" :key="index">
                   <div class="name">{{item.name}}</div>
                   <div class="progress">
                     <el-progress :percentage="item.percentage" :color="customColor"></el-progress>
@@ -162,146 +142,6 @@ import PieCharts from '@/layout/components/Echarts/commonChartsPie.vue'
 import MapCharts from '@/layout/components/Echarts/commonChartsChinaMap.vue'
 import vueSeamlessScroll from 'vue-seamless-scroll'
 import { Query } from "@/api/dataIntegration"
-const citydata = [{
-  name: "北京",
-  value: 974
-},
-{
-  name: "天津",
-  value: 532
-},
-{
-  name: "上海",
-  value: 834
-},
-{
-  name: "重庆",
-  value: 683
-},
-{
-  name: "河北",
-  value: 283
-},
-{
-  name: "河南",
-  value: 345
-},
-{
-  name: "云南",
-  value: 272
-},
-{
-  name: "辽宁",
-  value: 194
-},
-{
-  name: "黑龙江",
-  value: 342
-},
-{
-  name: "湖南",
-  value: 389
-},
-{
-  name: "安徽",
-  value: 267
-},
-{
-  name: "山东",
-  value: 675
-},
-{
-  name: "新疆",
-  value: 174
-},
-{
-  name: "江苏",
-  value: 574
-},
-{
-  name: "浙江",
-  value: 278
-},
-{
-  name: "江西",
-  value: 528
-},
-{
-  name: "湖北",
-  value: 144
-},
-{
-  name: "广西",
-  value: 448
-},
-{
-  name: "甘肃",
-  value: 197
-},
-{
-  name: "山西",
-  value: 203
-},
-{
-  name: "内蒙古",
-  value: 373
-},
-{
-  name: "陕西",
-  value: 563
-},
-{
-  name: "吉林",
-  value: 147
-},
-{
-  name: "福建",
-  value: 112
-},
-{
-  name: "贵州",
-  value: 373
-},
-{
-  name: "广东",
-  value: 747
-},
-{
-  name: "青海",
-  value: 38
-},
-{
-  name: "西藏",
-  value: 126
-},
-{
-  name: "四川",
-  value: 215
-},
-{
-  name: "宁夏",
-  value: 172
-},
-{
-  name: "海南",
-  value: 77
-},
-{
-  name: "台湾",
-  value: 837
-},
-{
-  name: "香港",
-  value: 677
-},
-{
-  name: "澳门",
-  value: 43
-},
-{
-  name: "南海诸岛",
-  value: 53
-}]
 let top = 0;
 let bottom = 0;
 export default {
@@ -628,6 +468,23 @@ export default {
           },
         ],
       },
+      baggageData: [
+        {
+          name: '多收',
+          num: 33327,
+          pag: '40'
+        },
+        {
+          name: '少收',
+          num: 33327,
+          pag: '40'
+        },
+        {
+          name: '破损',
+          num: 33327,
+          pag: '40'
+        }
+      ],
       boxMap: {
         title: [{
           show: true,
@@ -639,7 +496,18 @@ export default {
           },
         },],
         tooltip: {
-          trigger: "item"
+          trigger: "item",
+          formatter: function (item) {
+            if (item.data && item.data.index) {
+              const html = `<div>
+              <div>TOP ${item.data.index}</div>
+              <div>${item.data.name} ${item.data.value}</div>
+            </div>`
+              return html
+            } else {
+              return '<div>暂无数据</div>'
+            }
+          }
         },
         legend: {
           show: false
@@ -654,7 +522,7 @@ export default {
           type: 'continuous',
           text: ['高', '低'],
           min: 0,
-          max: 1000,
+          max: 1000000,
           seriesIndex: [0, 2],
           dimension: 0,
           realtime: false,
@@ -720,7 +588,7 @@ export default {
               areaColor: '#E5F39B'
             }
           },
-          data: citydata
+          data: []
         },
         ]
       },
@@ -898,70 +766,14 @@ export default {
       },
       terminalData: [
         {
-          id: 1,
           name: 'PEK',
-          num: 903133,
-          percentage: 20
-        },
-        {
-          id: 2,
-          name: 'CTU',
-          num: 572570,
-          percentage: 25
-        },
-        {
-          id: 3,
-          name: 'TFU',
-          num: 263859,
-          percentage: 30
-        },
-        {
-          id: 4,
-          name: 'CKG',
-          num: 260811,
-          percentage: 20
-        },
-        {
-          id: 5,
-          name: 'HGH',
-          num: 184195,
-          percentage: 50
-        },
-        {
-          id: 6,
-          name: 'PVG',
-          num: 104716,
-          percentage: 70
-        },
-        {
-          id: 7,
-          name: 'SZX',
-          num: 104371,
-          percentage: 90
-        },
-        {
-          id: 8,
-          name: 'CKG',
-          num: 260811,
-          percentage: 20
+          num: 200,
+          percentage: 10
         },
         {
-          id: 9,
-          name: 'HGH',
-          num: 184195,
-          percentage: 50
-        },
-        {
-          id: 10,
-          name: 'PVG',
-          num: 104716,
-          percentage: 70
-        },
-        {
-          id: 11,
-          name: 'SZX',
-          num: 104371,
-          percentage: 90
+          name: 'PEK',
+          num: 200,
+          percentage: 10
         }
       ],
       customColor: '#6EADE8'
@@ -993,7 +805,7 @@ export default {
     //获取运输总量
     async getOrderNum () {
       const { code, returnData } = await Query({
-        id: 18012,
+        id: DATACONTENT_ID.stOrderId,
         dataContent: []
       })
       if (code == 0) {
@@ -1006,7 +818,7 @@ export default {
     //获取运输总量-统计图
     async getOrderNumChart () {
       const { code, returnData } = await Query({
-        id: 18013,
+        id: DATACONTENT_ID.stOrderChartId,
         dataContent: []
       })
       if (code == 0) {
@@ -1032,7 +844,7 @@ export default {
     //获取统计数据
     async getStatistical () {
       const { code, returnData } = await Query({
-        id: 18014,
+        id: DATACONTENT_ID.stCalId,
         dataContent: []
       })
       if (code == 0) {
@@ -1056,7 +868,7 @@ export default {
     //获取航班数
     async getFignts () {
       const { code, returnData } = await Query({
-        id: 18015,
+        id: DATACONTENT_ID.stFigntsId,
         dataContent: []
       })
       if (code == 0) {
@@ -1080,7 +892,7 @@ export default {
     //获取中转数
     async getSpeed () {
       const { code, returnData } = await Query({
-        id: 18016,
+        id: DATACONTENT_ID.stSpeedId,
         dataContent: []
       })
       if (code == 0) {
@@ -1098,10 +910,92 @@ export default {
     //获取异常行李
     async getBaggage () {
       const { code, returnData } = await Query({
-        id: 18017,
+        id: DATACONTENT_ID.stBaggageId,
+        dataContent: []
+      })
+      const { listValues } = returnData
+      if (code == 0 && listValues.length) {
+        this.baggageData = listValues
+      } else {
+        this.baggageData.map(item => {
+          item.num = 0
+          item.pag = 0
+        })
+        this.pieOption.series[0].data.map(item => {
+          item.value = 0
+        })
+      }
+    },
+    //获取区域运输top
+    async getMap () {
+      const { code, returnData } = await Query({
+        id: DATACONTENT_ID.stMapId,
         dataContent: []
       })
-      console.log(returnData)
+      if (code == 0) {
+        const { listValues } = returnData
+        listValues.sort((a, b) => b.bagsnum - a.bagsnum)
+        listValues.map((item, index) => {
+          item.name = item.province
+          item.value = item.bagsnum,
+            item.index = index + 1
+        })
+        this.boxMap.series[0].data = listValues
+      } else {
+
+      }
+    },
+    //获取国内国际
+    async getCountry () {
+      const { code, returnData } = await Query({
+        id: DATACONTENT_ID.stCountryId,
+        dataContent: []
+      })
+      if (code == 0) {
+        const { listValues } = returnData
+        let total = 0
+        let int = null //国际
+        let dom = null //国内
+        listValues.map(item => {
+          if (item.ditype == 'INT') {
+            int = item.bagsnum
+          } else if (item.ditype == 'DOM') {
+            dom = item.bagsnum
+          }
+          total += Number(item.bagsnum)
+        })
+        this.domesticOption.title[1].text = parseInt((dom / total) * 100) + '%'
+        this.internationalOption.title[1].text = parseInt((int / total) * 100) + '%'
+        this.domesticOption.series[0].data = [parseInt((dom / total) * 100)]
+        this.internationalOption.series[0].data = [parseInt((int / total) * 100)]
+      } else {
+        this.domesticOption.title[1].text = '0%'
+        this.internationalOption.title[1].text = '0%'
+        this.domesticOption.series[0].data = [0]
+        this.internationalOption.series[0].data = [0]
+      }
+    },
+    //获取航站运输排行
+    async getTerminalData () {
+      const { code, returnData } = await Query({
+        id: DATACONTENT_ID.stTerminalId,
+        dataContent: []
+      })
+      if (code == 0) {
+        const { listValues } = returnData
+        let total = 0
+        listValues.map(item => {
+          total += Number(item.bagsnum)
+        })
+        listValues.map(item => {
+          item.name = item.airport
+          item.num = item.bagsnum
+          item.percentage = (item.bagsnum / total).toFixed(2) * 100
+        })
+        this.terminalData = listValues
+      } else {
+        this.terminalData = []
+      }
     },
     //获取初始数据
     getDataInit () {
@@ -1111,6 +1005,9 @@ export default {
       this.getFignts()
       this.getSpeed()
       this.getBaggage()
+      this.getMap()
+      this.getCountry()
+      this.getTerminalData()
     },
     getCountEnterNum () {
       this.$nextTick(() => {
@@ -1484,7 +1381,7 @@ export default {
         color: #ffffff;
       }
       ::v-deep .progress {
-        min-width: 300px;
+        min-width: 270px;
         margin: 0 36px;
         .el-progress-bar {
           padding-right: 0;