proyectos/shot-crafter-calculator
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(personajes): flatten capacity table iteration to prevent reverse render order from nested x-for in tbody
CI / Build Native (push) Successful in 6m47s
Details

Browse Source
This commit is contained in:
darroyo
2026-08-24 10:49:57 -04:00
parent 01f1d9da44
commit 9f0e94ab8a
1 changed files with 23 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/main/resources/templates/PageResource/personajes.html
+19 -11
View File
@@ -176,22 +176,20 @@
</tr>
</thead>
<tbody>
<template x-for="g in shots.GRADOS" :key="'block-' + g">
<template x-for="t in shots.TIPOS" :key="'row-' + t + '-' + g">
<tr :class="g !== shots.GRADOS[0] && t === shots.TIPOS[0] ? 'cap-block-divider' : ''">
<td class="text-bold" x-text="t"></td>
<template x-if="t === shots.TIPOS[0]">
<template x-for="(row, idx) in capRows()" :key="row.tipo + '-' + row.grado">
<tr :class="idx > 0 && (idx % shots.TIPOS.length) === 0 ? 'cap-block-divider' : ''">
<td class="text-bold" x-text="row.tipo"></td>
<template x-if="(idx % shots.TIPOS.length) === 0">
<td :rowspan="shots.TIPOS.length" class="text-center" style="vertical-align: middle;">
<span class="grade-badge" x-text="g"></span>
<span class="grade-badge" x-text="row.grado"></span>
</td>
</template>
<td class="text-right text-mono" x-text="fmtAdena(shots.referenceCapacity(t, g, 0))"></td>
<td class="text-right text-mono" x-text="fmtAdena(shots.referenceCapacity(t, g, 1))"></td>
<td class="text-right text-mono" x-text="fmtAdena(shots.referenceCapacity(t, g, 2))"></td>
<td class="text-right text-mono" x-text="fmtAdena(shots.referenceCapacity(t, g, 3))"></td>
<td class="text-right text-mono" x-text="fmtAdena(shots.referenceCapacity(row.tipo, row.grado, 0))"></td>
<td class="text-right text-mono" x-text="fmtAdena(shots.referenceCapacity(row.tipo, row.grado, 1))"></td>
<td class="text-right text-mono" x-text="fmtAdena(shots.referenceCapacity(row.tipo, row.grado, 2))"></td>
<td class="text-right text-mono" x-text="fmtAdena(shots.referenceCapacity(row.tipo, row.grado, 3))"></td>
</tr>
</template>
</template>
</tbody>
</table>
</div>
@@ -240,6 +238,16 @@
return Math.round(n).toLocaleString('es-CL');
},
capRows() {
const rows = [];
for (const g of window.shots.GRADOS) {
for (const t of window.shots.TIPOS) {
rows.push({ tipo: t, grado: g });
}
}
return rows;
},
async loadCharacters() {
try {
this.characters = await window.api.listCharacters();