@extends('layout')

@section('content')

<div class="page-header page-header-default">
	<div class="breadcrumb-line">
		<ul class="breadcrumb">
			<li><a href="index.html"><i class="icon-home2 position-left"></i> Pembelian</a></li>
			<li class="active"></li>
		</ul>
	</div>
</div>

<div class="content">
	<div class="panel panel-flat">
		<div class="panel-heading">
			<h5 class="panel-title">Pembayaran Tagihan</h5>
			<div class="heading-elements">
				<ul class="icons-list">
		      		<li><a href="{{ url('piutang') }}" class="text-warning"><i class="icon-circle-left2 warning"></i> Kembali</a></li>
		      	</ul>
	       	</div>
	    </div>
	    <div class="panel-body">
	    	<table class="table table-striped">
	    		<tr>
	    			<td width="15%">Tanggal</td>
	    			<td width="5%">:</td>
	    			<td width="30%" id="tb_tglfaktur"></td>

	    			<td width="15%">Tagihan</td>
	    			<td width="5%">:</td>
	    			<td id="tb_total"></td>
	    		</tr>
	    		<!-- <tr>
	    			<td width="15%">Jenis Transaksi</td>
	    			<td width="5%">:</td>
	    			<td id="tb_jenistran"></td>

	    			<td width="15%">Cara Bayar</td>
	    			<td width="5%">:</td>
	    			<td width="30%" id="tb_carabayar"></td>
	    		</tr> -->
	    		<tr>
	    			<td width="15%">No. Faktur</td>
	    			<td width="5%">:</td>
	    			<td width="30%" id="tb_nofaktur"></td>
	    			
	    			<td width="15%">Pembayaran</td>
	    			<td width="5%">:</td>
	    			<td id="tb_bayar"></td>
	    		</tr>
	    		<tr>
	    			<td width="15%">Pelanggan</td>
	    			<td width="5%">:</td>
	    			<td id="tb_pelanggan"></td>
	    			
	    			<td width="15%">Kekurangan</td>
	    			<td width="5%">:</td>
	    			<td id="tb_sisa"></td>
	    		</tr>
	    	</table>
	    	<hr>
	    	<a href="javascript:;"   class="btn btn-xs bg-success-400 btn_tambah" ><i class="icon-new"></i> Pembayaran Baru </a>
	    	<h5 class="form_simpan">Tambah Pembayaran</h5>
	    	<form class="form-horizontal form_simpan" autocomplete="off" id="form_simpan">
	    		<input type="hidden" name="id_penjualan" value="{{ $data['id'] }}">
	    		<input type="hidden" name="id_jualbayar" value="">
	    		
	    		<div class="form-group">
	    			<label class="control-label col-sm-2">Tanggal</label>
	    			<div class="col-sm-4">
	    				<input type="text" name="tanggal" class="form-control datepicker">
	    			</div>
	    		</div>
	    		<!-- <div class="form-group">
	    			<label class="control-label col-sm-2">Cara Bayar</label>
	    			<div class="col-sm-4">
        				<select class="form-control select-search" name="id_carabayar">
        					{{--@foreach($data['cara_bayar'] as $s)--}}
        					<option value="{{-- $s->id_carabayar --}}" >{{--  $s->cara.' - '.$s->tipe; --}}</option>
        					{{--@endforeach--}}
        				</select>
        			
	    			</div>
	    		</div> -->
	    		<div class="form-group">
	    			<label class="control-label col-sm-2">Akun</label>
	    			<div class="col-sm-4">
	    				{{ Form::select("id_akun", $data['sumber_dana'], null, ['class'=>'form-control select-search']) }}
        			
	    			</div>
	    		</div>
	    		<div class="form-group">
	    			<label class="control-label col-sm-2">Jumlah</label>
	    			<div class="col-sm-4">
	    				<input type="text" name="jumlah" class="form-control number-only text-right" onkeyup="maksimal($(this))">
	    				<p class="help-block pull-right" id="help_jumlah"></p>
	    			</div>
	    		</div>
	    		<div class="form-group">
	    			<div class="col-sm-6 ">
	    				<button type="reset" class="btn btn-warning btn_batal" >Batal</button>
	    				<button type="button" class="btn btn-primary pull-right" id="btn_simpan">Simpan</button>
	    			</div>
	    		</div>	
	    		
	    	</form>
	    	<hr>
			<h5>Detail Pembayaran</h5>
			<table class="table table_ table-stripped">
			    <thead>
					<tr>
						<th>No</th>
						<th>Tanggal</th>
						<!-- <th>Jenis Pembayaran</th> -->
						<th>Akun</th>
						<th>Jumlah</th>
						<th class="text-center"></th>
					</tr>
				</thead>
				<tbody>
					
				</tbody>
				<tfoot>
					<tr>
						<th colspan="3" class="text-right">Total</th>
						<th colspan="" id="td_totalbayar" class="text-right"></th>
						<th></th>
					</tr>
				</tfoot>
			</table>
	</div>

</div>

<input type="hidden" name="store_id" value="{{ $data['id'] }}">
<input type="hidden" name="store_total" value="">
<input type="hidden" name="store_bayar" value="">
<input type="hidden" name="store_sisa" value="">
<!----Modal---->
<script type="text/javascript">
	

	var table_;
	var tb_no = parseInt(10000);
	var id_penjualan;


	$(document).ready(function(){
		table_ = $(".table_").DataTable({
			"paging": false
		});

		table_.on( 'order.dt search.dt', function () {
            table_.column(0, {search:'applied', order:'applied'}).nodes().each( function (cell, i) {
                cell.innerHTML = i+1;
            } );
        } ).draw();
		id_penjualan = $("[name=store_id]").val();
		if(id_penjualan != ''){
			get_bayar(id_penjualan);
		}
		$('.form_simpan').hide();
		$(document).on("click",".btn_tambah",function(e){
        	$(this).hide();

        	$('.form_simpan').show(100);
        	$('h5.form_simpan').html('Tambah Pembayaran');
        });
        $(document).on("click",".btn_batal",function(e){
        	$('.btn_tambah').show();
        	$('.form_simpan').hide(100);
        });
	})

	function get_detail(id){
		var sisa = parse_float(0);
		$.ajax({
			url: '{{ url('penjualan/get_detailjual') }}'+'/'+id,
			type: 'get',
			dataType: 'json',
			success: function(respon){
				clear();
				if(respon.detail.status == 1){
					var ttl = (parse_float(respon.detail.nominal_netto));
					$("#tb_tglfaktur").text(respon.detail.tanggal_faktur);
					$("#tb_nofaktur").text(respon.detail.no_faktur+respon.detail.sufix_no_faktur);
					// $("#tb_carabayar").text(respon.detail.cara_bayar+' - '+respon.detail.tipe_bayar);
					// $("#tb_jenistran").text(respon.detail.nama_transaksi+' - '+respon.detail.tipe_transaksi);
					$("#tb_pelanggan").text(respon.detail.nama);
					$("#tb_bayar").text(curr(respon.detail.total_bayar));
					$("#tb_total").text(curr(ttl));
					$("#tb_sisa").text('');
					$("[name=store_total]").val(ttl);
					// if(respon.detail.jenis_bayar==1){
					// 	$('.btn_tambah').hide();
					// }else{
						$('.btn_tambah').show();
					// }
					var sisa = parse_float($("[name=store_total]").val())-parse_float($("[name=store_bayar]").val());
					$("[name=store_sisa]").val(sisa);
					$("#tb_sisa").text(curr(sisa));
					$("[name=jumlah]").attr('min', '0');
					$("[name=jumlah]").attr('max', sisa);
				}
			}
		})
	}

	function get_bayar(id){
		var jum_bayar = parse_float(0);
		$.ajax({
			url: '{{ url('penjualan/get_bayar') }}'+'/'+id,
			type: 'get',
			dataType: 'json',
			success: function(respon){
				table_.clear().draw();
				if(respon.bayar.length > 0){
					for(i in respon.bayar){
						var button='<div><button type="button" class="btn bg-warning-400 btn-xs" onclick="edit_table('+respon.bayar[i].id_jualbayar+')"><i class="icon-pencil"></i> </button> <button class="btn  btn-xs bg-danger-800" type="button" onclick="hapus('+respon.bayar[i].id_jualbayar+')"><i class="icon-eraser"></i></button></div>';
						if(respon.bayar[i].id_jualbayar=='nominal_bayar'){
							button='';
						}
						table_.row.add(['<div></div>',
							'<div id="list_kode'+respon.bayar[i].id_jualbayar+'">'+respon.bayar[i].tgl_bayar+'</div>',
							// '<div id="list_kode'+respon.bayar[i].id_jualbayar+'">'+(respon.bayar[i].jenis)+'</div>',
							'<div id="list_kode'+respon.bayar[i].id_jualbayar+'">'+respon.bayar[i].kode_perkiraan+'</div>',
							'<div id="list_kode'+respon.bayar[i].id_jualbayar+'" class="text-right">'+curr(respon.bayar[i].jum_bayar)+'</div>',
							button+
							'<input type="hidden" name="tabel_id[]" id="tabel_id'+respon.bayar[i].id_jualbayar+'" value="'+respon.bayar[i].id_jualbayar+'">'+
							'<input type="hidden" name="tabel_jum[]" id="tabel_jum'+respon.bayar[i].id_jualbayar+'" value="'+respon.bayar[i].jum_bayar+'">'+
							'<input type="hidden" name="tabel_idakun[]" id="tabel_idakun'+respon.bayar[i].id_jualbayar+'" value="'+respon.bayar[i].id_akun+'">'+
							// '<input type="hidden" name="tabel_idcarabayar[]" id="tabel_idcarabayar'+respon.bayar[i].id_jualbayar+'" value="'+respon.bayar[i].id_carabayar+'">'+
							'<input type="hidden" name="tabel_tanggal[]" id="tabel_tanggal'+respon.bayar[i].id_jualbayar+'" value="'+respon.bayar[i].tgl_bayar+'">'
							]).draw(false);
						jum_bayar += parse_float(respon.bayar[i].jum_bayar);
					}

					$("#td_totalbayar").text(curr(jum_bayar));
					$("[name=store_bayar]").val(jum_bayar);
				}else{
					$("#td_totalbayar").text(curr(jum_bayar));
					$("[name=store_bayar]").val(jum_bayar);					
				}
				get_detail(id);
			}
		})
	}

	function clear(){
		$("#tb_nofaktur").text('');
		// $("#tb_carabayar").text('');
		$("#tb_jenistran").text('');
		$("#tb_pelanggan").text('');
		$("#tb_total").text('');
		$("#tb_sisa").text('');
	}

	function clear2(){
		$('.btn_tambah').show();
        $('.form_simpan').hide(100);
		$("[name=id_jualbayar]").val('');
		$("[name=tanggal]").val('');
		$("[name=jumlah]").val('');
		$("[name=id_akun]").val('').change();
		// $("[name=id_carabayar]").val([]).change();
		$("#help_jumlah").text('');
	}

	$("[name=jumlah]").keyup(function(){
		var jum = parse_float($("[name=jumlah]").val());
		if(isNaN(jum) || jum == 0 || jum == ''){
			jum = parse_float(0);
		}
		$("#help_jumlah").text(curr(jum));
	})

	function set_jumlah(){
		var jum = parse_float($("[name=jumlah]").val());
		if(isNaN(jum) || jum == 0 || jum == ''){
			jum = parse_float(0);
		}
		$("#help_jumlah").text(curr(jum));
	}



	$("#btn_simpan").click(function(){
		var id_jualbayar = $("[name=id_jualbayar]").val();
		var id_beli = id_penjualan;
		var tanggal = $("[name=tanggal]").val();
		var id_akun = $("[name=id_akun]").val();
		// var id_carabayar = $("[name=id_carabayar]").val();
		var jum_bayar = $("[name=jumlah]").val();
		if(tanggal != '' && jum_bayar != '' && jum_bayar > 0){
			$.ajax({
				url: '{{ url('penjualan/simpan_bayar') }}',
				type: 'post',
				dataType: 'json',
				data: {id_jualbayar : id_jualbayar, id_penjualan:id_penjualan, id_akun:id_akun, tanggal:tanggal, jumlah:jum_bayar},
				headers : {
					'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
				},
				success: function(respon){
					clear2();
					get_bayar(id_penjualan);
				}
			})
		}
	})

	function edit_table(id){
		$(".btn_tambah").hide();
		$(".form_simpan").hide();
		$(".form_simpan").show(100);
		$("h5.form_simpan").html('Update Pembayaran');

		var id_jualbayar = $("#tabel_id"+id).val();
		var tanggal = $("#tabel_tanggal"+id).val();
		var id_akun = $("#tabel_idakun"+id).val();
		// var id_carabayar = $("#tabel_idcarabayar"+id).val();
		var jum = parse_float($("#tabel_jum"+id).val());
		var sisa = parse_float($("[name=store_sisa]").val());

		$("[name=id_jualbayar]").val(id_jualbayar);
		
		$("[name=tanggal]").val(tanggal);
		$("[name=jumlah]").val(jum);
		$("[name=id_akun]").val(id_akun).change();
		// $("[name=id_carabayar]").val(id_carabayar).change();
		set_jumlah();

		$("[name=jumlah]").attr('min', '0');
		$("[name=jumlah]").attr('max', jum+sisa);
		$( ".form_simpan" ).focus();
	}

	function hapus(id){
		swal({
			title: 'Anda yakin akan menghapus item ini?',
			type: 'warning',
			showCancelButton: true,
			confirmButtonColor: '#3085d6',
			cancelButtonColor: '#d33',
			confirmButtonText: 'Ya',
			cancelButtonText: 'Tidak',
		}).then((result) => {
		 	if(result.value){
		 		$.ajax({
					url: "{{ url('penjualan/hapus_bayar')}} ",
					type: 'post',
					data: {id : id},
					headers : {
						'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
					},
					success: function(respon){
						get_bayar(id_penjualan);
					}
				})
		 	}
		})
	}

	// function reload(){
	// 	var FunctionOne = function () {
	// 	  var r = $.Deferred();

	// 	  get_bayar(id_penjualan);

	// 	  setTimeout(function () {
	// 	    r.resolve();
	// 	  }, 1500);
	// 	  return r;
	// 	};

	// 	var FunctionTwo = function () {
	// 	  get_detail(id_penjualan);
	// 	};

	// 	FunctionOne().done(FunctionTwo);
	// }
</script>

@endsection