@include('admin.layouts.header')
<div class="container-fluid pt-4 px-4">
    @if ($message = Session::get('success'))
        <div class="alert alert-success alert-dismissible fade show" role="alert">
            <i class="fa fa-exclamation-circle me-2"></i> {{ $message }}
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
    @endif
    @if ($message = Session::get('error'))
        <div class="alert alert-danger alert-dismissible fade show" role="alert">
            <i class="fa fa-exclamation-circle me-2"></i>{{ $message }}
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
    @endif


    <div class="row g-4">
        <div class="col-sm-12 col-xl-6">
            <div class="bg-light rounded h-100 p-4">
                <h6 class="mb-4">Add New Client</h6>
                <form action="{{ route('save.client.list') }}" method="post" enctype="multipart/form-data">
                    @csrf
                    <div class="mb-3">
                        <label for="client_type" class="form-label">Client Type <span class="text-danger">*
                            </span>
                        </label>
                        <select required class="form-select" name="client_type" aria-label="Default select example">
                            <option value="">Select place</option>
                            <option value="Insurance">Insurance</option>
                            <option value="Hospitals">Hospitals</option>
                            <option value="Education">Education</option>
                            <option value="Garments">Garments</option>
                            <option value="Real Estate">Real Estate</option>
                            <option value="Government">Government</option>
                             <option value="Trading">Trading company</option>


                        </select>

                        @if ($errors->has('client_type'))
                            <span class="text-danger">{{ $errors->first('client_type') }}</span>
                        @endif
                    </div>
                    <div class="mb-3">
                        <label for="client" class="form-label">Client <span class="text-danger">* </span>
                        </label>
                        <input type="text" name="clientName" class="form-control" id="client"
                            placeholder="Enter New Client" required>
                        @if ($errors->has('client'))
                            <span class="text-danger">{{ $errors->first('client') }}</span>
                        @endif
                    </div>


                    <div class="mb-3">
                        <label for="client" class="form-label">Client <span class="text-danger">* </span>
                        </label>
                        <input type="file" name="image" class="form-control" id="client"
                            placeholder="Enter New Client" required>
                        @if ($errors->has('client'))
                            <span class="text-danger">{{ $errors->first('client') }}</span>
                        @endif
                    </div>

                    <!--<input name="slug" value="null" hidden>-->
                    
                      <div class="mb-3">
                        <label for="client" class="form-label">Link <span class="text-danger">* </span>
                        </label>
                        <input type="text" name="slug" class="form-control" id="client"
                            placeholder="Link" >
                        @if ($errors->has('client'))
                            <span class="text-danger">{{ $errors->first('client') }}</span>
                        @endif
                    </div>


                    <button type="submit" class="btn btn-primary">Submit</button>
                </form>
            </div>
        </div>

    </div>
</div>
<div class="container-fluid pt-4 px-4">
    <div class="row g-4">
        <div class="col-12">
            <div class=" bg-light text-center rounded p-4">
                <div class="row g-3 mb-3">
                    <div class="col-sm-6 col-md-3 d-flex align-items-center mb-0">
                        <h6 class="text-start">Clients List</h6>
                    </div>
                </div>
                <style>
                    th {
                        white-space: nowrap
                    }
                </style>
                <div class="table-responsive">
                    <table class="table text-start align-middle table-bordered table-hover mb-0">
                        <thead>
                            <tr class="text-dark">
                                <th scope="col">Client Type</th>
                                <th scope="col">Client</th>
                                <th scope="col">Link</th>
                                <th scope="col">Image</th>
                                <th scope="col">Update</th>
                                <th scope="col">Delete</th>

                            </tr>
                        </thead>
                        <tbody>
                            @foreach ($clients as $client)
                                <tr>
                                    <td>{{ $client->client_type }}</a></td>
                                    <td>{{ $client->clientName }}</td>
                                     <td>{{ $client->slug }}</td>
                                    <td>
                                        <img loading="lazy" style="width: 5rem;"
                                            src="{{ url(env('EXT') . 'project/public/uploads/client/' . $client->image) }}"
                                            alt="" srcset="">
                                    </td>

                                    <td>
                                        <a class="btn btn-info" href="{{ route('Edit.client', $client->id) }}"> Update
                                        </a>
                                    </td>
                                    <td>
                                        <form action="{{ route('client.delete', $client->id) }}" method="POST">
                                            @csrf
                                            @method('DELETE')
                                            <button type="submit" class="btn btn-danger">Delete</button>
                                        </form>
                                    </td>

                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        </div>


        <script>
            function getClientId(id) {
                document.querySelector('#clientId').value = id;
            }

            function updateClient(id) {
                $.ajax({
                    type: 'GET',
                    url: '' + '/admin/get-single-client/' + id,
                    dataType: 'json',
                    success: function(data) {
                        let options = document.querySelector('#update_client_type').options;
                        for (let option of options) {
                            if (option.value == data.client_type) {
                                option.setAttribute('selected', true);
                            }
                        }
                        document.querySelector('#update_client').value = data.client;
                        document.querySelector('#getClientId').value = data.id;
                    }
                });

            }
        </script>
    </div>

</div>


@include('admin.layouts.footer')