@weitutech/by-components 1.1.178 → 1.1.180
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/by-components.common.js +225 -11
- package/lib/by-components.umd.js +225 -11
- package/lib/by-components.umd.min.js +1 -1
- package/lib/index.css +1 -1
- package/package.json +1 -1
|
@@ -74524,11 +74524,18 @@ var component = normalizeComponent(
|
|
|
74524
74524
|
)
|
|
74525
74525
|
|
|
74526
74526
|
/* harmony default export */ var pager = (component.exports);
|
|
74527
|
-
;// ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"5daa4f39-vue-loader-template"}!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/cache-loader/dist/cjs.js??ruleSet[0].use[0]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/table/index.vue?vue&type=template&id=
|
|
74528
|
-
var
|
|
74527
|
+
;// ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"5daa4f39-vue-loader-template"}!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/cache-loader/dist/cjs.js??ruleSet[0].use[0]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/table/index.vue?vue&type=template&id=6582b690
|
|
74528
|
+
var tablevue_type_template_id_6582b690_render = function render() {
|
|
74529
74529
|
var _vm = this,
|
|
74530
74530
|
_c = _vm._self._c;
|
|
74531
|
-
return _c('div',
|
|
74531
|
+
return _c('div', {
|
|
74532
|
+
staticClass: "by-table-wrapper",
|
|
74533
|
+
class: {
|
|
74534
|
+
'custom-loading-mode': _vm.loadingStyle === 'custom' && _vm.loading
|
|
74535
|
+
}
|
|
74536
|
+
}, [_c('div', {
|
|
74537
|
+
staticClass: "vxe-grid-wrapper"
|
|
74538
|
+
}, [_c('vxe-grid', _vm._g(_vm._b({
|
|
74532
74539
|
ref: "xGrid",
|
|
74533
74540
|
on: {
|
|
74534
74541
|
"cell-click": _vm.handleCellClick,
|
|
@@ -74590,7 +74597,7 @@ var tablevue_type_template_id_35ba1298_render = function render() {
|
|
|
74590
74597
|
},
|
|
74591
74598
|
proxy: true
|
|
74592
74599
|
}], null, true)
|
|
74593
|
-
}, 'vxe-grid', _vm.options, false), _vm.eventListeners)), _vm.gridOptions && _vm.gridOptions.customColumnConfig && _vm.gridOptions.customColumnConfig.showCustomColumn ? _c('CustomColumn', {
|
|
74600
|
+
}, 'vxe-grid', _vm.options, false), _vm.eventListeners))], 1), _vm.gridOptions && _vm.gridOptions.customColumnConfig && _vm.gridOptions.customColumnConfig.showCustomColumn ? _c('CustomColumn', {
|
|
74594
74601
|
ref: "CustomColumnRef",
|
|
74595
74602
|
attrs: {
|
|
74596
74603
|
"info-method": _vm.gridOptions.customColumnConfig.infoMethod,
|
|
@@ -74609,7 +74616,7 @@ var tablevue_type_template_id_35ba1298_render = function render() {
|
|
|
74609
74616
|
}
|
|
74610
74617
|
}) : _vm._e()], 1);
|
|
74611
74618
|
};
|
|
74612
|
-
var
|
|
74619
|
+
var tablevue_type_template_id_6582b690_staticRenderFns = [];
|
|
74613
74620
|
|
|
74614
74621
|
// EXTERNAL MODULE: ./node_modules/core-js/modules/es.array.push.js
|
|
74615
74622
|
var es_array_push = __webpack_require__(4114);
|
|
@@ -76655,6 +76662,14 @@ var custom_column_component = normalizeComponent(
|
|
|
76655
76662
|
loading: {
|
|
76656
76663
|
type: Boolean,
|
|
76657
76664
|
default: false
|
|
76665
|
+
},
|
|
76666
|
+
loadingStyle: {
|
|
76667
|
+
// loading样式类型:'custom' 自定义3D旋转圆环样式(默认),'default' 使用vxe-table默认样式
|
|
76668
|
+
type: String,
|
|
76669
|
+
default: 'default',
|
|
76670
|
+
validator(value) {
|
|
76671
|
+
return ['custom', 'default'].includes(value);
|
|
76672
|
+
}
|
|
76658
76673
|
}
|
|
76659
76674
|
},
|
|
76660
76675
|
data() {
|
|
@@ -76683,7 +76698,9 @@ var custom_column_component = normalizeComponent(
|
|
|
76683
76698
|
tableWidth: 1200,
|
|
76684
76699
|
// 默认值,将在客户端初始化
|
|
76685
76700
|
// 是否为移动设备
|
|
76686
|
-
isMobile: false
|
|
76701
|
+
isMobile: false,
|
|
76702
|
+
// MutationObserver实例
|
|
76703
|
+
loadingObserver: null
|
|
76687
76704
|
};
|
|
76688
76705
|
},
|
|
76689
76706
|
mounted() {
|
|
@@ -76697,14 +76714,52 @@ var custom_column_component = normalizeComponent(
|
|
|
76697
76714
|
|
|
76698
76715
|
// 前端分页模式下初始化默认排序
|
|
76699
76716
|
this.initDefaultSortForFrontendPagination();
|
|
76717
|
+
|
|
76718
|
+
// 初始化自定义loading
|
|
76719
|
+
if (this.loadingStyle === 'custom') {
|
|
76720
|
+
this.$nextTick(() => {
|
|
76721
|
+
this.initCustomLoading();
|
|
76722
|
+
// 使用MutationObserver监听DOM变化,确保默认loading被隐藏
|
|
76723
|
+
if (this.$refs.xGrid && this.$refs.xGrid.$el) {
|
|
76724
|
+
this.observeLoadingChanges();
|
|
76725
|
+
}
|
|
76726
|
+
});
|
|
76727
|
+
}
|
|
76700
76728
|
},
|
|
76701
76729
|
beforeDestroy() {
|
|
76702
76730
|
// 确保只在客户端环境中移除事件监听
|
|
76703
76731
|
if (typeof window !== 'undefined') {
|
|
76704
76732
|
this.removeResizeListener();
|
|
76733
|
+
// 清理MutationObserver
|
|
76734
|
+
if (this.loadingObserver) {
|
|
76735
|
+
this.loadingObserver.disconnect();
|
|
76736
|
+
this.loadingObserver = null;
|
|
76737
|
+
}
|
|
76705
76738
|
}
|
|
76706
76739
|
},
|
|
76707
76740
|
watch: {
|
|
76741
|
+
loading(newVal) {
|
|
76742
|
+
if (this.loadingStyle === 'custom') {
|
|
76743
|
+
this.$nextTick(() => {
|
|
76744
|
+
this.updateCustomLoading();
|
|
76745
|
+
});
|
|
76746
|
+
}
|
|
76747
|
+
},
|
|
76748
|
+
loadingStyle() {
|
|
76749
|
+
if (this.loadingStyle === 'custom') {
|
|
76750
|
+
this.$nextTick(() => {
|
|
76751
|
+
this.updateCustomLoading();
|
|
76752
|
+
});
|
|
76753
|
+
} else {
|
|
76754
|
+
// 切换到default样式时,移除自定义loading
|
|
76755
|
+
if (this.$refs.xGrid && this.$refs.xGrid.$el) {
|
|
76756
|
+
const customLoading = this.$refs.xGrid.$el.querySelector('.custom-loading-content');
|
|
76757
|
+
if (customLoading) {
|
|
76758
|
+
customLoading.remove();
|
|
76759
|
+
}
|
|
76760
|
+
}
|
|
76761
|
+
}
|
|
76762
|
+
},
|
|
76708
76763
|
'gridOptions.columns': {
|
|
76709
76764
|
handler(newColumns) {
|
|
76710
76765
|
//这里保存的列宽要恢复至最初未拖动时的列宽
|
|
@@ -76825,9 +76880,19 @@ var custom_column_component = normalizeComponent(
|
|
|
76825
76880
|
copyFields: this.gridOptions.copyFields || [],
|
|
76826
76881
|
emptyText: this.gridOptions.emptyText || '暂无数据',
|
|
76827
76882
|
loading: this.loading,
|
|
76828
|
-
loadingConfig: {
|
|
76829
|
-
|
|
76830
|
-
|
|
76883
|
+
loadingConfig: (() => {
|
|
76884
|
+
const baseConfig = {
|
|
76885
|
+
...this.gridOptions.loadingConfig
|
|
76886
|
+
};
|
|
76887
|
+
// 如果使用自定义loading样式,隐藏默认的loading文字和图标
|
|
76888
|
+
if (this.loadingStyle === 'custom') {
|
|
76889
|
+
baseConfig.text = null;
|
|
76890
|
+
baseConfig.icon = null;
|
|
76891
|
+
} else {
|
|
76892
|
+
baseConfig.text = baseConfig.text || '加载中...';
|
|
76893
|
+
}
|
|
76894
|
+
return baseConfig;
|
|
76895
|
+
})(),
|
|
76831
76896
|
columns: newColumns,
|
|
76832
76897
|
data,
|
|
76833
76898
|
resizableConfig: {
|
|
@@ -77484,6 +77549,155 @@ var custom_column_component = normalizeComponent(
|
|
|
77484
77549
|
});
|
|
77485
77550
|
}
|
|
77486
77551
|
},
|
|
77552
|
+
/**
|
|
77553
|
+
* 初始化自定义loading
|
|
77554
|
+
*/
|
|
77555
|
+
initCustomLoading() {
|
|
77556
|
+
if (this.loadingStyle !== 'custom') return;
|
|
77557
|
+
this.$nextTick(() => {
|
|
77558
|
+
this.updateCustomLoading();
|
|
77559
|
+
});
|
|
77560
|
+
},
|
|
77561
|
+
/**
|
|
77562
|
+
* 监听loading DOM变化,确保默认loading被隐藏
|
|
77563
|
+
*/
|
|
77564
|
+
observeLoadingChanges() {
|
|
77565
|
+
if (!this.$refs.xGrid || !this.$refs.xGrid.$el) return;
|
|
77566
|
+
const gridEl = this.$refs.xGrid.$el;
|
|
77567
|
+
|
|
77568
|
+
// 如果已经有observer,先断开
|
|
77569
|
+
if (this.loadingObserver) {
|
|
77570
|
+
this.loadingObserver.disconnect();
|
|
77571
|
+
}
|
|
77572
|
+
|
|
77573
|
+
// 创建MutationObserver
|
|
77574
|
+
this.loadingObserver = new MutationObserver(() => {
|
|
77575
|
+
if (this.loading && this.loadingStyle === 'custom') {
|
|
77576
|
+
this.hideDefaultLoading();
|
|
77577
|
+
}
|
|
77578
|
+
});
|
|
77579
|
+
|
|
77580
|
+
// 开始监听
|
|
77581
|
+
this.loadingObserver.observe(gridEl, {
|
|
77582
|
+
childList: true,
|
|
77583
|
+
subtree: true
|
|
77584
|
+
});
|
|
77585
|
+
},
|
|
77586
|
+
/**
|
|
77587
|
+
* 强制隐藏默认loading
|
|
77588
|
+
*/
|
|
77589
|
+
hideDefaultLoading() {
|
|
77590
|
+
if (!this.$refs.xGrid || !this.$refs.xGrid.$el) return;
|
|
77591
|
+
const gridEl = this.$refs.xGrid.$el;
|
|
77592
|
+
const loadingEl = gridEl.querySelector('.vxe-loading');
|
|
77593
|
+
if (!loadingEl) return;
|
|
77594
|
+
|
|
77595
|
+
// 隐藏所有可能的默认loading元素
|
|
77596
|
+
const selectors = ['.vxe-loading--spinner', '.vxe-loading--text', '.vxe-icon', 'i[class*="spinner"]', 'i[class*="loading"]', '.vxe-loading--content > *:not(.custom-loading-content)'];
|
|
77597
|
+
selectors.forEach(selector => {
|
|
77598
|
+
const elements = loadingEl.querySelectorAll(selector);
|
|
77599
|
+
elements.forEach(el => {
|
|
77600
|
+
if (!el.closest('.custom-loading-content')) {
|
|
77601
|
+
el.style.display = 'none';
|
|
77602
|
+
el.style.visibility = 'hidden';
|
|
77603
|
+
el.style.opacity = '0';
|
|
77604
|
+
}
|
|
77605
|
+
});
|
|
77606
|
+
});
|
|
77607
|
+
},
|
|
77608
|
+
/**
|
|
77609
|
+
* 更新自定义loading显示
|
|
77610
|
+
*/
|
|
77611
|
+
updateCustomLoading() {
|
|
77612
|
+
if (!this.$refs.xGrid || !this.$refs.xGrid.$el) return;
|
|
77613
|
+
const gridEl = this.$refs.xGrid.$el;
|
|
77614
|
+
const loadingEl = gridEl.querySelector('.vxe-loading');
|
|
77615
|
+
if (!loadingEl) {
|
|
77616
|
+
// 如果loading元素不存在,延迟重试
|
|
77617
|
+
if (this.loading && this.loadingStyle === 'custom') {
|
|
77618
|
+
setTimeout(() => {
|
|
77619
|
+
this.updateCustomLoading();
|
|
77620
|
+
}, 100);
|
|
77621
|
+
}
|
|
77622
|
+
return;
|
|
77623
|
+
}
|
|
77624
|
+
|
|
77625
|
+
// 强制隐藏默认loading
|
|
77626
|
+
this.hideDefaultLoading();
|
|
77627
|
+
let customLoading = loadingEl.querySelector('.custom-loading-content');
|
|
77628
|
+
if (this.loading && this.loadingStyle === 'custom') {
|
|
77629
|
+
if (!customLoading) {
|
|
77630
|
+
var _this$gridOptions$loa;
|
|
77631
|
+
// 获取loading文案配置
|
|
77632
|
+
const loadingText = ((_this$gridOptions$loa = this.gridOptions.loadingConfig) === null || _this$gridOptions$loa === void 0 ? void 0 : _this$gridOptions$loa.text) || '加载中...';
|
|
77633
|
+
|
|
77634
|
+
// 将文案转换为字符数组
|
|
77635
|
+
const textChars = loadingText.split('');
|
|
77636
|
+
|
|
77637
|
+
// 创建自定义loading元素
|
|
77638
|
+
customLoading = document.createElement('div');
|
|
77639
|
+
customLoading.className = 'custom-loading-content';
|
|
77640
|
+
|
|
77641
|
+
// 创建容器
|
|
77642
|
+
const uiverseDiv = document.createElement('div');
|
|
77643
|
+
uiverseDiv.className = 'uiverse-loading-pulse';
|
|
77644
|
+
const loaderContainer = document.createElement('div');
|
|
77645
|
+
loaderContainer.className = 'loader-container';
|
|
77646
|
+
|
|
77647
|
+
// 创建文字元素(使用h3标签)
|
|
77648
|
+
if (loadingText) {
|
|
77649
|
+
const textElement = document.createElement('h3');
|
|
77650
|
+
textElement.className = 'loader-text';
|
|
77651
|
+
|
|
77652
|
+
// 为每个字符创建span,并设置动画延迟
|
|
77653
|
+
textChars.forEach((char, index) => {
|
|
77654
|
+
const charSpan = document.createElement('span');
|
|
77655
|
+
charSpan.className = 'loader-char';
|
|
77656
|
+
charSpan.style.animationDelay = `${index * 0.1}s`;
|
|
77657
|
+
charSpan.textContent = char === ' ' ? '\u00A0' : char; // 使用不间断空格
|
|
77658
|
+
textElement.appendChild(charSpan);
|
|
77659
|
+
});
|
|
77660
|
+
loaderContainer.appendChild(textElement);
|
|
77661
|
+
}
|
|
77662
|
+
|
|
77663
|
+
// 添加旋转圆环
|
|
77664
|
+
for (let i = 0; i < 4; i++) {
|
|
77665
|
+
const ring = document.createElement('div');
|
|
77666
|
+
ring.className = 'loader-ring';
|
|
77667
|
+
loaderContainer.appendChild(ring);
|
|
77668
|
+
}
|
|
77669
|
+
uiverseDiv.appendChild(loaderContainer);
|
|
77670
|
+
customLoading.appendChild(uiverseDiv);
|
|
77671
|
+
loadingEl.appendChild(customLoading);
|
|
77672
|
+
|
|
77673
|
+
// 确保loading在表格中央区域居中显示
|
|
77674
|
+
this.$nextTick(() => {
|
|
77675
|
+
if (customLoading) {
|
|
77676
|
+
customLoading.style.position = 'absolute';
|
|
77677
|
+
customLoading.style.top = '0';
|
|
77678
|
+
customLoading.style.left = '0';
|
|
77679
|
+
customLoading.style.right = '0';
|
|
77680
|
+
customLoading.style.bottom = '0';
|
|
77681
|
+
customLoading.style.display = 'flex';
|
|
77682
|
+
customLoading.style.justifyContent = 'center';
|
|
77683
|
+
customLoading.style.alignItems = 'center';
|
|
77684
|
+
customLoading.style.zIndex = '10001';
|
|
77685
|
+
}
|
|
77686
|
+
});
|
|
77687
|
+
|
|
77688
|
+
// 再次确保默认loading被隐藏
|
|
77689
|
+
setTimeout(() => {
|
|
77690
|
+
this.hideDefaultLoading();
|
|
77691
|
+
}, 50);
|
|
77692
|
+
} else {
|
|
77693
|
+
customLoading.style.display = 'flex';
|
|
77694
|
+
customLoading.style.visibility = 'visible';
|
|
77695
|
+
}
|
|
77696
|
+
} else if (customLoading) {
|
|
77697
|
+
// loading结束时隐藏
|
|
77698
|
+
customLoading.style.display = 'none';
|
|
77699
|
+
}
|
|
77700
|
+
},
|
|
77487
77701
|
/**
|
|
77488
77702
|
* 确保默认排序高亮(数据变化时调用,支持前端分页和虚拟滚动)
|
|
77489
77703
|
*/
|
|
@@ -77527,8 +77741,8 @@ var custom_column_component = normalizeComponent(
|
|
|
77527
77741
|
;
|
|
77528
77742
|
var table_component = normalizeComponent(
|
|
77529
77743
|
components_tablevue_type_script_lang_js,
|
|
77530
|
-
|
|
77531
|
-
|
|
77744
|
+
tablevue_type_template_id_6582b690_render,
|
|
77745
|
+
tablevue_type_template_id_6582b690_staticRenderFns,
|
|
77532
77746
|
false,
|
|
77533
77747
|
null,
|
|
77534
77748
|
null,
|
package/lib/by-components.umd.js
CHANGED
|
@@ -74534,11 +74534,18 @@ var component = normalizeComponent(
|
|
|
74534
74534
|
)
|
|
74535
74535
|
|
|
74536
74536
|
/* harmony default export */ var pager = (component.exports);
|
|
74537
|
-
;// ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"5daa4f39-vue-loader-template"}!./node_modules/babel-loader/lib/index.js??clonedRuleSet-82.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/cache-loader/dist/cjs.js??ruleSet[0].use[0]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/table/index.vue?vue&type=template&id=
|
|
74538
|
-
var
|
|
74537
|
+
;// ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"5daa4f39-vue-loader-template"}!./node_modules/babel-loader/lib/index.js??clonedRuleSet-82.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/cache-loader/dist/cjs.js??ruleSet[0].use[0]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/table/index.vue?vue&type=template&id=6582b690
|
|
74538
|
+
var tablevue_type_template_id_6582b690_render = function render() {
|
|
74539
74539
|
var _vm = this,
|
|
74540
74540
|
_c = _vm._self._c;
|
|
74541
|
-
return _c('div',
|
|
74541
|
+
return _c('div', {
|
|
74542
|
+
staticClass: "by-table-wrapper",
|
|
74543
|
+
class: {
|
|
74544
|
+
'custom-loading-mode': _vm.loadingStyle === 'custom' && _vm.loading
|
|
74545
|
+
}
|
|
74546
|
+
}, [_c('div', {
|
|
74547
|
+
staticClass: "vxe-grid-wrapper"
|
|
74548
|
+
}, [_c('vxe-grid', _vm._g(_vm._b({
|
|
74542
74549
|
ref: "xGrid",
|
|
74543
74550
|
on: {
|
|
74544
74551
|
"cell-click": _vm.handleCellClick,
|
|
@@ -74600,7 +74607,7 @@ var tablevue_type_template_id_35ba1298_render = function render() {
|
|
|
74600
74607
|
},
|
|
74601
74608
|
proxy: true
|
|
74602
74609
|
}], null, true)
|
|
74603
|
-
}, 'vxe-grid', _vm.options, false), _vm.eventListeners)), _vm.gridOptions && _vm.gridOptions.customColumnConfig && _vm.gridOptions.customColumnConfig.showCustomColumn ? _c('CustomColumn', {
|
|
74610
|
+
}, 'vxe-grid', _vm.options, false), _vm.eventListeners))], 1), _vm.gridOptions && _vm.gridOptions.customColumnConfig && _vm.gridOptions.customColumnConfig.showCustomColumn ? _c('CustomColumn', {
|
|
74604
74611
|
ref: "CustomColumnRef",
|
|
74605
74612
|
attrs: {
|
|
74606
74613
|
"info-method": _vm.gridOptions.customColumnConfig.infoMethod,
|
|
@@ -74619,7 +74626,7 @@ var tablevue_type_template_id_35ba1298_render = function render() {
|
|
|
74619
74626
|
}
|
|
74620
74627
|
}) : _vm._e()], 1);
|
|
74621
74628
|
};
|
|
74622
|
-
var
|
|
74629
|
+
var tablevue_type_template_id_6582b690_staticRenderFns = [];
|
|
74623
74630
|
|
|
74624
74631
|
// EXTERNAL MODULE: ./node_modules/core-js/modules/es.array.push.js
|
|
74625
74632
|
var es_array_push = __webpack_require__(4114);
|
|
@@ -76665,6 +76672,14 @@ var custom_column_component = normalizeComponent(
|
|
|
76665
76672
|
loading: {
|
|
76666
76673
|
type: Boolean,
|
|
76667
76674
|
default: false
|
|
76675
|
+
},
|
|
76676
|
+
loadingStyle: {
|
|
76677
|
+
// loading样式类型:'custom' 自定义3D旋转圆环样式(默认),'default' 使用vxe-table默认样式
|
|
76678
|
+
type: String,
|
|
76679
|
+
default: 'default',
|
|
76680
|
+
validator(value) {
|
|
76681
|
+
return ['custom', 'default'].includes(value);
|
|
76682
|
+
}
|
|
76668
76683
|
}
|
|
76669
76684
|
},
|
|
76670
76685
|
data() {
|
|
@@ -76693,7 +76708,9 @@ var custom_column_component = normalizeComponent(
|
|
|
76693
76708
|
tableWidth: 1200,
|
|
76694
76709
|
// 默认值,将在客户端初始化
|
|
76695
76710
|
// 是否为移动设备
|
|
76696
|
-
isMobile: false
|
|
76711
|
+
isMobile: false,
|
|
76712
|
+
// MutationObserver实例
|
|
76713
|
+
loadingObserver: null
|
|
76697
76714
|
};
|
|
76698
76715
|
},
|
|
76699
76716
|
mounted() {
|
|
@@ -76707,14 +76724,52 @@ var custom_column_component = normalizeComponent(
|
|
|
76707
76724
|
|
|
76708
76725
|
// 前端分页模式下初始化默认排序
|
|
76709
76726
|
this.initDefaultSortForFrontendPagination();
|
|
76727
|
+
|
|
76728
|
+
// 初始化自定义loading
|
|
76729
|
+
if (this.loadingStyle === 'custom') {
|
|
76730
|
+
this.$nextTick(() => {
|
|
76731
|
+
this.initCustomLoading();
|
|
76732
|
+
// 使用MutationObserver监听DOM变化,确保默认loading被隐藏
|
|
76733
|
+
if (this.$refs.xGrid && this.$refs.xGrid.$el) {
|
|
76734
|
+
this.observeLoadingChanges();
|
|
76735
|
+
}
|
|
76736
|
+
});
|
|
76737
|
+
}
|
|
76710
76738
|
},
|
|
76711
76739
|
beforeDestroy() {
|
|
76712
76740
|
// 确保只在客户端环境中移除事件监听
|
|
76713
76741
|
if (typeof window !== 'undefined') {
|
|
76714
76742
|
this.removeResizeListener();
|
|
76743
|
+
// 清理MutationObserver
|
|
76744
|
+
if (this.loadingObserver) {
|
|
76745
|
+
this.loadingObserver.disconnect();
|
|
76746
|
+
this.loadingObserver = null;
|
|
76747
|
+
}
|
|
76715
76748
|
}
|
|
76716
76749
|
},
|
|
76717
76750
|
watch: {
|
|
76751
|
+
loading(newVal) {
|
|
76752
|
+
if (this.loadingStyle === 'custom') {
|
|
76753
|
+
this.$nextTick(() => {
|
|
76754
|
+
this.updateCustomLoading();
|
|
76755
|
+
});
|
|
76756
|
+
}
|
|
76757
|
+
},
|
|
76758
|
+
loadingStyle() {
|
|
76759
|
+
if (this.loadingStyle === 'custom') {
|
|
76760
|
+
this.$nextTick(() => {
|
|
76761
|
+
this.updateCustomLoading();
|
|
76762
|
+
});
|
|
76763
|
+
} else {
|
|
76764
|
+
// 切换到default样式时,移除自定义loading
|
|
76765
|
+
if (this.$refs.xGrid && this.$refs.xGrid.$el) {
|
|
76766
|
+
const customLoading = this.$refs.xGrid.$el.querySelector('.custom-loading-content');
|
|
76767
|
+
if (customLoading) {
|
|
76768
|
+
customLoading.remove();
|
|
76769
|
+
}
|
|
76770
|
+
}
|
|
76771
|
+
}
|
|
76772
|
+
},
|
|
76718
76773
|
'gridOptions.columns': {
|
|
76719
76774
|
handler(newColumns) {
|
|
76720
76775
|
//这里保存的列宽要恢复至最初未拖动时的列宽
|
|
@@ -76835,9 +76890,19 @@ var custom_column_component = normalizeComponent(
|
|
|
76835
76890
|
copyFields: this.gridOptions.copyFields || [],
|
|
76836
76891
|
emptyText: this.gridOptions.emptyText || '暂无数据',
|
|
76837
76892
|
loading: this.loading,
|
|
76838
|
-
loadingConfig: {
|
|
76839
|
-
|
|
76840
|
-
|
|
76893
|
+
loadingConfig: (() => {
|
|
76894
|
+
const baseConfig = {
|
|
76895
|
+
...this.gridOptions.loadingConfig
|
|
76896
|
+
};
|
|
76897
|
+
// 如果使用自定义loading样式,隐藏默认的loading文字和图标
|
|
76898
|
+
if (this.loadingStyle === 'custom') {
|
|
76899
|
+
baseConfig.text = null;
|
|
76900
|
+
baseConfig.icon = null;
|
|
76901
|
+
} else {
|
|
76902
|
+
baseConfig.text = baseConfig.text || '加载中...';
|
|
76903
|
+
}
|
|
76904
|
+
return baseConfig;
|
|
76905
|
+
})(),
|
|
76841
76906
|
columns: newColumns,
|
|
76842
76907
|
data,
|
|
76843
76908
|
resizableConfig: {
|
|
@@ -77494,6 +77559,155 @@ var custom_column_component = normalizeComponent(
|
|
|
77494
77559
|
});
|
|
77495
77560
|
}
|
|
77496
77561
|
},
|
|
77562
|
+
/**
|
|
77563
|
+
* 初始化自定义loading
|
|
77564
|
+
*/
|
|
77565
|
+
initCustomLoading() {
|
|
77566
|
+
if (this.loadingStyle !== 'custom') return;
|
|
77567
|
+
this.$nextTick(() => {
|
|
77568
|
+
this.updateCustomLoading();
|
|
77569
|
+
});
|
|
77570
|
+
},
|
|
77571
|
+
/**
|
|
77572
|
+
* 监听loading DOM变化,确保默认loading被隐藏
|
|
77573
|
+
*/
|
|
77574
|
+
observeLoadingChanges() {
|
|
77575
|
+
if (!this.$refs.xGrid || !this.$refs.xGrid.$el) return;
|
|
77576
|
+
const gridEl = this.$refs.xGrid.$el;
|
|
77577
|
+
|
|
77578
|
+
// 如果已经有observer,先断开
|
|
77579
|
+
if (this.loadingObserver) {
|
|
77580
|
+
this.loadingObserver.disconnect();
|
|
77581
|
+
}
|
|
77582
|
+
|
|
77583
|
+
// 创建MutationObserver
|
|
77584
|
+
this.loadingObserver = new MutationObserver(() => {
|
|
77585
|
+
if (this.loading && this.loadingStyle === 'custom') {
|
|
77586
|
+
this.hideDefaultLoading();
|
|
77587
|
+
}
|
|
77588
|
+
});
|
|
77589
|
+
|
|
77590
|
+
// 开始监听
|
|
77591
|
+
this.loadingObserver.observe(gridEl, {
|
|
77592
|
+
childList: true,
|
|
77593
|
+
subtree: true
|
|
77594
|
+
});
|
|
77595
|
+
},
|
|
77596
|
+
/**
|
|
77597
|
+
* 强制隐藏默认loading
|
|
77598
|
+
*/
|
|
77599
|
+
hideDefaultLoading() {
|
|
77600
|
+
if (!this.$refs.xGrid || !this.$refs.xGrid.$el) return;
|
|
77601
|
+
const gridEl = this.$refs.xGrid.$el;
|
|
77602
|
+
const loadingEl = gridEl.querySelector('.vxe-loading');
|
|
77603
|
+
if (!loadingEl) return;
|
|
77604
|
+
|
|
77605
|
+
// 隐藏所有可能的默认loading元素
|
|
77606
|
+
const selectors = ['.vxe-loading--spinner', '.vxe-loading--text', '.vxe-icon', 'i[class*="spinner"]', 'i[class*="loading"]', '.vxe-loading--content > *:not(.custom-loading-content)'];
|
|
77607
|
+
selectors.forEach(selector => {
|
|
77608
|
+
const elements = loadingEl.querySelectorAll(selector);
|
|
77609
|
+
elements.forEach(el => {
|
|
77610
|
+
if (!el.closest('.custom-loading-content')) {
|
|
77611
|
+
el.style.display = 'none';
|
|
77612
|
+
el.style.visibility = 'hidden';
|
|
77613
|
+
el.style.opacity = '0';
|
|
77614
|
+
}
|
|
77615
|
+
});
|
|
77616
|
+
});
|
|
77617
|
+
},
|
|
77618
|
+
/**
|
|
77619
|
+
* 更新自定义loading显示
|
|
77620
|
+
*/
|
|
77621
|
+
updateCustomLoading() {
|
|
77622
|
+
if (!this.$refs.xGrid || !this.$refs.xGrid.$el) return;
|
|
77623
|
+
const gridEl = this.$refs.xGrid.$el;
|
|
77624
|
+
const loadingEl = gridEl.querySelector('.vxe-loading');
|
|
77625
|
+
if (!loadingEl) {
|
|
77626
|
+
// 如果loading元素不存在,延迟重试
|
|
77627
|
+
if (this.loading && this.loadingStyle === 'custom') {
|
|
77628
|
+
setTimeout(() => {
|
|
77629
|
+
this.updateCustomLoading();
|
|
77630
|
+
}, 100);
|
|
77631
|
+
}
|
|
77632
|
+
return;
|
|
77633
|
+
}
|
|
77634
|
+
|
|
77635
|
+
// 强制隐藏默认loading
|
|
77636
|
+
this.hideDefaultLoading();
|
|
77637
|
+
let customLoading = loadingEl.querySelector('.custom-loading-content');
|
|
77638
|
+
if (this.loading && this.loadingStyle === 'custom') {
|
|
77639
|
+
if (!customLoading) {
|
|
77640
|
+
var _this$gridOptions$loa;
|
|
77641
|
+
// 获取loading文案配置
|
|
77642
|
+
const loadingText = ((_this$gridOptions$loa = this.gridOptions.loadingConfig) === null || _this$gridOptions$loa === void 0 ? void 0 : _this$gridOptions$loa.text) || '加载中...';
|
|
77643
|
+
|
|
77644
|
+
// 将文案转换为字符数组
|
|
77645
|
+
const textChars = loadingText.split('');
|
|
77646
|
+
|
|
77647
|
+
// 创建自定义loading元素
|
|
77648
|
+
customLoading = document.createElement('div');
|
|
77649
|
+
customLoading.className = 'custom-loading-content';
|
|
77650
|
+
|
|
77651
|
+
// 创建容器
|
|
77652
|
+
const uiverseDiv = document.createElement('div');
|
|
77653
|
+
uiverseDiv.className = 'uiverse-loading-pulse';
|
|
77654
|
+
const loaderContainer = document.createElement('div');
|
|
77655
|
+
loaderContainer.className = 'loader-container';
|
|
77656
|
+
|
|
77657
|
+
// 创建文字元素(使用h3标签)
|
|
77658
|
+
if (loadingText) {
|
|
77659
|
+
const textElement = document.createElement('h3');
|
|
77660
|
+
textElement.className = 'loader-text';
|
|
77661
|
+
|
|
77662
|
+
// 为每个字符创建span,并设置动画延迟
|
|
77663
|
+
textChars.forEach((char, index) => {
|
|
77664
|
+
const charSpan = document.createElement('span');
|
|
77665
|
+
charSpan.className = 'loader-char';
|
|
77666
|
+
charSpan.style.animationDelay = `${index * 0.1}s`;
|
|
77667
|
+
charSpan.textContent = char === ' ' ? '\u00A0' : char; // 使用不间断空格
|
|
77668
|
+
textElement.appendChild(charSpan);
|
|
77669
|
+
});
|
|
77670
|
+
loaderContainer.appendChild(textElement);
|
|
77671
|
+
}
|
|
77672
|
+
|
|
77673
|
+
// 添加旋转圆环
|
|
77674
|
+
for (let i = 0; i < 4; i++) {
|
|
77675
|
+
const ring = document.createElement('div');
|
|
77676
|
+
ring.className = 'loader-ring';
|
|
77677
|
+
loaderContainer.appendChild(ring);
|
|
77678
|
+
}
|
|
77679
|
+
uiverseDiv.appendChild(loaderContainer);
|
|
77680
|
+
customLoading.appendChild(uiverseDiv);
|
|
77681
|
+
loadingEl.appendChild(customLoading);
|
|
77682
|
+
|
|
77683
|
+
// 确保loading在表格中央区域居中显示
|
|
77684
|
+
this.$nextTick(() => {
|
|
77685
|
+
if (customLoading) {
|
|
77686
|
+
customLoading.style.position = 'absolute';
|
|
77687
|
+
customLoading.style.top = '0';
|
|
77688
|
+
customLoading.style.left = '0';
|
|
77689
|
+
customLoading.style.right = '0';
|
|
77690
|
+
customLoading.style.bottom = '0';
|
|
77691
|
+
customLoading.style.display = 'flex';
|
|
77692
|
+
customLoading.style.justifyContent = 'center';
|
|
77693
|
+
customLoading.style.alignItems = 'center';
|
|
77694
|
+
customLoading.style.zIndex = '10001';
|
|
77695
|
+
}
|
|
77696
|
+
});
|
|
77697
|
+
|
|
77698
|
+
// 再次确保默认loading被隐藏
|
|
77699
|
+
setTimeout(() => {
|
|
77700
|
+
this.hideDefaultLoading();
|
|
77701
|
+
}, 50);
|
|
77702
|
+
} else {
|
|
77703
|
+
customLoading.style.display = 'flex';
|
|
77704
|
+
customLoading.style.visibility = 'visible';
|
|
77705
|
+
}
|
|
77706
|
+
} else if (customLoading) {
|
|
77707
|
+
// loading结束时隐藏
|
|
77708
|
+
customLoading.style.display = 'none';
|
|
77709
|
+
}
|
|
77710
|
+
},
|
|
77497
77711
|
/**
|
|
77498
77712
|
* 确保默认排序高亮(数据变化时调用,支持前端分页和虚拟滚动)
|
|
77499
77713
|
*/
|
|
@@ -77537,8 +77751,8 @@ var custom_column_component = normalizeComponent(
|
|
|
77537
77751
|
;
|
|
77538
77752
|
var table_component = normalizeComponent(
|
|
77539
77753
|
components_tablevue_type_script_lang_js,
|
|
77540
|
-
|
|
77541
|
-
|
|
77754
|
+
tablevue_type_template_id_6582b690_render,
|
|
77755
|
+
tablevue_type_template_id_6582b690_staticRenderFns,
|
|
77542
77756
|
false,
|
|
77543
77757
|
null,
|
|
77544
77758
|
null,
|