		
		<!-- input quantity modal -->

		<div class="modal fade d-print-none" id="QTY_MODAL" tabindex="-1" role="dialog" aria-labelledby="QTY_MODAL" aria-hidden="true" data-backdrop="static">
	        <div class="modal-dialog" role="document">
	            <div class="modal-content w-75 mx-auto">
	                <div class="modal-body p-1">
	                    <table class="table table-sm mb-0">
                            <tr>
                                <th colspan="3">QUANTITY</th>
                            </tr>
	                        <tr>
                                <th width="10%">
                                    <button class="btn btn-danger btn-block btn-lg" onclick="subtract_qty()">-</button>
                                </th>
	                            <th width="80%" class="text-right">
	                                <input type="hidden" name="PROD_ID" id="PROD_ID" value="" autocomplete="off">
	                                <input type="number" class="form-control form-control-lg text-center" name="PROD_QTY" id="PROD_QTY" value="1" autocomplete="off" autofocus>
	                            </th>
                                <th width="10%">
                                    <button class="btn btn-green btn-block btn-lg" onclick="add_qty()">+</button>
                                </th>
	                        </tr>
                        </table>
	                </div>
                    <div class="modal-footer justify-content-between">
                        <button type="button" class="btn btn-secondary rounded-0" data-dismiss="modal">Cancel</button>
                        <button type="button" class="btn btn-blue rounded-0" onclick="open_order()">ADD ITEM</button>
                    </div>
	            </div>
	        </div>
	    </div>


	    <!-- discounts modal -->

        <div class="modal fade d-print-none" id="DISCOUNTS_MODAL" tabindex="-1" role="dialog" aria-labelledby="DISCOUNTS_MODAL" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog modal-dialog-scrollable" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h6 class="modal-title">
                            DISCOUNTS
                        </h6>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body p-0">
                        <table class="table table-sm mb-0 small">
                            <thead>
                                <tr>
                                    <th width="50%">Discount</th>
                                    <th width="30%">Value</th>
                                    <th width="20%" class="text-center">Action</th>
                                </tr>
                            </thead>
                            <tbody></tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>


        <!-- checkout modal -->	

        <div class="modal fade d-print-none" id="CHECKOUT_MODAL" tabindex="-1" role="dialog" aria-labelledby="CHECKOUT_MODAL" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header pb-1 border-bottom-0">
                        <h6 class="modal-title">Total Amount Due</h6>
                        <h3 class="float-right mb-0" id="CHECKOUT_TOTAL"></h3>
                    </div>
                    <div class="modal-body p-1">
                        <table class="table table-sm mb-0">
                            <tr>
                                <th width="60%" class="align-middle">CASH</th>
                                <th width="40%" class="text-right">
                                    <input type="number" class="form-control form-control-sm text-right" name="PAY_CASH" id="PAY_CASH" value="" autocomplete="off" autofocus>
                                </th>
                            </tr>
                            <tr id="CHECKOUT_CARD_RECEIVED" class="d-none">
                                <th width="60%" class="align-middle">CARD</th>
                                <th width="40%" class="text-right">
                                    <input type="number" class="form-control form-control-sm text-right" name="PAY_CARD" id="PAY_CARD" value="" autocomplete="off" readonly>
                                </th>
                            </tr>
                            <tr id="CHECKOUT_CHECK_RECEIVED" class="d-none">
                                <th width="60%" class="align-middle">CHECK</th>
                                <th width="40%" class="text-right">
                                    <input type="number" class="form-control form-control-sm text-right" name="PAY_CHECK" id="PAY_CHECK" value="" autocomplete="off" readonly>
                                </th>
                            </tr>
                            <tr id="CHECKOUT_LOYALTY_RECEIVED" class="d-none">
                                <th width="60%" class="align-middle">LOYALTY POINTS</th>
                                <th width="40%" class="text-right">
                                    <input type="number" class="form-control form-control-sm text-right" name="PAY_LOYALTY" id="PAY_LOYALTY" value="" autocomplete="off" readonly>
                                </th>
                            </tr>
                            <tr id="CHECKOUT_ACCOUNTS_RECEIVED" class="d-none">
                                <th width="60%" class="align-middle">CREDIT SALE</th>
                                <th width="40%" class="text-right">
                                    <input type="number" class="form-control form-control-sm text-right" name="PAY_ACCOUNTS" id="PAY_ACCOUNTS" value="" autocomplete="off" readonly>
                                </th>
                            </tr>
                            <tr id="CHECKOUT_VOUCHER_RECEIVED" class="d-none">
                                <th width="60%" class="align-middle">GIFT CERT/VOUCHER</th>
                                <th width="40%" class="text-right">
                                    <input type="number" class="form-control form-control-sm text-right" name="PAY_CERT" id="PAY_CERT" value="" autocomplete="off" readonly>
                                </th>
                            </tr>
                        </table>
                        <div class="my-2 d-flex justify-content-between">
                            <button type="button" class="btn btn-blue flex-fill rounded-0 mx-1" onclick="cash_denomination(1000)">1000</button>
                            <button type="button" class="btn btn-blue flex-fill rounded-0 mx-1" onclick="cash_denomination(500)">500</button>
                            <button type="button" class="btn btn-blue flex-fill rounded-0 mx-1" onclick="cash_denomination(200)">200</button>
                            <button type="button" class="btn btn-blue flex-fill rounded-0 mx-1" onclick="cash_denomination(100)">100</button>
                            <button type="button" class="btn btn-blue flex-fill rounded-0 mx-1" onclick="cash_denomination(50)">50</button>
                            <button type="button" class="btn btn-blue flex-fill rounded-0 mx-1" onclick="cash_denomination(20)">20</button>
                        </div>   
                        <button type="button" class="btn btn-secondary btn-block rounded-0 my-2" onclick="toggle_payment_options()">Other Payment Options</button>
                        <div id="PAYMENT_OPTIONS" class="d-none my-2 justify-content-between flex-wrap">
                            <button class="btn btn-primary btn-sm rounded-0 m-1" onclick="process('card')" type="button">CARD</button> 
                            <button class="btn btn-primary btn-sm rounded-0 m-1" onclick="process('check')" type="button">CHECK</button>
                            <button class="btn btn-primary btn-sm rounded-0 m-1" onclick="process('loyalty')" type="button">LOYALTY</button>  
                            <button class="btn btn-primary btn-sm rounded-0 m-1" onclick="process('accounts')" type="button">ACCOUNTS</button>
                            <button class="btn btn-primary btn-sm rounded-0 m-1" onclick="process('voucher')" type="button">VOUCHER</button>
                        </div>  
                        <table class="table table-sm mb-0">
                            <tr class="table-info">
                                <th width="60%" class="align-middle">CHANGE <input type="hidden" id="CHECKOUT_CHANGE_VALUE" name="CHECKOUT_CHANGE_VALUE" value="0"></th>
                                <th width="40%" class="text-right text-blue h3" id="CHECKOUT_CHANGE">0.00</th>
                            </tr>
                        </table>
                    </div>
                    <div class="modal-footer justify-content-between">
                        <button type="button" class="btn btn-danger rounded-0" data-dismiss="modal">Cancel</button>
                        <button type="button" class="btn btn-success rounded-0" onclick="process_order()">PAY</button>
                    </div>
                </div>
            </div>
        </div>


        <!-- card modal -->	

        <div class="modal fade d-print-none mt-3" id="CHECKOUT_CARD_MODAL" tabindex="-1" role="dialog" aria-labelledby="CHECKOUT_CARD_MODAL" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                	<div class="modal-header bg-blue">
                        <h6 class="modal-title text-white">CARD PAYMENT</h6>
                    </div>
                    <div class="modal-body">
                        <form id="form-card">
                        	<div class="form-group row">
			                    <label class="col-4 col-form-label">Bank:</label>
			                    <div class="col-8">
			                    	<select class="form-control" id="CARD_BANK" name="CARD_BANK"></select>
								    <div class="invalid-feedback">Please select bank</div>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <label class="col-4 col-form-label">Card Type:</label>
			                    <div class="col-8">
			                    	<select class="form-control" id="CARD_TYPE" name="CARD_TYPE"></select>
								    <div class="invalid-feedback">Please select card type</div>
			                    </div>
			                </div>
			                <hr>
			                <div class="form-group row">
			                    <label class="col-4 col-form-label">Name on Card:</label>
			                    <div class="col-8">
			                    	<input type="text" class="form-control" id="CARD_NAME" name="CARD_NAME" autocomplete="off">
			                    	<div class="invalid-feedback">Name is required</div>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <label class="col-4 col-form-label">Card Number (LAST 4 DIGITS):</label>
			                    <div class="col-8">
			                    	<input type="number" class="form-control" id="CARD_NUMBER" name="CARD_NUMBER" maxlength="4" minlength="4" autocomplete="off">
			                    	<div class="invalid-feedback">Last 4 digits of card number is required</div>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <label class="col-4 col-form-label">Reference:</label>
			                    <div class="col-8">
			                    	<input type="text" class="form-control" id="CARD_REFERENCE" name="CARD_REFERENCE" autocomplete="off">
			                    	<div class="invalid-feedback">Reference is required</div>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <label class="col-4 col-form-label">Amount:</label>
			                    <div class="col-8">
			                    	<input type="number" class="form-control text-right" id="CARD_AMOUNT" name="CARD_AMOUNT" value="" autocomplete="off" autocomplete="off">
			                    	<div class="invalid-feedback">Amount is required</div>
			                    </div>
			                </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-danger rounded-0 w-25" data-dismiss="modal">Cancel</button>
                        <button type="button" class="btn btn-success rounded-0 w-25" onclick="accept('card')">ACCEPT</button>
                    </div>
                </div>
            </div>
        </div>


        <!-- check modal -->	

        <div class="modal fade d-print-none" id="CHECKOUT_CHECK_MODAL" tabindex="-1" role="dialog" aria-labelledby="CHECKOUT_CHECK_MODAL" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                	<div class="modal-header bg-blue">
                        <h6 class="modal-title text-white">CHECK PAYMENT</h6>
                    </div>
                    <div class="modal-body">
                        <form id="form-check">
                        	<div class="form-group row">
			                    <label class="col-4 col-form-label">Bank:</label>
			                    <div class="col-8">
			                    	<select class="form-control" id="CHECK_BANK" name="CHECK_BANK"></select>
								    <div class="invalid-feedback">Please select bank</div>
			                    </div>
			                </div>
			                <hr>
			                <div class="form-group row">
			                    <label class="col-4 col-form-label">Check Number:</label>
			                    <div class="col-8">
			                    	<input type="number" class="form-control" id="CHECK_NUMBER" name="CHECK_NUMBER">
			                    	<div class="invalid-feedback">Check Number is required</div>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <label class="col-4 col-form-label">Check Date:</label>
			                    <div class="col-8">
			                    	<input type="date" class="form-control" id="CHECK_DATE" name="CHECK_DATE" autocomplete="off">
			                    	<div class="invalid-feedback">Please select Check Date</div>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <label class="col-4 col-form-label">Amount:</label>
			                    <div class="col-8">
			                    	<input type="number" class="form-control text-right" id="CHECK_AMOUNT" name="CHECK_AMOUNT" value="" autocomplete="off" autocomplete="off">
			                    	<div class="invalid-feedback">Amount is required</div>
			                    </div>
			                </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-danger rounded-0 w-25" data-dismiss="modal">Cancel</button>
                        <button type="button" class="btn btn-success rounded-0 w-25" onclick="accept('check')">ACCEPT</button>
                    </div>
                </div>
            </div>
        </div>


        <!-- loyalty points modal -->	

        <div class="modal fade d-print-none" id="CHECKOUT_LOYALTY_MODAL" tabindex="-1" role="dialog" aria-labelledby="CHECKOUT_LOYALTY_MODAL" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                	<div class="modal-header bg-blue">
                        <h6 class="modal-title text-white">LOYALTY POINTS PAYMENT</h6>
                    </div>
                    <div class="modal-body">
                        <form id="form-loyalty">
                        	<div class="form-group row">
			                    <label class="col-4 col-form-label">Scan Card:</label>
			                    <div class="col-8">
			                    	<div class="input-group">
		                                <input type="text" class="form-control" id="LOYALTY_CARD" name="LOYALTY_CARD" autocomplete="off">
		                                <div class="input-group-append">
		                                    <button class="btn btn-primary" type="button" id="scan_loyaltycard()">SCAN</button>
		                                </div>
		                            </div>
								    <div class="invalid-feedback">Please scan loyalty card</div>
			                    </div>
			                </div>
			                <hr>
			                <div class="form-group row">
			                    <label class="col-4 col-form-label">Available Points:</label>
			                    <div class="col-8">
                                    <input type="hidden" value="" autocomplete="off" name="LOYALTY_POINTS_VALUE"  id="LOYALTY_POINTS_VALUE">
			                    	<h3 class="mb-0 text-blue text-right" id="LOYALTY_POINTS">0.00</3>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <label class="col-4 col-form-label">Redeem Points:</label>
			                    <div class="col-8">
			                    	<input type="number" class="form-control text-right" id="LOYALTY_REDEEM" name="LOYALTY_REDEEM" value="" autocomplete="off" autocomplete="off">
			                    	<div class="invalid-feedback">Redeem Points is required</div>
			                    </div>
			                </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-danger rounded-0 w-25" data-dismiss="modal">Cancel</button>
                        <button type="button" class="btn btn-success rounded-0 w-25" onclick="accept('loyalty')">ACCEPT</button>
                    </div>
                </div>
            </div>
        </div>


        <!-- accounts modal -->	

        <div class="modal fade d-print-none" id="CHECKOUT_ACCOUNTS_MODAL" tabindex="-1" role="dialog" aria-labelledby="CHECKOUT_ACCOUNTS_MODAL" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                	<div class="modal-header bg-blue">
                        <h6 class="modal-title text-white">CREDIT SALES</h6>
                    </div>
                    <div class="modal-body">
                        <form id="form-accounts">
                        	<div class="form-group row">
			                    <label class="col-4 col-form-label">Customer:</label>
			                    <div class="col-8">
			                    	<select class="form-control" id="ACCOUNTS_CUSTOMER" name="ACCOUNTS_CUSTOMER">
								      	<option>Select Customer</option>
								    </select>
								    <div class="invalid-feedback">Please select customer</div>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <label class="col-4 col-form-label">Terms:</label>
			                    <div class="col-8">
			                    	<select class="form-control" id="ACCOUNTS_TERMS" name="ACCOUNTS_TERMS">
								      	<option>Select Terms</option>
								    </select>
								    <div class="invalid-feedback">Please select payment terms</div>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <label class="col-4 col-form-label">Due Date:</label>
			                    <div class="col-8">
			                    	<input type="date" class="form-control" id="ACCOUNTS_DUE" name="ACCOUNTS_DUE" autocomplete="off">
			                    	<div class="invalid-feedback">Please select due date</div>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <label class="col-4 col-form-label">Due:</label>
			                    <div class="col-8">
			                    	<input type="number" class="form-control text-right" id="ACCOUNTS_AMOUNT" name="ACCOUNTS_AMOUNT" value="" autocomplete="off" autocomplete="off">
			                    	<div class="invalid-feedback">Amount due is required</div>
			                    </div>
			                </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-danger rounded-0 w-25" data-dismiss="modal">Cancel</button>
                        <button type="button" class="btn btn-success rounded-0 w-25" onclick="accept('accounts')">ACCEPT</button>
                    </div>
                </div>
            </div>
        </div>


        <!-- voucher modal -->	

        <div class="modal fade d-print-none" id="CHECKOUT_VOUCHER_MODAL" tabindex="-1" role="dialog" aria-labelledby="CHECKOUT_VOUCHER_MODAL" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                	<div class="modal-header bg-blue">
                        <h6 class="modal-title text-white">GIFT CERTIFICATE / VOUCHER PAYMENT</h6>
                    </div>
                    <div class="modal-body">
                        <form id="form-vouchers">
                        	<div class="form-group row">
			                    <label class="col-4 col-form-label">Control Number:</label>
			                    <div class="col-8">
			                    	<input type="text" class="form-control" id="VOUCHER_NUMBER" name="VOUCHER_NUMBER" autocomplete="off">
			                    	<div class="invalid-feedback">Control number is required</div>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <label class="col-4 col-form-label">Amount:</label>
			                    <div class="col-8">
			                    	<input type="number" class="form-control text-right" id="VOUCHER_AMOUNT" name="VOUCHER_AMOUNT" value="" autocomplete="off" autocomplete="off">
			                    	<div class="invalid-feedback">Amount is required</div>
			                    </div>
			                </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-danger rounded-0 w-25" data-dismiss="modal">Cancel</button>
                        <button type="button" class="btn btn-success rounded-0 w-25" onclick="accept('voucher')">ACCEPT</button>
                    </div>
                </div>
            </div>
        </div>


        <!-- cash in modal -->	

        <div class="modal fade d-print-none" id="CASH_IN_MODAL" tabindex="-1" role="dialog" aria-labelledby="CASH_IN_MODAL" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                	<div class="modal-header bg-green">
                        <h6 class="modal-title text-dark">CASH IN (+)</h6>
                    </div>
                    <div class="modal-body">
                        <form id="form-cashin">
			                <div class="form-group row">
			                    <label class="col-4 col-form-label">Amount:</label>
			                    <div class="col-8">
			                    	<input type="number" class="form-control text-right" id="CASHIN_AMOUNT" name="CASHIN_AMOUNT" value="" autocomplete="off" autocomplete="off">
			                    	<div class="invalid-feedback">Please enter amount.</div>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <label class="col-4 col-form-label">Notes:</label>
			                    <div class="col-8">
			                    	<textarea class="form-control" id="CASHIN_NOTES" name="CASHIN_NOTES" autocomplete="off"></textarea>
			                    	<div class="invalid-feedback"></div>
			                    </div>
			                </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-danger rounded-0 w-25" data-dismiss="modal">Cancel</button>
                        <button type="button" class="btn btn-success rounded-0 w-25" onclick="process_cash('in')">PAY</button>
                    </div>
                </div>
            </div>
        </div>


        <!-- cash out modal -->	

        <div class="modal fade d-print-none" id="CASH_OUT_MODAL" tabindex="-1" role="dialog" aria-labelledby="CASH_OUT_MODAL" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                	<div class="modal-header bg-danger">
                        <h6 class="modal-title text-white">CASH OUT (-)</h6>
                    </div>
                    <div class="modal-body">
                        <form id="form-cashout">
			                <div class="form-group row">
			                    <label class="col-4 col-form-label">Amount:</label>
			                    <div class="col-8">
			                    	<input type="number" class="form-control text-right" id="CASHOUT_AMOUNT" name="CASHOUT_AMOUNT" value="" autocomplete="off" autocomplete="off">
			                    	<div class="invalid-feedback">Please enter amount.</div>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <label class="col-4 col-form-label">Notes:</label>
			                    <div class="col-8">
			                    	<textarea class="form-control" id="CASHOUT_NOTES" name="CASHOUT_NOTES" autocomplete="off"></textarea>
			                    	<div class="invalid-feedback"></div>
			                    </div>
			                </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-danger rounded-0 w-25" data-dismiss="modal">Cancel</button>
                        <button type="button" class="btn btn-success rounded-0 w-25" onclick="process_cash('out')">PAY</button>
                    </div>
                </div>
            </div>
        </div>


        <!-- change fund modal -->	

        <div class="modal fade d-print-none" id="CASH_CHANGE_MODAL" tabindex="-1" role="dialog" aria-labelledby="CASH_CHANGE_MODAL" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                	<div class="modal-header bg-blue">
                        <h6 class="modal-title text-white">STARTING BALANCE / CHANGE FUND</h6>
                    </div>
                    <div class="modal-body">
                        <form id="form-changefund">
			                <div class="form-group row">
			                    <label class="col-4 col-form-label">Amount:</label>
			                    <div class="col-8">
			                    	<input type="number" class="form-control text-right" id="CASHCHANGE_AMOUNT" name="CASHCHANGE_AMOUNT" value="" autocomplete="off" autocomplete="off">
			                    	<div class="invalid-feedback">Please enter amount.</div>
			                    </div>
			                </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-danger rounded-0 w-25" data-dismiss="modal" onclick="PRELOAD_LOCK_POS_SCREEN();">Cancel</button>
                        <button type="button" class="btn btn-success rounded-0 w-25" onclick="process_cash('change')">SAVE</button>
                    </div>
                </div>
            </div>
        </div>


        <!-- cash breakdown modal -->	

        <div class="modal fade d-print-none" id="CASH_BREAKDOWN_MODAL" tabindex="-1" role="dialog" aria-labelledby="CASH_BREAKDOWN_MODAL" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                	<div class="modal-header bg-blue">
                        <h6 class="modal-title text-white">CASH BREAKDOWN</h6>
                    </div>
                    <div class="modal-body">
                        <form id="form-cashbreakdown">
			                <div class="form-group row">
			                    <div class="col-3">
			                    	<h5 class="mb-0 text-blue text-right">1,000</h5>
			                    </div>
			                    <div class="col-1">
			                    	<h5 class="mb-0 text-blue text-center">X</h5>
			                    </div>
			                    <div class="col-3">
			                    	<input type="number" class="form-control form-control-sm text-right" id="CASHBREAKDOWN_1000" name="CASHBREAKDOWN_1000" value="" autocomplete="off">
			                    	<div class="invalid-feedback"></div>
			                    </div>
			                    <div class="col-1">
			                    	<h5 class="mb-0 text-blue text-center">=</h5>
			                    </div>
			                    <div class="col-4">
                                    <input type="hidden" id="CASHBREAKDOWN_1000_TOTAL" name="CASHBREAKDOWN_1000_TOTAL" value="" autocomplete="off">    
			                    	<h5 class="mb-0 text-blue text-right">0.00</h5>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <div class="col-3">
			                    	<h5 class="mb-0 text-blue text-right">500</h5>
			                    </div>
			                    <div class="col-1">
			                    	<h5 class="mb-0 text-blue text-center">X</h5>
			                    </div>
			                    <div class="col-3">
			                    	<input type="number" class="form-control form-control-sm text-right" id="CASHBREAKDOWN_500" name="CASHBREAKDOWN_500" value="" autocomplete="off">
			                    	<div class="invalid-feedback"></div>
			                    </div>
			                    <div class="col-1">
			                    	<h5 class="mb-0 text-blue text-center">=</h5>
			                    </div>
			                    <div class="col-4">
                                    <input type="hidden" id="CASHBREAKDOWN_500_TOTAL" name="CASHBREAKDOWN_500_TOTAL" value="" autocomplete="off">
			                    	<h5 class="mb-0 text-blue text-right">0.00</h5>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <div class="col-3">
			                    	<h5 class="mb-0 text-blue text-right">200</h5>
			                    </div>
			                    <div class="col-1">
			                    	<h5 class="mb-0 text-blue text-center">X</h5>
			                    </div>
			                    <div class="col-3">
			                    	<input type="number" class="form-control form-control-sm text-right" id="CASHBREAKDOWN_200" name="CASHBREAKDOWN_200" value="" autocomplete="off">
			                    	<div class="invalid-feedback"></div>
			                    </div>
			                    <div class="col-1">
			                    	<h5 class="mb-0 text-blue text-center">=</h5>
			                    </div>
			                    <div class="col-4">
                                    <input type="hidden" id="CASHBREAKDOWN_200_TOTAL" name="CASHBREAKDOWN_200_TOTAL" value="" autocomplete="off">
			                    	<h5 class="mb-0 text-blue text-right">0.00</h5>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <div class="col-3">
			                    	<h5 class="mb-0 text-blue text-right">100</h5>
			                    </div>
			                    <div class="col-1">
			                    	<h5 class="mb-0 text-blue text-center">X</h5>
			                    </div>
			                    <div class="col-3">
			                    	<input type="number" class="form-control form-control-sm text-right" id="CASHBREAKDOWN_100" name="CASHBREAKDOWN_100" value="" autocomplete="off">
			                    	<div class="invalid-feedback"></div>
			                    </div>
			                    <div class="col-1">
			                    	<h5 class="mb-0 text-blue text-center">=</h5>
			                    </div>
			                    <div class="col-4">
                                    <input type="hidden" id="CASHBREAKDOWN_100_TOTAL" name="CASHBREAKDOWN_100_TOTAL" value="" autocomplete="off">
			                    	<h5 class="mb-0 text-blue text-right">0.00</h5>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <div class="col-3">
			                    	<h5 class="mb-0 text-blue text-right">50</h5>
			                    </div>
			                    <div class="col-1">
			                    	<h5 class="mb-0 text-blue text-center">X</h5>
			                    </div>
			                    <div class="col-3">
			                    	<input type="number" class="form-control form-control-sm text-right" id="CASHBREAKDOWN_50" name="CASHBREAKDOWN_50" value="" autocomplete="off">
			                    	<div class="invalid-feedback"></div>
			                    </div>
			                    <div class="col-1">
			                    	<h5 class="mb-0 text-blue text-center">=</h5>
			                    </div>
			                    <div class="col-4">
                                    <input type="hidden" id="CASHBREAKDOWN_50_TOTAL" name="CASHBREAKDOWN_50_TOTAL" value="" autocomplete="off">
			                    	<h5 class="mb-0 text-blue text-right">0.00</h5>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <div class="col-3">
			                    	<h5 class="mb-0 text-blue text-right">20</h5>
			                    </div>
			                    <div class="col-1">
			                    	<h5 class="mb-0 text-blue text-center">X</h5>
			                    </div>
			                    <div class="col-3">
			                    	<input type="number" class="form-control form-control-sm text-right" id="CASHBREAKDOWN_20" name="CASHBREAKDOWN_20" value="" autocomplete="off">
			                    	<div class="invalid-feedback"></div>
			                    </div>
			                    <div class="col-1">
			                    	<h5 class="mb-0 text-blue text-center">=</h5>
			                    </div>
			                    <div class="col-4">
                                    <input type="hidden" id="CASHBREAKDOWN_20_TOTAL" name="CASHBREAKDOWN_20_TOTAL" value="" autocomplete="off">
			                    	<h5 class="mb-0 text-blue text-right">0.00</h5>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <div class="col-3">
			                    	<h5 class="mb-0 text-blue text-right">10</h5>
			                    </div>
			                    <div class="col-1">
			                    	<h5 class="mb-0 text-blue text-center">X</h5>
			                    </div>
			                    <div class="col-3">
			                    	<input type="number" class="form-control form-control-sm text-right" id="CASHBREAKDOWN_10" name="CASHBREAKDOWN_10" value="" autocomplete="off">
			                    	<div class="invalid-feedback"></div>
			                    </div>
			                    <div class="col-1">
			                    	<h5 class="mb-0 text-blue text-center">=</h5>
			                    </div>
			                    <div class="col-4">
                                    <input type="hidden" id="CASHBREAKDOWN_10_TOTAL" name="CASHBREAKDOWN_10_TOTAL" value="" autocomplete="off">
			                    	<h5 class="mb-0 text-blue text-right">0.00</h5>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <div class="col-3">
			                    	<h5 class="mb-0 text-blue text-right">5</h5>
			                    </div>
			                    <div class="col-1">
			                    	<h5 class="mb-0 text-blue text-center">X</h5>
			                    </div>
			                    <div class="col-3">
			                    	<input type="number" class="form-control form-control-sm text-right" id="CASHBREAKDOWN_5" name="CASHBREAKDOWN_5" value="" autocomplete="off">
			                    	<div class="invalid-feedback"></div>
			                    </div>
			                    <div class="col-1">
			                    	<h5 class="mb-0 text-blue text-center">=</h5>
			                    </div>
			                    <div class="col-4">
                                    <input type="hidden" id="CASHBREAKDOWN_5_TOTAL" name="CASHBREAKDOWN_5_TOTAL" value="" autocomplete="off">
			                    	<h5 class="mb-0 text-blue text-right">0.00</h5>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <div class="col-3">
			                    	<h5 class="mb-0 text-blue text-right">1</h5>
			                    </div>
			                    <div class="col-1">
			                    	<h5 class="mb-0 text-blue text-center">X</h5>
			                    </div>
			                    <div class="col-3">
			                    	<input type="number" class="form-control form-control-sm text-right" id="CASHBREAKDOWN_1" name="CASHBREAKDOWN_1" value="" autocomplete="off">
			                    	<div class="invalid-feedback"></div>
			                    </div>
			                    <div class="col-1">
			                    	<h5 class="mb-0 text-blue text-center">=</h5>
			                    </div>
			                    <div class="col-4">
                                    <input type="hidden" id="CASHBREAKDOWN_1_TOTAL" name="CASHBREAKDOWN_1_TOTAL" value="" autocomplete="off">
			                    	<h5 class="mb-0 text-blue text-right">0.00</h5>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <div class="col-3">
			                    	<h5 class="mb-0 text-blue text-right">Cents</h5>
			                    </div>
			                    <div class="col-1"></div>
			                    <div class="col-3">
			                    	<input type="number" class="form-control form-control-sm text-right" id="CASHBREAKDOWN_CENTS" name="CASHBREAKDOWN_CENTS" value="" autocomplete="off">
			                    	<div class="invalid-feedback"></div>
			                    </div>
			                    <div class="col-1">
			                    	<h5 class="mb-0 text-blue text-center">=</h5>
			                    </div>
			                    <div class="col-4">
                                    <input type="hidden" id="CASHBREAKDOWN_CENTS_TOTAL" name="CASHBREAKDOWN_CENTS_TOTAL" value="" autocomplete="off">
			                    	<h5 class="mb-0 text-blue text-right">0.00</h5>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <div class="col-3">
			                    	<h5 class="mb-0 text-blue text-right">Checks</h5>
			                    </div>
			                    <div class="col-2">
			                    	<input type="number" class="form-control form-control-sm text-right" id="CASHBREAKDOWN_CHECKS_QTY" name="CASHBREAKDOWN_CHECKS_QTY" value="" autocomplete="off">
			                    	<div class="invalid-feedback"></div>
			                    </div>
			                    <div class="col-3">
			                    	<input type="number" class="form-control form-control-sm text-right" id="CASHBREAKDOWN_CHECKS" name="CASHBREAKDOWN_CHECKS" value="" autocomplete="off">
			                    	<div class="invalid-feedback"></div>
			                    </div>
			                    <div class="col-1">
			                    	<h5 class="mb-0 text-blue text-center">=</h5>
			                    </div>
			                    <div class="col-3">
                                    <input type="hidden" id="CASHBREAKDOWN_CHECKS_TOTAL" name="CASHBREAKDOWN_CHECKS_TOTAL" value="" autocomplete="off">
			                    	<h5 class="mb-0 text-blue text-right">0.00</h5>
			                    </div>
			                </div>
			                <div class="form-group row border-top border-bottom border-blue">
			                    <label class="col-4 col-form-label">TOTAL:</label>
			                    <div class="col-8">
			                    	<h3 class="mb-0 text-blue text-right" id="CASHBREAKDOWN_TOTAL">0.00</h3>
			                    </div>
			                </div>
                        </form>
                    </div>
                    <div class="modal-footer justify-content-between">
                        <button type="button" class="btn btn-danger rounded-0" data-dismiss="modal">Cancel</button>
                        <button type="button" class="btn btn-success rounded-0" onclick="process_cash('breakdown')">PRINT & END SHIFT</button>
                    </div>
                </div>
            </div>
        </div>


        <!-- z reading modal -->	

        <div class="modal fade d-print-none" id="REPORTS_ZREADING_MODAL" tabindex="-1" role="dialog" aria-labelledby="REPORTS_ZREADING_MODAL" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                	<div class="modal-header bg-blue">
                        <h6 class="modal-title text-white">Z-READING REPORT</h6>
                    </div>
                    <div class="modal-body">
                        <form id="form-zreport">
                        	<div class="form-group row">
			                    <label class="col-4 col-form-label">FROM DATE:</label>
			                    <div class="col-8">
			                    	<input type="date" class="form-control" id="ZREADING_FROM_DATE" name="ZREADING_FROM_DATE">
			                    	<div class="invalid-feedback">Please select date</div>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <div class="col-12 text-center small">
			                    	Z READING is the total sales report of the machine generated by the system. It is used by the Bureau of Internal Revenue (BIR) for auditing purposes.
			                    </div>
			                </div>
                        </form>
                    </div>
                    <div class="modal-footer justify-content-between">
                        <button type="button" class="btn btn-danger rounded-0" data-dismiss="modal">Cancel</button>
                        <button type="button" class="btn btn-primary rounded-0" onclick="print_report('zreading')">PRINT</button>
                    </div>
                </div>
            </div>
        </div>


        <!-- end of shift modal -->	

        <div class="modal fade d-print-none" id="REPORTS_ENDSHIFT_MODAL" tabindex="-1" role="dialog" aria-labelledby="REPORTS_ENDSHIFT_MODAL" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                	<div class="modal-header bg-blue">
                        <h6 class="modal-title text-white">END OF SHIFT</h6>
                    </div>
                    <div class="modal-body">
                        <form id="form-endshift">
                            <input type="hidden" name="SHIFT_AMOUNT" id="SHIFT_AMOUNT">
                       		<div class="form-group row">
			                    <label class="col-4 col-form-label">Cashier</label>
			                    <div class="col-8">
			                    	<input type="text" class="form-control" id="SHIFT_NAME" name="SHIFT_NAME" readonly>
			                    	<div class="invalid-feedback">Cashier name is required</div>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <label class="col-4 col-form-label">START TIME:</label>
			                    <div class="col-8">
			                    	<input type="time" class="form-control" id="SHIFT_START_TIME" name="SHIFT_START_TIME" readonly>
			                    	<div class="invalid-feedback">Please select time</div>
			                    </div>
			                </div>
			                <div class="form-group row">
			                    <label class="col-4 col-form-label">END TIME:</label>
			                    <div class="col-8">
			                    	<input type="time" class="form-control" id="SHIFT_END_TIME" name="SHIFT_END_TIME" readonly>
			                    	<div class="invalid-feedback">Please select time</div>
			                    </div>
			                </div>
                        </form>
                    </div>
                    <div class="modal-footer justify-content-evenly">
                        <button type="button" class="btn btn-danger rounded-0" data-dismiss="modal">Cancel</button>
                        <button type="button" class="btn btn-info rounded-0" onclick="print_report('xreading')">X Reading</button>
                        <button type="button" class="btn btn-primary rounded-0" onclick="end_shift()">END SHIFT &amp; LOG-OUT</button>
                    </div>
                </div>
            </div>
        </div>


        <!-- sales return modal -->  

        <div class="modal fade d-print-none" id="SALES_RETURN_MODAL" tabindex="-1" role="dialog" aria-labelledby="SALES_RETUR_MODAL" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header bg-blue">
                        <h6 class="modal-title text-dark text-white">SALES RETURN</h6>
                    </div>
                    <div class="modal-body">
                        <form id="form-salesreturn">
                            <div class="btn-group btn-group-toggle" data-toggle="buttons">
                                <label class="btn btn-secondary active">
                                    <input type="radio" name="SALESRETURN_OPTION" id="SALESRETURN_OPTION_CASH" autocomplete="off" checked> CASH SALES RETURN
                                </label>
                                <label class="btn btn-secondary">
                                    <input type="radio" name="SALESRETURN_OPTION" id="SALESRETURN_OPTION_CREDIT" autocomplete="off"> CREDIT SALES RETURN
                                </label>
                            </div>
                            <div class="form-group row">
                                <label class="col-4 col-form-label">Reason:</label>
                                <div class="col-8">
                                    <textarea class="form-control" id="SALESRETURN_NOTES" name="SALESRETURN_NOTES"></textarea>
                                    <div class="invalid-feedback">Please provide reason for return of sales</div>
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-danger rounded-0 w-25" data-dismiss="modal">Cancel</button>
                        <button type="button" class="btn btn-success rounded-0 w-25" onclick="process_cash('return')">PAY</button>
                    </div>
                </div>
            </div>
        </div>

        <!-- new audit modal -->  

        <div class="modal fade d-print-none" id="NEW_AUDIT_MODAL" tabindex="-1" role="dialog" aria-labelledby="NEW_AUDIT_MODAL" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header bg-blue">
                        <h6 class="modal-title text-white">New Inventory Audit Transaction</h6>
                    </div>
                    <div class="modal-body">
                        <form id="form-audit">
                            <input type="hidden" name="audit_id" id="audit_id" value="0">
                            <div class="form-group row">
                                <label class="col-sm-4 col-form-label">BRANCH:</label>
                                <div class="col-sm-8">
                                    <select class="form-control" name="INVAUDIT_BRANCH" id="INVAUDIT_BRANCH" disabled>
                                        <option>Select Branch</option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-group row">
                                <label class="col-sm-4 col-form-label">STORAGE:</label>
                                <div class="col-sm-8">
                                    <select class="form-control" name="INVAUDIT_STORAGE" id="INVAUDIT_STORAGE" disabled>
                                        <option>Select Location</option>
                                    </select>
                                </div>
                            </div>
                            <table class="table table-sm mb-0">
                                <thead>
                                    <tr>
                                        <th>PRODUCT</th>
                                        <th class="text-right">SYSTEM QTY</th>
                                        <th class="text-right">ACTUAL QTY</th>
                                        <th class="text-right">DISCREPANCY</th>
                                    </tr>
                                </thead>
                            </table>
                            <div id="modal-audit-div">
                                <table id="modal-audit-tbl" class="table table-sm">
                                    <tbody></tbody>
                                </table>
                            </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-danger rounded-0 w-25" data-dismiss="modal">Cancel</button>
                        <button type="button" class="btn btn-success rounded-0 w-25" onclick="save_audit()">Save</button>
                    </div>
                </div>
            </div>
        </div>


        <!-- view audit modal -->  

        <div class="modal fade d-print-none" id="VIEW_AUDIT_MODAL" tabindex="-1" role="dialog" aria-labelledby="VIEW_AUDIT_MODAL" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header bg-blue">
                        <h6 class="modal-title text-white">Inventory Audit Transaction</h6>
                    </div>
                    <div class="modal-body">
                        <form id="form-audit-view">
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="row no-gutters mb-1">
                                        <div class="col-md-4"><strong>BRANCH:</strong></div>
                                        <div id="INVAUDIT_BRANCH" class="col-md-8"></div>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="row no-gutters mb-3">
                                        <div class="col-md-4"><strong>STORAGE:</strong></div>
                                        <div id="INVAUDIT_LOCATION" class="col-md-8"></div>
                                    </div>
                                </div>
                            </div>
                            <table class="table table-sm mb-0">
                                <thead>
                                    <tr>
                                        <th width="20%">PRODUCT</th>
                                        <th width="30%" class="text-right">SYSTEM QTY</th>
                                        <th width="30%" class="text-right">ACTUAL QTY</th>
                                        <th width="20%" class="text-right">DISCREPANCY</th>
                                    </tr>
                                </thead>
                            </table>
                            <div id="modal-audit-view-div">
                                <table id="modal-audit-view-tbl" class="table table-sm">
                                    <tbody></tbody>
                                </table>
                            </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-danger rounded-0 w-25" data-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>  


        <!-- purchase modal -->  

        <div class="modal fade d-print-none" id="PURCHASE_MODAL" tabindex="-1" role="dialog" aria-labelledby="PURCHASE_MODAL" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header bg-blue">
                        <h6 class="modal-title text-white">New Purchase Order</h6>
                    </div>
                    <div class="modal-body">
                        <div>
                            <h6 class="modal-title">Purchase Order Date</h6>
                            <input type="date" class="form-control" id="PO_DATE_DTP" disabled>
                            <h6 class="modal-title">Delivery Date</h6>
                            <input type="date" class="form-control" id="EXPECTED_DATE_DTP" required>
                        </div>
                        <form id="form-purchase">
                            <table class="table table-sm mb-0">
                                <thead>
                                    <tr>
                                        <th width="80%">PRODUCT</th>
                                        <th width="20%" class="text-right">QTY</th>
                                    </tr>
                                </thead>
                            </table>
                            <div id="modal-purchase-div">
                                <table id="modal-purchase-tbl" class="table table-sm">
                                    <tbody></tbody>
                                </table>
                            </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-danger rounded-0 w-25" data-dismiss="modal">Cancel</button>
                        <button type="button" class="btn btn-success rounded-0 w-25" onclick="SAVE_PO()">Save</button>
                    </div>
                </div>
            </div>
        </div>

        <!-- view purchase modal -->  

        <div class="modal fade d-print-none" id="VIEW_PURCHASE_MODAL" tabindex="-1" role="dialog" aria-labelledby="VIEW_PURCHASE_MODAL" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header bg-blue">
                        <h6 class="modal-title text-white">Purchase Order No. <span id="PO_REFNO"></span></h6>
                    </div>
                    <div class="modal-body">
                        <form id="form-purchase-view">
                            <input type="hidden" name="PO_ID" id="PO_ID">
                            <table class="table table-sm mb-0">
                                <thead>
                                    <tr>
                                        <th width="80%">PRODUCT</th>
                                        <th width="20%" class="text-right">QTY</th>
                                    </tr>
                                </thead>
                            </table>
                            <div id="modal-purchase-view-div">
                                <table id="modal-purchase-view-tbl" class="table table-sm">
                                    <tbody></tbody>
                                </table>
                            </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-danger rounded-0 w-25" data-dismiss="modal">Cancel</button>
                        <button type="button" class="btn btn-success rounded-0 w-25" onclick="update_order()">Save</button>
                    </div>
                </div>
            </div>
        </div>

        <!-- receiving modal -->  

        <div class="modal fade d-print-none" id="RECEIVE_MODAL" tabindex="-1" role="dialog" aria-labelledby="RECEIVE_MODAL" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header bg-blue">
                        <h6 class="modal-title text-white">Purchase Order No. <span id="PO_REFNO"></span></h6>
                    </div>
                    <div class="modal-body">
                        <form id="form-incoming">
                            <input type="hidden" name="PO_ID" id="PO_ID">
                            <div class="form-group row">
                                <label class="col-sm-4 col-form-label">Delivery Code:</label>
                                <div class="col-sm-8">
                                    <input type="text" class="form-control" name="DELIVERY_CODE" id="DELIVERY_CODE">
                                </div>
                            </div>
                            <table class="table table-sm mb-0">
                                <thead>
                                    <tr>
                                        <th width="40%">PRODUCT</th>
                                        <th width="30%" class="text-right">Ordered QTY</th>
                                        <th width="30%" class="text-right">Received QTY</th>
                                    </tr>
                                </thead>
                            </table>
                            <div id="modal-incoming-view-div">
                                <table id="modal-incoming-view-tbl" class="table table-sm">
                                    <tbody></tbody>
                                </table>
                            </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-danger rounded-0 w-25" data-dismiss="modal">Cancel</button>
                        <button type="button" class="btn btn-success rounded-0 w-25" onclick="receive_order()">Save</button>
                    </div>
                </div>
            </div>
        </div>



        <!-- get orders list modal -->

        <div class="modal fade d-print-none" id="GET_ORDERLIST_MODAL" tabindex="-1" role="dialog" aria-labelledby="GET_ORDERLIST_MODAL" aria-hidden="true" data-backdrop="static">
            <div class="modal-dialog modal-dialog-scrollable" role="document">
                <div class="modal-content">
                    <div class="modal-header bg-blue">
                        <h6 class="modal-title text-white">
                            ORDER LIST <span id="tbl-number"></span>
                        </h6>
                        <button type="button" class="close text-white" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">

                    <div class="col-md-12 ol-modal">
                        <h6>Reference No.</h6>
                        <div class="row">
                            <input type="text" class="col-md-8 form-control" id="ORDER_REFERENCE_TXT"
                            onkeydown="if(event.which == 13 || event.keyCode == 13 || event.key === 'Enter'){get_bill(true)}">
                            <button type="button" class="col-md-2 btn btn-success float-right" data-id="" onclick="get_bill(true)">SEARCH</button>
                            <button type="button" class="col-md-2 btn btn-danger float-right" data-id="" onclick="Android.CALL('SCAN_BARCODE', 'ORDER_REFERENCE_TXT');">SCAN QR</button>
                        </div>
                    </div>


                        <table class="table table-sm mb-0">
                            <thead>
                                <tr class="table-info">
                                    <th width="30%">Reference No.</th>
                                    <th width="45%" colspan="2">Customer</th>
                                    <th width="25%" class="text-right">Date</th>
                                </tr>
                            </thead>
                        </table>

                        <div id="modal-tbl-bill-div">
                            <table id="modal-tbl-bill" class="table table-sm mb-0">
                                <tbody></tbody>
                            </table>
                        </div>

                        <table class="table table-sm mb-0">
                            <tfoot>
                            </tfoot>
                        </table>
                    </div>
                    <div class="modal-footer">
                    </div>
                </div>
            </div>
        </div>

        