@include('layouts/header')
<style>
    img,
svg {
    vertical-align: middle !important;
    width: 40px !important;
    height: 40px !important;
}
</style>
<div class="container">
    <div class="content">
        <div class="row">
            <div class="card p-3">
                <div class="col-sm-12">
                    <div class="filter-form">
                        <form method="get">
                            <div class="row">
                                <div class="col-md-8">
                                    <input type="text" class="form-control" placeholder="Search Your Name" name="search" id="search" value="{{ $search ?? ''}}">

                                </div>
                                <div class="col-md-2">
                                    <button type="submit" class="btn btn-primary" id="btnsearch" name="submit" width="80px">Search</button>
                                </div>
                                <div class="col-md-2">
                                    <a href="{{('product-list')}}" class="btn btn-secondary btn-block">Reset</a>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>

            <div class="card mt-2">
                <div class="row">
                    <div class="col-sm-12 p-4">
                        <form action="" method="POST">
                            <div class="card-box project-box pt-2">
                                <div class="row align-items-center">
                                    <div class="col-sm-5 col-md-5">
                                        <h5 class="total-data-count">Total Country (s): <strong class="text-primary">{{ $products->total() }}</strong></h5>
                                    </div>
                                    <div class="col-sm-7 col-md-7 text-end">
                                        <a class="btn btn-outline-primary" type="button" href="{{url('/product')}}"><span class="fas fa-plus" data-fa-transform="shrink-3 down-2"></span><span class="ms-1">Add Product</span></a>
                                    </div>
                                </div>

                                <div class="table-responsive mb-0 mt-2">
                                    <table class="table table-bordered fs--1">
                                        <thead>
                                            <tr>
                                                <th class="sl-no">S. No.</th>
                                                <th>Name </th>
                                                <th>Father Name </th>
                                                <th>Mobile Number </th>
                                                <th>Email </th>
                                                <th>Image </th>
                                                <th class="action">Action</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @foreach ($products as $product)
                                            <tr>
                                                <td>{{ $loop->index+1}}</td>
                                                <td>{{ $product->name }}</td>
                                                <td>{{ $product->father_name }}</td>
                                                <td>{{ $product->mobile_number }}</td>
                                                <td>{{ $product->email }}</td>
                                                <td>
                                                    <img src="images/{{ $product->image }}" class="rounded-circle" width="50" height="50">
                                                </td>
                                                <td>
                                                    <a href="product-view/{{ $product->id }}" class="text-black"><i class="fa fa-eye" aria-hidden="true"></i></a>

                                                    <a href="product-edit/{{ $product->id }}" class="text-black"><i class="fa fa-edit" aria-hidden="true"></i></a>

                                                    <a href="product-delete/{{ $product->id }}" class="text-black"><i class="fas fa-trash-alt" aria-hidden="true"></i></a>

                                                </td>

                                            </tr>
                                            @endforeach
                                        </tbody>
                                    </table>
                                </div>
                                <div class="d-flex d-title-box-block align-items-center justify-content-between footer-paging">
                                    <div class="">
                                        <!-- <a class="btn btn-primary btn-sm waves-effect width-md waves-light" href="{{('users-export') }}">
                                            <i class="fa fa-file-csv"></i> Export To CSV
                                        </a> -->
                                    </div>

                                    <div class="d-flex align-items-center justify-content-between" id="pagination">
                                        <div class="float-end">
                                            {{ $products->links() }}
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@include('layouts/footer')