Backup_Repos/komga
1
0
Fork 0
mirror of https://github.com/gotson/komga.git synced 2025-12-21 16:03:03 +01:00
Code Issues Projects Releases Wiki Activity

fix(webui): theme is not restored properly

Browse source 
closes #304
This commit is contained in:
Gauthier Roebroeck 2020-09-01 11:23:53 +08:00
parent 229a9b6573
commit 432dc91562
1 changed files with 23 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
komga-webui/src/views/Home.vue
View file

@ -102,12 +102,12 @@
<v-list>
<v-list-item>
<v-list-item-icon>
<v-icon v-if="activeTheme === Theme.LIGHT">mdi-brightness-7</v-icon>
<v-icon v-if="activeTheme === Theme.DARK">mdi-brightness-3</v-icon>
<v-icon v-if="activeTheme === Theme.SYSTEM">mdi-brightness-auto</v-icon>
<v-icon v-if="theme === Theme.LIGHT">mdi-brightness-7</v-icon>
<v-icon v-if="theme === Theme.DARK">mdi-brightness-3</v-icon>
<v-icon v-if="theme === Theme.SYSTEM">mdi-brightness-auto</v-icon>
</v-list-item-icon>
<v-select
v-model="activeTheme"
v-model="theme"
:items="themes"
label="Theme"
></v-select>
@ -148,7 +148,9 @@ export default Vue.extend({
return {
drawerVisible: this.$vuetify.breakpoint.lgAndUp,
info: {} as ActuatorInfo,
activeTheme: Theme.LIGHT,
settings: {
theme: Theme.LIGHT,
},
Theme,
themes: [
{ text: Theme.LIGHT.valueOf(), value: Theme.LIGHT },
@ -157,11 +159,6 @@ export default Vue.extend({
],
}
},
watch: {
activeTheme (val) {
this.changeTheme(val)
},
},
async created () {
if (this.isAdmin) {
this.info = await this.$actuator.getInfo()
@ -170,7 +167,7 @@ export default Vue.extend({
if (this.$cookies.isKey(cookieTheme)) {
const theme = this.$cookies.get(cookieTheme)
if (Object.values(Theme).includes(theme)) {
this.activeTheme = theme as Theme
this.theme = theme as Theme
}
}
@ -186,18 +183,30 @@ export default Vue.extend({
isAdmin (): boolean {
return this.$store.getters.meAdmin
},
theme: {
get: function (): Theme {
return this.settings.theme
},
set: function (theme: Theme): void {
if (Object.values(Theme).includes(theme)) {
this.settings.theme = theme
this.changeTheme(theme)
this.$cookies.set(cookieTheme, theme, Infinity)
}
},
},
},
methods: {
toggleDrawer () {
this.drawerVisible = !this.drawerVisible
},
systemThemeChange () {
if (this.activeTheme === Theme.SYSTEM) {
this.changeTheme(this.activeTheme)
if (this.theme === Theme.SYSTEM) {
this.changeTheme(this.theme)
}
},
changeTheme (theme: Theme) {
this.$cookies.set(cookieTheme, theme.valueOf())
switch (theme) {
case Theme.DARK:
this.$vuetify.theme.dark = true