<head>
<style type="text/css">
button {
 	margin-left: 2px;
 	margin-right: 2px;
}

.modal-header {
	background-color: #3c8dbc;
	color: white;
}

#showGoodsReceivingLCView {
    z-index: 1110!important; /* must set here to let date picker display on top */
}

</style>
</head>

<!-- Submit pop up Modal HTML -->
<div id="deleteGoodsReceivingConfirmationView" class="modal fade" style="overflow: auto;overflow-y: scroll;">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="modalDeleteGoodsReceivingConfirmationTitle"></h4>
            </div>
            
            <div class="modal-body">
                <div id="modalDeleteGoodsReceivingConfirmationContent">
                
                </div>
            </div>
            
            <div class="modal-footer">
                <div id="modalDeleteGoodsReceivingConfirmationButton">
               </div>
            </div>
        </div>
    </div>
</div>

<!-- show GoodsReceivingInquiry Modal HTML -->
<div id="showGoodsReceivingInquiryView" class="modal fade" style="overflow: auto;overflow-y: scroll;" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog"  style="width: 60%;">
        <div class="modal-content">
            <div class="modal-header" id="modalShowGoodsReceivingInquiryContent">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="modalShowGoodsReceivingInquiryViewTitle" >Message</h4>
            </div>
            
            <div class="modal-body">
                <div id="modalShowGoodsReceivingInquiryViewContent">
                </div>
            </div>
            <div class="modal-footer">
                <div id="modalShowGoodsReceivingInquiryButtonContent">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
               </div>
            </div>
        </div>
    </div>
</div>

<!-- show LC Modal HTML -->
<div id="showGoodsReceivingLCView" class="modal fade" style="overflow: auto;overflow-y: scroll;" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog"  style="width: 30%;">
        <div class="modal-content">
            <div class="modal-header" id="modalShowGoodsReceivingLCContent">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="modalShowGoodsReceivingLCViewTitle" >Line Comment</h4>
            </div>
            <div class="modal-body">
                <div id="modalShowGoodsReceivingLCViewContent">
                    
                </div>
            </div>
            <div class="modal-footer">
                <div id="modalShowGoodsReceivingLCButtonContent">
               </div>
            </div>
        </div>
    </div>
</div>

<!-- Add Project Modal HTML -->
<div id="addGoodsReceivingView" class="modal fade" style="overflow: auto;overflow-y: scroll;" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" style="width: 55%;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">Goods Receiving</h4>
            </div>
            <div class="modal-body">
	            <div id="modalAddGoodsReceivingContent">
	        	</div>
            </div>
            <div class="modal-footer">
            	<div id="modalAddGoodsReceivingFooter">
			   </div>
            </div>
        </div>
    </div>
</div>

<!-- show GoodsReceiving Modal HTML -->
<div id="showGoodsReceivingView" class="modal fade" style="overflow: auto;overflow-y: scroll;" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog"  style="width: 35%;">
        <div class="modal-content">
            <div class="modal-header" id="modalShowGoodsReceivingContent">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="modalShowGoodsReceivingViewTitle" >Message</h4>
            </div>
            
            <div class="modal-body">
                <div id="modalShowGoodsReceivingViewContent">
                </div>
            </div>
            <div class="modal-footer">
                <div id="modalShowGoodsReceivingButtonContent">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Yes</button>
               </div>
            </div>
        </div>
    </div>
</div>


<!-- message Modal HTML -->
<div id="messageView" class="modal fade" style="overflow: auto;overflow-y: scroll;">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header" id="modalMessageHeaderContent">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="modalMessageViewTitle" >Message</h4>
            </div>
            
            <div class="modal-body">
	            <div id="modalMessageViewContent">
	        	</div>
            </div>
            
            <div class="modal-footer">
            	<div id="modalMessageButtonContent">
            		<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
			   </div>
            </div>
        </div>
    </div>
</div>

<!-- confirmation message Modal HTML -->
<div id="confirmationMessageView" class="modal fade" style="overflow: auto;overflow-y: scroll;">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header" id="modalConfirmationMessageHeaderContent">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="modalConfirmationMessageViewTitle" >Message</h4>
            </div>
            
            <div class="modal-body">
	            <div id="modalConfirmationMessageViewContent">
	        	</div>
            </div>
            <div class="modal-footer">
            	<div id="modalcCnfirmationMessageButtonContent">
            		<button type="button" class="btn btn-default" data-dismiss="modal">Yes</button>
			   </div>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="GoodsReceivingLoadingModal" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="modalLoadingTitle">Processing...</h4>
            </div>
            <div class="modal-body">
                <div class="progress progress-striped active">
                    <div class="progress-bar" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100" style="width:100%">
                        <span class="sr-only">70% Complete</span>
                      </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- show plan Modal HTML -->
<div id="showProspectDetail" class="modal fade" style="overflow: auto;overflow-y: scroll;" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog"  style="width: 50%;">
        <div class="modal-content">
            <div class="modal-header" id="modalShowPlanContent">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="modalShowPlanViewTitle" >Prospect Detail</h4>
            </div>
            
            <div class="modal-body">
                <div id="modalShowPlanViewContent">
                    <table class="table">
                        <thead>
                                <th>Name</th>
                                <th>Title</th>
                                <th>Office Phone</th>
                                <th>Mobile Phone</th>
                                <th>Email</th>
                                <th>Active</th>
                        </thead>
                        <tbody>

                        </tbody>
                    </table>
                </div>
            </div>
            <div class="modal-footer">
                <div id="modalShowPlanButtonContent">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
               </div>
            </div>
        </div>
    </div>
</div>

<input type="hidden" id="isManagerFilter" value="<?php echo isset($isManagerFilter) ? ($isManagerFilter ? 'true' : 'false' ) : 'false';?>" >

<div class="col-md-12" <?php echo isset($isManagerFilter) && $isManagerFilter ? "style='display:none'" : ''; ?>>
	<div class="filter-unit">
		<select class="form-control" id="dateFilterGRN">
           <?php echo $this->getDateFilterOption() ?>
        </select>
    </div>
    <div class="filter-unit col-md-2">
		<select class="form-control" id="compFilterGRN" style="width:100%;height:100%!important;">
           <?php echo $this->getCustomerOption() ?>
        </select>
	</div>
	<div class="filter-unit">
		<input type="text" class="form-control" placeholder="GRN Code..." id="txtFilterGRCode">
	</div>
	<div class="filter-unit">
		<a href="#" onclick="return filterGoodsReceiving();" class="btn btn-primary btn-sm"><span class="fa fa-plus"></span> Filter</a>
	</div>
	<?php if(!isset($isManagerFilter) || $isManagerFilter == false) { ?>
	<div class="claim-btn">
		<table>
			<tr>
				<td>
					<div>
                        <a onclick="return showAddGoodsReceivingInquiry();" role="button" class="btn btn-info btn-sm" data-toggle="modal"><span class="fa fa-info-circle"></span> Inquiry</a>
                        <a onclick="return showAddGoodsReceiving();" role="button" class="btn btn-primary btn-sm" data-toggle="modal"><span class="glyphicon glyphicon-plus"></span> Add</a>
					</div>
				</td>
			</tr>
		</table>
	</div>
	<?php } ?>
</div>

<div class="col-md-12" id="errorShow"></div>

<div class="col-md-12" style="margin-top: 20px">
	<div class="box" id="testData">
		<table class="table table-striped" style="width: 100%; max-width: 100%; margin-bottom: 20px;" id="GoodsReceiving-table">
            <thead>
                <tr>
                    <th width="2%" style="min-width:100px;max-width:120px;">Date</th>
                    <th width="10%" style="min-width:120px">Customer Company Name</th>
                    <th width="5%" style="min-width:100px;max-width:120px;">Contact Mobile</th>
                    <th width="5%" style="min-width:100px;max-width:120px;">GRN ID</th>
                    <th width="5%" style="min-width:100px;max-width:120px;">Status</th>
                    <th width="5%" style="min-width:100px;max-width:120px;">Action</th>
                    <th width="5%" style="min-width:100px;max-width:120px;"></th>
                    <th width="25%" ></th>
                </tr>
            </thead>
            <tbody id="goods-receiving-table">
            </tbody>
		</table>
	</div>
</div>
<script>
$(document).ready(function () {
	filterGoodsReceiving();
});
</script>
<script type="text/javascript">
 $(document).ready(function(){
    $("#compFilterGRN").select2({
		theme: "bootstrap",
		placeholder: "Select Customer",
		width: "auto",
		dropdownAutoWidth: true,
		allowClear: true,
    });
});
</script>