@extends('layouts.admin')
@section('content')
@can('agent_create')
    <div style="margin-bottom: 10px;" class="row">
        <div class="col-lg-12">
            <a class="btn btn-success" href="{{ route('admin.agents.create') }}">
                {{ trans('global.add') }} {{ trans('cruds.agent.title_singular') }}
            </a>
            <button class="btn btn-warning" data-toggle="modal" data-target="#csvImportModal">
                {{ trans('global.app_csvImport') }}
            </button>
            @include('csvImport.modal', ['model' => 'Agent', 'route' => 'admin.agents.parseCsvImport'])
        </div>
    </div>
@endcan
@include('admin.agents.reject')
<div class="card">
    <div class="card-header">
        {{ trans('cruds.agent.title_singular') }} {{ trans('global.list') }}
    </div>

    <div class="card-body">
        <table class=" table table-bordered table-striped table-hover ajaxTable datatable datatable-Agent">
            <thead>
                <tr>
                    <th width="10">

                    </th>
                    <th width="10">

                    </th>
                    <th>
                        {{ trans('cruds.agent.fields.id') }}
                    </th>
                    <th>
                        Agent Code
                    </th>
                    <th>
                        {{ trans('cruds.agent.fields.name') }}
                    </th>
                    <th>
                        {{ trans('cruds.agent.fields.ic_number') }}
                    </th>
                    <th>
                        {{ trans('cruds.agent.fields.contact_number') }}
                    </th>
                    <th>
                        {{ trans('cruds.agent.fields.address') }}
                    </th>
                    {{-- <th>
                        {{ trans('cruds.agent.fields.gender') }}
                    </th>
                    <th>
                        {{ trans('cruds.user.fields.approved') }}
                    </th>
                    <th>
                        {{ trans('cruds.agent.fields.civil_status') }}
                    </th>
                    <th>
                        {{ trans('cruds.agent.fields.contact_number') }}
                    </th> --}}
                    <th>
                        {{ trans('cruds.agent.fields.email') }}
                    </th>
                    {{-- <th>
                        {{ trans('cruds.agent.fields.education_level') }}
                    </th> --}}
                    <th>
                        {{ trans('cruds.agent.fields.area_cities_cover') }}
                    </th>
                    <th>
                        Refer By
                    </th>
                    {{-- <th>
                        {{ trans('cruds.agent.fields.answer_question_1') }}
                    </th>
                     <th>
                        {{ trans('cruds.agent.fields.referral') }}
                    </th>
                    <th>
                        {{ trans('cruds.agent.fields.upload_ic') }}
                    </th> --}}
                    <th>
                        {{ trans('cruds.agent.fields.status') }}
                    </th>
                    {{-- <th>
                        {{ trans('cruds.agent.fields.email_verified_at') }}
                    </th> --}}
                    <th>
                        {{ trans('cruds.agent.fields.roles') }}
                    </th>
                    <th>
                        &nbsp;
                    </th>
                </tr>
                <tr class="filters">
                    <td>
                    </td>
                    <td>
                    </td>
                    <td>
                        <input class="search" type="text" placeholder="{{ trans('global.search') }}">
                    </td>
                    <td>
                        <input class="search" type="text" placeholder="{{ trans('global.search') }}">
                    </td>
                    <td>
                        <input class="search" type="text" placeholder="{{ trans('global.search') }}">
                    </td>
                    <td>
                        <input class="search" type="text" placeholder="{{ trans('global.search') }}">
                    </td>
                    <td>
                        <input class="search" type="text" placeholder="{{ trans('global.search') }}">
                    </td>
                    <td>
                        <input class="search" type="text" placeholder="{{ trans('global.search') }}">
                    </td>
                    {{-- <td>
                        <select class="search" strict="true">
                            <option value>{{ trans('global.all') }}</option>
                            @foreach(App\Models\Agent::GENDER_SELECT as $key => $item)
                                <option value="{{ $key }}">{{ $item }}</option>
                            @endforeach
                        </select>
                    </td>
                    <td>
                    </td>
                    <td>
                        <select class="search" strict="true">
                            <option value>{{ trans('global.all') }}</option>
                            @foreach(App\Models\Agent::CIVIL_STATUS_SELECT as $key => $item)
                                <option value="{{ $key }}">{{ $item }}</option>
                            @endforeach
                        </select>
                    </td>
                    <td>
                        <input class="search" type="text" placeholder="{{ trans('global.search') }}">
                    </td> --}}
                    <td>
                        <input class="search" type="text" placeholder="{{ trans('global.search') }}">
                    </td>
                    {{-- <td>
                        <select class="search" strict="true">
                            <option value>{{ trans('global.all') }}</option>
                            @foreach(App\Models\Agent::EDUCATION_LEVEL_SELECT as $key => $item)
                                <option value="{{ $key }}">{{ $item }}</option>
                            @endforeach
                        </select>
                    </td> --}}
                    <td>
                        <input class="search" type="text" placeholder="{{ trans('global.search') }}">
                    </td>
                    <td>
                        <input class="search" type="text" placeholder="{{ trans('global.search') }}">
                    </td>
                    {{-- <td>
                        <input class="search" type="text" placeholder="{{ trans('global.search') }}">
                    </td>
                    <td>
                        <input class="search" type="text" placeholder="{{ trans('global.search') }}">
                    </td>
                    <td>
                    </td> --}}
                    <td>
                        <select class="search" strict="true">
                            <option value>{{ trans('global.all') }}</option>
                            @foreach(App\Models\Agent::STATUS_SELECT as $key => $item)
                                <option value="{{ $key }}">{{ $item }}</option>
                            @endforeach
                        </select>
                    </td>
                    {{-- <td>
                        <input class="search" type="text" placeholder="{{ trans('global.search') }}">
                    </td> --}}
                    <td>
                        <select class="search">
                            <option value>{{ trans('global.all') }}</option>
                            @foreach($roles as $key => $item)
                                <option value="{{ $item->title }}">{{ $item->title }}</option>
                            @endforeach
                        </select>
                    </td>
                    <td>
                    </td>
                </tr>
            </thead>
        </table>
    </div>
</div>



@endsection
@section('scripts')
@parent
<script>
let rejectEditor;

function reject(button)
{
    var id = button.getAttribute("data-reject-agent-id");
    document.getElementById('datatables-reject-form').action = 'agents/' + id + '/rejectDetails';
}

    $(function () {
  let dtButtons = $.extend(true, [], $.fn.dataTable.defaults.buttons)
@can('agent_delete')
  let deleteButtonTrans = '{{ trans('global.datatables.delete') }}';
  let deleteButton = {
    text: deleteButtonTrans,
    url: "{{ route('admin.agents.massDestroy') }}",
    className: 'btn-danger',
    action: function (e, dt, node, config) {
      var ids = $.map(dt.rows({ selected: true }).data(), function (entry) {
          return entry.id
      });

      if (ids.length === 0) {
        alert('{{ trans('global.datatables.zero_selected') }}')

        return
      }

      if (confirm('{{ trans('global.areYouSure') }}')) {
        $.ajax({
          headers: {'x-csrf-token': _token},
          method: 'POST',
          url: config.url,
          data: { ids: ids, _method: 'DELETE' }})
          .done(function () { location.reload() })
      }
    }
  }
  dtButtons.push(deleteButton)
@endcan
@can('agent_approve')
  let approveButtonTrans = 'Approve selected';
  let approveButton = {
    text: approveButtonTrans,
    url: "{{ route('admin.agents.massApprove') }}",
    className: 'btn-success',
    action: function (e, dt, node, config) {
      var ids = $.map(dt.rows({ selected: true }).data(), function (entry) {
          return entry.id
      });

      if (ids.length === 0) {
        alert('{{ trans('global.datatables.zero_selected') }}')

        return
      }

      if (confirm('{{ trans('global.areYouSure') }}')) {
        $.ajax({
          headers: {'x-csrf-token': _token},
          method: 'POST',
          url: config.url,
          data: { ids: ids }})
          .done(function (response) { 
            if(response == undefined)
            {
                location.reload()
            }
            else
            {
                if(response.status_code == 500)
                {
                    alert(response.message);
                }
            }
          })
      }
    }
  }
  dtButtons.push(approveButton)
@endcan
@can('agent_reject')
  let rejectButtonTrans = 'Reject selected';
  let rejectButton = {
    text: rejectButtonTrans,
    url: "{{ route('admin.agents.massReject') }}",
    className: 'btn-warning',
    action: function (e, dt, node, config) {
      var ids = $.map(dt.rows({ selected: true }).data(), function (entry) {
          return entry.id
      });

      if (ids.length === 0) {
        alert('{{ trans('global.datatables.zero_selected') }}')

        return
      }

      if (confirm('{{ trans('global.areYouSure') }}')) {
        $.ajax({
          headers: {'x-csrf-token': _token},
          method: 'POST',
          url: config.url,
          data: { ids: ids }})
          .done(function (response) {
            if(response == undefined)
            {
                location.reload()
            }
            else
            {
                if(response.status_code == 500)
                {
                    alert(response.message);
                }
            }
        })
      }
    }
  }
  dtButtons.push(rejectButton)
@endcan
@can('agent_abandon')
  let abandonButtonTrans = 'Abandon selected';
  let abandonButton = {
    text: abandonButtonTrans,
    url: "{{ route('admin.agents.massAbandon') }}",
    className: 'btn-secondary',
    action: function (e, dt, node, config) {
      var ids = $.map(dt.rows({ selected: true }).data(), function (entry) {
          return entry.id
      });

      if (ids.length === 0) {
        alert('{{ trans('global.datatables.zero_selected') }}')

        return
      }

      if (confirm('{{ trans('global.areYouSure') }}')) {
        $.ajax({
          headers: {'x-csrf-token': _token},
          method: 'POST',
          url: config.url,
          data: { ids: ids }})
          .done(function (response) {
            if(response == undefined)
            {
                location.reload()
            }
            else
            {
                if(response.status_code == 500)
                {
                    alert(response.message);
                }
            }
        })
      }
    }
  }
  dtButtons.push(abandonButton)
@endcan
@can('agent_recover')
  let recoverButtonTrans = 'Recover selected';
  let recoverButton = {
    text: recoverButtonTrans,
    url: "{{ route('admin.agents.massRecover') }}",
    className: 'btn-success',
    action: function (e, dt, node, config) {
      var ids = $.map(dt.rows({ selected: true }).data(), function (entry) {
          return entry.id
      });

      if (ids.length === 0) {
        alert('{{ trans('global.datatables.zero_selected') }}')

        return
      }

      if (confirm('{{ trans('global.areYouSure') }}')) {
        $.ajax({
          headers: {'x-csrf-token': _token},
          method: 'POST',
          url: config.url,
          data: { ids: ids }})
          .done(function (response) {
            if(response == undefined)
            {
                location.reload()
            }
            else
            {
                if(response.status_code == 500)
                {
                    alert(response.message);
                }
            }
        })
      }
    }
  }
  dtButtons.push(recoverButton)
@endcan

  let dtOverrideGlobals = {
    buttons: dtButtons,
    processing: true,
    serverSide: true,
    retrieve: true,
    aaSorting: [],
    ajax: "{{ route('admin.agents.index') }}",
    columns: [
      { data: 'placeholder', name: 'placeholder' },
      { data: 'placeholder', name: 'placeholder' },
{ data: 'id', name: 'id' },
{ data: 'agent_code', name: 'agent_code' },
{ data: 'name', name: 'name' },
{ data: 'ic_number', name: 'ic_number' },
{ data: 'contact_number', name: 'contact_number' },
{ data: 'address', name: 'address' },
// { data: 'gender', name: 'gender' },
// { data: 'approved', name: 'approved' },
// { data: 'civil_status', name: 'civil_status' },
// { data: 'contact_number', name: 'contact_number' },
{ data: 'email', name: 'email' },
// { data: 'education_level', name: 'education_level' },
{ data: 'area_cities_cover', name: 'area_cities_cover' },
{ data: 'referral_code', name: 'referral_code' },
// { data: 'answer_question_1', name: 'answer_question_1' },
// { data: 'referral', name: 'referral' },
// { data: 'upload_ic', name: 'upload_ic', sortable: false, searchable: false },
{ data: 'status', name: 'status' },
// { data: 'email_verified_at', name: 'email_verified_at' },
{ data: 'roles', name: 'roles.title' },
{ data: 'actions', name: '{{ trans('global.actions') }}' }
    ],
    orderCellsTop: true,
    order: [[ 2, 'desc' ]],
    pageLength: 100,
  };
  let table = $('.datatable-Agent').DataTable(dtOverrideGlobals);
  $('a[data-toggle="tab"]').on('shown.bs.tab click', function(e){
      $($.fn.dataTable.tables(true)).DataTable()
          .columns.adjust();
  });
  
let visibleColumnsIndexes = null;
$('.datatable thead').on('input', '.search', function () {
      let strict = $(this).attr('strict') || false
      let value = strict && this.value ? "^" + this.value + "$" : this.value

      let index = $(this).parent().index()
      if (visibleColumnsIndexes !== null) {
        index = visibleColumnsIndexes[index]
      }

      table
        .column(index)
        .search(value, strict)
        .draw()
  });
table.on('column-visibility.dt', function(e, settings, column, state) {
      visibleColumnsIndexes = []
      table.columns(":visible").every(function(colIdx) {
          visibleColumnsIndexes.push(colIdx);
      });
  });
table.on('responsive-resize', function ( e, datatable, columns ) {
    hideSearchInputs(columns);
 });
$(document).on('click', '.approve-btn', function(e){
    let id = $(this).data('approve-agent-id');
    var url = "{{ route('admin.agents.approve', ":id") }}";
    url = url.replace(':id', id);

    //prevent the default action of the tag
    event.preventDefault();
    //confirm
    var conf = confirm('Are you sure want to approve?');
    if (conf) {
        $.ajax({
            headers: {'x-csrf-token': _token},
            method: 'POST',
            url: url,
            data: { ids: id },
        }).done(function(response){
            if(response == undefined)
            {
                location.reload()
            }
            else
            {
                if(response.status_code == 500)
                {
                    alert(response.message);
                }
            }
        })
    }
    else {
        return;
    }
})

$(document).on('click', '.abandon-btn', function(e){
    let id = $(this).data('abandon-agent-id');
    var url = "{{ route('admin.agents.abandon', ":id") }}";
    url = url.replace(':id', id);

    //prevent the default action of the tag
    event.preventDefault();
    //confirm
    var conf = confirm('Are you sure want to abandon?');
    if (conf) {
        $.ajax({
            headers: {'x-csrf-token': _token},
            method: 'POST',
            url: url,
            data: { ids: id },
        }).done(function(response){
            if(response == undefined)
            {
                location.reload()
            }
            else
            {
                if(response.status_code == 500)
                {
                    alert(response.message);
                }
            }
        })
    }
    else {
        return;
    }
})

$(document).on('click', '.recover-btn', function(e){
    let id = $(this).data('recover-agent-id');
    var url = "{{ route('admin.agents.recover', ":id") }}";
    url = url.replace(':id', id);

    //prevent the default action of the tag
    event.preventDefault();
    //confirm
    var conf = confirm('Are you sure want to recover?');
    if (conf) {
        $.ajax({
            headers: {'x-csrf-token': _token},
            method: 'POST',
            url: url,
            data: { ids: id },
        }).done(function(response){
            if(response == undefined)
            {
                location.reload()
            }
            else
            {
                if(response.status_code == 500)
                {
                    alert(response.message);
                }
            }
        })
    }
    else {
        return;
    }
})

function SimpleUploadAdapter(editor) {
    editor.plugins.get('FileRepository').createUploadAdapter = function(loader) {
    return {
        upload: function() {
          return loader.file
            .then(function (file) {
              return new Promise(function(resolve, reject) {
                // Init request
                var xhr = new XMLHttpRequest();
                xhr.open('POST', '{{ route('admin.agent-reject-list-data.storeCKEditorImages') }}', true);
                xhr.setRequestHeader('x-csrf-token', window._token);
                xhr.setRequestHeader('Accept', 'application/json');
                xhr.responseType = 'json';

                // Init listeners
                var genericErrorText = `Couldn't upload file: ${ file.name }.`;
                xhr.addEventListener('error', function() { reject(genericErrorText) });
                xhr.addEventListener('abort', function() { reject() });
                xhr.addEventListener('load', function() {
                  var response = xhr.response;

                  if (!response || xhr.status !== 201) {
                    return reject(response && response.message ? `${genericErrorText}\n${xhr.status} ${response.message}` : `${genericErrorText}\n ${xhr.status} ${xhr.statusText}`);
                  }

                  $('form').append('<input type="hidden" name="ck-media[]" value="' + response.id + '">');

                  resolve({ default: response.url });
                });

                if (xhr.upload) {
                  xhr.upload.addEventListener('progress', function(e) {
                    if (e.lengthComputable) {
                      loader.uploadTotal = e.total;
                      loader.uploaded = e.loaded;
                    }
                  });
                }

                // Send request
                var data = new FormData();
                data.append('upload', file);
                data.append('crud_id', '{{ $agent->id ?? 0 }}');
                xhr.send(data);
              });
            })
        }
      };
    }
}

var allEditors = document.querySelectorAll('.ckeditor');
for (var i = 0; i < allEditors.length; ++i) {
    ClassicEditor.create(
        allEditors[i], {
            extraPlugins: [SimpleUploadAdapter]
        }
    ).then(editor => {
        $('#datatablesRejectModal').on('hidden.bs.modal', function (e) {
            $("#reject_type").val(0);
            editor.setData('');
        })
    })
}

});

</script>
@endsection