<!DOCTYPE html>
<html>
<body>
<table v-for="labelData in labelsData" style="break-before: page">
<tbody>
<tr>
<td rowspan="6"><span id="vertical" class="ellipsize">{{getVertical(labelData)}}</span></td>
<td id="ticketFk">
{{labelData.clientFk ? `${labelData.ticketFk} « ${labelData.clientFk}` : labelData.ticketFk}}
</td>
<td colspan="2" id="shipped">{{labelData.shipped || '---'}}</td>
</tr>
<tr>
<td rowspan="3"><div v-html="getBarcode(labelData.ticketFk)" id="barcode"></div></td>
<td id="outline" class="ellipsize">{{labelData.workerCode || '---'}}</td>
</tr>
<tr>
<td id="outline" class="ellipsize">{{labelData.labelCount || 0}}</td>
</tr>
<tr>
<td id="outline" class="ellipsize">{{labelData.code == 'V' ? (labelData.size || 0) + 'cm' : (labelData.volume || 0) + 'm³'}}</td>
</tr>
<tr>
<td><div id="agencyDescripton" class="ellipsize">{{getAgencyDescripton(labelData)}}</div></td>
<td id="bold">{{labelData.lineCount || 0}}</td>
</tr>
<tr>
<td id="nickname" class="ellipsize">{{labelData.nickName ? labelData.nickName.toUpperCase() : '---'}}</td>
<td id="bold">{{labelData.shippedHour || labelData.zoneHour}}</td>
</tr>
</tbody>
</table>
</body>
</html>