by2025/admin-vben5
9
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: And surface switching loading optimization

Browse Source
This commit is contained in:
vben
2024-06-23 19:39:44 +08:00
parent 6afed34437
commit 24aab5b4bb
24 changed files with 596 additions and 1696 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
packages/@core/uikit/shadcn-ui/src/components/spinner/spinner.vue
View File

@@ -20,7 +20,7 @@ defineOptions({
const props = withDefaults(defineProps<Props>(), {
minLoadingTime: 50,
});
const startTime = ref(0);
// const startTime = ref(0);
const showSpinner = ref(false);
const renderSpinner = ref(true);
const timer = ref<ReturnType<typeof setTimeout>>();
@@ -33,11 +33,12 @@ watch(
clearTimeout(timer.value);
return;
}
startTime.value = performance.now();
timer.value = setTimeout(() => {
const loadingTime = performance.now() - startTime.value;
showSpinner.value = loadingTime > props.minLoadingTime;
// startTime.value = performance.now();
timer.value = setTimeout(() => {
// const loadingTime = performance.now() - startTime.value;
showSpinner.value = true;
if (showSpinner.value) {
renderSpinner.value = true;
}
@@ -49,13 +50,14 @@ watch(
);
function onTransitionEnd() {
renderSpinner.value = false;
if (!showSpinner.value) {
renderSpinner.value = false;
}
}
</script>
<template>
<div
v-if="renderSpinner"
:class="{
'invisible opacity-0': !showSpinner,
}"