<vn-crud-model
    vn-id="model"
    url="Zones/getUpcomingDeliveries"
    data="details"
    auto-load="true">
</vn-crud-model>
<vn-data-viewer model="model">
    <vn-card>
        <section ng-repeat="detail in details" class="vn-pa-md">
            <vn-horizontal class="header">
                <h5>{{$ctrl.getWeekDay(detail.shipped)}} - {{detail.shipped  | date: 'dd/MM/yyyy'}}</h5>
            </vn-horizontal>
            <vn-table>
                <vn-thead>
                    <vn-tr>
                        <vn-th class="waste-family">Province</vn-th>
                        <vn-th number>Closing</vn-th>
                        <vn-th number>Id</vn-th>
                    </vn-tr>
                </vn-thead>
                <vn-tbody>
                    <vn-tr ng-repeat="zone in detail.lines">
                        <vn-td class="waste-family">{{::zone.name}}</vn-td>
                        <vn-td number>{{::zone.hour}}</vn-td>
                        <vn-td number>{{::zone.zoneFk}}</vn-td>
                    </vn-tr>
                </vn-tbody>
            </vn-table>
        </section>
    </vn-card>
</vn-data-viewer>