From d49cd6c1eb68ae443fde28fad32e3092daef0c99 Mon Sep 17 00:00:00 2001
From: Gary Fu <xuebaiyouling@gmail.com>
Date: Sun, 17 Dec 2023 15:49:30 +0800
Subject: [PATCH] =?UTF-8?q?=E5=9B=BD=E9=99=85=E5=8C=96=E3=80=81=E4=B8=BB?=
 =?UTF-8?q?=E9=A2=98=E5=A4=84=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common-icon/index.vue    | 16 ++++++++++++++++
 src/components/index.js                 | 14 ++++++++++++++
 src/{components => layout}/LeftMenu.vue |  0
 src/{components => layout}/TopNav.vue   | 14 ++++++++------
 src/main.js                             |  4 +++-
 src/{store.js => stores/index.js}       |  0
 src/views/HomeView.vue                  |  9 ++-------
 7 files changed, 43 insertions(+), 14 deletions(-)
 create mode 100644 src/components/common-icon/index.vue
 create mode 100644 src/components/index.js
 rename src/{components => layout}/LeftMenu.vue (100%)
 rename src/{components => layout}/TopNav.vue (91%)
 rename src/{store.js => stores/index.js} (100%)

diff --git a/src/components/common-icon/index.vue b/src/components/common-icon/index.vue
new file mode 100644
index 0000000..4a7dfdf
--- /dev/null
+++ b/src/components/common-icon/index.vue
@@ -0,0 +1,16 @@
+<script setup>
+defineProps({
+  icon: {
+    type: String,
+    required: true
+  }
+})
+</script>
+
+<template>
+  <el-icon>
+    <component
+      :is="icon"
+    />
+  </el-icon>
+</template>
diff --git a/src/components/index.js b/src/components/index.js
new file mode 100644
index 0000000..dc08063
--- /dev/null
+++ b/src/components/index.js
@@ -0,0 +1,14 @@
+import { defineAsyncComponent } from 'vue'
+
+/**
+ * 自定义通用组件自动注册
+ */
+export default {
+  install (app) {
+    const components = import.meta.glob('./*/index.vue')
+    for (const [filePath, componentFn] of Object.entries(components)) {
+      const compName = filePath.split('/')[1]
+      app.component(compName, defineAsyncComponent(componentFn))
+    }
+  }
+}
diff --git a/src/components/LeftMenu.vue b/src/layout/LeftMenu.vue
similarity index 100%
rename from src/components/LeftMenu.vue
rename to src/layout/LeftMenu.vue
diff --git a/src/components/TopNav.vue b/src/layout/TopNav.vue
similarity index 91%
rename from src/components/TopNav.vue
rename to src/layout/TopNav.vue
index 68c2b28..1e3108e 100644
--- a/src/components/TopNav.vue
+++ b/src/layout/TopNav.vue
@@ -42,18 +42,20 @@ defineProps({
         index="1-1"
         @click="$changeLocale('zh-CN')"
       >
-        <el-icon v-if="globalConfigStore.currentLocale==='zh-CN'">
-          <Check />
-        </el-icon>
+        <common-icon
+          v-if="globalConfigStore.currentLocale==='zh-CN'"
+          icon="check"
+        />
         {{ $t('common.label.langCn') }}
       </el-menu-item>
       <el-menu-item
         index="1-2"
         @click="$changeLocale('en-US')"
       >
-        <el-icon v-if="globalConfigStore.currentLocale==='en-US'">
-          <Check />
-        </el-icon>
+        <common-icon
+          v-if="globalConfigStore.currentLocale==='en-US'"
+          icon="check"
+        />
         {{ $t('common.label.langEn') }}
       </el-menu-item>
     </el-sub-menu>
diff --git a/src/main.js b/src/main.js
index cf06d87..f9c8907 100644
--- a/src/main.js
+++ b/src/main.js
@@ -3,7 +3,8 @@ import ElementPlus from 'element-plus'
 import 'element-plus/dist/index.css'
 import 'element-plus/theme-chalk/dark/css-vars.css'
 import * as ElementPlusIconsVue from '@element-plus/icons-vue'
-import { usePinia } from '@/store'
+import { usePinia } from '@/stores'
+import commons from '@/components'
 
 import messagesConfig from '@/languages/MessagesConfig'
 
@@ -18,6 +19,7 @@ app.use(usePinia)
 app.use(router)
 app.use(ElementPlus)
 app.use(messagesConfig)
+app.use(commons)
 
 for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
   app.component(key, component)
diff --git a/src/store.js b/src/stores/index.js
similarity index 100%
rename from src/store.js
rename to src/stores/index.js
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index af69835..c4702c8 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -1,13 +1,12 @@
 <script setup>
-import LeftMenu from '@/components/LeftMenu.vue'
-import TopNav from '@/components/TopNav.vue'
+import LeftMenu from '@/layout/LeftMenu.vue'
+import TopNav from '@/layout/TopNav.vue'
 import { ref } from 'vue'
 import dayjs from 'dayjs'
 
 const collapseLeft = ref(false)
 
 const value1 = ref(new Date())
-const color = ref('rgba(19, 206, 102, 0.8)')
 
 const testDay = function () {
   return dayjs.weekdays()
@@ -33,10 +32,6 @@ const testDay = function () {
           type="date"
           placeholder="Pick a day"
         />
-        <el-color-picker
-          v-model="color"
-          show-alpha
-        />
         {{ testDay() }}
         {{ $i18n.locale }}
       </el-main>