@extends('panel.layouts.app')
@section('page-title')
<title>
{{ LaraCore::setting('html_prefix') }} {{ (LaraCore::setting('html_prefix') != '') ? '|' : '' }} Complaints</title>
@stop
@section('content')
<div class="content-wrapper">
  <div class="row">
    <div class="col-md-1"></div>
    <div class="col-md-10">
      <section class="content">
        <div class="box box-default">
          <div class="box-header with-border">
            <i class="fa fa-comments"></i>
            <h3 class="box-title">Complaints</h3>
            <div class="box-tools box-tools-common pull-right">
              @if(LaraCore::canOrNot('delete_carriers'))
              <a href="javascript:void(0)" class="btn btn-box-tool show-tooltip" data-toggle="modal" data-target="#delete_complaint_modal"  title="Delete selected items" id="deleteAll" name="remove_complaints">
                <i class="fa fa-trash"></i>
              </a>
              @endif
              <a href="javascript:void(0)" class="btn btn-box-tool show-tooltip" onclick="ToggleDataTable('complaints-grid')" title="Search"><i class="fa fa-search"></i></a>
              <a href="javascript:void(0)" data-toggle="modal" data-target="#complaints_modal" class="btn btn-box-tool show-tooltip" title="Add Complaints"><i class="fa fa-plus"></i></a>
            </div>
          </div>
          <div class="box-body">
            <div class="table-responsive">
              <table id="complaints-grid" class="table table-bordered table-hover display">
                <thead>
                  <th>Id</th> 
                  <th class="text-center">
                    @if(LaraCore::canOrNot('delete_carriers'))
                    <input name="select_all" type="checkbox"  class="minimal" id="bulk_delete" data-scope="#complaints-grid" />
                    @endif
                  </th>
                  <th>#Complaint</th>
                  <th>Date</th>
                  <th>Parcel Type</th>
                  <th>Name</th>
                  <th>Consignment</th>
                  <th>Phone</th>
                  <th>Description</th>
                  <th>Status</th>
                  <th>&nbsp;</th>
                </thead>
                <tbody>
                </tbody>
              </table>
            </div>
          </div>
        </div>
        <div class="complaints_modal_div">
          <div class="edit_modal">
          </div>
          @include('panel.complaints.create', [@$data])
        </div>
        @include('common.modal.delete_confirm_modal',['entity' =>  'complaint'])
      </section>
    </div>
    <div class="col-md-1"></div>
  </div>
</div>
@stop
@section('custom-scripts')
<script type="text/javascript">
  var rows_selected  = "";
  $(document).ready(function () {
    initDate('{{AppHelper::dateFormatJS(LaraCore::setting('date_format'))}}');
    initDateRange('{{AppHelper::dateFormatJS(LaraCore::setting('date_format'))}}');
    initFileInput();
    initRichText();
    ComplaintsTable = $('#complaints-grid').DataTable({
      'language': { "emptyTable": '{{LaraCore::setting('no_records')}}', "processing": "<i class='fa fa-spinner fa-spin fa-3x'></i>" },
      "aLengthMenu": [[10, 20, 30, 40, 50, -1], [10, 20, 30, 40, 50, 'All']],
      "order": [ 0, "desc" ],
      processing: true,
      serverSide: true,
      ajax: {
        url : '{{route("complaints.list")}}',
        type: 'POST',
      },
      columns: [
      {data: 'id', name: 'complaints.id',visible: false,searchable: false},
      {data: 'bulk_delete', name: 'bulk_delete',orderable: false,searchable: false, width: '5%', className: 'text-center', visible: '{{LaraCore::canOrNot("delete_carriers")}}'},
      {data: 'id', name: 'id'},
      {data: 'date', name: 'date'},
      {data: 'parcel_type', name: 'parcel_type'},
      {data: 'from', name: 'from'},
      {data: 'consignment_no', name: 'consignment_no'},
      {data: 'phone', name: 'phone'},
      {data: 'description', name: 'description'},
      {data: 'status', name: 'status'},
      {data: 'actions', name: 'actions', orderable:false,searchable:false,className:'text-center'},
      ],'rowCallback': function(row, data, dataIndex){
              var rowId = data['id']; // Get row ID
              if($.inArray(rowId, rows_selected) !== -1){
                $(row).find('.entity_chkbox').prop('checked', true);
                $(row).addClass('selected');
              }
            },
          });
    initSelectAll('#complaints-grid', ComplaintsTable);

    $(document).on('click', 'button[name="create_complaints"]', function (e) {
      e.preventDefault();
      createComplaints();
    });


    $(document).on('click', 'button[name="remove_complaints"]', function(e){
      e.preventDefault();
      var complaints_id = $(this).data('id') || "";
      if(complaints_id != ""){
        deselect_all();
        $('#complaints-grid tbody input[type="checkbox"].entity_chkbox:checked').iCheck('uncheck');
        rows_selected.push(complaints_id);
        $('#delete_complaint_modal').modal('show');
      }
    });

    $(document).on('click', '#delete_complaint', function(e){
      var complaints_ids = rows_selected;
      var formData = { complaints_ids :complaints_ids };
      var url = APP_URL+"/complaint-delete";
      $.ajax({
        type: "POST",
        url: url,
        data: formData,
        dataType: 'json',
        success: function (data) {
          ComplaintsTable.draw();
          $('#delete_complaint_modal').modal('hide');
          DisplayMessages(data['message']);
          // refreshHeader();
        },
        error: function (jqXHR, exception) {
          var Response = jqXHR.responseText;
          Response = $.parseJSON(Response);
          DisplayMessages(Response.message,'error');
        }
      });
    });

    getClientData();

  });

  $(document).on('hidden.bs.modal', '#complaints_modal',function (event) {
    $('.complaints_modal_div .edit_modal').html('');
    var form = $("#complaints_save");
    $(form)[0].reset();
    form.find('input[name="id"]').val('');
    var firstSelectTypeVal = form.find('select[name="type"]').find('option:first').val();
    $('select[name="type"]').val(firstSelectTypeVal).change();

    var firstSelectFromVal = form.find('select[name="from"]').find('option:first').val();
    $('select[name="from"]').val(firstSelectFromVal).change();

    $(form).find('.has-error').removeClass('has-error');
    $(form).find('.help-block').html('');
  });

  $(document).on('shown.bs.modal', '#complaints_modal',function (event) {
    var form = $("#complaints_save");
    $(form)[0].reset();
    $(form).find('.has-error').removeClass('has-error');
    $(form).find('.help-block').html('');
  });

  function getClientData(){
    var form = $("#complaints_save");
    var parcel_type = form.find('select[name="parcel_type"]').val();
    var type = form.find('select[name="type"]').val();
    var APP_URL = $('meta[name="_base_url"]').attr('content');
    var url = APP_URL + '/filter-complaint-data';
    $("#from").select2({
      placeholder: 'Select from',
      minimumInputLength: 1,
      ajax: {
        url: url,
        dataType: 'json',
        type: "post",
        quietMillis: 50,
        data: function (term) {
          return {
            term: term,
            parcel_type: form.find('select[name="parcel_type"]').val(),
            type: form.find('select[name="type"]').val()
          };
        },
        processResults: function (data) {
            return {
                results: $.map(data, function (item) {
                    return {
                        text: item.disp_fromat,
                        id: item.id
                    }
                })
            };
        }
      }
    });
    // $('#from').on('select2:select', function (e) {
    //   var form = $("#complaints_save");
    //   var id = this.value;
    //   var type = form.find('select[name="type"]').val();
    //   var APP_URL = $('meta[name="_base_url"]').attr('content');
    //   var url = APP_URL + '/complaint-data';
    //   $(".master-loader").show();
    //   $.ajax({
    //     type: "post",
    //     url: url,
    //     data: {'id':id, 'type':type},
    //     dataType: "json",
    //     success: function (data) {
    //       initIcheck();
    //       initSelect();
    //       initDate('{{AppHelper::dateFormatJS(LaraCore::setting('date_format'))}}');
    //       initDateRange('{{AppHelper::dateFormatJS(LaraCore::setting('date_format'))}}');
    //       if (data.status = 'success') {
    //         var phone = data.phone;
    //         form.find('input[name="phone"]').val(phone);
    //         var optionsAsString = '<option></option> <option value="Add new">Add new</option>';
    //         $.each(data.consignment_no, function(i, item) {
    //           optionsAsString += "<option value='" + item + "'>" + item + "</option>";
    //         });
    //         form.find('select[name="consignment_no"]').html(optionsAsString);
    //         $(".master-loader").fadeOut();
    //         $(form).find('.has-error').removeClass('has-error');
    //         $(form).find('.help-block').html('');
    //       } else {
    //         $(".master-loader").fadeOut();
    //         $(form).find('.has-error').removeClass('has-error');
    //         $(form).find('.help-block').html('');
    //       }
    //     }
    //   });      
    // });
  }

  function createComplaints(){  
    var form = $("#complaints_save");
    var formData = $(form).serialize();
    var url = $(form).attr('action');
    var id = form.find('input[name="id"]').val();       
    $(form).find('.has-error').removeClass('has-error');
    $(form).find('.help-block').html('');
    var type = "POST";
    var options = {
      target: '',
      url: url,
      type: type,
      success: function(data) {
        $(form)[0].reset();
        form.find('input[name="id"]').val('');
        var firstSelectFromVal = $('select[name="from"]').find('option:first').val();
        $('select[name="from"]').val(firstSelectFromVal).change();
        $("#complaints_modal").modal('hide');
        ComplaintsTable.draw(true);
        DisplayMessages(data['message']);
        // refreshHeader();
      },
      error: function (jqXHR, exception) {
        var Response = jqXHR.responseText;
        ErrorBlock = $(form);
        Response = $.parseJSON(Response);
        DisplayErrorMessages(Response, ErrorBlock, 'input');
      }
    }
    $(form).ajaxSubmit(options);
  }

  function SetEditComplaints(element){
    var Form = $("#complaints_save");
    var Id = $(element).attr('data-id');
    var APP_URL = $('meta[name="_base_url"]').attr('content');
    var url = APP_URL + '/complaint/' + Id + '/edit';
    $(".master-loader").show();
    $.ajax({
      type: "GET",
      url: url,
      data: "id=" + Id,
      dataType: "json",
      success: function (res) {
        $('.complaints_modal_div .edit_modal').html(res.modal);
        initIcheck();
        initSelect();
        initDate('{{AppHelper::dateFormatJS(LaraCore::setting('date_format'))}}');
        initDateRange('{{AppHelper::dateFormatJS(LaraCore::setting('date_format'))}}');
        $(".master-loader").fadeOut();
        $('#complaints_modal').modal('show');
        getClientData();

      }
    });
  }

  function initFileInput(){
    file_inputs = $('input[type="file"]');
    if(file_inputs.length > 0){
      $.each(file_inputs, function(index, element) {
        file_input_name = $(this).attr('name');

        var file_input_src = "";
        var file_input_config = new Array();

        var input_src = $('input[name="'+file_input_name+'"]').data('src');

        if(input_src != "" && input_src !== undefined){
          var file_input_src = input_src.split(",");
          var input_src_names =  $('input[name="'+file_input_name+'"]').data('names');;
          var input_src_names_arr = input_src_names.split(",");
          $.each(file_input_src, function(index, element) {
            file_input_src[index] = APP_URL+'/assets/uploads/complaints/'+file_input_src[index];
          });
          $.each(input_src_names_arr, function(i, e) {
            file_type = getFileType(file_input_src[i]);
            obj = { type: file_type, caption:  input_src_names_arr[i], showDelete: false, showZoom: true}
            file_input_config.push(obj);
          });
        }else{
          file_input_config.push({});
        }
        var file_input_options = getFileInputOptions();
        $.extend( file_input_options, {
          initialPreview: file_input_src,
          initialPreviewConfig: file_input_config,
        });
        $(this).fileinput(file_input_options);

        var file_input_name = $(this).attr('name');
        $(this).on('filecleared', function(event) {
          var file_input_src = "";

          var file_input_options = getFileInputOptions();
          $.extend( file_input_options, {
            initialPreview: file_input_src,
            initialPreviewConfig: [ {caption: "", filename: "", showDelete: false,  showZoom: true} ,]
          });
          $(this).fileinput('refresh',file_input_options);
          var input_name = file_input_name.replace('[]', '');
          $('input[name="'+input_name+'_token"]').val('default.jpg');
        });
      });
    }
  }

  function checkValue(element){
    var value = $(element).val();
    if(value=='Add new'){
      $('#consignment-input').removeClass('hide');
      $('#consignment-dropdown').addClass('hide');
      $(element).val('');
      $(element).attr('name','');
      $('#consignment-input').find('input').attr('name','consignment_no')
    }else{
      $('#consignment-input').addClass('hide');
      $('#consignment-input').find('input').attr('name','')
      $(element).attr('name','consignment_no');
      $('#consignment-dropdown').removeClass('hide');
    }
  }

  function resetConsignment(){
    $('#consignment_no').val('').change();
  }

  function changeTypeValue(element){
    var id = $(element).val();
    var form = $("#complaints_save");
    var APP_URL = $('meta[name="_base_url"]').attr('content');
    var url = APP_URL + '/get-from-data';
    $(".master-loader").show();
    $.ajax({
      type: "post",
      url: url,
      data: {'id':id},
      dataType: "json",
      success: function (data) {
        initIcheck();
        initSelect();
        initDate('{{AppHelper::dateFormatJS(LaraCore::setting('date_format'))}}');
        initDateRange('{{AppHelper::dateFormatJS(LaraCore::setting('date_format'))}}');
        if (data.status = 'success') {
          var optionsAsString = '<option></option>';
          $.each(data.from, function(i, item) {
            optionsAsString += "<option value='" + i + "'>" + item + "</option>";
          });
          form.find('select[name="from"]').html(optionsAsString);
          $(".master-loader").fadeOut();
          $(form).find('.has-error').removeClass('has-error');
          $(form).find('.help-block').html('');
        } else {
          $(".master-loader").fadeOut();
          $(form).find('.has-error').removeClass('has-error');
          $(form).find('.help-block').html('');
        }
      }
    });
  }

</script>
@stop