<vn-crud-model
    vn-id="model"
    url="TicketRequests/filter"
    user-params="::$ctrl.filterParams"
    limit="20"
    data="requests"
    order="shippedDate ASC, isOk ASC"
    auto-load="true">
</vn-crud-model>
<vn-portal slot="topbar">
    <vn-searchbar
        panel="vn-request-search-panel"
        info="Search request by id or alias"
        suggested-filter="$ctrl.filterParams"
        filter="$ctrl.filterParams"
        fetch-params="$ctrl.fetchParams($params)"
        model="model"
        auto-state="false">
    </vn-searchbar>
</vn-portal>
<vn-data-viewer model="model">
    <vn-card>
    <vn-table model="model" auto-load="false">
        <vn-thead>
            <vn-tr>
                <vn-th field="ticketFk" number>Ticket ID</vn-th>
                <vn-th field="shipped" expand>Shipped</vn-th>
                <vn-th field="description" filter-enabled="false" expand>Description</vn-th>
                <vn-th field="requesterFk">Requester</vn-th>
                <vn-th field="quantity" number editable>Requested</vn-th>
                <vn-th field="price" number>Price</vn-th>
                <vn-th field="attenderName">Atender</vn-th>
                <vn-th>Item</vn-th>
                <vn-th field="saleQuantity">Achieved</vn-th>
                <vn-th field="description" filter-enabled="false">Concept</vn-th>
                <vn-th field="isOk">State</vn-th>
                <vn-th></vn-th>
            </vn-tr>
        </vn-thead>
        <vn-tbody>
            <vn-tr ng-repeat="request in requests">
                <vn-td number>
                    <span class="link"
                        ng-click="ticketDescriptor.show($event, request.ticketFk)">
                        {{request.ticketFk}}
                    </span>
                </vn-td>
                <vn-td expand>
                    <span title="{{::request.shipped | date: 'dd/MM/yyyy'}}"
                        class="chip {{$ctrl.compareDate(request.shipped)}}">
                        {{::request.shipped | date: 'dd/MM/yyyy'}}
                    </span>
                </vn-td>
                <vn-td title="{{::request.description}}" expand>{{::request.description}}</vn-td>
                <vn-td number>
                    <span
                    class="link"
                    ng-click="workerDescriptor.show($event, request.requesterFk)">
                    {{::request.requesterName}}
                    </span>
                </vn-td>
                <vn-td number>{{::request.quantity}}</vn-td>
                <vn-td number>{{::request.price | currency: 'EUR':2}}</vn-td>
                <vn-td>
                    <span
                    class="link"
                    ng-click="workerDescriptor.show($event, request.attenderFk)">
                    {{::request.attenderName}}
                    </span>
                </vn-td>
                <vn-td-editable disabled="request.isOk != null" number>
                    <text>{{request.itemFk}}</text>
                    <field>
                        <vn-input-number class="dense" vn-focus
                            ng-model="request.itemFk">
                        </vn-input-number>
                    </field>
                </vn-td-editable>
                <vn-td-editable disabled="!request.itemFk || request.isOk != null" number>
                    <text number>{{request.saleQuantity}}</text>
                    <field>
                        <vn-input-number class="dense" vn-focus
                            ng-model="request.saleQuantity"
                            on-change="$ctrl.changeQuantity(request)">
                        </vn-input-number>
                    </field>
                </vn-td-editable>
                <vn-td expand>
                    <span
                        class="link"
                        ng-click="itemDescriptor.show($event, request.itemFk)"
                        title="{{request.itemDescription}}">
                        {{request.itemDescription}}
                    </span>
                </vn-td>
                <vn-td translate>{{$ctrl.getState(request.isOk)}}</vn-td>
                <vn-td>
                    <vn-icon
                        ng-if="request.response.length"
                        translate-attr="{title: request.response}"
                        icon="insert_drive_file"
                        class="bright">
                    </vn-icon>
                    <vn-icon-button
                        ng-if="request.isOk == null"
                        icon="thumb_down"
                        ng-click="denyDialog.show(request)"
                        translate-attr="{title: 'Discard'}"
                        tabindex="-1">
                    </vn-icon-button>
                </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-ticket-descriptor-popover
    vn-id="ticket-descriptor">
</vn-ticket-descriptor-popover>
<vn-item-descriptor-popover
    vn-id="item-descriptor"
    warehouse-fk="$ctrl.vnConfig.warehouseFk">
</vn-item-descriptor-popover>
<vn-dialog
    vn-id="denyDialog"
    on-accept="$ctrl.onDenyAccept($data)"
    on-close="$ctrl.denyObservation = null"
    message="Specify the reasons to deny this request">
    <tpl-body>
        <vn-textarea
            ng-model="$ctrl.denyObservation"
            vn-focus>
        </vn-textarea>
    </tpl-body>
    <tpl-buttons>
        <input type="button" response="cancel" translate-attr="{value: 'Cancel'}"/>
        <button response="accept" translate>Save</button>
    </tpl-buttons>
</vn-dialog>

<vn-contextmenu vn-id="contextmenu" targets="['vn-data-viewer']" model="model"
    expr-builder="$ctrl.exprBuilder(param, value)">
    <slot-menu>
        <vn-item translate
            ng-if="contextmenu.isFilterAllowed()"
            ng-click="contextmenu.filterBySelection()">
            Filter by selection
        </vn-item>
        <vn-item translate
            ng-if="contextmenu.isFilterAllowed()"
            ng-click="contextmenu.excludeSelection()">
            Exclude selection
        </vn-item>
        <vn-item translate
            ng-if="contextmenu.isFilterAllowed()"
            ng-click="contextmenu.removeFilter()">
            Remove filter
        </vn-item>
        <vn-item translate
            ng-click="contextmenu.removeAllFilters()">
            Remove all filters
        </vn-item>
        <vn-item translate
            ng-if="contextmenu.isActionAllowed()"
            ng-click="contextmenu.copyValue()">
            Copy value
        </vn-item>
    </slot-menu>
</vn-contextmenu>