summaryrefslogtreecommitdiffstats
path: root/webapp/src
diff options
context:
space:
mode:
authorUdo Walter2018-07-20 07:28:09 +0200
committerUdo Walter2018-07-20 07:28:09 +0200
commita9b4f565571d63822d247f7b7d8c93df6d7c9b18 (patch)
treebe3be2f5b51bffcc1d0e559fba1b64caf378eb50 /webapp/src
parent[webapp/external-backends] Switched from emits to vuex storage system. Added ... (diff)
downloadbas-a9b4f565571d63822d247f7b7d8c93df6d7c9b18.tar.gz
bas-a9b4f565571d63822d247f7b7d8c93df6d7c9b18.tar.xz
bas-a9b4f565571d63822d247f7b7d8c93df6d7c9b18.zip
[webapp/settings] simplified settings storage
Diffstat (limited to 'webapp/src')
-rw-r--r--webapp/src/components/DashboardPage.vue4
-rw-r--r--webapp/src/components/SettingsModule.vue59
-rw-r--r--webapp/src/store/global.js8
-rw-r--r--webapp/src/store/groups.js2
4 files changed, 14 insertions, 59 deletions
diff --git a/webapp/src/components/DashboardPage.vue b/webapp/src/components/DashboardPage.vue
index 114df77..ffa57d0 100644
--- a/webapp/src/components/DashboardPage.vue
+++ b/webapp/src/components/DashboardPage.vue
@@ -69,8 +69,8 @@
<v-toolbar-side-icon class="drawer-icon" @click.stop="toggleDrawer"></v-toolbar-side-icon>
<img class="logo non-draggable hidden-md-and-down" src="@/assets/logo.svg" />
<v-spacer></v-spacer>
- <v-btn v-if="devMode" icon @click="$store.commit('setLocale', $i18n.locale === 'en' ? 'de' : 'en')"><v-icon>language</v-icon></v-btn>
- <v-btn v-if="devMode" icon @click="$store.commit('setDark', !dark)"><v-icon>invert_colors</v-icon></v-btn>
+ <v-btn v-if="devMode" icon @click="$store.commit('saveSetting', { name: 'locale', value: $i18n.locale === 'en' ? 'de' : 'en' })"><v-icon>language</v-icon></v-btn>
+ <v-btn v-if="devMode" icon @click="$store.commit('saveSetting', { name: 'dark', value: !dark })"><v-icon>invert_colors</v-icon></v-btn>
<v-toolbar-items>
<v-menu offset-y>
<v-btn class="user-button" flat slot="activator">
diff --git a/webapp/src/components/SettingsModule.vue b/webapp/src/components/SettingsModule.vue
index 262c2a2..960b9b5 100644
--- a/webapp/src/components/SettingsModule.vue
+++ b/webapp/src/components/SettingsModule.vue
@@ -19,42 +19,17 @@
<v-container>
<v-layout>
<v-flex md4 offset-md4 sm10 offset-sm1>
- <v-select
- class="lang-select"
- :items="langChoices"
- v-model="locale"
- solo
- offset-y
- ></v-select>
- <v-switch
- :label="$t('darkTheme')"
- v-model="dark"
- color="primary"
- ></v-switch>
- <v-switch
- :label="$t('coloredTabs')"
- v-model="coloredTabs"
- color="primary"
- ></v-switch>
- <v-switch
- :label="$t('clipped')"
- v-model="clipped"
- color="primary"
- class="hidden-md-and-down"
- ></v-switch>
- <v-switch
- :label="$t('mini')"
- v-model="mini"
- color="primary"
- class="hidden-md-and-down"
- ></v-switch>
+ <v-select :value="store.locale" @input="save('locale', $event)" class="lang-select" :items="langChoices" solo offset-y></v-select>
+ <v-switch :input-value="store.dark" @change="save('dark', $event)" :label="$t('darkTheme')" color="primary"></v-switch>
+ <v-switch :input-value="store.coloredTabs" @change="save('coloredTabs', $event)" :label="$t('coloredTabs')" color="primary"></v-switch>
+ <v-switch :input-value="store.clipped" @change="save('clipped', $event)" :label="$t('clipped')" color="primary" class="hidden-md-and-down"></v-switch>
+ <v-switch :input-value="store.mini" @change="save('mini', $event)" :label="$t('mini')" color="primary" class="hidden-md-and-down"></v-switch>
</v-flex>
</v-layout>
</v-container>
</template>
<script>
-
export default {
name: 'SettingsPage',
data () {
@@ -63,26 +38,10 @@ export default {
}
},
computed: {
- locale: {
- get () { return this.$store.state.locale },
- set (value) { this.$store.commit('setLocale', value) }
- },
- dark: {
- get () { return this.$store.state.dark },
- set (value) { this.$store.commit('setDark', value) }
- },
- coloredTabs: {
- get () { return this.$store.state.coloredTabs },
- set (value) { this.$store.commit('setColoredTabs', value) }
- },
- clipped: {
- get () { return this.$store.state.clipped },
- set (value) { this.$store.commit('setClipped', value) }
- },
- mini: {
- get () { return this.$store.state.mini },
- set (value) { this.$store.commit('setMini', value) }
- }
+ store () { return this.$store.state }
+ },
+ methods: {
+ save (name, value) { this.$store.commit('saveSetting', { name: name, value: value }) }
}
}
</script>
diff --git a/webapp/src/store/global.js b/webapp/src/store/global.js
index 0b52b12..3672c5f 100644
--- a/webapp/src/store/global.js
+++ b/webapp/src/store/global.js
@@ -14,14 +14,10 @@ export default {
nextSnackbar (state) {
if (state.snackbars) return state.snackbars[0]
else return ''
- },
+ }
},
mutations: {
- setLocale: (state, value) => { state.locale = value; localStorage.setItem('locale', value) },
- setDark: (state, value) => { state.dark = value; localStorage.setItem('dark', value) },
- setColoredTabs: (state, value) => { state.coloredTabs = value; localStorage.setItem('coloredTabs', value) },
- setClipped: (state, value) => { state.clipped = value; localStorage.setItem('clipped', value) },
- setMini: (state, value) => { state.mini = value; localStorage.setItem('mini', value) },
+ saveSetting (state, { name, value }) { if (name in state) state[name] = value; localStorage.setItem(name, value) },
shiftSnackbars (state) {
state.snackbars.shift()
},
diff --git a/webapp/src/store/groups.js b/webapp/src/store/groups.js
index c5ecce4..49c567a 100644
--- a/webapp/src/store/groups.js
+++ b/webapp/src/store/groups.js
@@ -6,7 +6,7 @@ export default {
groupChain: [],
activeTab: 0,
editGroupDialog: false,
- editGroup: null,
+ editGroup: null
},
mutations: {
updateActiveTab (state, tabIndex) {