From 2cdbbc4641386e844ea60a68b37b501d32cd54ce Mon Sep 17 00:00:00 2001
From: hzj <1304805162@qq.com>
Date: Fri, 27 Feb 2026 12:04:05 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E5=9B=BD=E7=8E=8B=E7=9A=87=E5=90=8E):=20?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E5=9B=BE=E7=89=87=E6=9C=80=E5=B0=8F=E9=AB=98?=
 =?UTF-8?q?=E5=BA=A6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/Ranking/KingAndQueen/TopList.vue    | 38 +++++++++++++------
 .../KingAndQueen/components/borderImg.vue     | 14 ++++++-
 2 files changed, 38 insertions(+), 14 deletions(-)

diff --git a/src/views/Ranking/KingAndQueen/TopList.vue b/src/views/Ranking/KingAndQueen/TopList.vue
index 8829659..d585586 100644
--- a/src/views/Ranking/KingAndQueen/TopList.vue
+++ b/src/views/Ranking/KingAndQueen/TopList.vue
@@ -34,16 +34,29 @@
           v-smart-img
           :src="imageUrl('history')"
           alt=""
-          style="width: 20%; margin-top: 20px"
+          style="min-height: 17.22vw; width: 20%; margin-top: 20px"
           @click="historyShow = true"
         />
 
         <!-- 每周榜首 -->
         <div style="display: flex; flex-direction: column; align-items: center">
           <!-- 主标题 -->
-          <img v-smart-img :src="imageUrl('listTitle')" alt="" style="width: 90%" />
+          <img
+            v-smart-img
+            :src="imageUrl('listTitle')"
+            alt=""
+            style="min-height: 11.55vw; width: 90%"
+          />
           <!-- 榜首 -->
-          <div style="width: 100%; display: flex; justify-content: space-around; margin-top: 16px">
+          <div
+            style="
+              min-height: 40vw;
+              width: 100%;
+              display: flex;
+              justify-content: space-around;
+              margin-top: 16px;
+            "
+          >
             <div
               style="width: 40%"
               v-for="(topUser, index) in listTop"
@@ -116,7 +129,7 @@
         </div>
 
         <!-- 刷新倒计时 -->
-        <div style="display: flex; justify-content: center; margin-top: 20px">
+        <div style="min-height: 9vw; display: flex; justify-content: center; margin-top: 20px">
           <!-- 天数 -->
           <itemCenter :imgUrl="imageUrl('dayBg')" style="width: 12vw; margin-right: 10px">
             <div class="time">{{ Days }}D</div>
@@ -129,7 +142,7 @@
         </div>
 
         <!-- rewards按钮 -->
-        <div style="display: flex; justify-content: flex-end; margin-top: -8%">
+        <div style="min-height: 17.46vw; display: flex; justify-content: flex-end; margin-top: -8%">
           <img
             v-smart-img
             :src="imageUrl('rewards')"
@@ -149,14 +162,14 @@
             left: -4vw;
           "
         >
-          <itemCenter :imgUrl="imageUrl('eventGifts')">
+          <itemCenter style="min-height: 74.91vw" :imgUrl="imageUrl('eventGifts')">
             <div style="width: 80%; display: flex; justify-content: space-around; margin-top: 10%">
               <div
                 v-for="(gift, index) in gifts"
                 :key="index"
                 style="width: 30%; display: flex; flex-direction: column"
               >
-                <itemCenter :imgUrl="imageUrl('gift')">
+                <itemCenter style="min-height: 25.91vw" :imgUrl="imageUrl('gift')">
                   <img :src="gift.giftPhoto" alt="" width="50%" />
                 </itemCenter>
                 <div style="display: flex; justify-content: center; align-items: center; gap: 2px">
@@ -178,7 +191,7 @@
         <!-- 排行榜模块 -->
         <div style="width: 100vw">
           <!-- 排行榜切换按钮 -->
-          <div style="width: 100%">
+          <div style="min-height: 21.46vw; width: 100%">
             <div
               v-show="visibleKingList"
               style="width: 100%; display: flex; justify-content: space-around"
@@ -213,7 +226,7 @@
             <borderImg title="Ranking">
               <itemCenter
                 :imgUrl="imageUrl('border-item-user')"
-                style="margin: -2px 0"
+                style="min-height: 27.66vw; margin: -2px 0"
                 :contentStyle="`justify-content: flex-start;padding: 0 15%;gap: 8px;`"
                 v-for="(listItem, index) in topList"
                 :key="index"
@@ -385,6 +398,7 @@
                   >
                     <div
                       style="
+                        min-height: 34.56vw;
                         position: relative;
                         width: 100%;
                         min-height: max-content;
@@ -529,7 +543,7 @@
                   :style="{ backgroundImage: `url(${imageUrl('border-item')})` }"
                 >
                   <!-- 奖励榜切换按钮 -->
-                  <div style="width: 100%">
+                  <div style="width: 100%; min-height: 18.54vw">
                     <div
                       v-show="visibleKingRewards"
                       style="width: 100%; display: flex; justify-content: space-around"
@@ -568,7 +582,7 @@
                         v-smart-img
                         :src="topImg[Number(rewardsTop.rankRange) - 1]"
                         alt=""
-                        style="width: 40%; margin: 24px 0"
+                        style="min-height: 19.13vw; width: 40%; margin: 24px 0"
                       />
                       <div
                         style="
@@ -584,7 +598,7 @@
                           :key="rewardIndex"
                           style="width: 100%"
                         >
-                          <itemCenter :imgUrl="imageUrl('gift')">
+                          <itemCenter style="min-height: 27.07vw" :imgUrl="imageUrl('gift')">
                             <img
                               v-smart-img
                               :src="reward.cover || ''"
diff --git a/src/views/Ranking/KingAndQueen/components/borderImg.vue b/src/views/Ranking/KingAndQueen/components/borderImg.vue
index 16b0e32..c90ff19 100644
--- a/src/views/Ranking/KingAndQueen/components/borderImg.vue
+++ b/src/views/Ranking/KingAndQueen/components/borderImg.vue
@@ -3,7 +3,12 @@
   <div style="width: 100%">
     <!-- 头部 -->
     <div style="position: relative; margin-bottom: -2px">
-      <img v-smart-img :src="borderTopUrl" alt="" style="width: 100%; display: block" />
+      <img
+        v-smart-img
+        :src="borderTopUrl"
+        alt=""
+        style="min-height: 25.15vw; width: 100%; display: block"
+      />
       <div
         style="
           position: absolute;
@@ -28,7 +33,12 @@
     <slot></slot>
 
     <!-- 尾部 -->
-    <img v-smart-img :src="borderBottomUrl" alt="" style="width: 100%; display: block" />
+    <img
+      v-smart-img
+      :src="borderBottomUrl"
+      alt=""
+      style="min-height: 18.59vw; width: 100%; display: block"
+    />
   </div>
 </template>