From 3ed878b8f3a930089f85cc64c8459af8050c1192 Mon Sep 17 00:00:00 2001
From: iczer <1126263215@qq.com>
Date: Thu, 2 Jul 2020 21:58:45 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20the=20problem=20that=20layout=20and=20th?=
 =?UTF-8?q?eme=20initialization=20settings=20do=20not=20take=20effect;=20:?=
 =?UTF-8?q?bug:=20=E4=BF=AE=E5=A4=8D=EF=BC=9A=E5=AF=BC=E8=88=AA=E5=B8=83?=
 =?UTF-8?q?=E5=B1=80=E5=92=8C=E4=B8=BB=E9=A2=98=E8=AE=BE=E7=BD=AE=E4=B8=8D?=
 =?UTF-8?q?=E7=94=9F=E6=95=88=E9=97=AE=E9=A2=98=EF=BC=9B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/setting/Setting.vue | 17 +++++++++--------
 1 file changed, 9 insertions(+), 8 deletions(-)

diff --git a/src/components/setting/Setting.vue b/src/components/setting/Setting.vue
index 1e48f93..83de32b 100644
--- a/src/components/setting/Setting.vue
+++ b/src/components/setting/Setting.vue
@@ -1,8 +1,8 @@
 <template>
   <div class="side-setting">
     <setting-item :title="$t('theme.title')">
-      <img-checkbox-group @change="values => setTheme(values[0])">
-        <img-checkbox :title="$t('theme.dark')" img="https://gw.alipayobjects.com/zos/rmsportal/LCkqqYNmvBEbokSDscrm.svg" :checked="true" value="dark"/>
+      <img-checkbox-group @change="values => setTheme(values[0])" :default-values="[theme]">
+        <img-checkbox :title="$t('theme.dark')" img="https://gw.alipayobjects.com/zos/rmsportal/LCkqqYNmvBEbokSDscrm.svg" value="dark"/>
         <img-checkbox :title="$t('theme.light')" img="https://gw.alipayobjects.com/zos/rmsportal/jpRkZQMyYRryryPNtyIC.svg" value="light"/>
       </img-checkbox-group>
     </setting-item>
@@ -13,8 +13,8 @@
     </setting-item>
     <a-divider/>
     <setting-item :title="$t('navigate.title')">
-      <img-checkbox-group @change="values => setLayout(values[0])">
-        <img-checkbox :title="$t('navigate.side')" img="https://gw.alipayobjects.com/zos/rmsportal/JopDzEhOqwOjeNTXkoje.svg" :checked="true" value="side"/>
+      <img-checkbox-group @change="values => setLayout(values[0])" :default-values="[layout]">
+        <img-checkbox :title="$t('navigate.side')" img="https://gw.alipayobjects.com/zos/rmsportal/JopDzEhOqwOjeNTXkoje.svg" value="side"/>
         <img-checkbox :title="$t('navigate.head')" img="https://gw.alipayobjects.com/zos/rmsportal/KDNDBbriJhLwuqMoxcAr.svg" value="head"/>
       </img-checkbox-group>
     </setting-item>
@@ -89,7 +89,6 @@ import { mapState, mapMutations } from 'vuex'
 
 const ColorCheckboxGroup = ColorCheckbox.Group
 const ImgCheckboxGroup = ImgCheckbox.Group
-const colors = ['#f5222d', '#fa541c', '#fadb14', '#49aa19', '#13c2c2', '#1890ff', '#722ed1', '#eb2f96']
 export default {
   name: 'Setting',
   i18n: require('./i18n'),
@@ -98,15 +97,17 @@ export default {
     return {
       animate: this.$store.state.setting.animate.name,
       direction: this.$store.state.setting.animate.direction,
-      themeColorIndex: [colors.indexOf(this.$store.state.setting.themeColor)],
-      colors,
+      colors: ['#f5222d', '#fa541c', '#fadb14', '#49aa19', '#13c2c2', '#1890ff', '#722ed1', '#eb2f96'],
     }
   },
   computed: {
     directions() {
       return this.animates.find(item => item.name == this.animate).directions
     },
-    ...mapState('setting', ['animates', 'multiPage', 'weekMode', 'fixedHeader', 'fixedSideBar'])
+    themeColorIndex() {
+      return [this.colors.indexOf(this.themeColor)]
+    },
+    ...mapState('setting', ['theme', 'themeColor', 'layout', 'animates', 'multiPage', 'weekMode', 'fixedHeader', 'fixedSideBar'])
   },
   methods: {
     onColorChange (values, colors) {