Skip to content

Commit

Permalink
Update: 粘贴上传修改提示
Browse files Browse the repository at this point in the history
  • Loading branch information
@KiWi233333
KiWi233333 committed Feb 17, 2025
1 parent 2b286c9 commit 9d7f2ea
Show file tree
Hide file tree
Showing 4 changed files with 67 additions and 40 deletions.
62 changes: 35 additions & 27 deletions components/Chat/MsgForm.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -342,42 +342,47 @@ function onContextMenu(e: MouseEvent, key?: string, index: number = 0, type: Oss
{
customClass: "group",
icon: "i-solar:trash-bin-minimalistic-outline group-btn-danger",
label: `删除${textMap[type]}`,
label: `撤销${textMap[type]}`,
onClick: async () => {
if (!key)
return;
const filesMap: Record<OssFileType, (Ref<OssFile[]> | undefined)> = {
[OssFileType.IMAGE]: imgList,
[OssFileType.FILE]: fileList,
[OssFileType.VIDEO]: videoList,
[OssFileType.SOUND]: undefined,
[OssFileType.FONT]: undefined,
};
const item = filesMap?.[type]?.value.find(f => f.key === key);
if (item)
item.subscribe.unsubscribe();
const keys = [key, ...(item?.children || []).map(f => f.key)];
keys.forEach(k => k && deleteOssFile(k, user.getToken));
ElMessage.closeAll("error");
if (type === OssFileType.IMAGE) {
imgList.value.splice(
index,
1,
);
inputOssImgUploadRef?.value?.resetInput?.();
}
filesMap?.[type]?.value.splice(
index,
1,
);
inputOssFileUploadRef?.value?.resetInput?.();
removeOssFile(type, key, index);
},
},
],
};
ContextMenu.showContextMenu(opt);
}
function removeOssFile(type: OssFileType = OssFileType.IMAGE, key?: string, index: number = 0) {
console.log("removeOssFile", type, key, index);
const filesMap: Record<OssFileType, (Ref<OssFile[]> | undefined)> = {
[OssFileType.IMAGE]: imgList,
[OssFileType.FILE]: fileList,
[OssFileType.VIDEO]: videoList,
[OssFileType.SOUND]: undefined,
[OssFileType.FONT]: undefined,
};
const item = filesMap?.[type]?.value.find(f => f.key === key);
if (item && key)
item.subscribe.unsubscribe();
const keys = [key, ...(item?.children || []).map(f => f.key)];
keys.forEach(k => k && deleteOssFile(k, user.getToken));
ElMessage.closeAll("error");
inputOssFileUploadRef?.value?.resetInput?.();
inputOssImgUploadRef?.value?.resetInput?.();
inputOssVideoUploadRef?.value?.resetInput?.();
filesMap?.[type]?.value.splice(
index,
1,
);
if (filesMap?.[type]?.value?.length === 0) {
chat.msgForm.msgType = MessageType.TEXT; // 默认
chat.msgForm.body.url = undefined;
}
}
// 到底部并消费消息
function setReadAndScrollBottom() {
if (chat.theContactId) {
Expand Down Expand Up @@ -556,11 +561,14 @@ onUnmounted(() => {
>
<div
v-for="(img, i) in imgList" :key="i" v-loading="img.status !== 'success'"
class="relative flex-row-c-c shadow-sm transition-shadow border-default card-default hover:shadow"
class="group relative flex-row-c-c shadow-sm transition-shadow border-default card-default hover:shadow"
:element-loading-spinner="defaultLoadingIcon"
element-loading-background="transparent"
@contextmenu="onContextMenu($event, img.key, i, OssFileType.IMAGE)"
>
<div title="撤销图片" class="absolute right-2 top-2 z-5 h-6 w-6 transition-opacity !rounded-full card-default-br group-hover-op-80 hover-op-100 sm:op-0" @click.stop="removeOssFile(OssFileType.IMAGE, img.key, i)">
<i i-solar:minus-circle-linear block h-full w-full />
</div>
<CardElImage
preview-teleported
loading="lazy"
Expand Down
1 change: 1 addition & 0 deletions components/Input/OssFileUpload.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -324,6 +324,7 @@ async function removeItem(t: OssFile) {
flag = true;
}
else if (res.code === StatusCode.DELETE_NOEXIST_ERR) {
// ElMessage.closeAll("error");
fileList.value.splice(
fileList.value.findIndex(item => item.key === t.key),
1,
Expand Down
1 change: 1 addition & 0 deletions components/menu/HeaderMenuBar.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -86,6 +86,7 @@ async function toggleContactOpen() {
text
size="small"
:style="data.btnStyle"
@click="data.handleWindow('alwaysOnTop')"
>
<i
:title="isTop ? '取消置顶' : '置顶'"
Expand Down
43 changes: 30 additions & 13 deletions composables/hooks/useMsgForm.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -414,22 +414,39 @@ export function useFileUpload(refsDom: RefDoms = { img: "inputOssImgUploadRef",
if (disabled?.value === true)
return;
// 判断粘贴上传
if (!e.clipboardData?.items?.length)
if (!e.clipboardData?.items?.length) {
return;
}
// 拿到粘贴板上的 image file 对象
const fileArr = Array.from(e.clipboardData.items);
if (fileArr.length > 1 || fileArr.length < 0) {
fileArr.length > 1 && ElMessage.warning("只支持单个文件上传！");
const fileArr = Array.from(e.clipboardData.items).filter(v => v.kind === "file");
if (!fileArr.length)
return;
}
const img = fileArr.find(v => v.type.includes("image"))?.getAsFile();
img && uploadFile("image", img);
const file = fileArr.find(v => FILE_TYPE_ICON_MAP[v.type])?.getAsFile();
file && uploadFile("file", file);
const video = fileArr.find(v => v.type.includes("video"))?.getAsFile();
video && uploadFile("video", video);
if (!file && !img && !video) { // 非文件
ElMessage.warning("暂不支持该文件类型粘贴上传！");

// if (fileArr.length > 1 || fileArr.length < 0) {
// fileArr.length > 1 && ElMessage.warning("不支持批量上传！");
// return;
// }
for (let i = 0; i < fileArr.length; i++) {
const item = fileArr[i];
if (!item || item.kind !== "file") {
continue;
}
if (item.type.includes("image")) {
const file = item.getAsFile();
file && uploadFile("image", file);
}
else if (item.type.includes("video")) {
const file = item.getAsFile();
file && uploadFile("video", file);
// 单文件
return;
}
else if (FILE_TYPE_ICON_MAP[item.type]) {
const file = item.getAsFile();
file && uploadFile("file", file);
// 单文件
return;
}
}
}

Expand Down

0 comments on commit 9d7f2ea

Please sign in to comment.