feat: |UI| add loading for lazy load component (#597)

This commit is contained in:
Dream Hunter
2025-02-27 00:36:13 +08:00
committed by GitHub
parent 144a792cb2
commit 983300acf4
3 changed files with 17 additions and 3 deletions

View File

@@ -23,7 +23,6 @@ import Telegram from './admin/Telegram.vue';
import Webhook from './admin/Webhook.vue';
import MailWebhook from './admin/MailWebhook.vue';
import WorkerConfig from './admin/WorkerConfig.vue';
import SendMail from './admin/SendMail.vue';
const {
adminAuth, showAdminAuth, adminTab, loading,
@@ -31,6 +30,12 @@ const {
} = useGlobalState()
const message = useMessage()
const SendMail = defineAsyncComponent(() => {
loading.value = true;
return import('./admin/SendMail.vue')
.finally(() => loading.value = false);
});
const authFunc = async () => {
try {
adminAuth.value = tmpAdminAuth.value;

View File

@@ -126,7 +126,9 @@ const menuOptions = computed(() => [
type: menuValue.value == "admin" ? "primary" : "default",
style: "width: 100%",
onClick: async () => {
loading.value = true;
await router.push(getRouterPathWithLang('/admin', locale.value));
loading.value = false;
showMobileMenu.value = false;
}
},
@@ -214,7 +216,9 @@ const logoClick = async () => {
if (logoClickCount.value >= 5) {
logoClickCount.value = 0;
message.info("Change to admin Page");
loading.value = true;
await router.push(getRouterPathWithLang('/admin', locale.value));
loading.value = false;
} else {
logoClickCount.value++;
}

View File

@@ -15,11 +15,16 @@ import Webhook from './index/Webhook.vue';
import Attachment from './index/Attachment.vue';
import About from './common/About.vue';
const SendMail = defineAsyncComponent(() => import('./index/SendMail.vue'));
const { settings, openSettings, indexTab, globalTabplacement } = useGlobalState()
const { loading, settings, openSettings, indexTab, globalTabplacement } = useGlobalState()
const message = useMessage()
const route = useRoute()
const SendMail = defineAsyncComponent(() => {
loading.value = true;
return import('./index/SendMail.vue')
.finally(() => loading.value = false);
});
const { t } = useI18n({
messages: {
en: {