<!---- 
    Author 	: Ladur
    Tanggal : 12-08-2014	
    Revisi 	:
-->
<div class="easyui-layout" data-options="fit:true,border:false">
<form id="fm_sales_order" name="fm_sales_order" method="post">
	<input type="hidden" name="detail" id="detail" />
	
	<!-- top view-->
	<div id="form-header" data-options="region:'north',border:false" >
		 <div id="form-header-wrapper">
				<table cellpadding="0" cellspacing="0" width="100%" height="100%" border="0">
					<tr>
						<td align="left" valign="middle">
							<a href="#" class="easyui-linkbutton" iconCls="icon-document" plain="true" onclick="">New</a>
							<a href="#" class="easyui-linkbutton" iconCls="icon-journal" plain="true" onclick="" disabled="true" >Journal</a>
							<input type="checkbox" name="chk_status" id="chk_status" value="1" disabled />
							Pembatalan Transaksi
						</td>							
						<td height="25" align="right" valign="middle">								
							<span class="form-title"><?=$menu_label?></span>
						</td>
					</tr>
				</table>		     	
		 </div>			
	</div>
	<!-- end top view -->	
	<!-- center view -->
	<div id="form-body" data-options="region:'center',border:false">
		<div id="form-wrapper" class="easyui-panel"  style="width:1180%;height:548px;padding:5px;">
			
				<table cellpadding="0" cellspacing="0" width="100%" border="0">
					<tr>
						<td width="50%" align="left">
							<table cellpadding="2" cellspacing="2" width="100%" height="100%" border="0">
								<tr>
									<td height="10" colspan="3" align="left" valign="midle">
										<span style="color:#000;font-weight:bold;margin-right:15px;">Customer</span>
										<select class="easyui-combogrid" id="cmb_customer" name="cmb_customer" required="required" style="width:200px; height:20px;" data-options="
											panelWidth: 300,
											idField: 'CustomerCode',
											textField: 'CustomerName',
											url: '<?php echo base_url(); ?>custom/get_data/customer',
											method: 'get',
											columns: [[
											{field:'CustomerCode',title:'Customer Code',width:110},
											{field:'CustomerName',title:'Customer Name',width:190}
											]],
											fitColumns: true
											">
										</select>
										<a href="#" class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-sales'" onClick="modal_open('Select <?=$menu_label?>','dialog-do');">Select DO</a>							
										<input type="checkbox" name="chk_taxtable" id="chk_taxtable" onclick="hideppn()">Taxable	
									</td>
								</tr>
								<tr>
									<td height="10" width="75" align="left" valign="top">
										<strong>Billing Address :</strong>
									</td>
									<td width="75" align="left" valign="top">
										<strong>Shipping Address :</strong>
									</td>
									<td>&nbsp;</td>
								</tr>
								<tr>
									<td height="50" align="left" valign="top">
										<textarea name="txa_address" id="txa_address" cols="30" rows="4" style="resize:none;"></textarea>
									</td>
									<td align="left" valign="top">
										<textarea name="txa_ship_to" id="txa_ship_to" cols="30" rows="4" style="resize:none;"></textarea>
									</td>
									<td>&nbsp;</td>
								</tr>								
							</table>
						</td>
						<td align="right" valign="top">
							<table cellpadding="0" cellspacing="0" width="100%" height="100%" border="0">
								<tr>
									<td align="right">
										<table cellpadding="0" cellspacing="1" width="100%" height="100%" border="0">
											<tr>
												<td align="right" style="padding-right:10px;"><input type="checkbox" id="chk_payment_dp" name="chk_payment_dp" onclick="hidedp()" value="1" /> Customer Payment DP</td>
												<td height="20" width="100" align="center" valign="middle" bgcolor="#333399"><span style="color:#fff;">Cust. PO. No.</span></td>
												<td width="100" align="center" valign="middle" bgcolor="#333399"><span style="color:#fff;">SI. No.</span></td>
												<td width="100" align="center" valign="middle" bgcolor="#333399"><span style="color:#fff;">SI. Date</span></td>
											</tr>
											<tr>
												<td>&nbsp;</td>
												<td height="20" align="left" valign="top">
													<input type="text" name="txt_po_no" id="txt_po_no" class="textbox" style="width:120px;height:18px" readonly required="required" />
												</td>
												<td height="20" align="left" valign="top">
													<input type="text" name="txt_si_no" id="txt_si_no" class="textbox" value="<?php echo $si_number ?>" style="width:120px;height:18px" readonly required="required" />
												</td>
												<td align="right" valign="top">
													<input name="txt_si_date" id="txt_si_date" type="text" class="easyui-datebox" style="width:122px;height:20px;" required="required" />
												</td>
											</tr>
											<tr>
												<td>&nbsp;</td>
												<td height="20" width="100" align="center" valign="middle" bgcolor="#333399"><span style="color:#fff;">DO. No.</span></td>
												<td height="20" align="center" valign="middle" bgcolor="#333399"><span style="color:#fff;">Ship Date</span></td>
												<td align="center" valign="middle" bgcolor="#333399"><span style="color:#fff;">FOB</span></td>
											</tr>
											<tr>
												<td>&nbsp;</td>
												<td height="20" align="left" valign="top">
													<input type="text" name="txt_do_no" id="txt_do_no" class="textbox" style="width:120px;height:18px" readonly />
												</td>
												<td height="20" align="right" valign="top">
													<input name="txt_ship_date" id="txt_ship_date" type="text" class="easyui-validatebox" style="width:120px;height:18px; font-size:11px;" readonly />
												</td>
												<td align="right" valign="top">
													<input name="txt_fob" id="txt_fob" type="text" class="easyui-validatebox" style="width:120px;height:18px; font-size:11px;" readonly />
													<input name="cmb_fob" id="cmb_fob" type="hidden"/>
												</td>
											</tr>
											<tr>
												<td>&nbsp;</td>
												<td height="20" width="100" align="center" valign="middle" bgcolor="#333399"><span style="color:#fff;">Salesman</span></td>
												<td width="100" align="center" valign="middle" bgcolor="#333399"><span style="color:#fff;">Terms</span></td>
												<td width="100" align="center" valign="middle" bgcolor="#333399"><span style="color:#fff;">Ship Via</span></td>
											</tr>		
											<tr>
												<td>&nbsp;</td>
												<td height="20" align="left" valign="top">
													<select name="cmb_salesman" id="cmb_salesman" class="easyui-combobox" editable="false" data-options="valueField:'EmployeeCode',textField:'EmployeeName',url:'<?php echo base_url(); ?>custom/get_data/sales'" disabled style="width:122px;height:20px;" required="true"></select>
												</td>
												<td height="20" align="left" valign="top">
													<select name="cmb_terms" id="cmb_terms" class="easyui-combobox" editable="false" data-options="valueField:'TermspaymentID',textField:'TermDesc',url:'<?php echo base_url(); ?>custom/get_data/termspayment'" disabled style="width:122px;height:20px;" required="true"></select>
												</td>
												<td align="right" valign="top">
													<select name="cmb_ship_via" id="cmb_ship_via" class="easyui-combobox" editable="false" data-options="valueField:'ShipmentID',textField:'ShipmentName',url:'<?php echo base_url(); ?>custom/get_data/shipment'" disabled style="width:122px;height:20px;" required="true"></select>
												</td>
											</tr>																		
										</table>
									</td>
								</tr>
							</table>
						</td>
					</tr>
				</table>
				<!--Datagrid-->
				<div class="easyui-tabs" style="margin-top:5px;height:275px" data-options="tabHeight:18">
					<div id="tab_item" title="Items">
						<table id="dg_item"  class="easyui-edatagrid" url="<?php echo base_url().$menu_link."/ajax_item/"; ?>"
							toolbar="#toolbar" idField="id"
							rownumbers="true" fitColumns="true" singleSelect="true" style="height:253px;">
							<thead>
								<tr>
									<th width="10" field="SQuoDetailID" data-options="align:'center'">ID</th>
									<th width="20" hidden="true" field="max_item" editor="{type:'numberbox'}">Max</th>
									<th width="50" halign='center' field="ItemCode" editor="{type:'item',options:{required:true}}">Item</th>
									<th width="75" field="ItemDesc" data-options="align:'left'" editor="description">Item Description</th>
									<th width="50" halign='center' field="ItemQty" data-options="align:'center'" editor="{type:'numberbox',options:{required:true, min:0}}">Qty</th>
									<th width="50" halign='center' field="ItemUnit" editor="unit" data-options="halign:'center'">Item Unit</th>
									<th width="50" formatter="formatRp" halign='center' field="ItemPrice" editor="price" data-options="halign:'right'">Unit Price</th>
									<th width="75" formatter="formatRp" halign='center' field="ItemAmount" editor="{type:'numberbox',options:{required:true}}">Amount</th>	
									<th width="75" halign='center' field="ItemSN" editor="{type:'text',options:{required:true}}">SN</th>							
								</tr>
							</thead>
						</table>
						<!--
						<div id="toolbar">
							<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="javascript:$('#dg_item').edatagrid('addRow')">New</a>
							<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="javascript:$('#dg_item').edatagrid('destroyRow')">Delete</a>
							<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-cancel" plain="true" onclick="javascript:$('#dg_item').edatagrid('cancelRow')">Cancel</a>
						</div>
						-->
					</div>
					<div id="tab_downpayment" title="Down Payment 0">				
						<table id="dg_down_payment" class="easyui-edatagrid"
						 toolbar="#tb_dg_down_payment" idField="id"
						 rownumbers="true" fitColumns="true" singleSelect="true" style="height:253px;">
						<thead>
							<tr>
								<th field="Description" width="75" editor="text" data-options="align:'left',halign:'center'">Description</th>
								<th field="TotalDP" width="75" editor="{type:'numberbox',options:{required:true}}" data-options="align:'left',halign:'center'">Total DP</th>
								<th field="Owing" width="75" editor="text" data-options="align:'left',halign:'center'">Owing</th>															
								<th field="PaymentAmount" width="75" editor="text" data-options="align:'left',halign:'center'">Payment Amount</th>															
								<th field="Paid" width="20" editor="{type:'checkbox',options:{on:'P',off:''}}" data-options="align:'center',halign:'center'">Paid</th>															
								<th field="PaymentDate" width="75" editor="datebox" data-options="align:'left',halign:'center'">Payment Date</th>															
								<th field="ReceiveNo" width="75" editor="{type:'validatebox',options:{required:true}}" data-options="align:'left',halign:'center'">Receive No.</th>															
							</tr>
						</thead>
						</table>
						<!--
						<div id="tb_dg_down_payment">
							<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="javascript:$('#dg_down_payment').edatagrid('addRow')">New</a>
							<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="javascript:$('#dg_down_payment').edatagrid('destroyRow')">Delete</a>
							<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-cancel" plain="true" onclick="javascript:$('#dg_down_payment').edatagrid('cancelRow')">Cancel</a>
						</div>
						-->
					</div>
				</div>
				<div style="margin-top:5px;">
					<table cellpadding="0" cellspacing="0" width="100%" height="100%" border="0">
						<tr>
							<td width="88" rowspan="3" align="left" valign="top" style="padding">Description </td>
							<td width="374" rowspan="3" align="left" valign="top"><textarea name="txa_description" cols="50" rows="4" class="textbox" style="resize:none;"></textarea></td>
							<td height="23" width="301" align="right"><strong>Sub Total :</strong></td>
							<td width="144" align="right">
								<input type="numberbox" id="sub_total" name="sub_total" value="0" class="easyui-numberbox" data-options="min:0,precision:2,decimalSeparator:',',groupSeparator:'.'" style="text-align:right;" readonly />
							</td>
						</tr>
						<tr>
							<td height="30" align="right">Discount : <input name="disc_persent" type="text" id="disc_persent" style="width:35px;" onKeyup="calculate()" disabled /></td>
							<td align="right">%=<input type="numberbox" name="disc_value" id="disc_value" class="easyui-numberbox" data-options="min:0,precision:2,decimalSeparator:',',groupSeparator:'.'" style="text-align:right" readonly /></td>
						</tr>
						<tr>
							<td height="23" align="right" valign="top"><span class="disableme" style="display:none" >Down Payment :&nbsp;</span></td>
							<td align="right">
								<span class="disableme" style="display:none" ><input type="numberbox" min="0" name="txt_down_payment" id="txt_down_payment" value="0" class="easyui-numberbox dp" data-options="min:0,precision:2,decimalSeparator:',',groupSeparator:'.'" style="text-align:right;" /></span>
							</td>
						</tr>
						<tr>
							<td height="23" align="right" valign="top"><span>&nbsp;</span></td>
							<td align="right"><input type="hidden" name="txt_sales_limit" id="txt_sales_limit" value="0" style="text-align:right;" /></td>
						</tr>
					</table>
				</div>
			
		</div>
		<div id="form-footer">
			 <table cellpadding="0" cellspacing="0" width="100%" height="100%" border="0">
				<tr>
					<td align="left">
					<span>Down Payment : : </span>
					<span id="total_owning">0</span>
					<span>DP Used : : </span>
					<span id="dp_used">0</span>
					<span>Available DP : : </span>
					<span id="available_dp">0</span>
				</td>
				<td align="right"> 	
                	<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-document" onclick="show_legend();" plain="true">Legend</a>			
					<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-help" onclick="" plain="true">Help</a>
					<a id="btn_app_limit" href="javascript:void(0)" class="easyui-linkbutton form-button" iconCls="icon-ok" onclick="" disabled="disabled" >App. Limit</a>	
					<a href="javascript:void(0)" class="easyui-linkbutton form-button" iconCls="icon-ok" onclick="" > App. Dir</a> 								
					<a href="javascript:void(0)" class="easyui-linkbutton form-button" iconCls="icon-ok" onclick="" >App. Mgr</a>					
					<a id="save_button" href="javascript:void(0)" class="easyui-linkbutton form-button" iconCls="icon-save" onclick="">Save</a> 								
					<a id="print_button" href="javascript:void(0)" class="easyui-linkbutton form-button" iconCls="icon-print" onclick=""  disabled="disabled">Preview & Print</a>   
					<a href="javascript:void(0)" class="easyui-linkbutton  form-button" iconCls="icon-cancel" onclick="">Cancel</a>						
				</td>
				</tr>
			</table>	
		</div>		
	</div>
</form>
</div>
<div id="dialog-do" class="easyui-dialog" style="width:725px;height:525px;background-color:#F8F8F8;padding:0px;" closed="true" data-options="modal:true, iconCls:'icon-edit'" buttons="#dialog-buttons">
    <table id="tt_choose" class="easyui-datagrid" 
    	url="<?php echo base_url() ?>list/sales_quotation/ajax_filter" 
    	singleSelect="true" remoteSort="false"
        pagination="true" pageSize="40"
        fit="true" fitColumns="true" 
        rowNumbers="true"
    >
        <thead>
        <tr>
            <th field="DOrdNumber" width="120" sortable="true">DO. Number</th>
            <th field="DOrdDate" width="100" sortable="true">DO. Date</th>
            <th field="DOrdDesc" width="300" halign="center" align="left">Description</th>
        </tr>
        </thead>
    </table>
</div>
<!-- Dialog Button -->
<div id="dialog-buttons">
	<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-ok" onClick="">OK</a>
	<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-cancel" onClick="">Cancel</a>
</div>
<?php $this->load->view('v_custom_pop_up');?>
<script type="text/javascript">
$(document).ready(function(){	
	$("#save_button").click(function() { 	
		$('#dg_item').edatagrid('saveRow');		
		var i=$('#dg_item').datagrid('getRows');
		var detail = JSON.stringify(i);
		$("#detail").val(detail);
		save_transaction('<?php echo $menu_link?>','#fm_sales_order', 0);							
	});
	
	$("#print_button").click(function() { 
		link_print('list/sales_order/print_preview');
	});
	
	//when vendor selected
	$('#cmb_customer').combogrid({
		onSelect:function(rowIndex, rowData){
			var Address = rowData.CustomerAddress + ' ' + rowData.CustCity + ' ' + rowData.CustState + ' ' + rowData.CustCountry;
			
			$('#txa_address').val( Address );
			$('#txa_ship_to').val( Address );
			$('#txt_sales_limit').val( rowData.SalesLimit );
			$('#tt_choose').datagrid('load',{
				cust_code : rowData.CustomerCode
			});		
  		}
		
	});	
	
	//when sq selectted
	
	$('#tt_choose').datagrid({
		onDblClickRow:function(){		
			var sq=$('#tt_choose').datagrid('getSelected').SQuoNumber;
			var po=$('#tt_choose').datagrid('getSelected').CustPONumber;
			var sales=$('#tt_choose').datagrid('getSelected').SalesmanCode;
			var total=$('#tt_choose').datagrid('getSelected').SQuoSubTotal;
			
			$('#dg_item').datagrid('load',{
				sq_no: sq
			});
			
			$('#sub_total').numberbox('setValue',total);
			$('#txt_sq_no').val(sq);
			$('#txt_po_no').val(po);
			$('#cmb_salesman').combobox('select',sales);
			modal_close('dialog-do');
			cek_app_limit();
			$('#disc_persent').removeAttr('disabled');
		}
	});
	
	$('#dg_item').datagrid({
		
		onBeginEdit:function(rowIndex){
			var editors = $('#dg_item').datagrid('getEditors', rowIndex);
			var max = $(editors[0].target);
			var n1 = $(editors[3].target);
			var n2 = $(editors[5].target);
			var n3 = $(editors[6].target);
			
			var qty = n1.numberbox('getValue');
			n1.add(n2).numberbox({
				onChange:function(){
					if(parseInt(n1.numberbox('getValue')) > parseInt(max.numberbox('getValue'))) {
						alert("Qty tidak boleh lebih dari (" + max.numberbox('getValue') + ")");
						n1.numberbox('setValue',qty);
					}
					else {
						var cost = n1.numberbox('getValue')*n2.numberbox('getValue');
						n3.numberbox('setValue',cost);
						$('#dg_item').edatagrid('saveRow');
					}
				}
			})
		},
		
		onEndEdit:function(rowIndex, rowData, changes){
			var item = $('#dg_item').datagrid('getRows');
			var sub_total = 0;
			
			$.each(item, function( index, value ) {
				sub_total+= parseInt(value.ItemAmount);				
			});
			
			$('#sub_total').numberbox('setValue', sub_total);	
			
			cek_app_limit();
		}
	});
});
</script>

<script>
	// cek app limit
	function cek_app_limit() {
		var limit = $('#txt_sales_limit').val();
		var total = $('#sub_total').val();

		if(parseInt(limit) < parseInt(total)) {
			$('#btn_app_limit').linkbutton('enable');
		}
		else {
			$('#btn_app_limit').linkbutton('disable');
		}
	}
			
	//function show hide dp	
	function calculate(){
		var sub = parseInt($('#sub_total').numberbox('getValue'));
		var downpayment	 =	$('#txt_down_payment').numberbox('getValue');	
		var dispcnt = $('#disc_persent').val();	
		
		if(isNaN(dispcnt)) {
			dispcnt = 0;
		}
		
		var discount = sub*(dispcnt/100);
		$('#dg_item').edatagrid('saveRow');
		$('#disc_value').numberbox('setValue',discount);
	}
	
	//function show hide ppn
	function hidedp(){
		if($('#chk_payment_dp').is(':checked')){
			$('.disableme').css('display','');		
		}
		else{
			$('.disableme').css('display','none');
		}
	}
	
	//function show hide ppn
	function hideppn(){
		if($('#chk_taxtable').is(':checked')){
			$('.disableme_tax').css('display','');
		}
		else{
			$('.disableme_tax').css('display','none');
			$('#txt_ppn').val('0');
		}
	}
</script>	