comic-plus
Version:
<p align="center"> <img width="200px" src="./logo.png"/> </p>
93 lines (92 loc) • 1.73 kB
JavaScript
import { createVNode, render } from "vue";
import _sfc_main from "./src/main.vue.mjs";
var vm, timer, hideTimer, progress = 0;
function createLoadingbarInstance() {
const VNode = createVNode(_sfc_main);
render(VNode, document.body);
vm = VNode.component;
}
function updateInstanceRefs(keysObj) {
Object.keys(keysObj).forEach((key) => {
vm.exposed[key].value = keysObj[key];
});
}
function hide() {
if (hideTimer) {
clearTimeout(hideTimer);
hideTimer = null;
}
hideTimer = setTimeout(() => {
updateInstanceRefs({
show: false
});
}, 800);
}
function start() {
if (!vm) createLoadingbarInstance();
progress = 0;
updateInstanceRefs({
status: "loading",
show: true,
progress
});
createTimer();
}
function finish() {
clearTimer();
if (!vm) createLoadingbarInstance();
progress = 100;
updateInstanceRefs({
status: "finish",
show: true,
progress
});
hide();
}
function error() {
clearTimer();
if (!vm) createLoadingbarInstance();
progress = 100;
updateInstanceRefs({
status: "error",
show: true,
progress
});
hide();
}
function update(value) {
clearTimer();
if (!vm) createLoadingbarInstance();
progress = value;
updateInstanceRefs({
status: "loading",
show: true,
progress
});
}
function createTimer() {
clearTimer();
timer = setInterval(() => {
progress += Math.floor(Math.random() * 3 + 1);
if (progress > 98) {
clearTimer();
return;
}
vm.exposed.progress.value = progress;
}, 200);
}
function clearTimer() {
if (timer) {
clearInterval(timer);
timer = null;
}
}
const CuLoadingbar = {
start,
finish,
error,
update
};
export {
CuLoadingbar
};