fix card action hit areas

src/@core/components/DialogCloseBtn.vue

@@ -15,7 +15,7 @@ function onClick() {
 
 <template>
   <IconBtn
-    :class="props.innerClass ? props.innerClass : 'absolute right-3 top-3'"
+    :class="props.innerClass ? props.innerClass : 'absolute right-3 top-3 z-10'"
     @click.stop="onClick"
   >
     <VIcon icon="mdi-close" />

src/components/cards/CustomRuleCard.vue

@@ -102,8 +102,8 @@ function onClose() {
 <template>
   <div>
     <VCard variant="tonal" class="app-card-shell" @click="openRuleInfoDialog">
-      <span class="absolute top-3 right-12">
-        <IconBtn>
+      <span class="app-card-top-action absolute top-3 right-12">
+        <IconBtn @click.stop>
           <VIcon class="cursor-move" icon="mdi-drag" />
         </IconBtn>
       </span>

src/components/cards/DirectoryCard.vue

@@ -204,8 +204,8 @@ watch(
         :label="t('directory.alias')"
         class="me-20 text-high-emphasis font-weight-bold"
       />
-      <span class="absolute top-3 right-12">
-        <IconBtn>
+      <span class="app-card-top-action absolute top-3 right-12">
+        <IconBtn @click.stop>
           <VIcon class="cursor-move" icon="mdi-drag" />
         </IconBtn>
       </span>

src/components/cards/DownloaderCard.vue

@@ -257,8 +257,8 @@ onUnmounted(() => {
         :class="{ 'transition transform-cpu duration-300 -translate-y-1': hover.isHovering }"
       >
         <VDialogCloseBtn @click="onClose" />
-        <span class="absolute top-3 right-12">
-          <IconBtn>
+        <span class="app-card-top-action absolute top-3 right-12">
+          <IconBtn @click.stop>
             <VIcon class="cursor-move" icon="mdi-drag" />
           </IconBtn>
         </span>

src/components/cards/FilterRuleCard.vue

@@ -46,8 +46,8 @@ onMounted(() => {
 
 <template>
   <VCard variant="tonal" class="app-card-shell">
-    <span class="absolute top-3 right-12">
-      <IconBtn>
+    <span class="app-card-top-action absolute top-3 right-12">
+      <IconBtn @click.stop>
         <VIcon class="cursor-move" icon="mdi-drag" />
       </IconBtn>
     </span>

src/components/cards/FilterRuleGroupCard.vue

@@ -206,8 +206,8 @@ function onClose() {
 <template>
   <div>
     <VCard variant="tonal" class="app-card-shell" @click="opengroupInfoDialog">
-      <span class="absolute top-3 right-12">
-        <IconBtn>
+      <span class="app-card-top-action absolute top-3 right-12">
+        <IconBtn @click.stop>
           <VIcon class="cursor-move" icon="mdi-drag" />
         </IconBtn>
       </span>

src/components/cards/NotificationChannelCard.vue

@@ -154,8 +154,8 @@ function onClose() {
 <template>
   <div>
     <VCard variant="tonal" class="app-card-shell" @click="openNotificationInfoDialog">
-      <span class="absolute top-3 right-12">
-        <IconBtn>
+      <span class="app-card-top-action absolute top-3 right-12">
+        <IconBtn @click.stop>
           <VIcon class="cursor-move" icon="mdi-drag" />
         </IconBtn>
       </span>

src/styles/common.scss

@@ -54,6 +54,11 @@ html.v-overlay-scroll-blocked body {
   block-size: 100%;
 }
 
+// 保证卡片右上角的浮动操作区始终高于可点击的卡片内容层，避免误触发详情打开。
+.app-card-top-action {
+  z-index: 2;
+}
+
 .app-card-summary {
   position: relative;
   display: flex;