@extends('panel.layouts.app')
@section('page-title')
<title>
{{ LaraCore::setting('html_prefix') }} {{ (LaraCore::setting('html_prefix') != '') ? '|' : '' }} Daily Collection</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">Daily Collection</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>Carriers</label>
                {{ Form::select('carriers', $carriers,'',["class"=>'form-control filter select2', 'id' => 'carriers']) }}
              </div>
            </div>
            <div class="col-md-2">
              <div class="form-group has-feedback err">
                <label>Booking Type</label>
                {{ Form::select('booking_type', $booking_type,'',["class"=>'form-control filter select2', 'id' => 'booking_type']) }}
              </div>
            </div>
            <div class="col-md-2">
              <div class="form-group has-feedback">
                <label>Clients</label>
                <i class="fa fa-info-circle text-right " rel="tooltip" data-original-title="Clients filter will work when <b>Booking Type</b> filter is applied!" style="float: right;"></i>
                <select id='clients' name='clients' class="form-control filter select2">
                <option value=''>Select client</option>
                @foreach ($clients as $value) 
                  @php
                  $id = explode(' | ', $value);
                  @endphp
                     <option value='{{$id[0]}}'>{{$id[1]}}</option>
                @endforeach
              </select>
                {{-- {{ Form::select('clients', $clients,'',["class"=>'form-control filter select2', 'id' => 'clients']) }} --}}
              </div>
            </div>
            <div class="col-md-12">
              <div class="pull-right">
                <div class="new-btn">
                  <button value="Reset" class="btn btn-sm btn-default btn-block reset-report-filter">Reset</button>
                </div>
                <div class="new-btn">
                  <button class="btn btn-sm btn-default btn-block" onclick="excelDailyCollectionReport(this)"><i class="fa fa-file-excel-o"></i> Excel</button>
                </div>
                <div class="new-btn">
                  <button class="btn btn-sm btn-default btn-block" onclick="printDailyCollectionReport(this)"><i class="fa fa-print"></i> Print</button>
                </div>
                <div class="new-btn">
                  <button class="btn btn-sm btn-default btn-block" onclick="printDailyCollectionReportNoCharges(this)"><i class="fa fa-print"></i> No Charges</button>
                </div>
                <div class="opt-btn pull-right">
                  <div class="box-tools box-tools-common pull-right">
                    <a href="javascript:void(0)" class="btn btn-box-tool show-tooltip" onclick="ToggleDataTable('daily-collection-grid')" title="Search"><i class="fa fa-search"></i></a>
                  </div>
                </div>
              </div>
            </div>

            {{ Form::open(["url"=>route('print.daily.collection.report'),"method"=>"POST","target"=>"_blank"]) }}
            {{ Form::hidden('start_date','',['id'=>'reportStartDate']) }}
            {{ Form::hidden('end_date','',['id'=>'reportEndDate']) }}
            {{ Form::hidden('carrier','',['id'=>'reportCarrier']) }}
            {{ Form::hidden('booking_type','',['id'=>'reportBookingType']) }}
            {{ Form::hidden('clients','',['id'=>'reportClient']) }}
            {{ Form::hidden('nocharges','',['id'=>'nocharges']) }}
            {{ Form::close() }}

            {{ Form::open(["url"=>route('excel.daily.collection.report'),"method"=>"POST"]) }}
            {{ Form::hidden('start_date','',['id'=>'excelReportStartDate']) }}
            {{ Form::hidden('end_date','',['id'=>'excelReportEndDate']) }}
            {{ Form::hidden('carrier','',['id'=>'excelReportCarrier']) }}
            {{ Form::hidden('booking_type','',['id'=>'excelReportBookingType']) }}
            {{ Form::hidden('clients','',['id'=>'excelReportClient']) }}
            {{ Form::close() }}

          </div>
          <div class="box-body">
            <div class="table-responsive">
              <table id="daily-collection-grid" class="table table-bordered table-hover display">
                <thead>
                  <th>A</th> 
                  <th>Id</th> 
                  <th>Date</th>
                  <th>Client</th>
                  <th>Center</th>
                  <th>Receiver</th>
                  <th>Carrier</th>
                  <th>Package Type</th>
                  <th>Consignment No</th>
                  <th>Weight</th>
                  <th>Amount</th>
                </thead>
                <tbody>
                </tbody>
                <tfoot>
                  <tr class="bg-color-foot-color">
                    <th colspan="10" class="border-style"> <b>Total Amount:</b></th>
                    <th class="border-style"></th>
                  </tr>
                </tfoot>
              </table>
            </div>
          </div>
        </div>
        <div class="parcels_modal_div">
          <div class="edit_modal">
          </div>
        </div>
        @include('common.modal.send_report_mail_confirm_model',['entity' =>  'parcel_report'])
      </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) {
      DailyCollectionTable.draw();
    });
    initDate('{{AppHelper::dateFormatJS(LaraCore::setting('date_format'))}}');
    initDateRange('{{AppHelper::dateFormatJS(LaraCore::setting('date_format'))}}');
    initRichText();
    DailyCollectionTable = $('#daily-collection-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.daily.collection")}}',
        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.carrier = $('select[name=carriers]').val();
          d.booking_type = $('select[name=booking_type]').val();
          d.clients = $('select[name=clients]').val();
        },
      },
      columns: [
      {data: 'sort_date', name: 'sort_date',visible: false,searchable: false},
      {data: 'id', name: 'id',visible: false,searchable: false},
      {data: 'date', name: 'date'},
      {data: 'client_name', name: 'client_name' ,searchable: true},
      {data: 'center_name', name: 'center_name' ,searchable: true},
      {data: 'receiver_name', name: 'receiver_name' ,searchable: true},
      {data: 'carrier_name', name: 'carrier_name' ,searchable: true},
      {data: 'package_type', name: 'package_type' ,searchable: true},
      {data: 'consignment_no', name: 'consignment_no'},
      {data: 'weight', name: 'weight', class:'text-right'},
      {data: 'net_amt', name: 'net_amt', class:'text-right'},
      ],
      footerCallback: function (row, data, start, end, display){
        var api = this.api(), data;
        var intVal = function ( i ) {
          return typeof i === 'string' ?
          i.replace(/[\$,]/g, '')*1 :
          typeof i === 'number' ?
          i : 0;
        };

        net_amt = api
        .column(10)
        .data()
        .reduce( function (a, b) {
          return intVal(a) + intVal(b);
        }, 0 );

        $( api.column(10).footer() ).html(
          Number(net_amt).toLocaleString('en')
          );
      },
    });
    initSelectAll('#daily-collection-grid', DailyCollectionTable);
  });

  $( ".filter" ).change(function(e) {
    e.preventDefault();
    DailyCollectionTable.draw();
  });
  $( ".reset-report-filter" ).click(function(e) {
    $('.err').removeClass('has-error');
    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=carriers]').val('').change();
    $('select[name=booking_type]').val('').change();
    $('select[name=clients]').val('').change();
    DailyCollectionTable.draw();
  });

  function excelDailyCollectionReport(element){
    var startDate = $('input[name=start_date]').val();
    var endDate = $('input[name=end_date]').val();
    var carrier = $('select[name=carriers]').val();
    var bookingType = $('select[name=booking_type]').val();
    var client = $('select[name=clients]').val();

    if ( (client == '' || client == null) && (bookingType == '' || bookingType == null) ) {
      $('.err').removeClass('has-error');
      $('#excelReportStartDate').val(startDate);
      $('#excelReportEndDate').val(endDate);
      $('#excelReportCarrier').val(carrier);
      $('#excelReportBookingType').val(bookingType);
      $('#excelReportClient').val(client);
      $('#excelReportStartDate').parents('form').submit();
    } else if ( (client != '' || client != null) && (bookingType == '' || bookingType == null) ) {
      toastr.error('Please select booking type !', 'Error !', { onHidden: function() {          
      }});
      $('.err').addClass('has-error');
    } else {
      $('.err').removeClass('has-error');
      $('#excelReportStartDate').val(startDate);
      $('#excelReportEndDate').val(endDate);
      $('#excelReportCarrier').val(carrier);
      $('#excelReportBookingType').val(bookingType);
      $('#excelReportClient').val(client);
      $('#excelReportStartDate').parents('form').submit();
    }
  }

  function printDailyCollectionReport(element){
    var startDate = $('input[name=start_date]').val();
    var endDate = $('input[name=end_date]').val();
    var carrier = $('select[name=carriers]').val();
    var bookingType = $('select[name=booking_type]').val();
    var client = $('select[name=clients]').val();
    
    if ( (client == '' || client == null) && (bookingType == '' || bookingType == null) ) {
      $('.err').removeClass('has-error');
      $('#reportStartDate').val(startDate);
      $('#reportEndDate').val(endDate);
      $('#reportCarrier').val(carrier);
      $('#reportBookingType').val(bookingType);
      $('#reportClient').val(client);
      $('#nocharges').val('no');
      $('#reportStartDate').parents('form').submit();
    } else if ( (client != '' || client != null) && (bookingType == '' || bookingType == null) ) {
      toastr.error('Please select booking type !', 'Error !', { onHidden: function() {          
      }});
      $('.err').addClass('has-error');
    } else {
      $('.err').removeClass('has-error');
      $('#reportStartDate').val(startDate);
      $('#reportEndDate').val(endDate);
      $('#reportCarrier').val(carrier);
      $('#reportBookingType').val(bookingType);
      $('#reportClient').val(client);
      $('#nocharges').val('no');
      $('#reportStartDate').parents('form').submit();
    }
  }

  function printDailyCollectionReportNoCharges(element){
    var startDate = $('input[name=start_date]').val();
    var endDate = $('input[name=end_date]').val();
    var carrier = $('select[name=carriers]').val();
    var bookingType = $('select[name=booking_type]').val();
    var client = $('select[name=clients]').val();

    if ( (client == '' || client == null) && (bookingType == '' || bookingType == null) ) {
      $('.err').removeClass('has-error');
      $('#reportStartDate').val(startDate);
      $('#reportEndDate').val(endDate);
      $('#reportCarrier').val(carrier);
      $('#reportBookingType').val(bookingType);
      $('#reportClient').val(client);
      $('#nocharges').val('yes');
      $('#reportStartDate').parents('form').submit();
    } else if ( (client != '' || client != null) && (bookingType == '' || bookingType == null) ) {
      toastr.error('Please select booking type !', 'Error !', { onHidden: function() {          
      }});
      $('.err').addClass('has-error');
    } else {
      $('.err').removeClass('has-error');
      $('#reportStartDate').val(startDate);
      $('#reportEndDate').val(endDate);
      $('#reportCarrier').val(carrier);
      $('#reportBookingType').val(bookingType);
      $('#reportClient').val(client);
      $('#nocharges').val('yes');
      $('#reportStartDate').parents('form').submit();
    }
    
  }
</script>
@stop