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