优化

src/components/ComDataTable/index.vue

@@ -182,6 +182,7 @@
                     :width="actionWidth"
                     :fixed="actionFixed"
                     align="center"
+                    class-name="action-column"
                 >
                     <template #default="{ row, $index }">
                         <slot name="action" :row="row" :index="$index">
@@ -207,6 +208,7 @@
                                     "
                                     @click="handleAction(action, row, $index)"
                                     v-hasPermi="action.permission"
+                                    class="action-button-item"
                                 >
                                     {{ action.label }}
                                 </ComButton>
@@ -229,55 +231,80 @@
                                             : action.disabled
                                     "
                                     @click="handleAction(action, row, $index)"
+                                    class="action-button-item"
                                 >
                                     {{ action.label }}
                                 </ComButton>
                             </template>
-                            <!-- 超过3个按钮时使用下拉菜单 -->
+                            <!-- 超过3个按钮时使用弹出菜单 -->
-                            <el-dropdown
+                            <el-popover
                                 v-if="moreActions.length > 0"
                                 trigger="click"
-                                @command="(cmd) => handleDropdownAction(cmd, row, $index)"
+                                placement="bottom-end"
+                                :width="140"
+                                popper-class="action-popover-menu"
+                                class="action-button-item"
                             >
+                                <template #reference>
                                     <ComButton
                                         type="primary"
-                                    :size="computedSize === 'large' ? 'default' : 'small'"
+                                        :size="
+                                            computedSize === 'large'
+                                                ? 'default'
+                                                : computedSize === 'small'
+                                                ? 'small'
+                                                : 'small'
+                                        "
                                         link
+                                        class="more-action-button"
                                     >
-                                    更多<el-icon class="el-icon--right"><arrow-down /></el-icon>
+                                        更多<el-icon class="el-icon--right"><ArrowDown /></el-icon>
                                     </ComButton>
-                                <template #dropdown>
+                                </template>
-                                    <el-dropdown-menu>
+                                <div class="popover-menu-list">
                                     <template v-for="(action, idx) in moreActions" :key="idx">
                                         <!-- 有权限配置的菜单项，使用 v-hasPermi 指令 -->
-                                            <el-dropdown-item
+                                        <div
                                             v-if="action.permission"
-                                                :command="{ action, row, index: $index }"
-                                                :disabled="
-                                                    typeof action.disabled === 'function'
-                                                        ? action.disabled(row)
-                                                        : action.disabled
-                                                "
                                             v-hasPermi="action.permission"
-                                            >
+                                            class="popover-menu-item"
-                                                {{ action.label }}
+                                            :class="{
-                                            </el-dropdown-item>
+                                                'is-disabled':
-                                            <!-- 没有权限配置的菜单项，不使用 v-hasPermi 指令（兼容旧代码） -->
-                                            <el-dropdown-item
-                                                v-else
-                                                :command="{ action, row, index: $index }"
-                                                :disabled="
                                                     typeof action.disabled === 'function'
                                                         ? action.disabled(row)
-                                                        : action.disabled
+                                                        : action.disabled,
+                                            }"
+                                            @click="
+                                                !(typeof action.disabled === 'function'
+                                                    ? action.disabled(row)
+                                                    : action.disabled) &&
+                                                    handleAction(action, row, $index)
                                             "
                                         >
                                             {{ action.label }}
-                                            </el-dropdown-item>
+                                        </div>
+                                        <!-- 没有权限配置的菜单项，不使用 v-hasPermi 指令（兼容旧代码） -->
+                                        <div
+                                            v-else
+                                            class="popover-menu-item"
+                                            :class="{
+                                                'is-disabled':
+                                                    typeof action.disabled === 'function'
+                                                        ? action.disabled(row)
+                                                        : action.disabled,
+                                            }"
+                                            @click="
+                                                !(typeof action.disabled === 'function'
+                                                    ? action.disabled(row)
+                                                    : action.disabled) &&
+                                                    handleAction(action, row, $index)
+                                            "
+                                        >
+                                            {{ action.label }}
+                                        </div>
                                     </template>
-                                    </el-dropdown-menu>
+                                </div>
-                                </template>
+                            </el-popover>
-                            </el-dropdown>
                         </slot>
                     </template>
                 </el-table-column>
@@ -298,7 +325,7 @@
 <script setup>
 import { ref, computed, watch } from 'vue'
 import { useFullscreen } from '@vueuse/core'
-import { Operation, FullScreen, Setting, Rank, Refresh } from '@element-plus/icons-vue'
+import { Operation, FullScreen, Setting, Rank, Refresh, ArrowDown } from '@element-plus/icons-vue'
 import draggable from 'vuedraggable/dist/vuedraggable.common'
 import Pagination from '@/components/Pagination/index.vue'
 import ComButton from '@/components/ComButton/index.vue'
@@ -475,12 +502,12 @@ const hasActions = computed(() => {
 
 // 可见的操作按钮（前3个）
 const visibleActions = computed(() => {
-    return props.actionColumns.slice(0, 3)
+    return props.actionColumns.slice(0, 2)
 })
 
 // 更多的操作按钮（超过3个的部分）
 const moreActions = computed(() => {
-    return props.actionColumns.slice(3)
+    return props.actionColumns.slice(2)
 })
 
 // 初始化列配置
@@ -719,9 +746,83 @@ defineExpose({
     box-shadow: -2px 0 4px rgba(0, 0, 0, 0.1);
 }
 
-.setting-icon {
+/* 操作列单元格样式 - 确保按钮水平对齐 */
+:deep(.el-table__body-wrapper .el-table__body tbody tr td.action-column .cell),
+:deep(.el-table__fixed-right .el-table__fixed-body-wrapper tbody tr td.action-column .cell) {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-wrap: nowrap;
+    gap: 8px;
+    white-space: nowrap;
+}
+
+.action-button-item {
+    flex-shrink: 0;
+    display: inline-flex;
+    align-items: center;
+}
+
+.more-action-button {
+    :deep(.el-icon--right) {
+        margin-left: 4px;
+        font-size: 12px;
+        vertical-align: middle;
+    }
+}
+
+/* Popover 菜单样式 */
+.popover-menu-list {
+    padding: 0;
+    margin: 0;
+    list-style: none;
+}
+
+.popover-menu-item {
+    padding: 8px 20px;
     cursor: pointer;
-    font-size: 16px;
+    font-size: 14px;
+    color: #606266;
+    transition: all 0.2s;
+    line-height: 1.5;
+    white-space: nowrap;
+    user-select: none;
+
+    &:hover:not(.is-disabled) {
+        background-color: #ecf5ff;
+        color: #409eff;
+    }
+
+    &:active:not(.is-disabled) {
+        background-color: #d9ecff;
+    }
+
+    &.is-disabled {
+        color: #c0c4cc;
+        cursor: not-allowed;
+        opacity: 0.6;
+    }
+
+    &:first-child {
+        margin-top: 0;
+    }
+
+    &:last-child {
+        margin-bottom: 0;
+    }
+}
+
+:deep(.action-popover-menu) {
+    padding: 4px 0;
+    border-radius: 4px;
+    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+    border: 1px solid #e4e7ed;
+    background-color: #fff;
+    min-width: 120px;
+}
+
+:deep(.action-popover-menu .el-popover__title) {
+    display: none;
 }
 
 .column-setting-container {

src/views/sMsSendManage/loopSend/index.vue

@@ -126,20 +126,20 @@ const actionColumns = [
             })
         },
     },
-    // {
+    {
-    //     label: '编辑',
+        label: '编辑',
-    //     type: 'primary',
+        type: 'primary',
-    //     link: true,
+        link: true,
-    //     handler: (row) => {
+        handler: (row) => {
-    //         router.push({
+            router.push({
-    //             path: '/sms/loopSendEdit/index',
+                path: '/sms/loopSendEdit/index',
-    //             query: {
+                query: {
-    //                 id: row.id,
+                    id: row.id,
-    //                 mode: 'edit',
+                    mode: 'edit',
-    //             },
+                },
-    //         })
+            })
-    //     },
+        },
-    // },
+    },
 ]
 
 // 新增