statistics 统计图表增加放大功能，及配置调整

查询接口响应失败之后没有关掉loading

src/views/spectrumAnalysis/components/Modals/LoadFromFileModal.vue

@@ -370,7 +370,6 @@ export default {
       if (column !== 'sampleFileName' && (!record.sampleFileName || record.fileType !== 'B')) {
         return
       }
-      console.log('this.directoryHanlder', this.directoryHanlder)
       if (this.directoryHanlder) {
         this.chooseFile(column, record, rowIndex)
       } else {
@@ -384,7 +383,6 @@ export default {
     async chooseFile(column, record, rowIndex) {
       try {
         const [fileHandle] = await FilePicker.chooseFile(false, [{ accept: { 'text/phd': ['.phd'] } }])
-        console.log('fileHandle', fileHandle)
         try {
           const isFileInDirectory = await FilePicker.isFileInDirectory(this.directoryHanlder, fileHandle)
           if (!isFileInDirectory) {
@@ -395,9 +393,7 @@ export default {
           }
 
           const file = await fileHandle.getFile()
-          console.log('file', file)
           const text = await readFile(file)
-          console.log('text', text)
           const phdParser = new PHDParser(text)
           console.log('%c [ phdParser ]-313', 'font-size:13px; background:pink; color:#bf2c9f;', phdParser)
           const match = this.fileNameAndColumnMatch(column, phdParser.dataType)
@@ -676,7 +672,6 @@ export default {
         const propStatus = ['sampleFileStatus', 'gasFileStatus', 'detFileStatus', 'qcFileStatus']
         const files = []
         const allFiles = []
-        console.log('this.list', this.list)
         for (const item of this.list) {
           if (item.fileType) {
             let fileObj = {
@@ -696,7 +691,6 @@ export default {
             allFiles.push(fileObj)
           }
         }
-        console.log('allFilesallFiles', allFiles)
         console.log('filesfiles', files)
         if (!files.length) {
           this.$message.warn('File is Empty ')
@@ -709,7 +703,6 @@ export default {
           const { success, message } = await this.uploadZipFile(zipedFiles)
           if (success) {
             let result = []
-            console.log('allFiles', allFiles)
             allFiles.forEach((el) => {
               let obj = {}
               if (el.fileType == 'B') {
@@ -755,7 +748,6 @@ export default {
               }
               result.push(obj)
             })
-            console.log('result', result)
             this.$emit('loadFormFile', result)
             this.visible = false
             this.isUploadingZip = false

src/views/statistics/Statistics/statistics/index.vue

@@ -129,8 +129,8 @@ const commonOptions = {
   grid: {
     top: 30,
     left: 20,
-    right: 30,
+    right: 40,
-    bottom: 35,
+    bottom: 60,
     containLabel: true,
   },
   tooltip: {
@@ -168,10 +168,10 @@ const commonOptions = {
     name: 'Collect Start',
     nameLocation: 'middle',
     nameTextStyle: {
-      fontSize: 18,
+      fontSize: 14,
       color: '#5b9cba',
     },
-    nameGap: 35,
+    nameGap: 60,
     boundaryGap: false,
     splitLine: {
       show: true,
@@ -191,24 +191,19 @@ const commonOptions = {
     axisLabel: {
       color: '#ade6ee',
       formatter: (value, index) => {
-        // let val = value.split(' ').join('\n')
         let val = value.split(' ')[0]
         if (index === 0) {
           let arr = value.split(' ')
           arr[0] = '                   ' + arr[0]
-          // arr[1] = '                   ' + arr[1]
-          // let str = arr.join('\n')
-          let str = arr[0]
-          return str
-        }
-        if (index === xDataLength - 1) {
-          let arr = value.split(' ')
-          arr[0] = arr[0] + '                   '
-          // arr[1] = arr[1] + '                   '
-          // let str = arr.join('\n')
           let str = arr[0]
           return str
         }
+        // if (index === xDataLength - 1) {
+        //   let arr = value.split(' ')
+        //   arr[0] = arr[0] + '                   '
+        //   let str = arr[0]
+        //   return str
+        // }
         return val
       },
     },
@@ -234,6 +229,19 @@ const commonOptions = {
       color: '#ade6ee',
     },
   },
+  dataZoom: [
+    {
+      type: 'inside',
+      start: 0,
+      end: 100,
+    },
+    {
+      height: 16,
+      bottom: 35,
+      start: 0,
+      end: 100,
+    },
+  ],
   series: [],
 }
 export default {
@@ -417,54 +425,60 @@ export default {
       }
     },
     async getChartDate(params, chart, option, id) {
-      this.spinning = true
+      try {
-      let { legend, xAxis, series, toolbox } = option
+        this.spinning = true
-      const { success, message, result } = await getAction('/webStatistics/findNuclideStatistics', {
+        let { legend, xAxis, series, toolbox } = option
-        ...params,
+        const { success, message, result } = await getAction('/webStatistics/findNuclideStatistics', {
-      })
+          ...params,
-      if (success) {
+        })
-        // let result = jsonData.result
+        if (success) {
-        this.spinning = false
+          // let result = jsonData.result
-        this.$set(this.itemTitle, id, result.STATION_NAME)
+          this.spinning = false
-        if (result.CollectStart.length < 1) {
+          this.$set(this.itemTitle, id, result.STATION_NAME)
-          this.$message.warning(`${result.STATION_NAME} No Data!`)
+          if (result.CollectStart.length < 1) {
-        }
+            this.$message.warning(`${result.STATION_NAME} No Data!`)
-        // legend.data = Object.keys(result).filter((item) => item !== 'CollectStart')
-        xAxis.data = result.CollectStart
-        xDataLength = result.CollectStart.length
-        toolbox.feature.saveAsImage.name = `${result.STATION_NAME}：Nuclide History`
-        let objKeys = Object.keys(result).filter(
-          (item) => item !== 'CollectStart' && item !== 'STATION_NAME' && key !== 'AllDayTime'
-        )
-        for (const key in result) {
-          let idx = objKeys.findIndex((item) => item == key)
-          let num_symbol = idx % 7
-          // let num_symbol = idx%7
-          let param = null
-          if (
-            Object.hasOwnProperty.call(result, key) &&
-            key !== 'CollectStart' &&
-            key !== 'STATION_NAME' &&
-            key !== 'AllDayTime'
-          ) {
-            const element = result[key]
-            param = {
-              type: 'line',
-              name: key,
-              smooth: false,
-              showSymbol: true,
-              symbolSize: 10,
-              symbol: this.symbolList[num_symbol],
-              animation: false,
-              data: element,
-            }
-            series.push(param)
           }
+          // legend.data = Object.keys(result).filter((item) => item !== 'CollectStart')
+          xAxis.data = result.CollectStart
+          xDataLength = result.CollectStart.length
+          toolbox.feature.saveAsImage.name = `${result.STATION_NAME}：Nuclide History`
+          let objKeys = Object.keys(result).filter(
+            (item) => item !== 'CollectStart' && item !== 'STATION_NAME' && key !== 'AllDayTime'
+          )
+          for (const key in result) {
+            let idx = objKeys.findIndex((item) => item == key)
+            let num_symbol = idx % 7
+            // let num_symbol = idx%7
+            let param = null
+            if (
+              Object.hasOwnProperty.call(result, key) &&
+              key !== 'CollectStart' &&
+              key !== 'STATION_NAME' &&
+              key !== 'AllDayTime'
+            ) {
+              const element = result[key]
+              param = {
+                type: 'line',
+                name: key,
+                smooth: false,
+                showSymbol: true,
+                symbolSize: 10,
+                symbol: this.symbolList[num_symbol],
+                animation: false,
+                data: element,
+              }
+              series.push(param)
+            }
+          }
+          chart.setOption(option)
+        } else {
+          this.spinning = false
+          this.$message.warning('This operation fails. Contact your system administrator')
         }
-        chart.setOption(option)
+      } catch (error) {
-      } else {
+        this.spinning = false
+      } finally {
         this.spinning = false
-        this.$message.warning('This operation fails. Contact your system administrator')
       }
     },
     handleExport() {