From b8b18a8d83eae482c2aa0cc47956b53b77d2afe6 Mon Sep 17 00:00:00 2001
From: Hooray Hu <304327508@qq.com>
Date: Sun, 17 Dec 2023 02:54:19 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=20UI=20=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E5=BA=93=E7=9A=84=E9=85=8D=E7=BD=AE=E5=92=8C=E4=BD=BF=E7=94=A8?=
 =?UTF-8?q?=E6=96=B9=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue               |  6 +++---
 src/main.ts               |  7 ++-----
 src/ui-provider/index.ts  | 10 ++++++++++
 src/ui-provider/index.vue |  9 +++++++++
 4 files changed, 24 insertions(+), 8 deletions(-)
 create mode 100644 src/ui-provider/index.ts
 create mode 100644 src/ui-provider/index.vue

diff --git a/src/App.vue b/src/App.vue
index 4a2f93e0..4c974816 100755
--- a/src/App.vue
+++ b/src/App.vue
@@ -2,8 +2,8 @@
 import eruda from 'eruda'
 import VConsole from 'vconsole'
 import hotkeys from 'hotkeys-js'
-import elementPlusLocaleZhCN from 'element-plus/es/locale/lang/zh-cn.mjs'
 import eventBus from './utils/eventBus'
+import Provider from './ui-provider/index.vue'
 import useSettingsStore from '@/store/modules/settings'
 
 const settingsStore = useSettingsStore()
@@ -59,7 +59,7 @@ import.meta.env.VITE_APP_DEBUG_TOOL === 'vconsole' && new VConsole()
 </script>
 
 <template>
-  <ElConfigProvider :locale="elementPlusLocaleZhCN" :button="{ autoInsertSpace: true }">
+  <Provider>
     <RouterView
       v-slot="{ Component, route }"
       :style="{
@@ -71,5 +71,5 @@ import.meta.env.VITE_APP_DEBUG_TOOL === 'vconsole' && new VConsole()
       <NotAllowed v-else />
     </RouterView>
     <SystemInfo />
-  </ElConfigProvider>
+  </Provider>
 </template>
diff --git a/src/main.ts b/src/main.ts
index bb9bbe92..440f5aa4 100755
--- a/src/main.ts
+++ b/src/main.ts
@@ -2,10 +2,6 @@ import '@/utils/baidu'
 
 import '@/utils/system.copyright'
 
-import ElementPlus from 'element-plus'
-import 'element-plus/dist/index.css'
-import 'element-plus/theme-chalk/dark/css-vars.css'
-
 import FloatingVue from 'floating-vue'
 import 'floating-vue/dist/style.css'
 
@@ -20,6 +16,7 @@ import 'overlayscrollbars/overlayscrollbars.css'
 import App from './App.vue'
 import pinia from './store'
 import router from './router'
+import ui from './ui-provider'
 
 // 自定义指令
 import directive from '@/utils/directive'
@@ -37,7 +34,6 @@ import 'virtual:uno.css'
 import '@/assets/styles/globals.scss'
 
 const app = createApp(App)
-app.use(ElementPlus)
 app.use(FloatingVue, {
   distance: 12,
 })
@@ -45,6 +41,7 @@ app.use(Message)
 app.use(VXETable)
 app.use(pinia)
 app.use(router)
+app.use(ui)
 directive(app)
 if (icons.isOfflineUse) {
   for (const info of icons.collections) {
diff --git a/src/ui-provider/index.ts b/src/ui-provider/index.ts
new file mode 100644
index 00000000..90b3396f
--- /dev/null
+++ b/src/ui-provider/index.ts
@@ -0,0 +1,10 @@
+import type { App } from 'vue'
+import ElementPlus from 'element-plus'
+import 'element-plus/dist/index.css'
+import 'element-plus/theme-chalk/dark/css-vars.css'
+
+function install(app: App) {
+  app.use(ElementPlus)
+}
+
+export default { install }
diff --git a/src/ui-provider/index.vue b/src/ui-provider/index.vue
new file mode 100644
index 00000000..1c33f54b
--- /dev/null
+++ b/src/ui-provider/index.vue
@@ -0,0 +1,9 @@
+<script setup lang="ts">
+import zhCN from 'element-plus/es/locale/lang/zh-cn.mjs'
+</script>
+
+<template>
+  <ElConfigProvider :locale="zhCN" :button="{ autoInsertSpace: true }">
+    <slot />
+  </ElConfigProvider>
+</template>