fetch(modify):修改bug

src/views/asset-management/iot-card-management/index.vue

@@ -33,18 +33,7 @@
             >
               批量回收
             </ElButton>
-            <ElButton
-              type="info"
-              :disabled="selectedCards.length === 0"
-              @click="showSeriesBindingDialog"
-            >
-              批量设置套餐系列
-            </ElButton>
-            <ElButton type="primary" @click="cardDistribution">网卡分销</ElButton>
-            <ElButton type="success" @click="batchRecharge">批量充值</ElButton>
-            <ElButton type="danger" @click="cardRecycle">网卡回收</ElButton>
-            <ElButton type="info" @click="batchDownload">批量下载</ElButton>
-            <ElButton type="warning" @click="changePackage">变更套餐</ElButton>
+            <ElButton type="info" @contextmenu.prevent="showMoreMenu">更多操作</ElButton>
           </template>
         </ArtTableHeader>
 
@@ -501,6 +490,14 @@
             </div>
           </template>
         </ElDialog>
+
+        <!-- 更多操作右键菜单 -->
+        <ArtMenuRight
+          ref="moreMenuRef"
+          :menu-items="moreMenuItems"
+          :menu-width="180"
+          @select="handleMoreMenuSelect"
+        />
       </ElCard>
     </div>
   </ArtTableFullScreen>
@@ -517,6 +514,8 @@
   import type { SearchFormItem } from '@/types'
   import { useCheckedColumns } from '@/composables/useCheckedColumns'
   import { formatDateTime } from '@/utils/business/format'
+  import ArtMenuRight from '@/components/core/others/ArtMenuRight.vue'
+  import type { MenuItemType } from '@/components/core/others/ArtMenuRight.vue'
   import type {
     StandaloneIotCard,
     StandaloneCardStatus,
@@ -578,6 +577,9 @@
   const cardDetailLoading = ref(false)
   const currentCardDetail = ref<any>(null)
 
+  // 更多操作右键菜单
+  const moreMenuRef = ref<InstanceType<typeof ArtMenuRight>>()
+
   // 搜索表单初始值
   const initialSearchState = {
     status: undefined,
@@ -1423,6 +1425,72 @@
     })
   }
 
+  // 更多操作菜单项配置
+  const moreMenuItems = computed((): MenuItemType[] => [
+    {
+      key: 'seriesBinding',
+      label: '批量设置套餐系列',
+      icon: '&#xe88e;',
+      disabled: selectedCards.value.length === 0
+    },
+    {
+      key: 'distribution',
+      label: '网卡分销',
+      icon: '&#xe73b;'
+    },
+    {
+      key: 'recharge',
+      label: '批量充值',
+      icon: '&#xe63a;'
+    },
+    {
+      key: 'recycle',
+      label: '网卡回收',
+      icon: '&#xe850;'
+    },
+    {
+      key: 'download',
+      label: '批量下载',
+      icon: '&#xe78b;'
+    },
+    {
+      key: 'changePackage',
+      label: '变更套餐',
+      icon: '&#xe706;'
+    }
+  ])
+
+  // 显示更多操作菜单
+  const showMoreMenu = (e: MouseEvent) => {
+    e.preventDefault()
+    e.stopPropagation()
+    moreMenuRef.value?.show(e)
+  }
+
+  // 处理更多操作菜单选择
+  const handleMoreMenuSelect = (item: MenuItemType) => {
+    switch (item.key) {
+      case 'seriesBinding':
+        showSeriesBindingDialog()
+        break
+      case 'distribution':
+        cardDistribution()
+        break
+      case 'recharge':
+        batchRecharge()
+        break
+      case 'recycle':
+        cardRecycle()
+        break
+      case 'download':
+        batchDownload()
+        break
+      case 'changePackage':
+        changePackage()
+        break
+    }
+  }
+
   // 网卡分销 - 正在开发中
   const cardDistribution = () => {
     ElMessage.info('功能正在开发中')