@extends('layouts.app')

@section('content')
 
  <div class='admim-content-wrapper'>
    <div class='wrapper'>
      <div class='row '>

        
        <div class='main-bg white-bg label-inline-block clearfix margin-bottom-la'>
            
            <div class="menu-list">
              <div class="col-la-12">
                
                <div class="admin-content-header listing-page">
                  <div class="d-flex align-items-center justify-content-between">
                  <h1>Leaves Summary</h1>
                  <div class="form-panel float-right-sm float-right-es clearfix add_button_section">
                   
                    @foreach($menu_permit as $menu)
                    <?php if($menu->s_link  == 'leavessummary-exports/' ) { ?>
                    {{-- <form method="POST" action="{{ route('leavessummary.export') }}" style="display: inline-block;">
                      @csrf
                      <button type="submit" class="button button-la"><i class="fas fa-download"></i> Download</button>
                    </form> --}}
                    <a href="{{ route('leavessummary.index', array_merge(request()->all(), ['export' => 'excel'])) }}" class="button button-la"><i class="fas fa-download"></i> Download</a>
                    <?php } ?>
                    @endforeach

                  </div>
                  </div>
                </div>
                <div class="form-panel float-left-sm float-left-es clearfix add_button_section">
                 
        
                  
                  <form method="POST" action="{{ route('leavessummary.index') }}" class="form-inline" id="searchForm">
                    @csrf
                    <div class="row" style="margin-top: 15px;">
                      <div class="col-me-4">
                          <div class="form-panel">
                              <div class="col-sm-12 col-me-12">
                                  <label>Name</label>
                                  <input type="text" name="name" id="search_name" class="input-panel" value="{{ request('name') }}" placeholder="Search by Name">
                              </div>
                          </div>
                      </div>
                      <div class="col-me-4">
                        <div class="form-panel">
                            <div class="col-sm-12 col-me-12">
                                <label>Username(Mobile No.)</label>
                                <input type="text" name="phone" id="search_phone" class="input-panel" value="{{ request('phone') }}" placeholder="Search by Mobile No.">
                            </div>
                        </div>
                      </div>
                      <div class="col-me-4">
                        <div class="form-panel">
                            <div class="col-sm-12 col-me-12">
                                <label for="leave_type">Financial Year</label>
                                <select name="session_type" id="session_type" class="input-panel">
                                  <option value="" {{ old('session_type', $selectedSessionType) == '' ? 'selected' : '' }}>Select</option>
                                  <option value="2023-2024" {{ old('session_type', $selectedSessionType) == '2023-2024' ? 'selected' : '' }}>2023-2024</option>
                                  <option value="2024-2025" {{ old('session_type', $selectedSessionType) == '2024-2025' ? 'selected' : '' }}>2024-2025</option>
                                  <option value="2025-2026" {{ old('session_type', $selectedSessionType) == '2025-2026' ? 'selected' : '' }}>2025-2026</option>
                                  <option value="2026-2027" {{ old('session_type', $selectedSessionType) == '2026-2027' ? 'selected' : '' }}>2026-2027</option>
                                </select>
                                                        
                            </div>
                        </div>
                    </div>
                    <div class="col-me-8">
                      <div class="form-panel" style="margin-top:30px;">
                            <button type="submit" class="button button-la float-left">Search</button>
                            <button type="submit" class="button button-la button-gray float-left" onclick="resetPage()">Reset</button>
                      </div>
                    </div>
                  </form>
                  
                </div>
              </div>
              <div class="clearfix"></div>
              <hr>
            </div>
            @foreach($menu_permit as $menu)
            <?php if($menu->s_link  == 'leavessummary-reports/' ) { ?>
              <div class="col-me-12">
                <div class="table-responsive">
                  <div class="float-right" style="margin: 10px;"></div>
                  <table class="table-border sticky-header display" id="leavesummaryTable">
                      <thead>
                          <tr>
                              <th align="left">Name</th>
                              <th align="left">Username(Mobile No.)</th>
                              <th align="left">Designation</th>
                              <th align="left">Department</th>
                              <th align="left">Casual Leave</th>
                              <th align="left">Sick Leave</th>
                              <th align="left">Annual Leave</th>
                              
                          </tr>
                      </thead>
                      <tbody>
                        @foreach($records as $leaves)
                            <tr>
                                <td>{{ $leaves->s_first_name }} {{ $leaves->s_last_name }}</td>
                                <td>{{ $leaves->s_phone }}</td>
                                <td>{{ $leaves->s_designation_name }}</td>
                                <td>{{ $leaves->s_department_name }}</td>
                                <td>{{ $leaves->casual_leave_taken }} / {{ $leaves->casual_leave_alloted }} </td>
                                <td>{{ $leaves->sick_leave_taken }} / {{ $leaves->sick_leave_alloted }}</td>
                                <td>{{ $leaves->annual_leave_taken }} / {{ $leaves->annual_leave_alloted }}</td>
                                
                            </tr>
                        @endforeach
                        
                      </tbody>
                  </table>
                </div>
                  {{-- Display pagination links --}}
                  {!! $paginationLinks !!}
              </div>
            <?php } ?>
            @endforeach
            </div>
      </div>
    </div>
  </div>
</div>

<script>
  // JavaScript function to reload the page
  function resetPage() {
    window.location.href = '{{ route("leavessummary.index") }}';
     // Handle form submission to prevent default and manually redirect if needed
     document.getElementById('searchForm').addEventListener('submit', function(event) {
        event.preventDefault();

        // Your search logic here, e.g., redirect to a search results page
        // window.location.href = 'your_search_results_page?query=' + encodeURIComponent(document.getElementById('searchInput').value);
    });
  }

  $(document).ready(function () {
    // Function to initialize datepicker
    function initDatepicker(selector) {
        $(selector).datepicker({
            dateFormat: "dd-mm-yy",
            changeMonth: true,
            changeYear: true,
            onSelect: function(selectedDate, instance) {
                    // Get the selected date and field ID
                    var selectedFieldId = $(this).attr('id');
                    var selectedDate = $(this).datepicker('getDate');

                    // Check if Date To is less than Date From
                    if (selectedFieldId === 'search_leave_date_to') {
                        var fromDate = $('#search_leave_date_from').datepicker('getDate');
                        if (fromDate !== null && selectedDate < fromDate) {
                            alert('Date To must be equal or greater than Date From');
                            $(this).datepicker('setDate', ''); // Clear the Date To field
                        }
                    }
            },
            onClose: function (selectedDate) {
                // When a date is selected, convert and update the hidden input field
                var convertedDate = $.datepicker.formatDate("yy-mm-dd", $(this).datepicker("getDate"));
                $("#hidden_" + this.id).val(convertedDate);
            }
        });

        // Create a hidden input field for each datepicker to store the converted date
        $(selector).each(function () {
            $("<input type='hidden'>")
                .attr("id", "hidden_" + this.id)
                .attr("name", this.name)
                .appendTo($(this).parent());
        });

        $(selector).prop('readonly', true);
    }


    // Initialize datepicker for the login date from field
    initDatepicker('#search_leave_date_from');

    // Initialize datepicker for the login date to field
    initDatepicker('#search_leave_date_to');

  });

   $(document).ready(function () {
       $('#leavesummaryTable').DataTable({
           "lengthChange": true,
           "paging": false,
           "searching": false,
           "info": false,
           "drawCallback": function(settings) {
             $(settings.nTable).css('border-bottom', 'none');
        }
       });
   });
   $(document).ready(function() {
        $('#select-box').change(function() {
          submit_show_list_form_leave_summary_list();
        });
    });

    function submit_show_list_form_leave_summary_list() {
        $('#form-show-list-leave-summary-list').submit();
    }
 

</script>
@endsection