@extends('admin.layout.index')
@push('css-head')
@endpush
@section('content')
<!-- Page header -->
<div class="page-header page-header-light">
    <div class="breadcrumb-line breadcrumb-line-light header-elements-md-inline">
        <div class="d-flex">
            <div class="breadcrumb">
                <a href="{{url('/admin')}}" class="breadcrumb-item"><i class="icon-home2 mr-2"></i> Dashboard</a>
                <span class="breadcrumb-item active">Destinations</span>
            </div>
        </div>
    </div>
</div>
<!-- /page header -->

<!-- Content area -->
<div class="content">
    <div class="card">
        <table class="table datatable-basic">
            <thead>
                <tr>
                    <th style="width: 5%;">#</th>
                    <th>Name</th>
                </tr>
            </thead>
            <tbody>
                @foreach($destinations as $key => $row)
                <tr>
                    <td>{{ ++$key }}</td>
                    <td>{{ $row->name }}</td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
</div>
<!-- /content area -->
@endsection

@push('scripts')
    <script src="{{ asset('/assets/global/js/plugins/notifications/sweet_alert.min.js') }}"></script>
    <script src="{{ asset('/assets/global/js/plugins/tables/datatables/datatables.min.js') }}"></script>
    <script src="{{ asset('/assets/global/js/demo_pages/datatables_basic.js') }}"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $('[data-toggle="tooltip"]').tooltip();
        });
    </script>
@endpush