@extends('backend.app')
@section('title',' Holidays')
@section('content')
<h2 class="ms-2 mb-3 card-title">{{__('messages.holiday') ." ". __('messages.list')}}</h2>
{{-- <h2 class="ms-2 mb-3 card-title">Employee's Working Holiday List</h2> --}}
    <div class="card  mt-3 m-lg-2">
        <div class="card-body table_card  mt-2">
            @can('holiday.create')
                <div class="add-new-button-hidden">
                    <button class="btn add_new_btn" data-bs-toggle="modal" data-bs-target="#holiday_add_modal"
                            ><i class="plus-ico"></i> {{__('messages.add') ." ". __('messages.holiday')}}
                    </button>
                </div>
            @endcan
            <table id="myTable" class="table table-bordered dt-responsive nowrap w-100">
                <thead>
                <tr>
                    <th>{{__('messages.sl') }}</th>
                    <th>{{__('messages.holiday') }} {{__('messages.date_start') }}</th>
                    <th>{{__('messages.holiday') }} {{__('messages.date_end')}}</th>
                    <th>{{__('messages.holiday') }}</th>
                    <th>{{__('messages.description') }}-({{__('messages.holiday') }})</th>
                    <th>{{__('messages.status') }}</th>
                    <th style="width:25% !important">{{__('messages.action') }}</th>
                </tr>
                </thead>
                <tbody>
                @foreach ($holidays as $key=>$item)
                    <tr>
                        <td>{{++$key}}</td>
                        <td>{{date('d-M-Y', strtotime($item->adate))}}</td>
                        <td>{{date('d-M-Y', strtotime($item->adate2))}}</td>
                        <td style="width:100px !important">
                            <div>
                                {{$item->holidayss}}
                            </div>
                        </td>
                        <td>{{$item->atext}}</td>
                        <td>{{($item->approval_status > 1) ? 'Approved' : 'Draft'}}</td>
                        <td class="center">
                            @if ($item->approval_status < 2)
                                @can('holiday.edit')
                                    <a id="edit_btn" edit-id="{{ $item->hd_id }}" class="btn btn-sm btn-success" data-bs-toggle="modal"
                                    data-bs-target="#holiday_add_modal"><i class="edit-ico"></i> Edit</a>
                                @endcan

                                @can('holiday.approve')
                                    <a id="approve_btn" onclick="approvePost({{ $item->hd_id }})" class="btn btn-sm btn-warning">
                                        <i class="ok-ico"></i> Approve

                                        <form id="approve-form-{{ $item->hd_id }}"
                                            action="{{ route('holidays.approve', $item->hd_id) }}" method="POST" style="display: none;">
                                            @csrf
                                        </form>
                                    </a>
                                @endcan

                                @can('holiday.delete')
                                    <a href="#" class="btn btn-sm btn-danger" onclick="deletePost({{ $item->hd_id }})">
                                        <img src="{{ asset('assets/icons/svg/delete.svg') }}" alt="" /> Remove
                                        <form id="delete-form-{{ $item->hd_id }}"
                                            action="{{ route('holidays.destroy', $item->hd_id) }}" method="POST"
                                            style="display: none;">
                                            @csrf
                                            @method('DELETE')
                                        </form>
                                    </a>
                                @endcan
                            @endif
                        </td>
                    </tr>
                @endforeach
                </tbody>
            </table>
        </div>
    </div>

    {{--   holiday add modal--}}
    <div class="modal fade" id="holiday_add_modal" tabindex="-1" aria-labelledby="exampleModalLabel"
         aria-hidden="true">
        <div class="modal-dialog modal-lg modal-dialog-centered">
            <div class="modal-content p-5">
                <h4 class="card-title">{{__('messages.holiday') ." ". __('messages.information')}}</h4>
                <div class="modal-body p-0 mt-3">
                    <form action="{{ route('holidays.store') }}" method="POST" role="form" id="form1"
                          enctype="multipart/form-data">
                        @csrf
                        <div class="row">
                            <div class="col-md-6">
                                <input type="hidden" name="hd_id" id="hd_id">
                                <div class="form-group">
                                    <label class="form-label" for="session_id">Session<span class="text-danger">*</span></label>
                                    <select class="form-control @error('session_id') is-invalid @enderror" name="session_id" id="session_id" required>
                                        <option value="">Select Session</option>
                                        @foreach ($session_data as $item)
                                            <option value="{{$item->session_id}}">{{$item->session_name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="form-label" for="adate">{{ __('messages.holiday') }} {{ __('messages.date_start') }}<span class="text-danger">*</span></label>
                                    <input type="date" class="form-control" name="adate" placeholder="{{__('messages.enter')}}" id="adate"/>
                                </div>
                            </div>
                        </div>
                        <div class="row mt-3">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="form-label" for="atext">{{__('messages.holiday')}} {{__('messages.description')}}<span class="text-danger">*</span></label>
                                    <textarea type="text" class="form-control @error('atext') is-invalid @enderror"
                                           name="atext" placeholder="{{__('messages.enter') ." ". __('messages.holiday') ." ". __('messages.description')}}" required id="atext"/></textarea>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="form-label" for="adate2">{{ __('messages.holiday') }} {{ __('messages.date_end') }}<span class="text-danger">*</span></label>
                                    <input type="date" class="form-control" name="adate2" placeholder="{{__('messages.enter')}}" id="adate2"/>
                                </div>
                            </div>
                        </div>
                        <div class="mt-5 d-flex justify-content-end ">
                            <button type="button" class="btn btn-sm btn-danger me-2" data-bs-dismiss="modal"
                                    style="">{{ __('messages.close') }}
                            </button>
                            @can('holiday.create')
                                <button type="submit" class="btn btn-sm btn-primary" >
                                    {{ __('messages.save') }}
                                </button>
                            @endcan
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
@endsection
@push('scripts')
    <script type="text/javascript">


        function approvePost(id) {
            swal({
                title: 'Are you sure?',
                text: "You won't be able to revert this!",
                type: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#3085d6',
                cancelButtonColor: '#d33',
                confirmButtonText: 'Yes, approve it!',
                cancelButtonText: 'No, cancel!',
                confirmButtonClass: 'btn btn-warning ms-2',
                cancelButtonClass: 'btn btn-success',
                buttonsStyling: false,
                reverseButtons: true
            }).then((result) => {
                if (result.value) {
                    event.preventDefault();
                    document.getElementById('approve-form-' + id).submit();
                }
            })
        }
        $(document).ready(function ($) {
            $(document).on('click', '#edit_btn', function () {
                let id = $(this).attr('edit-id');
                $.ajax({
                    type: "GET",
                    url: "{{ url('system/holidays') }}/" + id + "/edit",
                    success: function (res) {
                        $('#session_id').val(res.session_id);
                        $('#adate').val(res.adate);
                        $('#adate2').val(res.adate2);
                        $('#atext').val(res.atext);
                        $('#hd_id').val(res.hd_id);
                    },
                    error: function (response) {
                        console.log(response);
                    }
                });
            });


            $('.add_new_btn').click(function () {
                // axios.get("{{ url('system/roles/create') }}").then(function (response) {
                //     $('.roleCreateModal').html(response.data);
                //     $('.modal-spinner').hide();
                //     $(".modal").on("hidden.bs.modal", function () {
                //         $(".roleCreateModal").html(` <div class="modal-spinner d-flex flex-column align-items-center">
                //             <div class="spinner-border text-secondary" role="status">
                //                 <span class="sr-only"></span>
                //             </div>
                //             <h5 class="mt-1">Loading...</h5>
                //         </div>`);
                //     });
                //     createPageJS();
                // }).catch(function (error) {
                //     console.log(error)
                // })
                document.getElementById("form1").reset();
            })
        });

        // $("#adate").datepicker({
        //     autoHide: true,
        //     endDate: "today",
        //     // format: 'dd-mm-yyyy',
        //     format: 'yyy-mm-dd',
        // });
        // $("#adate2").datepicker({
        //     autoHide: true,
        //     endDate: "today",
        //     // format: 'dd-mm-yyyy',
        //     format: 'yyy-mm-dd',
        // });
    </script>
@endpush
