@extends('layouts.app')

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

        <?php echo show_flash_messages(); ?>
        
        <div class='main-bg white-bg label-inline-block clearfix margin-bottom-la'>
        <div class="menu-list" style="margin-bottom: 20px;">
        <div class="col-la-12">
          @if(isset($success))
                    <div class="alert-primary bg-success margin-bottom-es">
                      <strong><i class="fa fa-check fa-lg"></i>&nbsp;</strong>{{ $success }}<a href="javascript:void(0);" class="alert-close"><i class="material-icons">close</i></a>
                    </div>
                @endif
          <div class="admin-content-header listing-page">
          
            <div class="d-flex align-items-center justify-content-between">
              <h1>Locations</h1>
              @foreach($menu_permit as $menu)
              <?php if($menu->s_link  == 'locations/add/' ) { ?>
              <div class="form-panel clearfix add_button_section">
                <a href="{{ route('locations.add') }}" class="button button-la float-left"><i class="fas fa-plus"></i> Add</a>
              </div>
              <?php } ?>
              @endforeach
            </div>
          </div>
          <div class="form-panel  clearfix add_button_section">
              
            <form method="POST" action="{{ route('locations.index') }}" class="form-inline" id="searchForm">
              @csrf
              <div class="row">
                <div class="col-me-6">
                  <div class="form-panel">
                    <input type="text" name="selected_location_name" id="search_selected_location_name" class="input-panel" value="{{ request('selected_location_name') }}" placeholder="Search by Location">
                    
                  </div>
                </div>
                
                <div class="col-me-6">
                  <div class="form-panel">
                    <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>
              </div>
              
            </form>
       
          </div>
        </div>
        <div class="clearfix"></div>
        <hr>
        </div>
        @foreach($menu_permit as $menu)
        <?php if($menu->s_link  == 'locations/' ) { ?>
        <div class="col-me-12">

          <div class="table-responsive">
            <div class="float-right" style="margin: 10px;"></div>
          
            <table class="table-border sticky-header" id="locationTable">
              <thead>
                  <tr>
                      <th align="left">Location Name</th>
                      <th align="left">Location Latitude</th>
                      <th align="left">Location Longitude</th>
                      <th align="left">Location Description</th>
                      <th align="left">Actions</th>
                  </tr>
              </thead>
              <tbody>
                @foreach($records as $location)
                    <tr>
                        <td>{{ $location->location_name }}</td>
                        <td>{{ $location->location_latitude }}</td>
                        <td>{{ $location->location_longitude }}</td>
                        <td>{{ $location->location_description }}</td>
                        {{-- <td id="status_id{{ $location->i_id }}">{{ $location->i_is_active == 1 ? 'Active' : 'Inactive' }}</td> --}}
                        <td class="align-center position-relative quick-edit-wrapper">
                          <div class="quick-edit-panel">
                             <a href="javascript:void(0);" class="quick-edit-link primary-color"><i class="material-icons"> more_horiz</i></a>   
                             <ul class="quick-edit-list">
                              @foreach($menu_permit as $menu)
                              <?php if($menu->s_link  == 'locations/edit/' ) { ?>
                                <li>
                                  <a title="Edit Item" href="{{ route('locations.edit', $location->i_id) }}"><i class="fas fa-pencil-alt" aria-hidden="true"></i> Edit</a>
                                </li>
                              <?php } ?>
                              @endforeach
                                {{-- <li>
                                  <form id="updateStatusForm{{ $location->i_id }}" action="{{ route('locations.updateStatus', ['location' => $location]) }}" method="post">
                                      @csrf
                                      <input type="hidden" name="location_id" value="{{ $location->i_id }}">
                                      <!-- Add other form fields if needed -->
                                      <a href="#" class="btn btn-success update-active-btn" onclick="updateStatusForm(event, '{{ $location->i_id }}')">
                                          <i class="fas fa-trash" aria-hidden="true"></i> Delete
                                      </a>
                                      <!-- Display error messages -->
                                      <span id="location_idError{{ $location->i_id }}" class="error-feedback"></span>
                                  </form>
                                </li> --}}
                             </ul>
                          </div>
                       </td>
                    </tr>
                @endforeach
                
              </tbody>
          </table>
          </div>
        </div>
            {{-- Display pagination links --}}
            {!! $paginationLinks !!}
      </div>
      <?php } ?>
      @endforeach
    </div>
  </div>
</div>

<script>
  // JavaScript function to reload the page
  function resetPage() {
    window.location.href = '{{ route("locations.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);
    });
  }
  
function updateStatusForm(event, locationId) {
    event.preventDefault(); // Prevent the default link behavior

    // Display a simple confirmation using the built-in confirm dialog
    var userConfirmed = confirm('Are you sure you want to update the status?');

    if (userConfirmed) {
        // Clear previous error messages
        $('.error-feedback').text('');

        // Create a FormData object to handle form data
        var formData = new FormData($('#updateStatusForm' + locationId)[0]);

        // Make an AJAX request
        $.ajax({
            type: 'POST',
            url: $('#updateStatusForm' + locationId).attr('action'),
            data: formData,
            contentType: false,
            processData: false,
            dataType: 'json',
            success: function (response) {
                // Handle success, e.g., show a success message
                console.log(response);
                // Assuming your response contains the updated i_is_active value
                var newStatus = response.i_is_active; // Adjust this based on your actual response structure
                var statusText = newStatus == 1 ? 'Active' : 'Inactive';
                // Update the content of the specific <td> with the new status
                $('#status_id' + response.id).text(statusText);
                location.reload();
            },
            error: function (xhr, status, error) {
                // Handle errors and display error messages
                console.error(xhr.responseText);
                var errors = xhr.responseJSON.errors;

                if (errors) {
                    $.each(errors, function (key, value) {
                        // Display error messages next to form fields
                        $('#' + key + 'Error' + locationId).text(value[0]);
                    });
                } else {
                    // Handle other types of errors
                    alert('An error occurred. Please try again.');
                }
            }
        });
    }
}

$(document).ready(function () {
      $('#locationTable').DataTable({
          "lengthChange": false,
          "paging": false,
          "searching": false,
          "info": false,
          "columnDefs": [
            { "orderable": false, "targets": -1 } // Assuming the "Action" column is at index 8
          ],
          "drawCallback": function(settings) {
            $(settings.nTable).css('border-bottom', 'none');
        }
      });
  });

  $(document).ready(function() {
        $('#select-box').change(function() {
          submit_show_list_form_location_list();
        });
    });

    function submit_show_list_form_location_list() {
        $('#form-show-list-location-list').submit();
    }
 
</script>
  

@endsection