@extends('admin.main')
@section('content')

<div class="row">
   <div class="col-md-12">
      <div class="card"> 
         <div class="card-header">
            <h4 class="">Lead Management
                 <a href="{{ route('leads.index') }}" class="btn btn-primary float-right ml-2">Reset</a>
                @can('view.leads')    
                        <a href="#" class="btn btn-primary float-right" data-toggle="modal" data-target="#importModal">Import</a>
                   @if(count($leads) > 0)
                          <a href="javascript:void(0);" class="btn btn-primary float-right mr-2" data-toggle="modal" data-target="#exportModal">
                              Export <i class="i-Download1" aria-hidden="true"></i>
                            </a>
                   @endif
                        <a href="{{ route('leads.create') }}" class="btn btn-primary float-right mr-2">Create Lead</a>
                @endcan

            </h4>
         </div>
         <div class="card-body sales_new_table">
             @include('admin.msg')

             <div class="float-right mb-3">
                 <form id="search-leads-form" method="post">
                    @csrf
                     <div class="form-group d-inline">
                         <input placeholder="Enter Text" type="text" name="search" id="filter_input"  class="form-control w-75 d-inline"  required>
                     </div>
                     <button type="submit" class="btn btn-primary btn-sm d-inline ml-2">Search</button>
                 </form>
              </div>
            <div class="table-responsive">
             <table class="display table-striped table table-bordered" id="leads-table">
               <thead>
                  <tr>
                        <th>#</th>
                        <th>Call Received On</th>
                        <th>Date of 1st Call</th>
                        <th>Call Received From</th>
                        <th>Patient Name</th>
                        <th>Source</th>
                        <th>Place Area</th>
                        <th>Treating Doctor</th>
                        <th>Surgery Advised</th>
                        <th>Actions</th>
                  </tr>
               </thead>
               <tbody>
                  @foreach($leads as $i => $lead)
                  <tr>
                        <td>{{ $i+1 }}</td>
                        <td>{{ $lead->call_received_on }}</td>
                        <td>{{ $lead->date_of_1st_call }}</td>
                        <td>{{ $lead->call_received_from }}</td>
                        <td>{{ ucfirst($lead->patient_name) }}</td>
                        <td>{{ $lead->source }}</td>
                        <td>{{ $lead->place_area }}</td>
                        <td>{{ $lead->treating_doctor }}</td>
                        <td>{{ $lead->surgery_advised }}</td>
                     <td>
                  <!--   <button type="button" title="Add Notes" aria-label="Add Notes" class="btn btn-primary btn-sm text-white font-weight-bold" onclick="$('#notes_leads_id').val({{ $lead->id }}); 
                               $('#noteValue').val('{{ $lead->notes ? addslashes($lead->notes->notes) : '' }}'); $('#lead_noteId').val('{{ $lead->notes ? addslashes($lead->notes->id) : '' }}')" 
                       data-toggle="modal" data-target="#notesModel"> <i class="i-Note" aria-hidden="true"></i>
                     </button>
 -->
                         <!-- Reminders Button -->
                       <!--   <button type="button"
                                    title="Reminders via Email Notifications"
                                    aria-label="Reminders via Email"
                                    class="btn btn-primary btn-sm text-white font-weight-bold"
                                    data-toggle="modal"
                                    data-target="#modelReminders"
                                    onclick="fillReminderData(this)"
                                    data-id="{{ $lead->id }}"
                                    data-main-id="{{ optional($lead->reminders)->id }}"
                                    data-subject="{{ optional($lead->reminders)->subject }}"
                                    data-body="{{ optional($lead->reminders)->body }}"
                                    data-date="{{ optional($lead->reminders)->reminder_at }}">
                                    <i class="i-Bell" aria-hidden="true"></i>
                                </button> -->

                           @can('edit.leads')    
                             <a href="{{ route('leads.edit', $lead->id) }}" class="btn btn-primary btn-sm text-white"><i class="i-Pen-2"></i></a>
                           @endcan
                            @can('delete.leads')
                             <form action="{{ route('leads.destroy', $lead->id) }}" method="POST" style="display:inline;" id="delete-form-{{ $lead->id }}">
                                @csrf
                                @method('DELETE')
                                <button type="button" class="btn btn-danger btn-sm" onclick="confirmDelete({{ $lead->id }})">
                                    <img src="{{ asset('/img/del.png') }}" width="15" alt="Delete">
                                </button>
                            </form>
                           @endcan 
                     </td>
                  </tr>
                  @endforeach
               </tbody>
            </table>
             <div id="pagination-links" class="float-right mt-2">
               {{ $leads->links('pagination::bootstrap-4') }}
            </div>
           </div>
         </div>
      </div>
   </div>
</div>


<div class="modal fade" id="notesModel">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <h4 class="modal-title">Notes</h4>
          <button type="button" class="close" data-dismiss="modal">&times;</button>
        </div>
        <form method="POST" action="{{ route('leads.save_lead_notes') }}">
          @csrf
          <input type="hidden" name="lead_id" id="notes_leads_id">
          <input type="hidden" name="note_id" id="lead_noteId">
           <div class="modal-body">
               <div class="form-group">
                  <label for="note">Note</label>
                  <textarea placeholder="Enter Text" class="form-control" name="notes" id="noteValue" rows="4" required></textarea>
              </div>
           </div>
           <div class="modal-footer">
             <button type="submit" class="btn btn-primary">Submit</button>
             <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
           </div>
        </form>
      </div>
    </div>
  </div>


<div class="modal fade" id="modelReminders">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">Reminder Email Notification</h4>
                <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>
            <form method="POST" action="{{ route('reminders.store') }}">
                @csrf
                <div class="modal-body">
                    <input type="hidden" name="lead_id" id="reminder_lead_id">
                    <input type="hidden" name="reminder_id" id="reminder_main_id">
                    <div class="form-group">
                        <label for="subject">Subject</label>
                        <input type="text" placeholder="Enter Subject" class="form-control" name="subject" id="reminder_subject" value="{{ old('subject') }}" required>
                        @error('subject')
                            <small class="text-danger">{{ $message }}</small>
                        @enderror
                    </div>
                    <div class="form-group">
                        <label for="body">Body</label>
                        <textarea placeholder="Enter Email Body" rows="4" class="form-control" name="body" id="reminder_body" required>{{ old('body') }}</textarea>
                        @error('body')
                            <small class="text-danger">{{ $message }}</small>
                        @enderror
                    </div>
                    <div class="form-group">
                        <label for="date">Reminder Date</label>
                        <input type="date" min="{{ now()->toDateString() }}" class="form-control" name="date" id="reminder_date" value="{{ old('date') }}" required>
                        @error('date')
                            <small class="text-danger">{{ $message }}</small>
                        @enderror
                    </div>
                    <div class="form-group">
                        <label for="time">Reminder Time</label>
                        <input type="time" class="form-control" name="time" id="reminder_time" value="{{ old('time') }}" required>
                        @error('time')
                            <small class="text-danger">{{ $message }}</small>
                        @enderror
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="submit" class="btn btn-primary">Submit</button>
                    <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
                </div>
            </form>
        </div>
    </div>
</div>

<div class="modal fade" id="importModal" tabindex="-1" role="dialog" aria-labelledby="importModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="importModalLabel">Import</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
       <form method="POST" action="{{ route('leads.import') }}" enctype="multipart/form-data">
                @csrf
                <div class="modal-body">
                    <div class="form-group">
                        <label for="leads_file">Select CSV File</label>
                        <input type="file" class="form-control @error('leads_file') is-invalid @enderror" id="leads_file" name="leads_file" accept=".xls,.xlsx,.csv" required>
                        @error('leads_file')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="submit" class="btn btn-primary">Import</button>
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                </div>
            </form>
    </div>
  </div>
</div>


 <div class="modal fade" id="exportModal" tabindex="-1" role="dialog" aria-labelledby="exportModalLabel" aria-hidden="true">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <h5 class="modal-title" id="exportModalTitle">Select Date</h5>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
              <span aria-hidden="true">&times;</span>
            </button>
          </div>
        <form action="{{route('exportLeads')}}" method="post">
            @csrf
          <div class="modal-body">
              <div class="form-group">
                <label for="start_date">Start Date</label>
                <input type="date" id="start_date" class="form-control @error('start_date') is-invalid @enderror" name="start_date" value="{{ old('start_date') }}" required>
                @error('start_date')
                  <div class="invalid-feedback">{{ $message }}</div>
                @enderror
              </div>

              <div class="form-group">
                <label for="end_date">End Date</label>
                <input type="date" id="end_date" class="form-control @error('end_date') is-invalid @enderror" name="end_date" value="{{ old('end_date') }}" required>
                @error('end_date')
                  <div class="invalid-feedback">{{ $message }}</div>
                @enderror
              </div>
          </div>
          <div class="modal-footer">
            <button type="submit" class="btn btn-primary" id="exportModalBttn">Export</button>
            <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
          </div>
          </form>
        </div>
      </div>
    </div>
  </div>


@if (session('show_modal') == 'modelReminders')
    <script>
        $(document).ready(function() {
            $('#modelReminders').modal('show');
        });
    </script>
@elseif (session('show_modal') == 'lead_import_modal')
     <script>
         $(document).ready(function(){
            $('#importModal').modal('show');
        });
    </script>
@elseif (session('show_modal') == 'lead_export_modal')
     <script>
         $(document).ready(function(){
            $('#exportModal').modal('show');
            $('.invalid-feedback').show();
        });
    </script>
@endif


<script>
    
 $(document).ready(function() {
      function fetchLeads(url = "{{ route('search_leads') }}", search = '') {
            $.ajax({
                url: url,
                type: "POST",
                data: {
                    _token: "{{ csrf_token() }}",
                    search: search,
                },
                success: function (response) {
                    let tableBody = $('#leads-table tbody');
                    tableBody.empty(); // Clear previous rows

                    if (response.leads.length > 0) {
                        $.each(response.leads, function (index, lead) {
                            tableBody.append(`
                                <tr>
                                    <td>${index + 1}</td>
                                    <td>${lead.call_received_on}</td>
                                    <td>${lead.date_of_1st_call}</td>
                                    <td>${lead.call_received_from}</td>
                                    <td>${lead.patient_name.charAt(0).toUpperCase() + lead.patient_name.slice(1)}</td>
                                    <td>${lead.source}</td>
                                    <td>${lead.place_area}</td>
                                    <td>${lead.treating_doctor}</td>
                                    <td>${lead.surgery_advised}</td>
                                    <td>Actions Placeholder</td>
                                </tr>
                            `);
                        });
                    } else {
                        tableBody.append('<tr><td colspan="10" class="text-center">No leads found</td></tr>');
                    }

                    // Update pagination links
                    $('#pagination-links').html(response.pagination);

                    // Add click event to new pagination links
                    $('#pagination-links a').on('click', function (e) {
                        e.preventDefault();
                        let pageUrl = $(this).attr('href');
                        fetchLeads(pageUrl, search);
                    });
                },
                error: function (xhr) {
                    console.error(xhr.responseText);
                    alert('An error occurred. Please try again.');
                }
            });
        }

        // Initial fetch
        fetchLeads();

        // Search form submission
        $('#search-leads-form').on('submit', function (e) {
            e.preventDefault();
            let search = $('#filter_input').val();
            fetchLeads("{{ route('search_leads') }}", search);
        });
 });



var showModal = @json(session('show_modal')); 
  if (showModal != 'lead_import_modal') {
    $(document).on('click', '#exportModalBttn', function() {
      setTimeout(function () {
        location.reload();  // Reload the page after 2.5 seconds
      }, 2500);
    });
  }

</script>

@endsection