
                    <a class="navbar-brand text-white d-none">
                        <img id="with-internet" class="img-icon" src="<!--[#SITE_URL;]-->/res/img/with-internet.png" alt="PeakPOS">
                        <img id="no-internet" class="img-icon d-none" src="<!--[#SITE_URL;]-->/res/img/no-internet.png" alt="PeakPOS">
                    </a>
                </nav>

                <!-- main content -->
                <section class="py-3 px-1">
                    <div class="table-responsive table-fixed" style="max-height:95vh;padding-bottom:20vh;">
                        <table class="table table-fit table-header-fixed table-header-primary-color" id="INVAUDIT_DGV">
                            <thead class="bg_primary--cus table-info text-white">
                                <tr id="INVAUDIT_DGV_HEADER">
                                    <th id="INVAUDIT_DGV_HEADER_ROW_COUNT" class="d-none">#</th>
                                    <th id="INVAUDIT_DGV_HEADER_REC_INVAUDIT_ID" class="d-none">ID</th>
                                    <th id="INVAUDIT_DGV_HEADER_REC_INVAUDIT_ACC_GROUP_ID" class="d-none">Branch</th>
                                    <th id="INVAUDIT_DGV_HEADER_REC_INVAUDIT_ACC_GROUP_ID_DESCRIPTION" class="d-none">Branch</th>
                                    <th id="INVAUDIT_DGV_HEADER_REC_INVAUDIT_DATE_AUDIT">Transaction Date &amp; Time</th>
                                    <th id="INVAUDIT_DGV_HEADER_REC_INVAUDIT_CAT_STORAGE_ID" class="d-none"></th>
                                    <th id="INVAUDIT_DGV_HEADER_REC_INVAUDIT_CAT_STORAGE_ID_DESCRIPTION">Storage Location</th>
                                    <th id="INVAUDIT_DGV_HEADER_REC_INVAUDIT_STATUS" class="d-none">Status</th>
                                </tr>
                            </thead>
                            <tbody class="hub-tb-body" style="display: contents;">
                                <tr id="INVAUDIT_DGV_ROW">
                                    <td id="INVAUDIT_DGV_ROW_ROW_COUNT" class="d-none"></td>
                                    <td id="INVAUDIT_DGV_ROW_REC_INVAUDIT_ID" class="d-none"></td>
                                    <td id="INVAUDIT_DGV_ROW_REC_INVAUDIT_ACC_GROUP_ID" class="d-none"></td>
                                    <td id="INVAUDIT_DGV_ROW_REC_INVAUDIT_ACC_GROUP_ID_DESCRIPTION" class="d-none"></td>
                                    <td id="INVAUDIT_DGV_ROW_REC_INVAUDIT_DATE_AUDIT" style="width: 300px;"></td>
                                    <td id="INVAUDIT_DGV_ROW_REC_INVAUDIT_CAT_STORAGE_ID" class="d-none"></td>
                                    <td id="INVAUDIT_DGV_ROW_REC_INVAUDIT_CAT_STORAGE_ID_DESCRIPTION"></td>
                                    <td id="INVAUDIT_DGV_ROW_REC_INVAUDIT_STATUS" class="d-none"></td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </section>
            </div>
        </div>
    </main>

    <button class="btn round btn-floating btn__primary--cus btn-lg" id="ADD_BBI" style="bottom:10px;"><i class="fas fa-plus"></i> New Transaction</button>

    <!-- Modal -->
    <div  class="col-xs-8 col-sm-12 modal-mob" id="INVAUDIT_MODAL" style="display: none;">
        <div class="modal-header py-2">
            <h5 class="modal-title font-weight-bold" style="color:black;"><span id="MODAL_TITLE_MM"></span> Inventory Audit</h5>
            <button type="button" class="btn btn-secondary float-right" id="MODAL_CLOSE_CMD">Close</button>
            <input type="hidden">
        </div>
        <div class="modal-body modal__body--limiter">
            <div class="form-group" id="REC_INVAUDIT_ACC_GROUP_ID_DLG_BLOCK">
                <label class="">Branch</label>
                <input id="REC_INVAUDIT_ACC_GROUP_ID_LBL"  class="form-control" disabled>
            </div>  
            <div class="form-group" id="REC_INVAUDIT_CAT_STORAGE_DLG_BLOCK">
                <label class="">Storage Location</label>
                <input id="REC_INVAUDIT_CAT_STORAGE_LBL"  class="form-control" disabled>
            </div> 
            <div class="form-group" id="REC_INVAUDIT_CAT_STORAGE_DLG_BLOCK">
                <label class="">Filter by</label>
                 <select class="form-control" id="SEARCH_FILTER_BY_CMB">
                        <option value="0" selected>All Item</option>
                        <option value="1" selected>Finished Goods</option>
                        <option value="2">Ingredients</option>
                    </select>
            </div> 

            <div class="form-row form-row-mob mt-3">
                <div class="table-responsive table-fixed">
                    <table class="table table-fit table-header-fixed table-header-primary-color" id="INVENTORY_AUDIT_LINE_DGV">
                        <thead class="bg_primary--cus table-info text-white">
                            <tr id="INVENTORY_AUDIT_LINE_DGV_HEADER">
                                <th id="INVENTORY_AUDIT_LINE_DGV_HEADER_ROW_COUNT" class="d-none">#</th>
                                <th id="INVENTORY_AUDIT_LINE_DGV_HEADER_REC_INVAUDIT_LINE_ID" class="d-none">ID</th>
                                <th id="INVENTORY_AUDIT_LINE_DGV_HEADER_REC_INVAUDIT_LINE_REC_INVAUDIT_ID" class="d-none">Inventory Audit</th>
                                <th id="INVENTORY_AUDIT_LINE_DGV_HEADER_REC_INVAUDIT_LINE_CAT_PRODUCT_ID" class="d-none">Product</th>
                                <th id="INVENTORY_AUDIT_LINE_DGV_HEADER_REC_INVAUDIT_LINE_CAT_PRODUCT_ID_DESCRIPTION" width="40%">Product</th>
                                <th id="INVENTORY_AUDIT_LINE_DGV_HEADER_REC_INVAUDIT_LINE_QUANTITY_SYSTEM" class="text-right d-none">System QTY</th>
                                <th id="INVENTORY_AUDIT_LINE_DGV_HEADER_REC_INVAUDIT_LINE_QUANTITY_ACTUAL" class="">Actual QTY</th>
                                <th id="INVENTORY_AUDIT_LINE_DGV_HEADER_DISCREPANCY" class="text-right d-none">Discrepancy</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr id="INVENTORY_AUDIT_LINE_DGV_ROW">
                                <td id="INVENTORY_AUDIT_LINE_DGV_ROW_ROW_COUNT" class="d-none">></td>
                                <td id="INVENTORY_AUDIT_LINE_DGV_ROW_REC_INVAUDIT_LINE_ID" class="d-none"></td>
                                <td id="INVENTORY_AUDIT_LINE_DGV_ROW_REC_INVAUDIT_LINE_REC_INVAUDIT_ID" class="d-none"></td>
                                <td id="INVENTORY_AUDIT_LINE_DGV_ROW_REC_INVAUDIT_LINE_CAT_PRODUCT_ID" class="d-none"></td>
                                <td id="INVENTORY_AUDIT_LINE_DGV_ROW_REC_INVAUDIT_LINE_CAT_PRODUCT_ID_DESCRIPTION" width="40%"></td>
                                <td id="INVENTORY_AUDIT_LINE_DGV_ROW_REC_INVAUDIT_LINE_QUANTITY_SYSTEM" class="text-right d-none">
                                    <input type="number" class="form-control" style="text-align: right;" readonly disabled>
                                </td>
                                <td id="INVENTORY_AUDIT_LINE_DGV_ROW_REC_INVAUDIT_LINE_QUANTITY_ACTUAL" class="text-right">
                                    <input type="number" class="form-control" style="text-align: right;" onfocus="this.select();" onkeyup="HTTP_CALCULATE_DISCREPANCY(this.id);">
                                </td>
                                <td id="INVENTORY_AUDIT_LINE_DGV_ROW_DISCREPANCY" class="text-right d-none">
                                    <input type="number" class="form-control" style="text-align: right;" readonly disabled>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <!-- Modal footer -->
        <div class="modal-footer justify-content-end">
            <button type="button" class="btn btn-success" id="SAVE_BBI">Save</button>
        </div>
    </div>

    <!--[#IMPORT:pos-end-shift-modal.tpl;]-->

    <!-- jQuery -->
    <script type="text/javascript" src="<!--[#SITE_URL;]-->/res/vendor/jquery/jquery.min.js"></script>

    <!-- Bootstrap -->
    <script type="text/javascript" src="<!--[#SITE_URL;]-->/res/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>

    <!-- Alertify -->
    <script type="text/javascript" src="<!--[#SITE_URL;]-->/res/vendor/alertifyjs/alertify.min.js"></script>

    <!-- Select2 -->
    <script type="text/javascript" src="<!--[#SITE_URL;]-->/res/vendor/select2/js/select2.min.js"></script>

    <!--  Import Libraries  -->
    <script type="text/javascript" src="<!--[#SITE_URL;]-->/res/lib/javascript.js"></script>
    <script type="text/javascript" src="<!--[#SITE_URL;]-->/p/comm/common.js"></script>