Resolve #6193
This commit is contained in:
parent
62f5ecd278
commit
3e1e234799
1 changed files with 21 additions and 7 deletions
|
@ -57,7 +57,8 @@
|
||||||
<mk-textarea v-model="installThemeCode">
|
<mk-textarea v-model="installThemeCode">
|
||||||
<span>{{ $t('_theme.code') }}</span>
|
<span>{{ $t('_theme.code') }}</span>
|
||||||
</mk-textarea>
|
</mk-textarea>
|
||||||
<mk-button @click="() => install(this.installThemeCode)" :disabled="installThemeCode == null"><fa :icon="faCheck"/> {{ $t('install') }}</mk-button>
|
<mk-button @click="() => install(this.installThemeCode)" :disabled="installThemeCode == null" primary inline><fa :icon="faCheck"/> {{ $t('install') }}</mk-button>
|
||||||
|
<mk-button @click="() => preview(this.installThemeCode)" :disabled="installThemeCode == null" inline><fa :icon="faEye"/> {{ $t('preview') }}</mk-button>
|
||||||
</details>
|
</details>
|
||||||
</div>
|
</div>
|
||||||
<div class="_content">
|
<div class="_content">
|
||||||
|
@ -79,7 +80,7 @@
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import Vue from 'vue';
|
import Vue from 'vue';
|
||||||
import { faPalette, faDownload, faFolderOpen, faCheck, faTrashAlt } from '@fortawesome/free-solid-svg-icons';
|
import { faPalette, faDownload, faFolderOpen, faCheck, faTrashAlt, faEye } from '@fortawesome/free-solid-svg-icons';
|
||||||
import * as JSON5 from 'json5';
|
import * as JSON5 from 'json5';
|
||||||
import MkInput from '../../components/ui/input.vue';
|
import MkInput from '../../components/ui/input.vue';
|
||||||
import MkButton from '../../components/ui/button.vue';
|
import MkButton from '../../components/ui/button.vue';
|
||||||
|
@ -108,7 +109,7 @@ export default Vue.extend({
|
||||||
installThemeCode: null,
|
installThemeCode: null,
|
||||||
selectedThemeId: null,
|
selectedThemeId: null,
|
||||||
wallpaper: localStorage.getItem('wallpaper'),
|
wallpaper: localStorage.getItem('wallpaper'),
|
||||||
faPalette, faDownload, faFolderOpen, faCheck, faTrashAlt
|
faPalette, faDownload, faFolderOpen, faCheck, faTrashAlt, faEye
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -196,8 +197,9 @@ export default Vue.extend({
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
install(code) {
|
parseThemeCode(code) {
|
||||||
let theme;
|
let theme;
|
||||||
|
|
||||||
try {
|
try {
|
||||||
theme = JSON5.parse(code);
|
theme = JSON5.parse(code);
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
|
@ -205,22 +207,34 @@ export default Vue.extend({
|
||||||
type: 'error',
|
type: 'error',
|
||||||
text: this.$t('_theme.invalid')
|
text: this.$t('_theme.invalid')
|
||||||
});
|
});
|
||||||
return;
|
return false;
|
||||||
}
|
}
|
||||||
if (!validateTheme(theme)) {
|
if (!validateTheme(theme)) {
|
||||||
this.$root.dialog({
|
this.$root.dialog({
|
||||||
type: 'error',
|
type: 'error',
|
||||||
text: this.$t('_theme.invalid')
|
text: this.$t('_theme.invalid')
|
||||||
});
|
});
|
||||||
return;
|
return false;
|
||||||
}
|
}
|
||||||
if (this.$store.state.device.themes.some(t => t.id === theme.id)) {
|
if (this.$store.state.device.themes.some(t => t.id === theme.id)) {
|
||||||
this.$root.dialog({
|
this.$root.dialog({
|
||||||
type: 'info',
|
type: 'info',
|
||||||
text: this.$t('_theme.alreadyInstalled')
|
text: this.$t('_theme.alreadyInstalled')
|
||||||
});
|
});
|
||||||
return;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
return theme;
|
||||||
|
},
|
||||||
|
|
||||||
|
preview(code) {
|
||||||
|
const theme = this.parseThemeCode(code);
|
||||||
|
if (theme) applyTheme(theme, false);
|
||||||
|
},
|
||||||
|
|
||||||
|
install(code) {
|
||||||
|
const theme = this.parseThemeCode(code);
|
||||||
|
if (!theme) return;
|
||||||
const themes = this.$store.state.device.themes.concat(theme);
|
const themes = this.$store.state.device.themes.concat(theme);
|
||||||
this.$store.commit('device/set', {
|
this.$store.commit('device/set', {
|
||||||
key: 'themes', value: themes
|
key: 'themes', value: themes
|
||||||
|
|
Loading…
Reference in a new issue