@extends('backend.layouts.app')

@section('content')
    <div class="row page-titles">
        <div class="col-md-5 align-self-center">
            <h4 class="text-themecolor"> Employer Reviews</h4>
        </div>
        <div class="col-md-7 align-self-center text-right">
            <div class="d-flex justify-content-end align-items-center">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="{{ route('dashboard') }}">Dashboard</a></li>
                    <li class="breadcrumb-item active">Employer Reviews</li>
                </ol>
            </div>
        </div>
    </div>
    <div class="container-fluid">
        {{-- Status model --}}
        <div id="statusModal" class="modal fade" role='dialog'>
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-body">
                        <p>Are you sure you want to change the status?</p>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                        <span id='changestatus'></span>
                    </div>
                </div>
            </div>
        </div>
        {{-- end --}}


        <div class="content-wrapper">
            @if (session('status'))
                <div class="alert alert-success alert-dismissible fade show" role="alert"><i
                        class="far fa-check-circle"></i>
                    {{ session('status') }}
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
            @endif
            @if (session('error'))
                <div class="alert alert-danger alert-dismissible fade show" role="alert"><i
                        class="far fa-check-circle"></i>
                    {{ session('error') }}
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
            @endif



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

                                <br>
                                <div class="table-responsive">
                                    <table id="user" class="table table-bordered table-hover">
                                        <thead>
                                            <th>S. No.</th>
                                            <th>@sortablelink('first_name', 'Job')</th>
                                            <th>@sortablelink('last_name', 'Reviewer')</th>
                                            <th>@sortablelink('rating', 'rating')</th>
                                            <th>@sortablelink('reviews', 'reviews')</th>
                                            <th>@sortablelink('created_at', 'Created At')</th>
                                            <th>@sortablelink('status', 'Status')</th>



                                        </thead>
                                        <tbody>
                                            @if (count($reviews) > 0)
                                                @php
                                                    $i = $reviews->perPage() * ($reviews->currentPage() - 1);
                                                @endphp
                                                @foreach ($reviews as $user)
                                                    <tr>
                                                        <td>{{ ++$i }}</td>
                                                        <td>{{ \Illuminate\Support\Str::limit($user->job->title ?: '-', 10) }}
                                                        </td>
                                                        <td><a
                                                                title="{{ $user->reviewer }}">{{ \Illuminate\Support\Str::limit($user->reviewer->full_name ?: '-', 10) }}</a>
                                                        </td>
                                                        <td>
                                                            <div class="rating-stars" style="display: flex; gap: 5px;">
                                                                @for ($i = 1; $i <= 5; $i++)
                                                                    @if ($i <= $user->rating)
                                                                        <!-- Orange Star -->
                                                                        <i class="fas fa-star" style="color: #ffc107;"></i>
                                                                    @else
                                                                        <!-- Grey Star -->
                                                                        <i class="fas fa-star" style="color: #e4e5e9;"></i>
                                                                    @endif
                                                                @endfor
                                                            </div>
                                                        </td>




                                                        <td>{{ $user->reviews }}</td>
                                                        <td>{{ \Carbon\Carbon::parse($user->created_at)->format(config('GET.admin_date_time_format')) }}
                                                        </td>

                                                        <!-- <td>{{ $user->updated_at->format(config('app.time') ?? 'Y-m-d ') }}</td> -->
                                                        <td onclick="myFunction({{ $user->id }},{{$employer->id}});">
                                                            @if ($user->status == 1)
                                                                <button
                                                                    class="btn btn-success btn-sm"><span>Active</span></button>
                                                            @else
                                                                <button
                                                                    class="btn btn-danger btn-sm"><span>Inactive</span></button>
                                                            @endif
                                                        </td>
                                                        <!-- Add other columns as needed -->
                                                    </tr>
                                                @endforeach
                                            @else
                                                <tr>
                                                    <td colspan="12">
                                                        <h6>
                                                            <center>No Records Found</center>
                                                        </h6>
                                                    </td>
                                                </tr>
                                            @endif
                                        </tbody>
                                    </table>
                                </div>

                                @if ($reviews->total() > 0)
                                    <div class="d-flex justify-content-between align-items-center">
                                        <!-- Display custom number of entries -->
                                        <div class="entries-info">
                                            Showing {{ $reviews->firstItem() }} to {{ $reviews->lastItem() }} of
                                            {{ $reviews->total() }} entries
                                        </div>

                                        <!-- Pagination -->
                                        <div class="pagination-wrapper float-right">
                                            {{ $reviews->links('vendor.pagination.bootstrap-4') }}
                                        </div>
                                    </div>
                                @endif

                            </div>

                        </div>
                    </div>
                </div>
            </section>
        </div>
    </div>

    <script type="text/javascript">
        function confirmDeleteModal(id) {
            $('#deleteModal').modal();
            $('#deleteButton').html(
                '<a id="delete-button" class="btn btn-danger" style="color:white;" onclick="deleteData(' + id +
                ')">Delete</a>');
        }

        function deleteData(id) {
            $('#delete-button').addClass('disabled');
            $('#delete-button').css('pointer-events', 'none'); // Disable click events
            $('#delete-button').css('opacity', '0.6'); // Make it look disabled
            location.replace("{{ route('employer.delete') }}?id=" + id);
        }

        function myFunction(id, employerId) {
    $('#statusModal').modal(); // Open the modal
    $('#changestatus').html(
        `<a class="btn btn-danger" style="color:white;" onclick="changedataData(${id}, ${employerId})">Ok</a>`
    );
}

function changedataData(reviewId, employerId) {
    $('#statusModal').modal('hide'); // Close the modal

    // Construct the URL with distinct parameters
    const url = `{{ route('employer.reviews.status', ['employerId' => '__employerId__', 'reviewId' => '__reviewId__']) }}`
        .replace('__reviewId__', reviewId)
        .replace('__employerId__', employerId);

    location.replace(url); // Redirect to the constructed URL
}




        function showPasswordModal(id) {
            $('#user_id').val(id);
            $('#passwordModal').modal('show');
        }


        // $(document).ready(function() {
        //     $('#passwordForm').on('submit', function(e) {
        //         e.preventDefault();
        //         const form = $(this);
        //         $.ajax({
        //             url: form.attr('action'),
        //             type: 'POST',
        //             data: form.serialize(),
        //             success: function(response) {
        //                 if(response.success) {
        //                     alert('Password updated successfully');
        //                     $('#passwordModal').modal('hide');
        //                 } else {
        //                     alert('Error updating password');
        //                 }
        //             },
        //             error: function() {
        //                 alert('Error processing request');
        //             }
        //         });
        //     });
        // });
        document.addEventListener('DOMContentLoaded', function() {

            $(document).ready(function() {
                $.validator.addMethod("regex", function(value, element, regexp) {
                    var re = new RegExp(regexp);
                    return this.optional(element) || re.test(value);
                }, "Please enter a valid email address.");

                $.validator.addMethod("strongPassword", function(value, element) {
                        return /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]+$/.test(
                            value);
                    },
                    "Password must be at least 8 characters long and include one uppercase letter, one lowercase letter, one number, and one special character."
                    );

                $.validator.addMethod("noOnlySpaces", function(value, element) {
                    return $.trim(value).length !== 0;
                }, "Please enter a value other than spaces.");
                $('#passwordForm').validate({
                    rules: {
                        new_password: {
                            required: true,
                            minlength: 8,
                            noOnlySpaces: true,
                            strongPassword: true
                        },
                        new_password_confirmation: {
                            required: true,
                            equalTo: "#new_password",
                            noOnlySpaces: true
                        }
                    },
                    messages: {
                        new_password: {
                            required: "Please enter a new password",
                            minlength: "Password must be at least 6 characters long"
                        },
                        new_password_confirmation: {
                            required: "Please confirm your new password",
                            equalTo: "Passwords do not match"
                        }
                    },
                    highlight: function(element) {
                        $(element).addClass('is-invalid').removeClass('is-valid');
                    },
                    unhighlight: function(element) {
                        $(element).removeClass('is-invalid');
                        // .addClass('is-valid');
                    },
                    submitHandler: function(form) {
                        // Disable the submit button to prevent multiple submissions
                        $(form).find('button[type="submit"]').attr("disabled", true);

                        // Submit the form
                        form.submit();
                    }
                });
            });
        });
    </script>
@stop
