vxe-table 3.11.4 → 3.11.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vxe-table",
-  "version": "3.11.4",
+  "version": "3.11.5",
   "description": "一个基于 vue 的 PC 端表格组件，支持增删改查、虚拟树、拖拽排序，懒加载、快捷菜单、数据校验、树形结构、打印、导入导出、自定义模板、渲染器、JSON 配置式...",
   "scripts": {
     "update": "npm install --legacy-peer-deps",

package/packages/table/src/table.ts

@@ -1123,6 +1123,7 @@ export default {
     const VxeUITooltipComponent = VxeUI.getComponent<VxeTooltipComponent>('VxeTooltip')
 
     const $xeTable = this
+    const $xeGrid = $xeTable.$xeGrid
 
     const {
       _e,
@@ -1170,6 +1171,7 @@ export default {
       editRules
     } = $xeTable
     const { leftList, rightList } = columnStore
+    const loadingSlot = $scopedSlots.loading
     const currLoading = this._isLoading || loading
     const vSize = computeSize
     const virtualScrollBars = $xeTable.computeVirtualScrollBars
@@ -1357,8 +1359,14 @@ export default {
             icon: loadingOpts.icon,
             text: loadingOpts.text
           }
-        }, this.callSlot($scopedSlots.loading, {}, h))
-        : _e(),
+        }, $xeTable.callSlot(loadingSlot, { $table: $xeTable, $grid: $xeGrid, loading: currLoading }, h))
+        : loadingSlot
+          ? h('div', {
+            class: ['vxe-loading--custom-wrapper', {
+              'is--visible': currLoading
+            }]
+          }, $xeTable.callSlot(loadingSlot, { $table: $xeTable, $grid: $xeGrid, loading: currLoading }, h))
+          : renderEmptyElement($xeTable),
       /**
        * 自定义列
        */
@@ -1370,7 +1378,7 @@ export default {
             customStore
           }
         })
-        : _e(),
+        : renderEmptyElement($xeTable),
       /**
        * 筛选
        */

package/styles/components/table.scss

@@ -45,6 +45,20 @@
   outline: 0;
 }
 
+.vxe-loading--custom-wrapper {
+  display: none;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  z-index: 99;
+  user-select: none;
+  &.is--visible {
+    display: block;
+  }
+}
+
 /*默认的渲染*/
 .vxe-cell,
 .vxe-table--filter-template {