Fun/TeyvatGuide
1
0
Fork 0
mirror of https://github.com/BTMuli/TeyvatGuide.git synced 2025-12-06 08:32:51 +08:00
Code Issues Packages Projects Releases Wiki Activity

💄 调整高度计算&星级占比计算逻辑

Browse Source
This commit is contained in:
BTMuli
2025-12-05 22:04:51 +08:00
parent 8d5cb52320
commit f30ee36a83
1 changed files with 19 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
src/components/userGacha/gro-data-view.vue
View File

@@ -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)}%`;