This commit is contained in:
sexygoat
@@ -124,7 +124,98 @@
|
||||
<div v-if="cardInfo" class="card-content-area slide-in">
|
||||
<!-- 主要内容区域 -->
|
||||
<div class="main-content-layout">
|
||||
<!-- 第一行：当前套餐 -->
|
||||
<!-- 第一行：基本信息（卡信息） -->
|
||||
<div class="row full-width">
|
||||
<ElCard shadow="never" class="info-card basic-info">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span>{{ cardInfo?.asset_type === 'card' ? '卡信息' : '设备信息' }}</span>
|
||||
<ElTag :type="cardInfo?.asset_type === 'card' ? 'success' : 'primary'" size="small">
|
||||
{{ cardInfo?.asset_type === 'card' ? 'IoT卡' : '设备' }}
|
||||
</ElTag>
|
||||
</div>
|
||||
</template>
|
||||
<ElDescriptions :column="2" border>
|
||||
<ElDescriptionsItem label="虚拟号">{{
|
||||
cardInfo?.virtual_no || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="资产状态">
|
||||
<ElTag :type="getAssetStatusType(cardInfo?.status)" size="small">
|
||||
{{ getAssetStatusName(cardInfo?.status) }}
|
||||
</ElTag>
|
||||
</ElDescriptionsItem>
|
||||
|
||||
<!-- 卡专属字段 -->
|
||||
<template v-if="cardInfo?.asset_type === 'card'">
|
||||
<ElDescriptionsItem label="ICCID">{{ cardInfo?.iccid || '--' }}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="MSISDN">{{
|
||||
cardInfo?.msisdn || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="IMSI">{{ cardInfo?.imsi || '--' }}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="运营商">{{
|
||||
cardInfo?.carrier_name || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="网络状态">
|
||||
<ElTag :type="cardInfo?.network_status === 1 ? 'success' : 'danger'" size="small">
|
||||
{{ cardInfo?.network_status === 1 ? '开机' : '停机' }}
|
||||
</ElTag>
|
||||
</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="卡类型">{{
|
||||
cardInfo?.card_category || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="绑定设备">{{
|
||||
cardInfo?.bound_device_name || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="最后同步时间">{{
|
||||
formatDateTime(cardInfo?.last_sync_time) || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="本月已用流量">{{
|
||||
formatDataSize(cardInfo?.current_month_usage_mb || 0)
|
||||
}}</ElDescriptionsItem>
|
||||
</template>
|
||||
|
||||
<!-- 设备专属字段 -->
|
||||
<template v-if="cardInfo?.asset_type === 'device'">
|
||||
<ElDescriptionsItem label="设备名称">{{
|
||||
cardInfo?.device_name || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="设备型号">{{
|
||||
cardInfo?.device_model || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="设备类型">{{
|
||||
cardInfo?.device_type || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="制造商">{{
|
||||
cardInfo?.manufacturer || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="IMEI">{{ cardInfo?.imei || '--' }}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="SN">{{ cardInfo?.sn || '--' }}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="最大卡槽">{{
|
||||
cardInfo?.max_sim_slots || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="已绑定卡数">{{
|
||||
cardInfo?.bound_card_count || 0
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="保护期状态">
|
||||
<ElTag :type="getProtectStatusType(cardInfo?.device_protect_status)" size="small">
|
||||
{{ getProtectStatusName(cardInfo?.device_protect_status) }}
|
||||
</ElTag>
|
||||
</ElDescriptionsItem>
|
||||
</template>
|
||||
|
||||
<ElDescriptionsItem label="实名状态">
|
||||
<ElTag :type="getRealNameStatusType(cardInfo?.real_name_status)" size="small">
|
||||
{{ getRealNameStatusName(cardInfo?.real_name_status) }}
|
||||
</ElTag>
|
||||
</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="激活时间">{{
|
||||
cardInfo?.activated_at || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
</ElDescriptions>
|
||||
</ElCard>
|
||||
</div>
|
||||
|
||||
<!-- 第二行：当前生效套餐 -->
|
||||
<div class="row full-width">
|
||||
<ElCard shadow="never" class="info-card current-package-card">
|
||||
<template #header>
|
||||
@@ -235,97 +326,6 @@
|
||||
</ElCard>
|
||||
</div>
|
||||
|
||||
<!-- 第二行：基本信息 -->
|
||||
<div class="row full-width">
|
||||
<ElCard shadow="never" class="info-card basic-info">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span>{{ cardInfo?.asset_type === 'card' ? '卡信息' : '设备信息' }}</span>
|
||||
<ElTag :type="cardInfo?.asset_type === 'card' ? 'success' : 'primary'" size="small">
|
||||
{{ cardInfo?.asset_type === 'card' ? 'IoT卡' : '设备' }}
|
||||
</ElTag>
|
||||
</div>
|
||||
</template>
|
||||
<ElDescriptions :column="2" border>
|
||||
<ElDescriptionsItem label="虚拟号">{{
|
||||
cardInfo?.virtual_no || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="资产状态">
|
||||
<ElTag :type="getAssetStatusType(cardInfo?.status)" size="small">
|
||||
{{ getAssetStatusName(cardInfo?.status) }}
|
||||
</ElTag>
|
||||
</ElDescriptionsItem>
|
||||
|
||||
<!-- 卡专属字段 -->
|
||||
<template v-if="cardInfo?.asset_type === 'card'">
|
||||
<ElDescriptionsItem label="ICCID">{{ cardInfo?.iccid || '--' }}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="MSISDN">{{
|
||||
cardInfo?.msisdn || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="IMSI">{{ cardInfo?.imsi || '--' }}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="运营商">{{
|
||||
cardInfo?.carrier_name || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="网络状态">
|
||||
<ElTag :type="cardInfo?.network_status === 1 ? 'success' : 'danger'" size="small">
|
||||
{{ cardInfo?.network_status === 1 ? '开机' : '停机' }}
|
||||
</ElTag>
|
||||
</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="卡类型">{{
|
||||
cardInfo?.card_category || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="绑定设备">{{
|
||||
cardInfo?.bound_device_name || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="最后同步时间">{{
|
||||
formatDateTime(cardInfo?.last_sync_time) || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="本月已用流量">{{
|
||||
formatDataSize(cardInfo?.current_month_usage_mb || 0)
|
||||
}}</ElDescriptionsItem>
|
||||
</template>
|
||||
|
||||
<!-- 设备专属字段 -->
|
||||
<template v-if="cardInfo?.asset_type === 'device'">
|
||||
<ElDescriptionsItem label="设备名称">{{
|
||||
cardInfo?.device_name || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="设备型号">{{
|
||||
cardInfo?.device_model || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="设备类型">{{
|
||||
cardInfo?.device_type || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="制造商">{{
|
||||
cardInfo?.manufacturer || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="IMEI">{{ cardInfo?.imei || '--' }}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="SN">{{ cardInfo?.sn || '--' }}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="最大卡槽">{{
|
||||
cardInfo?.max_sim_slots || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="已绑定卡数">{{
|
||||
cardInfo?.bound_card_count || 0
|
||||
}}</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="保护期状态">
|
||||
<ElTag :type="getProtectStatusType(cardInfo?.device_protect_status)" size="small">
|
||||
{{ getProtectStatusName(cardInfo?.device_protect_status) }}
|
||||
</ElTag>
|
||||
</ElDescriptionsItem>
|
||||
</template>
|
||||
|
||||
<ElDescriptionsItem label="实名状态">
|
||||
<ElTag :type="getRealNameStatusType(cardInfo?.real_name_status)" size="small">
|
||||
{{ getRealNameStatusName(cardInfo?.real_name_status) }}
|
||||
</ElTag>
|
||||
</ElDescriptionsItem>
|
||||
<ElDescriptionsItem label="激活时间">{{
|
||||
cardInfo?.activated_at || '--'
|
||||
}}</ElDescriptionsItem>
|
||||
</ElDescriptions>
|
||||
</ElCard>
|
||||
</div>
|
||||
|
||||
<!-- 第三行：归属信息和钱包概况 -->
|
||||
<div class="row two-columns">
|
||||
<!-- 左侧：归属信息 -->
|
||||
@@ -1342,6 +1342,8 @@
|
||||
if (!cardInfo.value?.currentPackageDetail) return '0.00'
|
||||
const total = cardInfo.value.currentPackageDetail.data_limit_mb || 0
|
||||
const used = cardInfo.value.currentPackageDetail.data_usage_mb || 0
|
||||
// 如果真流量总量和真流量已用都是0,则显示100%
|
||||
if (total === 0 && used === 0) return '100.00'
|
||||
if (total === 0) return '0.00'
|
||||
return ((used / total) * 100).toFixed(2)
|
||||
}
|
||||
|
||||
@@ -594,6 +594,7 @@
|
||||
{ required: true, message: '请输入套餐名称', trigger: 'blur' },
|
||||
{ min: 1, max: 255, message: '长度在 1 到 255 个字符', trigger: 'blur' }
|
||||
],
|
||||
series_id: [{ required: true, message: '请选择套餐系列', trigger: 'change' }],
|
||||
package_type: [{ required: true, message: '请选择套餐类型', trigger: 'change' }],
|
||||
duration_months: [
|
||||
{ required: true, message: '请输入有效期', trigger: 'blur' },
|
||||
|
||||
Reference in New Issue
Block a user