<!---- 
Author 	: Ladur
Tanggal : 12-08-2014	
Revisi 	:
-->
<?php
//---------Untuk privellege jika dia ada tombol save----------
	if($group_user->SavePrivillage == 1){
		$cek_autority_save  = "";
	}
	else{
		$cek_autority_save 	= "disabled";
	}
//-------------end----------------------------
?>
<div class="easyui-layout" data-options="fit:true,border:false">
	<!-- 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">
                    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-document" plain="true" onclick="location.reload()">New</a>
                    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-reload" plain="true" onclick="location.reload()">Refresh</a>
                    <!--
                    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-journal" plain="true" id="btn_journal" onclick="show_journal()" disabled="disabled">Journal</a>
                    <input type="hidden" id="id_tojournal" name="id_tojournal" />
                	-->
                </td>
                <td height="25" align="right" valign="middle">
                    <span class="form-title" style="margin-left:7px;">
                        <?=$menu_label?>
                    </span>
                </td>
            </tr>
            </table>		     	
        </div>			
    </div>
    <!-- End of top view -->
    
    <div id="form-body" data-options="region:'center',border:false">
        <div id="form-wrapper" class="easyui-panel" style="width:1180%;height:526px;padding:5px;" fit="true">
        	<form id="fm_payment" name="fm_payment" method="post">
				<input type="hidden" name="detail" id="detail"/>
                <input type="hidden" name="currency_code" id="currency_code">
                
                <!-- Form Header -->
                <table width="100%" height="141" cellpadding="0" cellspacing="0">
                <tr>
                    <td width="50%" valign="top">
                    	<table width="100%" cellpadding="0" cellspacing="1" style="margin-top:4px;">
                        <tr height="20">
                        	<td width="150"><b>Paid From</b></td>
                            <td width="10"><b>:</b></td>
                            <td>
                            	
                                <select name="cmb_bank_account" editable='true' class="combo-grid" 
                                    id="cmb_bank_account" 
                                    style="width:300px;height:24px;" 
                                    data-options="
                                        panelWidth: 252,
                                        idField: 'AccountNumber',
                                        textField: 'AccountName',
                                        url: '<?= base_url().$menu_link; ?>/get_account_bank_add',               
                                        columns: [[
                                        {field:'AccountName',title:'Account Name',width:190}
                                        ]],
                                        fitColumns: true,
                                        onSelect: function(rowIndex, rowData){
                                            
                                            get_master_rate(rowData.CurrencyCode);
                                            get_bank_balance(rowData.AccountNumber,rowData.CurrencyCode); 

                                            if(rowData.CurrencyCode == 'IDR'){
                                                $('#currency_amount').text(rowData.CurrencyCode);
                                                $('#currency_code').val(rowData.CurrencyCode);
                                                
                                                $('#from_currency').text('IDR');
                                                $('#to_currency').text(rowData.CurrencyCode);
                                                $('#txt_rate').prop('readonly',true);
                                                $('#txt_rate').numberbox({required:false});
                                                
                                            }
                                            else{
                                                $('#currency_amount').text(rowData.CurrencyCode);
                                                $('#currency_code').val(rowData.CurrencyCode);
                                                
                                                $('#from_currency').text(rowData.CurrencyCode);
                                                $('#to_currency').text('IDR');
                                                $('#txt_rate').prop('readonly',false);
                                                $('#txt_rate').numberbox({required:true});
                                                
                                            }
                                        }
                                        
                                    " required
                                >
                                </select>
                            </td>
                        </tr>
                        <tr height="20">
                            <td width="150"><b><?php echo label_grid('check_no');?></b></td>
                            <td width="10"><b>:</b></td>
                            <td>
                                 <input type="text" name="cheque_number" id="cheque_number" style="width:299px">
                            </td>
                        </tr>
                        <tr height="20">
                        	<td width="150" valign="top" style="padding-top:4px;"><b>Memo</b></td>
                            <td width="10" valign="top" style="padding-top:4px;"><b>:</b></td>
                            <td>
                            	<textarea class="textbox" name="txa_memo" id="txa_memo" rows="4" style="width:298px;resize:none;white-space:normal;" onclick=""></textarea>
                            </td>
                        </tr>
                        <tr height="20">
                            <td width="150"><b>Rate</b></td>
                            <td width="10"><b>:</b></td>
                            <td>
                                <input name="txt_rate" id="txt_rate" type="numberbox" class="easyui-numberbox" style="width:110px;" data-options="min:0.01,precision:2,decimalSeparator:',',groupSeparator:'.'" formatter="formatRp" readonly /> <strong>Currency :</strong> <span id="from_currency"></span> <span>TO</span> <span id="to_currency"></span>
                            </td>
                        </tr>
                        <tr height="20">
                        	<td width="150"><b>Amount</b></td>
                            <td width="10"><b>:</b></td>
                            <td>
                            	<input name="txt_amount" id="txt_amount" type="text" class="easyui-numberbox" style="width:298px;height:20px;text-align:right" formatter="formatRp" 
                                    data-options="
                                        min:0.01,precision:2,decimalSeparator:',',groupSeparator:'.',disabled:true
                                       
                                    " required readonly>
                                <!-- <a href="#" id="btn_calculate" class="easyui-linkbutton" data-options="iconCls:'icon-calculator',size:'small'" onclick="count_amount()"></a> -->
                            </td>
                        </tr>
                       
                        <tr height="25"><td colspan="3"></td></tr>
                        </table>
                    </td>
                    <td width="50%" valign="top">
                    	<table width="100%" cellpadding="0" cellspacing="1" style="margin-top:4px;">
                        <tr height="20">
                            <td>&nbsp;</td>
                            <td width="150" style="background:#333399;text-align:center;color:#FFF;"><b>Available Balance (<span class='bank_balance_currency'></span>)</b></td>
                            <td width="122" style="background:#333399;text-align:center;color:#FFF;">Other Payment Date</td>
                        </tr>
                        <tr height="20">
                            <td>&nbsp;</td>
                            <td>
                                 <input name="txt_bank_balance" id="txt_bank_balance" type="text" class="easyui-numberbox" data-options="precision:2,decimalSeparator:',',groupSeparator:'.',prefix:''" style="text-align:right;width:300px" readonly />
                            </td>
                            <td>
                                <input type="text" name="txt_payment_date" id="txt_payment_date" value="<?php echo $date_now;?>" class="easyui-datebox validBackward" style="width:122px;height:20px" editable="false" required />
                            </td>
                        </tr>
                        
                        </table>
                    </td>
                </tr>
                </table>
                <!-- End of Form header -->
                
                <!-- Datagrid -->
                <table id="dtg_payment" class="easyui-edatagrid"
					 toolbar="#tb_dtg_payment" idField="id"
					 rownumbers="true" fitColumns="true" 
                     singleSelect="true" style="height:355px;"
                     data-options = "
                        onBeginEdit:function(rowIndex){
                            /*====================on beg in edit saat grid di klik maka tombol save disable===================*/
                            save_button_begendedit('<?=$group_user->SavePrivillage;?>');
                            /*=================================end============================================================*/
                        },
                        onEndEdit:function(indexRow,row,changes){
                            /*====================on beg in edit saat grid di klik maka tombol save disable===================*/
                            save_button_endedit('<?=$group_user->SavePrivillage;?>');
                            /*=================================end============================================================*/
                            var subtotal = 0;
                            var item =  $('#dtg_payment').datagrid('getRows');
                            $.each(item, function( index,value) {
                                subtotal += parseFloat(value.Amount);
                            });

                            $('#total_amount').html(subtotal);
                            $('#txt_amount').numberbox('setValue',subtotal);
                        }
                     "
                >
                    <thead>
                    <tr>
                        <th align="center" valign="middle" data-options="field:'AccountName',width:400,align:'left'" editor="{type:'Payment_Account_Name',options:{required:true}}">Account Name</th>
                        <th align="center" valign="middle" formatter="formatRp" data-options="minValue:0,maxValue:250000,field:'Amount',width:120,align:'center',editor:{type:'numberbox',options:{precision:2,decimalSeparator:',',required:true}}">Amount (<span id="currency_amount"></span>)</th>
                        <th align="center" valign="middle" data-options="field:'Memo',width:400,align:'left',editor:'text'">Memo</th>
                        <!-- <th align="center" valign="middle" data-options="field:'DepartmentName',width:150,align:'left'" editor="{type:'Department_Account_Name',options:{required:true}}">Department</th> -->
                        <!-- <th align="center" valign="middle" hidden='true' data-options="field:'DepartmentAccountCode',width:150,align:'left'" editor="{type:'Department_Account_Code',options:{required:true}}">Department Code</th> -->
                    </tr>
                    </thead>
				</table>
                
                <!-- Datagrid Toolbar -->
				<div id="tb_dtg_payment">
					<a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="add_row()">New</a>
					<a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="remove_row()">Delete</a>
				</div>
                <!-- End of Datagrid Toolbar -->
                <!-- End of Datagrid -->
                
                
            </form>
        </div>
    </div>
    <div id="form-footer" data-options="region:'south',border:false">
    	<table width="100%" cellpadding="0" cellspacing="0">
            <tr>
                <td>&nbsp;</td>
                <td align="right">
                 <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-help" onclick="" plain="true">Help</a>
                 <a href="javascript:void(0)" class="easyui-linkbutton form-button save-button" iconCls="icon-save" onclick="save_me()" <?php echo $cek_autority_save;?>>Save</a>
                 <a href="javascript:void(0)" class="easyui-linkbutton form-button" iconCls="icon-cancel" onclick="javascript:location.reload()">Cancel</a>	     
                </td>
             </tr>
         </table>
		</div>
</div>

<!--  Tagor Dialog Payment AccountName -->
<div id="dialog-payment-account" class="easyui-dialog" style="width:850px;height:523px;top:27px;background-color:#F8F8F8;padding:0px;" closed="true" data-options="modal:true, iconCls:'icon-save'" buttons="#dialog-buttons-account-payment">
    <form id="form_payment_account" method="post" novalidate>
        <table width="100%" align="left" border="0">
            <tr>
                <td width="197" align="left" valign="middle"><b>Account Number</b></td>
                <td width="14"><b>:</b></td>

                <td width="625" colspan="2">
                    <input type="text" style="width:608px;height:20px" name="txt_account_number" id="txt_account_number" class="easyui-validatebox" placeholder="< Account Number >" onkeyup="search_payment_account_popup();" />
                </td>
            </tr>
            <tr>
                <td width="197" align="left" valign="middle"><b>Account Name</b></td>
                <td><b>:</b></td>

                <td colspan="2">
                    <input type="text" style="width:608px;height:20px" name="txt_account_name" id="txt_account_name" class="easyui-validatebox" placeholder="< Account Name >" onkeyup="search_payment_account_popup();" />
                </td>
            </tr>

            <tr>
                <td colspan="3">
                    <table id="tt_choose_payment" class="easyui-datagrid" 
                        url="<?php echo base_url().$menu_link; ?>/all_accountpembiayaan/<?php echo $this->session->userdata('company');?>" 
                        singleSelect="true" fitColumns="true" pagesize="50"
                        style="width:828px;height:380px" data-options = "border:false,view:scrollview,autoRowheight:false"
                    >
                        <thead>
                            <tr>
                                <th field="AccountNumber" width="150" sortable="true">Account Number</th>
                                <th field="AccountName" width="460" sortable="true">Name</th>
                            </tr>
                        </thead>
                    </table>
                </td>
            </tr>
        </table>
    </form>
</div>

<!-- Dialog Button -->
<div id="dialog-buttons-account-payment" style="border:none;">
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-ok" onClick="choose_payment_250();">OK</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-cancel" onClick="modal_close('dialog-payment-account');">Cancel</a>
</div>

<script type="text/javascript">

var SavePrivillage  = '<?=$group_user->SavePrivillage;?>';

$(document).ready(function(){

    $('#fm_payment').click(function(){
        $('#dtg_payment').edatagrid('saveRow');
    });

});
	
function show_journal(){
	var id_hidden	= $('#id_tojournal').val();
	var id 			= id_hidden.replace("/",".");
	var id2			= id.replace("/",".");
	parent.tab_edit('Journal Payment', '<?=$menu_link?>', 'icon-journal', 'to_journal', id2);
}

function amount_value(value){
	if(value > 250000){
		$.messager.alert('Info','Amount tidak lebih dari 250.000');
		//$('#txt_amount').numberbox('setValue', 250000);
	}
}
	
function count_amount(){
	var total_amount = 0;
	var selected	= $('#dtg_payment').datagrid('getSelected');
	var index		= $('#dtg_payment').datagrid('getRowIndex', selected);
	var editor 		= $('#dtg_payment').datagrid('getEditors', index);
	
	var EAccount	= $(editor[0].target);
	var EAmount		= $(editor[1].target);
	var EDepartment	= $(editor[3].target);
	
	if(EAccount.val() == '' || EAmount.numberbox('getValue') == '' || EDepartment.val() == ''){
		$.messager.alert('Info','Silahkan lengkapi data pada grid','error',function(){});
		return false;
	}
	else{
		$('#dtg_payment').edatagrid('saveRow');		
		var rows 	= $('#dtg_payment').datagrid('getRows');
		for(var i=0; i<rows.length; i++){
			total_amount += parseFloat(rows[i].Amount);
		}
	
		$('#total_amount').html(total_amount);
		$('#txt_amount').numberbox('setValue',total_amount);
	}
}

	
function save_me(){
    $('#dtg_payment').edatagrid('saveRow');
    var cek = $('#dtg_payment').datagrid('getRows');
    err  = 0;
    
    var transaksi = "";
    var txt_rate = $('#txt_rate').numberbox('getValue');
    
    $.each(cek, function( index, value ) {
        if(transaksi != value.AccountNumber){
            err++;
            transaksi = value.AccountNumber;
        }
    });
    
    var total_amount = 0;
    
    for(var i=0; i<cek.length; i++){
        if(isNaN(cek[i].Amount)){ cek[i].Amount = 0; }
        total_amount += parseFloat(cek[i].Amount);
    }
    $('#total_amount').html(total_amount);
    
    if(err == 0) {
        $.messager.alert('Unseccessfull','Harap di pilih satu Transaksi.','error',function(){
            $('#dtg_payment').datagrid('reload');
        });
    }
    else if(total_amount != $('#txt_amount').numberbox('getValue')){
        $.messager.alert('Unseccessfull','Total Payment tidak sama dengan Amount.','error',function(){
            $('#dtg_payment').datagrid('reload');
        });
    }else if(txt_rate <= 0){
            $.messager.alert('Unseccessfull','Rate tidak boleh kurang dari sama dengan nol','warning');
        }
    else{
        $('#dtg_payment').edatagrid('saveRow');
        var i=$('#dtg_payment').datagrid('getRows');
        var detail = JSON.stringify(i);
        $("#detail").val(detail);
        save_transaction('<?php echo $menu_link?>','#fm_payment');         
    }
}

///pop up function
function open_payment_250() { 
   modal_open('Account List','dialog-payment-account');
}

function open_department_payment() { 
   modal_open('Department','dialog-payment-department');
}

function choose_department_payment() {
    var selected_data = $('#tt_choose_department_payment').datagrid('getSelected');

    $('.Department_Account_Name').val(selected_data.DepartmentName);
    $('.Department_Account_Code').val(selected_data.DepartmentCode);

    modal_close('dialog-payment-department');
}


function choose_payment_250() {
    var selected_data = $('#tt_choose_payment').datagrid('getSelected');

    $('.Payment_Account_Name').val(selected_data.AccountName);
    modal_close('dialog-payment-account');
}

function remove_row(){
    $('#dtg_payment').edatagrid('saveRow');     
    var selectedrow         = $('#dtg_payment').datagrid('getSelected');
    var row_index           = $('#dtg_payment').datagrid('getRowIndex', selectedrow);
    
    $.messager.confirm('Confirmation :', 'Anda yakin, Anda ingin menghapus item "' + selectedrow.AccountName + '"?',  
        function(r){
            if (r){

                $('#dtg_payment').datagrid('deleteRow', row_index);
                calculate_sub();
            }
        }
    );
}

function add_row(){
    $('#dtg_payment').edatagrid('addRow');
}

function calculate_sub(){
    $('#dtg_payment').edatagrid('saveRow');

    var item        = $('#dtg_payment').datagrid('getRows');
    var sub_total   = 0;
    
    $.each(item, function(index, value) {
        if(value.Amount != undefined){
            sub_total+= parseFloat(value.Amount);
        }               
    });
    
    $('#txt_amount').numberbox('setValue', sub_total);
}

$.extend($.fn.datagrid.defaults.editors, {
    Payment_Account_Name: {
        init: function(container, options){
            var input = $('<input type="text" class="Payment_Account_Name" onClick="open_payment_250()" style="height:18px;" readonly/>').appendTo(container);
            return input.validatebox(options);
        },
        destroy: function(target){
            $(target).remove();
        },
        getValue: function(target){
            return $(target).val();
        },
        setValue: function(target, value){
            $(target).val(value);
        },
        resize: function(target, width){
            $(target)._outerWidth(width);
        }
    }
            
    // Department_Account_Name: {
    //     init: function(container, options){
    //         var input = $('<input type="text" class="Department_Account_Name" onClick="open_department_payment()" style="height:18px;" readonly/>').appendTo(container);
    //         return input.validatebox(options);
    //     },
    //     destroy: function(target){
    //         $(target).remove();
    //     },
    //     getValue: function(target){
    //         return $(target).val();
    //     },
    //     setValue: function(target, value){
    //         $(target).val(value);
    //     },
    //     resize: function(target, width){
    //         $(target)._outerWidth(width);
    //     }
    // },
            
    // Department_Account_Code: {
    //     init: function(container, options){
    //         var input = $('<input type="text" class="Department_Account_Code" onClick="open_payment_department()" style="height:18px;" readonly/>').appendTo(container);
    //         return input.validatebox(options);
    //     },
    //     destroy: function(target){
    //         $(target).remove();
    //     },
    //     getValue: function(target){
    //         return $(target).val();
    //     },
    //     setValue: function(target, value){
    //         $(target).val(value);
    //     },
    //     resize: function(target, width){
    //         $(target)._outerWidth(width);
    //     }
    // }
});
//**===== End Tagor ====

</script>