78 lines
1.5 KiB
Vue
78 lines
1.5 KiB
Vue
<template>
|
|
<XModalWindow
|
|
ref="dialog"
|
|
:width="800"
|
|
:height="500"
|
|
:with-ok-button="true"
|
|
:ok-button-disabled="type === 'file' && selected.length === 0"
|
|
@click="cancel()"
|
|
@close="cancel()"
|
|
@ok="ok()"
|
|
@closed="emit('closed')"
|
|
>
|
|
<template #header>
|
|
{{
|
|
multiple
|
|
? type === "file"
|
|
? i18n.ts.selectFiles
|
|
: i18n.ts.selectFolders
|
|
: type === "file"
|
|
? i18n.ts.selectFile
|
|
: i18n.ts.selectFolder
|
|
}}
|
|
<span
|
|
v-if="selected.length > 0"
|
|
style="margin-left: 8px; opacity: 0.5"
|
|
>({{ number(selected.length) }})</span
|
|
>
|
|
</template>
|
|
<XDrive
|
|
:multiple="multiple"
|
|
:select="type"
|
|
@changeSelection="onChangeSelection"
|
|
@selected="ok()"
|
|
/>
|
|
</XModalWindow>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { ref } from "vue";
|
|
import * as Misskey from "calckey-js";
|
|
import XDrive from "@/components/MkDrive.vue";
|
|
import XModalWindow from "@/components/MkModalWindow.vue";
|
|
import number from "@/filters/number";
|
|
import { i18n } from "@/i18n";
|
|
|
|
withDefaults(
|
|
defineProps<{
|
|
type?: "file" | "folder";
|
|
multiple: boolean;
|
|
}>(),
|
|
{
|
|
type: "file",
|
|
}
|
|
);
|
|
|
|
const emit = defineEmits<{
|
|
(ev: "done", r?: Misskey.entities.DriveFile[]): void;
|
|
(ev: "closed"): void;
|
|
}>();
|
|
|
|
const dialog = ref<InstanceType<typeof XModalWindow>>();
|
|
|
|
const selected = ref<Misskey.entities.DriveFile[]>([]);
|
|
|
|
function ok() {
|
|
emit("done", selected.value);
|
|
dialog.value?.close();
|
|
}
|
|
|
|
function cancel() {
|
|
emit("done");
|
|
dialog.value?.close();
|
|
}
|
|
|
|
function onChangeSelection(files: Misskey.entities.DriveFile[]) {
|
|
selected.value = files;
|
|
}
|
|
</script>
|