速运行李查询修改

public/config.js

@@ -139,7 +139,8 @@ window.SERVICE_ID = {
   /***-----速运行李------***/
   expressTransportationUpload: 20034, // 速运行李数据上传
   expressTransportation: 1803435, // 速运行李数据查询
-  expressTransportationNum: 1803434, // 速运行李次数查询
+  expressTransportationNum: 1803436, // 速运行李次数查询
+  expressTransportationFail: 1803437 // 速运行李数据查询-失败
 }
 
 window.AIRPORT_ID = {

src/views/upload/index.vue

@@ -38,16 +38,39 @@
         <div class="flex">
           <div class="manageTitle">{{ title2 }}</div>
           <div>
-            <el-date-picker v-model="input" size="small" value-format="yyyy-MM-dd" type="date" placeholder="选择日期">
-            </el-date-picker>
-            <el-button class="btn-refresh" type="primary" icon="el-icon-refresh" @click="getStateData" />
+            <el-date-picker
+              v-model="input"
+              size="small"
+              value-format="yyyy-MM-dd"
+              type="date"
+              placeholder="选择日期"
+            />
+            <el-button
+              class="btn-refresh"
+              type="primary"
+              icon="el-icon-refresh"
+              @click="getStateData"
+            />
           </div>
         </div>
         <div class="upload-header-right">
           <!-- <el-date-picker v-model="flightDate" size="small" type="daterange" value-format="yyyy-MM-dd" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="dateRangePickerOptions" :clearable="false" />
           <el-button class="btn-refresh" type="primary" icon="el-icon-refresh" @click="getStateData" /> -->
-          <el-upload ref="upload" action="#" multiple :loading="exceed" :accept="acceptTypesStr" :show-file-list="false" :http-request="uploadHandler" :before-upload="beforeUpload">
-            <el-button slot="trigger" type="primary" size="small">
+          <el-upload
+            ref="upload"
+            action="#"
+            multiple
+            :loading="exceed"
+            :accept="acceptTypesStr"
+            :show-file-list="false"
+            :http-request="uploadHandler"
+            :before-upload="beforeUpload"
+          >
+            <el-button
+              slot="trigger"
+              type="primary"
+              size="small"
+            >
               上传文件
             </el-button>
           </el-upload>
@@ -55,53 +78,107 @@
       </header>
       <main class="upload-main">
         <div class="upload-main-content flex-wrap">
-          <div v-loading="loading1" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.8)" class="upload-main-content-left">
-            <el-table :data="capData" :highlight-current-row="true" @cell-click="stateClick" border stripe fit height="100%" class="state-table">
+          <div
+            v-loading="loading1"
+            element-loading-text="拼命加载中"
+            element-loading-spinner="el-icon-loading"
+            element-loading-background="rgba(0, 0, 0, 0.8)"
+            class="upload-main-content-left"
+          >
+            <el-table
+              :data="capData"
+              border
+              stripe
+              fit
+              height="100%"
+              class="state-table"
+              :cell-class-name="cellClass"
+              @cell-click="stateClick"
+            >
               <el-table-column label="日期">
                 <template slot-scope="scope">
                   <div>{{ currDate(scope.row.thedate) }}</div>
                 </template>
               </el-table-column>
-              <el-table-column width="100" prop="total" label="条数"></el-table-column>
+              <el-table-column
+                width="75"
+                prop="total"
+                label="总数"
+              />
+              <el-table-column
+                width="75"
+                prop="fail"
+                label="失败"
+              />
             </el-table>
           </div>
-          <div v-loading="loading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.8)" class="upload-main-content-right">
-            <el-table :data="tableData" border stripe fit height="100%" class="upload-table" :cell-class-name="cellClass">
-              <el-table-column v-for="column in tableColumns" :key="column.key" :prop="column.prop" :label="column.prop">
+          <div
+            v-loading="loading"
+            element-loading-text="拼命加载中"
+            element-loading-spinner="el-icon-loading"
+            element-loading-background="rgba(0, 0, 0, 0.8)"
+            class="upload-main-content-right"
+          >
+            <el-table
+              :data="tableData"
+              border
+              stripe
+              fit
+              height="100%"
+              class="upload-table"
+              :cell-class-name="cellClass"
+            >
+              <el-table-column
+                v-for="column in tableColumns"
+                :key="column.key"
+                :prop="column.prop"
+                :label="column.prop"
+              >
                 <template slot-scope="scope">
-                  <el-tooltip v-if="column.showTooltip" class="item" effect="dark" placement="top-start">
-                    <div slot="content" class="tooltip-content">
+                  <el-tooltip
+                    v-if="column.showTooltip"
+                    class="item"
+                    effect="dark"
+                    placement="top-start"
+                  >
+                    <div
+                      slot="content"
+                      class="tooltip-content"
+                    >
                       {{
-                    formatter(
-                      scope.row,
-                      scope.column,
-                      scope.row[scope.column.property]
-                    )
-                  }}
+                        formatter(
+                          scope.row,
+                          scope.column,
+                          scope.row[scope.column.property]
+                        )
+                      }}
                     </div>
                     <div class="tooltip-trigger">
                       {{
-                    formatter(
-                      scope.row,
-                      scope.column,
-                      scope.row[scope.column.property]
-                    )
-                  }}
+                        formatter(
+                          scope.row,
+                          scope.column,
+                          scope.row[scope.column.property]
+                        )
+                      }}
                     </div>
                   </el-tooltip>
                   <span v-else>
                     {{
-                  formatter(
-                    scope.row,
-                    scope.column,
-                    scope.row[scope.column.property]
-                  )
-                }}
+                      formatter(
+                        scope.row,
+                        scope.column,
+                        scope.row[scope.column.property]
+                      )
+                    }}
                   </span>
                 </template>
               </el-table-column>
               <template #empty>
-                <NoData :image-width="230" :image-height="160" />
+                <NoData
+                  :image-width="230"
+                  :image-height="160"
+                />
               </template>
             </el-table>
           </div>
@@ -134,12 +211,12 @@ const short = getUnit(maxSize)
 export default {
   name: 'Upload',
   components: { NoData },
-  data () {
+  data() {
     return {
       title: '速运行李上传',
       acceptTypesStr: acceptTypesStr,
       totalProgressList: [],
-      limit: 3,
+      limit: 10,
       title2: '速运行李数据',
       flightDate: new Array(2).fill(parseTime(new Date(), '{y}-{m}-{d}')),
       dateRangePickerOptions: {
@@ -183,7 +260,6 @@ export default {
         },
         {
           prop: 'message',
-          showTooltip: true,
         },
         {
           prop: 'sendResult',
@@ -193,19 +269,20 @@ export default {
       tableData: [],
       stateData: [],
       loading: false,
-      loading1: false
+      loading1: false,
+      currentCell: null,
     }
   },
   computed: {
-    currentProgressNum () {
+    currentProgressNum() {
       return this.totalProgressList.reduce((prevCount, currentProgress) => {
         return currentProgress.state > 0 ? prevCount : prevCount + 1
       }, 0)
     },
-    exceed () {
+    exceed() {
       return this.currentProgressNum >= this.limit
     },
-    currDate () {
+    currDate() {
       return function (time) {
         if (time) {
           return parseTime(new Date(time), '{y}-{m}-{d} {h}:{i}:{s}')
@@ -214,10 +291,12 @@ export default {
         }
       }
     },
-    capData () {
+    capData() {
       const val = this.input
-      return this.stateData.filter(data => !val || data.thedate && data.thedate.includes(val))
-    }
+      return this.stateData.filter(
+        data => !val || (data.thedate && data.thedate.includes(val))
+      )
+    },
   },
   // watch: {
   //   flightDate: {
@@ -228,11 +307,11 @@ export default {
   //     immediate: true,
   //   },
   // },
-  created () {
+  created() {
     this.getStateData()
   },
   methods: {
-    beforeUpload (file) {
+    beforeUpload(file) {
       const progress = this.getProgress(file)
       if (progress && progress.state === 0) {
         this.$message.warning(`${file.name} 上传中，请勿重复上传`)
@@ -258,7 +337,7 @@ export default {
         return false
       }
     },
-    uploadHandler ({ file }) {
+    uploadHandler({ file }) {
       if (!this.exceed) {
         this.uploadFile(file)
       }
@@ -276,25 +355,25 @@ export default {
       }
       this.totalProgressList.push(newProgress)
     },
-    stateClass (state) {
+    stateClass(state) {
       const classMap = ['pending', 'success', 'failure']
       return `upload-list-item-state-${classMap[state]}`
     },
-    stateFormat (state) {
+    stateFormat(state) {
       const textMap = ['上传中···', '上传成功', '上传失败']
       return textMap[state]
     },
-    setState (file, state) {
+    setState(file, state) {
       const progress = this.getProgress(file)
       if (progress) {
         progress.state = state
       }
     },
-    getProgress (file) {
+    getProgress(file) {
       const key = `${file.name}${file.lastModified}`
       return this.totalProgressList.find(progress => progress.key === key)
     },
-    retry (progress) {
+    retry(progress) {
       if (this.exceed) {
         this.$message.warning('已达到最大同时上传数量，请稍后再试')
         return
@@ -302,7 +381,7 @@ export default {
       this.uploadFile(progress.file)
       progress.state = 0
     },
-    async uploadFile (file) {
+    async uploadFile(file) {
       try {
         const formData = new FormData()
         formData.append('file', file)
@@ -320,26 +399,32 @@ export default {
         this.setState(file, 2)
       }
     },
-    dateRangePickHandler ({ maxDate, minDate }) {
+    dateRangePickHandler({ maxDate, minDate }) {
       if (!maxDate) {
         this.pickedDate = minDate
       } else {
         this.pickedDate = null
       }
     },
-    dateRangeDisabled (date) {
+    dateRangeDisabled(date) {
       return this.pickedDate
         ? Math.abs(date - this.pickedDate) > 2 * 24 * 60 * 60 * 1000
         : false
     },
-    cellClass ({ row, column, rowIndex, columnIndex }) {
+    cellClass({ row, column, rowIndex, columnIndex }) {
       const classes = []
       if (column.property === 'createtime') {
         classes.push('pre-line')
       }
+      if (['total', 'fail'].includes(column.property) && row[column.property]) {
+        classes.push('cell-click')
+        if (this.currentCell === `${row.dataObjectId}-${column.property}`) {
+          classes.push('cell-current')
+        }
+      }
       return classes.join(' ')
     },
-    formatter (row, column, cellValue) {
+    formatter(row, column, cellValue) {
       const value = String(cellValue ?? '').trim()
       switch (column.property) {
         case 'createtime':
@@ -348,20 +433,31 @@ export default {
           return cellValue
       }
     },
-    async getTableData (cid = null) {
+    async getTableData(cid = null, type = null) {
       this.loading = true
       try {
-        // const dataContent = [this.flightDate[0], this.flightDate[1]]
-        const dataContent = [
-          `${this.flightDate[0]} 00:00:00`,
-          `${this.flightDate[1]} 23:59:59`,
-        ]
+        const dataContent = []
+        if (cid) {
+          dataContent.push(cid)
+        } else {
+          dataContent.push(
+            `${this.flightDate[0]} 00:00:00`,
+            `${this.flightDate[1]} 23:59:59`
+          )
+        }
+        if (type === 'fail') {
+          dataContent.push('失败null')
+        }
         const {
           code,
           returnData: { listValues },
         } = await WhatQuery({
-          id: SERVICE_ID.expressTransportation,
-          dataContent: cid ? [cid] : dataContent,
+          id: SERVICE_ID[
+            type === 'fail'
+              ? 'expressTransportationFail'
+              : 'expressTransportation'
+          ],
+          dataContent,
         })
         if (Number(code) !== 0) {
           throw new Error('失败')
@@ -372,7 +468,7 @@ export default {
       }
       this.loading = false
     },
-    async getStateData () {
+    async getStateData() {
       this.loading1 = true
       try {
         const {
@@ -391,10 +487,12 @@ export default {
       }
       this.loading1 = false
     },
-    stateClick (row) {
+    stateClick(row, column, cell, event) {
       const { dataObjectId } = row
-      if (dataObjectId) {
-        this.getTableData(dataObjectId)
+      const type = column.property
+      if (dataObjectId && ['total', 'fail'].includes(type) && row[type]) {
+        this.currentCell = `${row.dataObjectId}-${column.property}`
+        this.getTableData(dataObjectId, type)
       }
     },
   },
@@ -462,7 +560,7 @@ export default {
       }
       &-details {
         font-size: 14px;
-        font-family: Helvetica, "Microsoft YaHei";
+        font-family: Helvetica, 'Microsoft YaHei';
         > div {
           height: 16px;
           line-height: 16px;
@@ -503,18 +601,15 @@ export default {
       }
     }
   }
-  ::v-deep &-table {
+  ::v-deep .el-table {
     width: 100%;
     .cell {
       padding: 0;
       text-align: center;
       font-size: 14px;
-      font-family: Helvetica, "Microsoft YaHei";
+      font-family: Helvetica, 'Microsoft YaHei';
       letter-spacing: 0;
     }
-    .pre-line .cell {
-      white-space: pre-line;
-    }
     .el-table__header-wrapper,
     .el-table__fixed-header-wrapper {
       .cell {
@@ -523,6 +618,24 @@ export default {
         white-space: nowrap;
       }
     }
+    .pre-line .cell {
+      white-space: pre-line;
+    }
+
+    &.state-table {
+      .el-table__cell {
+        background-color: transparent !important;
+        &.cell-click .cell {
+          color: #2d67e3;
+          cursor: pointer;
+        }
+
+        &.cell-current,
+        &:hover {
+          background-color: #d5e4f7 !important;
+        }
+      }
+    }
   }
 }