<vn-crud-model
    auto-load="true"
    vn-id="model"
    url="OrderRows"
    filter="::$ctrl.filter"
    link="{orderFk: $ctrl.$params.id}"
    limit="20"
    data="rows"
    on-data-change="$ctrl.onDataChange()">
</vn-crud-model>
<mg-ajax path="Orders/{{$ctrl.$params.id}}/getTotalVolume" options="mgEdit"></mg-ajax>
<vn-data-viewer model="model" class="header vn-w-lg">
    <vn-card class="vn-pa-lg">
        <vn-label-value
            label="Total"
            value="{{::edit.model.totalVolume}} M³">
        </vn-label-value>
        <vn-label-value
            label="Cajas"
            value="{{::edit.model.totalBoxes | dashIfEmpty}} U">
        </vn-label-value>
    </vn-card>
    <vn-card class="vn-mt-md">
        <vn-table model="model">
            <vn-thead>
                <vn-tr>
                    <vn-th shrink field="itemFk" number>Item</vn-th>
                    <vn-th>Description</vn-th>
                    <vn-th shrink field="quantity" number>Quantity</vn-th>
                    <vn-th shrink number>m³ per quantity</vn-th>
                </vn-tr>
            </vn-thead>
            <vn-tbody>
                <vn-tr ng-repeat="row in rows">
                    <vn-td shrink number>
                        <span
                            ng-click="itemDescriptor.show($event, row.itemFk)"
                            class="link">
                            {{::row.itemFk}}
                        </span>
                    </vn-td>
                    <vn-td vn-fetched-tags>
                        <div>
                            <vn-one title="{{::row.item.name}}">{{::row.item.name}}</vn-one>
                            <vn-one ng-if="::row.item.subName">
                                <h3 title="{{::row.item.subName}}">{{::row.item.subName}}</h3>
                            </vn-one>
                        </div>
                        <vn-fetched-tags
                            max-length="6"
                            item="::row.item"
                            tabindex="-1">
                        </vn-fetched-tags>
                    </vn-td>
                    <vn-td shrink number>{{::row.quantity}}</vn-td>
                    <vn-td shrink number>{{::row.volume | number:3}}</vn-td>
                </vn-tr>
            </vn-tbody>
        </vn-table>
    </vn-card>
</vn-data-viewer>
<vn-item-descriptor-popover
    vn-id="item-descriptor"
    warehouse-fk="$ctrl.vnConfig.warehouseFk">
</vn-item-descriptor-popover>