perf: 聊天输入框支持粘贴文件

This commit is contained in:
kuaifan 2022-05-20 15:23:10 +08:00
parent 35daeb443c
commit 7a8fcad27c
3 changed files with 16 additions and 4 deletions

View File

@ -1,6 +1,6 @@
<template> <template>
<div class="chat-input-wrapper" :class="modeClass"> <div class="chat-input-wrapper" :class="modeClass">
<div ref="editor" class="no-dark-content" :style="editorStyle"></div> <div ref="editor" class="no-dark-content" :style="editorStyle" @paste="handlePaste"></div>
<div class="chat-input-toolbar"> <div class="chat-input-toolbar">
<slot name="toolbarBefore"/> <slot name="toolbarBefore"/>
@ -578,6 +578,15 @@ export default {
let IOSVersion = match ? match[1].replace(/_/g, ".") : "unknown"; let IOSVersion = match ? match[1].replace(/_/g, ".") : "unknown";
const iosVsn = IOSVersion.split("."); const iosVsn = IOSVersion.split(".");
return +iosVsn[0] == 11 && +iosVsn[1] >= 0 && +iosVsn[1] < 3; return +iosVsn[0] == 11 && +iosVsn[1] >= 0 && +iosVsn[1] < 3;
},
handlePaste(e) {
const {files} = e.clipboardData;
const postFiles = Array.prototype.slice.call(files).filter(file => !$A.leftExists(file.type, 'image/'));
if (postFiles.length > 0) {
e.preventDefault()
this.$emit('on-file', postFiles)
}
} }
} }
} }

View File

@ -100,6 +100,7 @@
@on-focus="onEventFocus" @on-focus="onEventFocus"
@on-blur="onEventBlur" @on-blur="onEventBlur"
@on-more="onEventMore" @on-more="onEventMore"
@on-file="sendFileMsg"
@on-send="sendMsg" @on-send="sendMsg"
:placeholder="$L('输入消息...')"/> :placeholder="$L('输入消息...')"/>
<slot name="inputAfter"/> <slot name="inputAfter"/>
@ -396,7 +397,8 @@ export default {
}); });
}, },
sendFileMsg(files) { sendFileMsg(row) {
const files = $A.isArray(row) ? row : [row];
if (files.length > 0) { if (files.length > 0) {
this.pasteFile = []; this.pasteFile = [];
this.pasteItem = []; this.pasteItem = [];

View File

@ -407,6 +407,7 @@
:maxlength="20000" :maxlength="20000"
:placeholder="$L('输入消息...')" :placeholder="$L('输入消息...')"
@on-more="onEventMore" @on-more="onEventMore"
@on-file="onSelectFile"
@on-send="msgDialog"> @on-send="msgDialog">
<Badge slot="toolbarAfter" :count="taskDetail.msg_num"/> <Badge slot="toolbarAfter" :count="taskDetail.msg_num"/>
</ChatInput> </ChatInput>
@ -1166,8 +1167,8 @@ export default {
} }
}, },
onSelectFile(file) { onSelectFile(row) {
this.msgFile = [file]; this.msgFile = $A.isArray(row) ? row : [row];
this.msgDialog() this.msgDialog()
}, },