feat: Add ability to paste file/image from clipboard
This commit is contained in:
parent
8f4944fda0
commit
7132e9a2cd
1 changed files with 18 additions and 2 deletions
|
@ -1,5 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<file-upload
|
<file-upload
|
||||||
|
ref="upload"
|
||||||
:size="4096 * 2048"
|
:size="4096 * 2048"
|
||||||
:accept="allowedFileTypes"
|
:accept="allowedFileTypes"
|
||||||
:data="{
|
:data="{
|
||||||
|
@ -48,15 +49,30 @@ export default {
|
||||||
return ALLOWED_FILE_TYPES;
|
return ALLOWED_FILE_TYPES;
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
mounted() {
|
||||||
|
document.addEventListener('paste', this.handleClipboardPaste);
|
||||||
|
},
|
||||||
|
destroyed() {
|
||||||
|
document.removeEventListener('paste', this.handleClipboardPaste);
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
handleClipboardPaste(e) {
|
||||||
|
const items = (e.clipboardData || e.originalEvent.clipboardData).items;
|
||||||
|
items.forEach(item => {
|
||||||
|
if (item.kind === 'file') {
|
||||||
|
const file = item.getAsFile();
|
||||||
|
this.$refs.upload.add(file);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
getFileType(fileType) {
|
getFileType(fileType) {
|
||||||
return fileType.includes('image') ? 'image' : 'file';
|
return fileType.includes('image') ? 'image' : 'file';
|
||||||
},
|
},
|
||||||
async onFileUpload(file) {
|
async onFileUpload(file) {
|
||||||
if (this.globalConfig.directUploadsEnabled) {
|
if (this.globalConfig.directUploadsEnabled) {
|
||||||
this.onDirectFileUpload(file);
|
await this.onDirectFileUpload(file);
|
||||||
} else {
|
} else {
|
||||||
this.onIndirectFileUpload(file);
|
await this.onIndirectFileUpload(file);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
async onDirectFileUpload(file) {
|
async onDirectFileUpload(file) {
|
||||||
|
|
Loading…
Reference in a new issue