]>
Commit | Line | Data |
---|---|---|
b9c5fcf0 BW |
1 | <template> |
2 | <a v-on:click="toggleSetting()" class="navbar-item is-inline-block-mobile"> | |
da6e676d | 3 | <span><i :class="['fas', 'fa-fw', value ? icon : iconAlt]"></i></span> |
b9c5fcf0 BW |
4 | <slot></slot> |
5 | </a> | |
6 | </template> | |
7 | ||
8 | <script> | |
9 | export default { | |
10 | name: "SettingToggle", | |
11 | props: { | |
12 | name: String, | |
13 | icon: String, | |
14 | iconAlt: String, | |
15 | }, | |
16 | data: function () { | |
17 | return { | |
18 | value: true, | |
19 | }; | |
20 | }, | |
21 | created: function () { | |
22 | if (!this.iconAlt) { | |
23 | this.iconAlt = this.icon; | |
24 | } | |
25 | ||
26 | if (this.name in localStorage) { | |
27 | this.value = JSON.parse(localStorage[this.name]); | |
28 | } | |
29 | ||
30 | this.$emit("updated", this.value); | |
31 | }, | |
32 | methods: { | |
33 | toggleSetting: function () { | |
34 | this.value = !this.value; | |
35 | localStorage[this.name] = this.value; | |
36 | this.$emit("updated", this.value); | |
37 | }, | |
38 | }, | |
39 | }; | |
40 | </script> |