@pubinfo/core 2.0.0-beta.26 → 2.0.0-beta.28

package/dist/utils/index.d.ts

@@ -5,6 +5,12 @@ type ConditionalExceptType<T extends Record<PropertyKey, any>, Type> = {
 export declare function resolveRoutePath(basePath?: string, routePath?: string): string;
 export declare function normalizePrimitiveToFunction<T extends Record<PropertyKey, any>>(options: T): ConditionalExceptType<T, Primitive>;
 export declare function objectToPaths(obj: Record<string, any>, prefix?: string): string[];
+/**
+ * 基于 `import.meta.glob` 读取 `iconMap`
+ */
+export declare function loadIconsFromGlob(modules: Record<string, {
+    default: string;
+}>): Record<string, string>;
 export * from './cleanup';
 export * from './crypto';
 export { default as eventBus } from './eventBus';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pubinfo/core",
   "type": "module",
-  "version": "2.0.0-beta.26",
+  "version": "2.0.0-beta.28",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
@@ -23,34 +23,34 @@
     "types"
   ],
   "peerDependencies": {
-    "alova": "^3.2.10",
+    "alova": "^3.2.13",
     "pinia": "^2.3.1",
-    "vue": "^3.5.13",
-    "vue-i18n": "^10.0.5",
-    "vue-router": "^4.5.0",
-    "@pubinfo/config": "2.0.0-beta.26"
+    "vue": "^3.5.16",
+    "vue-i18n": "^10.0.7",
+    "vue-router": "^4.5.1",
+    "@pubinfo/config": "2.0.0-beta.28"
   },
   "dependencies": {
-    "@alova/adapter-axios": "^2.0.13",
+    "@alova/adapter-axios": "^2.0.14",
     "@ant-design/icons-vue": "^7.0.1",
     "@headlessui/vue": "^1.7.23",
-    "@imengyu/vue3-context-menu": "^1.4.4",
-    "@pubinfo/pro-components": "^1.7.0",
+    "@imengyu/vue3-context-menu": "^1.5.0",
+    "@pubinfo/pro-components": "^1.7.1",
     "@unocss/reset": "^65.5.0",
-    "@vueuse/core": "^13.0.0",
-    "@vueuse/integrations": "^13.0.0",
+    "@vueuse/core": "^13.3.0",
+    "@vueuse/integrations": "^13.3.0",
     "ant-design-vue": "^4.2.6",
-    "axios": "^1.8.1",
-    "consola": "^3.4.0",
+    "axios": "^1.9.0",
+    "consola": "^3.4.2",
     "floating-vue": "5.2.2",
     "hookable": "^5.5.3",
-    "hotkeys-js": "^3.13.9",
+    "hotkeys-js": "^3.13.10",
     "jsencrypt": "^3.3.2",
     "lodash-es": "^4.17.21",
     "md5": "^2.3.0",
     "mitt": "^3.0.1",
     "nprogress": "^0.2.0",
-    "overlayscrollbars": "^2.11.1",
+    "overlayscrollbars": "^2.11.3",
     "overlayscrollbars-vue": "^0.5.9",
     "path-browserify": "^1.0.1",
     "path-to-regexp": "^6.3.0",
@@ -60,7 +60,7 @@
     "zxcvbn": "^4.4.2"
   },
   "devDependencies": {
-    "@iconify/json": "^2.2.312",
+    "@iconify/json": "^2.2.343",
     "@iconify/vue": "^4.3.0",
     "@pubinfo/openapi": "^0.8.4",
     "@pubinfo/preset-openapi": "^0.8.4",
@@ -70,22 +70,22 @@
     "@types/path-browserify": "^1.0.3",
     "@types/sortablejs": "^1.15.8",
     "@types/zxcvbn": "^4.4.5",
-    "@vitejs/plugin-vue": "^5.2.1",
-    "@vitejs/plugin-vue-jsx": "^4.1.1",
-    "alova": "^3.2.10",
+    "@vitejs/plugin-vue": "^5.2.4",
+    "@vitejs/plugin-vue-jsx": "^4.2.0",
+    "alova": "^3.2.13",
     "pinia": "^2.3.1",
     "sass": "1.83.0",
-    "type-fest": "^4.36.0",
+    "type-fest": "^4.41.0",
     "unocss": "^65.5.0",
     "unplugin-auto-import": "^0.18.6",
     "unplugin-icons": "^0.22.0",
     "unplugin-vue-components": "^0.27.5",
-    "vite": "^6.2.0",
-    "vite-plugin-dts": "^4.5.3",
-    "vue": "^3.5.13",
-    "vue-i18n": "^10.0.5",
-    "vue-router": "^4.5.0",
-    "@pubinfo/config": "2.0.0-beta.26"
+    "vite": "^6.3.5",
+    "vite-plugin-dts": "^4.5.4",
+    "vue": "^3.5.16",
+    "vue-i18n": "^10.0.7",
+    "vue-router": "^4.5.1",
+    "@pubinfo/config": "2.0.0-beta.28"
   },
   "scripts": {
     "dev": "vite build -w -m watch",

package/src/api/modules/configData/xitongpeizhifuwu.ts

@@ -63,7 +63,7 @@ export function postSysconfigAddOrUpdateBackgroundImage<
     if (item !== undefined && item !== null) {
       if (typeof item === 'object' && !(item instanceof File)) {
         if (Array.isArray(item)) {
-          item.forEach((f) => formData.append(ele, f || ''));
+          item.forEach(f => formData.append(ele, f || ''));
         }
         else {
           formData.append(ele, JSON.stringify(item));
@@ -110,7 +110,7 @@ export function postSysconfigAddOrUpdateBackgroundSmallImage<
     if (item !== undefined && item !== null) {
       if (typeof item === 'object' && !(item instanceof File)) {
         if (Array.isArray(item)) {
-          item.forEach((f) => formData.append(ele, f || ''));
+          item.forEach(f => formData.append(ele, f || ''));
         }
         else {
           formData.append(ele, JSON.stringify(item));
@@ -152,7 +152,7 @@ export function postSysconfigAddOrUpdateLogImage<
     if (item !== undefined && item !== null) {
       if (typeof item === 'object' && !(item instanceof File)) {
         if (Array.isArray(item)) {
-          item.forEach((f) => formData.append(ele, f || ''));
+          item.forEach(f => formData.append(ele, f || ''));
         }
         else {
           formData.append(ele, JSON.stringify(item));

package/src/components/PubinfoApp/index.vue

@@ -9,7 +9,7 @@ const route = useRoute();
 const { auth } = useAuth();
 
 const isAuth = computed(() => {
-  return route.matched.every((item) => auth(item.meta.auth ?? ''));
+  return route.matched.every(item => auth(item.meta.auth ?? ''));
 });
 </script>
 

package/src/components/PubinfoIcon/index.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { Icon } from '@iconify/vue';
 import { useProvider } from '../PubinfoProvider';
+import { iconRegistry } from './register';
 
 defineOptions({
   name: 'PubinfoIcon',
@@ -72,7 +73,8 @@ function _loadIcon() {
   if (!loadIcon && outputType.value === 'custom') {
     return new Error('Need pro `loadIcon`, according to [PubinfoProvider].');
   }
-  return loadIcon?.(props.name);
+
+  return loadIcon?.(props.name) ?? iconRegistry.get(props.name);
 }
 </script>
 

package/src/components/PubinfoIcon/register.ts

@@ -0,0 +1,19 @@
+type IconMap = Record<string, string>;
+
+export class IconRegistry {
+  private iconMap: IconMap = {};
+
+  register(icons: IconMap) {
+    this.iconMap = { ...this.iconMap, ...icons };
+  }
+
+  get(name: string): string | undefined {
+    return this.iconMap[name];
+  }
+
+  getAll(): IconMap {
+    return this.iconMap;
+  }
+}
+
+export const iconRegistry = new IconRegistry();

package/src/components/PubinfoProvider/index.ts

@@ -19,7 +19,6 @@ export default defineComponent({
   props: {
     loadIcon: {
       type: Function as PubinfoProviderProps['loadIcon'],
-      required: true,
     },
   },
   setup(props, { slots }) {
@@ -27,7 +26,7 @@ export default defineComponent({
 
     createPubinfoProvider({
       loadIcon(name) {
-        return props.loadIcon(name) ?? provider?.loadIcon?.(name);
+        return props?.loadIcon?.(name) ?? provider?.loadIcon?.(name);
       },
     });
 

package/src/create.ts

@@ -6,6 +6,7 @@ import { createRouter, createWebHashHistory } from 'vue-router';
 
 import { GetAPIValidateIp } from './api/system/app';
 
+import { iconRegistry } from './components/PubinfoIcon/register';
 import { createPubinfoContext, hooks } from './context';
 import { setupDirectives } from './directives';
 import { setupLayout } from './layout';
@@ -13,6 +14,7 @@ import { setupI18n } from './locales';
 import { extractModules, resolveModules } from './modules';
 import { constantRoutes, setupRouterGuard } from './route';
 import { setupStore } from './stores';
+import { loadIconsFromGlob } from './utils';
 
 export function createPubinfo(
   App: Component,
@@ -45,6 +47,7 @@ export function createPubinfo(
       app,
       store,
       router,
+      iconRegistry,
     };
 
     app.use(store);
@@ -80,6 +83,10 @@ export function createPubinfo(
 }
 
 function setupBasic(context: Context) {
+  // register icons
+  const iconMap = loadIconsFromGlob(import.meta.glob('./assets/icons/*.svg', { eager: true }));
+  context.iconRegistry.register(iconMap);
+
   setupStore(context);
   setupRouterGuard(context);
   setupDirectives(context);

package/src/interface.ts

@@ -1,6 +1,7 @@
 import type { Pinia } from 'pinia';
 import type { App } from 'vue';
 import type { Router, RouterOptions as VueRouterOptions } from 'vue-router';
+import type { IconRegistry } from './components/PubinfoIcon/register';
 
 type PartialKeys<T, Keys extends keyof T> = Omit<T, Keys> & Partial<Pick<T, Keys>>;
 
@@ -10,6 +11,7 @@ export interface Context {
   app: App<Element>
   store: Pinia
   router: Router
+  iconRegistry: IconRegistry
 }
 
 export interface Options {

package/src/layout/Layout.vue

@@ -1,5 +1,4 @@
 <script setup lang="ts">
-import { PubinfoProvider } from '@/components';
 import RiLogoutBoxLine from '~icons/ri/logout-box-line';
 import BackTop from './components/BackTop/index.vue';
 import LayoutContent from './components/Content/index.vue';
@@ -49,78 +48,70 @@ watch(() => routeInfo.path, () => {
     });
   }
 });
-
-function loadIcon(name: string) {
-  const modules = (import.meta as any).glob('../assets/icons/*', { eager: true });
-  const path = `../assets/icons/${name}.svg`;
-  return modules[path]?.default;
-}
 </script>
 
 <template>
-  <PubinfoProvider :load-icon="loadIcon">
-    <div
-      class="layout"
-      :style="{
-        '--g-main-sidebar-actual-width': mainSidebarActualWidth,
-        '--g-sub-sidebar-actual-width': subSidebarActualWidth,
-      }"
-    >
-      <div id="app-main" :class="{ 'main-page-maximize': settingsStore.mainPageMaximizeStatus }">
-        <slot name="header">
-          <LayoutHeader />
-        </slot>
-
-        <div class="wrapper">
-          <div
-            class="sidebar-container"
-            :class="{ show: settingsStore.mode === 'mobile' && !settingsStore.settings.menu.subMenuCollapse }"
-          >
-            <!-- TODO 这种写法会导致侧边栏模式的布局下，有样式问题 -->
-            <!-- <slot name="sidebar">
+  <div
+    class="layout"
+    :style="{
+      '--g-main-sidebar-actual-width': mainSidebarActualWidth,
+      '--g-sub-sidebar-actual-width': subSidebarActualWidth,
+    }"
+  >
+    <div id="app-main" :class="{ 'main-page-maximize': settingsStore.mainPageMaximizeStatus }">
+      <slot name="header">
+        <LayoutHeader />
+      </slot>
+
+      <div class="wrapper">
+        <div
+          class="sidebar-container"
+          :class="{ show: settingsStore.mode === 'mobile' && !settingsStore.settings.menu.subMenuCollapse }"
+        >
+          <!-- TODO 这种写法会导致侧边栏模式的布局下，有样式问题 -->
+          <!-- <slot name="sidebar">
               <Sidebar />
             </slot> -->
 
-            <MainSidebar />
-            <SubSidebar />
-          </div>
-
-          <div
-            class="sidebar-mask"
-            :class="{ show: settingsStore.mode === 'mobile' && !settingsStore.settings.menu.subMenuCollapse }"
-            @click="settingsStore.toggleSidebarCollapse()"
-          />
-
-          <div class="main-container" :style="{ 'padding-bottom': routeInfo.meta.paddingBottom }">
-            <slot name="topbar">
-              <Topbar />
-            </slot>
+          <MainSidebar />
+          <SubSidebar />
+        </div>
 
-            <div class="main">
-              <div
-                v-show="settingsStore.mainPageMaximizeStatus"
-                class="exit-main-page-maximize"
-                @click="settingsStore.setMainPageMaximize()"
-              >
-                <RiLogoutBoxLine />
-              </div>
-
-              <slot>
-                <LayoutContent />
-              </slot>
+        <div
+          class="sidebar-mask"
+          :class="{ show: settingsStore.mode === 'mobile' && !settingsStore.settings.menu.subMenuCollapse }"
+          @click="settingsStore.toggleSidebarCollapse()"
+        />
+
+        <div class="main-container" :style="{ 'padding-bottom': routeInfo.meta.paddingBottom }">
+          <slot name="topbar">
+            <Topbar />
+          </slot>
+
+          <div class="main">
+            <div
+              v-show="settingsStore.mainPageMaximizeStatus"
+              class="exit-main-page-maximize"
+              @click="settingsStore.setMainPageMaximize()"
+            >
+              <RiLogoutBoxLine />
             </div>
 
-            <slot name="footer">
-              <Copyright />
+            <slot>
+              <LayoutContent />
             </slot>
           </div>
+
+          <slot name="footer">
+            <Copyright />
+          </slot>
         </div>
       </div>
-
-      <SettingBar />
-      <BackTop />
     </div>
-  </PubinfoProvider>
+
+    <SettingBar />
+    <BackTop />
+  </div>
 </template>
 
 <style lang="scss" scoped>

package/src/layout/components/Content/index.vue

@@ -7,25 +7,46 @@ defineOptions({
   name: 'LayoutContent',
 });
 
-const routeInfo = useRoute();
+const _route = useRoute();
 const { settingsStore, keepAliveStore } = useContext();
 
-const isIframe = computed(() => !!routeInfo.meta.iframe);
-const isLink = computed(() => !!routeInfo.meta.link);
+const isIframe = computed(() => !!_route.meta.iframe);
+const isLink = computed(() => !!_route.meta.link);
+
+function EmptyWrapper(_: any, { slots }: { slots: any }) {
+  return slots?.default?.();
+}
+
+const Provider = computed(() => {
+  const metaProvider = _route.matched?.[0]?.meta?.provider;
+
+  if (!metaProvider) {
+    return EmptyWrapper;
+  };
+
+  // 是函数，认为是 () => import(...)
+  if (typeof metaProvider === 'function') {
+    return defineAsyncComponent(metaProvider);
+  }
+
+  return metaProvider;
+});
 </script>
 
 <template>
   <RouterView v-slot="{ Component, route }">
-    <Transition :name="settingsStore.settings.mainPage.enableTransition ? settingsStore.settings.mainPage.transitionMode : ''" mode="out-in" appear>
-      <KeepAlive :include="keepAliveStore.list">
-        <component
-          :is="Component"
-          v-show="!(isIframe || isLink)"
-          :key="route.fullPath"
-          class="page-container"
-        />
-      </KeepAlive>
-    </Transition>
+    <component :is="Provider">
+      <Transition :name="settingsStore.settings.mainPage.enableTransition ? settingsStore.settings.mainPage.transitionMode : ''" mode="out-in" appear>
+        <KeepAlive :include="keepAliveStore.list">
+          <component
+            :is="Component"
+            v-show="!(isIframe || isLink)"
+            :key="route.fullPath"
+            class="page-container"
+          />
+        </KeepAlive>
+      </Transition>
+    </component>
   </RouterView>
 
   <IframeView v-show="isIframe && !isLink" />

package/src/layout/components/SettingBar/components/SettingThemes.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import type { colorScheme, cssVarKey } from '@pubinfo/config/themes';
 import { useTheme } from '@/composables';
-import { themes } from '@pubinfo/config/themes';
+import { getThemes } from '@pubinfo/config/themes';
 import JamBookmarkF from '~icons/jam/bookmark-f';
 import PajamasCheckCircleFilled from '~icons/pajamas/check-circle-filled';
 import { useContext } from '../../../composables/useContext';
@@ -30,8 +30,10 @@ const benchmark: cssVarKey[] = [
   '--g-sub-sidebar-bg',
 ];
 
-const themeList = computed<ThemeListCard[]>(() =>
-  Object.keys(themes).map((key) => {
+const themeList = computed<ThemeListCard[]>(() => {
+  const themes = getThemes();
+
+  return Object.keys(themes).map((key) => {
     const value = themes[key];
     const colors = benchmark.map((cssVar) => {
       const cssValue = value[cssVar].startsWith('#')
@@ -48,8 +50,8 @@ const themeList = computed<ThemeListCard[]>(() =>
     };
   }).filter(cssVarScheme =>
     cssVarScheme.value['color-scheme'] === app.value.colorScheme,
-  ),
-);
+  );
+});
 
 function clickHandle(item: ThemeListCard) {
   const label = item.label;

package/src/layout/components/Sidebar/MainSidebar.vue

@@ -15,14 +15,11 @@ const { settingsStore, menuStore, generateI18nTitle } = useContext();
 const { switchTo } = useMenu();
 
 function iconName(isActive: boolean, icon?: string, activeIcon?: string) {
-  let name;
-  if ((!isActive && icon) || (isActive && !activeIcon)) {
-    name = icon;
+  if (isActive && activeIcon) {
+    return activeIcon;
   }
-  else if (isActive && activeIcon) {
-    name = activeIcon;
-  }
-  return name;
+
+  return icon;
 }
 </script>
 

package/src/layout/components/Tools/Preferences/PreferencesContent.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { themes } from '@pubinfo/config/themes';
+import { getThemes } from '@pubinfo/config/themes';
 import { message } from 'ant-design-vue';
 import { cloneDeep, pick } from 'lodash-es';
 import EpBack from '~icons/ep/back';
@@ -92,6 +92,7 @@ const isDark = computed({
 });
 
 const themeList = computed(() => {
+  const themes = getThemes();
   return Object.keys(themes).map((key) => {
     return {
       label: key,

package/src/layout/components/Tools/index.vue

@@ -8,14 +8,12 @@ import FluentFullScreenMinimize16Filled from '~icons/fluent/full-screen-minimize
 import IconamoonSearch from '~icons/iconamoon/search';
 import MaterialSymbolsExpandMoreRounded from '~icons/material-symbols/expand-more-rounded';
 import PhLineVerticalThin from '~icons/ph/line-vertical-thin';
-// import RiTranslate from '~icons/ri/translate';
 
 import { useContext } from '../../composables/useContext';
 import useMainPage from '../../composables/useMainPage';
 import useViewTransition from '../../composables/useViewTransition';
 import DayNightSwitch from './DayNightSwitch.vue';
 import HotkeysIntro from './HotkeysIntro.vue';
-// import I18nSelector from './I18nSelector.vue';
 import Preferences from './Preferences/index.vue';
 import Search from './Search.vue';
 
@@ -71,9 +69,7 @@ const userMenu = computed(() => [
     {
       label: t('route.personal.profile'),
       icon: 'i-iconamoon-profile-duotone',
-      handle: () => router.push({
-        name: 'Profile',
-      }),
+      handle: () => router.push({ name: 'Profile' }),
     },
     {
       label: t('app.changePassword'),
@@ -172,9 +168,6 @@ const searchComponentsClass = computed(() => {
       >
         <IconamoonSearch text="14px" />
       </span>
-      <!-- <I18nSelector class="item">
-        <RiTranslate text="15px" />
-      </I18nSelector> -->
       <span
         v-if="settingsStore.mode === 'pc' && settingsStore.settings.toolbar.enableFullscreen"
         class="item"

package/src/layout/provider.ts

@@ -1,3 +1,4 @@
+import { PubinfoProvider } from '@/components';
 import {
   useFavoritesStore,
   useIframeStore,
@@ -8,6 +9,7 @@ import {
   useTabbarStore,
   useUserStore,
 } from '@/stores';
+import { h } from 'vue';
 import { createContext } from './composables/useContext';
 import { useTitle } from './composables/useTitle';
 
@@ -53,6 +55,10 @@ export const Provider = defineComponent({
       generateI18nTitle,
     });
 
-    return () => slots?.default?.();
+    return () => h(
+      PubinfoProvider,
+      {},
+      () => slots?.default?.(),
+    );
   },
 });

package/src/pages/system/not-permission/index.vue

@@ -31,8 +31,8 @@ onMounted(() => {
   }, 1000);
 });
 
-async function goBack() {
-  await userStore.logout();
+function goBack() {
+  userStore.logout();
   router.push({
     name: 'login',
   });

package/src/route/routes.ts

@@ -4,13 +4,26 @@ import { readProject } from '@/context';
 import { useSettingsStore, useUserStore } from '@/stores';
 import { isUndefined } from 'lodash-es';
 
-let asyncRoutes: Route.recordMainRaw[] = [];
+interface AsyncRoutesOptions {
+  /** 路由排序 */
+  sort?: number
+}
+
+interface RawAsyncRoute extends Required<AsyncRoutesOptions> {
+  routes: Route.recordMainRaw[]
+}
+
+// #region --- 动态路由
+const rawAsyncRoutes: RawAsyncRoute[] = [];
 
 /**
  * 定义并注册动态路由
  */
-export function defineAsyncRoutes(routes: Route.recordMainRaw[]) {
-  asyncRoutes = [...asyncRoutes, ...routes];
+export function defineAsyncRoutes(routes: Route.recordMainRaw[], options?: AsyncRoutesOptions) {
+  rawAsyncRoutes.push({
+    routes,
+    sort: options?.sort ?? 0,
+  });
   return routes;
 }
 
@@ -18,9 +31,14 @@ export function defineAsyncRoutes(routes: Route.recordMainRaw[]) {
  * 读取注册的动态路由
  */
 export function getAsyncRoutes() {
-  return asyncRoutes;
+  return rawAsyncRoutes
+    .sort((a, b) => a?.sort - b?.sort)
+    .map(e => e.routes)
+    .flat();
 }
+// #endregion
 
+// #region --- 系统路由
 const systemRoutes: RouteRecordRaw[] = [
   {
     path: '/',
@@ -57,7 +75,7 @@ const systemRoutes: RouteRecordRaw[] = [
  * 定义并注册系统路由（含Layout）
  */
 export function defineSystemRoutes(routes: RouteRecordRaw[]) {
-  systemRoutes[0].children = [...(systemRoutes?.[0]?.children ?? []), ...routes];
+  systemRoutes[0].children?.push(...routes);
 }
 
 /**
@@ -66,10 +84,9 @@ export function defineSystemRoutes(routes: RouteRecordRaw[]) {
 export function getSystemRoutes() {
   return systemRoutes;
 }
+// #endregion
 
-/**
- * 内置静态路由
- */
+// #region --- 静态路由
 export const constantRoutes: RouteRecordRaw[] = [
   {
     path: '/change-password/:changePassWordToken',
@@ -122,3 +139,4 @@ export const constantRoutes: RouteRecordRaw[] = [
     },
   },
 ];
+// #endregion