chore

element-variables.scss

@@ -6,19 +6,19 @@
 
 /* Transition
 -------------------------- */
-$--all-transition: all .3s cubic-bezier(.645,.045,.355,1) !default;
+$--all-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1) !default;
 $--fade-transition: opacity 300ms cubic-bezier(0.23, 1, 0.32, 1) !default;
 $--fade-linear-transition: opacity 200ms linear !default;
 $--md-fade-transition: transform 300ms cubic-bezier(0.23, 1, 0.32, 1), opacity 300ms cubic-bezier(0.23, 1, 0.32, 1) !default;
-$--border-transition-base: border-color .2s cubic-bezier(.645,.045,.355,1) !default;
-$--color-transition-base: color .2s cubic-bezier(.645,.045,.355,1) !default;
+$--border-transition-base: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) !default;
+$--color-transition-base: color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) !default;
 
 /* Color
 -------------------------- */
 /// color|1|Brand Color|0
-$--color-primary: #2D74E7 !default;
+$--color-primary: #2d74e7 !default;
 /// color|1|Background Color|4
-$--color-white: #FFFFFF !default;
+$--color-white: #ffffff !default;
 /// color|1|Background Color|4
 $--color-black: #000000 !default;
 $--color-primary-light-1: mix($--color-white, $--color-primary, 10%) !default; /* 53a8ff */
@@ -31,9 +31,9 @@ $--color-primary-light-7: mix($--color-white, $--color-primary, 70%) !default; /
 $--color-primary-light-8: mix($--color-white, $--color-primary, 80%) !default; /* d9ecff */
 $--color-primary-light-9: mix($--color-white, $--color-primary, 90%) !default; /* ecf5ff */
 /// color|1|Functional Color|1
-$--color-success: #67C23A !default;
+$--color-success: #67c23a !default;
 /// color|1|Functional Color|1
-$--color-warning: #E6A23C !default;
+$--color-warning: #e6a23c !default;
 /// color|1|Functional Color|1
 $--color-danger: #e7304e !default;
 /// color|1|Functional Color|1
@@ -49,25 +49,25 @@ $--color-warning-lighter: mix($--color-white, $--color-warning, 90%) !default;
 $--color-danger-lighter: mix($--color-white, $--color-danger, 90%) !default;
 $--color-info-lighter: mix($--color-white, $--color-info, 90%) !default;
 /// color|1|Font Color|2
-$--color-text-primary: #303133 !default;
+$--color-text-primary: #333333 !default;
 /// color|1|Font Color|2
 $--color-text-regular: #606266 !default;
 /// color|1|Font Color|2
 $--color-text-secondary: #909399 !default;
 /// color|1|Font Color|2
-$--color-text-placeholder: #C0C4CC !default;
+$--color-text-placeholder: #c0c4cc !default;
 /// color|1|Border Color|3
-$--border-color-base: #DCDFE6 !default;
+$--border-color-base: #dcdfe6 !default;
 /// color|1|Border Color|3
-$--border-color-light: #E4E7ED !default;
+$--border-color-light: #e4e7ed !default;
 /// color|1|Border Color|3
-$--border-color-lighter: #EBEEF5 !default;
+$--border-color-lighter: #ebeef5 !default;
 /// color|1|Border Color|3
-$--border-color-extra-light: #F2F6FC !default;
+$--border-color-extra-light: #f2f6fc !default;
 
 // Background
 /// color|1|Background Color|4
-$--background-color-base: #F5F7FA !default;
+$--background-color-base: #f5f7fa !default;
 
 /* Link
 -------------------------- */
@@ -91,9 +91,9 @@ $--border-radius-zero: 0 !default;
 
 // Box-shadow
 /// boxShadow|1|Shadow|1
-$--box-shadow-base: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04) !default;
+$--box-shadow-base: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04) !default;
 // boxShadow|1|Shadow|1
-$--box-shadow-dark: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .12) !default;
+$--box-shadow-dark: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.12) !default;
 /// boxShadow|1|Shadow|1
 $--box-shadow-light: 0 2px 12px 0 rgba(0, 0, 0, 0.1) !default;
 
@@ -210,8 +210,6 @@ $--checkbox-button-checked-font-color: $--color-white !default;
 /// color||Color|0
 $--checkbox-button-checked-border-color: $--color-primary !default;
 
-
-
 /* Radio
 -------------------------- */
 /// fontSize||Font|1
@@ -480,8 +478,8 @@ $--cascader-menu-radius: $--border-radius-base !default;
 $--cascader-menu-border: solid 1px $--border-color-light !default;
 $--cascader-menu-shadow: $--box-shadow-light !default;
 $--cascader-node-background-hover: $--background-color-base !default;
-$--cascader-node-color-disabled:$--color-text-placeholder !default;
-$--cascader-color-empty:$--color-text-placeholder !default;
+$--cascader-node-color-disabled: $--color-text-placeholder !default;
+$--cascader-color-empty: $--color-text-placeholder !default;
 $--cascader-tag-background: #f0f2f5;
 
 /* Group
@@ -591,7 +589,6 @@ $--button-info-background-color: $--color-info !default;
 $--button-hover-tint-percent: 20% !default;
 $--button-active-shade-percent: 10% !default;
 
-
 /* cascader
 -------------------------- */
 $--cascader-height: 200px !default;
@@ -639,7 +636,7 @@ $--table-row-hover-background-color: $--background-color-base !default;
 $--table-current-row-background-color: $--color-primary-light-9 !default;
 /// color||Color|0
 $--table-header-background-color: $--color-white !default;
-$--table-fixed-box-shadow: 0 0 10px rgba(0, 0, 0, .12) !default;
+$--table-fixed-box-shadow: 0 0 10px rgba(0, 0, 0, 0.12) !default;
 
 /* Pagination
 -------------------------- */
@@ -827,8 +824,8 @@ $--loading-fullscreen-spinner-size: 50px !default;
 
 /* Scrollbar
 --------------------------*/
-$--scrollbar-background-color: rgba($--color-text-secondary, .3) !default;
-$--scrollbar-hover-background-color: rgba($--color-text-secondary, .5) !default;
+$--scrollbar-background-color: rgba($--color-text-secondary, 0.3) !default;
+$--scrollbar-hover-background-color: rgba($--color-text-secondary, 0.5) !default;
 
 /* Carousel
 --------------------------*/
@@ -937,7 +934,7 @@ $--link-info-font-color: $--color-info !default;
 /// border||Other|4
 $--calendar-border: $--table-border !default;
 /// color||Other|4
-$--calendar-selected-background-color: #F2F8FE !default;
+$--calendar-selected-background-color: #f2f8fe !default;
 $--calendar-cell-width: 85px !default;
 
 /* Form
@@ -950,7 +947,7 @@ $--form-label-font-size: $--font-size-base !default;
 /// color||Color|0
 $--avatar-font-color: #fff !default;
 /// color||Color|0
-$--avatar-background-color: #C0C4CC !default;
+$--avatar-background-color: #c0c4cc !default;
 /// fontSize||Font Size|1
 $--avatar-text-font-size: 14px !default;
 /// fontSize||Font Size|1
@@ -972,23 +969,49 @@ $--lg: 1200px !default;
 $--xl: 1920px !default;
 
 $--breakpoints: (
-  'xs' : (max-width: $--sm - 1),
-  'sm' : (min-width: $--sm),
-  'md' : (min-width: $--md),
-  'lg' : (min-width: $--lg),
-  'xl' : (min-width: $--xl)
+  'xs': (
+    max-width: $--sm - 1
+  ),
+  'sm': (
+    min-width: $--sm
+  ),
+  'md': (
+    min-width: $--md
+  ),
+  'lg': (
+    min-width: $--lg
+  ),
+  'xl': (
+    min-width: $--xl
+  )
 );
 
 $--breakpoints-spec: (
-  'xs-only' : (max-width: $--sm - 1),
-  'sm-and-up' : (min-width: $--sm),
-  'sm-only': "(min-width: #{$--sm}) and (max-width: #{$--md - 1})",
-  'sm-and-down': (max-width: $--md - 1),
-  'md-and-up' : (min-width: $--md),
-  'md-only': "(min-width: #{$--md}) and (max-width: #{$--lg - 1})",
-  'md-and-down': (max-width: $--lg - 1),
-  'lg-and-up' : (min-width: $--lg),
-  'lg-only': "(min-width: #{$--lg}) and (max-width: #{$--xl - 1})",
-  'lg-and-down': (max-width: $--xl - 1),
-  'xl-only' : (min-width: $--xl),
+  'xs-only': (
+    max-width: $--sm - 1
+  ),
+  'sm-and-up': (
+    min-width: $--sm
+  ),
+  'sm-only': '(min-width: #{$--sm}) and (max-width: #{$--md - 1})',
+  'sm-and-down': (
+    max-width: $--md - 1
+  ),
+  'md-and-up': (
+    min-width: $--md
+  ),
+  'md-only': '(min-width: #{$--md}) and (max-width: #{$--lg - 1})',
+  'md-and-down': (
+    max-width: $--lg - 1
+  ),
+  'lg-and-up': (
+    min-width: $--lg
+  ),
+  'lg-only': '(min-width: #{$--lg}) and (max-width: #{$--xl - 1})',
+  'lg-and-down': (
+    max-width: $--xl - 1
+  ),
+  'xl-only': (
+    min-width: $--xl
+  )
 );

src/components/BaseTable/index.vue

@@ -2,8 +2,7 @@
   <div class="base-table" :style="{ paddingBottom: pagination ? 0 : '15px' }">
     <el-table class="table" ref="table" v-on="$listeners" v-bind="{ ...defaultAttrs, ...attrs }" :style="style">
       <template slot="empty">
-        <img src="@/assets/icon/null.png" alt="" />
-        <p style="margin-top: -7px">暂无数据</p>
+        <img src="@/assets/icon/null.png" alt="暂无数据" />
       </template>
       <template v-for="{ prop, type, _slot, ...col } of columns">
         <template v-if="_slot">
@@ -19,6 +18,7 @@
           v-bind="{ headerAlign: 'center', align: 'center', prop, type, ...col }"
         />
       </template>
+      <slot />
     </el-table>
     <el-pagination
       v-if="pagination && pagination.total > 0"
@@ -68,14 +68,6 @@ export default Vue.extend({
         size: 'medium',
         'row-key': 'id',
         stripe: true,
-        'header-cell-style': {
-          background: '#Eaf1Fd',
-          color: 'rgb(50,59,65)',
-          height: '46px'
-        },
-        'cell-style': {
-          height: '40px'
-        },
         height: 'calc(100% - 50px)'
         // highlightCurrentRow: true
       } as Partial<ElTable>
@@ -113,32 +105,53 @@ export default Vue.extend({
   background-color: #fff;
   z-index: 99;
 
-  >>> .el-table--striped {
-    /deep/ .el-table__body tr.el-table__row--striped.el-table__row--striped.el-table__row--striped td {
-      background-color: #f3f7fe;
+  >>> .el-table {
+    .el-table__header {
+      th.el-table__cell {
+        height: 40px;
+        color: $--color-text-primary;
+        background-color: rgba($--color-primary, 0.15);
+        padding: 3px 0;
+      }
     }
-  }
-  >>> .el-table__body {
-    tr.hover-row {
-      &.el-table__row--striped.current-row,
-      &.current-row,
-      &.el-table__row--striped,
-      & {
-        & > td.el-table__cell {
-          background-color: rgba(45, 116, 231, 0.1);
-          color: #f19944;
+    .el-table__body {
+      tr.el-table__row {
+        td.el-table__cell {
+          height: 34px;
+          color: #555;
+          background-color: rgba($--color-primary, 0.06);
+          padding: 3px 0;
+        }
+        &.el-table__row--striped {
+          td.el-table__cell {
+            background-color: $--color-white;
+          }
+        }
+        &.current-row {
+          td.el-table__cell {
+            background-color: rgba($--color-primary, 0.7);
+            color: $--color-white;
+          }
+          &:hover {
+            td.el-table__cell {
+              color: $--color-warning;
+            }
+          }
+        }
+        &:not(.current-row):hover {
+          td.el-table__cell {
+            background-color: rgba($--color-primary, 0.1);
+            color: $--color-warning;
+          }
         }
       }
     }
-  }
-  .table {
-    flex: 1 1 auto;
-    // min-height: 100%;
-    >>> td.el-table__cell {
-      border-color: rgba(#dedede, 0.6);
+    &:not(.el-table--border) {
+      .el-table__body tr.el-table__row td.el-table__cell {
+        border: 0;
+      }
     }
-    >>> .el-table__fixed,
-    >>> .el-table__fixed-right {
+    &__fixed-right {
       box-shadow: none;
     }
   }

src/components/Table/index.vue

@@ -1,12 +1,12 @@
 <template>
   <!-- 表格组件 -->
-  <div :style="'height:'+tableheightSet(tableheight)">
+  <div :style="'height:' + tableheightSet(tableheight)">
     <el-table
       ref="multipleTable"
       :v-loading="loading"
       :data="tableData"
       tooltip-effect="dark"
-      :style="{width: '100%'}"
+      :style="{ width: '100%' }"
       :height="'calc(100% - 45px)'"
       :max-height="'calc(100% - 45px)'"
       :border="border"
@@ -33,14 +33,22 @@
       <!-- highlight-current-row -->
       <!-- @current-change="TablehandleCurrentChange" -->
       <template slot="empty">
-        <img src="@/assets/icon/null.png" alt="">
+        <img src="@/assets/icon/null.png" alt="" />
         <p class="empty-p">暂无数据</p>
       </template>
       <el-table-column v-if="multiple" type="selection" width="40" />
       <el-table-column v-if="forId" label="序号" type="index" width="50" />
       <el-table-column
-        v-for="(item,colIndex) of column.filter(
-          ele => ele.prop && ele.prop !== 'image'&& ele.prop !== 'lqSl'&& ele.slotScoped !== 'tags'&& ele.slotScoped !== 'operation'&& ele.slotScoped !== 'operationIcon'&& ele.slotScoped !== 'father')"
+        v-for="(item, colIndex) of column.filter(
+          (ele) =>
+            ele.prop &&
+            ele.prop !== 'image' &&
+            ele.prop !== 'lqSl' &&
+            ele.slotScoped !== 'tags' &&
+            ele.slotScoped !== 'operation' &&
+            ele.slotScoped !== 'operationIcon' &&
+            ele.slotScoped !== 'father'
+        )"
         :key="colIndex"
         :prop="item.prop"
         :label="item.label"
@@ -57,10 +65,12 @@
             <span>--</span>
           </template> -->
           <template v-if="item.formatter">
-            <span v-html="(item.formatter)(row,item.prop,row[item.prop],colIndex)" />
+            <span v-html="item.formatter(row, item.prop, row[item.prop], colIndex)" />
           </template>
           <template v-else>
-            <span v-if="row[item.prop]||String(row[item.prop])==='0'||String(row[item.prop])==='00'">{{ row[item.prop] }}</span>
+            <span v-if="row[item.prop] || String(row[item.prop]) === '0' || String(row[item.prop]) === '00'">{{
+              row[item.prop]
+            }}</span>
             <span v-else>-</span>
           </template>
         </template>
@@ -68,32 +78,41 @@
 
       <!-- 附件下载 -->
       <el-table-column
-        v-for="item of column.filter(
-          ele => ele.slotScoped === 'dwonfile')"
+        v-for="item of column.filter((ele) => ele.slotScoped === 'dwonfile')"
         :key="item.prop"
         :label="item.label"
         :width="item.width"
       >
         <template v-if="data.row.isdownfile" slot-scope="data">
-          <span v-for="act in item.acts" :key="act.emitWay" :style="{color: act.color, cursor: 'pointer', marginRight: '10px'}" @click.stop="operation(act.emitWay, data)">{{ act.operation }}</span>
+          <span
+            v-for="act in item.acts"
+            :key="act.emitWay"
+            :style="{ color: act.color, cursor: 'pointer', marginRight: '10px' }"
+            @click.stop="operation(act.emitWay, data)"
+            >{{ act.operation }}</span
+          >
         </template>
       </el-table-column>
       <!-- 操作 -->
       <el-table-column
-        v-for="item of column.filter(
-          ele => ele.slotScoped === 'action')"
+        v-for="item of column.filter((ele) => ele.slotScoped === 'action')"
         :key="item.prop"
         :label="item.label"
         :width="item.width"
       >
         <template slot-scope="data">
-          <span v-for="act in item.acts" :key="act.emitWay" :style="{color: act.color, cursor: 'pointer', marginRight: '10px'}" @click.stop="operation(act.emitWay, data)">{{ act.operation }}</span>
+          <span
+            v-for="act in item.acts"
+            :key="act.emitWay"
+            :style="{ color: act.color, cursor: 'pointer', marginRight: '10px' }"
+            @click.stop="operation(act.emitWay, data)"
+            >{{ act.operation }}</span
+          >
         </template>
       </el-table-column>
       <!-- 多级 -->
       <el-table-column
-        v-for="item of column.filter(
-          ele => ele.slotScoped === 'father')"
+        v-for="item of column.filter((ele) => ele.slotScoped === 'father')"
         :key="item.label"
         :label="item.label"
         :width="item.width"
@@ -108,20 +127,22 @@
       </el-table-column>
       <!-- 操作 -->
       <el-table-column
-        v-for="item of column.filter(
-          ele => ele.slotScoped === 'operation')"
+        v-for="item of column.filter((ele) => ele.slotScoped === 'operation')"
         :key="item.label"
         :label="item.label"
         :width="item.width"
       >
         <template slot-scope="scope">
-          <span :style="{color:'#409EFF', cursor: 'pointer', marginRight: '10px'}" @click.stop="operationClick(scope.row)">{{ item.prop }}</span>
+          <span
+            :style="{ color: '#409EFF', cursor: 'pointer', marginRight: '10px' }"
+            @click.stop="operationClick(scope.row)"
+            >{{ item.prop }}</span
+          >
         </template>
       </el-table-column>
       <!-- 图标操作 -->
       <el-table-column
-        v-for="item of column.filter(
-          ele => ele.slotScoped === 'operationIcon')"
+        v-for="item of column.filter((ele) => ele.slotScoped === 'operationIcon')"
         :key="item.label"
         :label="item.label"
         :width="item.width"
@@ -134,8 +155,7 @@
       </el-table-column>
       <!-- //筛选 -->
       <el-table-column
-        v-for="item of column.filter(
-          ele => ele.slotScoped === 'tags')"
+        v-for="item of column.filter((ele) => ele.slotScoped === 'tags')"
         :key="item.prop"
         :label="item.label"
         :prop="item.prop"
@@ -145,18 +165,15 @@
         filter-placement="bottom-end"
       >
         <template slot-scope="scope">
-          <el-tag
-            :type="scope.row[item.prop] === '0' ? 'primary' : 'danger' "
-            disable-transitions
-          >{{ tagNamelist[scope.row[item.prop]] }}</el-tag>
+          <el-tag :type="scope.row[item.prop] === '0' ? 'primary' : 'danger'" disable-transitions>{{
+            tagNamelist[scope.row[item.prop]]
+          }}</el-tag>
         </template>
       </el-table-column>
       <!-- sortable排序 show-overflow-tooltip影藏 -->
       <!-- 图片 -->
       <el-table-column
-        v-for="item in column.filter(
-          ele => ele.prop === 'image'
-        )"
+        v-for="item in column.filter((ele) => ele.prop === 'image')"
         :key="item.prop"
         :prop="item.prop"
         :label="item.label"
@@ -164,16 +181,14 @@
       >
         <template slot-scope="scope">
           <el-popover placement="top-start" title trigger="click">
-            <img :src="scope.row.image" alt style="width: 100%;height: 100%">
-            <img slot="reference" :src="scope.row.image" style="width: 50px;height: 50px">
+            <img :src="scope.row.image" alt style="width: 100%;height: 100%" />
+            <img slot="reference" :src="scope.row.image" style="width: 50px;height: 50px" />
           </el-popover>
         </template>
       </el-table-column>
       <!-- //加入计数器 -->
       <el-table-column
-        v-for="item in column.filter(
-          ele => ele.prop === 'lqSl'
-        )"
+        v-for="item in column.filter((ele) => ele.prop === 'lqSl')"
         :key="item.prop"
         :prop="item.prop"
         :label="item.label"
@@ -181,12 +196,7 @@
       >
         <template slot-scope="scope">
           <div @click.stop>
-            <el-input-number
-              v-model="scope.row.lqSl"
-              :min="0"
-              :max="scope.row.kcNum"
-              size="mini"
-            />
+            <el-input-number v-model="scope.row.lqSl" :min="0" :max="scope.row.kcNum" size="mini" />
           </div>
 
           <!-- @change="handleCareOrderItemNumChange(scope.row)" -->
@@ -196,7 +206,7 @@
     <el-pagination
       v-if="pagination"
       :current-page="currentpage"
-      :page-sizes="[10, 20, 30, 50, 100,1000]"
+      :page-sizes="[10, 20, 30, 50, 100, 1000]"
       :page-size="pagesize"
       :total="total"
       layout="total, sizes, prev, pager, next, jumper"
@@ -361,11 +371,11 @@ export default {
     }
   },
   methods: {
-    tableheightSet(val){
-      const valType= typeof val;
-      if(valType=='number'){
-        return val+'px';
-      }else{
+    tableheightSet(val) {
+      const valType = typeof val
+      if (valType == 'number') {
+        return val + 'px'
+      } else {
         return val
       }
     },
@@ -395,7 +405,7 @@ export default {
     cellStyleF({ row, column, rowIndex, columnIndex }) {
       if (this.cellStyle.length > 0) {
         let style = {}
-        this.cellStyle.forEach(item => {
+        this.cellStyle.forEach((item) => {
           if (columnIndex === item.index) {
             if (row[item.field] === item.value) {
               style = item.style
@@ -454,7 +464,7 @@ export default {
     },
     rowClick(row, column, event) {
       this.$emit('rowClick', row, column)
-      const findRow = this.selectionRow.find(c => c.rowIndex == row.rowIndex)
+      const findRow = this.selectionRow.find((c) => c.rowIndex == row.rowIndex)
       if (findRow) {
         this.$refs.multipleTable.toggleRowSelection(row, false)
         return
@@ -464,9 +474,9 @@ export default {
     },
     tableRowClassName({ row, rowIndex }) {
       let rowName = ''
-      const findRow = this.selectionRow.find(c => c.rowIndex === row.rowIndex)
+      const findRow = this.selectionRow.find((c) => c.rowIndex === row.rowIndex)
       if (findRow) {
-        rowName = 'current-row '// elementUI 默认高亮行的class类 也可通过css覆盖改变背景颜色
+        rowName = 'current-row ' // elementUI 默认高亮行的class类 也可通过css覆盖改变背景颜色
       }
       return rowName // 也可以再加上其他类名 如果有需求的话
     },
@@ -483,20 +493,19 @@ export default {
   }
 }
 </script>
-<style lang='scss'>
-
+<style lang="scss" scoped>
 //斑马线颜色
 .el-table--striped .el-table__body tr.el-table__row--striped.el-table__row--striped.el-table__row--striped td {
-  background-color:  rgba(45,116,231, 0.05);
+  background-color: rgba(45, 116, 231, 0.05);
 }
 //行高亮样式点击当前行样式背景高亮
-.el-table__body /deep/  tr.current-row >td{
+.el-table__body /deep/ tr.current-row > td {
   background: #fdf3ea !important;
-  color: #f19944 ;
+  color: #f19944;
 }
 //实现hover前行样式背景高亮
-.el-table--enable-row-hover .el-table__body tr:hover>td {
-  background-color:  rgba(45,116,231, 0.1);
+.el-table--enable-row-hover .el-table__body tr:hover > td {
+  background-color: rgba(45, 116, 231, 0.1);
   color: #f19944;
 }
 // 去除自定义表格header和body不对其方式
@@ -505,20 +514,20 @@ export default {
 }
 .el-table td,
 .el-table th {
-  padding: 2px 0  !important;
+  padding: 2px 0 !important;
 }
 .el-table th > .cell {
   white-space: nowrap;
 }
-.el-table__empty-text{
+.el-table__empty-text {
   margin-top: 30px;
-  line-height:30px;
-  .empty-p{
+  line-height: 30px;
+  .empty-p {
     margin-top: -7px;
   }
 }
-.el-table__body tr.current-row>td{
-  background-color: #69A8EA !important;
+.el-table__body tr.current-row > td {
+  background-color: #69a8ea !important;
   color: #fff;
 }
 </style>

src/permission.ts

@@ -8,11 +8,11 @@ import getPageTitle from '@/utils/get-page-title'
 
 import { ERROR } from '@/router/routes'
 
-NProgress.configure({ showSpinner: false }) // NProgress配置
+NProgress.configure({ showSpinner: true, height: 50 }) // NProgress配置
 
 const whiteList = ['/login'] // 无重定向白名单
 
-router.beforeEach(async(to, from, next) => {
+router.beforeEach(async (to, from, next) => {
   // 开始进度条
   NProgress.start()
 
@@ -21,7 +21,7 @@ router.beforeEach(async(to, from, next) => {
 
   // 确定客户是否已登录
   function check() {
-    return new Promise(resolve => {
+    return new Promise((resolve) => {
       let result = false
       const token = sessionStorage.getItem('token') || false
       const userId = sessionStorage.getItem('userId') || false
@@ -43,16 +43,24 @@ router.beforeEach(async(to, from, next) => {
       const addRoutes = store.getters.addRoutes && store.getters.addRoutes.length > 0
       if (addRoutes) {
         //初始化地图资源
-        const appconfig=await store.dispatch('gis/initGISResource')
+        const appconfig = await store.dispatch('gis/initGISResource')
         console.log(appconfig)
         next()
       } else {
         try {
           // 获取路由
-          
-          const excludeRoutes = ['marketing', 'meterReadingManage', 'businessManage', 'meterServiceManage', 'hotlineManage', 'productionOperations', 'pipeNets']
+
+          const excludeRoutes = [
+            'marketing',
+            'meterReadingManage',
+            'businessManage',
+            'meterServiceManage',
+            'hotlineManage',
+            'productionOperations',
+            'pipeNets'
+          ]
           let accessRoutes = await store.dispatch('routeSetting/getRouter')
-          accessRoutes = accessRoutes.filter(item => {
+          accessRoutes = accessRoutes.filter((item) => {
             if (!excludeRoutes.includes(item.name)) {
               return item
             }

src/styles/base.scss

@@ -348,6 +348,10 @@ div:focus {
 
 .el-table__empty-text {
   img {
-    width: 120px;
+    max-width: 154px;
   }
 }
+
+.cell .el-image {
+  vertical-align: middle;
+}

src/views/zhpt/index.vue

@@ -33,7 +33,7 @@
             "
           /> -->
           <div id="mapView" class="mapView">
-            <cesium-map></cesium-map>
+            <!-- <cesium-map></cesium-map> -->
             <!-- <div
               id="any"
               ref="any"