Chnging platform changes theme

src/settings.js

@@ -25,6 +25,12 @@ module.exports = {
    */
   sidebarLogo: false,
 
+  /**
+   * @type {string} true | false
+   * @description Decide which countrys platform to show to the user
+   */
+  platform: 'DE',
+
   /**
    * @type {string | array} 'production' | ['production', 'development']
    * @description Need show err logs component.

src/styles/element-variables.scss

@@ -8,6 +8,9 @@ $--color-primary: #1890ff;
 $--color-success: #13ce66;
 $--color-warning: #FFBA00;
 $--color-danger: #ff4949;
+$--color-UKTheme: #29CBDD;
+$--color-DETheme: #41ED1B;
+
 // $--color-info: #1E1E1E;
 
 $--button-font-weight: 400;
@@ -27,5 +30,5 @@ $--font-path: '~element-ui/lib/theme-chalk/fonts';
 // the :export directive is the magic sauce for webpack
 // https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
 :export {
-  theme: $--color-primary;
+  theme: $--color-DETheme;
 }

src/views/dashboard/admin/index.vue

@@ -92,9 +92,12 @@ export default {
   data() {
     return {
       lineChartData: lineChartData.newVisitis,
-      platform: 'UK'
+      platform: ''
     }
   },
+  created() {
+    this.platform = this.$store.state.settings.platform
+  },
   methods: {
     handleSetLineChartData(type) {
       this.lineChartData = lineChartData[type]
@@ -104,7 +107,14 @@ export default {
         key: 'platform',
         value: this.platform
       })
-      console.log(this.$store.state.settings.platform)
+      this.themeChange()
+    },
+    themeChange() {
+      const themeColour = this.platform === 'UK' ? '#29CBDD' : '#41ED1B'
+      this.$store.dispatch('settings/changeSetting', {
+        key: 'theme',
+        value: themeColour
+      })
     }
   }
 }