feat(opus): add coef subcards

This commit is contained in:
2026-05-15 03:24:07 +02:00
parent 779393106d
commit f774ff3340
4 changed files with 123 additions and 74 deletions
+53 -7
View File
@@ -9,9 +9,16 @@ interface User {
last_name?: string;
}
interface PointsFactor {
cost: number;
cycles: number;
area: number;
}
interface Puzzle {
id: number;
title: string;
points_factor?: PointsFactor;
}
interface PuzzleResponse {
@@ -91,7 +98,6 @@ const getPuzzleRanking = (puzzleId: number) => {
const ranking = resultsData.value.ranking_by_puzzle[puzzleId] || [];
return ranking.map((response) => {
console.log(response)
const user = resultsData.value!.users.find((u) => u.id === response.user_id);
return {
username: user?.username || "Unknown",
@@ -297,6 +303,28 @@ onMounted(() => {
</div>
<div v-else class="space-y-6">
<!-- Points Factor Info -->
<div v-if="puzzle.points_factor" class="bg-base-200 p-4 rounded-lg">
<p class="text-sm text-base-content/70 mb-3 font-semibold">Points Coefficients</p>
<div class="grid grid-cols-3 gap-4">
<div class="text-center">
<span class="text-2xl font-bold text-primary"><small>x</small>{{ puzzle.points_factor.cost
}}</span>
<p class="text-xs text-base-content/70">Cost</p>
</div>
<div class="text-center">
<span class="text-2xl font-bold text-primary"><small>x</small>{{ puzzle.points_factor.cycles
}}</span>
<p class="text-xs text-base-content/70">Cycles</p>
</div>
<div class="text-center">
<span class="text-2xl font-bold text-primary"><small>x</small>{{ puzzle.points_factor.area
}}</span>
<p class="text-xs text-base-content/70">Area</p>
</div>
</div>
</div>
<!-- Top 3 Podium -->
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
<div v-for="(response, index) in getPuzzleRanking(puzzle.id).slice(0, 3)" :key="index"
@@ -309,15 +337,21 @@ onMounted(() => {
<div class="divider my-2"></div>
<div class="space-y-2 text-sm">
<div class="flex justify-between">
<span>Cost</span>
<span>Cost<span v-if="puzzle.points_factor" class="text-xs text-base-content/60">
(x{{ puzzle.points_factor.cost }})
</span></span>
<span class="badge badge-sm">{{ response.cost || 'N/A' }}</span>
</div>
<div class="flex justify-between">
<span>Cycles</span>
<span>Cycles<span v-if="puzzle.points_factor" class="text-xs text-base-content/60">
(x{{ puzzle.points_factor.cycles }})
</span></span>
<span class="badge badge-sm">{{ response.cycles || 'N/A' }}</span>
</div>
<div class="flex justify-between">
<span>Area</span>
<span>Area<span v-if="puzzle.points_factor" class="text-xs text-base-content/60">
(x{{ puzzle.points_factor.area }})
</span></span>
<span class="badge badge-sm">{{ response.area || 'N/A' }}</span>
</div>
<div class="flex justify-between pt-2 border-t">
@@ -340,9 +374,21 @@ onMounted(() => {
<tr>
<th class="w-12">Rank</th>
<th>Player</th>
<th class="text-center">Cost</th>
<th class="text-center">Cycles</th>
<th class="text-center">Area</th>
<th class="text-center">
Cost
<span v-if="puzzle.points_factor" class="text-xs text-base-content/60 block">(x{{
puzzle.points_factor.cost }})</span>
</th>
<th class="text-center">
Cycles
<span v-if="puzzle.points_factor" class="text-xs text-base-content/60 block">(x{{
puzzle.points_factor.cycles }})</span>
</th>
<th class="text-center">
Area
<span v-if="puzzle.points_factor" class="text-xs text-base-content/60 block">(x{{
puzzle.points_factor.area }})</span>
</th>
<th class="text-center">Total (with coef.)</th>
<th class="text-right">Points</th>
</tr>