refactor: 只留loading页面 把插件loading去掉

Author: Ohh-889

src/main.tsx

@@ -9,20 +9,10 @@ import FallbackRender from '../ErrorBoundary.tsx';
 import App from './App.tsx';
 import './plugins/assets';
 import { setupI18n } from './locales';
-import { setupAppVersionNotification, setupDayjs, setupIconifyOffline, setupLoading, setupNProgress } from './plugins';
+import { setupAppVersionNotification, setupDayjs, setupIconifyOffline, setupNProgress } from './plugins';
 
-async function setupApp() {
-  await setupI18n();
-
-  setupLoading();
-
-  setupNProgress();
-
-  setupIconifyOffline();
-
-  setupDayjs();
-
-  setupAppVersionNotification();
+function setupApp() {
+  setupI18n();
 
   const container = document.getElementById('root');
 
@@ -39,6 +29,14 @@ async function setupApp() {
       </Provider>
     </ErrorBoundary>
   );
+
+  setupNProgress();
+
+  setupIconifyOffline();
+
+  setupDayjs();
+
+  setupAppVersionNotification();
 }
 
 setupApp();

src/pages/(base)/manage/user/index.tsx

@@ -220,6 +220,7 @@ const UserManage = () => {
 export const handle = {
   i18nKey: 'route.(base)_manage_user',
   icon: 'ic:round-manage-accounts',
+  keepAlive: true,
   order: 1,
   roles: ['R_ADMIN'],
   title: 'manage_user'

src/pages/loading.tsx

@@ -1,10 +1,27 @@
+// @unocss-include
+import { getRgb } from '@sa/color';
 import clsx from 'clsx';
 
 import SystemLogo from '@/components/SystemLogo';
+import { DARK_CLASS } from '@/constants/app';
+import { toggleHtmlClass } from '@/utils/common';
+import { localStg } from '@/utils/storage';
 
 const GlobalLoading = memo(() => {
   const { t } = useTranslation();
 
+  const themeColor = localStg.get('themeColor') || '#646cff';
+
+  const darkMode = localStg.get('darkMode') || false;
+
+  if (darkMode) {
+    toggleHtmlClass(DARK_CLASS).add();
+  }
+
+  const { b, g, r } = getRgb(themeColor);
+
+  const primaryColor = `--primary-color: ${r} ${g} ${b}`;
+
   const loadingClasses = [
     'left-0 top-0',
     'left-0 bottom-0 animate-delay-500',
@@ -13,7 +30,10 @@ const GlobalLoading = memo(() => {
   ];
 
   return (
-    <div className="fixed-center flex-col">
+    <div
+      className="fixed-center flex-col bg-layout"
+      style={primaryColor as React.CSSProperties}
+    >
       <SystemLogo className="size-128px text-primary" />
       <div className="my-36px h-56px w-56px">
         <div className="relative h-full animate-spin">

src/plugins/index.ts

@@ -1,5 +1,4 @@
 export * from './app';
 export * from './dayjs';
 export * from './iconify';
-export * from './loading';
 export * from './nprogress';