@pubinfo/core 2.0.0-beta.8 → 2.0.0-rc.1

package/src/{locales/index.ts → built-in/locales/helpler.ts}

@@ -1,7 +1,7 @@
-import type { App } from 'vue';
-import { useSettingsStore } from '@/stores';
+import type { RequestMethod } from '@/core';
 import { cloneDeep } from 'lodash-es';
 import { createI18n as _createI18n } from 'vue-i18n';
+import { useSettingsStore } from '@/features/stores';
 import _en from './lang/en.json';
 import _zhCN from './lang/zh-cn.json';
 import _zhTW from './lang/zh-tw.json';
@@ -13,7 +13,7 @@ const messages = {
   'zh-tw': _zhTW,
 };
 
-function createI18n() {
+export function createI18n() {
   const settingsStore = useSettingsStore();
   // 如果没设置默认语言，则根据当前浏览器语言设置默认语言
   if (!settingsStore.settings.app.defaultLang) {
@@ -36,11 +36,11 @@ function createI18n() {
   return i18n;
 }
 
-function getLocales() {
+export function getLocales() {
   return cloneDeep(messages);
 }
 
-function getUILocales() {
+export function getUILocales() {
   const locales: {
     [key: string]: any
   } = {};
@@ -62,19 +62,15 @@ function getUILocales() {
 }
 
 // 用于路由 meta.i18n 配置，方便在 VSCode I18n Ally 插件进行显示，无实际作用
-function $t(key: string) {
+export function $t(key: string) {
   return key;
 }
 
-function setupI18n({ app }: { app: App }) {
-  const i18n = createI18n();
-  app.use(i18n);
-  return app;
+/**
+ * 根据请求方法设置语言。
+ * @param method 请求方法
+ */
+export function maybeSetLanguage(method: RequestMethod) {
+  const settingsStore = useSettingsStore();
+  method.config.headers['Accept-Language'] = settingsStore.settings.app.defaultLang;
 }
-
-export {
-  $t,
-  getLocales,
-  getUILocales,
-  setupI18n,
-};

package/src/built-in/locales/index.ts

@@ -0,0 +1,20 @@
+import type { ModuleOptions } from '@/core';
+import { createI18n, maybeSetLanguage } from './helpler';
+
+/**
+ * 国际化多语言
+ */
+export function Locales(): ModuleOptions {
+  return {
+    name: 'built-in:locales',
+    setup(ctx) {
+      const { app } = ctx;
+      app.use(createI18n());
+    },
+    hooks: {
+      'http:request': (method) => {
+        maybeSetLanguage(method);
+      },
+    },
+  };
+}

package/src/built-in/n-progress/index.ts

@@ -0,0 +1,31 @@
+import type { ModuleOptions } from '@/core';
+import { useNProgress } from '@vueuse/integrations/useNProgress';
+import { useSettingsStore } from '@/features';
+import './nprogress.css';
+
+/**
+ * 页面跳转进度条
+ */
+export function NProgress(): ModuleOptions {
+  return {
+    name: 'built-in:n-progress',
+    setup(ctx) {
+      const { router } = ctx;
+
+      const settingsStore = useSettingsStore();
+      const { start, done } = useNProgress();
+
+      if (settingsStore.settings.app.enableProgress) {
+        router.beforeEach((to, from) => {
+          if (to.path !== from.path) {
+            start();
+          }
+        });
+
+        router.afterEach(() => {
+          done();
+        });
+      }
+    },
+  };
+}

package/src/built-in/n-progress/nprogress.css

@@ -0,0 +1,68 @@
+#nprogress {
+  pointer-events: none;
+}
+
+#nprogress .bar {
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 1031;
+  width: 100%;
+  height: 2px;
+  background: rgb(var(--ui-primary));
+}
+
+#nprogress .peg {
+  position: absolute;
+  right: 0;
+  display: block;
+  width: 100px;
+  height: 100%;
+  box-shadow: 0 0 10px rgb(var(--ui-primary)), 0 0 5px rgb(var(--ui-primary));
+  opacity: 1;
+  -webkit-transform: rotate(3deg) translate(0, -4px);
+  -moz-transform: rotate(3deg) translate(0, -4px);
+  -ms-transform: rotate(3deg) translate(0, -4px);
+  transform: rotate(3deg) translate(0, -4px);
+}
+
+#nprogress .spinner {
+  position: fixed;
+  top: 11px;
+  right: 14px;
+  z-index: 1031;
+  display: block;
+}
+
+#nprogress .spinner .spinner-icon {
+  box-sizing: border-box;
+  width: 18px;
+  height: 18px;
+  border: solid 2px transparent;
+  border-top-color: rgb(var(--ui-primary));
+  border-left-color: rgb(var(--ui-primary));
+  border-radius: 50%;
+  -webkit-animation: nprogress-spinner 400ms linear infinite;
+  -moz-animation: nprogress-spinner 400ms linear infinite;
+  -ms-animation: nprogress-spinner 400ms linear infinite;
+  animation: nprogress-spinner 400ms linear infinite;
+}
+
+.nprogress-custom-parent {
+  position: relative;
+  overflow: hidden;
+}
+
+.nprogress-custom-parent #nprogress .spinner,
+.nprogress-custom-parent #nprogress .bar {
+  position: absolute;
+}
+
+@keyframes nprogress-spinner {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}

package/src/built-in/pinia-plugin/enum.ts

@@ -0,0 +1 @@
+export { STORE_NAME } from '@/features/stores/enum';

package/src/{stores → built-in/pinia-plugin}/helper.ts

@@ -1,5 +1,5 @@
 import md5 from 'md5';
-import useUserStore from './modules/user';
+import { useUserStore } from '@/features/stores';
 
 const { getHash } = createHashString();
 
@@ -13,8 +13,8 @@ export function getfavoritesMemoryKey() {
 
 function getUserPrefix() {
   const userStore = useUserStore();
-  const userId = userStore.userId;
-  const orgId = userStore.orgId;
+  const userId = userStore.user.userId;
+  const orgId = userStore.user.orgId;
   return getHash(`${orgId}${userId}`);
 }
 

package/src/built-in/pinia-plugin/index.ts

@@ -0,0 +1,27 @@
+import type { ModuleOptions } from '@/core';
+import { createPersistedState } from 'pinia-plugin-persistedstate';
+import { createCleanupPlugin } from './plugins/cleanup';
+import { createFavoritesStoragePlugin } from './plugins/favoritesStorage';
+import { createIframeCachePlugin } from './plugins/iframeCache';
+import { createPersistedStateOptions } from './plugins/persist';
+import { createTabbarStoragePlugin } from './plugins/tabbarStorage';
+/**
+ * pinia 统一注册插件
+ */
+export function PiniaPlugin(): ModuleOptions {
+  return {
+    name: 'built-in:pinia-plugin',
+    setup(ctx) {
+      const { store } = ctx;
+
+      // 持久化
+      store.use(createPersistedState(createPersistedStateOptions()));
+
+      // 各个store的副作用
+      store.use(createCleanupPlugin);
+      store.use(createFavoritesStoragePlugin);
+      store.use(createIframeCachePlugin);
+      store.use(createTabbarStoragePlugin);
+    },
+  };
+}

package/src/{stores/plugin/sideEffect → built-in/pinia-plugin/plugins}/cleanup.ts

@@ -1,6 +1,6 @@
 import type { PiniaPluginContext } from 'pinia';
 import { cleanup, cleanupWithoutUser } from '@/utils';
-import { STORE_NAME } from '../../enum';
+import { STORE_NAME } from '../enum';
 
 /**
  * 登出和切换组织时，触发清理状态

package/src/{stores/plugin/sideEffect → built-in/pinia-plugin/plugins}/favoritesStorage.ts

@@ -1,11 +1,10 @@
 import type { PiniaPluginContext } from 'pinia';
-import type useFavoritesStore from '../../modules/favorites';
-import { GetAPIFavorites, GetAPIFavoritesEdit } from '@/api/system/user';
+import type { useFavoritesStore } from '@/features/stores';
+import { GetAPIFavorites, GetAPIFavoritesEdit } from '@/features/api/system/user';
+import { useSettingsStore, useUserStore } from '@/features/stores';
 import { storage } from '@/utils';
-import { STORE_NAME } from '../../enum';
-import { getfavoritesMemoryKey } from '../../helper';
-import useSettingsStore from '../../modules/settings';
-import useUserStore from '../../modules/user';
+import { STORE_NAME } from '../enum';
+import { getfavoritesMemoryKey } from '../helper';
 
 /**
  * 收藏夹持久化插件
@@ -13,7 +12,7 @@ import useUserStore from '../../modules/user';
 export function createFavoritesStoragePlugin({ store }: PiniaPluginContext) {
   if (store.$id === STORE_NAME.FAVORITES) {
     const favoritesStore = store as ReturnType<typeof useFavoritesStore>;
-    const favoritesId = computed(() => useUserStore().account);
+    const favoritesId = computed(() => useUserStore().user.account);
     const settingsStore = useSettingsStore();
 
     // list 变化时更新存储

package/src/{stores/plugin/sideEffect → built-in/pinia-plugin/plugins}/iframeCache.ts

@@ -1,7 +1,7 @@
 import type { PiniaPluginContext } from 'pinia';
-import type useIframeStore from '../../modules/iframe';
-import { STORE_NAME } from '../../enum';
-import useSettingsStore from '../../modules/settings';
+import type { useIframeStore } from '@/features/stores';
+import { useSettingsStore } from '@/features/stores';
+import { STORE_NAME } from '../enum';
 
 /**
  * 最大缓存数量检测，超过缓存数量则关闭最早打开的 iframe

package/src/built-in/pinia-plugin/plugins/persist.ts

@@ -0,0 +1,21 @@
+import type { PluginOptions, Serializer } from 'pinia-plugin-persistedstate';
+import { storage } from '@/utils';
+
+export function customSerializer(): Serializer {
+  return {
+    deserialize: (value) => {
+      return JSON.parse(value);
+    },
+    serialize: (value) => {
+      return JSON.stringify(value);
+    },
+  };
+}
+
+export function createPersistedStateOptions(): PluginOptions {
+  return {
+    storage: storage.local,
+    key: id => `_${id}`,
+    serializer: customSerializer(),
+  };
+}

package/src/{stores/plugin/sideEffect → built-in/pinia-plugin/plugins}/tabbarStorage.ts

@@ -1,12 +1,11 @@
 import type { PiniaPluginContext } from 'pinia';
-import type useTabbarStore from '../../modules/tabbar';
-import { GetAPITabbar, GetAPITabbarEdit } from '@/api/system/user';
-import { storage } from '@/utils';
+import type { useTabbarStore } from '@/features/stores';
 import { cloneDeep } from 'lodash-es';
-import { STORE_NAME } from '../../enum';
-import { getTabbarMemoryKey } from '../../helper';
-import useSettingsStore from '../../modules/settings';
-import useUserStore from '../../modules/user';
+import { GetAPITabbar, GetAPITabbarEdit } from '@/features/api/system/user';
+import { useSettingsStore, useUserStore } from '@/features/stores';
+import { storage } from '@/utils';
+import { STORE_NAME } from '../enum';
+import { getTabbarMemoryKey } from '../helper';
 
 /**
  * 选项卡持久化插件
@@ -14,7 +13,7 @@ import useUserStore from '../../modules/user';
 export function createTabbarStoragePlugin({ store }: PiniaPluginContext) {
   if (store.$id === STORE_NAME.TABBAR) {
     const tabbarStore = store as ReturnType<typeof useTabbarStore>;
-    const tabbarId = computed(() => useUserStore().account);
+    const tabbarId = computed(() => useUserStore().user.account);
     const settingsStore = useSettingsStore();
 
     // list 变化时更新存储

package/src/built-in/pre-access/index.ts

@@ -0,0 +1,20 @@
+import type { ModuleOptions } from '@/core';
+import { basic as request } from '@/features/api/request';
+
+function validateIp() {
+  return request.Post<API.IsSuccess>('/validateIp', {}, { meta: { authRole: null } });
+}
+
+/**
+ * 入口访问控制 (系统级拦截)
+ *
+ * 例如，黑白名单检测、防火墙规则等
+ */
+export function PreAccess(): ModuleOptions {
+  return {
+    name: 'built-in:pre-access',
+    async setup() {
+      await validateIp();
+    },
+  };
+}

package/src/built-in/settings/index.ts

@@ -0,0 +1,15 @@
+import type { ModuleOptions } from '@/core';
+import { createRouterGuard } from './router';
+
+/**
+ * 配置项
+ */
+export function Settings(): ModuleOptions {
+  return {
+    name: 'built-in:settings',
+    setup(ctx) {
+      const { router } = ctx;
+      createRouterGuard(router);
+    },
+  };
+}

package/src/{route/guard/setting.ts → built-in/settings/router.ts}

@@ -1,5 +1,6 @@
 import type { RouterMetaRawBaseOptions } from '#/vue-router';
 import type { Router } from 'vue-router';
+import { useError } from '@/features/composables';
 import {
   useIframeStore,
   useKeepAliveStore,
@@ -7,10 +8,10 @@ import {
   useSettingsStore,
   useTabbarStore,
   useUserStore,
-} from '@/stores';
+} from '@/features/stores';
 
 /** 配置路由守卫 */
-export function createSettingGuard(router: Router) {
+export function createRouterGuard(router: Router) {
   const settingsStore = useSettingsStore();
   const menuStore = useMenuStore();
   const tabbarStore = useTabbarStore();

package/src/core/create.ts

@@ -0,0 +1,70 @@
+import type { Context, Options } from './interface';
+import { createPinia } from 'pinia';
+import { createApp as createVueApp } from 'vue';
+import { createRouter, createWebHashHistory } from 'vue-router';
+
+import { extractModules, resolveHooks, resolveModules } from './modules';
+import { loadProjectModules } from './resolver';
+
+export function createApp(options: Options) {
+  const {
+    app: App,
+    router: routerOptions,
+    setup,
+    rootContainer = '#app',
+    immediate = true,
+    modules = [],
+    hooks: _hooks = {},
+  } = options;
+
+  async function _createApp() {
+    await loadProjectModules();
+
+    const app = createVueApp(App);
+    const store = createPinia();
+    app.use(store);
+
+    const { base, ...restRouterOptions } = routerOptions;
+    const router = createRouter({
+      history: createWebHashHistory(base),
+      ...restRouterOptions,
+    });
+
+    const context: Context = {
+      app,
+      store,
+      router,
+    };
+
+    // 解析插件
+    const resolvedModules = extractModules(modules);
+
+    // 注册 hooks
+    resolveHooks([
+      ...resolvedModules.pre,
+      ...resolvedModules.default,
+      { hooks: _hooks },
+      ...resolvedModules.post,
+    ]);
+
+    await resolveModules(resolvedModules.pre, context);
+    await resolveModules(resolvedModules.default, context);
+    await setup?.(context);
+    await resolveModules(resolvedModules.post, context);
+
+    // router 必须放在最后注册
+    app.use(router);
+
+    return context;
+  }
+
+  if (immediate) {
+    (async () => {
+      const { app, router } = await _createApp();
+      await router.isReady();
+      app.mount(rootContainer, true);
+    })();
+  }
+
+  return _createApp;
+}

package/src/core/ctx.ts

@@ -0,0 +1,3 @@
+import { createHooks } from 'hookable';
+
+export const hooks = createHooks();

package/src/core/index.ts

@@ -0,0 +1,4 @@
+export * from './create';
+export * from './interface';
+export * from './request';
+export * from './resolver';

package/src/core/interface.ts

@@ -0,0 +1,89 @@
+import type { AdapterCreateOptions, AlovaAxiosRequestConfig } from '@alova/adapter-axios';
+import type { Alova, AlovaGenerics, AlovaOptions, Method } from 'alova';
+import type { AxiosResponse, AxiosResponseHeaders } from 'axios';
+import type { Pinia } from 'pinia';
+import type { App, Component } from 'vue';
+import type { Router, RouterOptions as VueRouterOptions } from 'vue-router';
+
+type PartialKeys<T, Keys extends keyof T> = Omit<T, Keys> & Partial<Pick<T, Keys>>;
+
+export type RouterOptions = PartialKeys<VueRouterOptions, 'history'> & { base?: string };
+
+export interface Options {
+  /**
+   * 根组件
+   */
+  app: Component
+
+  /**
+   * vue-router 配置
+   */
+  router: RouterOptions
+
+  /**
+   * 初始化函数
+   */
+  setup?: Setup
+
+  /**
+   * 根节点
+   * @default "#app"
+   */
+  rootContainer?: string | Element
+
+  /**
+   * 立即执行
+   * @default true
+   */
+  immediate?: boolean
+
+  /** 模块插件注册 */
+  modules?: ModuleOptions[]
+
+  /** 生命周期 */
+  hooks?: Partial<Hooks>
+}
+
+export interface Context {
+  app: App<Element>
+  store: Pinia
+  router: Router
+}
+
+export type Setup = (ctx: Pick<Context, 'app' | 'router' | 'store'>) => Promise<void> | void;
+
+export interface Module {
+  /** 唯一值 */
+  name: string
+
+  /** 初始化内容 */
+  setup?: Setup
+
+  /**
+   * 插件调用顺序:
+   * - `enforce: pre` 插件
+   * - 内置核心插件（即路由守卫、状态管理等）
+   * - 普通插件
+   * - 初始化函数（即setup）
+   * - `enforce: post` 插件
+   */
+  enforce?: 'pre' | 'post'
+
+  /** 钩子函数 */
+  hooks?: Partial<Hooks>
+}
+
+export type FalsyModule = false | null | undefined;
+
+export type ModuleOptions = Module | ModuleOptions[] | FalsyModule;
+
+type AG = AlovaGenerics<any, any, AlovaAxiosRequestConfig, AxiosResponse<any, any>, AxiosResponseHeaders, any, any, any>;
+
+export type RequestOptions = Omit<AlovaOptions<AG>, 'statesHook' | 'requestAdapter'> & { axios?: AdapterCreateOptions };
+export type RequestInstance = Alova<AG>;
+export type RequestMethod = Method<AG>;
+
+export interface Hooks {
+  'http:request': AlovaOptions<AG>['beforeRequest']
+  'http:response': AlovaOptions<AG>['responded']
+}

package/src/{modules.ts → core/modules.ts}

@@ -1,15 +1,20 @@
 import type { Context, FalsyModule, Module, ModuleOptions } from './interface';
-import { hooks } from './context';
+import { hooks } from './ctx';
 import { asyncFlatten } from './utils';
 
+/**
+ * 注册所有模块插件的setup
+ */
 export async function resolveModules(modules: ModuleOptions[] = [], context: Context) {
   const filterModules = (m: Module | FalsyModule): m is Module => Boolean(m);
 
   const rawModules = (await asyncFlatten(modules)).filter(filterModules);
-  rawModules.forEach((m) => {
-    m?.setup?.(context);
-    hooks.addHooks(m.hooks ?? {});
-  });
+
+  for (const m of rawModules) {
+    if (m.setup) {
+      await m.setup(context);
+    }
+  }
 }
 
 /**
@@ -47,3 +52,12 @@ export function extractModules(modules: ModuleOptions[] = []) {
   modules?.forEach(traverse);
   return result;
 }
+
+/**
+ * 注册所有模块插件的hook
+ */
+export function resolveHooks(modules: { hooks?: Module['hooks'] }[]) {
+  modules.forEach((m) => {
+    hooks.addHooks(m?.hooks ?? {});
+  });
+}

package/src/core/request.ts

@@ -0,0 +1,52 @@
+import type { RequestOptions } from './interface';
+import { axiosRequestAdapter } from '@alova/adapter-axios';
+import { createAlova } from 'alova';
+import vueHook from 'alova/vue';
+import { createTokenAuthentication } from '@/built-in';
+import { hooks } from './ctx';
+
+function normalizedResponded(handler: RequestOptions['responded']) {
+  if (typeof handler === 'function') {
+    return { onSuccess: handler };
+  }
+  return handler;
+}
+
+export function createRequest(options: RequestOptions) {
+  const { onAuthRequired, onResponseRefreshToken } = createTokenAuthentication();
+  const { axios, beforeRequest, responded: _responded, ...restOptions } = options;
+
+  const responded = normalizedResponded(_responded);
+
+  const instance = createAlova({
+    statesHook: vueHook,
+    requestAdapter: axiosRequestAdapter(axios),
+    cacheFor: null,
+    timeout: 60 * 1000,
+    ...restOptions,
+
+    beforeRequest: onAuthRequired(async (method) => {
+      await hooks.callHook('http:request', method);
+      await beforeRequest?.(method);
+    }),
+
+    responded: onResponseRefreshToken({
+      onSuccess: async (response, method) => {
+        const res = await hooks.callHook('http:response:onSuccess', response, method) ?? response;
+        return responded?.onSuccess?.(res, method) ?? res;
+      },
+      onError: (err, method) => {
+        hooks.callHook('http:response:onError', err, method);
+        responded?.onError?.(err, method);
+      },
+      onComplete: (method) => {
+        hooks.callHook('http:response:onComplete', method);
+        responded?.onComplete?.(method);
+      },
+    }),
+  });
+
+  return instance;
+}
+
+export * from './interface';