@include('common.header')
 <!-- /.info-box -->
 <div id="upload-info-box-content" style="display:none;">
          <div class="info-box bg-yellow">
            <span class="info-box-icon"><i class="fa fa-search"></i></span>

            <div class="info-box-content">
              <span class="info-box-text" id="upload-info-box-text">SEARCHING IN PROGRESS</span>
              <span class="info-box-number"  id="upload-info-box-number">41,410</span>

              <div class="progress">
                <div class="progress-bar" id="upload-progress-bar" style="width: 10%"></div>
              </div>
                  <span class="progress-description" id="upload-progress-description">
                    70% Increase in 30 Days
                  </span>
            </div>
            <!-- /.info-box-content -->
          </div>
          <!-- /.info-box -->
        </div>
         <!-- /.info-box -->

<section class="content">
    <div class="col-lg-12" id="load-overlay" name="load-overlay" style="display:none;">
        <div id="loader" ></div>
        <div id="overlay"></div>
	</div>


    <div class="row">
    @include('alert.alert_panel')
    
        <div class="col-xs-12">
            <div class="box box-info ">
                <form>
                    <div class="box-header">
                        <h3 class="box-title"><b>Search Transit Report By Station</b></h3>

                        <div class="box-tools">
                            <div style="width: 160px;">
                                <a href="{{ url('/hub/transit_report_view') }}"  class="btn btn-primary"><i class="fa fa-file"></i> NEW</a>
                                <button type="button" class="btn btn-warning pull-right"  onClick="print_transit()"><i class="fa fa-print"></i>Print</button>
                            </div>
                        
                        </div>
                    </div>
                    <!-- /.box-header -->
                    <div class="box-body table-responsive no-padding">
                        <table class="table">
                            <tr>
                                <td><input type="text"  class="form-control" style='display:none;'/></td>
                            </tr>
                            <tr>
                            
                                <td><label>Destination Station</label></td>
                                <td>   
                                    <div class="form-group">
                                                <select class="form-control select2" id="destination-station-select2" name="destination-station-select2" style="width: 100%;">
                                                    <option value="">Select Station</option>
                                                        @foreach($stations_list as $station)
                                                        <option value="{{ $station->code }}">{{ $station->stateShort }} - {{ $station->stateLong }}</option>
                                                        @endforeach
                                                </select>
                                    </div>
                                </td>
                                 
                            </tr>
                            <tr>
                                <td><b>From </b>date</td>
                                <td>
                                <input type="date" class="form-control input-sm" id="input-date-from" placeholder="" min="1900-01-01">
                                </td>
                                <td><b>To </b>date</td>
                                <td>
                                <input type="date" class="form-control input-sm" id="input-date-to" placeholder="" max="2050-01-01">
                                </td>
                                <td>
                                <button type="button" class="btn btn-info pull-right" onClick = "start_transit_search()">Search</button>
                                </td>
                              
                            </tr>

                             <tr>
                                <td colspan="5"><p id="print-button-p"></p></td>
                            </tr>
                            
                        </table>
                    </div>
                   
                </form>

                
        </div>

        
    </div>

                <div class="col-xs-12">
                    <div class="box">
                        <div class="box-header">
                        <h3 class="box-title">Transited List</h3>
                        
                        <button type="button" class="btn btn-success pull-right" id="count-label">0</button>
                        </div>
                        <!-- /.box-header -->
                        <div class="box-body table-responsive no-padding">
                        <table class="table table-hover" id="data-table" name = "data_table">
                            <thead><tr>
                            <th>Code</th>
                            <th>Description</th>
                            </tr>
                        </thead>
                        <tbody>
                        </tbody>
                        </table>
                        </div>
                        <!-- /.box-body -->
                    </div>
                    <!-- /.box -->
                    </div>
                    

                </div>

                
</section>
@include('common.footer')

<script>

var allWaybills = []

$('.select2').select2();

    $("#event-add-btn").click(function(e) {
        if( $('#event-code').val()!="" && $('#remarks-text').val()!="" )
        {

        add_tracking($('#event-code').val(),$('#remarks-text').val());
        $('#event-code').val("");
        $('#remarks-text').val("");
        $("#event-code" ).focus();
        $('#count-label').text($('#data-table tr').size()-1)
        }
    });
 
    var allWaybills=[]

    function start_transit_search()
    {
        allWaybills=[];
        transit_search(1);
    }

    function transit_search(pages)
    {  
     //AVTIVE LOADER
    $("#load-overlay").show();
            $.ajax(
            {
                type:"POST",//or POST
                url:"{{ URL::to('/hub/transit_report') }}?page="+pages,
                data: {
                    '_token': "{{ csrf_token() }}",
                    'destination': $("#destination-station-select2").val(),
                    'shipping_created_date_from': $("#input-date-from").val(),
                    'shipping_created_date_to': $("#input-date-to").val(),
                },
                success:function(responsedata)
                {
                    var process = parseInt((100/parseInt(responsedata.last_page))*(pages))
                                        displayProcess(process+"%","Fetching data process of "+(pages)+" of "+responsedata.last_page,process)

                                        if (responsedata)
                                        { 
                                            console.log(responsedata.last_page);
                                            allWaybills = allWaybills.concat(responsedata.data)

                                        }

                                        if(responsedata.last_page == pages || responsedata.last_page == 0)
                                        {
                                            $("#load-overlay").hide();
                                            $("#upload-info-box-content").hide();
                                            show_success("Search Completed")
                                            renderTable(allWaybills)
                                        }else{
                                            transit_search(pages+1)

                                        }

                }
                    
                
                });

    }

    function renderTable(data)
    {
        data = data.sort(compareValues('shipmentAuxID', 'desc'));
        $("#data-table .transit-data").remove();
        for(i in data)
                            {
                                $('#data-table').find('tbody').prepend(
                                                "<tr class = 'transit-data'>"+
                                                "<td>"+data[i].shipmentAuxID+"</td>"+
                                                "<td>"+data[i].description+"</td>"+
                                                "</tr>");
                                
                             }
        

        $('#count-label').text($('#data-table tr').size()-1)

    }

    function print_transit()
    {
        var data = new Array();
        //data = allWaybills.sort(compareValues('shipmentAuxID', 'desc'));

        for(var waybill of allWaybills )
        {
            data.push(waybill.shipmentAuxID);
        }

        data.sort();

        console.log(data)
        
          $.ajax({

          type:"POST",//or POST
          url:"{{ URL::to('/hub/transit_report/print') }}",
          data: {
              '_token': "{{ csrf_token() }}",
              auxID_array:data,
              from:$("#input-date-from").val(),
              to:$("#input-date-to").val(),
              destination:$("#destination-station-select2").val()
          },
            success:function(responsedata){
              $("#load-overlay").hide();  
                //window.open('url', '_blank');       
                var win = window.open();
              win.document.write(responsedata);       
            }
        });

    }



    function exportToExcel()
    {
        var temWaybills =[]

        for (i in allWaybills)
        {
            var waybill =[]
            waybill.code = allWaybills[i].shipmentAuxID
            waybill.Created_By = allWaybills[i].CreatedBy
            waybill.From = allWaybills[i].handlingWarehouseID
            waybill.Tracking_Type = allWaybills[i].activity
            waybill.Created_Date = IOSDateToLocalDateString(allWaybills[i].CreatedAt)
            waybill.Details = allWaybills[i].description

            temWaybills.push(waybill)
        }


        var type = $("#destination-station-select2").val()
        var from_date = $("#input-date-from").val()
        var to_date = $("#input-date-to").val()
        filename = type+'_'+from_date+' to '+to_date
        const xls = new XlsExport(temWaybills, 'BBB Tracking')
        xls.exportToXLS(filename+'.xls') 
    }

    function show_warning($msg)
    {
                    $("#invalid-warning-message").html($msg);
                    $("#invalid-warning").show();
                    $("#invalid-warning").delay(3000).hide(0, function() {});
    }

    function show_danger($msg)
    {
                    $("#invalid-danger-message").html($msg);
                    $("#invalid-danger").show();
                    $("#invalid-danger").delay(3000).hide(0, function() {});
    }

    function show_success($msg)
    {
                    $("#invalid-success-message").html($msg);
                    $("#invalid-success").show();
                    $("#invalid-danger").delay(3000).hide(0, function() {});
                    
    }

    function displayProcess(upload_info_box_number,upload_progress_description,width)
    {
        $("#upload-info-box-content").show();
        $('#upload-info-box-number').text(upload_info_box_number);
        $('#upload-progress-description').text(upload_progress_description);
        $("#upload-progress-bar").width(width+'%')
    }
</script>