feat: 新增 PC 端粘贴图片上传功能(hover 区域检测 + 网页图片链接自动填入)
This commit is contained in:
@ -457,7 +457,7 @@
|
||||
</el-row>
|
||||
|
||||
<el-form-item label="产品图" prop="generalImage" v-if="hasFieldPermission('files')">
|
||||
<div class="upload-container">
|
||||
<div class="upload-container" id="upload-generalImage">
|
||||
<el-upload
|
||||
v-model:file-list="fileListImage"
|
||||
action="#"
|
||||
@ -485,7 +485,7 @@
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="说明书" prop="generalManual" v-if="hasFieldPermission('files')">
|
||||
<div class="upload-container">
|
||||
<div class="upload-container" id="upload-generalManual">
|
||||
<el-upload
|
||||
v-model:file-list="fileListManual"
|
||||
action="#"
|
||||
@ -653,6 +653,7 @@ import {
|
||||
markWarningOrdered
|
||||
} from '@/api/material_base';
|
||||
import { uploadFile, deleteFile } from '@/api/common/upload';
|
||||
import { usePasteUpload } from '@/hooks/usePasteUpload';
|
||||
import WebRtcCamera from '@/components/Camera/WebRtcCamera.vue';
|
||||
|
||||
const userStore = useUserStore();
|
||||
@ -1584,6 +1585,13 @@ const customUpload = async (options: any, targetField: 'generalImage' | 'general
|
||||
if (res.code === 200) {
|
||||
const newUrl = res.data.url
|
||||
form.value[targetField].push(newUrl)
|
||||
// 同步更新 fileList,触发 el-upload UI 刷新
|
||||
const fileObj = { name: newUrl.split('/').pop(), url: getImageUrl(newUrl) }
|
||||
if (targetField === 'generalImage') {
|
||||
fileListImage.value.push(fileObj)
|
||||
} else {
|
||||
fileListManual.value.push(fileObj)
|
||||
}
|
||||
ElMessage.success('上传成功')
|
||||
onSuccess(res)
|
||||
} else {
|
||||
@ -1597,6 +1605,13 @@ const customUpload = async (options: any, targetField: 'generalImage' | 'general
|
||||
finally { isUploading.value = false }
|
||||
}
|
||||
|
||||
// 粘贴上传处理器(PC 端:鼠标悬停 + Ctrl+V 直接粘贴图片)
|
||||
const handlePasteLink = (link: string, field: string) => {
|
||||
imageExternalUrl.value = link
|
||||
}
|
||||
usePasteUpload(customUpload, 'generalImage', '#upload-generalImage', handlePasteLink)
|
||||
usePasteUpload(customUpload, 'generalManual', '#upload-generalManual', handlePasteLink)
|
||||
|
||||
const handleRemoveImage = async (uploadFile: any, targetField: 'generalImage' | 'generalManual') => {
|
||||
const fileName = uploadFile.name || uploadFile.url?.split('/').pop() || '此文件'
|
||||
try {
|
||||
|
||||
Reference in New Issue
Block a user