fix(transport) : tableau prix — supprime la double bordure du bas + séparateur épais entre groupes Benne/Fond mouvant (ERP-170)
This commit is contained in:
@@ -124,24 +124,24 @@
|
|||||||
<tr
|
<tr
|
||||||
v-for="(row, i) in group.rows"
|
v-for="(row, i) in group.rows"
|
||||||
:key="`${gi}-${i}`"
|
:key="`${gi}-${i}`"
|
||||||
:class="i === group.rows.length - 1 ? '[&>td]:border-b [&>td]:border-black' : '[&>td]:border-b [&>td]:border-m-muted/30'"
|
|
||||||
>
|
>
|
||||||
<!-- Cellule de groupe fusionnée (rowspan), centrée verticalement,
|
<!-- Cellule de groupe fusionnée (rowspan), centrée verticalement ;
|
||||||
toujours séparateur noir en bas (entre groupes). -->
|
séparateur épais en bas entre les groupes (sauf dernier). -->
|
||||||
<td
|
<td
|
||||||
v-if="i === 0"
|
v-if="i === 0"
|
||||||
:rowspan="group.rows.length"
|
:rowspan="group.rows.length"
|
||||||
class="!border-b-black border-r border-black px-3 text-center align-middle text-[14px] font-medium"
|
class="border-r border-black px-3 text-center align-middle text-[14px] font-medium"
|
||||||
|
:class="groupBorder(gi)"
|
||||||
>
|
>
|
||||||
{{ group.label }}
|
{{ group.label }}
|
||||||
</td>
|
</td>
|
||||||
<td class="px-3 py-4 text-[14px]">{{ headerTitle }}</td>
|
<td class="px-3 py-4 text-[14px]" :class="dataBorder(group, i, gi)">{{ headerTitle }}</td>
|
||||||
<td class="px-3 py-4 text-[14px]">{{ row.apro }}</td>
|
<td class="px-3 py-4 text-[14px]" :class="dataBorder(group, i, gi)">{{ row.apro }}</td>
|
||||||
<td class="px-3 py-4 text-[14px]">{{ row.delivery }}</td>
|
<td class="px-3 py-4 text-[14px]" :class="dataBorder(group, i, gi)">{{ row.delivery }}</td>
|
||||||
<td class="px-3 py-4 text-[14px]">{{ row.forfait }}</td>
|
<td class="px-3 py-4 text-[14px]" :class="dataBorder(group, i, gi)">{{ row.forfait }}</td>
|
||||||
<td class="px-3 py-4 text-[14px]">{{ row.tonne }}</td>
|
<td class="px-3 py-4 text-[14px]" :class="dataBorder(group, i, gi)">{{ row.tonne }}</td>
|
||||||
<td class="px-3 py-4 text-[14px]">{{ row.indexation }}</td>
|
<td class="px-3 py-4 text-[14px]" :class="dataBorder(group, i, gi)">{{ row.indexation }}</td>
|
||||||
<td class="px-3 py-4 text-[14px]">{{ row.state }}</td>
|
<td class="px-3 py-4 text-[14px]" :class="dataBorder(group, i, gi)">{{ row.state }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
</template>
|
</template>
|
||||||
<tr v-if="!hasPrices">
|
<tr v-if="!hasPrices">
|
||||||
@@ -337,6 +337,27 @@ const priceGroups = computed<PriceGroupView[]>(() => {
|
|||||||
|
|
||||||
const hasPrices = computed(() => priceGroups.value.length > 0)
|
const hasPrices = computed(() => priceGroups.value.length > 0)
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Bordure basse d'une cellule de données :
|
||||||
|
* - ligne interne d'un groupe → fine grise ;
|
||||||
|
* - dernière ligne d'un groupe NON final → épaisse noire (séparateur de groupe) ;
|
||||||
|
* - dernière ligne du DERNIER groupe → aucune (le cadre du tableau s'en charge,
|
||||||
|
* évite la double bordure tout en bas).
|
||||||
|
*/
|
||||||
|
function dataBorder(group: PriceGroupView, i: number, gi: number): string {
|
||||||
|
const isLastRow = i === group.rows.length - 1
|
||||||
|
const isLastGroup = gi === priceGroups.value.length - 1
|
||||||
|
if (!isLastRow) {
|
||||||
|
return 'border-b border-m-muted/30'
|
||||||
|
}
|
||||||
|
return isLastGroup ? '' : 'border-b-2 border-black'
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Bordure basse de la cellule de groupe fusionnée (séparateur épais sauf dernier groupe). */
|
||||||
|
function groupBorder(gi: number): string {
|
||||||
|
return gi === priceGroups.value.length - 1 ? '' : 'border-b-2 border-black'
|
||||||
|
}
|
||||||
|
|
||||||
// ── Export XLSX des prix ─────────────────────────────────────────────────────
|
// ── Export XLSX des prix ─────────────────────────────────────────────────────
|
||||||
const exporting = ref(false)
|
const exporting = ref(false)
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user