feat: 手动实名和套餐列表退款

src/views/asset-management/asset-information/components/PackageListCard.vue

@@ -25,6 +25,7 @@
       </ElEmpty>
       <div v-else-if="packageList && packageList.length > 0" class="table-scroll-container">
         <ElTable :data="packageList" class="package-table" border>
+          <ElTableColumn prop="order_no" label="订单号" width="180" show-overflow-tooltip />
           <ElTableColumn label="套餐名称" width="150">
             <template #default="scope">
               <ElButton
@@ -54,7 +55,7 @@
               {{ formatDataSize(scope.row.data_limit_mb) }}
             </template>
           </ElTableColumn>
-          <ElTableColumn label="流量" min-width="220">
+          <ElTableColumn label="流量" min-width="320">
             <template #default="scope">
               <div class="traffic-progress">
                 <div class="progress-text">
@@ -107,17 +108,29 @@
               {{ formatDateTime(scope.row.expires_at) }}
             </template>
           </ElTableColumn>
-          <ElTableColumn prop="created_at" label="创建时间" width="170" show-overflow-tooltip>
+          <ElTableColumn prop="created_at" label="购买时间" width="170" show-overflow-tooltip>
             <template #default="scope">
               {{ formatDateTime(scope.row.created_at) }}
             </template>
           </ElTableColumn>
+          <ElTableColumn label="操作" width="100" fixed="right">
+            <template #default="scope">
+              <ElButton
+                v-if="scope.row.status !== 4 && hasAuth('package:create_refund')"
+                type="primary"
+                link
+                @click="handleCreateRefund(scope.row)"
+              >
+                退款申请
+              </ElButton>
+            </template>
+          </ElTableColumn>
         </ElTable>
         <ElPagination
           v-model:current-page="pagination.page"
-          v-model:page-size="pagination.pageSize"
+          v-model:page-size="pagination.page_size"
           :total="pagination.total"
-          :page-sizes="[10, 20, 50, 100]"
+          :page-sizes="[5, 10, 20]"
           layout="total, sizes, prev, pager, next, jumper"
           class="pagination"
           @current-change="handlePageChange"
@@ -126,6 +139,13 @@
       </div>
       <ElEmpty v-else-if="!props.boundDeviceId" description="暂无套餐数据" :image-size="100" />
     </div>
+
+    <!-- 退款申请对话框 -->
+    <CreateRefundDialog
+      v-model="createRefundDialogVisible"
+      :initial-order-no="currentRefundOrderNo"
+      @success="handleRefundSuccess"
+    />
   </ElCard>
 </template>
 
@@ -147,9 +167,27 @@
   import { formatDateTime } from '@/utils/business/format'
   import type { AssetPackageUsageRecord } from '@/types/api'
   import { useAuth } from '@/composables/useAuth'
+  import CreateRefundDialog from '@/components/business/CreateRefundDialog.vue'
 
   const { hasAuth } = useAuth()
 
+  // 退款申请对话框
+  const createRefundDialogVisible = ref(false)
+  const currentRefundOrderNo = ref<string | undefined>(undefined)
+
+  const handleCreateRefund = (row: PackageInfo) => {
+    if (!hasAuth('package:create_refund')) {
+      ElMessage.warning('您没有创建退款申请的权限')
+      return
+    }
+    currentRefundOrderNo.value = row.order_no
+    createRefundDialogVisible.value = true
+  }
+
+  const handleRefundSuccess = () => {
+    emit('refresh')
+  }
+
   // Props 使用 API 类型
   type PackageInfo = AssetPackageUsageRecord
 
@@ -179,6 +217,7 @@
     (e: 'page-change', page: number): void
     (e: 'size-change', size: number): void
     (e: 'navigateToDevice', deviceNo: string): void
+    (e: 'refresh'): void
   }
 
   const emit = defineEmits<Emits>()
@@ -186,7 +225,7 @@
   // 分页状态
   const pagination = ref({
     page: props.page,
-    pageSize: props.pageSize,
+    page_size: props.pageSize,
     total: props.total
   })
 
@@ -195,7 +234,7 @@
     () => [props.page, props.pageSize, props.total],
     ([newPage, newPageSize, newTotal]) => {
       pagination.value.page = newPage
-      pagination.value.pageSize = newPageSize
+      pagination.value.page_size = newPageSize
       pagination.value.total = newTotal
     }
   )