mirror of
https://git.joinsharkey.org/Sharkey/Sharkey.git
synced 2024-11-27 01:43:08 +02:00
テーマに関して強化
This commit is contained in:
parent
6b96bd0185
commit
38139ee6c9
2 changed files with 24 additions and 9 deletions
|
@ -309,6 +309,8 @@ common/views/components/theme.vue:
|
||||||
select-theme: "テーマを選択してください"
|
select-theme: "テーマを選択してください"
|
||||||
uninstall: "アンインストール"
|
uninstall: "アンインストール"
|
||||||
uninstalled: "「{}」をアンインストールしました"
|
uninstalled: "「{}」をアンインストールしました"
|
||||||
|
author: "作者"
|
||||||
|
desc: "説明"
|
||||||
|
|
||||||
common/views/components/cw-button.vue:
|
common/views/components/cw-button.vue:
|
||||||
hide: "隠す"
|
hide: "隠す"
|
||||||
|
|
|
@ -52,13 +52,21 @@
|
||||||
|
|
||||||
<details>
|
<details>
|
||||||
<summary>%i18n:@installed-themes%</summary>
|
<summary>%i18n:@installed-themes%</summary>
|
||||||
<ui-select v-model="selectedInstalledTheme" placeholder="%i18n:@select-theme%">
|
<ui-select v-model="selectedInstalledThemeId" placeholder="%i18n:@select-theme%">
|
||||||
<option v-for="x in installedThemes" :value="x.id" :key="x.id">{{ x.name }}</option>
|
<option v-for="x in installedThemes" :value="x.id" :key="x.id">{{ x.name }}</option>
|
||||||
</ui-select>
|
</ui-select>
|
||||||
<ui-textarea readonly :value="selectedInstalledThemeCode">
|
<template v-if="selectedInstalledTheme">
|
||||||
<span>%i18n:@theme-code%</span>
|
<ui-input readonly :value="selectedInstalledTheme.author">
|
||||||
</ui-textarea>
|
<span>%i18n:@author%</span>
|
||||||
<ui-button @click="uninstall()">%i18n:@uninstall%</ui-button>
|
</ui-input>
|
||||||
|
<ui-textarea v-if="selectedInstalledTheme.desc" readonly :value="selectedInstalledTheme.desc">
|
||||||
|
<span>%i18n:@desc%</span>
|
||||||
|
</ui-textarea>
|
||||||
|
<ui-textarea readonly :value="selectedInstalledThemeCode">
|
||||||
|
<span>%i18n:@theme-code%</span>
|
||||||
|
</ui-textarea>
|
||||||
|
<ui-button @click="uninstall()">%i18n:@uninstall%</ui-button>
|
||||||
|
</template>
|
||||||
</details>
|
</details>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
@ -93,7 +101,7 @@ export default Vue.extend({
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
installThemeCode: null,
|
installThemeCode: null,
|
||||||
selectedInstalledTheme: null,
|
selectedInstalledThemeId: null,
|
||||||
myThemeBase: 'light',
|
myThemeBase: 'light',
|
||||||
myThemeName: '',
|
myThemeName: '',
|
||||||
myThemePrimary: lightTheme.vars.primary,
|
myThemePrimary: lightTheme.vars.primary,
|
||||||
|
@ -121,15 +129,20 @@ export default Vue.extend({
|
||||||
set(value) { this.$store.commit('device/set', { key: 'darkTheme', value }); }
|
set(value) { this.$store.commit('device/set', { key: 'darkTheme', value }); }
|
||||||
},
|
},
|
||||||
|
|
||||||
|
selectedInstalledTheme() {
|
||||||
|
if (this.selectedInstalledThemeId == null) return null;
|
||||||
|
return this.installedThemes.find(x => x.id == this.selectedInstalledThemeId);
|
||||||
|
},
|
||||||
|
|
||||||
selectedInstalledThemeCode() {
|
selectedInstalledThemeCode() {
|
||||||
if (this.selectedInstalledTheme == null) return null;
|
if (this.selectedInstalledTheme == null) return null;
|
||||||
return JSON5.stringify(this.installedThemes.find(x => x.id == this.selectedInstalledTheme), null, '\t');
|
return JSON5.stringify(this.selectedInstalledTheme, null, '\t');
|
||||||
},
|
},
|
||||||
|
|
||||||
myTheme(): any {
|
myTheme(): any {
|
||||||
return {
|
return {
|
||||||
name: this.myThemeName,
|
name: this.myThemeName,
|
||||||
author: this.$store.state.i.name,
|
author: this.$store.state.i.username,
|
||||||
base: this.myThemeBase,
|
base: this.myThemeBase,
|
||||||
vars: {
|
vars: {
|
||||||
primary: tinycolor(typeof this.myThemePrimary == 'string' ? this.myThemePrimary : this.myThemePrimary.rgba).toRgbString(),
|
primary: tinycolor(typeof this.myThemePrimary == 'string' ? this.myThemePrimary : this.myThemePrimary.rgba).toRgbString(),
|
||||||
|
@ -198,7 +211,7 @@ export default Vue.extend({
|
||||||
},
|
},
|
||||||
|
|
||||||
uninstall() {
|
uninstall() {
|
||||||
const theme = this.installedThemes.find(x => x.id == this.selectedInstalledTheme);
|
const theme = this.selectedInstalledTheme;
|
||||||
const themes = this.$store.state.device.themes.filter(t => t.id != theme.id);
|
const themes = this.$store.state.device.themes.filter(t => t.id != theme.id);
|
||||||
this.$store.commit('device/set', {
|
this.$store.commit('device/set', {
|
||||||
key: 'themes', value: themes
|
key: 'themes', value: themes
|
||||||
|
|
Loading…
Reference in a new issue