<vn-crud-model
    vn-id="model"
    url="SaleTrackings/{{$ctrl.$params.id}}/filter"
    limit="20"
    data="$ctrl.sales"
    order="concept ASC, quantity DESC"
    auto-load="true">
</vn-crud-model>
<vn-data-viewer model="model">
    <vn-card class="vn-w-lg">
    <vn-table model="model">
        <vn-thead>
            <vn-tr>
                <vn-th field="isChecked" center>Is checked</vn-th>
                <vn-th field="itemFk" number>Item</vn-th>
                <vn-th field="concept">Description</vn-th>
                <vn-th field="quantity" number>Quantity</vn-th>
                <vn-th field="parking" center>Parking</vn-th>
                <vn-th></vn-th>
            </vn-tr>
        </vn-thead>
        <vn-tbody>
            <vn-tr ng-repeat="sale in $ctrl.sales">
                <vn-td center>
                    <vn-chip
                        ng-class="{
                            'pink': sale.hasSaleGroupDetail,
                            'none': !sale.hasSaleGroupDetail,
                        }"
                        class="circleState"
                        vn-tooltip="sale group detail"
                    >
                    </vn-chip>
                    <vn-chip
                        ng-class="{
                            'notice': sale.isPreviousSelected,
                            'none': !sale.isPreviousSelected,
                        }"
                        class="circleState"
                        vn-tooltip="previous selected"
                        vn-click-stop="$ctrl.clickPreviousSelected($index)">
                    </vn-chip>
                    <vn-chip
                        ng-class="{
                            'dark-notice': sale.isPrevious,
                            'none': !sale.isPrevious,
                        }"
                        class="circleState"
                        vn-tooltip="previous"
                        vn-click-stop="$ctrl.clickPrevious($index)">
                    </vn-chip>
                    <vn-chip
                        ng-class="{
                            'warning': sale.isPrepared,
                            'none': !sale.isPrepared,
                        }"
                        class="circleState"
                        vn-tooltip="prepared"
                        vn-click-stop="$ctrl.clickPrepared($index)">
                    </vn-chip>
                    <vn-chip
                        ng-class="{
                            'yellow': sale.isControled,
                            'none': !sale.isControled,
                        }"
                        class="circleState"
                        vn-tooltip="checked"
                        vn-click-stop="$ctrl.clickControled($index)">
                    </vn-chip>
                </vn-td>
                <vn-td number>
                        <span
                        ng-click="itemDescriptor.show($event, sale.itemFk)"
                        class="link">
                        {{::sale.itemFk}}
                    </span>
                    </vn-td>
                <vn-td vn-fetched-tags>
                    <div>
                        <vn-one title="{{::sale.concept}}">{{::sale.concept}}</vn-one>
                        <vn-one ng-if="::sale.subName">
                            <h3 title="{{::sale.subName}}">{{::sale.subName}}</h3>
                        </vn-one>
                    </div>
                    <vn-fetched-tags
                        max-length="6"
                        item="::sale"
                        tabindex="-1">
                    </vn-fetched-tags>
                </vn-td>
                <vn-td number>{{::sale.quantity}}</vn-td>
                <vn-td center>{{::sale.parkingCode | dashIfEmpty}}</vn-td>
                <vn-td actions>
                    <vn-icon-button
                        vn-click-stop="$ctrl.showSaleTracking(sale)"
                        vn-tooltip="Log states"
                        icon="history">
                    </vn-icon-button>
                    <vn-icon-button
                        vn-click-stop="$ctrl.showItemShelvingSale(sale)"
                        vn-tooltip="Shelvings sale"
                        icon="icon-inventory">
                    </vn-icon-button>
                </vn-td>
            </vn-tr>
        </vn-tbody>
    </vn-table>
    </vn-card>
</vn-data-viewer>
<vn-item-descriptor-popover
    vn-id="item-descriptor"
    warehouse-fk="$ctrl.ticket.warehouseFk"
    ticket-fk="$ctrl.ticket.id">
</vn-item-descriptor-popover>

<vn-popup vn-id="saleTracking">
    <vn-crud-model
        vn-id="modelSaleTracking"
        url="SaleTrackings/listSaleTracking"
        link="{saleFk: $ctrl.saleId}"
        limit="20"
        data="saleTrackings"
        order="itemFk DESC"
        auto-load="true">
    </vn-crud-model>
    <vn-data-viewer model="modelSaleTracking">
        <vn-card class="vn-w-lg">
        <vn-table model="modelSaleTracking">
            <vn-thead>
                <vn-tr>
                    <vn-th field="quantity" number>Quantity</vn-th>
                    <vn-th field="originalQuantity" number>Original</vn-th>
                    <vn-th field="workerFk">Worker</vn-th>
                    <vn-th field="state" shrink>State</vn-th>
                    <vn-th field="created" expand>Created</vn-th>
                </vn-tr>
            </vn-thead>
            <vn-tbody>
                <vn-tr ng-repeat="saleTracking in saleTrackings">
                    <vn-td number>{{::saleTracking.quantity}}</vn-td>
                    <vn-td number>{{::saleTracking.originalQuantity}}</vn-td>
                    <vn-td expand>
                        <span
                            class="link"
                            ng-click="workerDescriptor.show($event, saleTracking.workerFk)">
                            {{::saleTracking.name | dashIfEmpty}}
                        </span>
                    </vn-td>
                    <vn-td shrink>{{::saleTracking.state}}</vn-td>
                    <vn-td expand>{{::saleTracking.created | date: 'dd/MM/yyyy HH:mm'}}</vn-td>
                </vn-tr>
            </vn-tbody>
        </vn-table>
        </vn-card>
    </vn-data-viewer>
    <vn-worker-descriptor-popover
        vn-id="worker-descriptor">
    </vn-worker-descriptor-popover>
</vn-popup>


<vn-popup vn-id="itemShelvingSale" message="Shelvings sale">
    <vn-crud-model
        vn-id="modelSaleTracking"
        url="ItemShelvingSales/filter"
        link="{saleFk: $ctrl.saleId}"
        limit="20"
        data="$ctrl.itemShelvingSales"
        auto-load="true">
    </vn-crud-model>
    <vn-data-viewer model="modelSaleTracking" class="vn-w-lg">
        <vn-table>
            <vn-thead>
                <vn-tr>
                    <vn-th field="quantity" number>Quantity</vn-th>
                    <vn-th field="workerFk">Worker</vn-th>
                    <vn-th field="shelving" shrink>Shelving</vn-th>
                    <vn-th field="parking" shrink>Parking</vn-th>
                    <vn-th field="created" expand>Created</vn-th>
                </vn-tr>
            </vn-thead>
            <vn-tbody>
                <vn-tr ng-repeat="itemShelvingSale in $ctrl.itemShelvingSales">
                    <vn-td-editable number shrink>
                        <text>{{itemShelvingSale.quantity}}</text>
                        <field>
                            <vn-input-number class="dense" vn-focus
                                ng-model="itemShelvingSale.quantity"
                                on-change="$ctrl.updateItemShelvingSale(itemShelvingSale)">
                            </vn-input-number>
                        </field>
                    </vn-td-editable>
                    <vn-td expand>
                        <span
                            class="link"
                            ng-click="workerDescriptor.show($event, itemShelvingSale.userFk)">
                            {{::itemShelvingSale.name | dashIfEmpty}}
                        </span>
                    </vn-td>
                    <vn-td shrink>{{::itemShelvingSale.shelvingFk}}</vn-td>
                    <vn-td shrink>{{::itemShelvingSale.code}}</vn-td>
                    <vn-td expand>{{::itemShelvingSale.created | date: 'dd/MM/yyyy HH:mm'}}</vn-td>
                </vn-tr>
            </vn-tbody>
        </vn-table>
        </vn-card>
    </vn-data-viewer>
    <vn-worker-descriptor-popover
        vn-id="worker-descriptor">
    </vn-worker-descriptor-popover>
</vn-popup>


<!-- <vn-dialog
    vn-id="itemShelvingSale"
    message="Shelvings sale"
    on-accept="$ctrl.sendPdfInvoice($data)">
    <tpl-body>
        <vn-crud-model
            vn-id="modelSaleTracking"
            url="ItemShelvingSales/filter"
            link="{saleFk: $ctrl.saleId}"
            limit="20"
            data="$ctrl.itemShelvingSales"
            auto-load="true">
        </vn-crud-model>
        <vn-data-viewer model="modelSaleTracking" class="vn-w-lg">
            <vn-table class="scrollable">
                <vn-thead>
                    <vn-tr>
                        <vn-th field="quantity" number shrink>Quantity</vn-th>
                        <vn-th field="workerFk">Worker</vn-th>
                        <vn-th field="shelving" shrink>Shelving</vn-th>
                        <vn-th field="parking" shrink>Parking</vn-th>
                        <vn-th field="created" expand>Created</vn-th>
                    </vn-tr>
                </vn-thead>
                <vn-tbody>
                    <vn-tr ng-repeat="itemShelvingSale in $ctrl.itemShelvingSales">
                        <vn-td-editable number shrink>
                            <text>{{itemShelvingSale.quantity}}</text>
                            <field>
                                <vn-input-number class="dense" vn-focus
                                    ng-model="itemShelvingSale.quantity"
                                    on-change="$ctrl.updateItemShelvingSale(sale)">
                                </vn-input-number>
                            </field>
                        </vn-td-editable>
                        <vn-td expand>
                            <span
                                class="link"
                                ng-click="workerDescriptor.show($event, itemShelvingSale.userFk)">
                                {{::itemShelvingSale.name | dashIfEmpty}}
                            </span>
                        </vn-td>
                        <vn-td shrink>{{::itemShelvingSale.shelvingFk}}</vn-td>
                        <vn-td shrink>{{::itemShelvingSale.code}}</vn-td>
                        <vn-td expand>{{::itemShelvingSale.created | date: 'dd/MM/yyyy HH:mm'}}</vn-td>
                    </vn-tr>
                </vn-tbody>
            </vn-table>
            </vn-card>
        </vn-data-viewer>
        <vn-worker-descriptor-popover
            vn-id="worker-descriptor">
        </vn-worker-descriptor-popover>
    </tpl-body>
    <tpl-buttons>
        <input type="button" response="cancel" translate-attr="{value: 'Cancel'}"/>
        <button response="accept" translate>Confirm</button>
    </tpl-buttons>
</vn-dialog> -->