refactor(client): refactor admin/instance-block to use Composition API (#8663)
This commit is contained in:
		
							parent
							
								
									18307c822c
								
							
						
					
					
						commit
						bf6cc34961
					
				
					 1 changed files with 23 additions and 35 deletions
				
			
		|  | @ -2,57 +2,45 @@ | |||
| <MkSpacer :content-max="700" :margin-min="16" :margin-max="32"> | ||||
| 	<FormSuspense :p="init"> | ||||
| 		<FormTextarea v-model="blockedHosts" class="_formBlock"> | ||||
| 			<span>{{ $ts.blockedInstances }}</span> | ||||
| 			<template #caption>{{ $ts.blockedInstancesDescription }}</template> | ||||
| 			<span>{{ i18n.ts.blockedInstances }}</span> | ||||
| 			<template #caption>{{ i18n.ts.blockedInstancesDescription }}</template> | ||||
| 		</FormTextarea> | ||||
| 
 | ||||
| 		<FormButton primary class="_formBlock" @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton> | ||||
| 		<FormButton primary class="_formBlock" @click="save"><i class="fas fa-save"></i> {{ i18n.ts.save }}</FormButton> | ||||
| 	</FormSuspense> | ||||
| </MkSpacer> | ||||
| </template> | ||||
| 
 | ||||
| <script lang="ts"> | ||||
| import { defineComponent } from 'vue'; | ||||
| <script lang="ts" setup> | ||||
| import { } from 'vue'; | ||||
| import FormButton from '@/components/ui/button.vue'; | ||||
| import FormTextarea from '@/components/form/textarea.vue'; | ||||
| import FormSuspense from '@/components/form/suspense.vue'; | ||||
| import * as os from '@/os'; | ||||
| import * as symbols from '@/symbols'; | ||||
| import { fetchInstance } from '@/instance'; | ||||
| import { i18n } from '@/i18n'; | ||||
| 
 | ||||
| export default defineComponent({ | ||||
| 	components: { | ||||
| 		FormButton, | ||||
| 		FormTextarea, | ||||
| 		FormSuspense, | ||||
| 	}, | ||||
| let blockedHosts: string = $ref(''); | ||||
| 
 | ||||
| 	emits: ['info'], | ||||
| async function init() { | ||||
| 	const meta = await os.api('admin/meta'); | ||||
| 	blockedHosts = meta.blockedHosts.join('\n'); | ||||
| } | ||||
| 
 | ||||
| 	data() { | ||||
| 		return { | ||||
| 			[symbols.PAGE_INFO]: { | ||||
| 				title: this.$ts.instanceBlocking, | ||||
| 				icon: 'fas fa-ban', | ||||
| 				bg: 'var(--bg)', | ||||
| 			}, | ||||
| 			blockedHosts: '', | ||||
| 		} | ||||
| 	}, | ||||
| function save() { | ||||
| 	os.apiWithDialog('admin/update-meta', { | ||||
| 		blockedHosts: blockedHosts.split('\n') || [], | ||||
| 	}).then(() => { | ||||
| 		fetchInstance(); | ||||
| 	}); | ||||
| } | ||||
| 
 | ||||
| 	methods: { | ||||
| 		async init() { | ||||
| 			const meta = await os.api('admin/meta'); | ||||
| 			this.blockedHosts = meta.blockedHosts.join('\n'); | ||||
| 		}, | ||||
| 
 | ||||
| 		save() { | ||||
| 			os.apiWithDialog('admin/update-meta', { | ||||
| 				blockedHosts: this.blockedHosts.split('\n') || [], | ||||
| 			}).then(() => { | ||||
| 				fetchInstance(); | ||||
| 			}); | ||||
| 		} | ||||
| defineExpose({ | ||||
| 	[symbols.PAGE_INFO]: { | ||||
| 		title: i18n.ts.instanceBlocking, | ||||
| 		icon: 'fas fa-ban', | ||||
| 		bg: 'var(--bg)', | ||||
| 	} | ||||
| }); | ||||
| </script> | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue