From 45884a2918437276dd362b5ba76fdfa1e5b4ce82 Mon Sep 17 00:00:00 2001
From: MTrun <1262327911@qq.com>
Date: Mon, 20 Dec 2021 16:13:26 +0800
Subject: [PATCH] =?UTF-8?q?fix=EF=BC=9A=E6=8A=BD=E7=A6=BB=E9=A6=96?=
 =?UTF-8?q?=E9=A1=B5=E4=B8=BB=E9=A2=98=E8=AE=BE=E7=BD=AE=E6=88=90hooks?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue                          | 41 ++++-----------------------
 src/hooks/index.ts                   |  1 +
 src/hooks/themeHook.ts               | 42 ++++++++++++++++++++++++++++
 src/styles/common/mixins/mixins.scss |  2 +-
 src/utils/plugin.ts                  |  6 ++--
 5 files changed, 52 insertions(+), 40 deletions(-)
 create mode 100644 src/hooks/themeHook.ts

diff --git a/src/App.vue b/src/App.vue
index cb73053f..a9dce3da 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -12,50 +12,19 @@
 </template>
 
 <script lang="ts" setup>
-import { computed } from 'vue'
-import {
-  zhCN,
-  dateZhCN,
-  darkTheme,
-  NConfigProvider,
-  GlobalThemeOverrides
-} from 'naive-ui'
+import { zhCN, dateZhCN, NConfigProvider } from 'naive-ui'
 import { AppProvider } from '@/components/Application'
 import { useDesignStore } from '@/store/modules/designStore/designStore'
-import { borderRadius } from '@/settings/designSetting'
+
+import { getDarkThemeHook, getThemeOverridesHook } from '@/hooks'
 
 const designStore = useDesignStore()
 
 // 返回暗黑主题
-const getDarkTheme = computed(() =>
-  designStore.getDarkTheme ? darkTheme : undefined
-)
+const getDarkTheme = getDarkThemeHook()
 
 // 主题配置
-const getThemeOverrides = computed(
-  (): GlobalThemeOverrides => {
-    const commonObj = {
-      common: {
-        borderRadius
-      }
-    }
-    const lightObject = {
-      common: {
-        ...commonObj.common
-      }
-    }
-    const dartObject = {
-      common: {
-        primaryColor: designStore.appTheme,
-        ...commonObj.common
-      },
-      LoadingBar: {
-        colorLoading: designStore.appTheme
-      }
-    }
-    return designStore.getDarkTheme ? dartObject : lightObject
-  }
-)
+const getThemeOverrides = getThemeOverridesHook()
 </script>
 
 <style lang="scss"></style>
diff --git a/src/hooks/index.ts b/src/hooks/index.ts
index e69de29b..2cead04f 100644
--- a/src/hooks/index.ts
+++ b/src/hooks/index.ts
@@ -0,0 +1 @@
+export * from '@/hooks/themeHook'
\ No newline at end of file
diff --git a/src/hooks/themeHook.ts b/src/hooks/themeHook.ts
new file mode 100644
index 00000000..408a1ca1
--- /dev/null
+++ b/src/hooks/themeHook.ts
@@ -0,0 +1,42 @@
+import { computed } from 'vue'
+import { darkTheme, GlobalThemeOverrides } from 'naive-ui'
+import { useDesignStore } from '@/store/modules/designStore/designStore'
+import { borderRadius } from '@/settings/designSetting'
+
+/**
+ * 设置全局主题
+ */
+export const getThemeOverridesHook = () => {
+  const designStore = useDesignStore()
+  const getDarkTheme = computed(
+    (): GlobalThemeOverrides => {
+      const commonObj = {
+        common: {
+          borderRadius
+        }
+      }
+      const lightObject = {
+        common: {
+          ...commonObj.common
+        }
+      }
+      const dartObject = {
+        common: {
+          primaryColor: designStore.appTheme,
+          ...commonObj.common
+        },
+        LoadingBar: {
+          colorLoading: designStore.appTheme
+        }
+      }
+      return designStore.getDarkTheme ? dartObject : lightObject
+    }
+  )
+  return getDarkTheme
+}
+
+// 返回暗黑主题
+export const getDarkThemeHook = () => {
+  const designStore = useDesignStore()
+  return computed(() => (designStore.getDarkTheme ? darkTheme : undefined))
+}
diff --git a/src/styles/common/mixins/mixins.scss b/src/styles/common/mixins/mixins.scss
index f0c6acb6..0ab68436 100644
--- a/src/styles/common/mixins/mixins.scss
+++ b/src/styles/common/mixins/mixins.scss
@@ -10,7 +10,7 @@
 }
 
 @mixin deep() {
-  ::v-deep *{
+  ::v-deep {
     @content;
   }
 }
diff --git a/src/utils/plugin.ts b/src/utils/plugin.ts
index 94add944..9cd12611 100644
--- a/src/utils/plugin.ts
+++ b/src/utils/plugin.ts
@@ -26,7 +26,7 @@ import { renderIcon } from '@/utils'
   const tip = {
     delete: '是否删除此数据'
   }
-  dialogFn({
+  const instance = dialogFn({
     title: '提示',
     icon: renderIcon(InformationCircleIcon, { size: dialogIconSize }),
     content: message || tip[type] || '',
@@ -34,10 +34,10 @@ import { renderIcon } from '@/utils'
     negativeText: '取消',
     maskClosable: maskClosable,
     onPositiveClick: () => {
-      onPositiveCallback && onPositiveCallback()
+      onPositiveCallback && onPositiveCallback(instance)
     },
     onNegativeClick: () => {
-      onNegativeCallback && onNegativeCallback()
+      onNegativeCallback && onNegativeCallback(instance)
     }
   })
 }
\ No newline at end of file