删除多余代码

src/views/polling-management/alert-rules/index.vue

@@ -9,7 +9,9 @@
           @refresh="handleRefresh"
         >
           <template #left>
-            <el-button type="primary" @click="showCreateDialog">新增规则</el-button>
+            <el-button type="primary" @click="showCreateDialog" v-if="hasAuth('alert_rules:create')"
+              >新增规则</el-button
+            >
           </template>
         </ArtTableHeader>
 
@@ -20,26 +22,13 @@
           :loading="loading"
           :data="tableData"
           :marginTop="10"
-          :row-class-name="getRowClassName"
-          @row-contextmenu="handleRowContextMenu"
-          @cell-mouse-enter="handleCellMouseEnter"
-          @cell-mouse-leave="handleCellMouseLeave"
+          :actions="getActions"
+          :actionsWidth="160"
         >
           <template #default>
             <el-table-column v-for="col in columns" :key="col.prop || col.type" v-bind="col" />
           </template>
         </ArtTable>
-
-        <!-- 鼠标悬浮提示 -->
-        <TableContextMenuHint :visible="showContextMenuHint" :position="hintPosition" />
-
-        <!-- 右键菜单 -->
-        <ArtMenuRight
-          ref="contextMenuRef"
-          :menu-items="contextMenuItems"
-          :menu-width="120"
-          @select="handleContextMenuSelect"
-        />
       </el-card>
 
       <!-- 新增/编辑规则弹窗 -->
@@ -164,26 +153,16 @@
   import { PollingAlertService } from '@/api/modules'
   import type { PollingAlertRule, CreatePollingAlertRuleRequest } from '@/types/api'
   import { formatDateTime } from '@/utils/business/format'
-  import { useTableContextMenu } from '@/composables/useTableContextMenu'
   import { useCheckedColumns } from '@/composables/useCheckedColumns'
-  import type { MenuItemType } from '@/components/core/others/ArtMenuRight.vue'
+  import { useAuth } from '@/composables/useAuth'
+
+  const { hasAuth } = useAuth()
 
   const loading = ref(false)
   const tableData = ref<PollingAlertRule[]>([])
   const dialogVisible = ref(false)
   const dialogType = ref<'create' | 'edit'>('create')
   const formRef = ref<FormInstance>()
-  const contextMenuRef = ref()
-  const currentRow = ref<PollingAlertRule | null>(null)
-
-  // 使用表格右键菜单功能
-  const {
-    showContextMenuHint,
-    hintPosition,
-    getRowClassName,
-    handleCellMouseEnter,
-    handleCellMouseLeave
-  } = useTableContextMenu()
 
   const form = reactive<CreatePollingAlertRuleRequest & { id?: number }>({
     rule_name: '',
@@ -301,14 +280,38 @@
     }))
   )
 
-  // 右键菜单项
-  const contextMenuItems = computed<MenuItemType[]>(() => {
-    return [
-      { key: 'edit', label: '编辑' },
-      { key: 'toggle', label: currentRow.value?.status === 1 ? '禁用' : '启用' },
-      { key: 'delete', label: '删除' }
-    ]
-  })
+  // 获取操作按钮
+  const getActions = (row: PollingAlertRule) => {
+    const actions: any[] = []
+
+    // 禁用/启用按钮直接显示
+    if (hasAuth('alert_rules:toggle')) {
+      actions.push({
+        label: row.status === 1 ? '禁用' : '启用',
+        handler: () => toggleStatus(row),
+        type: 'primary'
+      })
+    }
+
+    // 编辑和删除放到更多里
+    if (hasAuth('alert_rules:edit')) {
+      actions.push({
+        label: '编辑',
+        handler: () => showEditDialog(row),
+        type: 'primary'
+      })
+    }
+
+    if (hasAuth('alert_rules:delete')) {
+      actions.push({
+        label: '删除',
+        handler: () => handleDelete(row),
+        type: 'danger'
+      })
+    }
+
+    return actions
+  }
 
   watch(dialogVisible, (val) => {
     if (!val) {
@@ -444,31 +447,6 @@
     })
   }
 
-  // 处理表格行右键菜单
-  const handleRowContextMenu = (row: PollingAlertRule, column: any, event: MouseEvent) => {
-    event.preventDefault()
-    event.stopPropagation()
-    currentRow.value = row
-    contextMenuRef.value?.show(event)
-  }
-
-  // 处理右键菜单选择
-  const handleContextMenuSelect = (item: MenuItemType) => {
-    if (!currentRow.value) return
-
-    switch (item.key) {
-      case 'edit':
-        showEditDialog(currentRow.value)
-        break
-      case 'toggle':
-        toggleStatus(currentRow.value)
-        break
-      case 'delete':
-        handleDelete(currentRow.value)
-        break
-    }
-  }
-
   loadData()
 </script>