feat: 重构 PrimeVue 相关插件，优化对话框和通知服务的使用，更新样式和组件结构

src/plugins/eruda.ts

@@ -0,0 +1,12 @@
+export async function setupEruda() {
+  // TODO: https://github.com/hu3dao/vite-plugin-debug/
+  // https://eruda.liriliri.io/zh/docs/#快速上手
+  await import('eruda').then(({ default: eruda }) => {
+    eruda.init({
+      defaults: {
+        transparency: 0.9,
+      },
+    });
+    // eruda.show();
+  });
+}

src/plugins/primevue.ts

@@ -0,0 +1,101 @@
+/**
+ * 需要把 <DynamicDialog /> <ConfirmDialog /> <Toast /> 放在 App.vue 的 template 中
+ */
+import '../assets/reset-primevue.css';
+
+// ========================================================================
+// ========================== ConfirmationService =========================
+// ========================================================================
+// @ts-expect-error - Ignore missing types
+import ConfirmationEventBus from 'primevue/confirmationeventbus';
+import type { ConfirmationOptions } from 'primevue/confirmationoptions';
+interface HConfirmationOptions extends ConfirmationOptions {
+  rejectProps?: import('primevue/button').ButtonProps;
+  acceptProps?: import('primevue/button').ButtonProps;
+}
+const ConfirmationService = {
+  require: (options: HConfirmationOptions) => {
+    ConfirmationEventBus.emit('confirm', options);
+  },
+  close: () => {
+    ConfirmationEventBus.emit('close');
+  },
+};
+
+// ========================================================================
+// ============================= ToastService =============================
+// ========================================================================
+// @ts-expect-error - Ignore missing types
+import ToastEventBus from 'primevue/toasteventbus';
+import type { ToastServiceMethods } from 'primevue/toastservice';
+// https://github.com/primefaces/primevue/blob/61929eae7526015af0362fc5889f2af7527403d1/packages/primevue/src/toastservice/ToastService.js
+const ToastService: ToastServiceMethods = {
+  add: (message) => {
+    ToastEventBus.emit('add', message);
+  },
+  remove: (message) => {
+    ToastEventBus.emit('remove', message);
+  },
+  removeGroup: (group) => {
+    ToastEventBus.emit('remove-group', group);
+  },
+  removeAllGroups: () => {
+    ToastEventBus.emit('remove-all-groups');
+  },
+};
+
+// ========================================================================
+// ============================= DialogService ============================
+// ========================================================================
+// @ts-expect-error - Ignore missing types
+import DynamicDialogEventBus from 'primevue/dynamicdialogeventbus';
+import type { DialogServiceMethods } from 'primevue/dialogservice';
+// https://github.com/primefaces/primevue/blob/18367429f624285ff32d0ef775c1825a43a02fb1/packages/primevue/src/dialogservice/DialogService.js#L7
+const DialogService: DialogServiceMethods = {
+  open: (content, options) => {
+    const instance = {
+      content: content && markRaw(content),
+      options: options || {},
+      data: options && options.data,
+      close: (params: unknown) => {
+        DynamicDialogEventBus.emit('close', { instance, params });
+      },
+    };
+
+    DynamicDialogEventBus.emit('open', { instance });
+
+    return instance;
+  },
+};
+
+function useDialogRef() {
+  type DialogRef = ComputedRef<import('primevue/dynamicdialogoptions').DynamicDialogInstance>;
+  return inject<DialogRef>('dialogRef');
+}
+
+import Aura from '@primevue/themes/aura';
+import zhCN from 'primelocale/zh-CN.json';
+import PrimeVue from 'primevue/config';
+import 'primeicons/primeicons.css';
+function setupPrimeVue(app: import('vue').App) {
+  app.use(PrimeVue, {
+    locale: {
+      ...zhCN['zh-CN'],
+      noFileChosenMessage: '未选择文件',
+    }, // usePrimeVue().config.locale
+    theme: { preset: Aura },
+    options: {
+      prefix: 'p',
+      darkModeSelector: 'system',
+      cssLayer: false,
+    },
+  });
+}
+
+export {
+  ConfirmationService,
+  ToastService,
+  DialogService,
+  useDialogRef,
+  setupPrimeVue, //
+};

src/plugins/router.ts

@@ -0,0 +1,28 @@
+import { DataLoaderPlugin } from 'unplugin-vue-router/data-loaders';
+import { createLogGuard, createProgressGuard, createStackGuard } from 'utils4u/vue-router';
+import { createRouter, createWebHistory } from 'vue-router';
+import { handleHotUpdate, routes } from 'vue-router/auto-routes';
+
+export const router = createRouter({
+  history: createWebHistory(import.meta.env.BASE_URL),
+  routes,
+  strict: true,
+});
+router.onError((error) => {
+  console.debug('🚨 [router error]: ', error);
+});
+if (import.meta.hot) handleHotUpdate(router);
+if ($__DEV__) Object.assign(window, { router });
+
+export function setupRouter(app: import('vue').App) {
+  app
+    // Register the plugin before the router
+    .use(DataLoaderPlugin, { router })
+    // adding the router will trigger the initial navigation
+    .use(router);
+
+  // 警告：路由守卫的创建顺序会影响执行流程，请勿调整
+  createProgressGuard(router);
+  createLogGuard(router);
+  Object.assign(window, { stack: createStackGuard(router) });
+}

src/plugins/vue-i18n.ts

@@ -0,0 +1,19 @@
+import { createI18n } from 'vue-i18n';
+
+/* https://github.com/intlify/bundle-tools/tree/main/packages/unplugin-vue-i18n#static-bundle-importing
+ * All i18n resources specified in the plugin `include` option can be loaded
+ * at once using the import syntax
+ */
+import messages from '@intlify/unplugin-vue-i18n/messages';
+console.debug(`messages :>> `, messages);
+
+export function setupVueI18n(app: import('vue').App) {
+  app.use(
+    // https://vue-i18n.intlify.dev/guide/essentials/started.html#registering-the-i18n-plugin
+    createI18n({
+      legacy: false, // you must set `false`, to use Composition API
+      locale: navigator.language,
+      messages,
+    }),
+  );
+}