feat:流量展示
All checks were successful
构建并部署前端到测试环境 / build-and-deploy (push) Successful in 2m26s

This commit is contained in:
sexygoat
2026-04-27 16:05:24 +08:00
parent d52efaadcb
commit a402f2329a

View File

@@ -41,11 +41,15 @@
<div class="flow-stat-row">
<span class="stat-item">
<span class="stat-label">已使用</span>
<span class="stat-value">{{ formatDataSize(currentPackage.data_usage_mb || 0) }}</span>
<span class="stat-value">{{
formatDataSize(currentPackage.data_usage_mb || 0)
}}</span>
</span>
<span class="stat-item">
<span class="stat-label">总量</span>
<span class="stat-value">{{ formatDataSize(currentPackage.data_limit_mb || 0) }}</span>
<span class="stat-value">{{
formatDataSize(currentPackage.data_limit_mb || 0)
}}</span>
</span>
<span class="stat-item">
<span class="stat-label">剩余</span>
@@ -63,12 +67,14 @@
currentPackage.data_limit_mb || 0
)
"
:color="getProgressColorByPercentage(
getUsageProgress(
currentPackage.data_usage_mb || 0,
currentPackage.data_limit_mb || 0
:color="
getProgressColorByPercentage(
getUsageProgress(
currentPackage.data_usage_mb || 0,
currentPackage.data_limit_mb || 0
)
)
)"
"
:stroke-width="10"
/>
</div>
@@ -78,11 +84,15 @@
<div class="flow-stat-row">
<span class="stat-item">
<span class="stat-label">已使用</span>
<span class="stat-value">{{ formatDataSize(currentPackage.virtual_used_mb || 0) }}</span>
<span class="stat-value">{{
formatDataSize(currentPackage.virtual_used_mb || 0)
}}</span>
</span>
<span class="stat-item">
<span class="stat-label">总量</span>
<span class="stat-value">{{ formatDataSize(currentPackage.virtual_limit_mb || 0) }}</span>
<span class="stat-value">{{
formatDataSize(currentPackage.virtual_limit_mb || 0)
}}</span>
</span>
<span class="stat-item">
<span class="stat-label">剩余</span>
@@ -100,12 +110,14 @@
currentPackage.virtual_limit_mb || 0
)
"
:color="getProgressColorByPercentage(
getUsageProgress(
currentPackage.virtual_used_mb || 0,
currentPackage.virtual_limit_mb || 0
:color="
getProgressColorByPercentage(
getUsageProgress(
currentPackage.virtual_used_mb || 0,
currentPackage.virtual_limit_mb || 0
)
)
)"
"
:stroke-width="10"
/>
</div>
@@ -154,14 +166,16 @@
currentPackage.data_limit_mb || 0
)
"
:color="getProgressColorByPercentage(
getUsageProgress(
currentPackage.enable_virtual_data
? currentPackage.virtual_used_mb || 0
: currentPackage.data_usage_mb || 0,
currentPackage.data_limit_mb || 0
:color="
getProgressColorByPercentage(
getUsageProgress(
currentPackage.enable_virtual_data
? currentPackage.virtual_used_mb || 0
: currentPackage.data_usage_mb || 0,
currentPackage.data_limit_mb || 0
)
)
)"
"
:stroke-width="14"
/>
</div>
@@ -182,12 +196,6 @@
<ElDescriptionsItem label="套餐类型">
{{ getPackageTypeName(currentPackage.package_type) }}
</ElDescriptionsItem>
<ElDescriptionsItem
v-if="isAdminOrPlatform && currentPackage.enable_virtual_data"
label="虚流量比例"
>
{{ currentPackage.virtual_ratio || '-' }}
</ElDescriptionsItem>
<ElDescriptionsItem label="开始时间">
{{ formatDateTime(currentPackage.start_time) || '-' }}
</ElDescriptionsItem>