diff --git a/src/api/assets.ts b/src/api/assets.ts index b948391..f9d9164 100644 --- a/src/api/assets.ts +++ b/src/api/assets.ts @@ -268,12 +268,20 @@ export interface AssetPackage { package_id: number package_name: string package_type: 'formal' | 'addon' + order_id?: number + order_no?: string status: number status_name: string usage_type: string priority: number package_usage_id: number master_usage_id: number | null + paid_amount?: number + enable_virtual_data?: boolean + reduction_pct?: number + real_total_mb?: number + real_used_mb?: number + virtual_total_mb?: number data_limit_mb: number data_usage_mb: number virtual_limit_mb: number diff --git a/src/pages/agent-system/asset-detail/index.vue b/src/pages/agent-system/asset-detail/index.vue index 1aff7ac..a525f73 100644 --- a/src/pages/agent-system/asset-detail/index.vue +++ b/src/pages/agent-system/asset-detail/index.vue @@ -2,6 +2,7 @@ import { ref, computed, onMounted } from 'vue' import { getAssetDetail, getAssetPackages, getCurrentPackage, getAssetHistory, stopAsset, startAsset } from '@/api/assets' import type { AssetType, CardInfo, DeviceInfo, AssetPackage, HistoryRecord } from '@/api/assets' +import { formatDataSize, formatTime } from '@/utils/format' // 资产类型 const assetType = ref('card') @@ -55,6 +56,50 @@ const statusColor = computed(() => { : { bg: '#ffebee', text: '#c62828' } }) +function getPackageStatusColor(status?: number) { + const map: Record = { + 0: { bg: '#fff3e0', text: '#e65100' }, + 1: { bg: '#e8f5e9', text: '#2e7d32' }, + 2: { bg: '#f5f5f5', text: '#999' }, + 3: { bg: '#ffebee', text: '#c62828' }, + 4: { bg: '#f5f5f5', text: '#999' }, + } + return status !== undefined ? map[status] || { bg: '#f5f5f5', text: '#999' } : { bg: '#f5f5f5', text: '#999' } +} + +function getPackageUsedMb(pkg: AssetPackage) { + return Number(pkg.enable_virtual_data ? pkg.virtual_used_mb : pkg.real_used_mb) || 0 +} + +function getPackageTotalMb(pkg: AssetPackage) { + return Number(pkg.real_total_mb) || 0 +} + +function getPackageRemainMb(pkg: AssetPackage) { + return Math.max(0, getPackageTotalMb(pkg) - (Number(pkg.real_used_mb) || 0)) +} + +function getPackageUsagePercent(pkg: AssetPackage) { + const total = getPackageTotalMb(pkg) + if (total <= 0) + return 0 + return Math.min(100, (getPackageUsedMb(pkg) / total) * 100) +} + +function getPackageTypeText(type?: AssetPackage['package_type']) { + const map: Record = { + formal: '正式套餐', + addon: '加油包', + } + return type ? map[type] || type : '-' +} + +function formatPackagePrice(amount?: number) { + if (amount === undefined || amount === null) + return '-' + return `¥${(amount / 100).toFixed(2)}` +} + // 页面加载 onMounted(() => { // 从路由参数获取 assetType 和 assetIdentifier @@ -72,7 +117,7 @@ async function loadAssetDetail() { try { // 调用资产详情接口 - const detailData = await getAssetDetail(assetType.value, assetId.value) + const detailData = await getAssetDetail(assetType.value, assetIdentifier.value) // 根据类型提取详情 if (assetType.value === 'card' && detailData.card) { @@ -118,29 +163,16 @@ async function loadAssetDetail() { // 加载套餐列表 async function loadPackages() { try { - // 1. 调用当前生效套餐接口 - try { - const current = await getCurrentPackage(assetIdentifier.value) - currentPackage.value = current - } catch (error) { - console.warn('获取当前套餐失败:', error) - currentPackage.value = null - } - - // 2. 调用套餐列表接口 + currentPackage.value = await getCurrentPackage(assetIdentifier.value) const packagesData = await getAssetPackages(assetIdentifier.value, { page: 1, page_size: 50 }) packageList.value = packagesData.items || [] - - // 如果没有获取到当前套餐,从列表中查找生效中的套餐 - if (!currentPackage.value && packageList.value.length > 0) { - currentPackage.value = packageList.value.find(pkg => pkg.status === 1) || null - } } catch (error: any) { console.error('加载套餐列表失败:', error) + packageList.value = [] } } @@ -282,7 +314,7 @@ function viewWallet() { - + - + + + + {{ currentPackage.package_name || '-' }} + + + 订单号:{{ currentPackage.order_no || '-' }} + + + + {{ currentPackage.status_name || '-' }} + + + + + + 总量 + {{ formatDataSize(getPackageTotalMb(currentPackage)) }} + + + 已使用 + {{ formatDataSize(getPackageUsedMb(currentPackage)) }} + + + 剩余 + {{ formatDataSize(getPackageRemainMb(currentPackage)) }} + + + + + + 已使用 + + {{ formatDataSize(getPackageUsedMb(currentPackage)) }} / + {{ formatDataSize(getPackageTotalMb(currentPackage)) }} + + + + + + + + + + 套餐价格 + {{ formatPackagePrice(currentPackage.paid_amount) }} + + + 套餐类型 + {{ getPackageTypeText(currentPackage.package_type) }} + + + 开始时间 + {{ formatTime(currentPackage.activated_at) }} + + + 到期时间 + {{ formatTime(currentPackage.expires_at) }} + + + 下单时间 + {{ formatTime(currentPackage.created_at) }} + + + 当前套餐 @@ -446,14 +554,14 @@ function viewWallet() { - + {{ currentPackage.package_name || '-' }} - + 已用: {{ currentPackage.virtual_used_mb || 0 }}MB / 总量: {{ currentPackage.virtual_limit_mb || 0 }}MB - + {{ currentPackage.activated_at }} ~ {{ currentPackage.expires_at }} @@ -488,7 +596,7 @@ function viewWallet() { - 已用: {{ pkg.virtual_used_mb || 0 }}MB / {{ pkg.virtual_limit_mb || 0 }}MB + 已用: {{ formatDataSize(getPackageUsedMb(pkg)) }} / {{ formatDataSize(getPackageTotalMb(pkg)) }} 优先级: {{ pkg.priority || '-' }} @@ -501,10 +609,10 @@ function viewWallet() { - + - 暂无套餐数据 + 暂无生效套餐 diff --git a/src/pages/agent-system/asset-search/index.vue b/src/pages/agent-system/asset-search/index.vue index 117b2d9..6728e8c 100644 --- a/src/pages/agent-system/asset-search/index.vue +++ b/src/pages/agent-system/asset-search/index.vue @@ -14,10 +14,10 @@ const realtimeStatus = ref(null) // 当前套餐 const currentPackage = ref(null) - // 套餐列表 const packageList = ref([]) - // 是否展开套餐列表 const showPackageList = ref(true) + // 套餐列表 + // 是否展开套餐列表 // 是否为卡片 const isCard = computed(() => assetType.value === 'card') @@ -50,6 +50,8 @@ assetType.value = null assetInfo.value = null realtimeStatus.value = null + currentPackage.value = null + packageList.value = [] } } @@ -187,9 +189,35 @@ } // 计算套餐使用百分比 + function getPackageUsedMb(pkg : AssetPackage) { + return Number(pkg.enable_virtual_data ? pkg.virtual_used_mb : pkg.real_used_mb) || 0 + } + + function getPackageTotalMb(pkg : AssetPackage) { + return Number(pkg.real_total_mb) || 0 + } + + function getPackageRemainMb(pkg : AssetPackage) { + return Math.max(0, getPackageTotalMb(pkg) - (Number(pkg.real_used_mb) || 0)) + } + + function getPackageTypeText(type ?: AssetPackage['package_type']) { + const map : Record = { + formal: '正式套餐', + addon: '加油包', + } + return type ? map[type] || type : '-' + } + + function formatPackagePrice(amount ?: number) { + if (amount === undefined || amount === null) return '-' + return `¥${(amount / 100).toFixed(2)}` + } + function getPackageUsagePercent(pkg : AssetPackage) { - if (!pkg.virtual_limit_mb || pkg.virtual_limit_mb === 0) return 0 - return Math.min(100, (pkg.virtual_used_mb / pkg.virtual_limit_mb) * 100) + const total = getPackageTotalMb(pkg) + if (total <= 0) return 0 + return Math.min(100, (getPackageUsedMb(pkg) / total) * 100) } // 获取信号质量等级 (基于 RSRP) @@ -287,7 +315,7 @@ - + IoT卡 @@ -477,8 +505,8 @@ - 套餐信息 - 当前生效套餐 + 全部套餐 + + + + {{ currentPackage.package_name || '-' }} + + + 订单号:{{ currentPackage.order_no || '-' }} + + + + {{ currentPackage.status_name || '-' }} + + + + + + 总量 + {{ formatDataSize(getPackageTotalMb(currentPackage)) }} + + + 已使用 + {{ formatDataSize(getPackageUsedMb(currentPackage)) }} + + + 剩余 + {{ formatDataSize(getPackageRemainMb(currentPackage)) }} + + + + + + 已使用 + + {{ formatDataSize(getPackageUsedMb(currentPackage)) }} / + {{ formatDataSize(getPackageTotalMb(currentPackage)) }} + + + + + + + + + + 套餐价格 + {{ formatPackagePrice(currentPackage.paid_amount) }} + + + 套餐类型 + {{ getPackageTypeText(currentPackage.package_type) }} + + + 开始时间 + {{ formatTime(currentPackage.activated_at) }} + + + 到期时间 + {{ formatTime(currentPackage.expires_at) }} + + + 下单时间 + {{ formatTime(currentPackage.created_at) }} + + + + + + {{ currentPackage.package_name || '-' }} + + + 订单号:{{ currentPackage.order_no || '-' }} + + + + {{ currentPackage.status_name || '-' }} + + + + + + 总量 + {{ formatDataSize(getPackageTotalMb(currentPackage)) }} + + + 已使用 + {{ formatDataSize(getPackageUsedMb(currentPackage)) }} + + + 剩余 + {{ formatDataSize(getPackageRemainMb(currentPackage)) }} + + + + + + 已使用 + + {{ formatDataSize(getPackageUsedMb(currentPackage)) }} / + {{ formatDataSize(getPackageTotalMb(currentPackage)) }} + + + + + + + + + + 套餐价格 + {{ formatPackagePrice(currentPackage.paid_amount) }} + + + 套餐类型 + {{ getPackageTypeText(currentPackage.package_type) }} + + + 开始时间 + {{ formatTime(currentPackage.activated_at) }} + + + 到期时间 + {{ formatTime(currentPackage.expires_at) }} + + + 下单时间 + {{ formatTime(currentPackage.created_at) }} + + + + + + {{ currentPackage.package_name || '-' }} + + + 订单号:{{ currentPackage.order_no || '-' }} + + + + {{ currentPackage.status_name || '-' }} + + + + + + 总量 + {{ formatDataSize(getPackageTotalMb(currentPackage)) }} + + + 已使用 + {{ formatDataSize(getPackageUsedMb(currentPackage)) }} + + + 剩余 + {{ formatDataSize(getPackageRemainMb(currentPackage)) }} + + + + + + 已使用 + + {{ formatDataSize(getPackageUsedMb(currentPackage)) }} / + {{ formatDataSize(getPackageTotalMb(currentPackage)) }} + + + + + + + + + + 套餐价格 + {{ formatPackagePrice(currentPackage.paid_amount) }} + + + 套餐类型 + {{ getPackageTypeText(currentPackage.package_type) }} + + + 开始时间 + {{ formatTime(currentPackage.activated_at) }} + + + 到期时间 + {{ formatTime(currentPackage.expires_at) }} + + + 下单时间 + {{ formatTime(currentPackage.created_at) }} + + - + + 虚拟流量 @@ -528,7 +766,7 @@ - + 真实流量 @@ -554,9 +792,9 @@ 暂无生效套餐 - - - 全部套餐 ({{ packageList.length }}) + + + 套餐列表 ({{ packageList.length }}) @@ -580,9 +818,9 @@ - 虚拟流量 + 已使用 - {{ formatDataSize(pkg.virtual_used_mb) }} / {{ formatDataSize(pkg.virtual_limit_mb) }} + {{ formatDataSize(getPackageUsedMb(pkg)) }} / {{ formatDataSize(getPackageTotalMb(pkg)) }} @@ -611,7 +849,7 @@ - + @@ -932,9 +1170,9 @@ WiFi信息 - + - SSID + WiFi名称 {{ realtimeStatus.device_realtime.ssid }} @@ -998,8 +1236,8 @@ - 套餐信息 - 当前生效套餐 + 全部套餐 + + + + {{ currentPackage.package_name || '-' }} + + + 订单号:{{ currentPackage.order_no || '-' }} + + + + {{ currentPackage.status_name || '-' }} + + + + + + 总量 + {{ formatDataSize(getPackageTotalMb(currentPackage)) }} + + + 已使用 + {{ formatDataSize(getPackageUsedMb(currentPackage)) }} + + + 剩余 + {{ formatDataSize(getPackageRemainMb(currentPackage)) }} + + + + + + 已使用 + + {{ formatDataSize(getPackageUsedMb(currentPackage)) }} / + {{ formatDataSize(getPackageTotalMb(currentPackage)) }} + + + + + + + + + + 套餐价格 + {{ formatPackagePrice(currentPackage.paid_amount) }} + + + 套餐类型 + {{ getPackageTypeText(currentPackage.package_type) }} + + + 开始时间 + {{ formatTime(currentPackage.activated_at) }} + + + 到期时间 + {{ formatTime(currentPackage.expires_at) }} + + + 下单时间 + {{ formatTime(currentPackage.created_at) }} + + + - + + 虚拟流量 @@ -1049,7 +1358,7 @@ - + 真实流量 @@ -1075,9 +1384,9 @@ 暂无生效套餐 - - - 全部套餐 ({{ packageList.length }}) + + + 套餐列表 ({{ packageList.length }}) @@ -1101,9 +1410,9 @@ - 虚拟流量 + 已使用 - {{ formatDataSize(pkg.virtual_used_mb) }} / {{ formatDataSize(pkg.virtual_limit_mb) }} + {{ formatDataSize(getPackageUsedMb(pkg)) }} / {{ formatDataSize(getPackageTotalMb(pkg)) }}