<vn-crud-model
    vn-id="model"
    url="/api/Orders/filter"
    limit="20"
    data="orders"
    auto-load="false">
</vn-crud-model>
<div class="content-block">
    <div class="vn-list">
        <vn-card pad-medium-h>
            <vn-searchbar
                panel="vn-order-search-panel"
                on-search="$ctrl.onSearch($params)"
                vn-focus>
            </vn-searchbar>
        </vn-card>
    </div>
    <vn-card margin-medium-v>
        <vn-table
            model="model"
            auto-load="false">
            <vn-thead>
                <vn-tr>
                    <vn-th field="id" default-order="DESC" number>Id</vn-th>
                    <vn-th field="clientFk">Client</vn-th>
                    <vn-th field="clientFk">Sales person</vn-th>
                    <vn-th field="isConfirmed" center>Confirmed</vn-th>
                    <vn-th field="sourceApp">Created from</vn-th>
                    <vn-th field="created" center>Created</vn-th>
                    <vn-th field="created" center>Landed</vn-th>
                    <vn-th field="companyFk">Company</vn-th>
                    <vn-th field="total" center>Total</vn-th>
                </vn-tr>
            </vn-thead>
            <vn-tbody>
                <vn-tr ng-repeat="order in orders" class="clickable searchResult"
                ui-sref="order.card.summary({id: {{::order.id}}})">
                    <vn-td number>{{::order.id}}</vn-td>
                    <vn-td expand>
                        <span class="link" ng-click="$ctrl.showClientDescriptor($event, order.clientFk)">
                            {{::order.clientName}}
                        </span>
                    </vn-td>
                    <vn-td expand>
                        <span 
                            class="link" 
                            ng-click="$ctrl.showWorkerDescriptor($event, order.userId)">
                            {{::order.workerNickname | dashIfEmpty}}
                        </span>
                    </vn-td>
                    <vn-td center> 
                        <vn-check
                            field="order.isConfirmed"
                            disabled="true">
                        </vn-check>
                    </vn-td>
                    <vn-td>{{::order.sourceApp}}</vn-td>
                    <vn-td center>{{::order.created | date:'dd/MM/yyyy HH:mm'}}</vn-td>
                    <vn-td center>{{::order.landed | date:'dd/MM/yyyy'}}</vn-td>
                    <vn-td>{{::order.companyCode}}</vn-td>
                    <vn-td number>{{::order.total | currency: 'EUR': 2 | dashIfEmpty}}</vn-td>
                    <vn-td shrink>
                        <vn-icon-button
                            ng-click="$ctrl.preview($event, order)"
                            vn-tooltip="Preview"
                            icon="desktop_windows">
                        </vn-icon-button>
                    </vn-td>
                </vn-tr>
            </vn-tbody>
        </vn-table>
    </vn-card>
    <vn-pagination model="model"></vn-pagination>
</div>
<a ui-sref="order.create" vn-bind="+" vn-tooltip="New order" fixed-bottom-right>
    <vn-float-button icon="add"></vn-float-button>
</a>
<vn-client-descriptor-popover
    vn-id="clientDescriptor">
</vn-client-descriptor-popover>
<vn-worker-descriptor-popover 
    vn-id="workerDescriptor"
    user-id="$ctrl.selectedWorker">
</vn-worker-descriptor-popover>
<vn-dialog
    vn-id="summary"
    class="dialog-summary">
    <tpl-body>
        <vn-order-summary order="$ctrl.selectedOrder"></vn-order-summary>
    </tpl-body>
</vn-dialog>