<vn-crud-model
    vn-id="model"
    url="Recoveries"
    link="{clientFk: $ctrl.$stateParams.id}"
    limit="20"
    data="recoveries"
    order="started DESC"
    auto-load="true">
</vn-crud-model>
<vn-data-viewer
    model="model"
    class="vn-w-md">
    <vn-card>
    <vn-table model="model">
        <vn-thead>
            <vn-tr>
                <vn-th></vn-th>
                <vn-th field="started">Since</vn-th>
                <vn-th field="finished">To</vn-th>
                <vn-th field="amount" number>Amount</vn-th>
                <vn-th field="period" number>Period</vn-th>
            </vn-tr>
        </vn-thead>
        <vn-tbody>
            <vn-tr ng-repeat="recovery in recoveries">
                <vn-td>
                    <vn-icon-button
                        icon="lock" 
                        vn-acl="administrative"
                        vn-acl-action="remove"
                        vn-tooltip="Finish that recovery period"                        
                        ng-if="!recovery.finished"
                        ng-click="$ctrl.setFinished(recovery)">
                    </vn-icon-button>
                </vn-td>
                <vn-td>{{::recovery.started | date:'dd/MM/yyyy' }}</vn-td>
                <vn-td>{{recovery.finished | date:'dd/MM/yyyy' }}</vn-td>
                <vn-td number>{{::recovery.amount | currency: 'EUR': 0}}</vn-td>
                <vn-td number>{{::recovery.period}}</vn-td>
            </vn-tr>
        </vn-tbody>
    </vn-table>
    </vn-card>
</vn-data-viewer>
<vn-float-button
    icon="add"
    fixed-bottom-right
    vn-tooltip="New recovery"
    vn-bind="+" 
    vn-acl="administrative"
    vn-acl-action="remove"
    ui-sref="client.card.recovery.create">
</vn-float-button>