<!DOCTYPE html> <html lang="es"> <body> <section class="container" id="report"> <!-- Header component --> <report-header :locale="route.locale"></report-header> <!-- End header component --> <section class="main"> <h1 class="title uppercase">{{$t('Title')}}</h1> <section class="panel"> <section class="header">{{$t('Information')}}</section> <section class="body"> <section> <table width="100%"> <tbody> <tr> <th class="font gray align-right">{{$t('Route')}}</th> <td>{{route.id}}</td> <th class="font gray align-right">{{$t('Driver')}}</th> <td>{{route.userNickName}}</td> </tr> <tr> <th class="font gray align-right">{{$t('Date')}}</th> <td>{{date(route.created)}}</td> <th class="font gray align-right">{{$t('Vehicle')}}</th> <td>{{route.vehicleTradeMark}} {{route.vehicleModel}}</td> </tr> <tr> <th class="font gray align-right">{{$t('Time')}}</th> <td>{{time(route.time)}}</td> <td></td> <td>{{route.plateNumber}}</td> </tr> <tr> <th class="font gray align-right">{{$t('Volume')}}</th> <td>{{route.m3}}</td> <th class="font gray align-right">{{$t('Agency')}}</th> <td>{{route.agencyName}}</td> </tr> </tbody> </table> <section class="contained"> <table class="middle centered" width="70%"> <tbody> <tr> <td> <p class="small">Hora inicio</p> </td> <td> <p class="small">Hora fin</p> </td> <td class="gap"></td> <td> <p class="small">Km inicio</p> </td> <td> <p class="small">Km fin</p> </td> </tr> <tr> <td v-for="i in 2"> <section class="field rectangle"> <span></span> </section> </td> <td class="gap"></td> <td v-for="i in 2"> <section class="field rectangle"> <span></span> </section> </td> </tr> </tbody> </table> </section> </section> </section> </section> <section class="non-page-break" v-for="ticket in tickets"> <section> <table class="column-oriented repeatable"> <thead> <tr> <td class="number">{{$t('Order')}}</td> <td class="number">{{$t('Ticket')}}</td> <td>{{$t('Client')}}</td> <td class="number">{{$t('Address')}}</td> <td class="number">{{$t('Packages')}}</td> </tr> </thead> <tbody> <tr> <td class="number">{{ticket.priority}}</td> <td class="number">{{ticket.id}}</td> <td>{{ticket.clientFk}} {{ticket.addressName}}</td> <td v-if="ticket.addressFk" class="number"> {{ticket.addressFk.toString().substr(0, ticket.addressFk.toString().length - 3)}} <span class="black-container"> {{ticket.addressFk.toString().substr(-3, 3)}} </span> </td> <td class="number">{{ticket.packages}}</td> </tr> </tbody> </table> </section> <section> <table width="100%"> <tbody> <tr> <th class="font gray align-right">{{$t('Street')}}</th> <td>{{ticket.street}}</td> <th class="font gray align-right">{{$t('Postcode')}}</th> <td>{{ticket.postalCode}}</td> </tr> <tr> <th class="font gray align-right">{{$t('City')}}</th> <td>{{ticket.city}}</td> <th class="font gray align-right">{{$t('Agency')}}</th> <td>{{ticket.ticketAgency}}</td> </tr> <tr> <th class="font gray align-right">{{$t('Mobile')}}</th> <td>{{ticket.mobile}}</td> <th class="font gray align-right">{{$t('Phone')}}</th> <td>{{ticket.phone}}</td> </tr> <tr> <th class="font gray align-right">{{$t('Warehouse')}}</th> <td>{{ticket.warehouseName}}</td> <th class="font gray align-right">{{$t('salesPerson')}}</th> <td>{{ticket.salesPersonName}}</td> </tr> <tr> <th class="font gray align-right">{{$t('Import')}}</th> <td>{{ticket.import}}</td> </tr> </tbody> </table> <section v-if="ticket.description || ticket.shipFk" class="text-area"> <p>{{ticket.description}}</p> <p v-if="ticket.shipFk">{{$t('stowaway')}}: {{ticket.shipFk}}</p> </section> </section> </section> </section> </section> <!-- Footer component --> <report-footer id="pageFooter" :left-text="$t('route', [route.id])" :locale="route.locale"> </report-footer> <!-- End footer component --> </section> </body> </html>