修改: bug

src/views/asset-management/authorization-records/index.vue

@@ -30,12 +30,21 @@
           :marginTop="10"
           @size-change="handleSizeChange"
           @current-change="handleCurrentChange"
+          @row-contextmenu="handleRowContextMenu"
         >
           <template #default>
             <ElTableColumn v-for="col in columns" :key="col.prop || col.type" v-bind="col" />
           </template>
         </ArtTable>
 
+        <!-- 右键菜单 -->
+        <ArtMenuRight
+          ref="contextMenuRef"
+          :menu-items="contextMenuItems"
+          :menu-width="120"
+          @select="handleContextMenuSelect"
+        />
+
         <!-- 授权详情对话框 -->
         <ElDialog v-model="detailDialogVisible" title="授权详情" width="700px">
           <ElDescriptions v-if="currentRecord" :column="2" border>
@@ -119,6 +128,8 @@
   import { useAuth } from '@/composables/useAuth'
   import { formatDateTime } from '@/utils/business/format'
   import ArtButtonTable from '@/components/core/forms/ArtButtonTable.vue'
+  import ArtMenuRight from '@/components/core/others/ArtMenuRight.vue'
+  import type { MenuItemType } from '@/components/core/others/ArtMenuRight.vue'
   import type {
     AuthorizationItem,
     AuthorizationStatus,
@@ -138,6 +149,8 @@
   const remarkFormRef = ref<FormInstance>()
   const currentRecordId = ref<number>(0)
   const currentRecord = ref<AuthorizationItem | null>(null)
+  const contextMenuRef = ref<InstanceType<typeof ArtMenuRight>>()
+  const currentRow = ref<AuthorizationItem | null>(null)
 
   // 搜索表单初始值
   const initialSearchState = {
@@ -227,8 +240,7 @@
     { label: '授权人类型', prop: 'authorizer_type' },
     { label: '授权时间', prop: 'authorized_at' },
     { label: '状态', prop: 'status' },
-    { label: '备注', prop: 'remark' },
-    { label: '操作', prop: 'operation' }
+    { label: '备注', prop: 'remark' }
   ]
 
   const authorizationList = ref<AuthorizationItem[]>([])
@@ -306,33 +318,6 @@
       minWidth: 150,
       showOverflowTooltip: true,
       formatter: (row: AuthorizationItem) => row.remark || '-'
-    },
-    {
-      prop: 'operation',
-      label: '操作',
-      width: 150,
-      fixed: 'right',
-      formatter: (row: AuthorizationItem) => {
-        const buttons = []
-
-        buttons.push(
-          h(ArtButtonTable, {
-            text: '详情',
-            onClick: () => viewDetail(row)
-          })
-        )
-
-        if (hasAuth('authorization_records:update_remark')) {
-          buttons.push(
-            h(ArtButtonTable, {
-              text: '编辑',
-              onClick: () => showRemarkDialog(row)
-            })
-          )
-        }
-
-        return h('div', { style: 'display: flex; gap: 8px;' }, buttons)
-      }
     }
   ])
 
@@ -443,6 +428,41 @@
       }
     })
   }
+
+  // 右键菜单项配置
+  const contextMenuItems = computed((): MenuItemType[] => {
+    const items: MenuItemType[] = []
+
+    items.push({ key: 'detail', label: '详情' })
+
+    if (hasAuth('authorization_records:update_remark')) {
+      items.push({ key: 'edit', label: '编辑' })
+    }
+
+    return items
+  })
+
+  // 处理表格行右键菜单
+  const handleRowContextMenu = (row: AuthorizationItem, 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 'detail':
+        viewDetail(currentRow.value)
+        break
+      case 'edit':
+        showRemarkDialog(currentRow.value)
+        break
+    }
+  }
 </script>
 
 <style lang="scss" scoped>