@extends("template.layouts.simple.master")
@section('content')
    <div class="page-body">
        @include("master.notification")
        <div class="container-fluid">
            <div class="row">
                <div class="col-sm-12">
                    <form action="{{route("assign-interviewer-remarks-to-mrf")}}" method="post">
                        @csrf
                        <div class="card">
                            <div class="card-header ">
                                <div class="row">
                                    <div class="col-sm-12">
                                        <label for="" class="form-label">Positions</label>
                                        <select name="positions[]" id="positions" class="form-select" multiple>
                                            <option value="">Select..</option>
                                            @foreach($positions as $p)
                                                <option value="{{$p->id}}">{{$p->getJobName->name}} ({{$p->mrf_no}})
                                                </option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="col-sm-12 mt-4">
                                        <button class="btn btn-success">Assign Questions</button>
                                        <a class="btn btn-primary float-end"
                                           href="{{route("interviewer-remark-create")}}">
                                            Create New
                                        </a>
                                    </div>
                                </div>
                            </div>
                            <div class="card-body">
                                <table class="table table-bordered">
                                    <thead>
                                    <tr>
                                        <th>Sno</th>
                                        <th> Name</th>
                                        <th> Rating</th>
                                        <th>Description</th>
                                        <th>Active / In-Active</th>
                                        <th>Position Wise Questions</th>
                                        <th>Common Questions</th>
                                        <th>Action</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    @foreach($details as $s)
                                        <tr>
                                            <td>{{$loop->iteration}}.</td>
                                            <td>{{$s->remark_nam}}</td>
                                            <td>{{$s->rating}}</td>
                                            <td>{{$s->description}}</td>
                                            <td>@if($s->status == 1)
                                                    <div class="fw-bold text-success">Active</div>
                                                @else
                                                    <div class="fw-bold text-danger">In-Active</div>
                                                @endif</td>
                                            <td class="text-center">
                                                <div>
                                                    <label for="" class="form-label">Position Wise Question </label>
                                                </div>
                                                <div>
                                                    <input type="checkbox" data-position_remarks="{{$s->id}}" value="{{$s->id}}" name="position_remarks[]"
                                                           class="remarks" style="width: 25px">
                                                </div>
                                            </td>
                                            <td class="text-center">
                                                <div>
                                                    <label for="" class="form-label">Common Question </label>
                                                </div>
                                                <div>
                                                    <input type="checkbox" value="{{$s->id}}"
                                                           class="remarks common_remarks"
                                                           data-common_remarks="{{$s->id}}"
                                                           name="common_remarks[]" @if($s->common_status == 1) checked
                                                           @endif style="width: 25px">
                                                </div>
                                            </td>
                                            <td>
                                                <a href="{{route('interviewer-remark-edit' , ["id"=>$s->id])}}"> <i
                                                        class="fa fa-edit fs-4"></i>
                                                </a>
                                                <i class=" fs-4 fa fa-trash delete_btn d-none" data-id="{{$s->id}}"></i>
                                            </td>
                                        </tr>
                                    @endforeach
                                    </tbody>
                                </table>
                            </div>

                        </div>

                    </form>
                </div>
            </div>
        </div>
    </div>
@endsection
{{--@include("")--}}
@section("scripts")
    @include("master.notification_show_hide")
    <script>
        $(document).ready(function () {

            $("#positions").select2({
                width: "100%",
                dropdownParent: $("#positions").parent("div"),
                placeholder: "Select..",
            }).change(function () {
                let mrf_ids = $(this).val();
                $.ajax({
                    url: "{{route('get-assign-interviewer-remarks-to-mrf')}}",
                    type: "POST",
                    data: {
                        "_token": "{{ csrf_token() }}", // Add the CSRF token to the data
                        "mrf_ids": mrf_ids
                    },
                    success: function (data) {
                        console.log(data);
                        if (data.response != 0) {
                            $(".remarks").prop("checked", false);
                            data.response.forEach((element) => {
                                if (element.hasOwnProperty("get_interviewer_remarks")) {
                                    $(`[data-position_remarks='${element.get_interviewer_remarks.id}']`).prop("checked", true);
                                }else{
                                    $(`[data-common_remarks='${element.id}']`).prop("checked", true);

                                }
                            })

                        } else {
                            Swal.fire({
                                icon: 'error',
                                title: 'Oops...',
                                text: 'Something went wrong!',
                            })
                        }
                    }
                })
            })


            $(".common_remarks").change(function () {
                if (!$(this).prop('checked')) {
                    let id = $(this).val();
                    console.log(id)
                    $.ajax({
                        url: "{{route('update-common-interviewer-remarks')}}",
                        type: "POST",
                        data: {
                            "_token": "{{ csrf_token() }}", // Add the CSRF token to the data
                            "id": id
                        },
                        success: function (data) {
                            console.log(data);
                            if (data.response == 1) {
                                Swal.fire(
                                    'Updated!',
                                    'Update Successfully.',
                                    'success'
                                )

                            } else {
                                Swal.fire({
                                    icon: 'error',
                                    title: 'Oops...',
                                    text: 'Something went wrong!',
                                })
                            }
                        }
                    })
                }
            })

            $(".delete_btn").click(function (e) {
                e.preventDefault();
                const id = $(this).data("id");

                Swal.fire({
                    title: 'Are you sure?',
                    text: "You won't be able to revert this!",
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: 'Yes, delete it!'
                }).then((result) => {
                    if (result.isConfirmed) {
                        $.ajax({
                            url: "{{route('interviewer-remark-destroy')}}",
                            type: "POST",
                            data: {
                                "_token": "{{ csrf_token() }}", // Add the CSRF token to the data
                                "id": id
                            },
                            success: function (data) {
                                console.log(data);
                                if (data.response == 1) {
                                    Swal.fire(
                                        'Deleted!',
                                        'Your file has been deleted.',
                                        'success'
                                    )
                                    location.reload();
                                } else {
                                    Swal.fire({
                                        icon: 'error',
                                        title: 'Oops...',
                                        text: 'Something went wrong!',
                                    })
                                }
                            }
                        })

                    }
                })

            })
        })
    </script>

@endsection