From c13c622eac5551c6f099f148feb5256711ca34de Mon Sep 17 00:00:00 2001 From: 疯狂的狮子Li <15040126243@163.com> Date: 星期二, 11 七月 2023 21:03:01 +0800 Subject: [PATCH] !25 部分优化以及新增功能 Merge pull request !25 from ahaos/tspr --- src/layout/components/Settings/index.vue | 23 ++++++++++++++++++----- 1 files changed, 18 insertions(+), 5 deletions(-) diff --git a/src/layout/components/Settings/index.vue b/src/layout/components/Settings/index.vue index bf62b14..8eb7921 100644 --- a/src/layout/components/Settings/index.vue +++ b/src/layout/components/Settings/index.vue @@ -1,8 +1,7 @@ <template> <el-drawer v-model="showSettings" :withHeader="false" direction="rtl" size="300px" close-on-click-modal> - <div class="setting-drawer-title"> - <h3 class="drawer-title">涓婚椋庢牸璁剧疆</h3> - </div> + <h3 class="drawer-title">涓婚椋庢牸璁剧疆</h3> + <div class="setting-drawer-block-checbox"> <div class="setting-drawer-block-checbox-item" @click="handleTheme('theme-dark')"> <img src="@/assets/images/dark.svg" alt="dark" /> @@ -35,6 +34,13 @@ <el-color-picker v-model="theme" :predefine="predefineColors" @change="themeChange" /> </span> </div> + <div class="drawer-item"> + <span>娣辫壊妯″紡</span> + <span class="comp-style"> + <el-switch v-model="isDark" @change="toggleDark" class="drawer-switch" /> + </span> + </div> + <el-divider /> <h3 class="drawer-title">绯荤粺甯冨眬閰嶇疆</h3> @@ -102,7 +108,15 @@ const storeSettings = computed(() => settingsStore); const predefineColors = ref(["#409EFF", "#ff4500", "#ff8c00", "#ffd700", "#90ee90", "#00ced1", "#1e90ff", "#c71585"]); -/** 鏄惁闇�瑕乼opnav */ +// 鏄惁鏆楅粦妯″紡 +const isDark = useDark({ + storageKey: 'useDarkKey', + valueDark: 'dark', + valueLight: 'light', +}); +const toggleDark = () => useToggle(isDark); + +/** 鏄惁闇�瑕乼opNav */ const topNav = computed({ get: () => storeSettings.value.topNav, set: (val) => { @@ -234,7 +248,6 @@ } .drawer-item { - color: rgba(0, 0, 0, 0.65); padding: 12px 0; font-size: 14px; -- Gitblit v1.9.3