@extends('hr_main')
@section('title', '| ' . $data['pageTitle'])

@section('content')
    <div class="row">
        <div class="col-md-12">
            <div class="" style="width:80%; margin:0 auto;">
                <div class="">
                    <div class="panel panel-default" style="background-color:#708090;">
                        <div class="panel-heading" style="padding-bottom:0px">
                            <div class="panel-title">
                                {!! $data['pageTitle'] !!}
                            </div>


                            <div class="panel-options">
                                <a href="{!! $data['addBtnUrl'] !!}" class="btn btn-info pull-right addViewBtn"><i
                                        class="glyphicon glyphicon-plus-sign addIcon"></i>{{ $data['addBtnLabel'] }}</a>
                            </div>


                        </div>
                        <div class="panel-body panelBodyView">
                            <table class="table table-striped table-bordered table-condensed first-col-dark"
                                style="width:100%" id="data-table">
                                <thead>
                                    <tr>
                                        <th width="30">SL#</th>

                                        <th>Effective Date</th>
                                        <th>No of Bosses</th>
                                        <th style="width: 80px">Action</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach ($configContent as $index => $entry)
                                        <tr>
                                            <td>{{ $index + 1 }}</td> <!-- SL# -->

                                            <td>{{ $entry['effectiveDate'] }}</td>
                                            <td>{{ $entry['noOfBosses'] }}</td>
                                            <td class="text-center" width="80">

                                                {{-- <a id="editIcone" taskId=""
                                                    class="edit-modal"
                                                    style="cursor: pointer; padding-right: 5px;">
                                                    <span class="glyphicon glyphicon-edit"></span>
                                                </a> --}}

                                                <a href="javascript:;" class="delete-modal"
                                                    entryId="{{ $entry['effectiveDate'] }}" style="cursor: pointer;">
                                                    <span class="glyphicon glyphicon-trash"></span>
                                                </a>




                                            </td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
            <div id="deleteModal" class="modal fade" style="margin-top:3%;">
                <div class="modal-dialog modal-lg">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h4 class="modal-title"
                                style="clear:both;background-color:black;color:white; padding:10px;text-align:center;">
                                Delete Assesment No Of Bosses</h4>
                        </div>
                        <div class="modal-body ">
                            {{-- <div class="row" style="padding-bottom:20px;"> </div> --}}
                            <h2 style="color: red;">Are You Confirm to Delete This Record?</h2>
                            <div class="modal-footer">
                                <input id="DMentryId" type="hidden" value="" />
                                <button type="button" class="btn btn-danger" id="DMentry"
                                    data-dismiss="modal">confirm</button>
                                <button type="button" class="btn btn-warning" data-dismiss="modal"><span
                                        class="glyphicon glyphicon-remove" style="padding-right:4px;"></span>Close</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        @endsection


        <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

        <script type="text/javascript">
            $(document).ready(function() {
                $(document).on('click', '.delete-modal', function() {
                    let entryId = $(this).attr('entryId');
                    $("#DMentryId").val(entryId);
                    $('#deleteModal').modal('show');
                });

                $("#DMentry").on('click', function() {
                    var entryId = $("#DMentryId").val();

                    var csrf = "{{ csrf_token() }}";
                    $.ajax({
                            url: '{{ url('hr/assessment/assessmentNoOfBosses/deleteAssessmentNoOfBosses') }}',
                            type: 'POST',
                            dataType: 'json',
                            data: {
                                id: entryId,
                                _token: csrf
                            },
                        })
                        .done(function(data) {
                            if (data.success) {
                                setTimeout(function() {
                                    window.location.reload();
                                }, 1500);
                            } else {
                                alert(data.message || 'Delete failed.');
                            }
                        })
                        .fail(function() {
                            console.log("error");
                        });
                });
            });
        </script>