<vn-crud-model
    vn-id="model"
    url="Items/getBalance"
    filter="$ctrl.filter"
    data="sales"
    auto-load="false">
</vn-crud-model>
<vn-crud-model
    auto-load="true"
    url="Warehouses"
    data="warehouses"
    order="name"
    vn-id="warehouse-model">
</vn-crud-model>
<vn-vertical>
    <vn-card class="vn-pa-lg vn-w-lg">
    <vn-vertical>
        <vn-horizontal>
            <vn-autocomplete
                vn-focus
                data="warehouses"
                show-field="name"
                value-field="id"
                initial-data="$ctrl.warehouseFk"
                ng-model="$ctrl.warehouseFk"
                label="Select warehouse">
            </vn-autocomplete>
        </vn-horizontal>
        <vn-table model="model">
            <vn-thead>
                <vn-tr>
                    <vn-th shrink></vn-th>
                    <vn-th expand>Date</vn-th>
                    <vn-th number order="DESC" shrink>Id</vn-th>
                    <vn-th>State</vn-th>
                    <vn-th>Reference</vn-th>
                    <vn-th expand>Client</vn-th>
                    <vn-th number>In</vn-th>
                    <vn-th number>Out</vn-th>
                    <vn-th number>Balance</vn-th>
                </vn-tr>
            </vn-thead>
            <vn-tbody>
                <vn-tr
                    ng-class="::{
                        'isIn': sale.invalue,
                        'balanceNegative': sale.balance < 0}" 
                    ng-repeat="sale in sales"
                    vn-repeat-last
                    on-last="$ctrl.scrollToLine(sale.lastPreparedLineFk)"
                    ng-attr-id="vnItemDiary-{{::sale.lineFk}}">
                    <vn-td shrink>
                        <a ui-sref="claim.card.summary({id: sale.claimFk})">
                            <vn-icon icon="icon-claims"
                                ng-show="sale.claimFk"
                                vn-tooltip="{{::$ctrl.$t('Claim')}}: {{::sale.claimFk}}">
                            </vn-icon>
                        </a>
                    </vn-td>
                    <vn-td expand>
                        <span class="chip" 
                            ng-class="::{warning: $ctrl.today == sale.shipped}">
                            {{::sale.shipped | date:'dd/MM/yyyy' }}
                        </span>
                    </vn-td>
                    <vn-td number shrink>
                        <span class="link"
                            ng-click="$ctrl.showDescriptor($event, sale)"
                            name="origin">
                            {{::sale.origin | dashIfEmpty}}
                        </span>
                    </vn-td>
                    <vn-td>{{::sale.stateName | dashIfEmpty}}</vn-td>
                    <vn-td>{{::sale.reference | dashIfEmpty}}</vn-td>
                    <vn-td class="truncate" expand>
                        <span ng-class="::{'warning chip': sale.highlighted}">
                            <span ng-if="::!sale.isTicket">
                                {{::sale.name | dashIfEmpty}}
                            </span>
                            <span
                                ng-if="::sale.isTicket"
                                vn-click-stop="clientDescriptor.show($event, sale.clientFk)"
                                class="link">
                                {{::sale.name | dashIfEmpty}}
                            </span>
                        </span>
                    </vn-td>
                    <vn-td number class="in">{{::sale.invalue | dashIfEmpty}}</vn-td>
                    <vn-td number>{{::sale.out | dashIfEmpty}}</vn-td>
                    <vn-td number class="balance">
                        <span class="chip balanceSpan"
                        ng-class="::{message: sale.lineFk == sale.lastPreparedLineFk}">
                            {{::sale.balance | dashIfEmpty}}
                        </span>
                    </vn-td>
                </vn-tr>
            </vn-tbody>
        </vn-table>
    </vn-vertical>
    </vn-card>
</vn-vertical>
<vn-ticket-descriptor-popover 
    vn-id="ticket-descriptor">
</vn-ticket-descriptor-popover>
<vn-client-descriptor-popover 
    vn-id="clientDescriptor">
</vn-client-descriptor-popover>
<vn-entry-descriptor-popover 
    vn-id="entryDescriptor">
</vn-entry-descriptor-popover>