@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> Penjualan</a></li>
			<li class="active">Penjualan / Langganan</li>
		</ul>
	</div>
</div>

<div class="content">
	<div class="panel panel-flat">
		<div class="panel-heading">
			<h5 class="panel-title">Laporan Penjualan / Langganan</h5>
			<div class="heading-elements">
				<ul class="icons-list">
		      		<li><a data-action="collapse"></a></li>
		      	</ul>
	       	</div>
	    </div>
	    <div class="panel-body">
	    	{{-- <button class="btn btn-primary" id="btn_tambah_carabayar"><i class=""></i>Tambah</button> --}}
	    	<form class="form-horizontal" autocomplete="off" id="form_laporan">
	    		<input type="hidden" name="_token" value="{{ csrf_token() }}">
	    		<div class="form-group">
	    			<label class="control-label col-sm-4">Pelanggan</label>
	    			<div class="col-sm-8">
	    				<select class="form-control select-search" name="pelanggan" required>
	    					
	    				</select>
	    			</div>
	    		</div>
	    		<div class="form-group">
	    			<label class="control-label col-sm-4">Tanggal Awal</label>
	    			<div class="col-sm-8">
	    				<input class="form-control date_awal" type="text" name="tanggal_awal" required>
	    			</div>
	    		</div>
	    		<div class="form-group">
	    			<label class="control-label col-sm-4">Tanggal Akhir</label>
	    			<div class="col-sm-8">
	    				<input class="form-control date_akhir" type="text" name="tanggal_akhir" required>
	    			</div>
	    		</div>
	    		<div class="form-group">
	    			<label class="control-label col-sm-4">Status</label>
	    			<div class="col-sm-8">
	    				<select class="form-control select-search" id="" name="laporan_status" required>
	    					<option value="">--- Pilih ---</option>
	    					<option value="1">Rekapitulasi</option>
	    					<option value="2">Detail</option>
	    				</select>
	    			</div>
	    		</div>
	    		<div class="form-group">
	    			<button class="btn btn-primary" type="button" id="btn_tampil">Tampilkan</button>
	    			<button class="btn btn-success" type="submit" id="btn_cetak">Cetak</button>
	    		</div>
	    	</form>
	    </div>


	    <table class="table table-stripped table_barang">
	    	<thead>
				<tr>
					<th>No</th>
					<th>Tanggal</th>
                    <th>No. Faktur</th>
                    <th>Keterangan</th>
                    <th>Penjualan</th>
                    <th>Diskon</th>
                    <th>Piutang</th>
				</tr>
			</thead>
			<tbody>

			</tbody>
	    </table>

	    <table class="table table-stripped table_barang2 hide">
	    	<thead>
				<tr>
					<th>No</th>
					<th>Tanggal</th>
                    <th>No. Faktur</th>
                    <th>Barang</th>
                    <th>Qty</th>
                    <th>Harga Satuan</th>
                    <th>Jumlah</th>
				</tr>
			</thead>
			<tbody>

			</tbody>
	    </table>

	    
	</div>
</div>
<input type="hidden" name="store_pelanggan">
<input type="hidden" name="store_tglawal">
<input type="hidden" name="store_tglakhir">
<input type="hidden" name="store_status">
<script type="text/javascript">
	var tb;

	$(document).ready(function(){
		tb = $(".table_barang").DataTable();
		th = $(".table_barang2").DataTable();
		tb.on( 'order.dt search.dt', function () {
            tb.column(0, {search:'applied', order:'applied'}).nodes().each( function (cell, i) {
                cell.innerHTML = i+1;
            } );
        } ).draw();
        tb.clear().draw();

        th.on( 'order.dt search.dt', function () {
            th.column(0, {search:'applied', order:'applied'}).nodes().each( function (cell, i) {
                cell.innerHTML = i+1;
            } );
        } ).draw();
        th.clear().draw();

        get_pelanggan();
	})

	$("#btn_tambah_carabayar").click(function(){
		$("[name=popup_id]").val('');
		$("[name=popup_cara]").val('');
		$("[name=popup_kode]").val('');
		$("[name=popup_tipe]").val('');
		$("[name=popup_kode]").select2();
		$("[name=popup_status]").val(null).trigger("change")
		
		$("#exampleModal").modal("show");
	})

	

	function get_pelanggan(){
		$.ajax({
			url: '{{ url('laporan_penjualan/get_langganan') }}',
			success: function(respon){
				$("[name=pelanggan]").html('');
				// $("[name=barang]").append('<option value="0">Semua Barang</option>');
				if(respon.length > 0){
					for(i in respon){
						$("[name=pelanggan]").append('<option value="'+respon[i].id_pelanggan+'" nama="'+respon[i].nama_pelanggan+'">'+respon[i].nama_pelanggan+'</option>');
					}
				}
			}
		})
	}

	$("#btn_tampil").click(function(){
		var pelanggan = $("[name=pelanggan]").val();
		var tgl_awal = $("[name=tanggal_awal]").val();
		var tgl_akhir = $("[name=tanggal_akhir]").val();
		var status = $("[name=laporan_status]").val();

		$("[name=store_pelanggan]").val(pelanggan);
		$("[name=store_tglawal]").val(tgl_awal);
		$("[name=store_tglakhir]").val(tgl_akhir);
		$("[name=store_status]").val(status);

		
		if(pelanggan != '' && tgl_awal != '' && tgl_akhir != '' && status != ''){
			get_detail(pelanggan, tgl_awal, tgl_akhir, status);/*
			get_detail_group(barang, tgl_awal, tgl_akhir, status);*/
		}
	})

	$("#btn_cetak").click(function(){
		var url = "{{ url('laporan_penjualan/cetak_detail_langgananrekap') }}";
		$("#form_laporan").attr('action', url);
		$("#form_laporan").attr('method', 'post');
		$("#form_laporan").attr('target', '_blank');
	})

	function get_detail(id_pelanggan, tgl_awal, tgl_akhir, status){
		$.ajax({
			url: '{{ url('laporan_penjualan/get_detail_langgananrekap') }}',
			type: 'post',
			data: {id_pelanggan : id_pelanggan, tgl_awal : tgl_awal, tgl_akhir : tgl_akhir, status : status},
			headers : {
				'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
			},
			success: function(respon){
				if(respon.length > 0){
					tb.clear().draw();
					th.clear().draw();
					for(i in respon){
						if(status=='1'){
						tb.row.add(['<div></div>',
							'<div>'+respon[i].tanggal+'</div>',
							'<div>'+respon[i].no_faktur+'</div>',
							'<div>'+respon[i].keterangan+'</div>',
							'<div>'+respon[i].penjualan+'</div>',
							'<div>'+respon[i].diskon+'</div>',
							'<div>'+respon[i].piutang+'</div>',
							]).draw(false);
					$(".table_barang2").addClass('hide');
					$(".table_barang").removeClass('hide');
				}else{
					th.row.add(['<div></div>',
							'<div>'+respon[i].tanggal+'</div>',
							'<div>'+respon[i].no_faktur+'</div>',
							'<div>'+respon[i].nama_barang+'</div>',
							'<div>'+respon[i].jml_barang+'</div>',
							'<div>'+respon[i].harga_satuan+'</div>',
							'<div>'+respon[i].total+'</div>',
							]).draw(false);
					$(".table_barang").addClass('hide');
					$(".table_barang2").removeClass('hide');
					}
				}
				}else{
					tb.clear().draw();
					tb.clear().draw();
				}
			}
		})
	}

	/*function get_detail_group(id_barang, tgl_awal, tgl_akhir){
		var masuk = parseFloat(0), keluar = parseFloat(0), stok = parseFloat(0);
		$.ajax({
			url: '{{ url('laporan_inventori/get_detail_group') }}',
			type: 'post',
			data: {id_barang : id_barang, tgl_awal : tgl_awal, tgl_akhir : tgl_akhir},
			headers : {
				'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
			},
			success: function(respon){

				if(respon.length > 0){
					th.clear().draw();
					for(i in respon){
						th.row.add(['<div></div>',
							'<div>'+respon[i].nama_barang+'</div>',
							'<div>'+respon[i].persediaan_masuk+'</div>',
							'<div>'+respon[i].persediaan_keluar+'</div>',
							'<div>'+respon[i].persediaan+'</div>',
							'<div>'+respon[i].nama_gudang+'</div>',
							'<div>'+respon[i].nama_proses+'</div>',
							]).draw(false);
						masuk += parseFloat(respon[i].persediaan_masuk);
						keluar += parseFloat(respon[i].persediaan_keluar);
						stok += parseFloat(respon[i].persediaan);
					}
				}else{
					th.clear().draw();
				}

				$("#total_masuk").text(masuk);
				$("#total_keluar").text(keluar);
				$("#total_stok").text(stok);
			}
		})
	}*/
</script>


@endsection