テーマに関して強化
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: "テーマを選択してください"
 | 
			
		||||
  uninstall: "アンインストール"
 | 
			
		||||
  uninstalled: "「{}」をアンインストールしました"
 | 
			
		||||
  author: "作者"
 | 
			
		||||
  desc: "説明"
 | 
			
		||||
 | 
			
		||||
common/views/components/cw-button.vue:
 | 
			
		||||
  hide: "隠す"
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -52,13 +52,21 @@
 | 
			
		|||
 | 
			
		||||
	<details>
 | 
			
		||||
		<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>
 | 
			
		||||
		</ui-select>
 | 
			
		||||
		<ui-textarea readonly :value="selectedInstalledThemeCode">
 | 
			
		||||
			<span>%i18n:@theme-code%</span>
 | 
			
		||||
		</ui-textarea>
 | 
			
		||||
		<ui-button @click="uninstall()">%i18n:@uninstall%</ui-button>
 | 
			
		||||
		<template v-if="selectedInstalledTheme">
 | 
			
		||||
			<ui-input readonly :value="selectedInstalledTheme.author">
 | 
			
		||||
				<span>%i18n:@author%</span>
 | 
			
		||||
			</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>
 | 
			
		||||
</div>
 | 
			
		||||
</template>
 | 
			
		||||
| 
						 | 
				
			
			@ -93,7 +101,7 @@ export default Vue.extend({
 | 
			
		|||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			installThemeCode: null,
 | 
			
		||||
			selectedInstalledTheme: null,
 | 
			
		||||
			selectedInstalledThemeId: null,
 | 
			
		||||
			myThemeBase: 'light',
 | 
			
		||||
			myThemeName: '',
 | 
			
		||||
			myThemePrimary: lightTheme.vars.primary,
 | 
			
		||||
| 
						 | 
				
			
			@ -121,15 +129,20 @@ export default Vue.extend({
 | 
			
		|||
			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() {
 | 
			
		||||
			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 {
 | 
			
		||||
			return {
 | 
			
		||||
				name: this.myThemeName,
 | 
			
		||||
				author: this.$store.state.i.name,
 | 
			
		||||
				author: this.$store.state.i.username,
 | 
			
		||||
				base: this.myThemeBase,
 | 
			
		||||
				vars: {
 | 
			
		||||
					primary: tinycolor(typeof this.myThemePrimary == 'string' ? this.myThemePrimary : this.myThemePrimary.rgba).toRgbString(),
 | 
			
		||||
| 
						 | 
				
			
			@ -198,7 +211,7 @@ export default Vue.extend({
 | 
			
		|||
		},
 | 
			
		||||
 | 
			
		||||
		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);
 | 
			
		||||
			this.$store.commit('device/set', {
 | 
			
		||||
				key: 'themes', value: themes
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue