<vn-crud-model
    vn-id="model"
    url="Tickets/getTicketsAdvance"
    auto-load="false">
</vn-crud-model>
<vn-portal slot="topbar">
    <vn-searchbar
        vn-focus
        panel="vn-advance-ticket-search-panel"
        placeholder="Search tickets"
        info="Search advance tickets by date"
        suggested-filter="$ctrl.filterParams"
        auto-state="false"
        model="model">
    </vn-searchbar>
</vn-portal>
<vn-card>
    <smart-table
        model="model"
        options="$ctrl.smartTableOptions"
        expr-builder="$ctrl.exprBuilder(param, value)"
        >
        <slot-actions>
            <vn-button disabled="$ctrl.checked.length === 0"
                icon="keyboard_double_arrow_left"
                ng-click="moveTicketsAdvance.show($event)"
                vn-tooltip="Advance tickets">
            </vn-button>
        </slot-actions>
        <slot-table>
            <table>
                <thead>
                    <tr second-header>
                        <td></td>
                        <th colspan="7" translate>Destination</th>
                        <th colspan="9" translate>Origin</th>
                    </tr>
                    <tr>
                        <th shrink>
                            <vn-multi-check
                                model="model"
                                checked="$ctrl.checkAll"
                                check-field="checked">
                            </vn-multi-check>
                        </th>
                        <th shrink>
                        </th>
                        <th field="id">
                            <span translate>ID</span>
                        </th>
                        <th field="shipped">
                            <span translate>Date</span>
                        </th>
                        <th field="ipt" title="{{'Item Packing Type' | translate}}">
                            <span>IPT</span>
                        </th>
                        <th field="state">
                            <span translate>State</span>
                        </th>
                        <th field="liters">
                            <span translate>Liters</span>
                        </th>
                        <th field="lines">
                            <span translate>Lines</span>
                        </th>
                        <th field="totalWithVat">
                            <span translate>Import</span>
                        </th>
                        <th separator field="futureId">
                            <span translate>ID</span>
                        </th>
                        <th field="futureShipped">
                            <span translate>Date</span>
                        </th>
                        <th field="futureIpt" title="{{'Item Packing Type' | translate}}">
                            <span>IPT</span>
                        </th>
                        <th field="futureState">
                            <span translate>State</span>
                        </th>
                        <th field="futureLiters">
                            <span translate>Liters</span>
                        </th>
                        <th field="notMovableLines">
                            <span translate>Not Movable</span>
                        </th>
                        <th field="futureLines">
                            <span translate>Lines</span>
                        </th>
                        <th field="futureTotalWithVat">
                            <span translate>Import</span>
                        </th>
                    </tr>
                </thead>
                <tbody>
                    <tr ng-repeat="ticket in model.data">
                        <td>
                            <vn-check
                                ng-model="ticket.checked"
                                vn-click-stop>
                            </vn-check>
                        </td>
                        <td>
                            <vn-icon
                                ng-show="ticket.futureAgency !== ticket.agency"
                                icon="icon-agency-term"
                                title="{{$ctrl.agencies(ticket.futureAgency, ticket.agency)}}">
                            </vn-icon>
                        </td>
                        <td>
                            <span
                                ng-click="ticketDescriptor.show($event, ticket.id)"
                                class="link">
                                {{::ticket.id | dashIfEmpty}}
                            </span>
                        </td>
                        <td shrink-date>
                            <span class="chip {{$ctrl.compareDate(ticket.shipped)}}">
                                {{::ticket.shipped | date: 'dd/MM/yyyy'}}
                            </span>
                        </td>
                        <td>{{::ticket.ipt | dashIfEmpty}}</td>
                        <td>
                            <span
                                class="chip {{$ctrl.stateColor(ticket.state)}}">
                                {{::ticket.state | dashIfEmpty}}
                            </span>
                        </td>
                        <td>{{::ticket.liters | dashIfEmpty}}</td>
                        <td>{{::ticket.lines | dashIfEmpty}}</td>
                        <td>
                            <span
                                class="chip {{$ctrl.totalPriceColor(ticket.totalWithVat)}}"
                                title="{{$ctrl.totalPriceTitle(ticket.totalWithVat) | translate}}">
                                {{::(ticket.totalWithVat ? ticket.totalWithVat : 0) | currency: 'EUR': 2}}
                            </span>
                        </td>
                        <td separator>
                            <span
                                ng-click="ticketDescriptor.show($event, ticket.futureId)"
                                class="link">
                                {{::ticket.futureId | dashIfEmpty}}
                            </span>
                        </td>
                        <td shrink-date>
                            <span class="chip {{$ctrl.compareDate(ticket.futureShipped)}}">
                                {{::ticket.futureShipped | date: 'dd/MM/yyyy'}}
                            </span>
                        </td>
                        <td>{{::ticket.futureIpt | dashIfEmpty}}</td>
                        <td>
                            <span
                                class="chip {{$ctrl.stateColor(ticket.futureState)}}">
                                {{::ticket.futureState | dashIfEmpty}}
                            </span>
                        </td>
                        <td>{{::ticket.futureLiters | dashIfEmpty}}</td>
                        <td>{{::ticket.notMovableLines | dashIfEmpty}}</td>
                        <td>{{::ticket.futureLines | dashIfEmpty}}</td>
                        <td>
                            <span
                                class="chip {{$ctrl.totalPriceColor(ticket.futureTotalWithVat)}}"
                                title="{{$ctrl.totalPriceTitle(ticket.futureTotalWithVat) | translate}}">
                                {{::(ticket.futureTotalWithVat ? ticket.futureTotalWithVat : 0) | currency: 'EUR': 2}}
                            </span>
                        </td>

                    </tr>
                </tbody>
            </table>
        </slot-table>
    </smart-table>
</vn-card>
<vn-confirm
    vn-id="moveTicketsAdvance"
    on-accept="$ctrl.moveTicketsAdvance()"
    question="{{$ctrl.confirmationMessage}}"
    message="Advance tickets">
</vn-confirm>
<vn-ticket-descriptor-popover
    vn-id="ticketDescriptor">
</vn-ticket-descriptor-popover>