<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 with negatives">
            </vn-button>
            <vn-button
                disabled="$ctrl.checked.length === 0"
                icon="alt_route"
                ng-click="splitTickets.show($event)"
                vn-tooltip="Advance tickets without negatives">
            </vn-button>
        </slot-actions>
        <slot-table>
            <table>
                <thead>
                    <tr second-header>
                        <td></td>
                        <th colspan="7">
                            <span translate>Destination</span>
                            {{model.userParams.dateToAdvance| date: 'dd/MM/yyyy'}}
                        </th>
                        <th colspan="11">
                            <span translate>Origin</span>
                            {{model.userParams.dateFuture | date: 'dd/MM/yyyy'}}
                        </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="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="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="futureZoneFk">
                            <span translate>Zone</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 && 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}}
                            </span>
                        </td>
                        <td>{{::ticket.ipt | dashIfEmpty}}</td>
                        <td>
                            <span
                                class="chip {{ticket.classColor}}">
                                {{::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 | currency: 'EUR': 2}}
                            </span>
                        </td>
                        <td separator>
                            <span
                                ng-click="ticketDescriptor.show($event, ticket.futureId)"
                                class="link">
                                {{::ticket.futureId | dashIfEmpty}}
                            </span>
                        </td>
                        <td>{{::ticket.futureIpt | dashIfEmpty}}</td>
                        <td>
                            <span
                                class="chip {{ticket.futureClassColor}}">
                                {{::ticket.futureState | dashIfEmpty}}
                            </span>
                        </td>
                        <td>{{::ticket.futureLiters | dashIfEmpty}}</td>
                        <td>{{::ticket.futureZoneName | 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-confirm
    vn-id="splitTickets"
    on-accept="$ctrl.splitTickets()"
    question="{{$ctrl.confirmationMessage}}"
    message="Advance tickets (without negatives)">
</vn-confirm>
<!-- Split progress -->
<vn-dialog
    vn-id="splitProgress"
    message="Progress">
    <tpl-body class="split-progress">
        <vn-vertical>
            <vn-spinner
                enable="splitProgress.enable">
            </vn-spinner>
            <vn-label-value
                label="Total progress"
                value="[{{$ctrl.progress.length}}/{{::$ctrl.checked.length}}]">
            </vn-label-value>
            <span class="vn-mt-md" ng-if="$ctrl.splitErrors.length" translate>Error list</span>
            <vn-vertical ng-repeat="error in $ctrl.splitErrors">
                <vn-label-value
                    label="{{error.id}}"
                    value="{{error.reason}}">
                </vn-label-value>
            </vn-vertical>
        </vn-vertical>
    </tpl-body>
    <tpl-buttons>
        <input type="button" response="cancel" translate-attr="{value: 'Cancel'}" ng-click="splitProgress.cancel = true"/>
    </tpl-buttons>
</vn-dialog>
<vn-ticket-descriptor-popover
    vn-id="ticketDescriptor">
</vn-ticket-descriptor-popover>