From 91243354de022e93e6bb8239719f4dd5583d2975 Mon Sep 17 00:00:00 2001
From: Jz0ojiang <hi@im0o.top>
Date: Wed, 12 Aug 2026 03:22:53 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8F=96=E6=B6=88=E6=96=87=E4=BB=B6=E9=80=89?=
 =?UTF-8?q?=E6=8B=A9=E4=B8=8D=E5=86=8D=E6=8A=8A=E5=BC=B9=E7=AA=97=E4=B8=80?=
 =?UTF-8?q?=E8=B5=B7=E5=85=B3=E6=8E=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

input[type=file] 在用户取消选择时发出的 cancel 事件会冒泡，带 DropFile
的三个弹窗把它当成了 dialog 自己的 Esc 取消。cancel 处理器现在只认
target 是 dialog 本身的事件。
---
 web/views/IniImportForm.vue    | 12 +++++++++++-
 web/views/RuleGroupForm.vue    | 12 +++++++++++-
 web/views/SubscriptionForm.vue | 12 +++++++++++-
 3 files changed, 33 insertions(+), 3 deletions(-)

diff --git a/web/views/IniImportForm.vue b/web/views/IniImportForm.vue
index af34aa8..a67b7f2 100644
--- a/web/views/IniImportForm.vue
+++ b/web/views/IniImportForm.vue
@@ -90,6 +90,16 @@ function submit() {
   emit('submit', plan.value)
 }
 
+/**
+ * Esc 关弹窗走这里。文件选择框被取消时 input 的 cancel 事件会冒泡到 dialog，
+ * 不是发给 dialog 自己的一律不理——否则取消选文件会把整个弹窗带关。
+ */
+function onCancel(event: Event) {
+  if (event.target !== dialog.value) return
+  event.preventDefault()
+  emit('close')
+}
+
 /** 点在遮罩上就关闭。内容区的点击 target 是 form 里的元素，到不了 dialog 本身。 */
 function onBackdrop(event: MouseEvent) {
   if (event.target === dialog.value) emit('close')
@@ -102,7 +112,7 @@ function onBackdrop(event: MouseEvent) {
     class="dlg"
     @click="onBackdrop"
     @close="emit('close')"
-    @cancel.prevent="emit('close')"
+    @cancel="onCancel"
   >
     <form method="dialog" @submit.prevent="submit">
       <header class="dlg-head">
diff --git a/web/views/RuleGroupForm.vue b/web/views/RuleGroupForm.vue
index ed7bd70..c7d3ed7 100644
--- a/web/views/RuleGroupForm.vue
+++ b/web/views/RuleGroupForm.vue
@@ -112,6 +112,16 @@ function submit() {
   })
 }
 
+/**
+ * Esc 关弹窗走这里。文件选择框被取消时 input 的 cancel 事件会冒泡到 dialog，
+ * 不是发给 dialog 自己的一律不理——否则取消选文件会把整个弹窗带关。
+ */
+function onCancel(event: Event) {
+  if (event.target !== dialog.value) return
+  event.preventDefault()
+  emit('close')
+}
+
 /** 点在遮罩上就关闭。内容区的点击 target 是 form 里的元素，到不了 dialog 本身。 */
 function onBackdrop(event: MouseEvent) {
   if (event.target === dialog.value) emit('close')
@@ -124,7 +134,7 @@ function onBackdrop(event: MouseEvent) {
     class="dlg"
     @click="onBackdrop"
     @close="emit('close')"
-    @cancel.prevent="emit('close')"
+    @cancel="onCancel"
   >
     <form method="dialog" @submit.prevent="submit">
       <header class="dlg-head">
diff --git a/web/views/SubscriptionForm.vue b/web/views/SubscriptionForm.vue
index 828ca11..8eb7a43 100644
--- a/web/views/SubscriptionForm.vue
+++ b/web/views/SubscriptionForm.vue
@@ -99,6 +99,16 @@ function submit() {
   })
 }
 
+/**
+ * Esc 关弹窗走这里。文件选择框被取消时 input 的 cancel 事件会冒泡到 dialog，
+ * 不是发给 dialog 自己的一律不理——否则取消选文件会把整个弹窗带关。
+ */
+function onCancel(event: Event) {
+  if (event.target !== dialog.value) return
+  event.preventDefault()
+  emit('close')
+}
+
 /** 点在遮罩上就关闭。内容区的点击 target 是 form 里的元素，到不了 dialog 本身。 */
 function onBackdrop(event: MouseEvent) {
   if (event.target === dialog.value) emit('close')
@@ -111,7 +121,7 @@ function onBackdrop(event: MouseEvent) {
     class="dlg"
     @click="onBackdrop"
     @close="emit('close')"
-    @cancel.prevent="emit('close')"
+    @cancel="onCancel"
   >
     <form method="dialog" @submit.prevent="submit">
       <header class="dlg-head">