🎨
This commit is contained in:
		@@ -1,49 +1,71 @@
 | 
			
		||||
<template>
 | 
			
		||||
<section class="_section">
 | 
			
		||||
	<div class="_title"><Fa :icon="faBoxes"/> {{ $ts.importAndExport }}</div>
 | 
			
		||||
	<div class="_content">
 | 
			
		||||
		<MkSelect v-model:value="exportTarget">
 | 
			
		||||
			<option value="notes">{{ $ts._exportOrImport.allNotes }}</option>
 | 
			
		||||
			<option value="following">{{ $ts._exportOrImport.followingList }}</option>
 | 
			
		||||
			<option value="user-lists">{{ $ts._exportOrImport.userLists }}</option>
 | 
			
		||||
			<option value="mute">{{ $ts._exportOrImport.muteList }}</option>
 | 
			
		||||
			<option value="blocking">{{ $ts._exportOrImport.blockingList }}</option>
 | 
			
		||||
		</MkSelect>
 | 
			
		||||
		<MkButton inline primary @click="doExport"><Fa :icon="faDownload"/> {{ $ts.export }}</MkButton>
 | 
			
		||||
		<MkButton inline primary @click="doImport" :disabled="!['following', 'user-lists'].includes(exportTarget)"><Fa :icon="faUpload"/> {{ $ts.import }}</MkButton>
 | 
			
		||||
	</div>
 | 
			
		||||
</section>
 | 
			
		||||
<FormBase>
 | 
			
		||||
	<FormGroup>
 | 
			
		||||
		<template #label>{{ $ts._exportOrImport.allNotes }}</template>
 | 
			
		||||
		<FormButton @click="doExport('notes')"><Fa :icon="faDownload"/> {{ $ts.export }}</FormButton>
 | 
			
		||||
	</FormGroup>
 | 
			
		||||
	<FormGroup>
 | 
			
		||||
		<template #label>{{ $ts._exportOrImport.followingList }}</template>
 | 
			
		||||
		<FormButton @click="doExport('following')"><Fa :icon="faDownload"/> {{ $ts.export }}</FormButton>
 | 
			
		||||
		<FormButton @click="doImport('following', $event)"><Fa :icon="faUpload"/> {{ $ts.import }}</FormButton>
 | 
			
		||||
	</FormGroup>
 | 
			
		||||
	<FormGroup>
 | 
			
		||||
		<template #label>{{ $ts._exportOrImport.userLists }}</template>
 | 
			
		||||
		<FormButton @click="doExport('user-lists')"><Fa :icon="faDownload"/> {{ $ts.export }}</FormButton>
 | 
			
		||||
		<FormButton @click="doImport('user-lists', $event)"><Fa :icon="faUpload"/> {{ $ts.import }}</FormButton>
 | 
			
		||||
	</FormGroup>
 | 
			
		||||
	<FormGroup>
 | 
			
		||||
		<template #label>{{ $ts._exportOrImport.muteList }}</template>
 | 
			
		||||
		<FormButton @click="doExport('mute')"><Fa :icon="faDownload"/> {{ $ts.export }}</FormButton>
 | 
			
		||||
	</FormGroup>
 | 
			
		||||
	<FormGroup>
 | 
			
		||||
		<template #label>{{ $ts._exportOrImport.blockingList }}</template>
 | 
			
		||||
		<FormButton @click="doExport('blocking')"><Fa :icon="faDownload"/> {{ $ts.export }}</FormButton>
 | 
			
		||||
	</FormGroup>
 | 
			
		||||
</FormBase>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script lang="ts">
 | 
			
		||||
import { defineComponent } from 'vue';
 | 
			
		||||
import { faDownload, faUpload, faBoxes } from '@fortawesome/free-solid-svg-icons';
 | 
			
		||||
import MkButton from '@/components/ui/button.vue';
 | 
			
		||||
import MkSelect from '@/components/ui/select.vue';
 | 
			
		||||
import FormSelect from '@/components/form/select.vue';
 | 
			
		||||
import FormButton from '@/components/form/button.vue';
 | 
			
		||||
import FormBase from '@/components/form/base.vue';
 | 
			
		||||
import FormGroup from '@/components/form/group.vue';
 | 
			
		||||
import * as os from '@/os';
 | 
			
		||||
import { selectFile } from '@/scripts/select-file';
 | 
			
		||||
 | 
			
		||||
export default defineComponent({
 | 
			
		||||
	components: {
 | 
			
		||||
		MkButton,
 | 
			
		||||
		MkSelect,
 | 
			
		||||
		FormBase,
 | 
			
		||||
		FormGroup,
 | 
			
		||||
		FormButton,
 | 
			
		||||
	},
 | 
			
		||||
 | 
			
		||||
	emits: ['info'],
 | 
			
		||||
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			exportTarget: 'notes',
 | 
			
		||||
			INFO: {
 | 
			
		||||
				title: this.$ts.importAndExport,
 | 
			
		||||
				icon: faBoxes
 | 
			
		||||
			},
 | 
			
		||||
			faDownload, faUpload, faBoxes
 | 
			
		||||
		}
 | 
			
		||||
	},
 | 
			
		||||
 | 
			
		||||
	mounted() {
 | 
			
		||||
		this.$emit('info', this.INFO);
 | 
			
		||||
	},
 | 
			
		||||
 | 
			
		||||
	methods: {
 | 
			
		||||
		doExport() {
 | 
			
		||||
		doExport(target) {
 | 
			
		||||
			os.api(
 | 
			
		||||
				this.exportTarget == 'notes' ? 'i/export-notes' :
 | 
			
		||||
				this.exportTarget == 'following' ? 'i/export-following' :
 | 
			
		||||
				this.exportTarget == 'blocking' ? 'i/export-blocking' :
 | 
			
		||||
				this.exportTarget == 'user-lists' ? 'i/export-user-lists' :
 | 
			
		||||
				this.exportTarget == 'mute' ? 'i/export-mute' :
 | 
			
		||||
				target == 'notes' ? 'i/export-notes' :
 | 
			
		||||
				target == 'following' ? 'i/export-following' :
 | 
			
		||||
				target == 'blocking' ? 'i/export-blocking' :
 | 
			
		||||
				target == 'user-lists' ? 'i/export-user-lists' :
 | 
			
		||||
				target == 'mute' ? 'i/export-mute' :
 | 
			
		||||
				null, {})
 | 
			
		||||
			.then(() => {
 | 
			
		||||
				os.dialog({
 | 
			
		||||
@@ -58,12 +80,12 @@ export default defineComponent({
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		async doImport(e) {
 | 
			
		||||
		async doImport(target, e) {
 | 
			
		||||
			const file = await selectFile(e.currentTarget || e.target);
 | 
			
		||||
			
 | 
			
		||||
			os.api(
 | 
			
		||||
				this.exportTarget == 'following' ? 'i/import-following' :
 | 
			
		||||
				this.exportTarget == 'user-lists' ? 'i/import-user-lists' :
 | 
			
		||||
				target == 'following' ? 'i/import-following' :
 | 
			
		||||
				target == 'user-lists' ? 'i/import-user-lists' :
 | 
			
		||||
				null, {
 | 
			
		||||
					fileId: file.id
 | 
			
		||||
			}).then(() => {
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user