refactor: 重构UI组件库

src/main.ts

@@ -1,6 +1,7 @@
 import { IonicVue } from "@ionic/vue";
 import { createPinia } from "pinia";
 import { createApp } from "vue";
+import uiComponents from "@/ui";
 import App from "./App.vue";
 import { authClient } from "./auth";
 import { i18n } from "./locales";
@@ -49,7 +50,8 @@ authClient.getSession().then((session) => {
     .use(IonicVue)
     .use(pinia)
     .use(router)
-    .use(i18n);
+    .use(i18n)
+    .use(uiComponents);
 
   router.isReady().then(() => {
     app.mount("#app");

src/ui/index.ts

@@ -0,0 +1,34 @@
+import type { App, Component } from "vue";
+
+const modules: Record<string, { default: Component }> = import.meta.glob("./*/*.vue", { eager: true });
+
+function setupUiGlobalComponents(app: App) {
+  for (const path in modules) {
+    const parts = path.replace(/^\.\//, "").replace(/\.vue$/, "").split("/");
+    const name = parts[parts.length - 1] === "index" ? parts[parts.length - 2] : parts[parts.length - 1];
+    const componentName = `Ui${name.split("-").map(word => word.charAt(0).toUpperCase() + word.slice(1)).join("")}`;
+    app.component(componentName, modules[path].default);
+  }
+}
+
+export default {
+  install: setupUiGlobalComponents,
+};
+
+// Global component types
+declare module "vue" {
+  export interface GlobalComponents {
+    UiAvatar: typeof import("./avatar/index.vue")["default"];
+    UiCollapse: typeof import("./collapse/index.vue")["default"];
+    UiDatetime: typeof import("./datetime/index.vue")["default"];
+    UiDivider: typeof import("./divider/index.vue")["default"];
+    UiFileUpload: typeof import("./file-upload/index.vue")["default"];
+    UiInput: typeof import("./input/index.vue")["default"];
+    UiInputLabel: typeof import("./input-label/index.vue")["default"];
+    UiResult: typeof import("./result/index.vue")["default"];
+    UiTabPane: typeof import("./tabs/tab-pane.vue")["default"];
+    UiTabs: typeof import("./tabs/index.vue")["default"];
+    UiTag: typeof import("./tag/index.vue")["default"];
+    UiTextareaLabel: typeof import("./textarea-label/index.vue")["default"];
+  }
+}

src/ui/input-label/index.vue

@@ -1,6 +1,6 @@
 <script lang='ts' setup>
 import type { ComponentInstance } from "vue";
-import UiInput from "@/components/ui/input/index.vue";
+import UiInput from "@/ui/input/index.vue";
 
 defineProps<{
   label?: string;