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

2026-06-12 10:41:37 +08:00
parent d23e896f97
commit e04a283319
98 changed files with 4279 additions and 6170 deletions
--- a/src/views/asset-management/asset-information/components/AssetSearchCard.vue
+++ b/src/views/asset-management/asset-information/components/AssetSearchCard.vue
@@ -251,8 +251,8 @@
      }

      :deep(.el-card__header) .card-header {
-        align-items: stretch;
        flex-direction: column;
+        align-items: stretch;

        .el-button {
          width: 100%;
@@ -261,13 +261,13 @@
      }

      .iccid-search {
-        align-items: stretch;
        flex-direction: column;
+        align-items: stretch;

        .iccid-input-wrapper {
          flex-basis: auto;
-          min-width: 0;
          width: 100%;
+          min-width: 0;

          .iccid-magnifier {
            right: 0;
--- a/src/views/asset-management/asset-information/components/BasicInfoCard.vue
+++ b/src/views/asset-management/asset-information/components/BasicInfoCard.vue
@@ -29,7 +29,9 @@
      <!-- 卡专属字段 -->
      <template v-if="cardInfo?.asset_type === 'card'">
        <ElDescriptionsItem label="ICCID">{{ cardInfo?.iccid || '-' }}</ElDescriptionsItem>
-        <ElDescriptionsItem label="IMEI">{{ cardInfo?.gateway_card_imei || '-' }}</ElDescriptionsItem>
+        <ElDescriptionsItem label="IMEI">{{
+          cardInfo?.gateway_card_imei || '-'
+        }}</ElDescriptionsItem>
        <ElDescriptionsItem label="运营商账户">{{
          cardInfo?.carrier_name || '-'
        }}</ElDescriptionsItem>
@@ -182,7 +184,7 @@
              <el-icon
                class="copy-icon"
                @click="handleCopyICCID(scope.row.iccid)"
-                style="cursor: pointer; color: var(--el-color-primary)"
+                style=" color: var(--el-color-primary);cursor: pointer"
              >
                <CopyDocument />
              </el-icon>
@@ -844,8 +846,8 @@

      @media (width <= 768px) {
        .card-header {
-          align-items: flex-start;
          flex-direction: column;
+          align-items: flex-start;

          .card-header-left,
          .card-header-right {
--- a/src/views/asset-management/asset-information/components/CurrentPackageCard.vue
+++ b/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;
--- a/src/views/asset-management/asset-information/components/OperationLogsCard.vue
+++ b/src/views/asset-management/asset-information/components/OperationLogsCard.vue
@@ -604,10 +604,10 @@
  .operation-logs-card {
    .card-header {
      display: flex;
-      align-items: center;
-      justify-content: space-between;
      flex-wrap: wrap;
      gap: 12px;
+      align-items: center;
+      justify-content: space-between;

      .header-title {
        font-size: 16px;
@@ -616,9 +616,9 @@

      .filter-section {
        display: flex;
-        align-items: center;
-        gap: 8px;
        flex-wrap: wrap;
+        gap: 8px;
+        align-items: center;
        justify-content: flex-end;
        min-width: 0;

@@ -651,20 +651,20 @@

          .change-item {
            display: flex;
-            align-items: center;
            gap: 4px;
+            align-items: center;
            font-size: 12px;

            .field-name {
-              color: var(--el-text-color-secondary);
              min-width: 72px;
+              color: var(--el-text-color-secondary);
            }

            .field-value {
              display: flex;
-              align-items: center;
              flex-wrap: wrap;
              gap: 4px;
+              align-items: center;
              word-break: break-all;

              .new-value {
@@ -691,8 +691,8 @@

    @media (width <= 1200px) {
      .card-header {
-        align-items: stretch;
        flex-direction: column;
+        align-items: stretch;

        .filter-section {
          justify-content: flex-start;
@@ -703,12 +703,12 @@

    @media (width <= 768px) {
      .card-header {
-        align-items: stretch;
        flex-direction: column;
+        align-items: stretch;

        .filter-section {
-          align-items: stretch;
          flex-direction: column;
+          align-items: stretch;

          :deep(.el-select),
          .el-button,
@@ -723,9 +723,9 @@
      }

      .logs-table-wrapper {
+        padding: 0 12px;
        margin-right: -12px;
        margin-left: -12px;
-        padding: 0 12px;

        :deep(.el-pagination) {
          justify-content: flex-start !important;
--- a/src/views/asset-management/asset-information/components/PackageListCard.vue
+++ b/src/views/asset-management/asset-information/components/PackageListCard.vue
@@ -444,8 +444,8 @@

      .package-table-wrapper {
        .table-scroll-container {
-          overflow-x: auto;
          width: 100%;
+          overflow-x: auto;
        }

        .package-table {
@@ -459,9 +459,9 @@
          .package-name-text {
            display: block;
            overflow: hidden;
+            font-weight: 500;
            text-overflow: ellipsis;
            white-space: nowrap;
-            font-weight: 500;
          }

          .traffic-progress {
@@ -489,8 +489,8 @@

            .progress-wrapper {
              display: flex;
-              align-items: center;
              gap: 1px;
+              align-items: center;

              .progress-track {
                position: relative;
@@ -500,13 +500,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;
                }
              }

@@ -523,15 +523,15 @@
      }

      .pagination {
-        margin-top: 16px;
        justify-content: flex-end;
+        margin-top: 16px;
      }

      @media (width <= 768px) {
        .card-header {
-          align-items: stretch;
          flex-direction: column;
          gap: 12px;
+          align-items: stretch;

          .card-header-right,
          .card-header-right .el-button {
@@ -546,15 +546,15 @@

          .traffic-progress {
            .progress-text {
-              align-items: flex-start;
              flex-direction: column;
              gap: 4px;
+              align-items: flex-start;
            }

            .progress-wrapper {
-              align-items: stretch;
              flex-direction: column;
              gap: 6px;
+              align-items: stretch;

              .progress-percentage {
                min-width: 0;
--- a/src/views/asset-management/asset-information/components/WalletTransactionCard.vue
+++ b/src/views/asset-management/asset-information/components/WalletTransactionCard.vue
@@ -421,8 +421,8 @@

      @media (width <= 1200px) {
        .wallet-header {
-          align-items: flex-start;
          flex-direction: column;
+          align-items: flex-start;

          .header-left,
          .filter-section {
@@ -437,8 +437,8 @@

      @media (width <= 768px) {
        .wallet-header {
-          align-items: stretch;
          flex-direction: column;
+          align-items: stretch;

          .header-left,
          .filter-section {
@@ -446,8 +446,8 @@
          }

          .filter-section {
-            align-items: stretch;
            flex-direction: column;
+            align-items: stretch;

            :deep(.el-select),
            :deep(.el-date-editor),
@@ -462,9 +462,9 @@
          }

          .header-left {
-            align-items: flex-start;
            flex-direction: column;
            gap: 6px;
+            align-items: flex-start;

            .wallet-divider {
              display: none;
@@ -490,9 +490,9 @@

      @media (width <= 480px) {
        .wallet-table-wrapper {
+          padding: 0 12px;
          margin-right: -12px;
          margin-left: -12px;
-          padding: 0 12px;
        }
      }
    }
--- a/src/views/asset-management/asset-information/components/dialogs/PackageRechargeDialog.vue
+++ b/src/views/asset-management/asset-information/components/dialogs/PackageRechargeDialog.vue
@@ -44,17 +44,17 @@
          </ElOption>
        </ElSelect>
        <template v-if="noSeriesId">
-          <div style="color: var(--el-text-color-warning); font-size: 12px; margin-top: 4px">
+          <div style=" margin-top: 4px; font-size: 12px;color: var(--el-text-color-warning)">
            该设备未关联套餐系列，无法购买套餐
          </div>
        </template>
        <template v-else-if="packagesEmptyWithSeriesId">
-          <div style="color: var(--el-text-color-info); font-size: 12px; margin-top: 4px">
+          <div style=" margin-top: 4px; font-size: 12px;color: var(--el-text-color-info)">
            该系列暂无可用套餐
          </div>
        </template>
        <template v-else-if="selectedPackageIsGift">
-          <div style="color: var(--el-color-warning); font-size: 12px; margin-top: 4px">
+          <div style=" margin-top: 4px; font-size: 12px;color: var(--el-color-warning)">
            提示: 赠送套餐只能使用线下支付方式，且必须上传支付凭证
          </div>
        </template>
@@ -95,9 +95,7 @@
          :limit="1"
        >
          <el-icon class="payment-voucher-upload__icon"><UploadFilled /></el-icon>
-          <div class="payment-voucher-upload__text">
-            将支付凭证拖到此处，或<em>点击上传</em>
-          </div>
+          <div class="payment-voucher-upload__text"> 将支付凭证拖到此处，或<em>点击上传</em> </div>
          <template #tip>
            <div class="el-upload__tip">支持 jpg、png 格式，文件大小不超过 5MB</div>
          </template>
@@ -459,8 +457,8 @@
 <style lang="scss" scoped>
  .dialog-footer {
    display: flex;
-    justify-content: flex-end;
    gap: 12px;
+    justify-content: flex-end;
  }

  .payment-voucher-upload {
@@ -487,8 +485,8 @@
      color: var(--el-text-color-regular);

      em {
-        color: var(--el-color-primary);
        font-style: normal;
+        color: var(--el-color-primary);
      }
    }
  }
--- a/src/views/asset-management/asset-information/composables/useAssetInfo.ts
+++ b/src/views/asset-management/asset-information/composables/useAssetInfo.ts
@@ -245,7 +245,7 @@ export function useAssetInfo() {
            order_no: pkg.order_no || '',
            package_name: pkg.package_name || '',
            paid_amount: pkg.paid_amount || 0,
-            retail_amount : pkg.retail_amount  || 0,
+            retail_amount: pkg.retail_amount || 0,
            real_total_mb: pkg.real_total_mb || 0,
            real_used_mb: pkg.real_used_mb || 0,
            real_remaining_mb: (pkg.real_total_mb || 0) - (pkg.real_used_mb || 0),
--- a/src/views/asset-management/asset-information/index.vue
+++ b/src/views/asset-management/asset-information/index.vue
@@ -690,8 +690,8 @@
  }

  .single-card-page {
-    padding: 20px;
    max-width: 100%;
+    padding: 20px;
    overflow-x: hidden;

    // 资产查询卡片
@@ -836,8 +836,8 @@
      .row {
        display: flex;
        gap: 24px;
-        min-width: 0;
        width: 100%;
+        min-width: 0;

        &.full-width {
          .info-card {
@@ -910,10 +910,10 @@
      :deep(.el-card__header) {
        padding: 20px 24px 16px;

-          .card-header {
-            display: flex;
-            flex-wrap: wrap;
-            gap: 8px;
+        .card-header {
+          display: flex;
+          flex-wrap: wrap;
+          gap: 8px;
          align-items: center;
          justify-content: space-between;
          font-size: 16px;
@@ -946,8 +946,8 @@
                height: 26px;

                .el-switch__core {
-                  height: 26px;
                  min-width: 50px;
+                  height: 26px;

                  .el-switch__inner {
                    font-size: 13px;