Merge branch 'main' of git.opencomputing.cn:yumoqing/kboss

f/web-kboss/src/views/product/allProduct/index.vue

@@ -134,7 +134,7 @@
 
               <div class="token-price-grid">
                 <div
-                  v-for="(price, priceIndex) in getBillingPreview(product.billing_method)"
+                  v-for="(price, priceIndex) in parseBillingMethod(product.billing_method)"
                   :key="`${product.id}-billing-${priceIndex}`"
                   class="token-price-item"
                 >
@@ -142,9 +142,6 @@
                   <strong>{{ price.price }}</strong>
                   <em>{{ price.desc }}</em>
                 </div>
-                <div v-if="getBillingMoreCount(product.billing_method)" class="billing-more-tip">
-                  + {{ getBillingMoreCount(product.billing_method) }} 条计费规则，进入详情查看
-                </div>
               </div>
 
               <!-- <div class="token-description">
@@ -416,14 +413,6 @@ export default {
         });
     },
 
-    getBillingPreview(value) {
-      return this.parseBillingMethod(value).slice(0, 3);
-    },
-
-    getBillingMoreCount(value) {
-      return Math.max(this.parseBillingMethod(value).length - 3, 0);
-    },
-
     // 供应商头像取首字，避免没有 logo 时卡片显得空。
     getProviderInitial(provider) {
       return provider ? provider.slice(0, 1) : 'M';
@@ -1504,10 +1493,21 @@ export default {
     .token-price-grid {
       position: relative;
       z-index: 1;
+      max-height: 178px;
       display: flex;
       flex-direction: column;
       gap: 5px;
       margin-bottom: 10px;
+      padding-right: 4px;
+      overflow-y: auto;
+      scrollbar-width: none;
+      -ms-overflow-style: none;
+
+      &::-webkit-scrollbar {
+        display: none;
+        width: 0;
+        height: 0;
+      }
     }
 
     .token-price-item {
@@ -1547,15 +1547,6 @@ export default {
       }
     }
 
-    .billing-more-tip {
-      padding: 5px 9px;
-      color: #2563eb;
-      font-size: 11px;
-      font-weight: 700;
-      background: #eff6ff;
-      border-radius: 999px;
-    }
-
     .token-description {
       position: relative;
       z-index: 1;