@include('common.header')
<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-primary">
          <div class="box-header">
            <h3 class="box-title">
              <b>Waybill Receiver Address Update</b>
            </h3>
            <div class="box-tools">
              <a href="{{ url('/home/waybill_update') }}" class="btn btn-primary">
                <i class="fa fa-file"></i> New Search</a>
            </div>
          </div>
          <!-- /.box-header -->
          <div class="box-body table-responsive no-padding">
            <table class="table">
              <tr>
                <td>
                  <b>Search My Station CN</b>
                </td>
                <td> : </td>
                <td>
                  <div class="input-group">
                    <span class="input-group-addon">
                      <i class="fa fa-barcode"></i>
                    </span>
                    <input type="text" id="search-cn" class="form-control">
                  </div>
                </td>
                <td>
                <button type="button" class="btn btn-block btn-primary" OnClick="searchWaybillForUpdate()">Search</button>
                </td>
              </tr>
            </table>
          </div>
      </div>
    </div>
    <div class="col-xs-12">
      <div class="box">
        <!-- /.box-header -->
        <div class="box-body">
          <div class="row">
            <div class="col-md-3">
              <b>Shipper Information</b>
              <br />
              <div class="form-group">
                <label class="v2waybillLable">Account No</label>
                <input class="form-control input-sm" type="text" placeholder="" id="accountNo" disabled>
              </div>
              <div class="form-group validation-required" id="error-shipperName">
                <label class="v2waybillLable">Shipper Name *</label>
                <input class="form-control input-sm" type="text" placeholder="" id="shipperName" disabled>
                <span class="help-block" id="error-message-shipperName" style="display:none;"></span>
              </div>
              <div class="form-group validation-required" id="error-shipperAddress">
                <label class="v2waybillLable">Address *</label>
                <textarea class="form-control input-sm" rows="3" wrap="hard" maxlength="150" id="shipperAddress" disabled></textarea>
                <span class="help-block" id="error-message-shipperAddress" style="display:none;"></span>
              </div>
              <div class="form-group validation-required" id="error-shipperState">
                <label class="v2waybillLable">Select State</label>
                <select class="form-control input-sm state-options" id="shipperState" disabled></select>
                <span class="help-block" id="error-message-shipperState" style="display:none;"></span>
              </div>
              <div class="form-group validation-required" id="error-shipperPostcode">
                <label class="v2waybillLable">Postcode*</label>
                <input class="form-control input-sm" type="text" id="shipperPostcode" disabled>
                <span class="help-block" id="error-message-shipperPostcode" style="display:none;"></span>
              </div>
              <div class="form-group validation-required" id="error-shipperContactName">
                <label class="v2waybillLable">Contact Person Name</label>
                <input class="form-control input-sm" type="text" id="shipperContactName" disabled>
                <span class="help-block" id="error-message-shipperContactName" style="display:none;"></span>
              </div>
              <div class="form-group validation-required" id="error-shipperContactNumber">
                <label class="v2waybillLable">Contact Person PH*</label>
                <input class="form-control input-sm" type="text" id="shipperContactNumber" disabled>
                <span class="help-block" id="error-message-shipperContactNumber" style="display:none;"></span>
              </div>
            </div>
            <div class="col-md-3">
              <b>Consignee Information</b>
              <br />
              <div class="form-group validation-required" id="error-consigneeName">
                <label class="v2waybillLable">Consignee Name *</label>
                <input class="form-control input-sm" type="text" id="consigneeName">
                <span class="help-block" id="error-message-consigneeName" style="display:none;"></span>
              </div>
              <div class="form-group validation-required" id="error-consigneeAddress">
                <label class="v2waybillLable">Address *</label>
                <textarea class="form-control input-sm" rows="3" wrap="hard" maxlength="150" id="consigneeAddress"></textarea>
                <span class="help-block" id="error-message-consigneeAddress" style="display:none;"></span>
              </div>
              <div class="form-group validation-required" id="error-consigneeState">
                <label class="v2waybillLable">Select State</label>
                <select class="form-control input-sm state-options" id="consigneeState"></select>
                <span class="help-block" id="error-message-consigneeState" style="display:none;"></span>
              </div>
              <div class="form-group validation-required" id="error-consigneePostcode">
                <label class="v2waybillLable">Postcode*</label>
                <input class="form-control input-sm" type="text" id="consigneePostcode">
                <span class="help-block" id="error-message-consigneePostcode" style="display:none;"></span>
              </div>
              <div class="form-group validation-required" id="error-consigneeContactName">
                <label class="v2waybillLable">Contact Person Name</label>
                <input class="form-control input-sm" type="text" id="consigneeContactName">
                <span class="help-block" id="error-message-consigneeContactName" style="display:none;"></span>
              </div>
              <div class="form-group validation-required" id="error-consigneeContactNumber">
                <label class="v2waybillLable">Contact Person PH*</label>
                <input class="form-control input-sm" type="text" id="consigneeContactNumber">
                <span class="help-block" id="error-message-consigneeContactNumber" style="display:none;"></span>
              </div>
            </div>
            <div class="col-md-3">
              <br>
              <div class="form-group validation-required" id="error-parcelType">
                <label class="v2waybillLable">Parcel Type</label>
                <input class="form-control input-sm" id="parcelType" disabled>
                <span class="help-block" id="error-message-parcelType" style="display:none;"></span>
              </div>
              <div class="form-group validation-required" id="error-pc">
                <label class="v2waybillLable">Total Pcs *</label>
                <input class="form-control input-sm" type="number" id="pc" value="0" disabled>
                <span class="help-block" id="error-message-pc" style="display:none;"></span>
              </div>
              <div class="form-group validation-required" id="error-actualWeight">
                <label class="v2waybillLable">Weight Kgs *</label>
                <input class="form-control input-sm" type="number" id="actualWeight" value="0" disabled>
                <span class="help-block" id="error-message-actualWeight" style="display:none;"></span>
              </div>
            </div>
            <div class="col-md-3">
              <br>
              <div class="form-group validation-required" id="error-cnNo">
                <label class="v2waybillLable">#CN ex: 60XXXXXXX</label>
                <input class="form-control input-lg" type="text" id="cnNo" disabled>
                <span class="help-block" id="error-message-cnNo" style="display:none;"></span>
              </div>
              <!-- <div class="form-group validation-required" id="error-babyCodes"><label class="v2waybillLable">Scan All Baby Code Here</label><textarea class="form-control" rows="6" placeholder="BB1001&#x0a;BB1002&#x0a;BB1003&#x0a;BB1004&#x0a;BB1005" id="babyCodes"></textarea><span class="help-block" id="error-message-babyCodes" style="display:none;"></span></div> -->
              <div class="form-group">
                <label class="v2waybillLable">Remarks</label>
                <textarea class="form-control input-sm" rows="3" id="remark" disabled></textarea>
              </div>
              <div class="form-group">
                <label class="v2waybillLable">Reference Number (Trackable)</label>
                <input class="form-control input-sm" type="text" id="ref1" disabled>
              </div>
            </div>
          </div>
        </div>
      </div>
      <!-- /.box -->
    </div>
    <button type="button" class="btn btn-primary save-button" id="save-button" onClick="saveWaybillAction()" disabled>SAVE</button>
  </div>
</section>

@include('common.footer')

<script>
var waybillObject            = {};

$( document ).ready(function() {
  prepareStatesSelect2()
});


async function prepareStatesSelect2()
{
  var STATES =  JSON.parse('@php echo json_encode(config('shippingSettings.STATES')) @endphp')
  STATES.forEach(function (item, index) {
  $(".state-options").append("<option value='"+item+"'>"+item+"</option>")
  });
  $('.state-options').select2();
}

async function searchWaybillForUpdate()
{
  $("#search-cn").prop('disabled', true); 
  $("#save-button").prop('disabled', true); 
  $("#load-overlay").show()
  var searchParam   = {cNNo: $("#search-cn").val()}

  try {
    const result      = await syncAjaxCall(searchParam,RpcApiPath+"/api/rpc/bbb.v4.WaybillService/GetOne","POST",bearerToken);
    if(result.lastShippingActivity == "proof_of_deliver")
    {
      Swal.fire({ title: "Error", text: "You are not allow to edit any pod waybill info", icon: "error", confirmButtonColor: "#5156be" });
      $("#load-overlay").hide()
      return
    }
    if(result.initSrcWarehouseID == warehouseCode)
    {
    waybillObject     = {};
    waybillObject     = result;
    UpdateWaybillUI();
    $("#save-button").prop('disabled', false); 
    $("#load-overlay").hide()
    }else{
     Swal.fire({ title: "Error", text: "waybill not found", icon: "error", confirmButtonColor: "#5156be" });
     $("#load-overlay").hide()
    }
  } catch (error) {
    Swal.fire({ title: "Error", text: error.responseJSON.msg, icon: "error", confirmButtonColor: "#5156be" });
    $("#load-overlay").hide()
  }
}

function UpdateWaybillUI()
{
    for (i in waybillObject)
    {  
        $('#'+i).val(waybillObject[i]).change();
    }
    $("#cnNo").prop('disabled', true)
}


async function saveWaybillAction()
{
  $("#save-button").prop('disabled', true); 

  var oldconsigneeName          = waybillObject["consigneeName"]
  var oldconsigneeAddress       = waybillObject["consigneeAddress"]
  var oldconsigneeState         = waybillObject["consigneeState"]
  var oldconsigneePostcode      = waybillObject["consigneePostcode"]
  var oldconsigneeContactName   = waybillObject["consigneeContactName"]
  var oldconsigneeContactNumber = waybillObject["consigneeContactNumber"]

  waybillObject["consigneeName"]          = $("#consigneeName").val();
  waybillObject["consigneeAddress"]       = $("#consigneeAddress").val();
  waybillObject["consigneeState"]         = $("#consigneeState").val();
  waybillObject["consigneePostcode"]      = $("#consigneePostcode").val();
  waybillObject["consigneeContactName"]   = $("#consigneeContactName").val();
  waybillObject["consigneeContactNumber"] = $("#consigneeContactNumber").val();
  waybillObject["tnc"]                    = true;

  inputValidationResultVariable     = await inputValidation(waybillObject,"{{ url('/post/call/waybill/verify/v1')}}")
  if(inputValidationResultVariable==false){$("#save-button").prop('disabled', false); return};

  
  try {
    $("#load-overlay").show()
      const result = await syncAjaxCall(waybillObject,RpcApiPath+"/api/rpc/bbb.v4.WaybillService/Update","POST",bearerToken);
    } catch (error) {
      Swal.fire({ title: "Waybill Error", text: error.status+" contact system administrator", icon: "error", confirmButtonColor: "#5156be" });
    }

    var updateInformationPost = "[Receiver Info Update From] -"+oldconsigneeName+" - "
                                +oldconsigneeAddress+" "
                                +oldconsigneeState+" "
                                +oldconsigneePostcode+" "
                                +oldconsigneeContactName+" - "
                                +oldconsigneeContactNumber

    var updateEventObject    = {entryCodes : [{code :  waybillObject["cnNo"] ,description : updateInformationPost }] ,handlingWarehouseID : warehouseCode}                     
    try {
    $("#load-overlay").show()
      const result = await syncAjaxCall(updateEventObject,apiPath+"/api/v2/courier/shipping/event/information","PUT",bearerToken);
    } catch (error) {
      Swal.fire({ title: "Waybill Error", text: error.status+" contact system administrator", icon: "error", confirmButtonColor: "#5156be" });
    }

    Swal.fire({position: 'top-end',icon: 'success',title: 'Waybill Update',showConfirmButton: false,timer: 1000})

    $("#load-overlay").hide()
}

async function inputValidation(varifyData,endPoint)
{
  //clear all previous validation html class
  $('.validation-required').removeClass('has-error');
  $(".help-block").hide()
  //try call validation 
  try {
  const verifyResult = await syncAjaxCall(varifyData,endPoint,"POST","");
  return true;
  } catch (error) {
    inputValidationResultVariable = false;
    if(error.status == 422)
    {
      var responseError422 = error.responseJSON
      for(var key in responseError422)
      {
          var errorKey = key ; 
          //sample error key =   
          //"pc": [
          //     "The pc must be between 1 - 999."
          // ],........
          $("#error-"+errorKey).addClass( "has-error" );
          $("#error-message-"+errorKey).html(responseError422[key])
          $("#error-message-"+errorKey).show()
      }
    }
    return false;
  }
}

</script>