@extends('panel.layouts.superadmin.app')
@section('page-title')
<title>
{{ LaraCore::setting('html_prefix') }} {{ (LaraCore::setting('html_prefix') != '') ? '|' : '' }} Page Tracking</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-list-alt"></i>
            <h3 class="box-title">Page Tracking</h3>
          </div>
          <div class="box-header with-border head-design">
            <div class="col-md-3">
              <div class="form-group has-feedback">
                <label>Start Date</label>
                <div class="input-group ">
                  {{Form::text( 'start_date', $start_date, [ "class" => "form-control", "id" => 'start_date' ]) }}
                  <div class="input-group-addon"> <i class="fa fa-calendar"></i> </div>
                </div>
              </div>
            </div>
            <div class="col-md-3">
              <div class="form-group has-feedback">
                <label>End Date</label>
                <div class="input-group ">
                  {{Form::text( 'end_date', $start_date, [ "class" => "form-control", "id" => 'end_date' ]) }}
                  <div class="input-group-addon"> <i class="fa fa-calendar"></i> </div>
                </div>
              </div>
            </div>
            <div class="col-md-2">
              <div class="form-group has-feedback">
                <label>Pages</label>
                {{ Form::select('pages', $pages,'',["class"=>'form-control filter select2', 'id' => 'pages']) }}
              </div>
            </div>
            <div class="col-md-4">
              <div class="new-btn">
                <button value="Reset" class="btn btn-sm btn-default btn-block reset-report-filter">Reset</button>
              </div>
            </div>
          </div>
          <div class="box-body">
            <div class="table-responsive">
              <table id="page-tracking-grid" class="table table-bordered table-hover display">
                <thead>
                  <th>Id</th> 
                  <th>Name</th> 
                  <th>Account</th>
                  <th>Date</th>
                </thead>
                <tbody>
                </tbody>
              </table>
            </div>
          </div>
        </div>
        <div class="parcels_modal_div">
          <div class="edit_modal">
          </div>
        </div>
      </section>
    </div>
    <div class="col-md-1"></div>
  </div>
</div>
@stop
@section('custom-scripts')
<script type="text/javascript">
  var rows_selected  = "";
  $(document).ready(function () {
    $("[rel=tooltip]").tooltip({html:true});
    $('#start_date, #end_date').daterangepicker({
      singleDatePicker: true,
      autoUpdateInput: true,
      drops: "down",
      locale: {
        format: '{{AppHelper::dateFormatJS(LaraCore::setting('date_format'))}}',
      },
    }).on('change', function(e) {
      PageTrackingTable.draw();
    });
    initDate('{{AppHelper::dateFormatJS(LaraCore::setting('date_format'))}}');
    initDateRange('{{AppHelper::dateFormatJS(LaraCore::setting('date_format'))}}');
    initRichText();
    PageTrackingTable = $('#page-tracking-grid').DataTable({
      'language': { "emptyTable": '{{LaraCore::setting('no_records')}}', "processing": "<i class='fa fa-spinner fa-spin fa-3x'></i>" },
      "aLengthMenu": [[-1, 10, 20, 30, 40, 50], ['All', 10, 20, 30, 40, 50]],
      order: [ 0, "desc" ],
      processing: true,
      serverSide: true,
      ajax: {
        url : '{{route("post.page.tracking")}}',
        type: 'POST',
        data: function (d) {
          d._token = $('hidden[name=_token]').val();
          d.start_date = $('input[name=start_date]').val();
          d.end_date = $('input[name=end_date]').val();
          d.page = $('select[name=pages]').val();
        },
      },
      columns: [
        {data: 'id', name: 'id',visible: false,searchable: false},
        {data: 'name', name: 'name'},
        {data: 'client_code', name: 'client_code' ,searchable: true},
        {data: 'created_at', name: 'created_at' ,searchable: true},
        ],
      
    });
    initSelectAll('#page-tracking-grid', PageTrackingTable);
  });

  $( ".filter" ).change(function(e) {
    e.preventDefault();
    PageTrackingTable.draw();
  });
  $( ".reset-report-filter" ).click(function(e) {
    var start_date = '{{$start_date}}';
    var end_date = '{{$end_date}}';
    $('input[name=start_date]').val(start_date);
    $('input[name=end_date]').val(end_date);
    $('select[name=pages]').val('').change();
    PageTrackingTable.draw();
  });
</script>
@stop