From fddf22d7fee989863547b3223d5d83383a298178 Mon Sep 17 00:00:00 2001
From: Mahdi <mahdi.banilohi@gmail.com>
Date: Mon, 19 Oct 2026 11:40:25 +0330
Subject: [PATCH] fix: open the card menu from the three-dot button

Anchor the activity and deal menus to the button so they show beside the card.

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 apps/web/src/components/pipeline/DealCard.vue | 38 ++++++-----
 .../src/components/pipeline/PipelineList.vue  | 68 +++++++++++--------
 apps/web/src/views/ActivitiesView.vue         |  2 +-
 apps/web/src/views/PipelineBoardView.vue      |  1 +
 4 files changed, 63 insertions(+), 46 deletions(-)

diff --git a/apps/web/src/components/pipeline/DealCard.vue b/apps/web/src/components/pipeline/DealCard.vue
index 472e34d..d5c51b6 100644
--- a/apps/web/src/components/pipeline/DealCard.vue
+++ b/apps/web/src/components/pipeline/DealCard.vue
@@ -152,23 +152,27 @@ const cardStyle = computed(() => ({
           </a-typography-text>
         </div>
 
-        <a-button
-          v-if="showTrash"
-          type="text"
-          danger
-          aria-label="حذف انتخاب‌شده‌ها"
-          @click.stop="emit('bulkDelete')"
-        >
-          <template #icon><DeleteOutlined /></template>
-        </a-button>
-        <a-button
-          v-else
-          type="text"
-          :aria-label="copy.itemMenuAria"
-          @click.stop="emit('menu', deal.id)"
-        >
-          <template #icon><MoreOutlined /></template>
-        </a-button>
+        <span :data-card-id="deal.id">
+          <a-button
+            v-if="showTrash"
+            class="menu"
+            type="text"
+            danger
+            aria-label="حذف انتخاب‌شده‌ها"
+            @click.stop="emit('bulkDelete')"
+          >
+            <template #icon><DeleteOutlined /></template>
+          </a-button>
+          <a-button
+            v-else
+            class="menu"
+            type="text"
+            :aria-label="copy.itemMenuAria"
+            @click.stop="emit('menu', deal.id)"
+          >
+            <template #icon><MoreOutlined /></template>
+          </a-button>
+        </span>
       </a-flex>
 
       <a-flex
diff --git a/apps/web/src/components/pipeline/PipelineList.vue b/apps/web/src/components/pipeline/PipelineList.vue
index d19beea..1711e15 100644
--- a/apps/web/src/components/pipeline/PipelineList.vue
+++ b/apps/web/src/components/pipeline/PipelineList.vue
@@ -219,23 +219,27 @@ onUnmounted(() => {
             </a-space>
           </template>
           <template v-else-if="column.key === 'actions'">
-            <a-button
-              v-if="selectMode && selectedIds.has(record.deal.id)"
-              type="text"
-              danger
-              aria-label="حذف انتخاب‌شده‌ها"
-              @click.stop="emit('bulkDelete')"
-            >
-              <template #icon><DeleteOutlined /></template>
-            </a-button>
-            <a-button
-              v-else
-              type="text"
-              :aria-label="copy.itemMenuAria"
-              @click.stop="emit('menuDeal', record.deal.id)"
-            >
-              <template #icon><MoreOutlined /></template>
-            </a-button>
+            <span :data-card-id="record.deal.id">
+              <a-button
+                v-if="selectMode && selectedIds.has(record.deal.id)"
+                class="menu"
+                type="text"
+                danger
+                aria-label="حذف انتخاب‌شده‌ها"
+                @click.stop="emit('bulkDelete')"
+              >
+                <template #icon><DeleteOutlined /></template>
+              </a-button>
+              <a-button
+                v-else
+                class="menu"
+                type="text"
+                :aria-label="copy.itemMenuAria"
+                @click.stop="emit('menuDeal', record.deal.id)"
+              >
+                <template #icon><MoreOutlined /></template>
+              </a-button>
+            </span>
           </template>
         </template>
       </a-table>
@@ -299,17 +303,25 @@ onUnmounted(() => {
                 {{ row.deal.description }}
               </a-typography-text>
             </div>
-            <a-button
-              v-if="selectMode && selectedIds.has(row.deal.id)"
-              type="text"
-              danger
-              @click.stop="emit('bulkDelete')"
-            >
-              <template #icon><DeleteOutlined /></template>
-            </a-button>
-            <a-button v-else type="text" @click.stop="emit('menuDeal', row.deal.id)">
-              <template #icon><MoreOutlined /></template>
-            </a-button>
+            <span :data-card-id="row.deal.id">
+              <a-button
+                v-if="selectMode && selectedIds.has(row.deal.id)"
+                class="menu"
+                type="text"
+                danger
+                @click.stop="emit('bulkDelete')"
+              >
+                <template #icon><DeleteOutlined /></template>
+              </a-button>
+              <a-button
+                v-else
+                class="menu"
+                type="text"
+                @click.stop="emit('menuDeal', row.deal.id)"
+              >
+                <template #icon><MoreOutlined /></template>
+              </a-button>
+            </span>
           </a-flex>
           <a-tag
             :bordered="false"
diff --git a/apps/web/src/views/ActivitiesView.vue b/apps/web/src/views/ActivitiesView.vue
index c9d58c3..95768c1 100644
--- a/apps/web/src/views/ActivitiesView.vue
+++ b/apps/web/src/views/ActivitiesView.vue
@@ -2214,7 +2214,7 @@ time.note {
 
 .menu-pop {
   position: fixed;
-  z-index: 80;
+  z-index: 1200;
   background: #fff;
   border: 1px solid var(--line, #e2e8f0);
   border-radius: var(--radius);
diff --git a/apps/web/src/views/PipelineBoardView.vue b/apps/web/src/views/PipelineBoardView.vue
index 328748e..f995ac0 100644
--- a/apps/web/src/views/PipelineBoardView.vue
+++ b/apps/web/src/views/PipelineBoardView.vue
@@ -821,6 +821,7 @@ defineExpose({ updateDealStage: applyUpdateDealStage });
     <Teleport to="body">
       <div
         v-if="menuOpenId"
+        class="menu-pop"
         :style="{
           position: 'fixed',
           zIndex: 1080,