fix: 新增代理系列授权-建议售价使用套餐

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

@@ -193,7 +193,7 @@
         <ElDescriptionsItem label="套餐名称">
           {{ currentPackage.package_name || '-' }}
         </ElDescriptionsItem>
-        <ElDescriptionsItem label="套餐成本价格"  v-if="isAdminOrPlatform">
+        <ElDescriptionsItem label="套餐成本价格" v-if="isAdminOrPlatform">
           {{ formatAmount(currentPackage.paid_amount || 0) }}
         </ElDescriptionsItem>
         <ElDescriptionsItem label="套餐零售价">
@@ -285,7 +285,8 @@
     hasAuth('asset_info:view_current_package_virtual_usage')
   )
   const canShowCurrentPackageVirtualUsage = computed(
-    () => canViewCurrentPackageVirtualUsage.value && props.currentPackage?.enable_virtual_data !== false
+    () =>
+      canViewCurrentPackageVirtualUsage.value && props.currentPackage?.enable_virtual_data !== false
   )
   const shouldShowTrafficCard = computed(() => {
     if (!isAdminOrPlatform.value) return true
@@ -322,11 +323,11 @@
 
 <style scoped lang="scss">
   .current-package-card {
-      .card-header {
-        display: flex;
-        gap: 12px;
-        align-items: center;
-        justify-content: space-between;
+    .card-header {
+      display: flex;
+      gap: 12px;
+      align-items: center;
+      justify-content: space-between;
 
       .header-title {
         font-size: 16px;
@@ -336,24 +337,24 @@
 
     .flow-progress-card {
       padding: 20px;
+      margin-bottom: 20px;
       background: var(--el-fill-color-light);
       border-radius: 8px;
-      margin-bottom: 20px;
 
-        .flow-stats-container {
-          display: flex;
-          gap: 40px;
-          min-width: 0;
+      .flow-stats-container {
+        display: flex;
+        gap: 40px;
+        min-width: 0;
 
         .flow-stat-section {
           flex: 1;
           min-width: 0;
 
           .flow-stat-label {
-            font-size: 13px;
-            color: var(--el-text-color-secondary);
             margin-bottom: 8px;
+            font-size: 13px;
             font-weight: 500;
+            color: var(--el-text-color-secondary);
           }
 
           .flow-stat-row {
@@ -364,8 +365,8 @@
 
             .stat-item {
               display: flex;
-              align-items: baseline;
               gap: 4px;
+              align-items: baseline;
 
               .stat-label {
                 font-size: 12px;
@@ -390,8 +391,8 @@
 
         .flow-stat-item {
           display: flex;
-          align-items: baseline;
           gap: 8px;
+          align-items: baseline;
 
           .flow-stat-label {
             font-size: 13px;
@@ -410,16 +411,16 @@
         padding: 0 4px;
 
         .progress-label {
+          margin-bottom: 4px;
           font-size: 12px;
           color: var(--el-text-color-secondary);
-          margin-bottom: 4px;
         }
       }
 
       .progress-wrapper {
         display: flex;
-        align-items: center;
         gap: 1px;
+        align-items: center;
 
         .progress-track {
           position: relative;
@@ -429,13 +430,13 @@
           .breakpoint-marker {
             position: absolute;
             top: 50%;
+            z-index: 1;
             width: 8px;
             height: 8px;
+            cursor: pointer;
             background-color: var(--el-color-danger);
             border-radius: 50%;
             transform: translate(-50%, -50%);
-            z-index: 1;
-            cursor: pointer;
           }
         }
 
@@ -472,8 +473,8 @@
 
     @media (width <= 768px) {
       .card-header {
-        align-items: flex-start;
         flex-direction: column;
+        align-items: flex-start;
 
         .header-actions {
           width: 100%;
@@ -490,9 +491,9 @@
         }
 
         .progress-wrapper {
-          align-items: stretch;
           flex-direction: column;
           gap: 6px;
+          align-items: stretch;
 
           .progress-percentage {
             min-width: 0;