From f30ee36a83b59959fe51798c283febd03fcf106e Mon Sep 17 00:00:00 2001
From: BTMuli <bt-muli@outlook.com>
Date: Fri, 5 Dec 2025 22:04:51 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84=20=E8=B0=83=E6=95=B4=E9=AB=98?=
 =?UTF-8?q?=E5=BA=A6=E8=AE=A1=E7=AE=97&=E6=98=9F=E7=BA=A7=E5=8D=A0?=
 =?UTF-8?q?=E6=AF=94=E8=AE=A1=E7=AE=97=E9=80=BB=E8=BE=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/userGacha/gro-data-view.vue | 25 ++++++++++++++++------
 1 file changed, 19 insertions(+), 6 deletions(-)

diff --git a/src/components/userGacha/gro-data-view.vue b/src/components/userGacha/gro-data-view.vue
index d0e4df06..d37ef202 100644
--- a/src/components/userGacha/gro-data-view.vue
+++ b/src/components/userGacha/gro-data-view.vue
@@ -52,9 +52,9 @@
       </div>
       <!-- 进度条拼接 -->
       <div v-if="props.dataVal.length > 0" class="gro-mid-progress">
-        <div v-if="pg3 !== '0'" :style="{ width: pg3 }" :title="`3星占比:${pg3}`" class="s3" />
-        <div v-if="pg4 !== '0'" :style="{ width: pg4 }" :title="`4星占比:${pg4}`" class="s4" />
-        <div v-if="pg5 !== '0'" :style="{ width: pg5 }" :title="`5星占比:${pg5}`" class="s5" />
+        <div v-if="pg3 !== '0'" :style="{ width: pg3 }" class="s3" />
+        <div v-if="pg4 !== '0'" :style="{ width: pg4 }" class="s4" />
+        <div v-if="pg5 !== '0'" :style="{ width: pg5 }" class="s5" />
       </div>
     </div>
     <!-- 这边放具体物品的列表 -->
@@ -155,6 +155,14 @@ onMounted(async () => {
   calculateHeights();
 });
 
+watch(
+  () => [props.dataVal, props.dataType],
+  async () => {
+    await nextTick();
+    calculateHeights();
+  },
+);
+
 function loadData(): void {
   title.value = getTitle();
   const tempData = props.dataVal;
@@ -265,12 +273,17 @@ function getStar4UpAvg(): string {
 // 获取占比
 function getPg(star: "5" | "4" | "3"): string {
   let progress: number;
+  // 开根号
+  const sq5 = Math.sqrt(star5List.value.length);
+  const sq4 = Math.sqrt(star4List.value.length);
+  const sq3 = Math.sqrt(star3count.value);
+  const total = sq5 + sq4 + sq3;
   if (star === "5") {
-    progress = (star5List.value.length * 100) / props.dataVal.length;
+    progress = (sq5 * 100) / total;
   } else if (star === "4") {
-    progress = (star4List.value.length * 100) / props.dataVal.length;
+    progress = (sq4 * 100) / total;
   } else {
-    progress = (star3count.value * 100) / props.dataVal.length;
+    progress = (sq3 * 100) / total;
   }
   if (progress === 0) return "0";
   return `${progress.toFixed(2)}%`;