From 7f779e021dc3e43f3eb96c5dde8a7924613504d7 Mon Sep 17 00:00:00 2001
From: dongzhihuan <dongzhihuan@honeycombis.com>
Date: Sat, 14 Feb 2026 14:08:54 +0800
Subject: [PATCH] =?UTF-8?q?update=20=E8=A7=A3=E5=86=B3=E9=A1=B9=E7=9B=AE?=
 =?UTF-8?q?=E5=88=97=E8=A1=A8=E5=8D=A1=E7=89=87=E6=8C=89=E9=92=AE=E4=B8=8B?=
 =?UTF-8?q?=E6=8B=89=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../lyric/views/project/projectCard.vue       | 32 ++++++++++++-----
 .../projectList/components/projectCard.vue    | 34 +++++++++++++++----
 2 files changed, 50 insertions(+), 16 deletions(-)

diff --git a/src/tenants/lyric/views/project/projectCard.vue b/src/tenants/lyric/views/project/projectCard.vue
index 7f26f0d..2b1b487 100644
--- a/src/tenants/lyric/views/project/projectCard.vue
+++ b/src/tenants/lyric/views/project/projectCard.vue
@@ -20,16 +20,19 @@
       </span>
     </div>
 
-    <el-dropdown class="options-dropdown" :teleported="false">
+    <el-dropdown
+      class="options-dropdown"
+      :class="{ 'is-visible': isDropdownVisible }"
+      @command="handleCommand"
+      @visible-change="handleVisibleChange"
+    >
       <div class="options-btn" @click.stop>
         <el-icon :size="18"><MoreFilled /></el-icon>
       </div>
       <template #dropdown>
-        <el-dropdown-menu @click.stop>
-          <el-dropdown-item v-for="(action, aIndex) in actionList" :key="aIndex">
-            <el-link :type="action.type" @click.stop="actionClickFun(action)">
-              {{ action.title }}
-            </el-link>
+        <el-dropdown-menu>
+          <el-dropdown-item v-for="(action, aIndex) in actionList" :key="aIndex" :command="action">
+            <el-link :type="action.type">{{ action.title }}</el-link>
           </el-dropdown-item>
         </el-dropdown-menu>
       </template>
@@ -38,7 +41,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue';
+import { computed, ref } from 'vue';
 import { MoreFilled } from '@element-plus/icons-vue';
 import { useDict } from '@/utils/useDict';
 import { PROJECT_EXE_STATUS_CODE } from '@/utils/enum/project';
@@ -79,8 +82,15 @@ const cardClickFun = () => {
   emit('cardClick', props.project);
 };
 
-const actionClickFun = (action: any) => {
-  emit('actionClick', props.project, action);
+// const actionClickFun = (action: any) => {
+//   emit('actionClick', props.project, action);
+// };
+const handleCommand = (command: any) => {
+  emit('actionClick', props.project, command);
+};
+const isDropdownVisible = ref(false);
+const handleVisibleChange = (visible: boolean) => {
+  isDropdownVisible.value = visible;
 };
 </script>
 
@@ -101,6 +111,10 @@ const actionClickFun = (action: any) => {
       transform: scale(1.1);
     }
   }
+  &:hover .options-dropdown,
+  .options-dropdown.is-visible {
+    opacity: 1;
+  }
 
   .cover-img {
     transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
diff --git a/src/views/task/projectList/components/projectCard.vue b/src/views/task/projectList/components/projectCard.vue
index e9bff16..44e571e 100644
--- a/src/views/task/projectList/components/projectCard.vue
+++ b/src/views/task/projectList/components/projectCard.vue
@@ -1,13 +1,18 @@
 <template>
   <div class="project-card" @click="cardClickFun">
-    <el-dropdown class="options-dropdown" :teleported="false">
+    <el-dropdown
+      class="options-dropdown"
+      :class="{ 'is-visible': isDropdownVisible }"
+      @command="handleCommand"
+      @visible-change="handleVisibleChange"
+    >
       <div class="options-btn" @click.stop>
         <el-icon :size="18"><MoreFilled /></el-icon>
       </div>
       <template #dropdown>
         <el-dropdown-menu>
-          <el-dropdown-item v-for="(action, aIndex) in actionList" :key="aIndex">
-            <el-link :type="action.type" @click.stop="actionClickFun(action)">
+          <el-dropdown-item v-for="(action, aIndex) in actionList" :key="aIndex" :command="action">
+            <el-link :type="action.type">
               {{ action.title }}
             </el-link>
           </el-dropdown-item>
@@ -15,7 +20,11 @@
       </template>
     </el-dropdown>
 
-    <img class="gl-pointer-class cover-img" :src="coverImgMap[project.detailImgUrl ? 'custom' : (index % 2 !== 0 ? 'blue' : 'green')]" alt="" />
+    <img
+      class="gl-pointer-class cover-img"
+      :src="coverImgMap[project.detailImgUrl ? 'custom' : index % 2 !== 0 ? 'blue' : 'green']"
+      alt=""
+    />
 
     <div class="bottom-box">
       <span class="gl-text-ellipsis gl-pointer-class" :title="project.nodeName">
@@ -29,7 +38,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue';
+import { computed, ref } from 'vue';
 import { MoreFilled } from '@element-plus/icons-vue';
 import { useDict } from '@/utils/useDict';
 import { PROJECT_EXE_STATUS_CODE } from '@/utils/enum/project';
@@ -70,8 +79,15 @@ const cardClickFun = () => {
   emit('cardClick', props.project);
 };
 
-const actionClickFun = (action: any) => {
-  emit('actionClick', props.project, action);
+// const actionClickFun = (action: any) => {
+//   emit('actionClick', props.project, action);
+// };
+const handleCommand = (command: any) => {
+  emit('actionClick', props.project, command);
+};
+const isDropdownVisible = ref(false);
+const handleVisibleChange = (visible: boolean) => {
+  isDropdownVisible.value = visible;
 };
 </script>
 
@@ -80,5 +96,9 @@ const actionClickFun = (action: any) => {
 
 .project-card {
   @extend .project-card-base;
+  &:hover .options-dropdown,
+  .options-dropdown.is-visible {
+    opacity: 1;
+  }
 }
 </style>