Make switches functional

client/src/modules/ui/vue/components/BdSettings.vue

@@ -52,7 +52,21 @@
         return item.id === this.activeIndex;
     }
 
-    const methods = { itemOnClick, animatingContent, activeContent };
+    function enableSetting(cat, id) {
+        switch (cat) {
+            case 'core':
+                return this.coreSettings.find(setting => setting.id === id).enabled = true;
+        }
+    }
+
+    function disableSetting(cat, id) {
+        switch (cat) {
+            case 'core':
+                return this.coreSettings.find(setting => setting.id === id).enabled = false;
+        }
+    }
+
+    const methods = { itemOnClick, animatingContent, activeContent, enableSetting, disableSetting };
 
     export default {
         components,
@@ -64,12 +78,13 @@
                 activeIndex: -1,
                 lastActiveIndex: -1,
                 animating: false,
-                first: true
+                first: true,
+                settings: Settings.getSettings
             }
         },
         computed: {
             coreSettings: function () {
-                return (Settings.getSettings.find(settingset => settingset.id === 'core')).settings;
+                return this.settings.find(settingset => settingset.id === 'core').settings;
             }
         },
         updated: function () {

client/src/modules/ui/vue/components/bd/CoreSettings.vue

@@ -15,6 +15,8 @@
 
     /*Methods*/
     function settingOnClick(setting) {
+        if (setting.enabled) return this.disableSetting('core', setting.id);
+        this.enableSetting('core', setting.id);
     }
 
     const methods = { settingOnClick };
@@ -22,6 +24,6 @@
     export default {
         components,
         methods,
-        props: ['settings']
+        props: ['settings', 'enableSetting', 'disableSetting']
     }
 </script>

client/src/modules/ui/vue/components/templates/BdSettings.html

@@ -9,7 +9,7 @@
         </Sidebar>
         <ContentColumn slot="content">
             <div :class="{active: activeContent('core'), animating: animatingContent('core')}">
-                <CoreSettings :settings="coreSettings"/>
+                <CoreSettings :settings="coreSettings" :enableSetting="enableSetting" :disableSetting="disableSetting"/>
             </div>
             <div :class="{active: activeContent('ui'), animating: animatingContent('ui')}">
                 <UISettings />