修改扫描节点

src/views/statisticsCharts/views/nodeStatisticsCharts.vue

@@ -3,7 +3,7 @@
     <div ref="headerWrapper" class="statstics-header">
       <StatisticsHeader title="扫描节点与位置分析" :items="formItems" :data="formData" with-setting @getFormData="getFormData" @export="exportHandler" @setting="settingHandler" />
     </div>
-    <div class="statstics-content">
+    <div v-loading="loading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.8)" class="statstics-content">
       <div ref="myChart" class="node-statistics-chart" :style="{ height: chartHeight }" />
       <div v-if="checkedTooltips.length" class="node-tooltip">
         <div class="node-tooltip-title">节点扫描率</div>
@@ -44,38 +44,51 @@ export default {
   data () {
     return {
       formData: {
+        range: '',
         airline: '',
         airport: '',
         inOrOut: '',
         dateTime: '',
       },
       formItems: [
-        // {
-        //   prop: 'range',
-        //   inputType: 'select',
-        //   placeholder: '统计范围',
-        //   options: [],
-        //   queryId: SERVICE_ID.nodeRange,
-        //   setKey: 'a1',
-        //   changeHandler(value) {
-        //     this.setInOrOutOptions(value)
-        //     const rangeMap = {
-        //       航线: 'airline',
-        //       基地分公司: 'area',
-        //       航站: 'airport',
-        //       航站楼: 'terminal',
-        //     }
-        //     Object.entries(rangeMap).forEach(([k, v]) => {
-        //       const theItem = this.formItems.find(item => item.prop === v)
-        //       if (value === k) {
-        //         theItem && (theItem.disabled = false)
-        //       } else {
-        //         this.formData[v] = ''
-        //         theItem && (theItem.disabled = true)
-        //       }
-        //     })
-        //   },
-        // },
+        {
+          prop: 'range',
+          inputType: 'select',
+          placeholder: '统计范围',
+          options: [
+            {
+              value: 'airline',
+              label: '航线',
+            },
+            {
+              value: 'airport',
+              label: '航站',
+            }
+          ],
+          setKey: 'a1',
+          changeHandler (value) {
+            switch (value) {
+              case 'airline':
+                this.formData.airport = null
+                this.formData.inOrOut = null
+                this.formItems[1].disabled = false
+                this.formItems[2].disabled = true
+                this.formItems[3].disabled = true
+                break
+              case 'airport':
+                this.formData.airline = null
+                this.formItems[1].disabled = true
+                this.formItems[2].disabled = false
+                this.formItems[3].disabled = false
+                break
+              default:
+                this.formItems[1].disabled = false
+                this.formItems[2].disabled = false
+                this.formItems[3].disabled = false
+                break
+            }
+          },
+        },
         {
           prop: 'airline',
           inputType: 'select',
@@ -127,40 +140,49 @@ export default {
           name: '行李总件数',
           label: '',
           disabled: true,
+          nodeKey: 'bags'
         },
         {
           name: '值机件数',
           label: '值机',
+          nodeKey: 'check_in'
         },
         {
           name: '安检件数',
           label: '安检',
+          nodeKey: 'security'
         },
         {
           name: '分拣件数',
           label: '分拣',
+          nodeKey: 'sort_num'
         },
         {
           name: '装车件数',
           label: '装车',
+          nodeKey: 'load_car'
         },
         {
           name: '装机件数',
           label: '装机',
+          nodeKey: 'load_plane'
           // disabled: true
         },
         {
           name: '卸机件数',
           label: '卸机',
           disabled: true,
+          nodeKey: ''
         },
         {
           name: '中转件数',
           label: '中转',
+          nodeKey: 'transfer'
         },
         {
           name: '到达件数',
           label: '到达',
+          nodeKey: 'arrive'
         },
       ],
       checkList: [],
@@ -213,6 +235,7 @@ export default {
       seriesData: [],
       tooltips: [],
       descriptions: {},
+      loading: false
     }
   },
   computed: {
@@ -274,6 +297,7 @@ export default {
           ...pre,
           {
             name: curr.name,
+            key: curr.nodeKey,
             label: curr.label,
             ratio: '0%',
           },
@@ -286,6 +310,7 @@ export default {
     this.indicator = this.nodeList.map(node => ({
       name: node.name,
       max: 10000,
+      key: node.nodeKey
     }))
 
     this.checkList = this.nodeList.reduce((pre, curr) => {
@@ -347,32 +372,17 @@ export default {
       this.queryChartsData(data)
     },
     setInOrOutOptions (range) {
+      console.log(range)
       const theInOrOutItem = this.formItems.find(
         item => item.prop === 'inOrOut'
       )
       switch (range) {
-        case '全部':
-        case '航线':
-          theInOrOutItem.options = [
-            {
-              label: '全部',
-              value: '全部',
-            },
-          ]
-          this.formData.inOrOut = '全部'
+        case 'airline':
+          this.formItems[2].disabled = true
           this.formItems[3].disabled = true
+          console.log(this.formItems)
           break
-        case '航站':
-          theInOrOutItem.options = [
-            {
-              value: '进港',
-              label: '进港',
-            },
-            {
-              value: '离港',
-              label: '离港',
-            },
-          ]
+        case 'airport':
           this.formItems[3].disabled = false
           break
         default:
@@ -401,33 +411,41 @@ export default {
       }
     },
     async queryChartsData (data) {
+      this.loading = true
       const params = []
       let queryId
-      if (data.range === '航线' && data.airline === '') {
-        this.$message.warning('请先选择航线')
-        return
-      }
-      if (data.range === '航站' && data.airport === '') {
-        this.$message.warning('请先选择航站')
-        return
-      }
-      switch (data.inOrOut) {
-        case '全部':
-          queryId = SERVICE_ID.nodeAll
-          break
-        case '进港':
-          queryId = SERVICE_ID.nodeIn
-          break
-        case '离港':
-          queryId = SERVICE_ID.nodeOut
-          break
-        default:
-          this.$message.warning('请先选择进离港')
-          return
+      // if (data.range === '航线' && data.airline === '') {
+      //   this.$message.warning('请先选择航线')
+      //   return
+      // }
+      // if (data.range === '航站' && data.airport === '') {
+      //   this.$message.warning('请先选择航站')
+      //   return
+      // }
+      // switch (data.inOrOut) {
+      //   case '全部':
+      //     queryId = SERVICE_ID.nodeAll
+      //     break
+      //   case '进港':
+      //     queryId = SERVICE_ID.nodeIn
+      //     break
+      //   case '离港':
+      //     queryId = SERVICE_ID.nodeOut
+      //     break
+      //   default:
+      //     this.$message.warning('请先选择进离港')
+      //     return
+      // }
+      // if (data.dateTime === '') {
+      //   this.$message.warning('请先选择统计时间范围')
+      //   return
+      // }
+      if (data.airline) {
+        data.airport = null
+        data.inOrOut = null
       }
-      if (data.dateTime === '') {
-        this.$message.warning('请先选择统计时间范围')
-        return
+      if (data.airport || data.inOrOut) {
+        data.airline = null
       }
       const dataObj = {
         air_line: data.airline,
@@ -465,7 +483,7 @@ export default {
             })
             list.forEach(([name, value]) => {
               const tooltip = this.tooltips.find(
-                tooltip => tooltip.name === name
+                tooltip => tooltip.key === name
               )
               if (tooltip && value) {
                 tooltip.ratio = ((value / max) * 100).toFixed(2) + '%'
@@ -476,7 +494,7 @@ export default {
                 name: node.name,
                 value: 0,
               }
-              const data = list.find(([key, value]) => key === node.name)
+              const data = list.find(([key, value]) => key === node.key)
               if (data) {
                 result.value = data[1]
               }
@@ -487,8 +505,9 @@ export default {
         } else {
           this.$message.error(res.message || '失败')
         }
+        this.loading = false
       } catch (error) {
-        console.log(error)
+        this.loading = false
         this.$message.error('失败')
       }
     },