fix: 内置报告bug修复

src/assets/css/common.scss

@@ -21,3 +21,10 @@ body {
   font-size: 14px;
   position: fixed;
 }
+.icon {
+  width: 1em;
+  height: 1em;
+  vertical-align: -0.15em;
+  fill: currentColor;
+  overflow: hidden;
+}

src/assets/css/common/table-common.scss

@@ -178,9 +178,6 @@
       .table-operation-items {
         display: flex;
         justify-content: center;
-        .table-operation-item--down {
-          margin-right: 16px;
-        }
         .table-operation-item {
           display: flex;
           height: 22px;
@@ -250,7 +247,7 @@
       box-shadow: 1px 0 $--right-box-border-color;
     }
     .el-table:not(.no-operation):not(.chart-table).el-table--border .el-table__header-wrapper th:nth-last-child(3) {
-      border-right: none !important;
+      //border-right: none !important;
       box-shadow: 1px 0 $--right-box-border-color;
     }
     .el-table__fixed-body-wrapper {

src/assets/css/components/views/report/builtinReport.scss

@@ -52,7 +52,8 @@
       bottom: 17px;
       z-index: 2;
       left: 20px;
-      height: 22px;
+      line-height: 24px;
+      height: 24px;
       display: flex;
       .el-checkbox {
         width: 14px;
@@ -65,34 +66,61 @@
         }
       }
       .table-operation-all-span {
-        span:nth-of-type(1) {
+        height: 24px;
+        display: flex;
+        span {
           margin: 0 10px;
           font-size: 14px;
           color: #666666;
           letter-spacing: 0;
           font-weight: 400;
         }
-        span:nth-of-type(2) {
-          font-size: 12px;
-          color: #FFFFFF;
+        .table-operation-back-down {
           font-weight: 500;
           height: 24px;
           background: #D7D7D7;
           border-radius: 2px;
-          padding: 3px 8px;
-          line-height: 16px;
+          line-height: 21px;
           cursor: pointer;
-          margin-top: 2px;
+          position: relative;
+          span {
+            margin: 3px 8px;
+            font-size: 12px;
+            color: #FFFFFF;
           }
-        span:nth-of-type(2).table-operation-all-checkbox {
+        }
+        .table-operation-back-down div {
+          color: #FFFFFF;
+          height: 24px;
+          background: #D7D7D7;
+          border-radius: 2px;
+          i {
+            font-size: 25px;
+            top: calc(50% - 12px);
+          }
+        }
+        .table-operation-back-down.table-operation-all-checkbox {
            background: #0091ff;
          }
+        .table-operation-back-down.table-operation-all-loading {
+           background: #D7D7D7;
+         }
       }
     }
     .table-operation-items {
       .table-operation-item--down {
+        margin-right: 16px;
         cursor: pointer;
       }
+      .table-operation-item--down,.table-operation-item--preview {
+        display: flex;
+        justify-content: center;
+        flex-direction: column;
+        .icon {
+          height: 25px;
+          width: 25px;
+        }
+      }
       .table-operation-item--preview {
         cursor: pointer;
       }

src/components/table/report/builtinReportTable.vue

@@ -54,8 +54,16 @@
       </template>
       <template #default="scope">
         <div class="table-operation-items">
-          <div class="table-operation-item--down" @click="tableOperation(['download', scope.row])"><i class="cn-icon cn-icon-download2"></i></div>
-          <div class="table-operation-item--preview" @click="tableOperation(['preview', scope.row])"><i class="cn-icon cn-icon-preview"></i></div>
+          <div class="table-operation-item--down" @click="tableOperation(['download', scope.row])">
+            <svg class="icon" aria-hidden="true">
+              <use xlink:href="#cn-icon-download2"></use>
+            </svg>
+          </div>
+          <div class="table-operation-item--preview" @click="tableOperation(['preview', scope.row])">
+            <svg class="icon" aria-hidden="true">
+              <use xlink:href="#cn-icon-preview"></use>
+            </svg>
+          </div>
         </div>
       </template>
     </el-table-column>
@@ -64,18 +72,22 @@
     <el-checkbox v-model="checkboxAll" @change="builtinReportCheckbox(tableData)"></el-checkbox>
     <div class="table-operation-all-span">
       <span>{{ $t('overall.all') }}</span>
-      <span :class="{'table-operation-all-checkbox': batchDow}" :disabled="checkboxAll" @click="tableOperation(['download', this.checkboxIds, 'builtin'])">{{$t('report.batchDow')}}</span>
+      <div class="table-operation-back-down" :class="{'table-operation-all-checkbox': batchDow, 'table-operation-all-loading': loading}" @click="tableOperation(['download', this.checkboxIds, 'builtin'])">
+        <loading :loading="loading"></loading>
+        <span>{{$t('report.batchDow')}}</span>
+      </div>
     </div>
   </div>
 </template>
 
 <script>
 import table from '@/mixins/table'
+import Loading from '@/components/common/Loading'
 export default {
   name: 'builtinReportTable',
   mixins: [table],
-  props: {
-    builtinReportLeftMenu: Number
+  components: {
+    Loading
   },
   data () {
     return {
@@ -104,7 +116,8 @@ export default {
       checkboxIds: '',
       batchDow: false,
       builtinId: '',
-      indeterminate: false
+      indeterminate: false,
+      loading: false
     }
   },
   methods: {

src/main.js

@@ -1,5 +1,6 @@
 import { createApp } from 'vue'
 import '@/assets/css/font/iconfont.css'
+import '@/assets/css/font/iconfont.js'
 import router from '@/router'
 import store from '@/store'
 import App from '@/App.vue'

src/mixins/data-list.js

@@ -147,6 +147,7 @@ export default {
       this.rightBox.show = true
     },
     download (u, n) {
+      if (this.$refs.dataTable.loading && n === 'builtin') return
       let fileName = ''
       let url = ''
       let params = {}
@@ -157,12 +158,14 @@ export default {
           ids: u
         }
       } else {
-        fileName = 'builtinReport' + '-' + this.getTimeString() + '.pdf' // 文件名称
+        fileName = u.name + '.pdf' // 文件名称
         url = '/report/job/downloadPdf' // 单个 pdf 下载
         params = {
           id: u.id
         }
       }
+      if (n === 'builtin') this.$refs.dataTable.loading = true
+      if (!u) return this.$refs.dataTable.loading = false
       axios.get(url, { responseType: 'blob', params: params }).then(res => {
         if (window.navigator.msSaveOrOpenBlob) {
           // 兼容ie11
@@ -178,6 +181,7 @@ export default {
           a.click()
           a.remove() // 将a标签移除
         }
+        if (n === 'builtin') this.$refs.dataTable.loading = false
       }, error => {
         const $self = this
         const reader = new FileReader()
@@ -191,6 +195,7 @@ export default {
           }
         }
         reader.readAsText(error.response.data)
+        if (n === 'builtin') this.$refs.dataTable.loading = false
       })
     },
     preview (u) {