1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var vue = require('vue');
require('../../../utils/index.js');
require('../../config-provider/index.js');
var style = require('../../../utils/dom/style.js');
var useGlobalConfig = require('../../config-provider/src/hooks/use-global-config.js');
function createLoadingComponent(options) {
let afterLeaveTimer;
const afterLeaveFlag = vue.ref(false);
const data = vue.reactive({
...options,
originalPosition: "",
originalOverflow: "",
visible: false
});
function setText(text) {
data.text = text;
}
function destroySelf() {
const target = data.parent;
const ns = vm.ns;
if (!target.vLoadingAddClassList) {
let loadingNumber = target.getAttribute("loading-number");
loadingNumber = Number.parseInt(loadingNumber) - 1;
if (!loadingNumber) {
style.removeClass(target, ns.bm("parent", "relative"));
target.removeAttribute("loading-number");
} else {
target.setAttribute("loading-number", loadingNumber.toString());
}
style.removeClass(target, ns.bm("parent", "hidden"));
}
removeElLoadingChild();
loadingInstance.unmount();
}
function removeElLoadingChild() {
var _a, _b;
(_b = (_a = vm.$el) == null ? void 0 : _a.parentNode) == null ? void 0 : _b.removeChild(vm.$el);
}
function close() {
var _a;
if (options.beforeClose && !options.beforeClose())
return;
afterLeaveFlag.value = true;
clearTimeout(afterLeaveTimer);
afterLeaveTimer = window.setTimeout(handleAfterLeave, 400);
data.visible = false;
(_a = options.closed) == null ? void 0 : _a.call(options);
}
function handleAfterLeave() {
if (!afterLeaveFlag.value)
return;
const target = data.parent;
afterLeaveFlag.value = false;
target.vLoadingAddClassList = void 0;
destroySelf();
}
const elLoadingComponent = vue.defineComponent({
name: "ElLoading",
setup(_, { expose }) {
const { ns, zIndex } = useGlobalConfig.useGlobalComponentSettings("loading");
expose({
ns,
zIndex
});
return () => {
const svg = data.spinner || data.svg;
const spinner = vue.h("svg", {
class: "circular",
viewBox: data.svgViewBox ? data.svgViewBox : "0 0 50 50",
...svg ? { innerHTML: svg } : {}
}, [
vue.h("circle", {
class: "path",
cx: "25",
cy: "25",
r: "20",
fill: "none"
})
]);
const spinnerText = data.text ? vue.h("p", { class: ns.b("text") }, [data.text]) : void 0;
return vue.h(vue.Transition, {
name: ns.b("fade"),
onAfterLeave: handleAfterLeave
}, {
default: vue.withCtx(() => [
vue.withDirectives(vue.createVNode("div", {
style: {
backgroundColor: data.background || ""
},
class: [
ns.b("mask"),
data.customClass,
data.fullscreen ? "is-fullscreen" : ""
]
}, [
vue.h("div", {
class: ns.b("spinner")
}, [spinner, spinnerText])
]), [[vue.vShow, data.visible]])
])
});
};
}
});
const loadingInstance = vue.createApp(elLoadingComponent);
const vm = loadingInstance.mount(document.createElement("div"));
return {
...vue.toRefs(data),
setText,
removeElLoadingChild,
close,
handleAfterLeave,
vm,
get $el() {
return vm.$el;
}
};
}
exports.createLoadingComponent = createLoadingComponent;
//# sourceMappingURL=loading.js.map