From 9a653d3bc5dc1887f52907f1878f589a86a69a26 Mon Sep 17 00:00:00 2001 From: chuzhongzai Date: Sat, 22 Apr 2023 19:59:57 +0800 Subject: [PATCH] =?UTF-8?q?=E5=A4=84=E7=90=86=E9=87=8C=E7=AB=99=E6=90=9C?= =?UTF-8?q?=E7=B4=A2=E6=97=B6=E6=B2=A1=E6=9C=89=E6=90=9C=E7=B4=A2=E7=BB=93?= =?UTF-8?q?=E6=9E=9C=E7=9A=84=E6=83=85=E5=86=B5=E3=80=82=E9=87=8C=E7=AB=99?= =?UTF-8?q?=E6=90=9C=E7=B4=A2=E6=97=B6=E5=A2=9E=E5=8A=A0=E5=8A=A0=E8=BD=BD?= =?UTF-8?q?=E5=9B=BE=E6=A0=87(=E5=90=8C=E6=AD=A5=E6=9B=B4=E6=96=B0)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/App.vue | 6 -- src/components/DashBoard.vue | 124 +++++++++++++++++++++++++++++++++-- src/components/Side.vue | 3 +- src/main.js | 1 + 4 files changed, 123 insertions(+), 11 deletions(-) diff --git a/src/App.vue b/src/App.vue index 0f04584..46d8922 100644 --- a/src/App.vue +++ b/src/App.vue @@ -15,9 +15,3 @@ import DashBoard from "./components/DashBoard.vue"; - - diff --git a/src/components/DashBoard.vue b/src/components/DashBoard.vue index c3c14df..b06f42c 100644 --- a/src/components/DashBoard.vue +++ b/src/components/DashBoard.vue @@ -22,8 +22,11 @@
修改授权码 删除本地授权码 + 夜间模式配置 + 夜间模式 + 夜间模式
- 里站搜索
+ 里站搜索
{{thumbnailGallery.shortName}}
@@ -87,7 +90,7 @@ 查询
-
+
链接
下载
-

+
首页 @@ -112,6 +115,20 @@
+ + 夜间模式跟随系统 +
+ 自定义起始时间(精确到分) +
+ + ~ + + + + +

是否记住授权码 @@ -129,6 +146,8 @@ import axios from "axios"; let AuthCode = ref("") let isRemember = ref(false) let isAlterAuthCode = ref(false) +let isConfigDarkMode = ref(false) +let isDark = ref(false) let newAuthCode = ref("") let tempAuthCode = ref("") @@ -136,6 +155,7 @@ let isQuerying = ref(false) let keyword = ref("") let galleries = ref([]) let queryPage = ref({}) +let darkConfig = ref({}) //查询相关 let type = ref("link") @@ -292,20 +312,116 @@ function deleteAuthCode(){ localStorage.removeItem('auth') ElMessage("删除授权码完成") } +function toggleStyle(){ + if(isDark.value) + dark() + else + light() +} + onMounted(() => { const auth = localStorage.getItem("auth") + adjustForStyle() + if(auth !== null){ store.dispatch("validate", auth) AuthCode.value = localStorage.getItem("auth") } }) + +function adjustForStyle(){ + let darkConfigStr = localStorage.getItem("darkConfig") + if(darkConfigStr !== null) { + darkConfig.value = JSON.parse(darkConfigStr) + if (darkConfig.value.followSystem) + if (isSystemDark()) { + dark() + isDark.value = true + } + else { + light() + isDark.value = false + } + + if (darkConfig.value.customTime) + if (isDarkTime(darkConfig.value)) { + dark() + isDark.value = true + } + else { + light() + isDark.value = false + } + + if(isDark.value) + dark() + else + light() + }else { + light() + darkConfig.value = {'followSystem': false, 'customTime': false} + } +} +function isSystemDark(){ + return window.matchMedia('(prefers-color-scheme: dark)').matches +} +function isDarkTime(darkConfig){ + let date = new Date() + let startTime = darkConfig.startTime + let endTime = darkConfig.endTime + if(startTime.hour > endTime.hour){ //隔夜 22:00 ~ 8:00 + if(date.getHours() > endTime.getHours() && date.getHours() < startTime.getHours()){ // 大于结束时间且小于起始时间 16:00 + return false + }else if(date.getHours() === endTime.getHours()){ //22:00 ~ 8:30 8:26 + return date.getMinutes() <= endTime.getMinutes(); + }else if(date.getHours() === startTime.getHours()){ //22:30 ~ 8:00 22:46 + return date.getMinutes() > startTime.getMinutes(); + }else + return true + }else{ //不隔夜 00:00 ~ 6:00 22:00 ~ 23:00 + if(date.getHours() > endTime.getHours() || date.getHours() < startTime.getHours()){ + return false + }else if(date.getHours() === startTime.getHours()){ // 01:30 ~ 06:00 01:32 + return date.getMinutes() >= startTime.getMinutes(); + }else if(date.getHours() === endTime.getHours()){ // 01:30 ~ 06:30 06:35 + return date.getMinutes() <= endTime.getMinutes(); + }else + return true + } +} +function dark(){ + let html = document.querySelector("html") + if(!html.classList.contains("dark")) + html.classList.add('dark') + document.querySelector(".DashBoard").style.setProperty("background-color", null) + document.querySelector(".app").style.setProperty("background-color", null) +} +function light(){ + let html = document.querySelector("html") + if(html.classList.contains("dark")) + html.classList.remove('dark') + + document.querySelector(".DashBoard").style.setProperty("background-color", "ghostwhite") + document.querySelector(".app").style.setProperty("background-color", "#c6e2ff") +} +function saveDarkConfig(){ + if(darkConfig.value.customTime) { + if(darkConfig.value.startTime === undefined || darkConfig.value.endTime === undefined){ + ElMessage("请正确选择起始时间") + return + } + } + + localStorage.setItem("darkConfig", JSON.stringify(darkConfig.value)) + isConfigDarkMode.value = false + adjustForStyle() +}