<?php $page = "report_cashflow"; ?>
@extends('layouts.app')
@section('header')

@parent
<style>

	select[name="DataTables_Table_0_length"] {
		margin-top: 8px;
	}
	.form-horizontal{
		display: inline-block;
	}

	.top{
	}
	.bottom{
		margin-top:30px;
	}
	.top .dataTables_paginate{
		display: none;
	}
	.bottom .dataTables_length{
		display: none;
	}
	.top .dataTables_info{
		display: none;
	}

	.bottom .dataTables_filter{
		display: none;
	}
	.dataTables_filter{
		margin: 0px;
	}
	.table>thead>tr>td, .table>tbody>tr>td, .table>tfoot>tr>td{
			padding: 3px 5px;
		}
	.table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th{

		padding: 12px 5px;
	}
	.dataTable thead .sorting:before{
		display: none;
	}
	.dataTable thead .sorting:after{
		display: none;
	}
	.dataTable thead .sorting_asc:after{
		display: none;
	}
</style>

	<?php $success_message = session('success'); if($success_message){?>
		<script>
			jQuery(document).ready(function(){
				alert('<?php echo $success_message; ?>');
			});
		</script>
	<?php session()->forget('success'); } ?>

	<style>
		table.editable-table p{ margin-bottom: 0; }
	</style>

	<script>
		var Totaldebet = 0;
		var Totalcredit = 0;
		jQuery(document).ready(function($){
			$('.table').DataTable( {
		        "dom": '<"top"iflp<"clear">>rt<"bottom"iflp<"clear">>'
		    } );
			$('body').on('focus','input[name="custom_date"]',function(e){
				$(this).datepicker();

			});

			<?php if(isset($debet) && isset($credit)) { ?>
				Totaldebet = {{$debet}};
				Totalcredit = {{$credit}};
			<?php } ?>

			$(".dataTables_filter label span").each( function() {
				$(this).text("Search :");
			});

			$('body').on('focus','input[name="from"]',function(e){
				$(this).datepicker({dateFormat: 'yy-mm-dd'});
			});

			$('body').on('focus','input[name="to"]',function(e){
				$(this).datepicker({dateFormat: 'yy-mm-dd'});
			});

		});


		function calculateDebetKredit(){
			var debet = $("td[data-name='tddebet']")
		              .map(function(){return $(this).attr("data-value");}).get();
		    Totaldebet = 0;
		    for (var i = 0; i < debet.length; i++) {
		    	Totaldebet += parseInt(debet[i]);
		    }
			document.getElementById("THTotaldebet").innerHTML = "IDR " + addCommas(Totaldebet);
			//console.log(debet);
			var kredit = $("td[data-name='tdkredit']")
		              .map(function(){return $(this).attr("data-value");}).get();
		    Totalcredit = 0;
		    for (var i = 0; i < kredit.length; i++) {
		    	Totalcredit += parseInt(kredit[i]);
		    }
			document.getElementById("THTotalcredit").innerHTML = "IDR " + addCommas(Totalcredit);

		}

		function addCommas(nStr) {
			nStr += '';
			x = nStr.split('.');
			x1 = x[0];
			x2 = x.length > 1 ? '.' + x[1] : '';
			var rgx = /(\d+)(\d{3})/;
			while (rgx.test(x1)) {
			x1 = x1.replace(rgx, '$1' + ',' + '$2');
			}
			return x1 + x2;
		}


		function callback_editable(){
			// insert ajax here
			//console.log('test');
			$('tr.edit-mode').each(function(e){

				var custom_date = $(this).find('input[name="custom_date"]').val();
				var desc = $(this).find('input[name="desc"]').val();
				var debet = $(this).find('input[name="debet"]').val();
				var kredit = $(this).find('input[name="kredit"]').val();
				var account_id = $(this).find('select[name="account_id"]').val();
				var el= $(this);
				if($(this).find('input[name="id"]').length == 1 && $(this).find('input[name="id"]').val() != ''){
					if(isset(custom_date) && isset(desc) && isset(debet) && isset(kredit)){

						var id = $(this).find('input[name="id"]').val();
						// $.post(
		 			// 	"{{route('journal.transaction_edit')}}", //edit
						//   	{
						//   		id:id,
						//   		custom_date: custom_date,
						//   		desc: desc,
						// 		debet: debet,
						// 		kredit: kredit,
						// 		account_id: account_id,
						//   	},
						// 	function(data){
						// 		el.find('input[name="debet"]').siblings('p').text('IDR ' + new Intl.NumberFormat('USD').format(data.debet?data.debet:0).toString());
						// 		el.find('input[name="kredit"]').siblings('p').text('IDR ' + new Intl.NumberFormat('USD').format(data.credit?data.credit:0).toString());
						// 	}
						// );
					}
					calculateDebetKredit();
				}else{
					if(isset(custom_date) && isset(desc) && isset(debet) && isset(kredit)){

						// $.post(
		 			// 	"{{route('journal.transaction_store')}}", //add
						//   	{
						//   		custom_date: custom_date,
						//   		desc: desc,
						// 		debet: debet,
						// 		kredit: kredit,
						// 		account_id: account_id,
						//   	},
						// 	function(data){
						// 		el.find('input[name="id"]').val(data.id);
						// 		el.find('input[name="debet"]').siblings('p').text('IDR ' + new Intl.NumberFormat('USD').format(data.debet?data.debet:0).toString());
						// 		el.find('input[name="kredit"]').siblings('p').text('IDR ' + new Intl.NumberFormat('USD').format(data.credit?data.credit:0).toString());


						// 	}
						// );
					}
					else{
						console.log("belum lengkap");
						var el = $(this);
						el.remove();
					}
					calculateDebetKredit();

				}
			});




		}
		$(document).ready(function(){

			$('input[name="from"]').datepicker();
			$('input[name="to"]').datepicker();

			editable_init();

			// Delete transaction action
			$('table').on('click','.delete_transactionsss',function(e){
				e.preventDefault();
				var el = $(this);
				var id = el.parents('tr').find('input[name="id"]').val();
				if(id){

					$.post(
							"{{route('journal.transaction_delete')}}",
							{
								id:id,
							},
							function(data){
								// remove tr
								el.parents('tr').remove();
							}
					);
				}else{
					el.parents('tr').remove();
				}

				calculateDebetKredit();
			});
		});
		function isset(variable){
			if(variable == "" || variable == null)
				return false;
			else
				return true;
		}
		function addnewclicked(){

		}
		function printWindow() {
			 window.print();
		}
	</script>
@endsection

@section('content')
<!-- Page header -->
<div class="page-header">
	<div class="page-header-content">
	<button class="btn btn-labeled bg-teal-400" style="float: right; margin-top: 30px; position: relative; z-index: 99;" onClick="printWindow()"><b><i class="icon-printer"></i></b> Print</button>
		<div class="page-title">
			<h4><i class="icon-arrow-left52 position-left"></i> <span class="text-semibold">Report -</span> Cash Flow</h4>
		</div>
	</div>

	<div class="breadcrumb-line">
		<ul class="breadcrumb">
			<li><a href="#"><i class="icon-home2 position-left"></i> Home</a></li>
			<li class="active">Report Cash Flow</li>
		</ul>
	</div>
</div>
<!-- /page header -->


<!-- Content area -->
<div class="content">

	<div class="panel panel-flat">
		<div class="panel-body">
				{{ Form::open(array('action' => 'SiteController@cashFlowfilterDate', 'method' => 'post', 'class' => 'form-horizontal', 'id'=> 'orderForm', 'novalidate' => 'novalidate', 'autocomplete' => 'off')) }}
				<span style="display: inline-block; vertical-align: top;">
					{{Form::text('from',$dateFrom, array('class' => 'form-control', 'id'=> 'from', 'placeholder' => 'From date'))}}
				</span>
				<span style=" display: inline-block;padding-top: 2%;">
					To
				</span>
				<span style="display: inline-block; vertical-align: top;">
					{{Form::text('to', $dateTo, array('class' => 'form-control', 'id'=> 'to', 'placeholder' => 'Until date'))}}
				</span>

				<span style="display: inline-block; vertical-align: bottom;width: 100px;">
					<button style="width: 100%" type="submit" class="btn btn-primary">Filter</button>
				</span>
				{{Form::close()}}
				<span style="display: inline-block; vertical-align: bottom;width: 100px;">
						<a href="{{route('reports.cashflow')}}"> <button button style="width: 100%" class="btn btn-primary">Clear Filter</button> </a>
				</span>
		</div>
	</div>
	<div class="panel panel-flat">
		<div class="panel-body">
			<div class="table-responsive" style="padding-bottom: 40px;">
				<table class="table">
					<thead>
						<tr>
							<th style="text-align: center;">#</th>
							<th>Account Name</th>
							<th>Date</th>
							<th>Debet</th>
							<th>Kredit</th>
						</tr>
					</thead>
					<tfoot>
						<th colspan="3" style="font-weight:bold"> Total </th>
						<th id="THTotaldebet" style="font-weight:bold">IDR {{number_format($debet)}}</th>
						<th id="THTotalcredit" style="font-weight:bold">IDR {{number_format($credit)}}</th>
					</tfoot>
					<tbody>
						<?php foreach($journals as $journal){ ?>
							<tr>
								<td> {{$journal->code}}</td>
								<td>
									<p style="text-transform: capitalize;"><b>{{isset($journal->accountant_transactions_name)?$journal->accountant_transactions_name:null}}</b></p>
									<p>Type &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;: Single Transaction</p>
									<p>Account  : {{isset($journal->accountants_name)?$journal->accountants_name:null}}</p>
									<p>Payment  : {{isset($journal->payment)?$journal->payment:null}}</p>
								</td>
								<td> {{$journal->custom_date}}</td>
								<td> <p>IDR {{number_format($journal->debet)}}</p> </td>
								<td> <p>IDR {{number_format($journal->credit)}}</p> </td>
							</tr>
						<?php } ?>
						<?php foreach($detail_receipts as $detail_receipt){ ?>
							<tr>
								<td> {{$detail_receipt->code}}</td>
								<td>
									<p style="text-transform: capitalize;"><b>{{isset($detail_receipt->accountant_transactions_name)?$detail_receipt->accountant_transactions_name:null}}</b></p>
									<p>Type &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;: in Receipt {{$detail_receipt->receipt_name}}</p>
									<p>Account  : {{isset($detail_receipt->accountants_name)?$detail_receipt->accountants_name:null}}</p>
									<p>Payment  : {{isset($detail_receipt->payment)?$detail_receipt->payment:null}}</p>
								</td>
								<td> {{$detail_receipt->custom_date}}</td>
								<td> <p>IDR {{number_format($detail_receipt->debet)}}</p> </td>
								<td> <p>IDR {{number_format($detail_receipt->credit)}}</p> </td>
							</tr>
						<?php } ?>

						<?php /*
						<tr>
							<td data-value="2017-05-19" data-label="2017-05-19">
								<p>2017-05-19</p>
								<input type="text" class="form-control edit-field" style="width: 100px" />
							</td>
							<td data-value="Beli sepatu di matahari" data-label="Beli sepatu di matahari">
								<p>Beli sepatu di matahari</p>
								<input type="text" class="form-control edit-field" />
							</td>
							<td data-value="750000" data-label="IDR 750.000,-">
								<p>IDR 750.000,-</p>
								<input type="text" class="form-control edit-field" style="width: 100px" />
							</td>
							<td data-value="2" data-label="Utilities">
								<p>Utilities</p>
								<select class="select edit-field" name="" id="">
									<option value="1">Internet</option>
									<option value="2">Utilities</option>
								</select>
							</td>
							<td data-value="1" data-label="Cash in hand">
								<p>Cash in hand</p>
								<select class="select edit-field" name="" id="">
									<option value="1">Cash in hand</option>
									<option value="2">Bank BCA</option>
								</select>
							</td>
							<td class="text-center">
								<ul class="icons-list">
									<li class="dropdown">
										<a href="#" class="dropdown-toggle" data-toggle="dropdown">
											<i class="icon-menu9"></i>
										</a>

										<ul class="dropdown-menu dropdown-menu-right">
											<li><a href="#">Delete</a></li>
										</ul>
									</li>
								</ul>
							</td>
						</tr> */?>
					</tbody>
				</table>
			</div>
		</div>
	</div>
</div>
<!-- /content area -->
@endsection
