@extends(\Auth::user()->role != 10 ? 'layout' : 'layoutfrontdesk')

@section('title', 'Account Receivable')

@section('css')
<style type="text/css">
	.datatable-column-width{
		overflow: hidden; text-overflow: ellipsis; max-width: 200px;
	}
    #company_id{
        width:12.5rem;
    }
</style>
@endsection

@section('content')

	<!-- Page header -->
	<div class="page-header {{in_array(\Auth::user()->role, [1,2]) ? 'page-header-light' : ''}}">
		<div class="page-header-content header-elements-md-inline">
			<div class="page-title d-flex">
				<h4>  <span class="font-weight-semibold">Account Receivable</span></h4>
				<a href="#" class="header-elements-toggle text-default d-md-none"><i class="icon-more"></i></a>
			</div>
		</div>
	</div>
	<!-- /page header -->

	<!-- Content area -->
	<div class="content">
			@csrf
            <div class="row mb-1 justify-content-between">
				<div class="d-flex pl-2">
                    <form action="" method="get" class="row p-2">
                        <div>
                            <p class="col-form-label mr-2 font-weight-bolder">Payment Method: </p>
                            <p>
                                <select name="payment_method" id="payment_method" class="form-control form-control-select2">
                                    <option value="">-- Select Method --</option>
                                    <option value="99_99" {{ isset($_GET['payment_method']) ? ($_GET['payment_method'] == '99_99' ? 'selected' : '') : '' }}>
                                        All Method
                                    </option>
                                    <!-- Angka 1 atau 2 di depan untuk flagging antara metode pembayaran atau jenis pembayaran-->
                                    @if (count($payment_methods) > 0)
                                    <option disabled> By Payment Method: </option>
                                    @foreach($payment_methods as $payment_method)
                                    <option value="1_{{ $payment_method->id }}"
                                            {{ isset($_GET['payment_method']) ? ($_GET['payment_method'] == '1_'.$payment_method->id ? 'selected' : '') : '' }}
                                    >
                                        {{ $payment_method->nama }}
                                    </option>
                                    @endforeach
                                    @endif

                                    @if (count($platform_headers) > 0)
                                    <option disabled> By Platform Header: </option>
                                    @foreach($platform_headers as $platform_header)
                                    <option value="11_{{ $platform_header->id }}"
                                            {{ isset($_GET['payment_method']) ? ($_GET['payment_method'] == '11_'.$platform_header->id ? 'selected' : '') : '' }}
                                    >
                                        {{ $platform_header->name }}
                                    </option>
                                    @endforeach
                                    @endif

                                    {{-- @if (count(config('custom.jenis_pembayaran')) > 0)
                                    <option disabled> By Payment Method: </option>
                                    @foreach(config('custom.jenis_pembayaran') as $key => $jenis_pembayaran)
                                        @if(in_array($key, [3]))
                                        <option value="2_{{ $key }}"
                                                {{ isset($_GET['payment_method']) ? ($_GET['payment_method'] == '2_'.$key ? 'selected' : '') : '' }}
                                        >
                                            {{$jenis_pembayaran}}
                                        </option>
                                        @endif
                                    @endforeach
                                    @endif --}}

                                    @if (count(config('custom.segment_ratecodes')) > 0)
                                    <option disabled> By Segment: </option>
                                    @foreach(config('custom.segment_ratecodes') as $key => $segment_ratecode)
                                        @if(in_array($key, [2,3,4,5,6,8,9,13,14,15]))
                                        <option value="3_{{ $key }}"
                                                {{ isset($_GET['payment_method']) ? ($_GET['payment_method'] == '3_'.$key ? 'selected' : '') : '' }}
                                        >
                                            {{ $segment_ratecode }}
                                        </option>
                                        @endif
                                    @endforeach
                                    @endif
                                </select>
                            </p>
                        </div>
                        <div class="pl-2">
                            <p class="col-form-label mr-2" style="white-space: nowrap" for="payment_date_filter"><b>Payment Date: </b></p>
                            <p>
                                <input type="text" name="payment_date_filter" class="form-control" id="payment_date_filter">
                            </p>
                        </div>
                        <div class="pl-2">
                            <p class="col-form-label mr-2"><b>&nbsp;</b></p>
                            <p><button type="submit" class="btn btn-success">Filter</button></p>
                        </div>
                    </form>
                    <div class="p-2 pl-5">
                        <p class="col-form-label mr-2"><b>Total AR Payment:</b></p>
                        <p><label class="col-form-label mr-2"><b>Rp.<span id="total_tagihan">0</span></b></label></p>
					</div>
				</div>
		<form action="#" method="post">
				<div class="d-flex pr-2">
					<button class="btn btn-sm btn-primary mr-1"
							id="btn_create_invoice"
							data-target="#create_invoice"
							data-toggle="modal"
							title="Create Invoice"
							type="button"
							style="max-height: 40px"
					>
						<i class="fas fa-file-invoice-dollar"></i>&nbsp;Create Invoice
					</button>
					<button class="btn btn-sm btn-success mr-1"
							id="btn_ar_payment"
							{{-- data-target="#ar_payment_modal"
							data-toggle="modal" --}}
							title="AR Payment"
							type="button"
							style="max-height: 40px"
					>
						<i class="fas fa-check"></i>&nbsp;AR Payment
					</button>
					<button class="btn btn-sm btn-warning"
							id="btn_ar_transfer"
							data-target="#ar_transfer_modal"
							data-toggle="modal"
							title="AR Transfer"
							type="button"
							style="max-height: 40px"
					>
						<i class="fas fa-file-export"></i>&nbsp;AR Transfer
					</button>
				</div>
			</div>
			<div class="card mt-0">
                <table class="table datatable-basic table-hover">
					<thead>
						<tr>
							<th style="width: 100px">#</th>
							<th>Bill No</th>
							<th>Customer</th>
							<th>Method</th>
							<th>Company/Platform</th>
							<th>Transaction Date</th>
							<th style="text-align: right">Debt Amount</th>
							<th style="text-align: right">Pay Amount</th>
							<th style="text-align: right">Balance</th>
							<th style="text-align: center; width: 11%;">Invoice</th>
						</tr>
					</thead>
					<tbody>
					@php
					$no = 1;
					$idx_item = 0;
					@endphp

					<!-- Fetch Pembayaran Pelunasan Hotel -->
					@foreach($hotel_bills as $hotel_bill)
						@php
						$pay_amount = $hotel_bill->pay_amount ? $hotel_bill->pay_amount : 0;

						if($hotel_bill->tipe_pembayaran == 1){
							$nominal = $hotel_bill->nominal;
						}
						else{
							$nominal = $hotel_bill->nominal * -1;
						}

						$balance = $nominal - $pay_amount;

						$invoice_company = $hotel_bill->booking->company
										   ?
										   $hotel_bill->booking->company->comp_title.' '.$hotel_bill->booking->company->name
										   :
										   (@$hotel_bill->booking->guest->individual_ledger ? @$hotel_bill->booking->guest->name : '-');

                                            if ($hotel_bill->platform_pembayaran_id) {
                                                $invoice_company = @$hotel_bill->platformPembayaran->nama ?? '-';
                                            }

						$address = $hotel_bill->booking->company
								   ?
								   @$hotel_bill->booking->company->address.', '.@$hotel_bill->booking->company->city
								   :
								   @$hotel_bill->booking->guest->address.', '.@$hotel_bill->booking->guest->city;

						$department = $hotel_bill->booking->company
									  ?
									  ($hotel_bill->booking->company->department ? $hotel_bill->booking->company->department : 'Accounting Department')
									  :
									  '';

						$room_no = "";

						if($hotel_bill->booking->bookingDetails){
							foreach($hotel_bill->booking->bookingDetails as $booking_detail){
								if($hotel_bill->room_index == $booking_detail->room_index){
									$room_no = $booking_detail->nomor_kamar;
								}
							}
						}
						@endphp

						@if($balance != 0)
							<tr id="invoice_item{{$idx_item}}">
								<td>
									<input type="checkbox" name="check[{{$idx_item}}]"
										   id="check{{$idx_item}}" value="{{$idx_item}}"
										   data-idx="{{$idx_item}}">

									<input type="hidden" name="pembayaran_id[{{ $idx_item }}]"
										   id="pembayaran_id{{$idx_item}}"
										   value="{{ $hotel_bill->id }}">
									<input type="hidden" name="booking_deposit_id[{{ $idx_item }}]"
										   id="booking_deposit_id{{ $idx_item }}" value="">
									<input type="hidden" name="pembayaran_pos_id[{{ $idx_item }}]"
										   id="pembayaran_pos_id{{ $idx_item }}" value="">

									<!-- Field Baru -->
									<input type="hidden" name="arrival[{{ $idx_item }}]"
										   id="arrival{{ $idx_item }}" value="{{ @$hotel_bill->invoice->bookingDetail->start_date }}">
									<input type="hidden" name="departure[{{ $idx_item }}]"
										   id="departure{{ $idx_item }}" value="{{ @$hotel_bill->invoice->bookingDetail->end_date }}">

									<input type="hidden" name="no_bill[{{ $idx_item }}]"
										   id="no_bill{{ $idx_item }}" value="{{ @$hotel_bill->invoice->no_invoice }}">

								    <!-- Field Baru -->
									<input type="hidden" name="room_no[{{ $idx_item }}]"
										   id="room_no{{ $idx_item }}" value="{{ $room_no }}">

									<input type="hidden" name="nama_pelanggan[{{ $idx_item }}]"
										   id="nama_pelanggan{{ $idx_item }}" value="{{ @$hotel_bill->invoice->nama_pelanggan }}">

									<!-- Field Baru -->
									<input type="hidden" name="voucher[{{ $idx_item }}]"
										   id="voucher{{ $idx_item }}" value="{{ @$hotel_bill->voucher }}">

									<input type="hidden" name="bill_date[{{ $idx_item }}]"
										   id="bill_date{{ $idx_item }}" value="{{ $hotel_bill->transaction_date ? date('d-m-Y', strtotime($hotel_bill->transaction_date)) : '-' }}">
									<input type="hidden" name="debt_amount[{{ $idx_item }}]"
										   id="debt_amount{{ $idx_item }}" value="{{$nominal}}">
									<input type="hidden" name="pay_amount[{{ $idx_item }}]"
										   id="pay_amount{{ $idx_item }}" value="{{$pay_amount}}">
									<input type="hidden" name="balance[{{ $idx_item }}]"
										   id="balance{{ $idx_item }}" value="{{$balance}}">
								    <input type="hidden" name="remarks[{{ $idx_item }}]"
								   		   id="remarks{{ $idx_item }}" value="{{ @$hotel_bill->booking->remark }}">

								    <input type="hidden" name="companies[{{ $idx_item }}]"
   										id="companies{{ $idx_item }}" value="{{ $invoice_company }}"
   								    >
								    <input type="hidden" name="department[{{ $idx_item }}]"
   										id="department{{ $idx_item }}" value="{{ $department }}"
   								    >
								   	<input type="hidden" name="address[{{ $idx_item }}]"
   									   id="address{{ $idx_item }}" value="{{ $address }}"
   								   	>
								</td>
								<td>{{ @$hotel_bill->invoice->no_invoice }}</td>
								<td>{{ $hotel_bill->invoice->nama_pelanggan ?? 'Customer' }}</td>
								<td>{{ @$hotel_bill->jenis_pembayaran_id ? config('custom.jenis_pembayaran')[@$hotel_bill->jenis_pembayaran_id] : '-' }}</td>
								<td>
									{{
										$invoice_company
									}}
								</td>
								<td>{{ $hotel_bill->transaction_date ? date('d-m-Y', strtotime($hotel_bill->transaction_date)) : '-' }}</td>
								<td style="text-align: right">{{ ribuanWithComma($nominal) }}</td>
								<td style="text-align: right">{{ ribuanWithComma($pay_amount) }}</td>
								<td style="text-align: right">{{ ribuanWithComma($balance) }}</td>
								<td style="text-align: center">
									<button class="btn btn-primary p-2"
											data-target="#modal_invoice_list"
											data-toggle="modal"
											onclick="getInvoiceList('pembayaran_id', {{$hotel_bill->id}}, {{$hotel_bill->invoice->no_invoice}})"
											title="AR Invoice List"
											type="button"
									>
										<!-- <i class="fas fa-print"></i> -->
										<span class="p-1 badge badge-secondary">{{ count($hotel_bill->arInvoiceDetail) }}</span> Invoices
									</button>
								</td>
							</tr>
							@php
							$no++;
							$idx_item++;
							@endphp
						@endif
					@endforeach

					<!-- Fetch Pembayaran Deposit Hotel -->
					@foreach($hotel_bill_deposits as $hotel_bill_deposit)
						@if(array_key_exists($hotel_bill_deposit->booking_id, $invoice_array))
							@if(array_key_exists($hotel_bill_deposit->room_index, $invoice_array[$hotel_bill_deposit->booking_id]))
							@php
							$pay_amount = $hotel_bill_deposit->pay_amount ? $hotel_bill_deposit->pay_amount : 0;
							$balance = $hotel_bill_deposit->nominal - $pay_amount;
							@endphp

								@if($balance != 0)
									<!-- Jika Deposit Di Data Booking -->
									@if($hotel_bill_deposit->booking)
										@php
										$invoice_company = isset($hotel_bill_deposit->booking->company)
														   ?
														   $hotel_bill_deposit->booking->company->name.', '.$hotel_bill_deposit->booking->company->comp_title
														   :
														   (@$hotel_bill_deposit->booking->guest->individual_ledger ? $hotel_bill_deposit->booking->guest->name : '-');
										$address = isset($hotel_bill_deposit->booking->company)
												   ?
												   @$hotel_bill_deposit->booking->company->address.', '.@$hotel_bill_deposit->booking->company->city
												   :
												   @$hotel_bill_deposit->booking->guest->address.', '.@$hotel_bill_deposit->booking->guest->city;

										$department = $hotel_bill_deposit->booking->company
													  ?
													  ($hotel_bill_deposit->booking->company->department ? $hotel_bill_deposit->booking->company->department : 'Accounting Department')
													  :
													  '';

										$room_no = $hotel_bill_deposit->nomor_kamar;

                                            if ($hotel_bill_deposit->platform_pembayaran_id) {
                                                $invoice_company = @$hotel_bill_deposit->platform->nama ?? '-';
                                            }
										@endphp
									<tr id="invoice_item{{ $idx_item }}">
										<td>
											<input type="checkbox" name="check[{{$idx_item}}]"
												   id="check{{$idx_item}}" value="{{$idx_item}}"
												   data-idx="{{$idx_item}}">

											<input type="hidden" name="pembayaran_id[{{ $idx_item }}]"
												   id="pembayaran_id{{$idx_item}}" value="">
											<input type="hidden" name="booking_deposit_id[{{ $idx_item }}]"
												   id="booking_deposit_id{{ $idx_item }}"
												   value="{{ $hotel_bill_deposit->id }}">
											<input type="hidden" name="pembayaran_pos_id[{{ $idx_item }}]"
												   id="pembayaran_pos_id{{ $idx_item }}" value="">

											<!-- Field Baru -->
											<input type="hidden" name="arrival[{{ $idx_item }}]"
												   id="arrival{{ $idx_item }}" value="{{ @$hotel_bill_deposit->invoice->bookingDetail->start_date }}">
											<input type="hidden" name="departure[{{ $idx_item }}]"
												   id="departure{{ $idx_item }}" value="{{ @$hotel_bill_deposit->invoice->bookingDetail->end_date }}">

											<input type="hidden" name="no_bill[{{ $idx_item }}]"
											   id="no_bill{{ $idx_item }}" value="{{ ($hotel_bill_deposit->booking_id && $hotel_bill_deposit->room_index) ? $invoice_array[$hotel_bill_deposit->booking_id][$hotel_bill_deposit->room_index]->no_invoice : '' }}"
											>

											<!-- Field Baru -->
											<input type="hidden" name="room_no[{{ $idx_item }}]"
												   id="room_no{{ $idx_item }}" value="{{ $room_no }}">

												   <input type="hidden" name="nama_pelanggan[{{ $idx_item }}]"
													   id="nama_pelanggan{{ $idx_item }}" value="{{ $hotel_bill_deposit->booking_id && $hotel_bill_deposit->room_index ? $invoice_array[$hotel_bill_deposit->booking_id][$hotel_bill_deposit->room_index]->nama_pelanggan : '' }}">

											<!-- Field Baru -->
											<input type="hidden" name="voucher[{{ $idx_item }}]"
												   id="voucher{{ $idx_item }}" value="{{ @$hotel_bill_deposit->voucher }}">

											<input type="hidden" name="bill_date[{{ $idx_item }}]"
												   id="bill_date{{ $idx_item }}"
												   value="{{ $hotel_bill_deposit->transaction_date ? date('d-m-Y', strtotime($hotel_bill_deposit->transaction_date)) : '-' }}">
											<input type="hidden" name="debt_amount[{{ $idx_item }}]"
												   id="debt_amount{{ $idx_item }}" value="{{ $hotel_bill_deposit->nominal }}">
											<input type="hidden" name="pay_amount[{{ $idx_item }}]"
												   id="pay_amount{{ $idx_item }}" value="{{ $pay_amount }}">
											<input type="hidden" name="balance[{{ $idx_item }}]"
												   id="balance{{ $idx_item }}" value="{{ $balance }}">
											<input type="hidden" name="remarks[{{ $idx_item }}]"
												   id="remarks{{ $idx_item }}" value="{{ @$hotel_bill_deposit->booking->remark }}">

											<input type="hidden" name="companies[{{ $idx_item }}]"
												   id="companies{{ $idx_item }}" value="{{ $invoice_company }}"
											>
											<input type="hidden" name="department[{{ $idx_item }}]"
												id="department{{ $idx_item }}" value="{{ $department }}"
											>
											<input type="hidden" name="address[{{ $idx_item }}]"
												   id="address{{ $idx_item }}" value="{{ @$address }}"
											>
										</td>
										<td>{{ $hotel_bill_deposit->booking_id && $hotel_bill_deposit->room_index ? $invoice_array[$hotel_bill_deposit->booking_id][$hotel_bill_deposit->room_index]->no_invoice : '' }}</td>
										<td>{{ $hotel_bill_deposit->booking_id && $hotel_bill_deposit->room_index ? $invoice_array[$hotel_bill_deposit->booking_id][$hotel_bill_deposit->room_index]->nama_pelanggan : 'Customer' }}</td>
										<td>{{ @$hotel_bill_deposit->jenis_deposit ? config('custom.jenis_deposit')[@$hotel_bill_deposit->jenis_deposit] : '-' }}</td>
                                        <td>
											{{  $invoice_company }}
										</td>
										<td>{{ $hotel_bill_deposit->transaction_date ? date('d-m-Y', strtotime($hotel_bill_deposit->transaction_date)) : '-' }}</td>
										<td style="text-align: right">{{ ribuanWithComma($hotel_bill_deposit->nominal) }}</td>
										<td style="text-align: right">{{ ribuanWithComma($pay_amount) }}</td>
										<td style="text-align: right">{{ ribuanWithComma($balance) }}</td>
										<td style="text-align: center">
											<button class="btn btn-primary p-2"
													data-target="#modal_invoice_list"
													data-toggle="modal"
													onclick="getInvoiceList('booking_deposit_id', {{$hotel_bill_deposit->id}}, {{ $hotel_bill_deposit->booking_id && $hotel_bill_deposit->room_index ? $invoice_array[$hotel_bill_deposit->booking_id][$hotel_bill_deposit->room_index]->no_invoice : '' }})"
													title="AR Invoice List"
													type="button"
											>
												<!-- <i class="fas fa-print"></i> -->
												<span class="p-1 badge badge-secondary">
													{{ count($hotel_bill_deposit->arInvoiceDetail) }}
												</span> Invoices
											</button>
										</td>
									</tr>

										@php
										$no++;
										$idx_item++;
										@endphp
									@endif
								@endif
							@endif
						@endif

						<!-- Jika Deposit Di Nonstay Folio -->
						@if($hotel_bill_deposit->folioDummy)
							@php
							$invoice_company = @$hotel_bill_deposit->folioDummy->guestProfile->individual_ledger ? $hotel_bill_deposit->folioDummy->guestProfile->name : '-';
							$address = $hotel_bill_deposit->folioDummy->guestProfile ? $hotel_bill_deposit->folioDummy->guestProfile->address.', '.$hotel_bill_deposit->folioDummy->guestProfile->city : '-';
							$department = '';
                            $pay_amount = $hotel_bill_deposit->pay_amount ? $hotel_bill_deposit->pay_amount : 0;
							$balance = $hotel_bill_deposit->nominal - $pay_amount;

                            if ($hotel_bill_deposit->platform_pembayaran_id) {
                                $invoice_company = @$hotel_bill_deposit->platform->nama ?? '-';
                            }
							@endphp

                        @if ($balance != 0)
						<tr id="invoice_item{{ $idx_item }}">
							<td>
								<input type="checkbox" name="check[{{$idx_item}}]"
									   id="check{{$idx_item}}" value="{{$idx_item}}"
									   data-idx="{{$idx_item}}">

								<input type="hidden" name="pembayaran_id[{{ $idx_item }}]"
									   id="pembayaran_id{{$idx_item}}" value="">
								<input type="hidden" name="booking_deposit_id[{{ $idx_item }}]"
									   id="booking_deposit_id{{ $idx_item }}"
									   value="{{ $hotel_bill_deposit->id }}">
								<input type="hidden" name="pembayaran_pos_id[{{ $idx_item }}]"
									   id="pembayaran_pos_id{{ $idx_item }}" value="">

								   <!-- Field Baru -->
								<input type="hidden" name="arrival[{{ $idx_item }}]"
									   id="arrival{{ $idx_item }}" value="{{ @$hotel_bill_deposit->invoice->bookingDetail->start_date }}">
								<input type="hidden" name="departure[{{ $idx_item }}]"
									   id="departure{{ $idx_item }}" value="{{ @$hotel_bill_deposit->invoice->bookingDetail->end_date }}">

								<input type="hidden" name="no_bill[{{ $idx_item }}]"
									   id="no_bill{{ $idx_item }}" value="{{ @$hotel_bill_deposit->folioDummy->no_bill }}">

								<!-- Field Baru -->
								<input type="hidden" name="room_no[{{ $idx_item }}]"
									   id="room_no{{ $idx_item }}" value="">

								<input type="hidden" name="nama_pelanggan[{{ $idx_item }}]"
									   id="nama_pelanggan{{ $idx_item }}" value="{{ @$hotel_bill_deposit->folioDummy->guestProfile->name }}">

								<!-- Field Baru -->
								<input type="hidden" name="voucher[{{ $idx_item }}]"
									   id="voucher{{ $idx_item }}" value="{{ @$hotel_bill_deposit->voucher }}">

								<input type="hidden" name="bill_date[{{ $idx_item }}]"
									   id="bill_date{{ $idx_item }}"
									   value="{{ $hotel_bill_deposit->transaction_date ? date('d-m-Y', strtotime($hotel_bill_deposit->transaction_date)) : '-' }}">
								<input type="hidden" name="debt_amount[{{ $idx_item }}]"
									   id="debt_amount{{ $idx_item }}" value="{{ $hotel_bill_deposit->nominal }}">
								<input type="hidden" name="pay_amount[{{ $idx_item }}]"
									   id="pay_amount{{ $idx_item }}" value="{{ $pay_amount }}">
								<input type="hidden" name="balance[{{ $idx_item }}]"
									   id="balance{{ $idx_item }}" value="{{ $balance }}">
								<input type="hidden" name="remarks[{{ $idx_item }}]"
									   id="remarks{{ $idx_item }}" value="{{ @$hotel_bill_deposit->booking->remark }}">
								<input type="hidden" name="companies[{{ $idx_item }}]"
									   id="companies{{ $idx_item }}" value="{{ $invoice_company }}"
								>
								<input type="hidden" name="department[{{ $idx_item }}]"
									id="department{{ $idx_item }}" value="{{ $department }}"
								>
								<input type="hidden" name="address[{{ $idx_item }}]"
									   id="address{{ $idx_item }}" value="{{ $address }}"
								>
							</td>
							<td>{{ @$hotel_bill_deposit->folioDummy->no_bill }}</td>
							<td>{{ $hotel_bill_deposit->folioDummy->guestProfile->name  ?? 'Customer' }}</td>
                            <td>{{ @$hotel_bill_deposit->jenis_deposit ? config('custom.jenis_deposit')[@$hotel_bill_deposit->jenis_deposit] : '-' }}</td>
							<td>{{ $invoice_company }}</td>
							<td>{{ $hotel_bill_deposit->transaction_date ? date('d-m-Y', strtotime($hotel_bill_deposit->transaction_date)) : '-' }}</td>
							<td style="text-align: right">{{ ribuanWithComma($hotel_bill_deposit->nominal) }}</td>
							<td style="text-align: right">{{ ribuanWithComma($pay_amount) }}</td>
							<td style="text-align: right">{{ ribuanWithComma($balance) }}</td>
							<td style="text-align: center">
								<button class="btn btn-primary p-2"
										data-target="#modal_invoice_list"
										data-toggle="modal"
										onclick="getInvoiceList('booking_deposit_id', {{$hotel_bill_deposit->id}}, {{$hotel_bill_deposit->folioDummy->no_bill}})"
										title="AR Invoice List"
										type="button"
								>
									<!-- <i class="fas fa-print"></i> -->
									<span class="p-1 badge badge-secondary">{{ count($hotel_bill_deposit->arInvoiceDetail) }}</span> Invoices
								</button>
							</td>
						</tr>
						@php
						$no++;
						$idx_item++;
						@endphp
						@endif
                        @endif
					@endforeach

					<!-- Fetch Pembayaran POS -->
					@foreach($outlet_bills as $outlet_bill)
						@php
						$pay_amount = $outlet_bill->pay_amount ? $outlet_bill->pay_amount : 0;
						$balance = $outlet_bill->nominal - $pay_amount;

						$invoice_company = $outlet_bill->ledger ? $outlet_bill->ledger->comp_title.' '.$outlet_bill->ledger->name : '-';
                            if ($outlet_bill->platform_id) {
                                $invoice_company = @$outlet_bill->platform->nama ?? '-';
                            }
						$address = $outlet_bill->ledger ? $outlet_bill->ledger->address.', '.$outlet_bill->ledger->city : '-';
						$department = $outlet_bill->ledger
									  ?
									  ($outlet_bill->ledger->department ? $outlet_bill->ledger->department : 'Accounting Department')
									  :
									  '';
						$room_no = $outlet_bill->nomor_kamar;
						@endphp

						@if($balance != 0)
							<tr id="invoice_item{{$idx_item}}">
								<td>
									<input type="checkbox" name="check[{{$idx_item}}]"
										   id="check{{$idx_item}}" value="{{$idx_item}}"
										   data-idx="{{$idx_item}}">

									<input type="hidden" name="pembayaran_id[{{ $idx_item }}]"
										   id="pembayaran_id{{$idx_item}}" value="">
									<input type="hidden" name="booking_deposit_id[{{ $idx_item }}]"
										   id="booking_deposit_id{{ $idx_item }}" value="">
									<input type="hidden" name="pembayaran_pos_id[{{ $idx_item }}]"
										   id="pembayaran_pos_id{{ $idx_item }}" value="{{ $outlet_bill->id }}">

									<!-- Field Baru -->
									<input type="hidden" name="arrival[{{ $idx_item }}]"
										   id="arrival{{ $idx_item }}" value="{{ $outlet_bill->transaction_date }}">
									<input type="hidden" name="departure[{{ $idx_item }}]"
										   id="departure{{ $idx_item }}" value="{{ $outlet_bill->transaction_date }}">

									<input type="hidden" name="no_bill[{{ $idx_item }}]"
										   id="no_bill{{ $idx_item }}" value="{{ @$outlet_bill->cart->order_flag }}">

								    <!-- Field Baru -->
									<input type="hidden" name="room_no[{{ $idx_item }}]"
										   id="room_no{{ $idx_item }}" value="{{$room_no}}">

									<input type="hidden" name="nama_pelanggan[{{ $idx_item }}]"
										   id="nama_pelanggan{{ $idx_item }}" value="{{ @$outlet_bill->cart->nama_pelanggan }}">

								    <!-- Field Baru -->
   									<input type="hidden" name="voucher[{{ $idx_item }}]"
   										   id="voucher{{ $idx_item }}" value="{{ @$outlet_bill->voucher }}">

									<input type="hidden" name="bill_date[{{ $idx_item }}]"
										   id="bill_date{{ $idx_item }}" value="{{ $outlet_bill->transaction_date ? date('d-m-Y', strtotime($outlet_bill->transaction_date)) : '-' }}">
									<input type="hidden" name="debt_amount[{{ $idx_item }}]"
										   id="debt_amount{{ $idx_item }}" value="{{$outlet_bill->nominal}}">
									<input type="hidden" name="pay_amount[{{ $idx_item }}]"
										   id="pay_amount{{ $idx_item }}" value="{{$pay_amount}}">
									<input type="hidden" name="balance[{{ $idx_item }}]"
										   id="balance{{ $idx_item }}" value="{{$balance}}">
									<input type="hidden" name="remarks[{{ $idx_item }}]"
										   id="remarks{{ $idx_item }}" value="{{ @$outlet_bill->cart->remark }}">
								    <input type="hidden" name="companies[{{ $idx_item }}]"
										   id="companies{{ $idx_item }}" value="{{ $invoice_company }}"
									>
									<input type="hidden" name="department[{{ $idx_item }}]"
   										id="department{{ $idx_item }}" value="{{ $department }}"
   								    >
								    <input type="hidden" name="address[{{ $idx_item }}]"
										   id="address{{ $idx_item }}" value="{{ $address }}"
									>
								</td>
								<td>{{ @$outlet_bill->cart->order_flag }}</td>
								<td>{{ $outlet_bill->cart->nama_pelanggan ?? 'Customer' }}</td>
                                <td>{{ @$outlet_bill->jenis_pembayaran_id ? config('custom.jenis_pembayaran')[@$outlet_bill->jenis_pembayaran_id] : '-' }}</td>
								<td>{{ $invoice_company }}</td>
								<td>{{ $outlet_bill->transaction_date ? date('d-m-Y', strtotime($outlet_bill->transaction_date)) : '-' }}</td>
								<td style="text-align: right">{{ ribuanWithComma($outlet_bill->nominal) }}</td>
								<td style="text-align: right">{{ ribuanWithComma($pay_amount) }}</td>
								<td style="text-align: right">{{ ribuanWithComma($balance) }}</td>
								<td style="text-align: center">
									<button class="btn btn-primary p-2"
											data-target="#modal_invoice_list"
											data-toggle="modal"
											onclick="getInvoiceList('pembayaran_pos_id', {{$outlet_bill->id}}, {{ @$outlet_bill->cart->order_flag }})"
											title="AR Invoice List"
											type="button"
									>
										<!-- <i class="fas fa-print"></i> -->
										<span class="p-1 badge badge-secondary">{{ count($outlet_bill->arInvoiceDetail) }}</span> Invoices
									</button>
								</td>
							</tr>
							@php
							$no++;
							$idx_item++;
							@endphp
						@endif

					@endforeach
					</tbody>
				</table>
			</div>
			<!-- /hover rows -->
		</form>
		<!-- Hover rows -->
	</div>
	<!-- /content area -->

	{{--
	--------------------------------------------------------------
	Modal AR Payment
	--------------------------------------------------------------
	--}}
	<div id="ar_payment_modal" class="modal fade">
		<div class="modal-dialog modal-xl">
			<div class="modal-content">
				<div class="modal-header bg-success" align="center">
					<h6 class="modal-title"><i class="fas fa-clipboard-list mr-1"></i> AR Payment</h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>
				<form action="{{url('account-receivable/store-payment')}}" method="POST" id="form_ar_payment">
					<div class="modal-body" id="body-modal-form">
						@csrf
						<div class="form-group row">
							<label class="col-form-label col-sm-3">Bill Name</label>
							<div class="col-sm-9">
								<input type="text" class="form-control" name="bill_name" id="bill_name" readonly>
							</div>
						</div>

						<div class="form-group row">
							<label for="Remark" class="col-form-label col-sm-3">Remark</label>
							<div class="col-sm-9">
								<span id="remarks" ></span>
								{{-- <textarea name="remarks" id="remarks" rows="5" class="form-control " readonly></textarea> --}}
							</div>
						</div>

						<div id="ar_payments">
							<div class="row">
								<div class="col-lg-3">
									Payment Method:
								</div>
								<div class="col-lg-3">
									Paid Amount:
								</div>
								<div class="col-lg-6">
									Payment Comment:
								</div>
							</div>
							<div class="row mb-2" data-idx="0" id="row_0">
								<div class="col-sm-3">
									<select class="form-control form-control-select2"
											name="pembayaran_ar_id[]"
											id="pembayaran_ar_id0"
											data-idx="0"
											required
									>
										<option value="">** Select Payment Method  **</option>
										@foreach($ar_payment_methods as $ar_payment_method)
										<option value="{{ $ar_payment_method->id }}">{{ $ar_payment_method->nama_metode }}</option>
										@endforeach
									</select>
								</div>
								<div class="col-sm-3">
									<input type="text" class="form-control ar_payment_amount"
										   name="ar_payment_amount[]"
										   id="ar_payment_amount0"
										   data-idx="0"
										   oninput="formatPayment(this)"
										   onchange="countDebtAmount()"
									>
								</div>
								<div class="col-sm-5">
									<input type="text" class="form-control" name="payment_comment[]" id="payment_comment0" data-idx="0">
								</div>
								<div class="col-lg-1">
									<button type="button" onclick="tambahPayment()" class="btn btn-success">
										<i class="fas fa-plus-circle"></i>
									</button>
								</div>
							</div>
						</div>

						{{--
							<div class="form-group row">
								<label class="col-form-label col-sm-3">Payment Method</label>
								<div class="col-sm-9">
									<select class="form-control form-control-select2"
											name="pembayaran_ar_id"
											id="pembayaran_ar_id"
											required
									>
										<option value="">** Select Payment Method  **</option>
										@foreach($ar_payment_methods as $ar_payment_method)
										<option value="{{ $ar_payment_method->id }}">{{ $ar_payment_method->nama_metode }}</option>
										@endforeach
									</select>
								</div>
							</div>
							<div class="form-group row">
								<label class="col-form-label col-sm-3">Paid Amount</label>
								<div class="col-sm-9">
									<input type="text" class="form-control"
										   name="ar_payment_amount" id="ar_payment_amount"
									>
								</div>
							</div>
						--}}

						<div class="form-group row">
							<label class="col-form-label col-sm-3">Debt Amount</label>
							<div class="col-sm-9">
								<input type="hidden" class="form-control" id="total_debt_amount">
								<input type="text" class="form-control" id="preview_debt_amount" disabled>
							</div>
						</div>

						<div class="form-group row">
							<label class="col-form-label col-sm-3">Payment Date</label>
							<div class="col-sm-9">
								<input type="text" class="form-control datepicker_ar"
									   name="payment_date" id="payment_date"
								>
							</div>
						</div>

						{{--
							<div class="form-group row">
								<label for="payment_comment" class="col-form-label col-sm-3">Payment Comment</label>
								<div class="col-sm-9">
									<textarea name="payment_comment" id="payment_comment" rows="5" class="form-control"></textarea>
								</div>
							</div>
						--}}

						<!-- Data Bill Yang Terpilih -->
						<div id="selected_bill">

						</div>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-link text-success" data-dismiss="modal">Close</button>
						<button type="submit" id="submitBtnArPayment" class="btn bg-success">Save</button>
					</div>
				</form>
			</div>
		</div>
	</div>

	<div id="ar_payment_modal_alert" class="modal fade">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-warning" align="center">
					<h6 class="modal-title"><i class="fas fa-clipboard-list mr-1"></i>AR Payment</h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>
                <div class="modal-body" style="text-align: center">
                    <h4>Please select Accounts Receivable first!</h4>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn bg-warning" data-dismiss="modal">Close</button>
                </div>
			</div>
		</div>
	</div>

	{{--
	--------------------------------------------------------------
	Modal AR Transfer
	--------------------------------------------------------------
	--}}
	<div id="ar_transfer_modal" class="modal fade">
		<div class="modal-dialog modal-xl">
			<div class="modal-content">
				<div class="modal-header bg-warning" align="center">
					<h6 class="modal-title"><i class="fas fa-file-export"></i> AR Transfer</h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>
				<form action="{{route('account-receivable.ar-transfer')}}" method="POST">
					<div class="modal-body">
						@csrf
						<!-- Data Bill Yang Terpilih -->
						<table class="table table-bordered table-striped">
							<thead>
								<tr>
									<th>Bill No</th>
									<th>Customer</th>
									<th>Company</th>
									<th>Transaction Date</th>
									<th>Debt Amount</th>
									<th>Current Method</th>
									<th>Transfer To</th>
								</tr>
							</thead>
							<tbody id="selected_transfer_bill">

							</tbody>
						</table>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-link text-warning" data-dismiss="modal">Close</button>
						<button type="submit" class="btn bg-warning submit-ar-transfer" disabled>Transfer Selected Bill</button>
					</div>
				</form>
			</div>
		</div>
	</div>

	{{--
	--------------------------------------------------------------
	Modal Create Invoice AR
	--------------------------------------------------------------
	--}}
	<div id="create_invoice" class="modal fade">
		<div class="modal-dialog modal-lg">
			<div class="modal-content">
				<div class="modal-header bg-primary" align="center">
					<h6 class="modal-title"><i class="fas fa-file-invoice-dollar mr-1"></i> Create Invoice</h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>
				<form action="{{url('account-receivable/create-invoice')}}" method="POST">
					<div class="modal-body">
						@csrf
						<div class="form-group row">
							<label class="col-form-label col-sm-3">No. Invoice</label>
							<div class="col-sm-9">
								<input type="text" class="form-control" name="no_invoice" id="no_invoice" readonly>
							</div>
						</div>
						<div class="form-group row">
							<label class="col-form-label col-sm-3">Name</label>
							<div class="col-sm-9">
								<input type="text" class="form-control" name="name" id="name" readonly>
							</div>
						</div>
						<div class="form-group row">
							<label class="col-form-label col-sm-3">Company</label>
							<div class="col-sm-9">
								<input type="text" class="form-control" name="company" id="company" readonly>
							</div>
						</div>
						<div class="form-group row">
							<label class="col-form-label col-sm-3">Department</label>
							<div class="col-sm-9">
								<input type="text" class="form-control" name="department" id="department" readonly>
							</div>
						</div>
						<div class="form-group row">
							<label class="col-form-label col-sm-3">Address</label>
							<div class="col-sm-9">
								<textarea name="address" rows="3" id="address" class="form-control" readonly></textarea>
							</div>
						</div>
						<div class="form-group row">
							<label class="col-form-label col-sm-3">Due Date</label>
							<div class="col-sm-9">
								<input type="text" class="form-control datepicker_ar" name="due_date" id="due_date">
							</div>
						</div>

						<!-- Daftar Tagihan Yang Dipilih -->
						<table class="table table-striped table-bordered">
							<thead>
								<tr>
									<th>Transaction Date</th>
									<th>Bill No</th>
									<th>Bill Name</th>
									<th style="text-align: right">Amount</th>
								</tr>
							</thead>
							<tbody id="invoice_list">
							</tbody>
							<tfoot>
								<tr>
									<th colspan="3" style="text-align: right">Grandtotal</th>
									<th style="text-align: right" id="grandtotal_invoice">0</th>
								</tr>
							</tfoot>
						</table>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-link text-primary" data-dismiss="modal">Close</button>
						<button type="submit" class="btn bg-primary" id="btn_submit_invoice" disabled>Create</button>
					</div>
				</form>
			</div>
		</div>
	</div>

	{{--
	--------------------------------------------------------------
	Modal AR Invoice List
	--------------------------------------------------------------
	--}}
	<div id="modal_invoice_list" class="modal fade">
		<div class="modal-dialog modal-xl">
			<div class="modal-content">
				<div class="modal-header bg-primary" align="center">
					<h6 class="modal-title"><i class="fas fa-file-invoice-dollar mr-1"></i> Invoice List | <span id="title_bill"></span></h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>
				<div class="modal-body p-0">
					<table class="table table-striped table-bordered">
						<thead>
							<tr>
								<th>No Invoice</th>
								<th>Name</th>
								<th>Company</th>
								<th>Address</th>
								<th>Created</th>
								<th>Due Date</th>
								<th style="text-align: center">Print</th>
							</tr>
						</thead>
						<tbody id="invoice_list_print">
							<tr>
								<td colspan="7" class="text-center">
									Tidak Ada Invoice
								</td>
							</tr>
						</tbody>
					</table>
				</div>
			</div>
		</div>
	</div>


@endsection

@section('js')
	<!-- Theme JS files -->
	<script src="{{asset('global_assets/js/plugins/notifications/pnotify.min.js')}}"></script>
	<script src="{{asset('global_assets/js/plugins/notifications/bootbox.min.js')}}"></script>
	<script src="{{asset('global_assets/js/plugins/tables/datatables/datatables.min.js')}}"></script>
	<script src="{{asset('global_assets/js/plugins/forms/selects/select2.min.js')}}"></script>
	<script src="{{asset('global_assets/js/plugins/buttons/spin.min.js')}}"></script>
	<script src="{{asset('global_assets/js/plugins/buttons/ladda.min.js')}}"></script>
    <script src="{{asset('global_assets/js/plugins/media/fancybox.min.js')}}"></script>
	<script src="{{asset('global_assets/js/plugins/forms/styling/uniform.min.js')}}"></script>
	<script src="{{asset('global_assets/js/plugins/editors/summernote/summernote.min.js')}}"></script>

	<!-- JS Date Picker -->
	<!-- <script src="{{asset('/')}}/global_assets/js/plugins/ui/moment/moment.min.js"></script>
	<script src="{{asset('/')}}/global_assets/js/plugins/pickers/daterangepicker.js"></script>
	<script src="{{asset('/')}}/global_assets/js/plugins/pickers/anytime.min.js"></script>
	<script src="{{asset('/')}}/global_assets/js/plugins/pickers/pickadate/picker.js"></script>
	<script src="{{asset('/')}}/global_assets/js/plugins/pickers/pickadate/picker.date.js"></script>
	<script src="{{asset('/')}}/global_assets/js/plugins/pickers/pickadate/picker.time.js"></script>
	<script src="{{asset('/')}}/global_assets/js/plugins/pickers/pickadate/legacy.js"></script> -->
	<script src="{{asset('/')}}/global_assets/js/plugins/notifications/jgrowl.min.js"></script>
    <script src="{{asset('global_assets/js/plugins/forms/inputs/jquery.mask.js')}}"></script>


	<script src="{{asset('assets/js/app.js')}}"></script>
	<script src="{{asset('global_assets/js/demo_pages/components_modals.js')}}"></script>
	<script src="{{asset('global_assets/js/demo_pages/gallery_library.js')}}"></script>
	<script>

	@if(session('ar_bank_receipt'))
	// console.log('ar_bank_receipt: '+{{ session('ar_bank_receipt') }});
		window.open("{{ url('account-receivable/print-receipt-voucher') }}/"+{{ session('ar_bank_receipt') }}, '_blank');
	@endif

	//DATA TABLE
	var DatatableBasic = function() {

		// Basic Datatable examples
		var _componentDatatableBasic = function() {
			if (!$().DataTable) {
				console.warn('Warning - datatables.min.js is not loaded.');
				return;
			}

			// Setting datatable defaults
			$.extend( $.fn.dataTable.defaults, {
				autoWidth: false,
				columnDefs: [{
					orderable: false,
					targets: [ 0 ]
				}],
				dom: '<"datatable-header"fl><"datatable-scroll"t><"datatable-footer"ip>',
				language: {
					search: '<span>Filter:</span> _INPUT_',
					searchPlaceholder: 'Type to filter...',
					lengthMenu: '<span>Show:</span> _MENU_',
					paginate: { 'first': 'First', 'last': 'Last', 'next': $('html').attr('dir') == 'rtl' ? '&larr;' : '&rarr;', 'previous': $('html').attr('dir') == 'rtl' ? '&rarr;' : '&larr;' }
				}
			});

			// Basic datatable
			$('.datatable-basic').DataTable();

			// Alternative pagination
			$('.datatable-pagination').DataTable({
				pagingType: "simple",
				language: {
					paginate: {'next': $('html').attr('dir') == 'rtl' ? 'Next &larr;' : 'Next &rarr;', 'previous': $('html').attr('dir') == 'rtl' ? '&rarr; Prev' : '&larr; Prev'}
				}
			});

			// Datatable with saving state
			$('.datatable-save-state').DataTable({
				stateSave: true
			});

			// Scrollable datatable
			var table = $('.datatable-scroll-y').DataTable({
				autoWidth: true,
				scrollY: 300
			});

			// Resize scrollable table when sidebar width changes
			$('.sidebar-control').on('click', function() {
				table.columns.adjust().draw();
			});
		};

		// Select2 for length menu styling
		var _componentSelect2 = function() {
			if (!$().select2) {
				console.warn('Warning - select2.min.js is not loaded.');
				return;
			}

			// Initialize
			$('.dataTables_length select').select2({
				// minimumResultsForSearch: Infinity,
				dropdownAutoWidth: true,
				width: 'auto'
			});
		};


		//
		// Return objects assigned to module
		//

		return {
			init: function() {
				_componentDatatableBasic();
				_componentSelect2();
			}
		}
	}();


	// Initialize module
	// ------------------------------

	document.addEventListener('DOMContentLoaded', function() {
		DatatableBasic.init();
	});

	@if(\Session::get('invoice_id'))
	let invoice_id_print = {{ \Session::get('invoice_id') }};
	if(invoice_id_print){
		window.open("{{url('account-receivable/print-invoice')}}/"+invoice_id_print, '_blank');
	}
	@endif

	//Checkbox
	$('[type="checkbox"]').on('click', function(){
		let idx_checkbox = $(this).attr('data-idx');
		let is_checked = $(this).is(':checked');
		let total = parseInt($('#grandtotal_invoice').html().replaceAll(',', ''));
		let total_utang = parseInt($('#total_tagihan').html().replaceAll(',', ''));
        console.log(total_utang)
		let html_bill_list = "";

		// console.log('Total Sebelum: ');
		// console.log(total);
		// console.log('Index checkbox: '+idx_checkbox);
		// console.log(is_checked);

		let transaction_date = $('#bill_date'+idx_checkbox).val();
		let bill_no = $('#no_bill'+idx_checkbox).val();
		let bill_name = $('#nama_pelanggan'+idx_checkbox).val();
		let amount = parseInt($('#debt_amount'+idx_checkbox).val());

		let arrival = $('#arrival'+idx_checkbox).val();
		let departure = $('#departure'+idx_checkbox).val();
		let room_no = $('#room_no'+idx_checkbox).val();
		let voucher_no = $('#voucher'+idx_checkbox).val();
		let balance = parseInt($('#balance'+idx_checkbox).val());

		// console.log('Jumlah centang: ');
		// console.log(amount);

		let pembayaran_id = $('#pembayaran_id'+idx_checkbox).val();
		let booking_deposit_id = $('#booking_deposit_id'+idx_checkbox).val();
		let pembayaran_pos_id = $('#pembayaran_pos_id'+idx_checkbox).val();

		if(is_checked){
			html_bill_list += `
				<tr id="row_bill_list_${idx_checkbox}" class="row_create_invoice">
					<td>
						${ transaction_date }
						<input type="hidden" name="transaction_date[${idx_checkbox}]" value="${transaction_date}" />
					</td>
					<td>
						${ bill_no }
						<input type="hidden" name="bill_no[${idx_checkbox}]" value="${bill_no}" />
					</td>
					<td>
						${ bill_name }
						<input type="hidden" name="bill_name[${idx_checkbox}]" value="${bill_name}" />
					</td>
					<td style="text-align: right">
						${ amount.toLocaleString('ja-JP') }
						<input type="hidden" name="arrival[${idx_checkbox}]" value="${arrival}" />
						<input type="hidden" name="departure[${idx_checkbox}]" value="${departure}" />
						<input type="hidden" name="room_no[${idx_checkbox}]" value="${room_no}" />
						<input type="hidden" name="voucher_no[${idx_checkbox}]" value="${voucher_no}" />

						<input type="hidden" name="debt_amount[${idx_checkbox}]" value="${amount}" />
						<input type="hidden" name="pembayaran_id[${idx_checkbox}]" value="${pembayaran_id}" />
						<input type="hidden" name="booking_deposit_id[${idx_checkbox}]" value="${booking_deposit_id}" />
						<input type="hidden" name="pembayaran_pos_id[${idx_checkbox}]" value="${pembayaran_pos_id}" />
					</td>
				</tr>
			`;

			total += amount;
			total_utang += balance;

			$('#invoice_list').append(html_bill_list);
		}
		else{
			$('#row_bill_list_'+idx_checkbox).remove();
			total -= amount;
			total_utang -= balance;
		}

		console.log(total_utang);

		$('#grandtotal_invoice').html(total.toLocaleString('ja-JP'));
		$('#total_tagihan').html(total_utang.toLocaleString('ja-JP'));
	});

	//Datepicker
	$('.datepicker_ar').daterangepicker({
		singleDatePicker: true,
		startDate: "{{date( 'd-m-Y', strtotime(getSystemDate()) )}}",
		locale: {
			format: 'DD-MM-YYYY'
		}
	});

	//JS Payment
	// $('.ar_payment_amount').on('input', function(){
	// 	$(this).mask("#.##0", {reverse: true});//set separator number
	// })
	function formatPayment(element){
		// $(element).mask("#.##0", {
		// 	reverse: true,
		// 	translation: {
		// 	    '#': {
		// 	      	pattern: /-|\d/,
		// 	      	recursive: true
		// 	    }
		// 	},
		// 	onChange: function(value, e) {
		// 	   e.target.value = value.replace(/(?!^)-/g, '').replace(/^,/, '').replace(/^-,/, '-');
		// 	}
		// });
		// $(element).unmask().mask('###.###.###.###.###.###.###.###', {
        //     reverse: true,
        //     translation: {
        //         '#': {
        //             pattern: /\-|\d/,
        //             recursive: true
        //         }
        //     },
        // });
        // $(element).text($(element).text().replace('-.', '-'));

        let element_value = $(element).val()
        let start = element_value.slice(0,1)
        let check_negative_symbol = element_value.indexOf('-', 1)
        if (check_negative_symbol > -1) {
            $(element).val(start+element_value.slice(1, element_value.length).replace('-','').replace('-',''))
        }

        $(element).val(function(index, value) {
            return value
            .replace(/[^0-9-]/g, "")
            .replace(/\B(?=(\d{3})+(?!\d))/g, ",")
            ;
        });
	}


	// $('.ar_payment_amount').on('change', function(){
	// 	let payments = $('.ar_payment_amount');
	// 	let current_debt_amount = parseInt($('#total_debt_amount').val().replaceAll('.', ''));
	// 	let debt_amount = current_debt_amount;
	//
	// 	console.log(payments);
	//
	// 	// let payment_amount = parseInt($(this).val().replaceAll('.', ''));
	// 	// let debt_amount = current_debt_amount - payment_amount;
	//
	// 	$('#preview_debt_amount').val(debt_amount.toLocaleString('ID'))
	// })
	function countDebtAmount(){
		let payments = $('.ar_payment_amount');
		let current_debt_amount = parseInt($('#total_debt_amount').val().replaceAll(',', ''));
		let debt_amount = current_debt_amount;
		// console.log(payments);
		$.each(payments, function(index, element){
			let payment_amount = $(element).val().replaceAll(',', '') == "" ? 0 : $(element).val().replaceAll(',', '');
			payment_amount = parseInt(payment_amount);
			debt_amount -= payment_amount;
		});

		$('#preview_debt_amount').val(debt_amount.toLocaleString('ja-JP'));
	}


	let new_idx_payment = 1;
	// IDX Payment
	function tambahPayment(){
		let html = `
					<div class="row mb-2" data-idx="${new_idx_payment}" id="row_${new_idx_payment}">
						<div class="col-sm-3">
							<select class="form-control form-control-select2"
									name="pembayaran_ar_id[]"
									id="pembayaran_ar_id${new_idx_payment}"
									data-idx="${new_idx_payment}"
									required
							>
								<option value="">** Select Payment Method  **</option>
								@foreach($ar_payment_methods as $ar_payment_method)
								<option value="{{ $ar_payment_method->id }}">{{ $ar_payment_method->nama_metode }}</option>
								@endforeach
							</select>
						</div>
						<div class="col-sm-3">
							<input type="text" class="form-control ar_payment_amount"
								   name="ar_payment_amount[]"
								   id="ar_payment_amount${new_idx_payment}"
								   data-idx="${new_idx_payment}"
								   oninput="formatPayment(this)"
								   onchange="countDebtAmount()"
							>
						</div>
						<div class="col-sm-5">
							<input type="text" class="form-control" name="payment_comment[]" id="payment_comment${new_idx_payment}" data-idx="${new_idx_payment}">
						</div>
						<div class="col-lg-1">
							<button type="button" onclick="removePayment(${new_idx_payment})" class="btn btn-danger">
								<i class="fas fa-times-circle"></i>
							</button>
						</div>
					</div>
				   `;
					new_idx_payment++;
		$('#ar_payments').append(html);
	    $('.form-control-select2').select2();
	}

	function removePayment(id){
		$('#row_'+id).remove();
		countDebtAmount();
	}

	// Button AR Payment
	$('#btn_ar_payment').on('click', function(){
		let checkbox_selected = $('[type="checkbox"]:checked');
		let ar_payment_amount = 0;
		let bill_name = "";
        // let remarks = "-";
		let remarks = "";
		let html_selected_bill = "";

		// console.log(checkbox_selected);
        let count_selected_e = 0;
		$.each(checkbox_selected, function(idx, element){
            count_selected_e++;
			let idx_element = $(element).attr('data-idx');

			let pembayaran_id = $('#pembayaran_id'+idx_element).val();
			let booking_deposit_id = $('#booking_deposit_id'+idx_element).val();
			let pembayaran_pos_id = $('#pembayaran_pos_id'+idx_element).val();

			let no_bill = $('#no_bill'+idx_element).val();
			let debt_amount = parseInt($('#debt_amount'+idx_element).val());
			let pay_amount = parseInt($('#pay_amount'+idx_element).val());
			let balance = parseInt($('#balance'+idx_element).val());

			//Assign Value Di Form Modal
			ar_payment_amount += balance;

			//Index 0
			if(idx == 0){
				bill_name = $('#nama_pelanggan'+idx_element).val();
				remarks = $('#remarks'+idx_element).val() == "" ? "-" : $('#remarks'+idx_element).val();
				// console.log('remarks:'+remarks);
			}

			// HTML Selected Bill
			html_selected_bill += `<input type="hidden" name="pembayaran_id[${idx}]"
										   id="pembayaran_id${idx}" value="${pembayaran_id}">
								   <input type="hidden" name="booking_deposit_id[${idx}]"
										   id="booking_deposit_id${idx}" value="${booking_deposit_id}">
								   <input type="hidden" name="pembayaran_pos_id[${idx}]"
										   id="pembayaran_pos_id${idx}" value="${pembayaran_pos_id}">

								   <input type="hidden" name="no_bill[${idx}]"
   									   id="no_bill${idx}" value="${no_bill}">
								   <input type="hidden" name="debt_amount[${idx}]"
   									   id="debt_amount${idx}" value="${debt_amount}">
	   							   <input type="hidden" name="pay_amount[${idx}]"
	   								   id="pay_amount${idx}" value="${pay_amount}">
	   							   <input type="hidden" name="balance[${idx}]"
	   								   id="balance${idx}" value="${balance}"> <br />`;
		});

		$('#ar_payment_amount0').val('0');
		$('#total_debt_amount').val(ar_payment_amount.toLocaleString('ja-JP'));
		$('#preview_debt_amount').val(ar_payment_amount.toLocaleString('ja-JP'));

		$('#bill_name').val(bill_name);
		$('#remarks').html(remarks);

		$('#selected_bill').html(html_selected_bill);

        // IF NO SELECTED
        if (count_selected_e < 1) {
            $('#ar_payment_modal_alert').modal('show')
        }else{
            $('#ar_payment_modal').modal('show')
        }
	});

	//Button AR Transfer
	$('#btn_ar_transfer').on('click', function(){
		let checkbox_selected = $('[type="checkbox"]:checked');
		let current_method_payment = "{{ $_GET['payment_method'] ?? ''  }}";
		let current_method_payment_txt = $('#payment_method').find('option[value="'+current_method_payment+'"]').html();
		let html_selected_bill = "";

		console.log(current_method_payment_txt);

		$.each(checkbox_selected, function(idx, element){
			let idx_element = $(element).attr('data-idx');

			let pembayaran_id = $('#pembayaran_id'+idx_element).val();
			let booking_deposit_id = $('#booking_deposit_id'+idx_element).val();
			let pembayaran_pos_id = $('#pembayaran_pos_id'+idx_element).val();

			let no_bill = $('#no_bill'+idx_element).val();
			let debt_amount = parseInt($('#debt_amount'+idx_element).val());
			// let pay_amount = parseInt($('#pay_amount'+idx_element).val());
			// let balance = parseInt($('#balance'+idx_element).val());
			let nama_pelanggan = $('#nama_pelanggan'+idx_element).val();
			let company_name = $('#companies'+idx_element).val();
			let transaction_date = $('#bill_date'+idx_element).val();

			// HTML Selected Bill
			html_selected_bill += `<tr>
					   					<td>
											<input type="hidden" name="pembayaran_id[${idx_element}]"
												   id="pembayaran_id${idx_element}" value="${pembayaran_id}">
										    <input type="hidden" name="booking_deposit_id[${idx_element}]"
												   id="booking_deposit_id${idx_element}" value="${booking_deposit_id}">
										    <input type="hidden" name="pembayaran_pos_id[${idx_element}]"
												   id="pembayaran_pos_id${idx_element}" value="${pembayaran_pos_id}">
											${no_bill}
										</td>
					   					<td>${nama_pelanggan}</td>
					   					<td>${company_name}</td>
					   					<td>${transaction_date}</td>
					   					<td>${debt_amount}</td>
					   					<td>${current_method_payment_txt}</td>
					   					<td>
					   						<select class="form-control form-control-select2"
					   								name="transfer_method_id[${idx_element}]"
					   								id="transfer_method_id${idx_element}"
					   								required
					   						>
					   							<option value="">** Select Payment Method  **</option>
												<!-- Angka 1 atau 2 di depan untuk flagging antara metode pembayaran atau jenis pembayaran-->
												@foreach($all_payment_methods as $payment_method)
												<option value="1_{{ $payment_method->id }}"
														{{ isset($_GET['payment_method']) ? ($_GET['payment_method'] == '1_'.$payment_method->id ? 'selected' : '') : '' }}
												>
													{{ $payment_method->nama }}
												</option>
												@endforeach

												@foreach(config('custom.segment_ratecodes') as $key => $segment_ratecode)
													@if(in_array($key, [2,3,4,5,6,8,9,14]))
													<option value="3_{{ $key }}"
															{{ isset($_GET['payment_method']) ? ($_GET['payment_method'] == '3_'.$key ? 'selected' : '') : '' }}
													>
														{{ $segment_ratecode }}
													</option>
													@endif
												@endforeach
					   						</select>
					   					</td>
						   		  </tr>`;
		});

		$('#selected_transfer_bill').html(html_selected_bill);

        if (html_selected_bill != '') {
            $('.submit-ar-transfer').removeAttr('disabled')
        }else{
            $('.submit-ar-transfer').attr('disabled', 'disabled')
        }

		$('.form-control-select2').select2({
			// minimumResultsForSearch: Infinity,
			dropdownAutoWidth: true,
			width: 'auto'
		});
	});

	// Javascript Untuk Checked Checkbox
	let jumlah_checked = 0;
	$('[type="checkbox"]').on('click', function(){
		let id = $(this).attr('id');
		let checked = $("#"+id+":checked").length > 0;
		if(checked){
			$("#row_"+id).find('[type="hidden"]').removeAttr('disabled');
		}
		else{
			$("#row_"+id).find('[type="hidden"]').attr('disabled', 'disabled');
		}
	});

	//Memunculkan Debit Berdasarkan Payment Method
	// function onchangePaymentMethod(){
	// 	let newRequest = window.location.search;
    //     let params = new URLSearchParams(newRequest);
	// 	params.delete('payment_method');
    //     params.append('payment_method', document.getElementById("payment_method").value);
    //     document.location.href = "?" + params.toString();
	// }

	//JS CREATE Invoice
	function getInvoiceNumberRealtime(){
		$.ajax({
			type: 'GET',
			url: "{{url('account-receivable/invoice-number-realtime')}}",
			success: function(data){
				$('#no_invoice').val(data);
				// $('#btn_submit_invoice').removeAttr('disabled');

                let check_invoice_list = $('#invoice_list').children(".row_create_invoice").length;

                if (check_invoice_list > 0) {
                    $('#btn_submit_invoice').removeAttr('disabled')
                }else[
                    $('#btn_submit_invoice').attr('disabled', 'disabled')
                ]

				console.log(data);
			}
		});
	}

	//BTN Create Invoice
	$('#btn_create_invoice').on('click', function(){
		$('#btn_submit_invoice').attr('disabled', 'disabled');

		let checkbox_selected = $('[type="checkbox"]:checked');
		let name = "";
		let company = "";
		let department = "";
		let address = "";
		let html_bill_list = "";
		// let total = 0;

		// console.log('Selected checkbox');
		// console.log(checkbox_selected);
		if(checkbox_selected.length > 0){
			$.each(checkbox_selected, function(idx, element){
				//IDX Element
				let idx_element = $(element).attr('data-idx');
				if(idx == 0){
					name = $('#nama_pelanggan'+idx_element).val();
					company = $('#companies'+idx_element).val();
					department = $('#department'+idx_element).val();
					address = $('#address'+idx_element).val();
				}

				// let transaction_date = $('#bill_date'+idx_element).val();
				// let bill_no = $('#no_bill'+idx_element).val();
				// let bill_name = $('#nama_pelanggan'+idx_element).val();
				// let amount = parseInt($('#debt_amount'+idx_element).val());
				//
				// let pembayaran_id = $('#pembayaran_id'+idx_element).val();
				// let booking_deposit_id = $('#booking_deposit_id'+idx_element).val();
				// let pembayaran_pos_id = $('#pembayaran_pos_id'+idx_element).val();
				//
				// total += amount;
				//
				// html_bill_list += `
				// 	<tr>
				// 		<td>
				// 			${ transaction_date }
				// 			<input type="hidden" name="transaction_date[${idx}]" value="${transaction_date}" />
				// 		</td>
				// 		<td>
				// 			${ bill_no }
				// 			<input type="hidden" name="bill_no[${idx}]" value="${bill_no}" />
				// 		</td>
				// 		<td>
				// 			${ bill_name }
				// 			<input type="hidden" name="bill_name[${idx}]" value="${bill_name}" />
				// 		</td>
				// 		<td style="text-align: right">
				// 			${ amount.toLocaleString('ID') }
				// 			<input type="hidden" name="debt_amount[${idx}]" value="${amount}" />
				// 			<input type="hidden" name="pembayaran_id[${idx}]" value="${pembayaran_id}" />
				// 			<input type="hidden" name="booking_deposit_id[${idx}]" value="${booking_deposit_id}" />
				// 			<input type="hidden" name="pembayaran_pos_id[${idx}]" value="${pembayaran_pos_id}" />
				// 		</td>
				// 	</tr>
				// `
			});
		}

		$('#name').val(name);
		$('#company').val(company);
		$('#department').val(department);
		$('#address').val(address);
		// $('#invoice_list').html(html_bill_list);
		// $('#grandtotal_invoice').html(total.toLocaleString('ID'));
		getInvoiceNumberRealtime();
	});
	</script>

	<script type="text/javascript">
		function getInvoiceList(fieldname, id, no_bill){
			$('#title_bill').html('').html(no_bill);
			let url = "{{url('account-receivable/invoice-list')}}?"+fieldname+"="+id;
			$.ajax({
				type: 'GET',
				url: url,
				success: function(response){
					console.log(url);
					let html_invoice_list = "";

					if(response.length > 0){
						$.each(response, function(idx, data){
							html_invoice_list += `<tr>
													<td>${data.no_invoice}</td>
													<td>${data.name}</td>
													<td>${data.company}</td>
													<td>${data.address}</td>
													<td>${moment(data.created_date, "YYYY-MM-DD").format('DD-MM-YYYY')}</td>
													<td>${moment(data.due_date, "YYYY-MM-DD").format('DD-MM-YYYY')}</td>
													<td class="text-center">
														<a href="{{url('account-receivable/print-invoice')}}/${data.id}" target="_blank" class="btn btn-primary"><i class="fas fa-print"></i> Print Invoice</a>
													</td>
												</tr>`;
						});
					}
					else{
						html_invoice_list += `<tr>
												<td colspan="7" style="text-align: center">
													Tidak Ada Invoice
												</td>
											</tr>`;
					}

					$('#invoice_list_print').html(html_invoice_list);
				}
			});
		}
	</script>

	<script type="text/javascript">
		$( document ).ready(function() {

			// Control editor height
			$('.summernote-height-small').summernote({
				height: 150
			});

	        // Default style
	        @if(session('error'))
	            new PNotify({
	                title: 'Error',
	                text: '{{ session('error') }}.',
	                icon: 'icon-blocked',
	                type: 'error'
	            });
            @endif
            @if ( session('success'))
	            new PNotify({
	                title: 'Success',
	                text: '{{ session('success') }}.',
	                icon: 'icon-checkmark3',
	                type: 'success'
	            });
            @endif

		});

        $('#form_ar_payment').on('submit', function(e){
            $('#submitBtnArPayment').attr('disabled', true)
            var empty = false;
            $('#form_ar_payment').find('[required]').each(function() {
                if ($(this).val() == '') {
                    empty = true;
                }
            });

            console.log(empty)
            if (empty) {
                e.preventDefault();
                $("#submitBtnArPayment").attr("disabled", false);
                return false;
            } else {
                return true;
            }
        })
	</script>


<script>
	var DateTimePickers = function() {

		// Daterange picker
		var _componentDaterange = function() {
			if (!$().daterangepicker) {
				console.warn('Warning - daterangepicker.js is not loaded.');
				return;
			}

			// Basic initialization
			$('.daterange-basic').daterangepicker({
				applyClass: 'btn-primary',
				cancelClass: 'btn-light'
			});

			// Single picker
			$('.daterange-single').daterangepicker({
				singleDatePicker: true,
				locale: {
					format: 'YYYY-MM-DD'
				}
			});

		};

		return {
			init: function() {
				_componentDaterange();
			}
		}
	}();

	document.addEventListener('DOMContentLoaded', function() {
		DateTimePickers.init();
	});

    $('#payment_date_filter').daterangepicker({
        startDate: "{{ $startdate_filter }}",
        endDate:  "{{ $enddate_filter }}",
        applyClass: 'btn-primary',
        cancelClass: 'btn-light',
        locale: {
            format: 'DD-MM-YYYY'
        }
    });
</script>
@endsection