ruoyi-plus-soybean/src/plugins/loading.ts

38 lines
1.0 KiB
TypeScript
Raw Normal View History

// @unocss-include
import { getRgb } from '@sa/color';
import { DARK_CLASS } from '@/constants/app';
import { localStg } from '@/utils/storage';
import { toggleHtmlClass } from '@/utils/common';
import systemLogo from '@/assets/imgs/logo.png';
2025-03-12 22:24:59 +08:00
import { $t } from '@/locales';
2025-04-24 17:36:38 +08:00
export function loading() {
2024-08-16 16:33:11 +08:00
const themeColor = localStg.get('themeColor') || '#2080f0';
const darkMode = localStg.get('darkMode') || false;
const { r, g, b } = getRgb(themeColor);
const primaryColor = `--primary-color: ${r} ${g} ${b}`;
if (darkMode) {
toggleHtmlClass(DARK_CLASS).add();
}
2025-04-24 17:36:38 +08:00
return `
<div class="fixed-center flex-col bg-layout" style="${primaryColor}">
2025-04-23 15:59:45 +08:00
<div class="w-120px h-120px my-36px">
<div class="relative h-full animate-spin">
2025-04-23 15:59:45 +08:00
<img src="${systemLogo}" width="120" />
</div>
</div>
2025-04-23 15:59:45 +08:00
<h2 class="text-28px font-500 text-primary">${$t('system.title')}</h2>
</div>`;
2025-04-24 17:36:38 +08:00
}
2025-04-24 17:36:38 +08:00
export function setupLoading() {
const app = document.getElementById('app');
if (app) {
2025-04-24 17:36:38 +08:00
app.innerHTML = loading();
}
}