<vn-dialog
    vn-id="dialog"
    class="modal-form"
    on-open="$ctrl.getPossibleStowaways()">
    <tpl-body>
        <vn-horizontal pad-medium class="header">
            <h5><span translate>Stowaways to add</span></h5>
        </vn-horizontal>
        <vn-horizontal pad-medium>
            <vn-table>
                <vn-thead>
                    <vn-tr>
                        <vn-th number>Ticket id</vn-th>
                        <vn-th number>Shipped</vn-th>
                        <vn-th number>Agency</vn-th>
                        <vn-th number>Warehouse</vn-th>
                        <vn-th number>State</vn-th>
                    </vn-tr>
                </vn-thead>
                <vn-tbody>
                    <vn-tr ng-repeat="ticket in $ctrl.possibleStowaways" class="clickable" ng-click="$ctrl.addStowaway($index)">
                        <vn-td number>{{ticket.id}}</vn-td>
                        <vn-td number>{{ticket.landed | dateTime: 'dd/MM/yyyy'}}</vn-td>
                        <vn-td number>{{ticket.agencyMode.name}}</vn-td>
                        <vn-td number>{{ticket.warehouse.name}}</vn-td>
                        <vn-td number>{{ticket.state.state.name}}</vn-td>
                    </vn-tr>
                </vn-tbody>
                <vn-empty-rows ng-if="$ctrl.possibleStowaways.length === 0" translate>
                    No results
                </vn-empty-rows>
            </vn-table>
        </vn-horizontal>
    </tpl-body>
</vn-dialog>