feat: 优化默认主题色及主题色切换保留问题。修复线上设备图片上传卡死问题

src/App.vue

@@ -74,7 +74,7 @@ export default defineComponent({
 				});
 				// 获取缓存中的布局配置
 				if (Local.get('themeConfig')) {
-					store.dispatch('themeConfig/setThemeConfig', Local.get('themeConfig'));
+					// store.dispatch('themeConfig/setThemeConfig', Local.get('themeConfig'));
 					document.documentElement.style.cssText = Local.get('themeConfigStyle');
 				}
 				// 获取缓存中的全屏配置

src/main.ts

@@ -56,4 +56,5 @@ function setTheme(matches: Boolean) {
   const body = document.documentElement as HTMLElement;
   body.setAttribute('data-theme', matches ? '' : 'dark');
   document.querySelector('html')!.className = matches ? '' : 'dark'
+  localStorage.setItem('isDark', matches ? '0' : '1')
 }

src/store/modules/themeConfig.ts

@@ -90,7 +90,7 @@ const themeConfigModule: Module<ThemeConfigState, RootStateTypes> = {
 			// 是否开启色弱模式
 			isInvert: false,
 			// 是否开启深色模式, 自动获取当前模式
-			isIsDark: window.matchMedia('(prefers-color-scheme: light)').matches,
+			isIsDark: localStorage.isDark ? localStorage.isDark === '1' : window.matchMedia('(prefers-color-scheme: dark)').matches,
 			// 是否开启水印
 			isWartermark: false,
 			// 水印文案
@@ -140,7 +140,7 @@ const themeConfigModule: Module<ThemeConfigState, RootStateTypes> = {
 		// 设置布局配置
 		getThemeConfig(state: any, data: any) {
 			state.themeConfig = data;
-			localStorage.setItem('isDark', data?.isIsDark ? '1' : '')
+			localStorage.setItem('isDark', data?.isIsDark ? '1' : '0')
 		},
 	},
 	actions: {

src/views/iot/device/instance/component/edit.vue

@@ -70,10 +70,10 @@
           <el-input v-model="intro" type="textarea" placeholder="请输入设备说明"></el-input>
         </el-form-item>
         <el-form-item label="设备图片">
-          <upload-vue :imgs="phone" @set-imgs="setImgsPhone" :limit="deviceImgLimit"></upload-vue>
+          <upload-vue :imgs="phone" key="phone" @set-imgs="setImgsPhone" :limit="deviceImgLimit"></upload-vue>
         </el-form-item>
         <el-form-item label="证书图片">
-          <upload-vue :imgs="certificate" @set-imgs="setImgsCertificate" :limit="certificateLimit"></upload-vue>
+          <upload-vue :imgs="certificate" key="certificate" @set-imgs="setImgsCertificate" :limit="certificateLimit"></upload-vue>
         </el-form-item>
       </el-form>
       <template #footer>
@@ -89,7 +89,7 @@
 </template>
 
 <script lang="ts">
-import { reactive, toRefs, defineComponent, ref, unref, nextTick, onMounted } from 'vue';
+import { reactive, toRefs, defineComponent, ref, unref } from 'vue';
 import api from '/@/api/device';
 import apiSystem from '/@/api/system';
 import { ElMessage, UploadProps } from "element-plus";
@@ -313,14 +313,10 @@ export default defineComponent({
     // 所属产品变化的时候，更新产品详情
     const productKeyChange = (productKey: string) => {
       api.product.detail(productKey).then((res: any) => {
-        const { authType, authUser, authPasswd, accessToken, certificateId } = res.data
+        const { authType } = res.data
         state.product = res.data
         // 认证方式使用设备的，不需要产品的来覆盖
         state.ruleForm.authType = authType
-        // state.ruleForm.authUser = authUser
-        // state.ruleForm.authPasswd = authPasswd
-        // state.ruleForm.accessToken = accessToken
-        // state.ruleForm.certificateId = certificateId
       })
     }