@extends('admin.layout.dashboard-template')
  @section('content')
  <div class="db-info-wrap db-package-wrap">
      <div class="dashboard-box table-opp-color-box">
          <h4>Lead / Hot Leads Records</h4>
          <div class="text-right">
              <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Add Record</button>
          </div>

          <!-- Modal -->
          <div class="modal fade" id="myModal" role="dialog">
              <div class="modal-dialog">

                  <!-- Modal content-->
                  <div class="modal-content">
                      <div class="modal-header" style="display: block;">
                          <button type="button" class="close" data-dismiss="modal">&times;</button>
                          <h4 class="modal-title">Add Recording</h4>
                      </div>
                       <form action="{{route('admin.save-recording')}}" method="post" enctype="multipart/form-data">
                              @csrf
                      <div class="modal-body">
                         
                              <div class="row">
                                  <div class="col-12">
                                      <div class="form-group">
                                          <label>Select Lead Type</label>
                                          <select name="service" class="form-control" required>
                                              <option value="L">Lead</option>
                                              <option value="H">Hot Lead</option>
                                          </select>
                                      </div>
                                  </div>

                              </div>
                              <div class="row">
                                  <div class="col-12">
                                      <div class="form-group">
                                          <label>Upload Record</label>
                                           <input type="file" name="audio" accept="audio/*" required class="form-control">
                                      </div>
                                  </div>

                              </div>
                          
                      </div>
                      <div class="modal-footer">
                          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                          <button type="submit"  class="btn btn-primary">Add Record</button>
                      </div>
                      </form>
                  </div>

              </div>
          </div>

          @if(\Session::get('success'))
          <div class="alert alert-success alert-dismissible fade show" role="alert">
              <div class="alert-body">
                  {{ \Session::get('success') }}
              </div>
              <button type="button" class="btn-close" data-dismiss="alert" aria-label="Close"></button>
          </div>
          @endif
          {{ \Session::forget('success') }}
          @if(\Session::get('error'))
          <div class="alert alert-danger alert-dismissible fade show" role="alert">
              <div class="alert-body">
                  {{ \Session::get('error') }}
              </div>
              <button type="button" class="btn-close" data-dismiss="alert" aria-label="Close"></button>
          </div>
          @endif
          <div class="table-responsive">
              <table class="table">
                  <thead>
                      <tr>
                          <th>Sl.No</th>
                          <th>Record</th>
                          <th>Type</th>
                          <th>Status</th>
                          <th>Action</th>
                      </tr>
                  </thead>
                  <tbody>

                  </tbody>
              </table>
          </div>
      </div>

  </div>
  <script type="text/javascript">
      $(function() {
          var table = $('.table').DataTable({
              processing: true,
              serverSide: true,
              ajax: "{{ route('admin.get-recording') }}",
              columns: [{
                      data: 'DT_RowIndex',
                      name: 'DT_RowIndex'
                  },
                  {
                      data: 'record',
                      name: 'record'
                  },
                  {
                      data: 'type',
                      name: 'type'
                  },
                  {
                      data: 'status',
                      name: 'status'
                  },
                  {
                      data: 'action',
                      name: 'action',
                      orderable: false,
                      searchable: false
                  },
              ],
              "select": {
                  'style': 'multi',
                  'selector': 'td:first-child' //only checkbox can select row
              },
          });

      });

      $(document).on('click', '#getDeleteId', function(e) {
          var answer = confirm("Are you sure you want to delete from this item?");
          if (answer) {
              id = $(this).data('id');
              e.preventDefault();
              $.ajaxSetup({
                  headers: {
                      'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                  }
              });
              $.ajax({
                  url: "{{ route('admin.delete-recording') }}",
                  method: "GET",
                  data: {
                      'id': id
                  },
                  success: function(result) {
                      $('.table').DataTable().ajax.reload();
                      if (result == 1) {
                          $(".alert-success").text("Record Deleted successfully.");
                      } else {
                          $(".alert-danger").text("Something went wrong.");
                      }

                      $('.data-table').DataTable().ajax.reload();

                  }
              });
          }
      });

      $(document).on('click', '#status', function(e) {
          id = $(this).data('id');
          status = $(this).data('value');
          e.preventDefault();
          $.ajaxSetup({
              headers: {
                  'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
              }
          });
          $.ajax({
              url: "{{ route('admin.change-recording-status') }}",
              method: "GET",
              data: {
                  'id': id,
                  'status': status
              },
              success: function(result) {
                  $('.table').DataTable().ajax.reload();
                  if (result == 1) {
                      $(".alert-success").text("Status Changed successfully.");
                  } else {
                      $(".alert-danger").text("Something went wrong.");
                  }

                  $('.data-table').DataTable().ajax.reload();

              }
          });
      });
  </script>
  @endsection