提交

web-admin/src/components/business/attachment-upload-field/index.vue

@@ -12,10 +12,10 @@
     @mouseleave="handlePointerLeave"
     @focusin="handlePointerEnter"
     @focusout="handleFocusOut"
-    @dragenter="handleDragEnter"
-    @dragleave="handleDragLeave"
-    @dragover="handleDragOver"
-    @drop="handleDrop"
+    @dragenter.prevent="handleDragEnter"
+    @dragleave.prevent="handleDragLeave"
+    @dragover.prevent="handleDragOver"
+    @drop.prevent="handleDrop"
   >
     <div class="attachment-list">
       <el-upload
@@ -451,15 +451,13 @@ function handleFocusOut(event: FocusEvent) {
 
 function handleDragEnter(event: DragEvent) {
   if (props.disabled) return
-  event.preventDefault()
   dragEnterDepth += 1
   isDragOver.value = true
   isPointerInside.value = true
 }
 
-function handleDragLeave(event: DragEvent) {
+function handleDragLeave(_event: DragEvent) {
   if (props.disabled) return
-  event.preventDefault()
   dragEnterDepth = Math.max(0, dragEnterDepth - 1)
   if (dragEnterDepth === 0) {
     isDragOver.value = false
@@ -468,7 +466,6 @@ function handleDragLeave(event: DragEvent) {
 
 function handleDragOver(event: DragEvent) {
   if (props.disabled) return
-  event.preventDefault()
   if (event.dataTransfer) {
     event.dataTransfer.dropEffect = 'copy'
   }
@@ -476,17 +473,40 @@ function handleDragOver(event: DragEvent) {
 
 async function handleDrop(event: DragEvent) {
   if (props.disabled) return
-  event.preventDefault()
   dragEnterDepth = 0
   isDragOver.value = false
   const files = Array.from(event.dataTransfer?.files || [])
   await uploadFiles(files)
 }
 
+/** 弹窗内粘贴截图/文件：悬停、聚焦，或同对话框内输入时均可触发（有文件时） */
+function shouldAcceptPaste(): boolean {
+  if (props.disabled) return false
+  if (isPointerInside.value) return true
+  const root = rootRef.value
+  if (!root) return false
+  const active = document.activeElement
+  if (active && root.contains(active)) return true
+
+  const dialog = root.closest('.el-dialog') as HTMLElement | null
+  if (!dialog) return false
+  if (!active || !dialog.contains(active)) return false
+
+  const uploads = Array.from(
+    dialog.querySelectorAll<HTMLElement>(
+      '.attachment-upload:not(.attachment-upload--readonly)'
+    )
+  )
+  if (!uploads.length) return false
+  const hovered = uploads.find((el) => el.matches(':hover'))
+  if (hovered) return hovered === root
+  return uploads[0] === root
+}
+
 async function handleDocumentPaste(event: ClipboardEvent) {
-  if (props.disabled || !isPointerInside.value) return
   const files = collectClipboardFiles(event)
   if (!files.length) return
+  if (!shouldAcceptPaste()) return
   event.preventDefault()
   event.stopPropagation()
   await uploadFiles(files)