@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-cloud-upload"></i>
    </span>
    <div class="info-box-content">
      <span class="info-box-text" id="upload-info-box-text">UPLOADING 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-xs-12" id="load-overlay" name="load-overlay" style="display:none;">
    <div id="loader"></div>
    <div id="overlay"></div>
  </div> @include('alert.alert_panel')
  <!-- ********************* -->
  <div class="box box-success">
    <div class="box-header">
      <h3 class="box-title">
        <b>Shipment</b> Import V2
      </h3>
      <div class="box-tools pull-right">
        <div style="width: 270px;">
          <a href="{{ asset('sample_excel/BBB_Import_Template_v2.xlsx')  }}" class="btn btn-success ">
            <i class="fa fa-download"></i> DOWNLOAD TEMPLATE </a>
          <a href="{{ url('/home/waybill_import_v2') }}" class="btn btn-primary pull-right">
            <i class="fa fa-file"></i> NEW </a>
        </div>
      </div>
    </div>
    <!-- /.box-header -->
    <!-- form start -->
    <div class="box-body table-responsive no-padding">
      <div class="col-md-12">
        <!-- The time line -->
        <ul class="timeline">
          <!-- timeline time label -->
          <li class="time-label"></li>
          <!-- /.timeline-label -->
          <!-- timeline item -->
          <li>
            <i class="fa fa-barcode bg-blue"></i>
            <div class="timeline-item">
              <h3 class="timeline-header">
                <a href="#">STEP 1</a> Select excel file
              </h3>
              <div class="timeline-body col-xs-4">
                <input type="file" name="fileUpload" id="fileUpload" accept=".xls,.xlsx">
              </div>
            </div>
          </li>
          <!-- END timeline item -->
          <!-- timeline item -->
          <li>
            <i class="fa fa-user bg-yellow"></i>
            <div class="timeline-item">
              <h3 class="timeline-header">
                <a href="#">STEP 2</a> Select Customer
              </h3>
              <div class="timeline-body col-xs-4">
                <div>
                  <select class="form-control select2" id="accountNo" name="accountNo" style="width: 100%;"></select>
                </div>
              </div>
          </li>
          <!-- END timeline item -->
          <!-- timeline item -->
          <li>
            <i class="fa fa-file-excel-o bg-maroon"></i>
            <div class="timeline-item">
              <h3 class="timeline-header">
                <a href="#">STEP 3</a> Submit
              </h3>
              <div class="timeline-body col-xs-4">
                <div>
                  <button type="submit" class="btn bg-olive margin " id='import-excel' name="import_excel" onClick="Upload()">
                    <i class="fa  fa-file-excel-o"></i> Import Now </button>
                </div>
              </div>
            </div>
          </li>
          <!-- END timeline item -->
          </form>
      </div>
    </div>
    <!-- /.box-body -->
  </div>
  <!-- ***************** -->
  <div class="box">
    <div class="box-header">
      <h3 class="box-title">Imported Waybill Table</h3>
      <div class="box-tools">

        <div class="input-group input-group-sm" style="width: 150px;"><button type="button" class="btn btn-block btn-primary" onClick="printA6WaybillAction()"> <i class="fa fa-print"></i> Print All in A6</button></div>
      </div>
    </div>
    <!-- /.box-header -->
    <div class="box-body table-responsive no-padding">
      <table class="table table-hover" id="import-table" name="import_table">
        <thead>
          <tr>
            <th>No#</th>
            <th>Customer Account <font color="red">*</font></th>
            <th>CN <font color="red">*</font></th>
            <th>Shipper Name</th>
            <th>Receiver Name</th>
            <th>Pcs<font color="red">* must > 1</font></th>
            <th>Actual Weight <font color="red">* must > 0.1</font></th>
            <th>Action</th>
          </tr>
        </thead>
        <tbody></tbody>
      </table>
    </div>
    <!-- /.box-body -->
  </div>
  <!-- /.box -->
  </div>
  <button type="button" class="btn btn-primary save-button" id="save-event-button" onClick="ImportAjax()" disabled>SAVE</button>
  </div>
</section> 
@include('common.footer') 
@include('waybill_template.a6_waybill')
@include('common.location_services_api_call')

<script>
    
//for display customer option drop down 
var customersArray             = JSON.parse(JSON.stringify(