tweak ui
This commit is contained in:
		
							parent
							
								
									5e4877b8a4
								
							
						
					
					
						commit
						533955f928
					
				
					 6 changed files with 77 additions and 112 deletions
				
			
		|  | @ -171,11 +171,6 @@ export default defineComponent({ | |||
| 				text: i18n.locale.security, | ||||
| 				to: '/admin/security', | ||||
| 				active: page.value === 'security', | ||||
| 			}, { | ||||
| 				icon: 'fas fa-bolt', | ||||
| 				text: 'ServiceWorker', | ||||
| 				to: '/admin/service-worker', | ||||
| 				active: page.value === 'service-worker', | ||||
| 			}, { | ||||
| 				icon: 'fas fa-globe', | ||||
| 				text: i18n.locale.relays, | ||||
|  | @ -228,7 +223,6 @@ export default defineComponent({ | |||
| 				case 'email-settings': return defineAsyncComponent(() => import('./email-settings.vue')); | ||||
| 				case 'object-storage': return defineAsyncComponent(() => import('./object-storage.vue')); | ||||
| 				case 'security': return defineAsyncComponent(() => import('./security.vue')); | ||||
| 				case 'service-worker': return defineAsyncComponent(() => import('./service-worker.vue')); | ||||
| 				case 'relays': return defineAsyncComponent(() => import('./relays.vue')); | ||||
| 				case 'integrations': return defineAsyncComponent(() => import('./integrations.vue')); | ||||
| 				case 'instance-block': return defineAsyncComponent(() => import('./instance-block.vue')); | ||||
|  |  | |||
|  | @ -1,21 +1,7 @@ | |||
| <template> | ||||
| <MkSpacer :content-max="700" :margin-min="16" :margin-max="32"> | ||||
| 	<FormSuspense :p="init"> | ||||
| 		<FormSection> | ||||
| 			<FormInput v-model="summalyProxy" class="_formBlock"> | ||||
| 				<template #prefix><i class="fas fa-link"></i></template> | ||||
| 				<template #label>Summaly Proxy URL</template> | ||||
| 			</FormInput> | ||||
| 		</FormSection> | ||||
| 		<FormSection> | ||||
| 			<FormInput v-model="deeplAuthKey" class="_formBlock"> | ||||
| 				<template #prefix><i class="fas fa-key"></i></template> | ||||
| 				<template #label>DeepL Auth Key</template> | ||||
| 			</FormInput> | ||||
| 			<FormSwitch v-model="deeplIsPro" class="_formBlock"> | ||||
| 				<template #label>Pro account</template> | ||||
| 			</FormSwitch> | ||||
| 		</FormSection> | ||||
| 		none | ||||
| 	</FormSuspense> | ||||
| </MkSpacer> | ||||
| </template> | ||||
|  | @ -53,9 +39,6 @@ export default defineComponent({ | |||
| 					handler: this.save, | ||||
| 				}], | ||||
| 			}, | ||||
| 			summalyProxy: '', | ||||
| 			deeplAuthKey: '', | ||||
| 			deeplIsPro: false, | ||||
| 		} | ||||
| 	}, | ||||
| 
 | ||||
|  | @ -66,15 +49,9 @@ export default defineComponent({ | |||
| 	methods: { | ||||
| 		async init() { | ||||
| 			const meta = await os.api('meta', { detail: true }); | ||||
| 			this.summalyProxy = meta.summalyProxy; | ||||
| 			this.deeplAuthKey = meta.deeplAuthKey; | ||||
| 			this.deeplIsPro = meta.deeplIsPro; | ||||
| 		}, | ||||
| 		save() { | ||||
| 			os.apiWithDialog('admin/update-meta', { | ||||
| 				summalyProxy: this.summalyProxy, | ||||
| 				deeplAuthKey: this.deeplAuthKey, | ||||
| 				deeplIsPro: this.deeplIsPro, | ||||
| 			}).then(() => { | ||||
| 				fetchInstance(); | ||||
| 			}); | ||||
|  |  | |||
|  | @ -11,6 +11,19 @@ | |||
| 
 | ||||
| 				<XBotProtection/> | ||||
| 			</FormFolder> | ||||
| 
 | ||||
| 			<FormFolder class="_formBlock"> | ||||
| 				<template #label>Summaly Proxy</template> | ||||
| 
 | ||||
| 				<div class="_formRoot"> | ||||
| 					<FormInput v-model="summalyProxy" class="_formBlock"> | ||||
| 						<template #prefix><i class="fas fa-link"></i></template> | ||||
| 						<template #label>Summaly Proxy URL</template> | ||||
| 					</FormInput> | ||||
| 
 | ||||
| 					<FormButton primary class="_formBlock" @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton> | ||||
| 				</div> | ||||
| 			</FormFolder> | ||||
| 		</div> | ||||
| 	</FormSuspense> | ||||
| </MkSpacer> | ||||
|  | @ -23,6 +36,8 @@ import FormSwitch from '@/components/form/switch.vue'; | |||
| import FormInfo from '@/components/ui/info.vue'; | ||||
| import FormSuspense from '@/components/form/suspense.vue'; | ||||
| import FormSection from '@/components/form/section.vue'; | ||||
| import FormInput from '@/components/form/input.vue'; | ||||
| import FormButton from '@/components/ui/button.vue'; | ||||
| import XBotProtection from './bot-protection.vue'; | ||||
| import * as os from '@/os'; | ||||
| import * as symbols from '@/symbols'; | ||||
|  | @ -35,6 +50,8 @@ export default defineComponent({ | |||
| 		FormInfo, | ||||
| 		FormSection, | ||||
| 		FormSuspense, | ||||
| 		FormButton, | ||||
| 		FormInput, | ||||
| 		XBotProtection, | ||||
| 	}, | ||||
| 
 | ||||
|  | @ -47,6 +64,7 @@ export default defineComponent({ | |||
| 				icon: 'fas fa-lock', | ||||
| 				bg: 'var(--bg)', | ||||
| 			}, | ||||
| 			summalyProxy: '', | ||||
| 			enableHcaptcha: false, | ||||
| 			enableRecaptcha: false, | ||||
| 		} | ||||
|  | @ -59,9 +77,18 @@ export default defineComponent({ | |||
| 	methods: { | ||||
| 		async init() { | ||||
| 			const meta = await os.api('meta', { detail: true }); | ||||
| 			this.summalyProxy = meta.summalyProxy; | ||||
| 			this.enableHcaptcha = meta.enableHcaptcha; | ||||
| 			this.enableRecaptcha = meta.enableRecaptcha; | ||||
| 		}, | ||||
| 
 | ||||
| 		save() { | ||||
| 			os.apiWithDialog('admin/update-meta', { | ||||
| 				summalyProxy: this.summalyProxy, | ||||
| 			}).then(() => { | ||||
| 				fetchInstance(); | ||||
| 			}); | ||||
| 		} | ||||
| 	} | ||||
| }); | ||||
| </script> | ||||
|  |  | |||
|  | @ -1,81 +0,0 @@ | |||
| <template> | ||||
| <MkSpacer :content-max="700" :margin-min="16" :margin-max="32"> | ||||
| 	<FormSuspense :p="init"> | ||||
| 		<FormSwitch v-model="enableServiceWorker" class="_formBlock"> | ||||
| 			<template #label>{{ $ts.enableServiceworker }}</template> | ||||
| 			<template #caption>{{ $ts.serviceworkerInfo }}</template> | ||||
| 		</FormSwitch> | ||||
| 
 | ||||
| 		<template v-if="enableServiceWorker"> | ||||
| 			<FormInput v-model="swPublicKey" class="_formBlock"> | ||||
| 				<template #prefix><i class="fas fa-key"></i></template> | ||||
| 				<template #label>Public key</template> | ||||
| 			</FormInput> | ||||
| 
 | ||||
| 			<FormInput v-model="swPrivateKey" class="_formBlock"> | ||||
| 				<template #prefix><i class="fas fa-key"></i></template> | ||||
| 				<template #label>Private key</template> | ||||
| 			</FormInput> | ||||
| 		</template> | ||||
| 
 | ||||
| 		<FormButton primary class="_formBlock" @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton> | ||||
| 	</FormSuspense> | ||||
| </MkSpacer> | ||||
| </template> | ||||
| 
 | ||||
| <script lang="ts"> | ||||
| import { defineComponent } from 'vue'; | ||||
| import FormSwitch from '@/components/form/switch.vue'; | ||||
| import FormInput from '@/components/form/input.vue'; | ||||
| import FormButton from '@/components/ui/button.vue'; | ||||
| import FormSuspense from '@/components/form/suspense.vue'; | ||||
| import * as os from '@/os'; | ||||
| import * as symbols from '@/symbols'; | ||||
| import { fetchInstance } from '@/instance'; | ||||
| 
 | ||||
| export default defineComponent({ | ||||
| 	components: { | ||||
| 		FormSwitch, | ||||
| 		FormInput, | ||||
| 		FormButton, | ||||
| 		FormSuspense, | ||||
| 	}, | ||||
| 
 | ||||
| 	emits: ['info'], | ||||
| 
 | ||||
| 	data() { | ||||
| 		return { | ||||
| 			[symbols.PAGE_INFO]: { | ||||
| 				title: 'ServiceWorker', | ||||
| 				icon: 'fas fa-bolt', | ||||
| 				bg: 'var(--bg)', | ||||
| 			}, | ||||
| 			enableServiceWorker: false, | ||||
| 			swPublicKey: null, | ||||
| 			swPrivateKey: null, | ||||
| 		} | ||||
| 	}, | ||||
| 
 | ||||
| 	async mounted() { | ||||
| 		this.$emit('info', this[symbols.PAGE_INFO]); | ||||
| 	}, | ||||
| 
 | ||||
| 	methods: { | ||||
| 		async init() { | ||||
| 			const meta = await os.api('meta', { detail: true }); | ||||
| 			this.enableServiceWorker = meta.enableServiceWorker; | ||||
| 			this.swPublicKey = meta.swPublickey; | ||||
| 			this.swPrivateKey = meta.swPrivateKey; | ||||
| 		}, | ||||
| 		save() { | ||||
| 			os.apiWithDialog('admin/update-meta', { | ||||
| 				enableServiceWorker: this.enableServiceWorker, | ||||
| 				swPublicKey: this.swPublicKey, | ||||
| 				swPrivateKey: this.swPrivateKey, | ||||
| 			}).then(() => { | ||||
| 				fetchInstance(); | ||||
| 			}); | ||||
| 		} | ||||
| 	} | ||||
| }); | ||||
| </script> | ||||
|  | @ -94,6 +94,39 @@ | |||
| 					</FormInput> | ||||
| 				</FormSplit> | ||||
| 			</FormSection> | ||||
| 
 | ||||
| 			<FormSection> | ||||
| 				<template #label>ServiceWorker</template> | ||||
| 
 | ||||
| 				<FormSwitch v-model="enableServiceWorker" class="_formBlock"> | ||||
| 					<template #label>{{ $ts.enableServiceworker }}</template> | ||||
| 					<template #caption>{{ $ts.serviceworkerInfo }}</template> | ||||
| 				</FormSwitch> | ||||
| 
 | ||||
| 				<template v-if="enableServiceWorker"> | ||||
| 					<FormInput v-model="swPublicKey" class="_formBlock"> | ||||
| 						<template #prefix><i class="fas fa-key"></i></template> | ||||
| 						<template #label>Public key</template> | ||||
| 					</FormInput> | ||||
| 
 | ||||
| 					<FormInput v-model="swPrivateKey" class="_formBlock"> | ||||
| 						<template #prefix><i class="fas fa-key"></i></template> | ||||
| 						<template #label>Private key</template> | ||||
| 					</FormInput> | ||||
| 				</template> | ||||
| 			</FormSection> | ||||
| 
 | ||||
| 			<FormSection> | ||||
| 				<template #label>DeepL Translation</template> | ||||
| 
 | ||||
| 				<FormInput v-model="deeplAuthKey" class="_formBlock"> | ||||
| 					<template #prefix><i class="fas fa-key"></i></template> | ||||
| 					<template #label>DeepL Auth Key</template> | ||||
| 				</FormInput> | ||||
| 				<FormSwitch v-model="deeplIsPro" class="_formBlock"> | ||||
| 					<template #label>Pro account</template> | ||||
| 				</FormSwitch> | ||||
| 			</FormSection> | ||||
| 		</div> | ||||
| 	</FormSuspense> | ||||
| </MkSpacer> | ||||
|  | @ -156,6 +189,11 @@ export default defineComponent({ | |||
| 			remoteDriveCapacityMb: 0, | ||||
| 			enableRegistration: false, | ||||
| 			emailRequiredForSignup: false, | ||||
| 			enableServiceWorker: false, | ||||
| 			swPublicKey: null, | ||||
| 			swPrivateKey: null, | ||||
| 			deeplAuthKey: '', | ||||
| 			deeplIsPro: false, | ||||
| 		} | ||||
| 	}, | ||||
| 
 | ||||
|  | @ -184,6 +222,11 @@ export default defineComponent({ | |||
| 			this.remoteDriveCapacityMb = meta.driveCapacityPerRemoteUserMb; | ||||
| 			this.enableRegistration = !meta.disableRegistration; | ||||
| 			this.emailRequiredForSignup = meta.emailRequiredForSignup; | ||||
| 			this.enableServiceWorker = meta.enableServiceWorker; | ||||
| 			this.swPublicKey = meta.swPublickey; | ||||
| 			this.swPrivateKey = meta.swPrivateKey; | ||||
| 			this.deeplAuthKey = meta.deeplAuthKey; | ||||
| 			this.deeplIsPro = meta.deeplIsPro; | ||||
| 		}, | ||||
| 
 | ||||
| 		save() { | ||||
|  | @ -206,6 +249,11 @@ export default defineComponent({ | |||
| 				remoteDriveCapacityMb: parseInt(this.remoteDriveCapacityMb, 10), | ||||
| 				disableRegistration: !this.enableRegistration, | ||||
| 				emailRequiredForSignup: this.emailRequiredForSignup, | ||||
| 				enableServiceWorker: this.enableServiceWorker, | ||||
| 				swPublicKey: this.swPublicKey, | ||||
| 				swPrivateKey: this.swPrivateKey, | ||||
| 				deeplAuthKey: this.deeplAuthKey, | ||||
| 				deeplIsPro: this.deeplIsPro, | ||||
| 			}).then(() => { | ||||
| 				fetchInstance(); | ||||
| 			}); | ||||
|  |  | |||
|  | @ -10,7 +10,7 @@ | |||
| 		</FormTextarea> | ||||
| 
 | ||||
| 		<FormGroup> | ||||
| 			<div v-for="file in files" :key="file.id" class="_debobigegoItem _debobigegoPanel wqugxsfx" :style="{ backgroundImage: file ? `url(${ file.thumbnailUrl })` : null }"> | ||||
| 			<div v-for="file in files" :key="file.id" class="_formGroup wqugxsfx" :style="{ backgroundImage: file ? `url(${ file.thumbnailUrl })` : null }"> | ||||
| 				<div class="name">{{ file.name }}</div> | ||||
| 				<button v-tooltip="$ts.remove" class="remove _button" @click="remove(file)"><i class="fas fa-times"></i></button> | ||||
| 			</div> | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue