@extends('lay.dnekcab.retsam')

@section('title')
  {{ $page_title }}
@endsection

@section('page-content')
<div class="page-content">
    <div class="container-fluid">
        <!-- Info boxes -->
        <div class="row">
            <div class="col-lg-12 col-md-12 col-sm-12">
                <div class="card">
                    <div class="card-body list-heading">
                        <x-card-header 
                            scenario="1" 
                            :pageTitle="$page_title" 
                        />

                        <div class="mt-3">
                            {{-- Search --}}
                            <x-search-filter 
                                :rows="1" 
                                :inputs-per-row="3" 
                                :col-md-classes="[
                                    ['col-md-8', 'col-md-2', 'col-md-2']
                                ]" 
                                :input-config="[
                                    [
                                        ['type' => 'text'], 
                                        ['type' => 'select', 'options' => [
                                                '' => __('global.all'),
                                                'present' => __('attendance.present'),
                                                'absent' => __('attendance.absent'),
                                            ]],
                                        ['type' => 'select', 'options' => $paginationArray],
                                    ]
                                ]"
                                :names="[
                                    [
                                    'term_searh_name',
                                    'term_status_name',
                                    'pagination_searh_name'
                                    ]
                                ]"
                                :ids="[
                                    [
                                    'term_searh_id',
                                    'term_status_id',
                                    'pagination_searh_id'
                                    ]
                                ]"
                                :placeholders="[
                                    [
                                    __('leave.start_date'),
                                    __('attendance.status'),
                                    key($paginationArray) ? key($paginationArray) : __('global.pagination')
                                    ]
                                ]"
                                form-action="{{ route('get_employee_attendances') }}"
                                {{-- report-type="both"  --}}
                                :lang="$lang"
                            />
                                            
                            <!-- end Search -->
                        </div>
                    </div>
                    <!-- /.card-header -->
                    <div class="card-body remove-extra-space" id="panigationResultID">
                        @include('dnekcab.nimda.attendance.employeeAttendanceList')
                    </div>
                    <!-- /.card-body -->
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@section('js')
    <script>

        $(document).ready(function(){
            $(document).on('click', '.printAttendance', function(e) {
                e.preventDefault();
                var date = $(this).attr('data-date');
                var status = $('#term_status_id').val();

                $.ajax({
                    url: "{{ route('printAttendance') }}",
                    type: "POST",
                    data: { date: date, status:status },
                    headers: { "X-CSRF-TOKEN": "{{ csrf_token() }}" },
                    dataType: "json"
                }).done(function(response) {
                    if (response.success) {
                        var a = document.createElement('a');
                        a.href = response.url;
                        a.download = response.fileName;
                        document.body.appendChild(a);
                        a.click();
                        document.body.removeChild(a);
                    } else {
                        toastr.error(response.message);
                    }
                });
            });

            // Delete Event
            $(document).on("click", ".deleteButton", function() {
                // Store the row element and the record ID (or any other relevant data)
                var $row = $(this).closest("tr");
                var date = $(this).attr('data-date');
                var originalRoute = $(this).attr('data-url');
                
                var newRoute = originalRoute.replace(/_route/g, '').replace(/s/g, '');
                // Construct the URL using the new route
                var urllink = '/hr/attendance/' + newRoute;
                
                // Show the confirmation modal
                $("#confirmModal").modal("show");

                // Add a click event listener to the "Confirm" button
                $("#confirmButton").off("click").on("click", function() {
                    // Perform AJAX request to delete the record
                    $.ajax({
                        url: urllink,
                        type: "POST",
                        data: { date: date },
                        headers: {
                            "X-CSRF-TOKEN": "{{ csrf_token() }}"  // Set the CSRF token in the request headers
                        },
                        success: function(response) {
                            if(response.status == 'success'){
                                $row.remove();// Remove the row from the table
                                $("#confirmModal").modal("hide"); // Hide the confirmation modal
                                toastr.options =
                                {
                                "closeButton" : true,
                                "progressBar" : true
                                }
                                toastr.success(response.message);
                                setTimeout(function() {
                                        window.location.href = '{{ route("get_employee_attendances") }}';
                                }, 2000); // 2 seconds in milliseconds (1000 milliseconds = 1 second
                            } else {
                                toastr.options =
                                {
                                "closeButton" : true,
                                "progressBar" : true
                                }
                                toastr.error(response.message);
                            }
                        },
                        error: function(error) {
                            toastr.options =
                            {
                            "closeButton" : true,
                            "progressBar" : true
                            }
                            toastr.error(error);
                            $("#confirmModal").modal("hide"); // Hide the confirmation modal
                        }
                    });
                });
            });

            $(document).on("click", ".editAttendance", function(e){
                e.preventDefault();
                let date = $(this).attr('data-date');
                $.ajax({
                    url: "{{ route('getSingleDayEmployeeTeacherAttendance') }}",
                    method: "GET",
                    data: {
                        date: date,
                    },
                    success: function(response) {
                        // Handle the success response
                        if(response != ''){
                            console.log(response);
                            $('#result').html(response);
                        } else {
                            // toastr.options =
                            // {
                            // "closeButton" : true,
                            // "progressBar" : true
                            // }
                            // toastr.error(response);
                        }
                    },
                    error: function(xhr, status, error) {
                        // Handle the error response
                        console.error('Form submission failed');
                        console.error(error);
                    }
                });
            
            });

            $(document).on("change", ".attendanceStatus", function(e){
                var employee_id = $(this).attr('data-employee-id');
                var status_id = $(this).attr('id');
                var jalaliCurrentMonth = "{{ $jalaliCurrentMonth }}";
                if ($(this).is(':checked')) {
                    $('#'+status_id).val('present-'+employee_id);
                    $('.attendanceStatusLabel'+employee_id).text('present');
                    $(this).attr('checked', 'checked');
                    if(jalaliCurrentMonth >=1 && jalaliCurrentMonth <=6){
                        $('#checkIn'+employee_id).attr('value', '08:00:05');
                        $('#checkOut'+employee_id).attr('value', '16:00:05');
                    } else {
                        $('#checkIn'+employee_id).attr('value', '08:30:05');
                        $('#checkOut'+employee_id).attr('value', '1530:00:05');
                    }
                } else {
                    $('#'+status_id).val('absent');
                    $('.attendanceStatusLabel'+employee_id).text('absesnt');
                    $(this).removeAttr('checked');
                    $('#checkIn'+employee_id).attr('value', '');
                    $('#checkOut'+employee_id).attr('value', '');
                }
            })

            $(document).on("submit", "#updateAttendance", function(e){
                e.preventDefault();
                $.ajax({
                    url: $(this).attr('action'),
                    type: "POST",
                    data: new FormData(this),
                    contentType: false,
                    cache: false,
                    processData: false,
                    headers: {
                        "X-CSRF-TOKEN": "{{ csrf_token() }}"  // Set the CSRF token in the request headers
                    },
                    success:function(result){
                        if(result.status == 'success'){
                            location.reload();
                        } else {
                            toastr.error(result.message);
                        }
                    },
                    error:function(result){
                        console.log(result, 'error');
                        var errors = result.responseJSON;
                    }
                });
                
            });

            $(document).on("blur", "#date_filter", function(e){

                let date = $('#date_filter').val();
                let pagination = $('#pagination').val();

                if(date !== ''){
                    $.ajax({
                        url: "{{ route('get_employee_attendances') }}",
                        method: "GET",
                        data: {
                            date: date,
                            pagination: pagination
                        },
                        headers: {
                            "X-CSRF-TOKEN": "{{ csrf_token() }}"  // Set the CSRF token in the request headers
                        },
                        success:function(result){
                            $('#panigationResultID').html(result);
                        },
                        error:function(result){
                            var errors = result.responseJSON;
                            $('#panigationResultID').html(errors);
                        }
                    });
                }

            });

            $(document).on("change", "#pagination", function(e){

                let date = $('#date_filter').val();
                let pagination = $('#pagination').val();

                if(date !== ''){
                    $.ajax({
                        url: "{{ route('get_employee_attendances') }}",
                        method: "GET",
                        data: {
                            date: date,
                            pagination: pagination
                        },
                        headers: {
                            "X-CSRF-TOKEN": "{{ csrf_token() }}"  // Set the CSRF token in the request headers
                        },
                        success:function(result){
                            $('#panigationResultID').html(result);
                        },
                        error:function(result){
                            var errors = result.responseJSON;
                            $('#panigationResultID').html(errors);
                        }
                    });
                }

            });

            $(document).on("submit", "#search-filter", function(e){
                e.preventDefault();
                $.ajax({
                    url: $(this).attr('action'),
                    type: "GET",
                    data: new FormData(this),
                    contentType: false,
                    cache: false,
                    processData: false,
                    headers: {
                        "X-CSRF-TOKEN": "{{ csrf_token() }}"  // Set the CSRF token in the request headers
                    },
                    success:function(result){
                        $('#panigationResultID').html(result);
                    },
                    error:function(result){
                        console.log(result, 'error');
                        var errors = result.responseJSON;
                    }
                });
                
            });

        });

    </script>
@endsection