@extends('layouts.default', ['appTopMenu' => true])

@section('title', 'My Feedback List')


@push('scripts')
<script type="text/javascript" src="{{ asset('/assets/dcopying/toastr/toastr.min.js') }}"></script>
<link href="{{ asset('/assets/dcopying/toastr/toastr.min.css') }}" rel="stylesheet" />
<link href="{{ asset('assets/plugins/bootstrap-datepicker/dist/css/bootstrap-datepicker.css') }}" rel="stylesheet" />
<script src="{{ asset('assets/plugins/bootstrap-datepicker/dist/js/bootstrap-datepicker.js') }}"></script>


<link href="{{ asset('assets/dcopying/css/custom.css')}}" rel="stylesheet" />


<link href="{{ asset('assets/plugins/datatables.net-bs5/css/dataTables.bootstrap5.min.css')}}" rel="stylesheet" />
<link href="{{ asset('assets/plugins/datatables.net-responsive-bs5/css/responsive.bootstrap5.min.css')}}" rel="stylesheet" />
<script src="{{ asset('assets/plugins/datatables.net/js/jquery.dataTables.min.js')}}"></script>
<script src="{{ asset('assets/plugins/datatables.net-bs5/js/dataTables.bootstrap5.min.js')}}"></script>
<script src="{{ asset('assets/plugins/datatables.net-responsive/js/dataTables.responsive.min.js')}}"></script>
<script src="{{ asset('assets/plugins/datatables.net-responsive-bs5/js/responsive.bootstrap5.min.js')}}"></script>
<script type="text/javascript" src="{{ asset('/assets/dcopying/js/custom.js') }}"></script>


@endpush



@section('content')



<div class="panel">

  <div class="panel-heading card-bg-color text-white">
    <h4 class="panel-title"><i class="fa-solid fa-list"></i> My Feedback List</h4>

  </div>

  <div class="panel-body">
    <form method="POST" id="datatable_form" action="">

      <div class="row g-3 align-items-center mb-1">

        <div class="col-md-3">
          <div class="mb-3">
            <label for="keyword" class="form-label">Find Keyword</label>
            <input type="text" id="search" name="search_key" class="form-control" placeholder="Search..">
          </div>
        </div>
        <div class="col-md-2">
          <div class="mb-3">
            <label for="to_date" class="form-label">Case Status</label>
            <select class="form-control" name="case_status">
              <option value="">--Select--</option>
              <option value="D" {{ request()->input('case_status', old('case_status')) == "D" ? 'selected' : '' }}>Dispose</option>
              <option value="P" {{ request()->input('case_status', old('case_status')) == "P" ? 'selected' : '' }}>Pending</option>
            </select>
          </div>
        </div>
        <div class="col-md-2">
          <div class="mb-3">
            <label for="to_date" class="form-label">Scaning Status</label>
            <select class="form-control" name="scan_status">
              <option value="">--Select--</option>
              <option value="Y" {{ request()->input('scan_status', old('scan_status')) == "D" ? 'selected' : '' }}>Completed</option>
              <option value="N" {{ request()->input('scan_status', old('scan_status')) == "P" ? 'selected' : '' }}>Pending</option>
            </select>
          </div>
        </div>
        <div class="col-md-3">
          <div class="mb-3">
            <label for="to_date" class="form-label">Received Date</label>
            <input type="text" class="form-control date" id="to_dt" placeholder="Received Date" name="to_dt" readonly="">
          </div>
        </div>

        <div class="col-auto">

          <button type="submit" class="btn btn-outline-primary rounded-0 btn-sm"><i class="fa-solid fa-magnifying-glass"></i> Search</button>
          <button type="button" class="btn btn-outline-warning reset_from rounded-0 btn-sm"><i class="fas fa-sync-alt"></i> Reset Search</button>
        </div>

      </div>





    </form>

   


    <button class="btn btn-outline-primary rounded-0 btn-sm float-end btn-sm print_btn"  data-loading-text="<i class='fa-solid fa-circle-notch fa-spin'></i> Printing..."> <i class="fa-solid fa-print"></i> Print</button>
    <table id='dt_table' class="table table-striped table-bordered align-middle">
      <thead>
        <tr>
          <th width="5%">S.No.</th>
          <th width="8%">Application No</th>
          <th width="30%">Message</th>
          <th width="8%">Recived Date</th>
          <th width="8%">Mobile</th>
          <th width="8%">Case Status</th>
          <th width="5%">Scaning Status</th>

        </tr>
      </thead>
    </table>


  </div>
</div>


<!-- Modal -->
<div class="modal fade" id="viewApplication" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-xl">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Application</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body min-h">
        <div class="modal_loader_div" style="display: none;"></div>
        <div class="modal-body-inner"></div>

      </div>

    </div>
  </div>
</div>




<!-- Modal -->
<div class="modal fade" id="updateApplication" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-xl">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Update Feedback</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body min-h">
        <div class="modal_loader_div" style="display: none;"></div>
        <div class="modal-body-inner"></div>

      </div>

    </div>
  </div>
</div>

<!-- end panel -->
@endsection

@push('scripts')

<script>
    var style_path="{{ asset('/assets/dcopying/css/print.css') }}";
  // ===============
  $(document).ready(function() {

    
    backDropModal('updateApplication');
  });

  $(document).on('click', '.withdraw_application', function(e) {
    var recordid = $(this).data('recordId');
    getFeedback(recordid);

  });

  let getFeedback = (recordid) => {
    $.ajax({

      url: "{{ route('hccopying.feedback.getfeedback') }}",

      type: "GET",
      data: {
        "recordid": recordid
      },
      dataType: 'json',
      beforeSend: function() {
        $('#updateApplication').modal('show');
        $('#updateApplication .modal-body .modal-body-inner').html("");
        $('#updateApplication .modal-body .modal_loader_div').css("display", "block");

      },
      success: function(data) {
        $('#updateApplication .modal-body .modal-body-inner').html(data.page);
        $('#updateApplication .modal-body .modal_loader_div').fadeOut(400);
      },
      error: function(xhr) { // if error occured
        alert("Error");

      },
      complete: function() {

      }
    });
  }




  // ====


  $(".date").datepicker({
    todayHighlight: true,
    autoclose: true,
    format: 'dd-mm-yyyy'
  });

  function form_to_json(selector) {
    var ary = $(selector).serializeArray();
    console.log(ary);
    var obj = {};
    for (var a = 0; a < ary.length; a++) obj[ary[a].name] = ary[a].value;
    return obj;
  }


  $(document).ready(function() {
    backDropModal('viewApplication');
    initDatatable('dt_table', "{{ url('hccopying/application/myfeedbacklist_dttable') }}", form_to_json('#datatable_form'), [], 50, [{
      "bSortable": false,
      "aTargets": [-1],
      'sClass': 'dt-body-right'
    }], false, []);

    $(document).on('click', '.print_btn', function() {

      let _this = $(this);
      $.ajax({
        url: "{{ url('hccopying/application/download_myfeedbacklist') }}",
        type: 'POST',
        dataType: 'JSON',
        data: $('#datatable_form').serialize(),
        headers: {
          'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        beforeSend: function() {

          _this.button('loading');
        },

        success: function(response) {

          printDiv(response.page);
          _this.button('reset');

        },
        error: function(xhr) {
          _this.button('reset');

        },
        complete: function() {
          _this.button('reset');
        }
      });

    });
  });




 
  function printDiv(contents) {

        var frame1 = $('<iframe />');
        frame1[0].name = "frame1";
        frame1.css({ "position": "absolute", "top": "-1000000px" });
        $("body").append(frame1);
        var frameDoc = frame1[0].contentWindow ? frame1[0].contentWindow : frame1[0].contentDocument.document ? frame1[0].contentDocument.document : frame1[0].contentDocument;
        frameDoc.document.open();
        //Create a new HTML document.
        frameDoc.document.write('<html><head><title>DIV Contents</title>');
        frameDoc.document.write('</head><body>');
        //Append the external CSS file.
        frameDoc.document.write('<link rel=\"stylesheet\" href=\"' + style_path + '\" type=\"text/css\" media=\"all\" > ');
        //Append the DIV contents.
        frameDoc.document.write(contents);
        frameDoc.document.write('</body></html>');
        frameDoc.document.close();
        setTimeout(function () {
            window.frames["frame1"].focus();
            window.frames["frame1"].print();
            frame1.remove();
        }, 500);
}



  $(document).on('click', '.reset_from', function() {
    form_reset('datatable_form');
    initDatatable('dt_table', "{{ url('hccopying/application/myfeedbacklist_dttable') }}", [], [], 50, [{
      "bSortable": false,
      "aTargets": [-1],
      'sClass': 'dt-body-right'
    }], false, []);
  });

  $(document).on('submit', '#datatable_form', function(e) {
    initDatatable('dt_table', "{{ url('hccopying/application/myfeedbacklist_dttable') }}", form_to_json('#datatable_form'), [], 50, [{
      "bSortable": false,
      "aTargets": [-1],
      'sClass': 'dt-body-right'
    }], false, []);
    e.preventDefault();
  })



  $(document).on("submit", "form#withdrawal_application", function(e) {
    e.preventDefault();
    let _this = $(this);

    $.ajax({
      url: _this.attr("action"),
      type: _this.attr("method"),
      dataType: "JSON",
      data: $(this).serialize(),
      headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
      },
      beforeSend: function() {

        _this.closest('form').find(':submit').button('loading');
      },

      success: function(response) {
        successMsg(response.msg);

        _this.closest('form').find(':submit').button('reset');
        $('#updateApplication').modal('hide');
        dt_tables.ajax.reload(null, false);
      },
      error: function(xhr) {
        _this.closest('form').find(':submit').button('reset');

      },
      complete: function() {
        _this.closest('form').find(':submit').button('reset');
      }
    });
  });



  function form_reset(form_id) {
    $("#" + form_id).find('input:text, input:password, input:file, select, textarea').val('');

  }
</script>

@endpush