refactor
This commit is contained in:
parent
b5ccac3cb5
commit
2a1d9a7428
|
@ -43,13 +43,13 @@ const props = withDefaults(defineProps<{
|
||||||
});
|
});
|
||||||
|
|
||||||
const emit = defineEmits<{
|
const emit = defineEmits<{
|
||||||
(e: 'chosen', v: Misskey.entities.DriveFolder): void;
|
(ev: 'chosen', v: Misskey.entities.DriveFolder): void;
|
||||||
(e: 'move', v: Misskey.entities.DriveFolder): void;
|
(ev: 'move', v: Misskey.entities.DriveFolder): void;
|
||||||
(e: 'upload', file: File, folder: Misskey.entities.DriveFolder);
|
(ev: 'upload', file: File, folder: Misskey.entities.DriveFolder);
|
||||||
(e: 'removeFile', v: Misskey.entities.DriveFile['id']): void;
|
(ev: 'removeFile', v: Misskey.entities.DriveFile['id']): void;
|
||||||
(e: 'removeFolder', v: Misskey.entities.DriveFolder['id']): void;
|
(ev: 'removeFolder', v: Misskey.entities.DriveFolder['id']): void;
|
||||||
(e: 'dragstart'): void;
|
(ev: 'dragstart'): void;
|
||||||
(e: 'dragend'): void;
|
(ev: 'dragend'): void;
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
const hover = ref(false);
|
const hover = ref(false);
|
||||||
|
@ -58,7 +58,7 @@ const isDragging = ref(false);
|
||||||
|
|
||||||
const title = computed(() => props.folder.name);
|
const title = computed(() => props.folder.name);
|
||||||
|
|
||||||
function checkboxClicked(e) {
|
function checkboxClicked() {
|
||||||
emit('chosen', props.folder);
|
emit('chosen', props.folder);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -74,24 +74,24 @@ function onMouseout() {
|
||||||
hover.value = false
|
hover.value = false
|
||||||
}
|
}
|
||||||
|
|
||||||
function onDragover(e: DragEvent) {
|
function onDragover(ev: DragEvent) {
|
||||||
if (!e.dataTransfer) return;
|
if (!ev.dataTransfer) return;
|
||||||
|
|
||||||
// 自分自身がドラッグされている場合
|
// 自分自身がドラッグされている場合
|
||||||
if (isDragging.value) {
|
if (isDragging.value) {
|
||||||
// 自分自身にはドロップさせない
|
// 自分自身にはドロップさせない
|
||||||
e.dataTransfer.dropEffect = 'none';
|
ev.dataTransfer.dropEffect = 'none';
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const isFile = e.dataTransfer.items[0].kind == 'file';
|
const isFile = ev.dataTransfer.items[0].kind == 'file';
|
||||||
const isDriveFile = e.dataTransfer.types[0] == _DATA_TRANSFER_DRIVE_FILE_;
|
const isDriveFile = ev.dataTransfer.types[0] == _DATA_TRANSFER_DRIVE_FILE_;
|
||||||
const isDriveFolder = e.dataTransfer.types[0] == _DATA_TRANSFER_DRIVE_FOLDER_;
|
const isDriveFolder = ev.dataTransfer.types[0] == _DATA_TRANSFER_DRIVE_FOLDER_;
|
||||||
|
|
||||||
if (isFile || isDriveFile || isDriveFolder) {
|
if (isFile || isDriveFile || isDriveFolder) {
|
||||||
e.dataTransfer.dropEffect = e.dataTransfer.effectAllowed == 'all' ? 'copy' : 'move';
|
ev.dataTransfer.dropEffect = ev.dataTransfer.effectAllowed == 'all' ? 'copy' : 'move';
|
||||||
} else {
|
} else {
|
||||||
e.dataTransfer.dropEffect = 'none';
|
ev.dataTransfer.dropEffect = 'none';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -103,21 +103,21 @@ function onDragleave() {
|
||||||
draghover.value = false;
|
draghover.value = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
function onDrop(e: DragEvent) {
|
function onDrop(ev: DragEvent) {
|
||||||
draghover.value = false;
|
draghover.value = false;
|
||||||
|
|
||||||
if (!e.dataTransfer) return;
|
if (!ev.dataTransfer) return;
|
||||||
|
|
||||||
// ファイルだったら
|
// ファイルだったら
|
||||||
if (e.dataTransfer.files.length > 0) {
|
if (ev.dataTransfer.files.length > 0) {
|
||||||
for (const file of Array.from(e.dataTransfer.files)) {
|
for (const file of Array.from(ev.dataTransfer.files)) {
|
||||||
emit('upload', file, props.folder);
|
emit('upload', file, props.folder);
|
||||||
}
|
}
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
//#region ドライブのファイル
|
//#region ドライブのファイル
|
||||||
const driveFile = e.dataTransfer.getData(_DATA_TRANSFER_DRIVE_FILE_);
|
const driveFile = ev.dataTransfer.getData(_DATA_TRANSFER_DRIVE_FILE_);
|
||||||
if (driveFile != null && driveFile != '') {
|
if (driveFile != null && driveFile != '') {
|
||||||
const file = JSON.parse(driveFile);
|
const file = JSON.parse(driveFile);
|
||||||
emit('removeFile', file.id);
|
emit('removeFile', file.id);
|
||||||
|
@ -129,7 +129,7 @@ function onDrop(e: DragEvent) {
|
||||||
//#endregion
|
//#endregion
|
||||||
|
|
||||||
//#region ドライブのフォルダ
|
//#region ドライブのフォルダ
|
||||||
const driveFolder = e.dataTransfer.getData(_DATA_TRANSFER_DRIVE_FOLDER_);
|
const driveFolder = ev.dataTransfer.getData(_DATA_TRANSFER_DRIVE_FOLDER_);
|
||||||
if (driveFolder != null && driveFolder != '') {
|
if (driveFolder != null && driveFolder != '') {
|
||||||
const folder = JSON.parse(driveFolder);
|
const folder = JSON.parse(driveFolder);
|
||||||
|
|
||||||
|
@ -161,11 +161,11 @@ function onDrop(e: DragEvent) {
|
||||||
//#endregion
|
//#endregion
|
||||||
}
|
}
|
||||||
|
|
||||||
function onDragstart(e: DragEvent) {
|
function onDragstart(ev: DragEvent) {
|
||||||
if (!e.dataTransfer) return;
|
if (!ev.dataTransfer) return;
|
||||||
|
|
||||||
e.dataTransfer.effectAllowed = 'move';
|
ev.dataTransfer.effectAllowed = 'move';
|
||||||
e.dataTransfer.setData(_DATA_TRANSFER_DRIVE_FOLDER_, JSON.stringify(props.folder));
|
ev.dataTransfer.setData(_DATA_TRANSFER_DRIVE_FOLDER_, JSON.stringify(props.folder));
|
||||||
isDragging.value = true;
|
isDragging.value = true;
|
||||||
|
|
||||||
// 親ブラウザに対して、ドラッグが開始されたフラグを立てる
|
// 親ブラウザに対して、ドラッグが開始されたフラグを立てる
|
||||||
|
|
Loading…
Reference in New Issue