@extends('layouts.backend')
@section('mainContentArea')
@include('backend.pos-window.bill-menu')
<style>
  .paymentLabel {
    display: block;
    font-weight:bold;
    font-size:12px;
  }
  #schemeListingTable *{
    font-size:12px;
  }
  .bcoltbl * {
    font-size:10px;
  }
  .mainProductListing th, .mainProductListing td {
    font-size:12px;
  }
  .mainProductListing tbody tr {
  color: black;
    font-weight: 600;
  }
  .orderTotalDiv table tr td{
    color: black;
  }
</style>
@if(!empty(request('bill_id')))
  <div class="text-center p-2 alert alert-info">
    <h5>Bill saved successfully.</h5> <a target="_blank" href="{{ route('pos-bill-details', ['billid' => request('bill_id')]) }}" class="btn btn-sm btn-success">Download / Print Bill</a>
  </div>
@endif

@if(empty($customer->customer_id))
@include("backend.pos-window.select-customer")
@else
<form method="post" action="{{ route('save-pos-order') }}" name="bollForm">
  @csrf
  <input type="hidden" name="cartToken" value="{{ $cartToken }}">


<div class="row bg-white posWindowContainer">
  <div class="col-md-10 p-1 form-group cartInfo"></div>
  <div class="col-md-2 form-group" style="background:#ececec;height:87vh;padding:0px;">
    <div class="text-justify p-2" style="background: #DCDCDC;width:100%;font-size:11px;">
      <b>Name:</b> {{ $customer->firstname }} {{ $customer->lastname }}<br>
      <b>Telephone:</b> {{ $customer->telephone }}<br>
      <b>SPS Member:</b> {{ !empty($customer->spsInfo) ? 'Yes' : 'No' }}<br>
      <table width="100%">
        <tr>
          <td width="50%">
            <a href="{{ route('billing-window') }}" class="text-danger">Change Customer</a>
          </td>
          <td width="50%">
            <span class="text-danger" style="cursor: pointer;text-align:right;display:block;" onclick="$('#productLookup').modal('show');">Product Lookup!</small>
          </td>
        </tr>
      </table>
    </div>
    <div class="text-justify p-2" style="background: #F9F9F9;width:100%;font-size:11px;">
      <input type="hidden" id="schemeApplied" name="appliedScheme" value="0">
      <div id="schemeModalBtnArea" class="text-center mb-1" style="display: none;">
        <button type="button" class="btn btn-sm btn-warning btn-block" onclick="$('#schemeModal').modal('show');"><i class="fa fa-money" aria-hidden="true"></i> Apply Schemes</button>
      </div>
      <div id="schemeModalBtnAreaDis" class="text-center mb-1">
        <button type="button" class="btn btn-sm btn-default btn-block" disabled><i class="fa fa-money" aria-hidden="true"></i> No Scheme</button>
      </div>
      @if(request()->user()->id == 32)
      <p>
        <label for="scanBarcode"><b>Order Date</b></label>
        <input type="text" id="orderDateCustom" name="orderDateCustom" class="datepicker" required style="width:150px;"><br>  
      </p>
      @endif
      @if(request()->user()->role_id == 1)
      <p>
        <label for="scanBarcode"><b>Order Date</b></label>
        <input type="text" id="orderDateCustom" name="orderDateCustom" class="datepicker" required style="width:150px;"><br>  
      </p>
      <p>
        <label for="scanBarcode"><b>Order Discount</b></label>
        <input type="number" step="any" id="orderDiscCustom" name="discPercent" required style="width:150px;" value="0"><br>  
      </p>
      @endif
      @if(request()->user()->id == 35 || request()->user()->id == 3)
      <p>
        <label for="scanBarcode"><b>Order Discount</b></label>
        <input type="number" step="any" id="orderDiscCustom" name="discPercent" required style="width:150px;" value="0"><br>  
      </p>
      @endif
      
      <label for="scanBarcode"><b>Scan Barcode</b></label>
      <input type="text" id="scanBarcode"><br>
      <sub class="text-danger">To search input pattern and press enter!</sub><br>
      
      <label for="biller_id"><b>Select Biller</b></label>
      <select name="biller_id" id="biller_id" required>
        <option value="">Select Biller</option>
        @if($billers->count() > 0)
          @foreach($billers as $biller)
            <option value="{{ $biller->id }}">{{ $biller->name . ' ' . $biller->fullname }}</option>
          @endforeach
        @else
          <option value="0">No Biller Assigned</option>
        @endif
      </select>
      <div>
        <label class="text-danger text-bold" for="hold_bill"><input type="checkbox" name="hold_bill" id="hold_bill" value="1" onclick="setAutoUpiPayment();"> Hold bill till payment approved!</label>
      </div>
      
    </div>
    <div class="text-justify p-2 orderTotalDiv" style="background: #F9f9f9;width:100%;font-size:11px;">
      <p><b>Order Totals</b></p>
      <table border="1" cellpadding="3" cellspacing="3" width="100%">
        <tr>
          <th>Total Mrp:</th>
          <td class="totalMrp"></td>
        </tr>
        <tr>
          <th>Offer:</th>
          <td class="totalClearance"></td>
        </tr>
        <tr>
          <th>Voucher:</th>
          <td class="totalVoucherDiscount"></td>
        </tr>
        <tr>
          <th>Scheme:</th>
          <td class="schemeApplied"></td>
        </tr>
        <tr>
          <th>Scheme Disc:</th>
          <td class="totalSchemeDiscount"></td>
        </tr>
        <tr>
          <th>SPS Discount:</th>
          <td class="totalSpsDiscount"></td>
        </tr>
        <tr>
          <th>B'day Discount:</th>
          <td class="totalBdayDiscount"></td>
        </tr>
        <tr>
          <th>Ann. Discount:</th>
          <td class="totalAnnDiscount"></td>
        </tr>
        <tr>
          <th>Sub-Total:</th>
          <td class="totalSub"></td>
        </tr>
        <tr>
          <th>Total Tax:</th>
          <td class="totalTax"></td>
        </tr>
        <tr>
          <th>SGST:</th>
          <td class="totalSgst"></td>
        </tr>
        <tr>
          <th>CGST:</th>
          <td class="totalCgst"></td>
        </tr>
        <tr>
          <th>QTY:</th>
          <td class="totalQty"></td>
        </tr>
        <tr>
          <th>Grand Total:</th>
          <td class="totalGrandOrig"></td>
        </tr>
        <tr>
          <th>Roundoff:</th>
          <td class="roundOffAmt"></td>
        </tr>
        <tr>
          <th>Payable Amt.:</th>
          <td class="totalGrand"></td>
        </tr>
        <tr>
          <th colspan="2">
            <div class="paymentInfo"></div>
            <button type="button" onclick="$('#paymentBlock').show();" class="btn btn-sm btn-primary btn-block">Payment Info</button>
          </th>
        </tr>
        <tr style="{{ !empty($customer->spsInfo) ? '' : 'display:none;'}}">
          <th>Enter OTP</th>
          <th><button type="button" class="btn btn-sm btn-info" onclick="genOtp();">Generate OTP</button></th>
        </tr>
        <tr style="{{ !empty($customer->spsInfo) ? '' : 'display:none;'}}">
          <th>
            <input type="number" id="otpVal" name="otpVal" class="form-control" value="{{ empty($customer->spsInfo) ? rand(2000, 8000) : '' }}">
            <input type="hidden" id="otpCheckPass" name="otpCheckPass" value="{{ empty($customer->spsInfo) ? '1' : '0' }}">
          </th>
          <th>
            <button type="button" class="btn btn-danger btn-sm" onclick="validateOtp();">Submit OTP</button>
          </th>
        </tr>
        <tr class="saveBillRow" style="display: none;">
          <th colspan="2">
            <button type="button" onclick="saveOrderToServer();" class="btn btn-sm btn-success btn-block">Save Order</button>
          </th>
        </tr>

      </table>
      {{-- Payment Block --}}
      <div class="p-2" style="display:none;width:350px;position:absolute;height:85vh;background-color:#f9f9f9;right:0px;top:0px;" id="paymentBlock">
        <div class="row">
          <div class="col-md-12">
            <input type="hidden" id="totalAmtPayable" value="0">
            <input type="hidden" id="totalAmtPaid" value="0">
            <h5>Payment Block <button type="button" class="float-right btn-sm btn-danger" onclick="$('#paymentBlock').hide();"><i class="fa fas fa-times"></i></button></h5>
            <table border="0" cellpadding="3" cellspacing="3" width="100%">
              <tr>
                <td colspan="2" class="text-danger">
                  <span class="paymentLabel">Credit note payment will disable the SPS discount!</span>
                  <table class="table">
                    <tr>
                      <td width="50%">
                        <span class="paymentLabel">Credit Balance: ₹ {{ floor($creditNoteBalance) }}</span>
                        <input type="hidden" id="maxCnote" name="maxCnote" value="{{ floor($creditNoteBalance) }}"/>
                        <input type="hidden" id="maxWallet" name="maxWallet" value="{{ floor($walletBalance) }}"/>
                      </td>
                      <td width="50%">
                        <span class="paymentLabel">
                        <input type="checkbox" id="cnoteEnabled" onclick="if(this.checked == true) {$('.creditnoteRow').show();$('#cnoteVal').val(1);$('.creditnote').val(0);populateCart();} else {$('.creditnoteRow').hide();$('#cnoteVal').val(0);$('.creditnote').val(0);populateCart();}"> 
                        <b>Enable Credit note</b>
                        <input type="hidden" id="cnoteVal" name="cnoteVal" value="0">
                        </span>
                      </td>
                    </tr>
                  </table>
                </td>
              </tr>
              <tr class="creditnoteRow" style="display: none;">
                <td colspan="2">
                  <span class="paymentLabel">Credit Note</span>
                  <input type="hidden" name="mode[]" value="CreditNote">
                  <input type="number" class="payfield creditnote"  step="any" name="payment[]" value="0">
                  <input type="hidden" name="ref[]" value="creditnote" class="payref">
                </td>
              </tr>
              <tr>
                <td>
                  <span class="paymentLabel">Wallet</span>
                  <input type="hidden" name="mode[]" value="Wallet">
                  <input type="number" class="payfield wallet"  step="any" name="payment[]">
                  <input type="hidden" name="ref[]" value="wallet" class="payref">
                </td>
                <td><span class="paymentLabel">Wallet Balance: ₹ {{ floor($walletBalance) }}</span></td>
              </tr>
              <tr>
                <td colspan="2">
                  <span class="paymentLabel">Cash</span>
                  <input type="hidden" name="mode[]" value="Cash">
                  <input type="number" class="payfield cash"  step="any" name="payment[]">
                  <input type="hidden" name="ref[]" value="cash" class="payref">
                </td>
              </tr>
              <tr>
                <td colspan="2">
                  <span class="paymentLabel">Gift Voucher</span>
                  <table width="100%">
                    <tr>
                      <td>
                        <span class="paymentLabel">Amount</span>
                        <input type="hidden" name="mode[]" value="GiftVoucher">
                        <input type="number" class="payfield giftvoucher"  step="any" name="payment[]" readonly value="0">
                        <input type="hidden" name="ref[]" value="giftvoucher" class="payref">
                      </td>
                      <td>
                        <span class="paymentLabel">Enter Code</span>
                        <input type="text" name="giftvoucher" value="" class="gift-voucher">
                      </td>
                      <td>
                        <span class="text-success" style="cursor:pointer;" onclick="applyVoucher();"><i class="fa fas fa-check"></i></span>
                      </td>
                      <td>
                        <span class="text-danger" style="cursor:pointer;" onclick="removeVoucher();"><i class="fa fas fa-times"></i></span>
                      </td>
                    </tr>
                  </table>
                </td>
              </tr>
              <tr>
                <td colspan="2">
                  <span class="paymentLabel">Card Payment</span>
                  <table width="100%">
                    <tr>
                      <td><input type="text" name="cardamt" value="" class="cardamt"></td>
                      <td><input type="text" name="cardrec" value="" class="cardrec"></td>
                      <td><span class="text-success" style="cursor: pointer;"><i class="fa fas fa-plus" onclick="addCardPayment();"></i></span></td>
                    </tr>
                  </table>
                  <ul class="cardPaymentList"></ul>
                </td>
              </tr>
              <tr>
                <td colspan="2">
                  <span class="paymentLabel">UPI Payment</span>
                  <table width="100%">
                    <tr>
                      <td><input type="text" name="upiamt" value="" class="upiamt"></td>
                      <td><input type="text" name="upirec" value="" class="upirec"></td>
                      <td><span class="text-success" style="cursor: pointer;"><i class="fa fas fa-plus" onclick="addUpiPayment();"></i></span></td>
                    </tr>
                  </table>
                  <ul class="upiPaymentList"></ul>
                </td>
              </tr>
            </table>
            <div class="alert alert-info">
              <hr/>
              <p><b>Amout to Pay: ₹ <span id="totalAmtPayableText"></span></b></p>
              <p><b>Amout Paid: ₹ <span id="totalAmtPaidText"></span></b></p>
              <p><b>Balance: ₹ <span id="totalAmtBalanceText"></span></b></p>
              <div class="text-center paymentBtn" style="display: none;">
                <button class="btn btn-sm btn-success btn-block" type="button" onclick="$('#paymentBlock').hide();">Save Payment</button>
              </div>
            </div>
          </div>
        </div>
      </div>
      {{-- Payment Block --}}
    </div>
  </div>
</div>
<input type="hidden" id="processOrderCheck" value="0">
</form>
@endif

<div class="modal" tabindex="-1" role="dialog" id="productLookup">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">Product Lookup</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <div class="form-group">
          <label for="plookup">Enter atleast 3 characters to lookup products and press enter</label>
          <input type="text" id="plookup" class="form-control">
        </div>
        <div id="productLookupResults" style="max-height:500px;overflow:auto;"></div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>


<div id="schemeModal" class="modal" tabindex="-1" role="dialog">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">Available Schemes</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        No scheme available!
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>
@endsection

@section('extraJs')
<script>
  var CART_TOTAL = 1;
  var CART_QTY = 2;
  var SCH_APPLY_ON = [
    'None',
    'Cart Amount',
    'Cart Qty.',
  ];
  var FLAT_DISCOUNT = 1;
  var SLAB_DISCOUNT = 2;
  var COMBO_DISCOUNT = 3;
  var DISCS = [];
  DISCS.push('None');
  DISCS.push('Flat Discount');
  DISCS.push('Slab Discount');
  DISCS.push('Combo Discount');
  console.log(DISCS);
  @if(!empty($customer->customer_id))

  function checkAvailableSchemes() {
    var totalQty = $(".totalQty").html();
    totalQty = $.trim(totalQty);
    var totalGrand = $(".totalGrand").html();
    totalGrand = totalGrand.replace(' ₹', "");
    totalGrand = $.trim(totalGrand);

    $.post("{{ route('get-store-schemes') }}", {
            _token: document.tokenForm._token.value,
            cartQty: totalQty,
            cartAmt: totalGrand,
            cartToken:'{{ $cartToken }}',
            customer_id:'{{ $customer->customer_id }}',
            pos_id:'{{ empty(request()->user()->pos_id) ? 0 : request()->user()->pos_id }}',
        }, function(result) {
            var response = jQuery.parseJSON(result);
            if(response.status == true) {
                var schemeHtml = '\
                <h5>Available Schemes</h5>\
                <table class="table table-striped" id="schemeListingTable">\
                  <thead>\
                  <tr>\
                    <th>\
                      Name\
                    </th>\
                    <th>\
                      Type\
                    </th>\
                    <th>\
                      Applies On\
                    </th>\
                    <th>\
                      Limit\
                    </th>\
                    <th>\
                      Offer Details\
                    </th>\
                    <th>\
                      Action\
                    </th>\
                  </tr>\
                  </thead>\
                  <tbody>\
                ';
                var schs = response.schemes;
                var schos = response.schemeOffers;
                for(i=0; i < schs.length; i++) {
                  var sch = schs[i];
                  var scho = schos[i];
                  var offers = 'n/a';
                  var offerDtls = '<pre style="font-size:10px;">'+scho+'</pre>';
                  var schemeId = parseInt(sch.id);
                  var appliedScheme = parseInt(document.getElementById("schemeApplied").value);
                  var schemeIsApplied = false;
                  if(schemeId == appliedScheme) {
                    schemeIsApplied = true;
                  }
                  schemeHtml+='\
                  <tr>\
                    <td>\
                      '+sch.name+'\
                    </td>\
                    <td>\
                      '+DISCS[sch.scheme_nature]+'\
                    </td>\
                    <td>\
                      '+SCH_APPLY_ON[sch.discount_percent]+'\
                    </td>\
                    <td>\
                      '+sch.discount_amount+'\
                    </td>\
                    <td>\
                      '+offerDtls+'\
                    </td>';
                    if(schemeIsApplied == true) {
                      schemeHtml+='<td>\
                        <a href="javascript:void();" onclick="applySchemeOnCart(0);return false;" class="btn btn-danger btn-sm">\
                        Remove Scheme\
                        </a>\
                      </td>';
                    } else {
                      schemeHtml+='<td>\
                        <a href="javascript:void();" onclick="applySchemeOnCart('+sch.id+');return false;" class="btn btn-success btn-sm">\
                        Apply Scheme\
                        </a>\
                      </td>';
                    }

                  schemeHtml+='</tr>\
                  ';
                }
                schemeHtml+='</tbody></table>';
                $("#schemeModal .modal-body").html(schemeHtml);
                $("#schemeModalBtnAreaDis").hide();
                $("#schemeModalBtnArea").show();
                return false;
            } else {
              $("#schemeModal .modal-body").html('No Scheme Available!');
              $("#schemeModalBtnAreaDis").show();
              $("#schemeModalBtnArea").hide();
                return false;
            }
            return false;
        });
  }

  function applySchemeOnCart(schemeid) {
    document.getElementById("schemeApplied").value = schemeid;
    populateCart();
  }

  // OTP CASE
  function saveOrderToServer() {
    if(document.getElementById("biller_id").value == '') {
      toastr.error('Please select the biller');
      return false;
    }
    if(document.getElementById("orderDateCustom") != null) {
      var dateVal = $("#orderDateCustom").val();
      dateVal = $.trim(dateVal);
      if(dateVal == '') {
        toastr.error('Please enter the date!');
        $("#orderDateCustom").focus();
        return false;
      }
    }
    @if(!empty($customer->spsInfo))
    var otp =  $("#otpVal").val();
    otp = $.trim(otp);
    if(otp == '') {
      toastr.error('Please enter the OTP');
      return false;
    } else {
      var otpCheckPass = $("#otpCheckPass").val();
      if(otpCheckPass == 1) {
        $("#processOrderCheck").val(1);
        populateCart();
        return false;
      } else {
        toastr.error('OTP does not matches, Please enter valid OTP');
        return false;
      }
    }
    @else
    $("#processOrderCheck").val(1);
    populateCart();
    @endif
  }
  function genOtp() {
    $.post("{{ route('pos-new-gen-otp') }}", {
            _token: document.tokenForm._token.value,
            cname: '{{ $customer->firstname }} {{ $customer->lastname }}',
            cphone:'{{ $customer->telephone }}',
            totPayment: $("#totalAmtPayableText").html(),
            cartToken:'{{ $cartToken }}',
            pos_id:'{{ empty(request()->user()->pos_id) ? 0 : request()->user()->pos_id }}',
        }, function(result) {
            var response = jQuery.parseJSON(result);
            if(response.status == true) {
                toastr.success(response.info);
                return false;
            } else {
                toastr.error(response.info);
                return false;
            }
            return false;
        });
  }

  function validateOtp() {
    $.post("{{ route('pos-new-validate-otp') }}", {
            _token: document.tokenForm._token.value,
            otp: $("#otpVal").val(),
            cartToken:'{{ $cartToken }}',
            pos_id:'{{ empty(request()->user()->pos_id) ? 0 : request()->user()->pos_id }}'
        }, function(result) {
            var response = jQuery.parseJSON(result);
            if(response.status == true) {
                toastr.success(response.info);
                $("#otpCheckPass").val(1);
                return false;
            } else {
              $("#otpVal").val('')
                toastr.error(response.info);
                $("#otpCheckPass").val(0);
                return false;
            }
            return false;
        });
  }
  // OTP CASE
  // function to calculate order totals
  $("#paymentBlock input[type='number'],#paymentBlock input[type='text']").addClass('form-control');
  
  function checkPaymentStatus() {
    var paymentDone = $("#totalAmtPaid").val();
    var payment = $("#totalAmtPayable").val();
    paymentDone = parseFloat(paymentDone);
    payment = parseFloat(payment);
    if(isNaN(paymentDone)) {
      paymentDone = 0;
    }
    var bal = payment - paymentDone;
    if(bal != 0) {
      return false;
    } else {
      return true;
    }
  }
  function paymentInfo() {
    var statusOfPayment = checkPaymentStatus();
    if(statusOfPayment == false) {
      $(".paymentInfo").html('<span class="text-danger">Payment Info Pending</span>');
      $(".saveBillRow").hide();
    } else {
      $(".paymentInfo").html('<span class="text-success">Payment Matches!!</span>');
      $(".saveBillRow").show();
    }
  }
  function calculateTotals() {
    if($('.creditnote').val() > {{ floor($creditNoteBalance) }}){
      toastr.error('Credit note value cannot be greater than {{ floor($creditNoteBalance) }}');
      $('.creditnote').val(0);
    }
    if($('.wallet').val() > {{ floor($walletBalance) }}){
      toastr.error('Wallet amount value cannot be greater than {{ floor($walletBalance) }}');
      $('.wallet').val(0);
    }
    var finalAmtToPay = $("#totalAmtPayable").val();
    var currentTotal = 0;
    finalAmtToPay = parseFloat(finalAmtToPay);
    $(".payfield").each(function(){
      var tempVal = $(this).val();
      tempVal = parseFloat(tempVal);
      // console.log($(this).attr('class') + ' --> ' + tempVal);
      if(isNaN(tempVal)) {
        tempVal = 0;
        $(this).val(0);
      } else if(tempVal < 0) {
        tempVal = 0;
        $(this).val(0);
      }
      currentTotal+=tempVal;
    });
    console.log('final Amt.: ',finalAmtToPay);
    console.log('current total: ',currentTotal);
    finalAmtToPay = finalAmtToPay.toFixed(2);
    currentTotal = currentTotal.toFixed(2);
    var remaining = finalAmtToPay - currentTotal;
    $("#totalAmtPaid").val(currentTotal);
    $("#totalAmtPaidText").html(currentTotal);
    $("#totalAmtBalanceText").html(remaining);
    if(remaining == 0) {
      $(".paymentBtn").show();
    } else {
      $(".paymentBtn").hide();
    }
    paymentInfo();
  }
  $("#paymentBlock input").keyup(function () {
    calculateTotals();
  });
  // function to add card and UPI
  function addCardPayment(){

    var cardamt = $(".cardamt").val();
    var cardrec = $(".cardrec").val();
    cardamt = $.trim(cardamt);
    cardrec = $.trim(cardrec);
    var html2insert = '';
    if(cardamt != '' && cardrec != '') {
      cardamt = parseFloat(cardamt);
      html2insert = '\
        <li>₹ '+cardamt.toFixed(2)+' / ' + cardrec + ' <span onclick="$(this).parent().remove();calculateTotals();" class="text-danger float-right"><i class="fa fas fa-times"></i></span>\
          <input type="hidden" name="mode[]" value="Card">\
          <input type="hidden" class="payfield card" value="'+cardamt+'"  step="any" name="payment[]">\
          <input type="hidden" name="ref[]" value="card" class="payref">\
        </li>\
      ';
      $(".cardPaymentList").append(html2insert);
      $(".cardamt").val('');
      $(".cardrec").val('');
    } else {
      toastr.error('Please enter both amount and the receipt!');
    }
    calculateTotals();
  }
  function setAutoUpiPayment() {
    if(document.getElementById("hold_bill").checked == true) {
      var finalAmtToPay = $("#totalAmtPayable").val();
      $(".upiamt").val(finalAmtToPay);
      $(".upirec").val('UPI ON HOLD');
      addUpiPayment();
    } else {
      $(".upiPaymentList").html('');
      $(".upiamt").val('');
      $(".upirec").val('');
      calculateTotals();
    }
  }
  function addUpiPayment(){

    var cardamt = $(".upiamt").val();
    var cardrec = $(".upirec").val();
    cardamt = $.trim(cardamt);
    cardrec = $.trim(cardrec);
    var html2insert = '';
    if(cardamt != '' && cardrec != '') {
      cardamt = parseFloat(cardamt);
      html2insert = '\
        <li>₹ '+cardamt.toFixed(2)+' / ' + cardrec + ' <span onclick="$(this).parent().remove();calculateTotals();" class="text-danger float-right"><i class="fa fas fa-times"></i></span>\
          <input type="hidden" name="mode[]" value="UPI">\
          <input type="hidden" class="payfield upi" value="'+cardamt+'"  step="any" name="payment[]">\
          <input type="hidden" name="ref[]" value="upi" class="payref">\
        </li>\
      ';
    $(".upiPaymentList").append(html2insert);
    $(".upiamt").val('');
    $(".upirec").val('');
    } else {
      toastr.error('Please enter both amount and the receipt!');
    }
    calculateTotals();
  }

  function removeVoucher() {
    $(".gift-voucher").val('');
    $(".giftvoucher").val(0);
    calculateTotals();
  }

  function applyVoucher() {
    var coupon = $(".gift-voucher").val();
    coupon = $.trim(coupon);
    if(coupon == '' ) {
      toastr.error('Please enter the coupon code');
      return false;
    }
    $.post("{{ route('add-new-biller') }}", {
            _token: document.tokenForm._token.value,
            cartToken:'{{ $cartToken }}',
            coupon: coupon
        }, function(result) {
            var response = jQuery.parseJSON(result);
            if(response.status == true) {
                toastr.success(response.info);
                $(".giftvoucher").val(response.amount);
                calculateTotals();
                return false;
            } else {
                toastr.error(response.info);
                return false;
            }
            return false;
        });
  }

  function getProductLookup() {
    var param = $("#plookup").val();
    param = $.trim(param);
    if(param.length < 3 ) {
      toastr.error('Please enter atleast 3 characters to lookup product');
      return false;
    }
    $.post("{{ route('pos-product-lookup') }}", {
            _token: document.tokenForm._token.value,
            cartToken:'{{ $cartToken }}',
            param: param
        }, function(result) {
            var response = jQuery.parseJSON(result);
            if(response.status == true) {
                toastr.success(response.info);
                var prods = response.products;
                var html = '<table class="table table-striped bcoltbl">\
                <thead>\
                <tr>\
                  <th>Barcode</th>\
                  <th>Article</th>\
                  <th>Color</th>\
                  <th>Size</th>\
                  <th>Qty</th>\
                  <th>MRP</th>\
                  <th>Action</th>\
                </tr>\
                </thead>\
                </tbody>\
                ';
                for(i = 0; i < prods.length; i++) {
                  var prod = prods[i];
                  html+='\
                  <tr>\
                  <td>'+prod.barcode+'</td>\
                  <td>'+prod.article+'</td>\
                  <td>'+prod.color+'</td>\
                  <td>'+prod.size+'</td>\
                  <td>'+prod.qty+'</td>\
                  <td>'+prod.mrp+'</td>\
                  <td><button type="button" class="btn btn-sm btn-info" onclick="atc(\''+prod.barcode+'\');$(\'#productLookup\').modal(\'hide\');">Add</button></td>\
                </tr>\
                  ';
                }
                html+='\
                </tbody>\
                </table>\
                ';
                $('#productLookupResults').html(html);
                return false;
            } else {
                toastr.error(response.info);
                return false;
            }
            return false;
        });
  }

  function removeCartItem(b) {
    $.post("{{ route('remove-cart-product') }}", {
            _token: document.tokenForm._token.value,
            cartToken:'{{ $cartToken }}',
            barcode: b
        }, function(result) {
            var response = jQuery.parseJSON(result);
            if(response.status == true) {
                toastr.success(response.info);
                populateCart();
                return false;
            } else {
                toastr.error(response.info);
                return false;
            }
            return false;
        });
  }
  function populateCart() {
    var discPercent = 0;
    if(document.getElementById("orderDiscCustom") != null) {
      discPercent = document.getElementById("orderDiscCustom").value;
    }
    $(".posWindowContainer").css('opacity', 0.3);
    var cnoteVal = 0;
    if(document.getElementById("cnoteEnabled").checked == true) {
      cnoteVal = 1;
      document.getElementById("cnoteVal").value = 1;
    } else {
      cnoteVal = 0;
      document.getElementById("cnoteVal").value = 0;
    }
    $.post("{{ route('get-pos-cart-products') }}", {
          _token: document.tokenForm._token.value,
          cartToken:'{{ $cartToken }}',
          customer_id:'{{ $customer->customer_id }}',
          pos_id:'{{ empty(request()->user()->pos_id) ? 0 : request()->user()->pos_id }}',
          cnoteVal: cnoteVal,
          discPercent: discPercent,
          appliedScheme: parseInt(document.getElementById("schemeApplied").value)
      }, function(result) {
        var response = jQuery.parseJSON(result);
        if(response.status == true) {
            $(".orderTotalDiv").show();
            toastr.success(response.info);
            var cartInfo = response.cartDetails.cartInfo;
            var cartHtml = '\
            <table class="table table-bordered mainProductListing">\
              <thead>\
                <tr>\
                  <th>Barcode</th>\
                  <th>Qty</th>\
                  <th>Article</th>\
                  <th>Color</th>\
                  <th>Size</th>\
                  <th>HSN</th>\
                  <th>MRP</th>\
                  <th>Offer%</th>\
                  <th>Offer</th>\
                  <th>Scheme</th>\
                  <th>Discount</th>\
                  <th>SPS</th>\
                  <th>Tax</th>\
                  <th>SGST</th>\
                  <th>CGST</th>\
                  <th>Total</th>\
                  <th>Action</th>\
                </tr>\
              </thead>\
              <tbody>';
            for(var i = 0; i <cartInfo.length; i++) {
              var cart = cartInfo[i];
              cartHtml+='<tr>\
                  <td>'+cart.barcode+'</td>\
                  <td>'+cart.qty+'</td>\
                  <td>'+cart.article+'</td>\
                  <td>'+cart.color+'</td>\
                  <td>'+cart.size+'</td>\
                  <td>'+cart.hsn+'</td>\
                  <td>'+cart.basemrp+'</td>\
                  <td>'+cart.clearancePer+'</td>\
                  <td>'+cart.clearanceAmt+'</td>\
                  <td>'+cart.scheme_amount+'<br><sub class="text-danger">'+cart.scheme_name+'</sub></td>\
                  <td>'+cart.discountAmt+'</td>\
                  <td>'+cart.totSpsDiscount+'</td>\
                  <td>'+cart.taxPer+'</td>\
                  <td>'+cart.sgst+'</td>\
                  <td>'+cart.cgst+'</td>\
                  <td>'+(cart.spsMrp > 0 ? cart.spsMrp : cart.appliedMrp)+'</td>\
                  <td><a class="btn btn-sm btn-danger" href="#" onclick="removeCartItem(\''+cart.barcode+'\');return false;"><i class="fa fas fa-times"></i></a></td>\
                </tr>\
                ';
            }
            cartHtml+='</tbody></table>';
            $(".posWindowContainer").css('opacity', 1);
            $('.cartInfo').html(cartHtml);
            $(".totalMrp").html(' ₹'+response.cartDetails.totalMrp);
            $(".schemeApplied").html(response.cartDetails.schemeApplied);
            $(".totalSchemeDiscount").html(' ₹'+response.cartDetails.totalSchemeDiscount);
            $(".totalClearance").html(' ₹'+response.cartDetails.totalClearance);
            $(".totalDiscount").html(' ₹'+response.cartDetails.totalDiscount);
            $(".totalVoucherDiscount").html(' ₹'+response.cartDetails.totalVoucherDiscount);
            $(".totalSpsDiscount").html(' ₹'+response.cartDetails.totalSpsDiscount);
            $(".totalBdayDiscount").html(' ₹'+response.cartDetails.totalBdayDiscount);
            $(".totalAnnDiscount").html(' ₹'+response.cartDetails.totalAnnDiscount);
            $(".totalSub").html(' ₹'+response.cartDetails.totalSub);
            $(".totalTax").html(' ₹'+response.cartDetails.totalTax);
            $(".totalSgst").html(' ₹'+response.cartDetails.totalSgst);
            $(".totalCgst").html(' ₹'+response.cartDetails.totalCgst);
            $(".totalIgst").html(' ₹'+response.cartDetails.totalIgst);
            $(".totalQty").html(' '+response.cartDetails.totalQty);
            $(".totalGrand").html(' ₹'+response.cartDetails.totalGrand);
            $("#totalAmtPayable").val(response.cartDetails.totalGrand);
            $("#totalAmtPayableText").html(response.cartDetails.totalGrand);
            $(".totalGrandOrig").html(' ₹'+response.cartDetails.totalGrandOrig);
            $(".roundOffAmt").html(' ₹'+response.cartDetails.roundOff);
            paymentInfo();
            calculateTotals();
            if($("#processOrderCheck").val() == 1) {
              if(checkPaymentStatus() == false) {
                toastr.error('Payment info is mismatched, Order not saved.');
                $("#processOrderCheck").val(0);
                return false;
              } else {
                document.bollForm.submit();
              }
            }
            checkAvailableSchemes();
            return false;
        } else {
            $(".orderTotalDiv").hide();
            toastr.error(response.info);
            $(".posWindowContainer").css('opacity', 1);
            $('.cartInfo').html('<div class="alert alert-warning">No product selected! Select product by scanning barcode on right</div>');
            paymentInfo();
            calculateTotals();
            return false;
        }
        // $(".posWindowContainer").css('opacity', 1);
        return false;
    });
    
  }



  $("#scanBarcode").keyup(function (event){
    var barcode = $(this).val();
    barcode = $.trim(barcode);
    if(event.which == 13 && barcode != '') {
      atc(barcode);
    }
  });

  $("#plookup").keyup(function (event){
    var p = $(this).val();
    p = $.trim(p);
    if(event.which == 13 && p != '') {
      getProductLookup();
    }
  });

  function atc(barcode) {
    var discPercent = 0;
    if(document.getElementById("orderDiscCustom") != null) {
      discPercent = document.getElementById("orderDiscCustom").value;
    }
    $.post("{{ route('get-pos-products') }}", {
            _token: document.tokenForm._token.value,
            barcode: barcode,
            discPercent: discPercent,
            cartToken:'{{ $cartToken }}',
            customer_id:'{{ $customer->customer_id }}',
            pos_id:'{{ empty(request()->user()->pos_id) ? 0 : request()->user()->pos_id }}',
        }, function(result) {
            var response = jQuery.parseJSON(result);
            if(response.status == true) {
                toastr.success(response.info);
                $("#scanBarcode").val('');
                $("#scanBarcode").focus();
                populateCart();
                return false;
            } else {
                toastr.error(response.info);
                $(".searchResults").html('<div class="alert alert-danger">No matching product found!</div>');
                $("#scanBarcode").val('');
                $("#scanBarcode").focus();
                return false;
            }
            return false;
        });
  }
  
  

  // atc('WH1094247');
@endif

  $("#telephoneSearch").keyup(function (event){
    if(event.which == 13) {
      var tel = event.target.value;
      $.post("{{ route('get-customer') }}", {
            _token: document.tokenForm._token.value,
            telephone: tel
        }, function(result) {
            var response = jQuery.parseJSON(result);
            if(response.status == true) {
                toastr.success(response.info);
                var html = '<div class="alert alert-success">Found following matching customers!</div>';
                html+='\
                <table class="table table-striped">\
                  <thead>\
                    <tr>\
                      <th>SPS</th>\
                      <th>Name</th>\
                      <th>Email</th>\
                      <th>Telephone</th>\
                      <th>Action</th>\
                    </tr>\
                  </thead>\
                  <tbody>';
                  for(var i = 0; i < response.customers.length; i++) {
                    var c = response.customers[i];
                    html+='<tr>\
                      <td>'+(c.spsInfo == 1 ? 'Yes' : 'No')+'</td>\
                      <td>'+c.fullname+'</td>\
                      <td>'+c.email+'</td>\
                      <td>'+c.telephone+'</td>\
                      <td><a href="{{ route('billing-window') }}?customer='+c.customer_id+'" class="btn btn-small btn-primary">Select</a></td>\
                    </tr>';
                  }
                  html+='</tbody>\
                  </table>\
                ';
                $(".searchResults").html(html);
                return false;
            } else {
                toastr.error(response.info);
                $(".searchResults").html('<div class="alert alert-danger">No matching customer found!</div>');
                return false;
            }
            return false;
        });
    }
  });
  function addNewCustomer()
  {
    $("#addCustomerModal").modal('show');
    return false;
  }

  function saveCustomer(frm) {
        $.post("{{ route('add-new-customer') }}", {
                _token: frm._token.value,
                firstname: frm.firstname.value,
                lastname: frm.lastname.value,
                email: frm.email.value,
                telephone: frm.telephone.value
            }, function(result) {
                var response = jQuery.parseJSON(result);
                if(response.status == true) {
                    toastr.success(response.info);
                    setTimeout("reloadWindow('"+response.customer+"')", 1000);
                    return false;
                } else {
                    toastr.error(response.info);
                    return false;
                }
                return false;
            });
            return false;
    }
    function reloadWindow(c) {
      window.location.href = window.location.href + '?customer='+c;
    }
    @if(!empty($customer->customer_id))
    $("#scanBarcode").val('');
    $("#scanBarcode").focus();
    populateCart();
    @endif
</script>

@endsection