@extends('admin.layouts.app')

@section('content')
 <!-- Begin page -->
        <div id="layout-wrapper">
            <!-- ============================================================== -->
            <!-- Start right Content here -->
            <!-- ============================================================== -->
            <div class="main-content">

                <div class="page-content">
                    <div class="container-fluid">

                        <!-- start page title -->
                        <div class="page-title-box">
                            <div class="row align-items-center">
                                <div class="col-md-8">
                                    <h6 class="page-title">Sub City</h6>
                                    <ol class="breadcrumb m-0">
                                        <li class="breadcrumb-item active" aria-current="page">Sub City</li>
                                    </ol>
                                </div>
                                
                                <div class="col-md-4">
                                    <div class="float-end d-none d-md-block">
                                        <div class="dropdown">
                                            <a class="btn btn-primary" type="button" href="{{route('subcity-add')}}">Add Sub City</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <!-- end page title -->



                        <div class="row">
                            <div class="col-12">
                                <div class="card">
                                    <div class="card-body">

                                        <table id="datatable" class="table table-bordered dt-responsive nowrap" style="border-collapse: collapse; border-spacing: 0; width: 100%;">

                                            <thead>
                                            <tr>
                                                <th>#</th>
                                                <th>City</th>
                                                <th>Sub City</th>
                                                <th>Created At</th>
                                                <th>Action</th>
                                            </tr>
                                            </thead>

                                            <tbody>
                                            @php $i = 1; @endphp
                                            @foreach($subcity as $key => $value)
                                            <tr>
                                                <td>{{$i}}</td>
                                                <td>{{$value->city}}</td>
                                                <td>{{$value->subcity}}</td>
                                                <td>{{$value->created_at}}</td>
                                                <td>
                                                    <a type="button" class="btn btn-primary waves-effect waves-light" href="{{route('subcity-edit', ['id' => $value->id])}}">Edit</a>
                                                    <a type="button" class="btn btn-danger waves-effect waves-light" href="{{route('subcity-delete', ['id' => $value->id])}}">Delete</a>
                                                </td>
                                            </tr>
                                            @php $i++; @endphp
                                            @endforeach
                                            </tbody>
                                        </table>

                                    </div>
                                </div>
                            </div> <!-- end col -->
                        </div> <!-- end row -->

                    </div> <!-- container-fluid -->
                </div>
                <!-- End Page-content -->


            </div>
            <!-- end main content-->
        </div>
        <!-- END layout-wrapper -->
@endsection
@section('script')
    <script src="{{asset('public/admin/assets/js/pages/datatables.init.js')}}"></script>
    <script src="{{asset('public/admin/assets/libs/datatables.net/js/jquery.dataTables.min.js')}}"></script>
    <script src="{{asset('public/admin/assets/libs/datatables.net-bs4/js/dataTables.bootstrap4.min.js')}}"></script>
@endsection