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

@section('title', 'Floorview')

@section('css')
<style type="text/css">
	.datatable-column-width{
		overflow: hidden; text-overflow: ellipsis; max-width: 200px;
	}
	/* .link-status{
		position:absolute; right: 5px;
	} */

    .table-reservation-deposit-info tr th{
        width: 150px;
        height: 30px;
    }

	.longstay{
		background-color: #04d31b45;
	}

    .dayuse{
        background-color: yellow;
    }
    .canceled{
        background-color: #ff000054;
    }
    .select2-results__options:not(#select2-segmentation-results, #select2-checkout_pembayaran_segment-results, #select2-dayUse_pembayaran_segment-results) .select2-results__option[aria-disabled=true]{
        background-color: darkgray;
        color: white;
        display:none;
    }

    .scroll-vertical{
        display: block;
        overflow-y: scroll;
    }

    /* .headcol{
        position: absolute;
        line-height: 16px;
    }
    .headcol:before{
        content: Row;
    } */

    .table-sticky{
        width: 100%;
    }

    #table_room_availibility{

    }

    .outer {
        width: 100%;
        margin: auto;
    }

    .inner {
        position: relative;
        overflow: auto;
        height: 650px;
        white-space: nowrap;
    }

    .headcol {
        position: sticky;
        position: -webkit-sticky;
        background-color: white;
        width: 100px;
        min-width: 100px;
        max-width: 100px;
        border: 1px solid #ddd;
    }

    .position-room-no{
        left: 0px;
        z-index: 100;
    }

    .position-empty{
        left: 0px;
        top: 0px;
        z-index: 200;
    }

    .position-month {
        top: 0px;
        z-index: 100;
    }

    .position-day {
        top:45px;
        z-index: 100;
    }

    .bodycol{
        width: 100px;
        z-index:-100;
    }
    .box {
        float: left;
        width: 15px;
        height: 15px;
        margin: 5px;
    }
</style>
@endsection

@section('content')
    <div class="roomview">
    @php
        $hotel_id = hotelID();
        $hotel_only     = in_array(propertiTipe(), [1]);
        $hotel_n_budget = in_array(propertiTipe(), [1,2]);
        $all            = in_array(propertiTipe(), [1,2,3]);
    @endphp

	<!-- 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">Floorview</span> - {{\Session::get('hotel_name') ?? \Auth::user()->hotel->nama}}</h4>
				<a href="#" class="header-elements-toggle text-default d-md-none"><i class="icon-more"></i></a>
			</div>

			@if(\Auth::user()->role != 10)
			<div class="form-inline">
				<form action="{{route('close-shift-fo')}}" id="form_close_shift" target="_blank" method="post">
					@csrf
					<!-- <input type="hidden" name="shift_id_fo" id="shift_id_fo" value="{{\Session::get('shift_id')}}"> -->
					<button type="submit" class="btn btn-danger">Create Closing Report - <span class="font-weight-bold">Shift {{ @currentShiftFo()->shift }}</span></button>
				</form>

				{{--
					@if(\Session::get('shift'))
					<form action="{{route('close-shift-fo')}}" id="form_close_shift" target="_blank" method="post">
						@csrf
						<input type="hidden" name="shift_id_fo" id="shift_id_fo" value="{{\Session::get('shift_id')}}">
						<button type="submit" onclick="reloadPage()" class="btn btn-danger">Close Shift {{\Session::get('shift')}}</button>
					</form>
					@else
					<form action="{{route('open-shift-fo')}}" method="post">
						@csrf
						<select name="shift_id_fo" id="shift_id_fo" class="form-control" required>
							<option value="">** Pilih Shift **</option>
							@foreach(config('custom.shift_pos') as $key=>$val)
							<option value="{{$key}}" {{$key == \Session::get('shift') ? 'selected' : ''}}>{{$val}}</option>
							@endforeach
						</select>
						&nbsp;
						<button type="submit" class="btn btn-primary">Open Shift</button>
					</form>
					@endif
				--}}
			</div>
			@endif
		</div>
	</div>
	<!-- /page header -->

    <!-- Content area -->
	<div class="content">
        @if (session('error_alert'))
            <div class="alert alert-danger alert-styled-left alert-dismissible">
                <button type="button" class="close" data-dismiss="alert"><span>&times;</span></button>
                {{ session('error_alert') }}
            </div>
        @endif

        <div style="margin-bottom: 8px; display: flex; justify-content: space-between; gap: 8px;">
            <div style="display: flex; align-items: center; gap: 8px;">
                @if (strtotime(date('Y-m-d')) > strtotime(getSystemDate()))
                    <span class="text-danger" style="font-size:18px">System date not updated as real time date, please run audit! <a href="{{url('/running-audit')}}"><i class="icon-new-tab"></i></a> </span>
                @endif
            </div>
            <div style="display: flex; align-items: center; gap: 8px;">
                <a href="{{url('timeline')}}">
                    <button class="btn btn-primary" type="button"><i class="icon-new-tab"></i>&nbsp; Calendar View</button>
                </a>
            </div>
        </div>

		<div class="row">
			<div class="col-md-3">
				<!-- Hover rows -->
				<div class="card p-0">

                    <div class="row p-2" style="white-space:nowrap;" title="color">
                        <div class="col-sm-2">
                            &nbsp;
                        </div>
                        <div class="col-sm-4">
                            <span class="box longstay"></span>
                            <div style="padding-top:2px;">: Longstay</div>
                        </div>
                        <div class="col-sm-4">
                            <span class="box dayuse"></span>
                            <div style="padding-top:2px;">: Dayuse</div>
                        </div>
                        {{-- <div class="col-sm-4">
                            <span class="box canceled"></span>
                            <div style="padding-top:2px;">: Cancel</div>
                        </div> --}}
                    </div>

					<div class="card-header p-1">
						<div class="row">
							@if(\Auth::user()->role == 10)
							<div class="col-12 py-0 mb-1">
								<select name="filterby" id="filter_by" class="form-control form-control-select2">
									<option value="0">** Select Filter **</option>
									<option value="4">Expected Arrival</option>
									<option value="5">Expected Departure</option>
									<option value="2">Departure</option>
									<option value="1">Inhouse</option>
								</select>
							</div>
							<div class="col-12 has-feedback text-right mb-1">
								<input type="text" id="tanggal" name="tanggal" class="form-control daterange-filter">
								<i class="far fa-calendar-alt form-control-feedback" style="right: 10px"></i>
							</div>
							@else
							<div class="col-12 py-0 mb-1">
								<select name="filterby" id="filter_by" class="form-control form-control-select2">
									<option value="0">** Select Filter **</option>
									<option value="4">Expected Arrival</option>
                                    <option value="5">Expected Departure</option>
									<option value="2">Departure</option>
									<option value="1">Inhouse</option>
								</select>
							</div>
							<div class="col-12 has-feedback text-right mb-1">
								<input type="text" id="tanggal" name="tanggal" class="form-control daterange-filter">
								<i class="far fa-calendar-alt form-control-feedback" style="right: 10px"></i>
							</div>
							@endif
						</div>
						<div class="row mt-2">
							<div class="col">
								<a id="linkroomview" href="{{url('/roomviewexcel')}}" class="btn btn-success" data-popup="tooltip" data-placement="top" data-original-title="Export" style="width: 100%"><i class="icon-file-excel"></i></a>
							</div>
							<div class="col">
								<a href="{{url('/roomview')}}" class="btn bg-grey" data-popup="tooltip" data-placement="top" data-original-title="Refresh" style="width: 100%"><i class="icon-rotate-ccw3"></i></a>
							</div>
						</div>

						<div class="mt-2" id="container-count">
							<div class="row col-lg-12" id="container-expected_arrival">
								<div class="col-lg-6">
									Expected Arrival
								</div>
								<div class="col-lg-6">
									: <span id="#expected_arrival">{{ $expected_arrival }}</span>
								</div>
							</div>

                            <div class="row col-lg-12" id="container-expected_departure">
								<div class="col-lg-6">
									Expected Departure
								</div>
								<div class="col-lg-6">
									: <span id="#expected_departure">{{ $expected_departure }}</span>
								</div>
							</div>

							<div class="row mt-1 col-lg-12" id="container-departure">
								<div class="col-lg-6">
									Departure
								</div>
								<div class="col-lg-6">
									: <span id="departure">{{ $departure }}</span>
								</div>
							</div>

							<div class="row mt-1 col-lg-12" id="container-in_house">
								<div class="col-lg-6">
									In House
								</div>
								<div class="col-lg-6">
									: <span id="in_house">{{ $in_house }}</span>
								</div>
							</div>
						</div>

						<div class="row mt-2 px-0">
							<div class="col-12">
                                <div class="input-group">
                                    <input type="text" name="search_nama" id="search_nama" class="form-control" placeholder="Search Name/Reservation No./Group ...">
                                    {{-- not used since 17 may 2022 --}}
									{{-- <span class="input-group-append">
                                        <div class="input-group-text">
                                            <span style="padding-right: 5px">By booker:</span><input type="checkbox" id="checkbox_group_name" value="0" aria-label="Checkbox for group name">
                                        </div>
                                    </span> --}}
                                </div>
							</div>
						</div>
					</div>
					<div id="list_booking" class="card-body list-group list-group-bordered" style="height: 750px; overflow-y: scroll; overflow-x:hidden">
					@if(false)
							@if($booking_details)
								@foreach($booking_details as $idx => $detail)
                                @if ($detail->array_sub == 0 || $detail->array_sub_extend_stay == 0)

                                @if ($detail->extend_stay === 0)
                                    @continue
                                @endif

                                @php
                                    // Global Variable This Invoice
                                    $bill_room = $detail->altInvoice($detail->room_index)->first();

                                    $color_card = '';
                                    // ambil class css
                                    if ($detail->status_booking == 13) {
                                        $color_card = 'canceled';
                                    }else{
                                        if ( $detail->jumlah_malam > 7) {
                                            $color_card = 'longstay';
                                        }elseif ( $detail->jumlah_malam < 1) {
                                            $color_card = 'dayuse';
                                        }
                                    }

                                    if (@$detail->booking->status_ota) {
                                        $color_card = 'canceled';
                                    }
                                @endphp
                                @php
                                    $balance_total = getTotalTagihan($detail->booking_id, $detail->room_index, $detail->nomor_kamar, 'checkout');
                                    $balance_total_dayuse = getTotalTagihan($detail->booking_id, $detail->room_index, $detail->nomor_kamar, 'dayuse');
                                @endphp
								<div class="list-group-item list-group-item-action d-flex justify-content-between {{ $color_card }}">
									<div>
										<span class="font-weight-bold">
											{!! date('m-d', strtotime(@$detail->booking->guest->birth_date))  == date('m-d', strtotime(getSystemDate())) ? '<i class="fas fa-birthday-cake"></i>' : '' !!}
                                            {!! $detail->incognito == 1 ? '<i class="fas fa-user-secret"></i>' : '' !!}
                                            {!! @$detail->booking->reservationDeposit->count() > 0 && @$detail->booking->checkStatusReservation->count() < 1 && $detail->status_booking == 4 && @$detail->room_index == 1 ? '<i class="icon-cash"></i>' : '' !!}
                                            <a href="{{url('bookings').'/'.@$detail->booking->id.'/edit'}}">{{$detail->guest_room ? $detail->guest_room : @$detail->booking->nama}}</a>
                                            {!! $detail->incognito == 1 ? '(Incognito)' : '' !!}

                                            {{-- add segmentasi --}}
                                            <span class="font-weight-semibold"> - {{ !in_array(@$detail->booking->segmentasi_rate_code, [2,3,4,5,6,8,9]) ? config('custom.segment_ratecodes')[@$detail->booking->segmentasi_rate_code] : @$detail->booking->company->name }} <a href="#" onclick="showStatsGroup('{{$detail->booking->group_name}}')">{{@$detail->booking->group_name ? '('.@$detail->booking->group_name.')' : ''}}</a> </span>

                                            <a href="#"
                                                class="text-info btn-tooltip"
                                                onclick="showModalDetailReservation({{$detail->booking_id}}, {{$detail->id}})"
                                                title="Detail Reservation"><i class="icon icon-info22"></i>
                                            </a>

                                            @if (@$detail->booking->status_ota)
                                            <i class="icon-alert text-danger btn-tooltip"  title="Cancelled reservation from OTA"></i>
                                            @endif

											@if($detail->status_booking != 1 && $detail->status_booking != 2)
											{!! @$detail->expected_arrival != "" ? '&nbsp;<span class="badge badge-danger font-weight-bold">Expected arrival: '.@$detail->expected_arrival->format('H:i:s').'</span>' : '' !!}
											@endif
										</span>
										<br>

                                        @php
                                            $checkin = '';
                                            $checkout = '';

                                            // check day use or not
                                            if (@$detail->checkin && @$detail->checkout) {
                                                $checkin = formatDateAwal($detail->checkin);
                                                $checkout = formatDateAwal($detail->checkout);
                                            } else {
                                                $checkin = formatDateAwal($detail->start_date);
                                                $checkout = formatDateAwal($detail->end_date);
                                            }
                                        @endphp

										<span class="">{{ $detail->booking->kode_booking }}</span> <span class="text-dark">({{ config('custom.source')[@$detail->booking->source] }})</span> <br>
										<span class="">{{ $detail->booking->getCurrentRoom($detail->booking_id, $detail->room_index) }} - {{$detail->jns_kamar}} ({{ @$detail->pax }} Pax)</span>
										@if ($detail->block_kamar == 1)
											<i class="icon-lock text-danger"></i>
										@endif
										<br>
                                        <span class="text-success"><i class="icon-enter2"></i>&nbsp;{{ formatDate($checkin, "d-m-Y") }} - </span>
                                        <span class="text-danger"><i class="icon-exit2"></i>&nbsp;{{ formatDate($checkout, "d-m-Y") }}</span> <br>
										<span
										>
                                        <span class="mr-1 {{config('custom.status_booking_color')[$detail->status_booking]}} font-weight-bold" >
											@if(in_array(1, [$detail->status_booking]))
                                                In House
											@else
												{{@config('custom.status_booking')[$detail->status_booking]}}
											@endif
                                        </span>

											{{-- &nbsp; --}}
												@php
													$balance_total = getTotalTagihan($detail->booking_id, $detail->room_index, $detail->nomor_kamar, 'totalroom');
													// $balance_total = 0;
												@endphp
												{!! '<span class="badge badge-secondary">Rp '.ribuanWithComma($balance_total).'</span>' !!}

                                                {{-- Arrangement --}}
                                                @if ($detail->arrangement_codes)
                                                    <span class="badge badge-info">{{ $detail->arrangement_codes }}</span>
                                                @endif
										</span>
									</div>

									<div class="dropdown">
										<a href="#" data-toggle="dropdown">
											<i class="icon-more"></i>
										</a>

										<div class="dropdown-menu dropdown-menu-right">
											@foreach(config('custom.status_booking') as $key => $val)
												@if ($detail->nomor_kamar == NULL)
                                                    @if ($detail->status_booking == 13)
                                                        @if(in_array($key, [4]))
                                                            <a href="#/" onclick="updateStatus({{$detail->booking->hotel_id}}, {{$detail->booking->id}}, {{$key}}, {{$detail->id}})"
                                                                class="dropdown-item"
                                                                >{{$val}}</a>
                                                        @endif
                                                    @else
                                                        @if(!in_array($key, [5,9,10,11,12,2]))
                                                            @if ($key == 13)
                                                                @if (\Auth::user()->permission_change_reserv == 0)
                                                                <a href="#/"
                                                                    data-toggle="modal"
                                                                    data-target="#modal_status_confirm_cancel"
                                                                    data-id_booking="{{@$detail->booking->id}}"
                                                                    data-hotel_id="{{@$detail->booking->hotel_id}}"
                                                                    data-detail_id="{{@$detail->id}}"
                                                                    class="dropdown-item {{$key == $detail->status_booking ? 'active' : ''}} statusbutton"
                                                                    style="{{$key == $detail->status_booking ? 'display: none' : ''}}"
                                                                    {{$key == $detail->status_booking ? 'disabled' : ''}}
                                                                    disabled>
                                                                    Cancel Reservation
                                                                </a>
                                                                @endif
                                                                @continue
                                                            @endif

                                                            <a href="#"
                                                                onclick="alertStatus({{$detail->booking->id}}, '{{$detail->jns_kamar}}',  {{$detail->array_index}})"
                                                                style="{{$key == $detail->status_booking ? 'display: none' : ''}}"
                                                                class="dropdown-item {{$key != $detail->status_booking ? 'bg-warning' : ''}}"
                                                                {{-- data-target="#alertStatusModal"
                                                                data-toggle="modal" --}}
                                                            >
                                                                Checkin
                                                            </a>
                                                        @endif
                                                    @endif
												@else
													@foreach ( $allKamars as $kamar)
														@if ($detail->nomor_kamar == $kamar->no_kamar)
															@if ($kamar->status)
																@if(!in_array($key, [5,9,10,11,12]))
                                                                    {{-- check in --}}
																	@if ($detail->status_booking == 1)

																		{{-- cek apa ada invoice, jika ada hitung balance invoice - pembayaran --}}
																		{{-- pembayaran bisa multiple --}}
																		@if ($detail)
																			@php
                                                                                // if i disable after run audit just checked out only not full.
                                                                                $balance_total_all = getTotalTagihan($detail->booking_id, $detail->room_index, $detail->nomor_kamar, 'totalroom');
                                                                                $balance_total = getTotalTagihan($detail->booking_id, $detail->room_index, $detail->nomor_kamar, 'checkout');
                                                                                $balance_total_dayuse = getTotalTagihan($detail->booking_id, $detail->room_index, $detail->nomor_kamar, 'dayuse');
																			@endphp

																			{{-- jika balance tidak 0, tidak bisa checkout --}}
																			@if ($key == 2)

																				@if ($balance_total < 0 || $balance_total_dayuse < 0)
																					<a href="#checkout_refundmodal"
																						id="btn_checkout_refundmodal"
																						class="btn-tooltip btn_checkout_refundmodal dropdown-item"
																						data-target="#checkout_refundmodal"
																						data-toggle="modal"
																						onclick="ClickBtnRefundCheckout({{@$detail->booking->id}},{{$balance_total}},'{{$detail->booking->nama}}', {{ $detail->booking->id }}, {{$detail->room_index}})"
																						title="Refund">
																							<i class="text-orange fas fa-receipt"></i>
																							Checkout + Refund
                                                                                    </a>

																					@if ($balance_total_dayuse < 0 && date('Y-m-d', strtotime($detail->start_date)) == getSystemDate())
																						{{-- day use refund --}}
																						<a 	data-target="#dayUse_refundModal"
																							data-toggle="modal"
																							class="btn-tooltip dropdown-item"
																							onclick="ClickBtnRefundDayUse({{@$detail->booking->id}},{{$balance_total_dayuse}},'{{$detail->booking->nama}}', {{ $detail->booking->id }}, {{$detail->room_index}})"
																							title="Day Use (Refund)"
																						>
																							<i class="text-orange fas fa-receipt"></i>
																							Day Use + Refund
																						</a>
																					@endif

                                                                                    @if ($balance_total_all == 0)
                                                                                        <a href="#checkout_pembayaranmodal"
                                                                                            id="btn_checkout_pembayaranmodal"
                                                                                            class="btn-tooltip btn_checkout_pembayaranmodal dropdown-item"
                                                                                            data-target="#checkout_pembayaranmodal"
                                                                                            data-toggle="modal"
                                                                                            onclick="ClickBtnPembayaranCheckout({{$detail->booking->id}},{{$balance_total}},'{{$detail->booking->nama}}', {{$detail->booking->id}}, {{$detail->room_index}}, true)"
                                                                                            title="Payment">
                                                                                                <i class="text-grey fas fa-wallet"></i>
                                                                                                {{-- Checkout + Pelunasan --}}
                                                                                                Checkout + Preview
                                                                                        </a>
                                                                                        @if ($balance_total_all == 0 && date('Y-m-d', strtotime($detail->start_date)) == getSystemDate())
                                                                                            {{-- day use pelunasan --}}
                                                                                            <a data-target="#dayUse_pembayaranModal"
                                                                                                data-toggle="modal"
                                                                                                class="btn-tooltip dropdown-item"
                                                                                                onclick="ClickBtnPembayaranDayUse({{$detail->booking->id}},{{$balance_total_dayuse}},'{{$detail->booking->nama}}', {{$detail->booking->id}}, {{$detail->room_index}}, true)"
                                                                                                title="Day Use (Payment)"
                                                                                            >
                                                                                                <i class="text-grey fas fa-wallet"></i>
                                                                                                {{-- Day Use + Pelunasan --}}
                                                                                                Day Use + Preview
                                                                                            </a>
                                                                                        @endif
                                                                                    @endif

                                                                                    @continue

																				@elseif ($balance_total > 0 || $balance_total_dayuse > 0)
																					<a href="#checkout_pembayaranmodal"
																						id="btn_checkout_pembayaranmodal"
																						class="btn-tooltip btn_checkout_pembayaranmodal dropdown-item"
																						data-target="#checkout_pembayaranmodal"
																						data-toggle="modal"
																						onclick="ClickBtnPembayaranCheckout({{$detail->booking->id}},{{$balance_total}},'{{$detail->booking->nama}}', {{$detail->booking->id}}, {{$detail->room_index}})"
																						title="Payment">
																							<i class="text-grey fas fa-wallet"></i>
																							{{-- Checkout + Pelunasan --}}
																							Checkout + Acquittance
                                                                                    </a>

																					@if ($balance_total_dayuse > 0 && date('Y-m-d', strtotime($detail->start_date)) == getSystemDate())
																						{{-- day use pelunasan --}}
																						<a data-target="#dayUse_pembayaranModal"
																							data-toggle="modal"
																							class="btn-tooltip dropdown-item"
																							onclick="ClickBtnPembayaranDayUse({{$detail->booking->id}},{{$balance_total_dayuse}},'{{$detail->booking->nama}}', {{$detail->booking->id}}, {{$detail->room_index}})"
																							title="Day Use (Payment)"
																						>
																							<i class="text-grey fas fa-wallet"></i>
																							{{-- Day Use + Pelunasan --}}
																							Day Use + Acquittance
																						</a>
                                                                                    @endif

                                                                                    @continue

																				@endif
																			@endif

                                                                            {{-- Jika looping memiliki data check in dan cancel reservation --}}
																			@if ($key == 13 || $key == 1)
																				@continue
																			@endif
																		@else

																			{{-- jika invoice/guest bill tidak ada, tidak tampilka opsi checkout --}}
																			@if ($key == 2)
																				@continue
																			@endif

                                                                            {{-- Jika looping memiliki data check in dan cancel reservation --}}
																			@if ($key == 13 || $key == 1)
																				@continue
																			@endif
																		@endif
																	@endif

                                                                    {{-- confirmed reservation --}}
																	@if ($detail->status_booking == 4)
																		@if(!in_array($key, [5,9,10,11,12,2]))
																			@if ($kamar->status == 'VD' && $key == 1)
																				<a href="#/" onclick="updateStatus({{$detail->booking->hotel_id}}, {{$detail->booking->id}}, {{$key}}, {{$detail->id}})"
																					class="dropdown-item {{$key == $detail->status_booking ? 'active' : ''}} bg-danger disabled-ahref"
																					style="{{$key == $detail->status_booking ? 'display: none' : ''}}; pointer-events: none;"
																					{{$key == $detail->status_booking ? 'disabled' : ''}}>
																					{{-- Status kamar "VD", tidak bisa checkin! --}}
																					{{-- Status kamar "VD", tidak bisa checkin! --}}
                                                                                    Room status is "VD", cannot checkin!
																				</a>
                                                                            @elseif(in_array($kamar->status, ['OD','OC']) && $key == 1)
                                                                                <a href="#/" onclick="updateStatus({{$detail->booking->hotel_id}}, {{$detail->booking->id}}, {{$key}}, {{$detail->id}})"
                                                                                    class="dropdown-item {{$key == $detail->status_booking ? 'active' : ''}} bg-danger disabled-ahref"
                                                                                    style="{{$key == $detail->status_booking ? 'display: none' : ''}}; pointer-events: none;"
                                                                                    {{$key == $detail->status_booking ? 'disabled' : ''}}>
                                                                                    {{-- Masih ada yang menempati, tidak bisa checkin! --}}
                                                                                    Room still occupied, cannot checkin!
                                                                                </a>
                                                                            @elseif(in_array($kamar->status, ['OOO','OS']) && $key == 1)
                                                                                <a href="#/" onclick="updateStatus({{$detail->booking->hotel_id}}, {{$detail->booking->id}}, {{$key}}, {{$detail->id}})"
                                                                                    class="dropdown-item {{$key == $detail->status_booking ? 'active' : ''}} bg-danger disabled-ahref"
                                                                                    style="{{$key == $detail->status_booking ? 'display: none' : ''}}; pointer-events: none;"
                                                                                    {{$key == $detail->status_booking ? 'disabled' : ''}}>
                                                                                    Room Status is {{config('custom.status_kamar')[$kamar->status]}}, cannot checkin!
                                                                                </a>
																			@elseif ($key == 13)
																				{{-- @if ($booking->segmentasi_rate_code != 7) --}}
                                                                                    @if (\Auth::user()->permission_change_reserv == 0)
																					<a href="#/"
																						data-toggle="modal"
																						data-target="#modal_status_confirm_cancel"
																						data-id_booking="{{$detail->booking->id}}"
																						data-hotel_id="{{$detail->booking->hotel_id}}"
                                                                                        data-detail_id="{{@$detail->id}}"
																						class="dropdown-item {{$key == $detail->status_booking ? 'active' : ''}} statusbutton"
																						{{-- style="{{$key == $detail->status_booking ? 'display: none' : ''}}" --}}
																						{{-- style="{{$detail->segmentasi_rate_code == 7 ? 'pointer-events: none;' : ''}}" --}}
																						{{$key == $detail->status_booking ? 'disabled' : ''}}
																						disabled>
																						Cancel Reservation
																					</a>
                                                                                    @endif
																				{{-- @else
																					@continue
																				@endif --}}
																			@else
																				<a href="#/" onclick="updateStatus({{$detail->booking->hotel_id}}, {{$detail->booking->id}}, {{$key}}, {{$detail->id}})"
																					class="dropdown-item {{$key == $detail->status_booking ? 'active' : ''}}"
																					style="{{$key == $detail->status_booking ? 'display: none' : ''}}"
																					{{$key == $detail->status_booking ? 'disabled' : ''}}
																					disabled>{{$val}}</a>
																			@endif
																		@endif
                                                                    {{-- checkout --}}
																	@elseif ($detail->status_booking == 2)
																		@if(!in_array($key, [5,9,10,11,12,2,1,4,13]))
																			<a href="#/" onclick="updateStatus({{$detail->booking->hotel_id}}, {{$detail->booking->id}}, {{$key}}, {{$detail->id}})"
																				class="dropdown-item {{$key == $detail->status_booking ? 'active' : ''}}"
																				style="{{$key == $detail->status_booking ? 'display: none' : ''}}"
																				{{$key == $detail->status_booking ? 'disabled' : ''}}
																				>{{$val}}</a>
																		@endif
																	@elseif ($detail->status_booking == 1)
                                                                        {{-- Define variable for check condition --}}
																		@php
                                                                            $check_extend_stay = false;
                                                                            $check_transaksi = false;
                                                                            $check_segmentasi = false;
                                                                            $check_lebih_dari_date_system = false;
																		@endphp

																		@if ($key == 4)
                                                                            {{-- check transaksi --}}
                                                                            @php
                                                                                // foreach ($detail->booking->deposits as $k => $deposit) {
                                                                                //     if ($deposit->jenis_transaksi == 1) {
                                                                                //         $check_transaksi = true;
                                                                                //     }
                                                                                // }

                                                                                // // add condition if not pick room yet
                                                                                // if ($detail->nomor_kamar) {
                                                                                //     if (@$invoice_array[$detail->booking_id][$detail->nomor_kamar]->shop_transaction) {
                                                                                //         foreach ($invoice_array[$detail->booking_id][$detail->nomor_kamar]->shop_transaction as $k => $shop_transaction) {
                                                                                //             if ($shop_transaction->jenis_transaksi == 1) {
                                                                                //                 $check_transaksi = true;
                                                                                //             }
                                                                                //         }
                                                                                //     }
                                                                                // }else{
                                                                                //     if (@$invoice_array[$detail->booking_id][$detail->nomor_kamar][$detail->room_index]->shop_transaction) {
                                                                                //         foreach ($invoice_array[$detail->booking_id][$detail->nomor_kamar]->shop_transaction as $k => $shop_transaction) {
                                                                                //             if ($shop_transaction->jenis_transaksi == 1) {
                                                                                //                 $check_transaksi = true;
                                                                                //             }
                                                                                //         }
                                                                                //     }
                                                                                // }
                                                                            @endphp
                                                                            {{-- close check transaksi --}}

                                                                            {{-- check segmentasi --}}
                                                                                @if ($detail->booking->segmentasi_rate_code == 7)
                                                                                    @php
                                                                                        $check_segmentasi = true;
                                                                                    @endphp
                                                                                @endif
                                                                            {{-- close check segmentasi --}}

                                                                            {{-- check lebih dari date system --}}
                                                                                @php
                                                                                    if (strtotime(getSystemDate()) > strtotime(formatDate($detail->start_date))) {
                                                                                        $check_lebih_dari_date_system = true;
                                                                                    }
                                                                                @endphp
                                                                            {{-- close check lebih dari date system --}}
																		@endif
																		<a href="#/" onclick="updateStatus({{$detail->booking->hotel_id}}, {{$detail->booking->id}}, {{$key}}, {{$detail->id}})"
																			class="dropdown-item {{$key == $detail->status_booking ? 'active' : ''}}"
																			{{-- style="{{$key == $detail->status_booking ? 'display: none' : ''}}" --}}
																			style="{{($key == 4 && ($check_extend_stay || $check_lebih_dari_date_system || checkAvailableBills($detail->id))) ? 'display:none;' : ''}}"
																			{{$key == $detail->status_booking ? 'disabled' : ''}}
																			>{{$key==4?'Cancel Check In':$val}}</a>
																	{{-- when status cancelled --}}
																	@elseif ($detail->status_booking == 13)
																		@if(in_array($key, [4]))
																			<a href="#/" onclick="updateStatus({{$detail->booking->hotel_id}}, {{$detail->booking->id}}, {{$key}}, {{$detail->id}})"
																				class="dropdown-item"
																				>{{$val}}</a>
																		@endif
                                                                    @else
																		<a href="#/" onclick="updateStatus({{$detail->booking->hotel_id}}, {{$detail->booking->id}}, {{$key}}, {{$detail->id}})"
																			class="dropdown-item {{$key == $detail->status_booking ? 'active' : ''}}"
																			style="{{$key == $detail->status_booking ? 'display: none' : ''}}"
																			{{$key == $detail->status_booking ? 'disabled' : ''}}
																			>{{$val}}</a>
																	@endif

																@endif
															@endif
														@endif
													@endforeach
												@endif

											@endforeach

                                            @if ($detail->status_booking == 1)
                                                @if (checkcountbooking($detail->booking_id) > 1)
                                                    <a href="#checkoutgroup"
                                                        id="checkoutgroup"
                                                        class="btn-tooltip dropdown-item"
                                                        onclick="checkoutgroup({{$detail->booking_id}})"
                                                        title="Checked out group">
                                                            <i class="text-orange fas fa-receipt"></i>
                                                            Checkout this group booking.
                                                    </a>
                                                @endif
                                            @endif

											@if ($detail->status_booking == 2)
												<a href="#/" onclick="updateStatus({{$detail->booking->hotel_id}}, {{$detail->booking->id}}, 1, {{$detail->id}})" class="dropdown-item">Cancel Checkout</a>
												<a class="dropdown-item" href="{{url('rv_downloadkwitansi',$detail->booking->id)}}" target="_blank">Print Receipts</a>
												<a class="dropdown-item" href="{{url('print-invoice', $bill_room->id)}}" target="_blank">Print Bill</a>
											@elseif($detail->status_booking == 1 && $balance_total_dayuse == 0 && $detail->jumlah_malam != 0 && date('Y-m-d', strtotime($detail->start_date)) == getSystemDate())
												<a class="dropdown-item" onclick="dayUse({{$detail->booking->hotel_id}}, {{$detail->booking->id}}, {{$detail->id}})">Day Use</a>
                                            @endif

                                            {{-- Guest Bill --}}
                                            @php
                                                $no_bill = @$bill_room->no_invoice;
                                            @endphp
                                            <a class="dropdown-item" href="{{url('invoice-draft', @$bill_room->id )}}"> <i class="fas fa-file-invoice-dollar"></i> Bill Number : {{$no_bill}}</a>

                                            {{-- Log File --}}
											<a class="dropdown-item"
                                                data-target="#log_file_modal"
                                                data-toggle="modal"
                                                onclick='logFile({{$detail->booking->id}}, null,  {{@$detail->room_index}}), guestName("{{$detail->booking->nama}}")'
                                                title="Log File"
                                            >
                                                Log File
                                            </a>

                                            {{-- Remarks --}}
											<a class="dropdown-item"
                                                data-target="#info_remark_modal"
                                                data-toggle="modal"
                                                onclick='infoRemark({{$detail->booking->id}}), guestName("{{$detail->booking->nama}}")'
                                                title="Remarks"
                                            >
                                                Remarks
                                            </a>
                                            {{-- Room Revenue --}}
											<a class="dropdown-item"
                                                data-target="#room_revenue_modal"
                                                data-toggle="modal"
                                                onclick="roomRevenue({{$detail->id}}), guestName('{{$detail->booking->nama}}')"
                                                title="Room Revenue"
                                            >
                                                Room Revenue
                                            </a>

                                            {{-- Incognito Change --}}
											<a class="dropdown-item"
                                                data-target="#incognito_change_modal"
                                                data-toggle="modal"
                                                onclick="openModalIncognito({{$detail->id}}, {{$detail->incognito}})"
                                                title="change incognito status"
                                            >
                                                {{$detail->incognito == 1 ? 'Remove Incognito' : 'Incognito'}}
                                            </a>

                                            {{-- Group Checkin By Group Name --}}
                                            @if ($detail->booking->group_name != null  && $detail->status_booking == 4)
											<a class="dropdown-item"
                                                data-target="#group_checkin_modal"
                                                data-toggle="modal"
                                                onclick='openModalGroupCheckin("{{$detail->booking->group_name}}", 1, {{ $detail->id }})'
                                                title="Group Check In"
                                            >
                                               Group Check In - group ({{@$detail->booking->group_name}})
                                            </a>
                                            @endif

                                            {{-- Group Checkin By No Reservation --}}
                                            @if ($detail->booking->kode_booking  && $detail->status_booking == 4)
											<a class="dropdown-item"
                                                data-target="#group_checkin_modal"
                                                data-toggle="modal"
                                                onclick='openModalGroupCheckin({{$detail->booking->kode_booking}}, 2, {{ $detail->id }})'
                                                title="Group Check In"
                                            >
                                               Group Check In - number reservation ({{@$detail->booking->kode_booking}})
                                            </a>
                                            @endif

                                            {{-- PRINT RC BY GROUP  --}}
                                            <a class="dropdown-item"
                                                href="{{url('rv_printrc_group', $detail->booking_id)}}"
                                                title="Print RC Group - Reservation Number"
                                                target="_blank"
                                            ><i class="icon-printer2 mr-1"></i>
                                                Print RC Group - Reservation Number({{@$detail->booking->kode_booking}})
                                            </a>

                                            {{-- Modal Browse Color --}}
											{{-- <a class="dropdown-item"
                                                data-target="#about_browse_color_modal"
                                                data-toggle="modal"
                                                title="About Browse Color"
                                            >
                                                About Browse Color
                                            </a> --}}

                                            {{-- Print Confirmation Letter --}}
											<a class="dropdown-item"
                                                target="_blank"
                                                href="{{url('roomview/confirmation-letter/'.$detail->booking->id)}}"
                                                title="Confirmation Letter"
                                            >
                                                Confirmation Letter
                                            </a>

										</div>
									</div>
								</div>

                                    {{-- BUTTON RC AND DEPOSIT --}}
                                    @if ($detail)
                                            <div class="row mb-1">
                                                <div class="col-md-12 pr-1">
                                                    <a class="btn btn-success btn-sm btn" href="{{url('rv_printrc', $detail->id)}}"
                                                        target="_blank"
                                                        style="width: 100%;height: 24px;padding:0;">
                                                        <i class="icon-printer2 mr-1"></i>
                                                        Print RC
                                                    </a>
                                                </div>

                                        @if ($detail->status_booking)

                                                {{-- @if ($booking->reservationDeposit) --}}
                                                    {{-- <div class="col-md-6 pl-1">
                                                        <button class="btn {{ $detail->checkin ? 'btn-success' : 'btn-danger' }} btn-sm"
                                                            data-target="#reservation_deposit_info_modal"
                                                            data-toggle="modal"
                                                            onclick='reservationDepositInfo({{$detail->booking_id}}, {{@$detail->booking->reservationDeposit->count() ?? 0}}, "{{$detail->booking->kode_booking}}", {{$detail->room_index}}), guestName("{{$detail->booking->nama}}")'
                                                            title="Reservation Deposit Info"
                                                            style="width: 100%;height: 24px;padding:0;">
                                                            <i class="fa fa-file-invoice-dollar"></i>
                                                            Deposit Info
                                                        </button>
                                                    </div> --}}
                                                {{-- @endif --}}
                                        @endif
                                            </div>
                                    @endif

                                @endif
								@endforeach
							@else
								@foreach($booking_details as $idx => $detail)
                                @if ($detail->array_sub == 0 || $detail->array_sub_extend_stay == 0)

                                @if ($detail->extend_stay === 0)
                                    @continue
                                @endif

                                @php
                                    // Global Variable This Invoice
                                    $bill_room = $detail->altInvoice($detail->room_index)->first();

                                    $color_card = '';
                                    // ambil class css
                                    if ($detail->status_booking == 13) {
                                        $color_card = 'canceled';
                                    }else{
                                        if ( $detail->jumlah_malam > 7) {
                                            $color_card = 'longstay';
                                        }elseif ( $detail->jumlah_malam < 1) {
                                            $color_card = 'dayuse';
                                        }
                                    }

                                    if (@$detail->booking->status_ota) {
                                        $color_card = 'canceled';
                                    }
                                @endphp
								<div class="list-group-item list-group-item-action d-flex justify-content-between {{ $color_card  }}">
									<div>
										<span class="font-weight-bold">

											{!! date('m-d', strtotime(@$detail->booking->guest->birth_date))  == date('m-d', strtotime(getSystemDate())) ? '<i class="fas fa-birthday-cake"></i>' : '' !!}
                                            {!! $detail->incognito == 1 ? '<i class="fas fa-user-secret"></i>' : '' !!}
                                            {!! @$detail->booking->reservationDeposit->count() > 0 && @$detail->booking->checkStatusReservation->count() < 1 && $detail->status_booking == 4 && @$detail->room_index == 1  ? '<i class="icon-cash"></i>' : '' !!}
                                            <a href="{{url('bookings').'/'.@$detail->booking->id.'/edit'}}">{{$detail->guest_room ? $detail->guest_room : @$detail->booking->nama}}</a>
                                            {!! $detail->incognito == 1 ? '(Incognito)' : '' !!}

                                            <a href="#"
                                                class="text-info btn-tooltip"
                                                onclick="showModalDetailReservation({{$detail->booking_id}}, {{$detail->id}})"
                                                title="Detail Reservation"><i class="icon icon-info22"></i>
                                            </a>

                                            @if (@$detail->booking->status_ota)
                                            <i class="icon-alert text-danger btn-tooltip"  title="Cancelled reservation from OTA"></i>
                                            @endif

											@if($detail->status_booking != 1 && $detail->status_booking != 2)
											{!! $detail->expected_arrival != "" ? '&nbsp;<span class="badge badge-danger font-weight-bold">Expected arrival: '.$detail->expected_arrival->format('H:i:s').'</span>' : '' !!}
											@endif
										</span> <br>
										<span class="">{{$detail->nomor_kamar ?? 'Belum Ada Kamar'}} - {{$detail->jns_kamar}}</span> <br>
										<span class="{{config('custom.status_booking_color')[$detail->status_booking]}} font-weight-bold">
											@if(in_array(1, [$detail->status_booking]))
												In House
											@else
												{{@config('custom.status_booking')[$detail->status_booking]}}
											@endif
											&nbsp;
											@if ($bill_room)
											{!! '<span class="badge badge-secondary">Rp 0</span>' !!}

                                                {{-- Arrangement --}}
                                                @if ($detail->arrangement_codes)
                                                    <span class="badge badge-info">{{ $detail->arrangement_codes }}</span>
                                                @endif
											@endif
										</span>
									</div>
								</div>

                                    {{-- BUTTON RC AND DEPOSIT --}}
                                    @if ($detail)
                                            <div class="row mb-1">
                                                <div class="col-md-12 pr-1">
                                                    <a class="btn btn-success btn-sm btn" href="{{url('rv_printrc', $detail->id)}}"
                                                        target="_blank"
                                                        style="width: 100%;height: 24px;padding:0;">
                                                        <i class="icon-printer2 mr-1"></i>
                                                        Print RC
                                                    </a>
                                                </div>

                                        @if ($detail->status_booking)

                                                {{-- @if ($booking->reservationDeposit) --}}
                                                    {{-- <div class="col-md-6 pl-1">
                                                        <button class="btn {{ $detail->checkin ? 'btn-success' : 'btn-danger' }} btn-sm"
                                                            data-target="#reservation_deposit_info_modal"
                                                            data-toggle="modal"
                                                            onclick='reservationDepositInfo({{$detail->booking_id}}, {{@$detail->booking->reservationDeposit->count() ?? 0}}, "{{$detail->booking->kode_booking}}", {{$detail->room_index}}), guestName("{{$detail->booking->nama}}")'
                                                            title="Reservation Deposit Info"
                                                            style="width: 100%;height: 24px;padding:0;">
                                                            <i class="fa fa-file-invoice-dollar"></i>
                                                            Deposit Info
                                                        </button>
                                                    </div> --}}
                                                {{-- @endif --}}
												@endif
										</div>
                                    @endif

                                @endif
								@endforeach
							@endif



					@else
                        <div class="row p-1">
                            <div class="col-md-12">
                                <div class="alert alert-danger text-center mb-2" role="alert">
                                    No Data Found
                                </div>
                            </div>
                        </div>
					@endif
					</div>

                    <ul id="pagination_template" class="pagination align-self-center">
                        @php
                            $last_page_custom = ($booking_details->currentPage() == $booking_details->lastPage() ? true : false);
                        @endphp
                        {{-- {!! $booking_details->links() !!} --}}
                        <li class="page-item interact_button"><button type="button" id="button_page_prev" onclick="paginationFunction(this.id,'prev')" class="page-link button-pagination text-muted" disabled>Prev</button></li>

                            <li class="page-item"><span class="page-link" id="this_page_current" disabled>{{$booking_details->currentPage()}} / {{$booking_details->lastPage()}}</span></li>
                            {{-- <li class="page-item"><a href="{{$booking_details->nextPageUrl}}" class="page-link">1</a></li>
                            <li class="page-item"><a href="{{$booking_details->nextPageUrl}}" class="page-link">2</a></li>
                            <li class="page-item"><a href="{{$booking_details->nextPageUrl}}" class="page-link">3</a></li>
                            <li class="page-item"><a href="{{$booking_details->nextPageUrl}}" class="page-link">4</a></li> --}}

                        <li class="page-item interact_button"><button type="button" id="button_page_next" onclick="paginationFunction(this.id,'next')" class="page-link button-pagination {{$last_page_custom ? 'text-muted' : ''}}" {{$last_page_custom ? 'disabled' : ''}}>Next</button></li>
                    </ul>
				</div>
			</div>

			<!-- Form update status booking -->
			<form id="form_booking_status" method="post" action="{{route('roomview.update')}}">
				@csrf
				<input type="hidden" name="id" id="id_booking">
				<input type="hidden" name="status_booking" id="status_booking">
				<input type="hidden" name="hotel_id" id="hotel_id">
				<input type="hidden" name="detail_id" id="booking_detail_id">
			</form>

			<!-- Form day use -->
			<form id="form_day_use" method="post" action="{{route('day-use')}}">
				@csrf
				<input type="hidden" name="id" id="id_booking_day_use">
				<input type="hidden" name="booking_detail_id" id="id_booking_detail_day_use">
				<input type="hidden" name="status_booking" id="status_booking_day_use" value="2">
				<input type="hidden" name="hotel_id" id="hotel_id_day_use">
			</form>

			<div class="col-md-9">
				<!-- Hover rows -->
				<div class="card p-0">
					<div class="card-header header-elements-inline p-2" style="border-bottom: 1px solid #F5F5F5;">
						{{-- @foreach(config('custom.status_booking') as $key => $val)
							@if(!in_array($key, [9,10,11,3,4]))
							<div class="d-flex mb-1 load-tooltip" title="{{$val}}">
								<span class="badge {{config('custom.status_booking_bg')[$key]}} py-0"
								>&nbsp;&nbsp;&nbsp;</span> --}}
								{{--
									&nbsp;{{\Auth::user()->role == 10 ? $val : substr($val, 0, 14).'..'}}
								--}}
								{{-- &nbsp;{{$val}}
							</div>
							@endif
						@endforeach --}}

                        <!-- Legend Status Kamar -->
                        @foreach(config('custom.status_kamar') as $key => $val)
                            @php
                                if($key != 'VC'){
                                    if(in_array($key, ['OOO', 'OS'])){
                                        $class_this = 'text-secondary';
                                    }else{
                                        $class_this = 'text-danger';
                                    }
                                }else{
                                    $class_this = 'text-success';
                                }
                            @endphp
                            <div class="load-tooltip" title="{{$val}}">
                                <h6 class="font-weight-bold"> <span class="{{$class_this}}">{{$key}}</span>: {{$val}}</h6>
                            </div>
                        @endforeach

					</div>
					<div class="card-body p-2">

					<!-- ERROR START -->

					{{-- -------------- --}}
					{{-- FRONTDESK / FO --}}
					{{-- -------------- --}}

					@if(in_array(\Auth::user()->role, [10,30]))
						@if(count($kamars) > 0)
							<div class="row">
								<div class="col-md-12">
									<div class="alert alert-secondary text-center mb-2 p-1" role="alert">
										<h4 class="font-weight-bold m-0">{{tanggalIndo(getSystemDate())}}</h4>
									</div>
								</div>
							</div>
							@foreach($kamars as $key => $val)
							<ul class="nav nav-sidebar" data-nav-type="accordion">
								<li id="accordion_lantai_{{$key}}" value="{{$key}}" class="accordion_lantais nav-item nav-item-submenu">
									<button id="accordion_button_lantai_{{$key}}" class="accordion_button_lantai_class btn bg-slate nav-link" style="width: 100%; font-size: 16px">
										<i class="icon-stairs"></i>Floor <span class="font-weight-bold ml-1 text-underline"><u>{{$key}}</u></span>
									</button>
									<ul class="nav nav-group-sub">
										<div class="card p-3">
											<div class="row">
												@foreach($val as $kamar)
												<div class="col-md-3">
													<div class="card font-weight-bolder bg-light" style="min-height: 10em;">
														<div class="card-header px-1 py-1">
															@if($kamar->bookingDetail)
																@if ($kamar->nama_pelanggan && !in_array(@$kamar->booking->segmentasi_rate_code, [4,5]))
																	{{-- @if(date('Y-m-d', strtotime($kamar->end_detail)) == getSystemDate()) --}}
																		{{-- <a href="detail_kamar_{{$kamar->id}}"
																			id="detail_kamar_{{$kamar->id}}"
																			class="text-info btn-tooltip float-left"
																			data-target="#extendStay"
																			data-toggle="modal"
																			onclick="ClickBtnExtendStay({{@$kamar->booking->id}}, {{$kamar->no_kamar}})"><button type="button" class="btn btn-light">Extend Stay</button></a> --}}
																	{{-- @endif --}}

                                                                    <!-- New Extend Stay: new booking -->
                                                                        {{-- <a href="{{url('bookings/create?g_id=').$kamar->booking->guest_profile_id.'&b_id='.$kamar->booking->id.'&no_kamar='.$kamar->no_kamar}}" target="_blank">
                                                                            <button type="button" class="btn btn-light">Extend Stay</button>
                                                                        </a> --}}
                                                                    <!-- New Extend Stay: new booking -->

																@endif
															@endif

                                                            @if(strtotime(@$kamar->end_detail) > strtotime('-1 day', strtotime(date('Y-m-d H:i:s', strtotime(getSystemDate())))) )
                                                                @if ($kamar->nama_pelanggan != null)
                                                                <div class="dropdownA btn-tooltip float-right" title="More Option">
                                                                    <a href="#" data-toggle="dropdown">
                                                                        <i class="icon-more"></i>
                                                                    </a>
                                                                    <div class="dropdown-menu dropdown-menu-right">

                                                                        <a href="#depositmodal_{{$kamar->id}}"
                                                                            class="text-teal btn-tooltip dropdown-item"
                                                                            data-target="#depositmodal"
                                                                            data-toggle="modal"
                                                                            onclick="ClickBtnDeposit({{@$kamar->booking->id}}, '{{$kamar->no_kamar}}', '{{addslashes($kamar->nama_pelanggan)}}', null, '{{addslashes($kamar->booking)}}')"
                                                                            title="Add Payment">
                                                                                <i class="fas fa-money-check-alt"></i>Add Payment
                                                                        </a>

                                                                        @if ($hotel_n_budget)
                                                                        <a href="#transaksimodal_{{$kamar->id}}"
                                                                            class="text-success btn-tooltip dropdown-item"
                                                                            data-target="#transaksimodal"
                                                                            data-toggle="modal"
                                                                            onclick="ClickBtnTransaksi({{$kamar->id}}, '{{$kamar->no_kamar}}', {{@$kamar->booking->id}}, '{{@addslashes($kamar->nama_pelanggan)}}')"
                                                                            title="Add Transaction"
                                                                        >
                                                                            <i class="fas fa-file-medical"></i>Add Transaction
                                                                        </a>
                                                                        @endif


                                                                        <a href="{{url('invoice-draft/'.@$kamar->guestbill_id)}}"
                                                                            class="text-warning btn-tooltip dropdown-item"
                                                                            title="FO Invoice"
                                                                        >
                                                                            <i class="fas fa-file-invoice-dollar"></i>FO Invoice
                                                                        </a>

                                                                        <a href="#transferbillmodal_{{$kamar->id}}"
                                                                            class="text-blue btn-tooltip dropdown-item"
                                                                            onclick="ClickBtnTransferBill({{@$kamar->guestbill_id}})"
                                                                            data-target="#transferbillmodal"
                                                                            data-toggle="modal"
                                                                            title="Transfer Bill"
                                                                        >
                                                                            <i class="icon icon-file-upload2"></i>Transfer Bill
                                                                        </a>

                                                                        <a href="#draftprintbillmodal_{{$kamar->id}}"
                                                                            class="text-brown btn-tooltip dropdown-item"
                                                                            onclick="ClickBtnDraftPrintBill({{@$kamar->guestbill_id}}, {{@$kamar->booking->id}}, '{{ $kamar->no_kamar }}')"
                                                                            data-target="#draftprintbillmodal"
                                                                            data-toggle="modal"
                                                                            title="Print Bill"
                                                                        >
                                                                            <i class="icon icon-printer2"></i>Print Bill
                                                                        </a>

                                                                        <a href="#/"
                                                                            class="text-info btn-tooltip btn-wakeup dropdown-item"
                                                                            data-kamar_id="{{$kamar->id}}"
                                                                            data-wakeup_time="{{$kamar->wakeupcall_time}}"
                                                                            data-target="#wakeUpCallModal"
                                                                            data-toggle="modal"
                                                                            title="Wake Up Call"
                                                                        >
                                                                            <i class="fas fa-phone"></i>Wake Up Call
                                                                        </a>

                                                                        <a href="#"
                                                                            class="text-warning btn-tooltip dropdown-item"
                                                                            title="Change Room"
                                                                            data-target="#changeRoomModal"
                                                                            data-toggle="modal"
                                                                            onclick="changeRoom({{$kamar->id}}, '{{$kamar->no_kamar}}', {{@$kamar->booking->id}}, {{@$kamar->jenisKamars}})"
                                                                        >
                                                                            <i class="fas fa-running"></i>Change Room
                                                                        </a>

                                                                        {{-- <a href="{{url('bookings/create?g_id=').$kamar->booking->guest_profile_id.'&b_id='.$kamar->booking->id.'&no_kamar='.$kamar->no_kamar}}"
                                                                            class="text-secondary btn-tooltip dropdown-item"
                                                                            title="Extend Stay"
                                                                        >
                                                                            <i class="icon-notebook"></i>Extend Stay
                                                                        </a> --}}

                                                                        <a href="#"
                                                                            class="text-secondary btn-tooltip dropdown-item"
                                                                            title="Extend Stay"
                                                                            onclick='extendstayindividual({{@$kamar->booking->id}}, {{$kamar->no_kamar}}, {{$kamar->room_index}})'
                                                                        >
                                                                            <i class="icon-notebook"></i>Extend Stay
                                                                        </a>


                                                                    </div>
                                                                </div>
                                                                @endif
                                                            @endif

															<a href="detail_kamar_{{$kamar->id}}"
																id="detail_kamar_{{$kamar->id}}"
																class="text-info btn-tooltip float-right"
																data-target="#detailKamarModal"
																data-toggle="modal"
																onclick="ClickBtnDetailKamar({{@$kamar->id}}, {{$kamar->jenisKamars}}, {{$kamar->connecting_room_1?$kamar->connecting_room_1:'0'}}, {{$kamar->connecting_room_2?$kamar->connecting_room_2:'0'}}, '{{$kamar->keterangan_connecting}}')"
																title="Room Detail"><i class="icon icon-eye"></i></a>
														</div>

														<div class="card-body text-center">
															{{-- Untuk mengambil nama jenis kamar berdasarkan array nomor_kamar di data booking --}}
															@php
															$masih_bisa_di_booking = false;

                                                            // DEFINE START STATUS BOOKING AND JENIS KAMAR
                                                            $status_booking_kamar   = '';
                                                            $jns_booking_kamar      = '';

															$kamardiblock = false;
															$namablocker = null;
															// foreach ($bookings as $booking) {
															// 	foreach($booking->bookingDetails as $detail) {
															// 			if ($detail->nomor_kamar == $kamar->no_kamar) {

                                                            //                 // GET STATUS BOOKING AND JENIS KAMAR
                                                            //                 $status_booking_kamar = $detail->status_booking;
                                                            //                 $jns_booking_kamar = $detail->jns_kamar;

															// 				if ($detail->block_kamar == 1) {
															// 					$kamardiblock = true;
															// 					$namablocker = $booking->title.'. '.$booking->nama;

															// 				} else {
															// 					$kamardiblock = false;
															// 					$namablocker = null;
															// 				}
															// 			}
															// 	}
															// }

															if($kamar->booking){

                                                                // GET STATUS BOOKING AND JENIS KAMAR
                                                                $status_booking_kamar   =  $kamar->status_detail;
                                                                $jns_booking_kamar      = $kamar->jns_detail;

                                                                if ($kamar->block_detail == 1) {
                                                                    $kamardiblock = true;
                                                                    $namablocker = $kamar->booking->title.'. '.$kamar->booking->nama;

                                                                } else {
                                                                    $kamardiblock = false;
                                                                    $namablocker = null;
                                                                }


																$jenis_kamar = $jns_booking_kamar ? $jns_booking_kamar : '';

                                                                if ($status_booking_kamar == 2) {
                                                                    $jenis_kamar = '';
                                                                }

																if ($status_booking_kamar == 4 && !in_array(getSystemDate(), [formatDateAwal($kamar->start_detail), formatDateAwal($kamar->end_detail)])) {
																	$masih_bisa_di_booking = true;
																}

															}
															else{
																$jenis_kamar = '';
															}
															@endphp
															<span>{{$masih_bisa_di_booking ? '' : $jenis_kamar}}</span><br>
															<span class="{{$kamar->booking ? ( !$masih_bisa_di_booking ? config('custom.status_booking_color.'.@$status_booking_kamar).' font-weight-bold' : '') : ''}}" style="font-size: 120%">
																@if($kamar->booking && !$masih_bisa_di_booking)
																	@if($status_booking_kamar == 2)
																	{!! !in_array($kamar->status, ['VC']) ? $kamar->no_kamar : '<a href="#" onclick=\'getDataKamar("'.$kamar->no_kamar.'", '.$kamar->jenisKamars.')\' data-toggle="modal"><i class="fas fa-door-open"></i>&nbsp;'.$kamar->no_kamar.'</a>' !!}
																	@else
																	{{$kamar->no_kamar}}
																	@endif
																@else
																	@if ($kamardiblock == 1)
																		<span class="text-danger">
																			<i class="icon-lock"></i> {{$kamar->no_kamar}}
																		</span> <br>
																		<span>{{$namablocker}}</span>
																	@else
																		{!! !in_array($kamar->status, ['VC']) ? $kamar->no_kamar : '<a href="#" onclick=\'getDataKamar("'.$kamar->no_kamar.'", '.$kamar->jenisKamars.')\' data-toggle="modal"><i class="fas fa-door-open"></i>&nbsp;'.$kamar->no_kamar.'</a>' !!}
																	@endif
																@endif
															</span>
															{{-- @if($kamar->booking)
																@if(strtotime($kamar->booking->end_date) > strtotime('-1 day', strtotime(date('Y-m-d H:i:s'))) )
																<br>
																<span class="{{$kamar->booking ? config('custom.status_booking_color.'.$kamar->booking->status_booking).' font-weight-bold' : ''}}">
																	{!! $kamar->booking->incognito == 1 ? '<i class="fas fa-user-secret"></i>&nbsp;Incognito' : $kamar->nama_pelanggan !!}
																</span>
																@endif
															@endif --}}
															@if($kamar->booking && !$masih_bisa_di_booking)
																@if(strtotime($kamar->end_detail) > strtotime('-1 day', strtotime(date('Y-m-d H:i:s', strtotime(getSystemDate())))) )
																<br>
																@php
																	$status_booking_kamar = '';
																	// foreach ($kamar->booking->bookingDetails as $key => $value) {
																	// 	if ($value->nomor_kamar == $kamar->no_kamar && $value->array_sub == 0 || $detail->array_sub_extend_stay == 0) {
																	// 		$status_booking_kamar = $value->status_booking;
																	// 	}
																	// }

                                                                    $status_booking_kamar = $kamar->status_detail
																@endphp
																<span class="{{$kamar->booking ? config('custom.status_booking_color.'.@$status_booking_kamar).' font-weight-bold' : ''}}" >
																	<a data-no_identitas="{{@$kamar->booking->no_identitas}}" data-name_guest="{{$kamar->nama_pelanggan}}" id="show_guest" data-target="#myModal" data-toggle="modal" href="#myModal">
                                                                        @php
                                                                            $nama_pelanggan = strlen($kamar->nama_pelanggan) > 9 ? substr($kamar->nama_pelanggan, 0, 9).'...' : $kamar->nama_pelanggan
                                                                        @endphp

																		{!! $kamar->booking->incognito == 1 ? '<i class="fas fa-user-secret"></i>&nbsp;'.$nama_pelanggan.'(Incognito)' : '<i class="fas fa-user"></i>&nbsp;'.$nama_pelanggan !!}
																	</a>
																</span>
																@endif
															@endif
															{!! getExpectedArrival($kamar->hotel_id, $kamar->no_kamar) !!}

															@if ($kamar->nama_pelanggan != null)
																<br><span id="wakeCallTime" value="{{$kamar->wakeupcall_time}}">{{$kamar->wakeupcall_time}}</span>
																@if ($kamar->wakeupcall_time != null)
																	<a href="{{route('delwakeupcall', $kamar->id) }}" class="btn-tooltip" title="Hapus Wake Up Call">
																		<small><i class="text-danger fas fa-times-circle  "></i></small>
																	</a>
																@endif
															@endif

															{{-- <div class="my-1">
																<a href="lock" id="lock" class="{{ $kamar->status_lock == 1 ? 'text-danger' : 'text-success' }} btn-tooltip" data-target="#modalStatusLock" onclick="updateStatusLock({{$kamar->no_kamar}}, {{$kamar->status_lock}}, {{$kamar->id}})" data-toggle="modal" title="{{ $kamar->status_lock == 1 ? 'POS Lock' : 'POS Unlock' }}" data-placement="right">
																	@if ($kamar->status_lock == 1)
																		<i class="fas fa-lock"></i>
																	@else
																		<i class="fas fa-lock-open"></i>
																	@endif
																</a>
															</div> --}}
														</div>

														<div class="card-header px-1 py-1">
															@if($kamar->bookingDetail)
																@if ($kamar->nama_pelanggan && !in_array(@$kamar->booking->segmentasi_rate_code, [4,5]))
																	{{-- <div class="text-center ">
																		<button type="button" class="btn btn-light" data-toggle="modal" data-target="#historyExtend" onclick="ClickBtnHistoryExtendStay({{ $kamar->booking_id }}, {{ $kamar->room_index }})">History Extend Stay</button>
																	</div> --}}
																@endif
															@endif
														</div>

														<div class="card-footer text-center p-0 m-0" style="line-height: 0.1">

															<p class="p-0 text-center">
																<form action="{{route('roomview.updatekamar')}}" id="form_kamar_{{$kamar->id}}" method="post">
																	@csrf
																	<input type="hidden" name="id_kamar" value="{{$kamar->id}}">
                                                                    <div style="font-size: 15px">
                                                                        @if($kamar->status != 'VC' )
                                                                            @if (in_array($kamar->status, ['OOO', "OS"]))
                                                                            <span class="text-warning text-status" id="text_status_kamar_{{$kamar->id}}">{{$kamar->status}}</span>
                                                                            @else
                                                                            <span class="text-danger text-status" id="text_status_kamar_{{$kamar->id}}">{{$kamar->status}}</span>
                                                                            @endif
                                                                        @else
                                                                        <span class="text-success text-status" id="text_status_kamar_{{$kamar->id}}">{{$kamar->status}}</span>
                                                                        @endif
                                                                        @if (in_array(\Auth::user()->role, [10]))
                                                                            @if (in_array(@dataHotel()->opsi_change_kamar, [0,1]))
                                                                            <a href="#/"
                                                                                    id="link_status_kamar_{{$kamar->id}}"
                                                                                    class="text-primary btn-tooltip link-status"
                                                                                    onclick="editStatusKamar({{$kamar->id}})"
                                                                                    title="Change Room Status"
                                                                                    >
                                                                                <small><i class="icon-arrow-down5"></i></small>
                                                                            </a>
                                                                            @endif
                                                                        @else
                                                                        <a href="#/"
                                                                                id="link_status_kamar_{{$kamar->id}}"
                                                                                class="text-primary btn-tooltip link-status"
                                                                                onclick="editStatusKamar({{$kamar->id}})"
                                                                                title="Change Room Status"
                                                                                >
                                                                            <small><i class="icon-arrow-down5"></i></small>
                                                                        </a>
                                                                        @endif
                                                                    </div>

																	<select name="status_kamar" id="status_kamar_{{$kamar->id}}" data-id="{{$kamar->id}}" data-room_no="{{ $kamar->no_kamar }}" class="form-control select-status" style="display:none">
																		@if($kamar->bookingDetail)
																			@foreach(config('custom.status_kamar') as $key => $val)
																				@if (!in_array($key, ['OD', 'OC']))
																					@continue
																				@endif
																					<option value="{{$key}}" {{$key == $kamar->status ? 'selected' : ''}}>{{$val}}</option>
																			@endforeach
																		@else
																			@foreach(config('custom.status_kamar') as $key => $val)
																				@if (in_array($key, ['OD', 'OC']))
																					@continue
																				@endif
																					<option value="{{$key}}" {{$key == $kamar->status ? 'selected' : ''}}>{{$val}}</option>
																			@endforeach
																		@endif
																		{{--
																			@if (!in_array($kamar->status, ['OC', 'OD']))
																				@foreach(config('custom.status_kamar') as $key => $val)
																					@if (in_array($key, ['OD', 'OC']))
																						@continue
																					@endif
																						<option value="{{$key}}" {{$key == $kamar->status ? 'selected' : ''}}>{{$val}}</option>
																				@endforeach
																			@else
																				@foreach(config('custom.status_kamar') as $key => $val)
																					@if (!in_array($key, ['OD', 'OC']))
																						@continue
																					@endif
																						<option value="{{$key}}" {{$key == $kamar->status ? 'selected' : ''}}>{{$val}}</option>
																				@endforeach
																			@endif
																		--}}
																	</select>

                                                                    <input type="hidden" name="keterangan" id="keterangan_ooo" class="keterangan_ooo" value="">
                                                                    <input type="hidden" name="tanggal_deadline" id="tanggal_deadline_ooo" class="tanggal_deadline_ooo" value="">

																	<br>
																	<br>
																	<br>
																	<br>
																	<a href="#" id="cancel_status_kamar_{{$kamar->id}}" onclick="cancelStatus({{$kamar->id}})" style="top: 15px; display:none">Cancel</a>
																</form>
															</p>

															<hr class="p-0 m-0">

															<p class="p-0 m-0">

															@if(false)<!--Hide-->
															{{-- @if(strtotime(@$kamar->end_detail) > strtotime('-1 day', strtotime(date('Y-m-d H:i:s', strtotime(getSystemDate())))) ) --}}
																@if ($kamar->nama_pelanggan != null)

																	{{-- <a href="#pembayaranmodal_{{$kamar->id}}"
																		id="btn_pembayaranmodal_{{$kamar->id}}"
																		class="text-grey btn-tooltip btn_pembayaranmodal"
																		data-target="#pembayaranmodal"
																		data-toggle="modal"
																		onclick="ClickBtnPembayaran({{@$kamar->booking->id}}, {{$kamar->no_kamar}})"
																		title="Payment">
																			<i class="fas fa-wallet"></i>
																		</a>

																	<a href="#refundmodal_{{$kamar->id}}"
																		id="btn_refundmodal_{{$kamar->id}}"
																		class="text-orange btn-tooltip btn_refundmodal"
																		data-target="#refundmodal"
																		data-toggle="modal"
																		onclick="ClickBtnRefund({{@$kamar->booking->id}}, {{$kamar->no_kamar}})"
																		title="Refund">
																			<i class="fas fa-receipt"></i>
																		</a>

																		<span id="hr_{{$kamar->id}}" class="hrbatas text-slate mx-1">|</span> --}}

																	@php
																		// $nominalpembayaran = 0;
																		// $nominalrefund = 0;
																		// $balance_total = 0;
																		// $nominaltransaksishop = 0;

																		// $nominalinvoice = @$kamar->booking->invoice->total - @$kamar->booking->invoice->total_deposit;
																		// if (count(@$kamar->booking->invoice->pembayaran) > 0) {
																		// 	foreach ($kamar->booking->invoice->pembayaran as $pembayaran) {
																		// 		if($pembayaran->tipe_pembayaran == 1){
																		// 			$nominalpembayaran += $pembayaran->nominal;
																		// 		}
																		// 		else{
																		// 			$nominalrefund += $pembayaran->nominal;
																		// 		}
																		// 	}
																		// }

																		// if (count(@$kamar->booking->invoice->shop_transaction)) {
																		// 	foreach ($kamar->booking->invoice->shop_transaction as $transaction) {
																		// 		$nominaltransaksishop += $transaction->grand_total;
																		// 	}
																		// }

																		// if (count(@$kamar->booking->pembayaran_pos)) {
																		//     foreach ($kamar->booking->pembayaran_pos as $pos) {
																		//         if ($pos->jenis_transaksi == 1) {
																		//             $nominaltransaksishop += $pos->nominal;
																		//         }
																		//     }
																		// }

																		// $balance_total = $nominalinvoice + $nominaltransaksishop - $nominalpembayaran;
																		// $balance_total = $balance_total + $nominalrefund;
																		// $balance_total = array_key_exists($kamar->booking_id, $array_balance_total) ? $array_balance_total[$kamar->booking_id][$kamar->no_kamar] : 0;
																	@endphp


																	<a href="#depositmodal_{{$kamar->id}}"
																		id="btn_depositmodal_{{$kamar->id}}"
																		class="text-teal btn-tooltip btn_depositmodal"
																		data-target="#depositmodal"
																		data-toggle="modal"
																		onclick="ClickBtnDeposit( {{@$kamar->booking->id}}, '{{$kamar->no_kamar}}', '{{addslashes($kamar->nama_pelanggan)}}', null, '{{addslashes($kamar->booking)}}')"
																		title="Add Payment"
																	>
																		<small><i class="fas fa-money-check-alt"></i>A</small>
																	</a>
                                                                    @if ($hotel_n_budget)
																	<a href="#transaksimodal_{{$kamar->id}}"
																		id="btn_transaksimodal_{{$kamar->id}}"
																		class="text-success btn-tooltip btn_transaksimodal"
																		data-target="#transaksimodal"
																		data-toggle="modal"
																		onclick="ClickBtnTransaksi({{$kamar->id}}, '{{$kamar->no_kamar}}', {{@$kamar->booking->id}}, '{{addslashes($kamar->nama_pelanggan)}}')"
																		title="Add Transaction"
																	>
																		<small><i class="fas fa-file-medical"></i></small>
																	</a>
                                                                    @endif

																	{{-- Url Sebelumnya: url('rv_downloadguestbill', @$kamar->booking->id) --}}
																	<a
																	href="{{url('invoice-draft/'.@$kamar->guestbill_id)}}"
																	id="linkguestbill_{{$kamar->id}}"
																	class="text-warning btn-tooltip linkguestbill"
																	title="FO Invoice"
																	target="_blank"
																	>
																	<small><i class="fas fa-file-invoice-dollar"></i></small>
																	</a>

																	<a href="#transferbillmodal_{{$kamar->id}}"
																		id="btn_transferbillmodal_{{$kamar->id}}"
																		class="text-blue btn-tooltip btn_transferbillmodal"
																		onclick="ClickBtnTransferBill({{@$kamar->guestbill_id}})"
																		data-target="#transferbillmodal"
																		data-toggle="modal"
																		title="Transfer Bill">
																			<small><i class="icon icon-file-upload2"></i></small>
																	</a>

																	{{-- draft print bill --}}
																	<a href="#draftprintbillmodal_{{$kamar->id}}"
																		id="btn_draftprintbillmodal_{{$kamar->id}}"
																		class="text-brown btn-tooltip btn_draftprintbillmodal"
																		onclick="ClickBtnDraftPrintBill({{@$kamar->guestbill_id}},{{@$kamar->booking->id}}, '{{ $kamar->no_kamar }}')"
																		data-target="#draftprintbillmodal"
																		data-toggle="modal"
																		title="Print Bill">
																			<small><i class="icon icon-printer2"></i></small>
																		</a>

																	<a href="#/"
																		id="wake_up_call_{{$kamar->id}}"
																		class="text-info btn-tooltip link-status btn-wakeup"
																		data-kamar_id="{{$kamar->id}}"
																		data-wakeup_time="{{$kamar->wakeupcall_time}}"
																		data-target="#wakeUpCallModal"
																		data-toggle="modal"
																		title="Wake Up Call"
																		>
																		<small><i class="fas fa-phone"></i></small>
																	</a>


																	<a href="#"
																		id="changeroom_{{$kamar->id}}"
																		class="text-warning btn-tooltip link-status"
																		title="Change Room"
																			data-target="#changeRoomModal"
																			data-toggle="modal"
																			onclick="changeRoom({{$kamar->id}}, '{{$kamar->no_kamar}}', {{@$kamar->booking->id}}, {{@$kamar->jenisKamars}})"
																		>
																			<small><i class="fas fa-running"></i></small>
																		</a>

																@endif
															@endif

																	{{-- <a href="#/"
																	id="link_status_kamar_{{$kamar->id}}"
																	class="text-danger btn-tooltip link-status"
																	onclick="editStatusKamar({{$kamar->id}})"
																	title="Change Room Status"
																	>
																		<small><i class="fas fa-pencil-alt"></i></small>
																	</a> --}}
															</p>

														</div>
													</div>
												</div>
												@endforeach
											</div>
										</div>
									</ul>
								</li>
							</ul>
							@endforeach
						@else
						<div class="row">
							<div class="col-md-12">
								<div class="alert alert-danger text-center mb-2" role="alert">
									Belum Ada Data Kamar
								</div>
							</div>
						</div>
						@endif
					@else
						@if(null != \Session::get('hotel_id'))
							<div class="row">
								<div class="col-md-12">
									<div class="alert alert-secondary text-center mb-2 p-1" role="alert">
										<h4 class="font-weight-bold m-0">{{tanggalIndo(getSystemDate())}}</h4>
									</div>
								</div>
							</div>
							@if(count($kamars) > 0)
								@foreach($kamars as $key => $val)

								<ul class="nav nav-sidebar" data-nav-type="accordion">

									<li id="accordion_lantai_{{$key}}" value="{{$key}}" class="accordion_lantais nav-item nav-item-submenu">
										<button id="accordion_button_lantai_{{$key}}" class="accordion_button_lantai_class btn bg-slate nav-link" style="width: 100%; font-size: 16px">
											<i class="icon-stairs"></i>Floor <span class="font-weight-bold ml-1 text-underline"><u>{{$key}}</u></span>
										</button>

										<ul class="nav nav-group-sub">
											<div class="card p-3">

												<div class="row">
													@foreach($val as $kamar)
													<div class="col-md-3">
														<div class="card font-weight-bolder bg-light" style="min-height: 10em;">

															<div class="card-header px-1 py-1">
																@if($kamar->bookingDetail)
																	@if($kamar->nama_pelanggan && !in_array(@$kamar->booking->segmentasi_rate_code, [4,5]))
																		{{-- @if(date('Y-m-d', strtotime($kamar->end_detail)) == getSystemDate()) --}}
																			{{-- <a href="detail_kamar_{{$kamar->id}}"
																			   id="detail_kamar_{{$kamar->id}}"
																			   class="text-info btn-tooltip float-left"
																			   data-target="#extendStay"
																			   data-toggle="modal"
																			   onclick="ClickBtnExtendStay({{@$kamar->booking->id}}, {{$kamar->no_kamar}})"
																			>
																				<button type="button" class="btn btn-light">Extend Stay</button>
																			</a> --}}
																		{{-- @endif --}}


                                                                        <!-- New Extend Stay: new booking -->
                                                                            {{-- <a href="{{url('bookings/create?g_id=').$kamar->booking->guest_profile_id.'&b_id='.$kamar->booking->id.'&no_kamar='.$kamar->no_kamar}}" target="_blank">
                                                                                <button type="button" class="btn btn-light">Extend Stay</button>
                                                                            </a> --}}
                                                                        <!-- New Extend Stay: new booking -->
																	@endif
																@endif

                                                                @if(strtotime(@$kamar->end_detail) > strtotime('-1 day', strtotime(date('Y-m-d H:i:s', strtotime(getSystemDate())))) )
                                                                    @if ($kamar->nama_pelanggan != null)
                                                                    <div class="dropdownA btn-tooltip float-right" title="More Option">
                                                                        <a href="#" data-toggle="dropdown">
                                                                            <i class="icon-more"></i>
                                                                        </a>
                                                                        <div class="dropdown-menu dropdown-menu-right">

                                                                            <a href="#depositmodal_{{$kamar->id}}"
                                                                                class="text-teal btn-tooltip dropdown-item"
                                                                                data-target="#depositmodal"
                                                                                data-toggle="modal"
                                                                                onclick="ClickBtnDeposit({{@$kamar->booking->id}}, '{{$kamar->no_kamar}}', '{{addslashes($kamar->nama_pelanggan)}}', null, '{{addslashes($kamar->booking)}}')"
                                                                                title="Add Payment">
                                                                                    <i class="fas fa-money-check-alt"></i>Add Payment
                                                                            </a>

                                                                            @if ($hotel_n_budget)
                                                                            <a href="#transaksimodal_{{$kamar->id}}"
                                                                                class="text-success btn-tooltip dropdown-item"
                                                                                data-target="#transaksimodal"
                                                                                data-toggle="modal"
                                                                                onclick="ClickBtnTransaksi({{$kamar->id}}, '{{$kamar->no_kamar}}', {{@$kamar->booking->id}}, '{{addslashes(@$kamar->nama_pelanggan)}}')"
                                                                                title="Add Transaction"
                                                                            >
                                                                                <i class="fas fa-file-medical"></i>Add Transaction
                                                                            </a>
                                                                            @endif

                                                                            <a href="{{url('invoice-draft/'.@$kamar->guestbill_id)}}"
                                                                                class="text-warning btn-tooltip dropdown-item"
                                                                                title="FO Invoice"
                                                                            >
                                                                                <i class="fas fa-file-invoice-dollar"></i>FO Invoice
                                                                            </a>

                                                                            <a href="#transferbillmodal_{{$kamar->id}}"
                                                                                class="text-blue btn-tooltip dropdown-item"
                                                                                onclick="ClickBtnTransferBill({{@$kamar->guestbill_id}})"
                                                                                data-target="#transferbillmodal"
                                                                                data-toggle="modal"
                                                                                title="Transfer Bill"
                                                                            >
                                                                                <i class="icon icon-file-upload2"></i>Transfer Bill
                                                                            </a>

                                                                            <a href="#draftprintbillmodal_{{$kamar->id}}"
                                                                                class="text-brown btn-tooltip dropdown-item"
                                                                                onclick="ClickBtnDraftPrintBill({{@$kamar->guestbill_id}}, {{@$kamar->booking->id}}, '{{ $kamar->no_kamar }}')"
                                                                                data-target="#draftprintbillmodal"
                                                                                data-toggle="modal"
                                                                                title="Print Bill"
                                                                            >
                                                                                <i class="icon icon-printer2"></i>Print Bill
                                                                            </a>

                                                                            <a href="#/"
                                                                                class="text-info btn-tooltip btn-wakeup dropdown-item"
                                                                                data-kamar_id="{{$kamar->id}}"
                                                                                data-wakeup_time="{{$kamar->wakeupcall_time}}"
                                                                                data-target="#wakeUpCallModal"
                                                                                data-toggle="modal"
                                                                                title="Wake Up Call"
                                                                            >
                                                                                <i class="fas fa-phone"></i>Wake Up Call
                                                                            </a>

                                                                            <a href="#"
                                                                                class="text-warning btn-tooltip dropdown-item"
                                                                                title="Change Room"
                                                                                data-target="#changeRoomModal"
                                                                                data-toggle="modal"
                                                                                onclick="changeRoom({{$kamar->id}}, '{{$kamar->no_kamar}}', {{@$kamar->booking->id}}, {{@$kamar->jenisKamars}})"
                                                                            >
                                                                                <i class="fas fa-running"></i>Change Room
                                                                            </a>

                                                                            {{-- <a href="{{url('bookings/create?g_id=').$kamar->booking->guest_profile_id.'&b_id='.$kamar->booking->id.'&no_kamar='.$kamar->no_kamar}}"
                                                                                class="text-secondary btn-tooltip dropdown-item"
                                                                                title="Extend Stay"
                                                                            >
                                                                                <i class="icon-notebook"></i>Extend Stay
                                                                            </a> --}}
                                                                            <a href="#"
                                                                                class="text-secondary btn-tooltip dropdown-item"
                                                                                title="Extend Stay"
                                                                                onclick='extendstayindividual({{@$kamar->booking->id}}, {{$kamar->no_kamar}}, {{$kamar->room_index}})'
                                                                            >
                                                                               <i class="icon-notebook"></i>Extend Stay
                                                                            </a>

                                                                        </div>
                                                                    </div>
                                                                    @endif
                                                                @endif

																<a href="detail_kamar_{{$kamar->id}}"
																   id="detail_kamar_{{$kamar->id}}"
																   class="text-info btn-tooltip float-right"
																   data-target="#detailKamarModal"
															       data-toggle="modal"
																   onclick="ClickBtnDetailKamar({{@$kamar->id}}, {{$kamar->jenisKamars}}, {{$kamar->connecting_room_1?$kamar->connecting_room_1:'0'}}, {{$kamar->connecting_room_2?$kamar->connecting_room_2:'0'}}, '{{$kamar->keterangan_connecting}}')"
																   title="Room Detail"><i class="icon icon-eye"></i></a>
															</div>

															<div class="card-body text-center">
																{{-- Untuk mengambil nama jenis kamar berdasarkan array nomor_kamar di data booking --}}
																@php
																$masih_bisa_di_booking = false;

                                                                // DEFINE START STATUS BOOKING AND JENIS KAMAR
                                                                $status_booking_kamar   = '';
                                                                $jns_booking_kamar      = '';

																$kamardiblock = false;
																$namablocker = null;

                                                                $status_booking_kamar = '';
                                                                $jns_booking_kamar = '';

																if($kamar->booking){
                                                                    // GET STATUS BOOKING AND JENIS KAMAR
                                                                    $status_booking_kamar =  $kamar->status_detail;
                                                                    $jns_booking_kamar = $kamar->jns_detail;

                                                                    if ($kamar->block_kamar == 1) {
                                                                        $kamardiblock = true;
                                                                        $namablocker = $kamar->booking->title.'. '.$kamar->booking->nama;

                                                                    } else {
                                                                        $kamardiblock = false;
                                                                        $namablocker = null;
                                                                    }

																	$jenis_kamar = $jns_booking_kamar ? $jns_booking_kamar : '';

                                                                    if ($status_booking_kamar == 2) {
                                                                        $jenis_kamar = '';
                                                                    }

																	if ($status_booking_kamar == 4 && !in_array(getSystemDate(), [formatDateAwal($kamar->start_detail), formatDateAwal($kamar->end_detail)])) {
																		$masih_bisa_di_booking = true;
																	}

																}
																else{
																	$jenis_kamar = '';
																}
																@endphp
																<span>{{$masih_bisa_di_booking ? '' : $jenis_kamar}}</span><br>
																<span class="{{$kamar->booking ? ( !$masih_bisa_di_booking ? config('custom.status_booking_color.'.@$status_booking_kamar).' font-weight-bold' : '') : ''}}" style="font-size: 120%">
																	@if($kamar->booking && !$masih_bisa_di_booking)
																		@if($status_booking_kamar == 2)
																		{!! !in_array($kamar->status, ['VC']) ? $kamar->no_kamar : '<a href="#" onclick=\'getDataKamar("'.$kamar->no_kamar.'", '.$kamar->jenisKamars.')\' data-toggle="modal"><i class="fas fa-door-open"></i>&nbsp;'.$kamar->no_kamar.'</a>' !!}
																		@else
																		{{$kamar->no_kamar}}
																		@endif
																	@else
																		@if ($kamardiblock == 1)
																			<span class="text-danger">
																				<i class="icon-lock"></i> {{$kamar->no_kamar}}
																			</span> <br>
																			<span>{{$namablocker}}</span>
																		@else
																			{!! !in_array($kamar->status, ['VC']) ? $kamar->no_kamar : '<a href="#" onclick=\'getDataKamar("'.$kamar->no_kamar.'", '.$kamar->jenisKamars.')\' data-toggle="modal"><i class="fas fa-door-open"></i>&nbsp;'.$kamar->no_kamar.'</a>' !!}
																		@endif
																	@endif
																</span>

																@if($kamar->booking && !$masih_bisa_di_booking)
																	@if(strtotime($kamar->end_detail) > strtotime('-1 day', strtotime(date('Y-m-d H:i:s', strtotime(getSystemDate())))) )
																	<br>
																	<span class="{{$kamar->booking ? config('custom.status_booking_color.'.$status_booking_kamar).' font-weight-bold' : ''}}" >
																		<a data-no_identitas="{{@$kamar->booking->no_identitas}}" data-name_guest="{{$kamar->nama_pelanggan}}" id="show_guest" data-target="#myModal" data-toggle="modal" href="#myModal">
                                                                            @php
                                                                                $nama_pelanggan = strlen($kamar->nama_pelanggan) > 9 ? substr($kamar->nama_pelanggan, 0, 9).'...' : $kamar->nama_pelanggan
                                                                            @endphp

																			{!! $kamar->booking->incognito == 1 ? '<i class="fas fa-user-secret"></i>&nbsp;'.$nama_pelanggan.'(Incognito)' : '<i class="fas fa-user"></i>&nbsp;'.$nama_pelanggan !!}
																		</a>
																	</span>
																	@endif
																@endif
																{!! getExpectedArrival($kamar->hotel_id, $kamar->no_kamar) !!}

																@if ($kamar->nama_pelanggan != null)
																	<br><span id="wakeCallTime" value="{{$kamar->wakeupcall_time}}">{{$kamar->wakeupcall_time ? dateFormat($kamar->wakeupcall_time, 'd-m-Y H:i') : ''}}</span>
																		@if ($kamar->wakeupcall_time != null)
																		<a href="{{route('delwakeupcall', $kamar->id) }}" class="btn-tooltip" title="Hapus Wake Up Call">
																			<small><i id="iconcircle" class="text-danger fas fa-times-circle  "></i></small>
																		</a>
																	@endif
																@endif

															</div>

															<div class="card-footer text-center p-0 m-0" style="line-height: 0.1">

																<p class="p-0">
																	<form action="{{route('roomview.updatekamar')}}" id="form_kamar_{{$kamar->id}}" method="post">
																		@csrf
																		<input type="hidden" name="id_kamar" value="{{$kamar->id}}">
                                                                        <div style="font-size: 15px">
                                                                            @if($kamar->status != 'VC' )
                                                                                @if (in_array($kamar->status, ['OOO', "OS"]))
                                                                                <span class="text-secondary text-status" id="text_status_kamar_{{$kamar->id}}" style="font-size: 15px">{{$kamar->status}}</span>
                                                                                @else
                                                                                <span class="text-danger text-status" id="text_status_kamar_{{$kamar->id}}" style="font-size: 15px">{{$kamar->status}}</span>
                                                                                @endif
                                                                            @else
                                                                            <span class="text-success text-status" id="text_status_kamar_{{$kamar->id}}" style="font-size: 15px">{{$kamar->status}}</span>
                                                                            @endif
                                                                            <a href="#/"
                                                                                    id="link_status_kamar_{{$kamar->id}}"
                                                                                    class="text-primary btn-tooltip link-status"
                                                                                    onclick="editStatusKamar({{$kamar->id}})"
                                                                                    title="Change Room Status"
                                                                                    >
                                                                                <small><i class="icon-arrow-down5"></i></small>
                                                                            </a>
                                                                        </div>

																		<select name="status_kamar" id="status_kamar_{{$kamar->id}}" data-id="{{$kamar->id}}" data-room_no="{{ $kamar->no_kamar }}" class="form-control select-status" style="display:none">
																		@if (!in_array($kamar->status, ['OC', 'OD']))
																			@foreach(config('custom.status_kamar') as $key => $val)
																				@if (in_array($key, ['OD', 'OC']))
																					@continue
																				@endif
																					<option value="{{$key}}" {{$key == $kamar->status ? 'selected' : ''}}>{{$val}}</option>
																			@endforeach
																		@else
																			@foreach(config('custom.status_kamar') as $key => $val)
																				@if (!in_array($key, ['OD', 'OC']))
																					@continue
																				@endif
																					<option value="{{$key}}" {{$key == $kamar->status ? 'selected' : ''}}>{{$val}}</option>
																			@endforeach
																		@endif
																		</select>

                                                                        <input type="hidden" name="keterangan" id="keterangan_ooo" class="keterangan_ooo" value="">
                                                                        <input type="hidden" name="tanggal_deadline" id="tanggal_deadline_ooo" class="tanggal_deadline_ooo" value="">

																		<br>
																		<br>
																		<br>
																		<br>
																		<br>
																		<a href="#" id="cancel_status_kamar_{{$kamar->id}}" onclick="cancelStatus({{$kamar->id}})" style="top: 15px; display:none">Cancel</a>
																	</form>
																</p>

																<hr class=" p-0 m-0">

																<p class="p-0 m-0">

                                                                @if(false)<!--Hide-->
																{{-- @if(strtotime(@$kamar->end_detail) > strtotime('-1 day', strtotime(date('Y-m-d H:i:s', strtotime(getSystemDate())))) ) --}}
																	@if ($kamar->nama_pelanggan != null)
																	{{-- <a href="#pembayaranmodal_{{$kamar->id}}"
																		id="btn_pembayaranmodal_{{$kamar->id}}"
																		class="text-grey btn-tooltip btn_pembayaranmodal"
																		data-target="#pembayaranmodal"
																		data-toggle="modal"
																		onclick="ClickBtnPembayaran({{@$kamar->booking->id}}, {{$kamar->no_kamar}})"
																		title="Payment">
																			<i class="fas fa-wallet"></i>
																		</a>

																	<a href="#refundmodal_{{$kamar->id}}"
																		id="btn_refundmodal_{{$kamar->id}}"
																		class="text-orange btn-tooltip btn_refundmodal"
																		data-target="#refundmodal"
																		data-toggle="modal"
																		onclick="ClickBtnRefund({{@$kamar->booking->id}}, {{$kamar->no_kamar}})"
																		title="Refund">
																			<i class="fas fa-receipt"></i>
																		</a>

																		<span id="hr_{{$kamar->id}}" class="hrbatas text-slate mx-1">|</span> --}}

																		{{-- Hitung Total Tagihan --}}

																		@php
																			// $nominalpembayaran = 0;
																			// $nominalrefund = 0;
																			// $balance_total = 0;
																			// $nominaltransaksishop = 0;

																			// // Get Booking Detail per item
																			// $nominal_total  = 0;

																			//     // get price per_item with same room_index
																			//     foreach ($booking->bookingDetails as $index_bd => $value_bd) {
																			//         if ($value_bd->room_index == $detail->room_index) {
																			//             $nominal_total += $value_bd->per_item;
																			//         }
																			//     }

																			// $nominalinvoice = @$nominal_total - @$kamar->booking->invoice->total_deposit;
																			// if (@$kamar->booking->invoice->pembayaran) {
																			// 	foreach ($kamar->booking->invoice->pembayaran as $pembayaran) {
																			// 		if($pembayaran->tipe_pembayaran == 1){
																			// 			$nominalpembayaran += $pembayaran->nominal;
																			// 		}
																			// 		else{
																			// 			$nominalrefund += $pembayaran->nominal;
																			// 		}
																			// 	}
																			// }

																			// if (@$kamar->booking->invoice->shop_transaction) {
																			// 	foreach ($kamar->booking->invoice->shop_transaction as $transaction) {
																			// 		$nominaltransaksishop += $transaction->grand_total;
																			// 	}
																			// }

																			// if (count(@$kamar->booking->pembayaran_pos)) {
																			//     foreach ($kamar->booking->pembayaran_pos as $pos) {
																			//         if ($pos->jenis_transaksi == 1) {
																			//             $nominaltransaksishop += $pos->nominal;
																			//         }
																			//     }
																			// }

																			// $balance_total = $nominalinvoice + $nominaltransaksishop - $nominalpembayaran;
																			// $balance_total = $balance_total + $nominalrefund;
																			// $balance_total = array_key_exists($kamar->booking_id, $array_balance_total) ? $array_balance_total[$kamar->booking_id][$kamar->no_kamar] : 0;
																		@endphp

																		<a href="#depositmodal_{{$kamar->id}}"
																		id="btn_depositmodal_{{$kamar->id}}"
																		class="text-teal btn-tooltip btn_depositmodal"
																		data-target="#depositmodal"
																		data-toggle="modal"
																		onclick="ClickBtnDeposit({{@$kamar->booking->id}}, '{{$kamar->no_kamar}}', '{{addslashes($kamar->nama_pelanggan)}}', null, '{{addslashes($kamar->booking)}}')"
																		title="Add Payment">
																			<small><i class="fas fa-money-check-alt
																				"></i></small>
																		</a>

                                                                        @if ($hotel_n_budget)
																		<a href="#transaksimodal_{{$kamar->id}}"
																		id="btn_transaksimodal_{{$kamar->id}}"
																		class="text-success btn-tooltip btn_transaksimodal"
																		data-target="#transaksimodal"
																		data-toggle="modal"
																		onclick="ClickBtnTransaksi({{$kamar->id}}, '{{$kamar->no_kamar}}', {{@$kamar->booking->id}}, '{{@addslashes($kamar->nama_pelanggan)}}')"
																		title="Add Transaction">
																			<small><i class="fas fa-file-medical"></i></small>
																		</a>
                                                                        @endif

																		{{-- Url Sebelumnya: url('rv_downloadguestbill', @$kamar->booking->id) --}}
																		<a href="{{url('invoice-draft/'.@$kamar->guestbill_id)}}"
																		id="linkguestbill_{{$kamar->id}}"
																		class="text-warning btn-tooltip linkguestbill"
																		title="FO Invoice"
																		target="_blank"
																		>
																			<small><i class="fas fa-file-invoice-dollar"></i></small>
																		</a>

																		<a href="#transferbillmodal_{{$kamar->id}}"
																			id="btn_transferbillmodal_{{$kamar->id}}"
																			class="text-blue btn-tooltip btn_transferbillmodal"
																			onclick="ClickBtnTransferBill({{@$kamar->guestbill_id}})"
																			data-target="#transferbillmodal"
																			data-toggle="modal"
																			title="Transfer Bill">
																				<small><i class="icon icon-file-upload2"></i></small>
																			</a>

																		{{-- draft print bill --}}
																		<a href="#draftprintbillmodal_{{$kamar->id}}"
																			id="btn_draftprintbillmodal_{{$kamar->id}}"
																			class="text-brown btn-tooltip btn_draftprintbillmodal"
																			onclick="ClickBtnDraftPrintBill({{@$kamar->guestbill_id}}, {{@$kamar->booking->id}}, '{{ $kamar->no_kamar }}')"
																			data-target="#draftprintbillmodal"
																			data-toggle="modal"
																			title="Print Bill">
																				<small><i class="icon icon-printer2"></i></small>
																			</a>

																		<a href="#/"
																			id="wake_up_call_{{$kamar->id}}"
																			class="text-info btn-tooltip link-status btn-wakeup"
																			data-kamar_id="{{$kamar->id}}"
																			data-wakeup_time="{{$kamar->wakeupcall_time}}"
																			data-target="#wakeUpCallModal"
																			data-toggle="modal"
																			title="Wake Up Call"
																			>
																			<small><i class="fas fa-phone"></i></small>
																		</a>

																		<a href="#"
																		id="changeroom_{{$kamar->id}}"
																		class="text-warning btn-tooltip link-status"
																		title="Change Room"
																			data-target="#changeRoomModal"
																			data-toggle="modal"
																			onclick="changeRoom({{$kamar->id}}, '{{$kamar->no_kamar}}', {{@$kamar->booking->id}}, {{@$kamar->jenisKamars}})"
																		>
																			<small><i class="fas fa-running"></i></small>
																		</a>

																		@endif
																	@endif

																		{{-- <a href="#/"
																		id="link_status_kamar_{{$kamar->id}}"
																		class="text-danger btn-tooltip link-status"
																		onclick="editStatusKamar({{$kamar->id}})"
																		title="Change Room Status"
																		>
																			<small><i class="fas fa-pencil-alt"></i></small>
																		</a> --}}
																</p>

																{{--
																	<a href="{{url('kamars')}}/?edit={{$kamar->id}}"
																	class="text-danger btn-tooltip"
																	style="position:absolute; right: 5px"
																	title="Change Room Status"
																	>
																		<small><i class="fas fa-pencil-alt"></i></small>
																	</a>
																--}}
															</div>
														</div>
													</div>
													@endforeach
												</div>
											</div>

										</ul>
									</li>

								</ul>


								@endforeach
							@else
							<div class="row">
								<div class="col-md-12">
									<div class="alert alert-danger text-center mb-2" role="alert">
										Belum Ada Data Kamar [<a href="{{route('kamars.create')}}">&nbsp;+ Tambahkan&nbsp;</a>]
									</div>
								</div>
							</div>
							@endif
						@else
							@if(null != \Session::get('hotel_id'))
								<div class="row">
									<div class="col-md-12">
										<div class="alert alert-secondary text-center mb-2 p-1" role="alert">
											<h4 class="font-weight-bold m-0">{{tanggalIndo(getSystemDate())}}</h4>
										</div>
									</div>
								</div>
								@if(count($kamars) > 0)
									@foreach($kamars as $key => $val)

									<ul class="nav nav-sidebar" data-nav-type="accordion">

										<li id="accordion_lantai_{{$key}}" value="{{$key}}" class="accordion_lantais nav-item nav-item-submenu">
											<button id="accordion_button_lantai_{{$key}}" class="btn bg-slate nav-link" style="width: 100%; font-size: 16px">
												<i class="icon-stairs"></i>Lantai <span class="font-weight-bold ml-1 text-underline"><u>{{$key}}</u></span>
											</button>

											<ul class="nav nav-group-sub">
												<div class="card p-3">

													<div class="row">
														@foreach($val as $kamar)
														<div class="col-md-3">
															<div class="card font-weight-bolder bg-light" style="min-height: 10em;">
																<div class="card-header px-1 py-1">
																	@if($kamar->booking)
																		@if ($kamar->nama_pelanggan && !in_array(@$kamar->booking->segmentasi_rate_code, [4,5]))
																			{{-- @if(date('Y-m-d', strtotime($kamar->end_detail)) == getSystemDate()) --}}
																				{{-- <a href="detail_kamar_{{$kamar->id}}"
																				id="detail_kamar_{{$kamar->id}}"
																				class="text-info btn-tooltip float-left"
																					data-target="#extendStay"
																					data-toggle="modal"
																					onclick="ClickBtnExtendStay({{@$kamar->booking->id}}, {{$kamar->no_kamar}})"><button type="button" class="btn btn-light">Extend Stay</button></a> --}}
																			{{-- @endif --}}

                                                                            <!-- New Extend Stay: new booking -->
                                                                                {{-- <a href="{{url('bookings/create?g_id=').$kamar->booking->guest_profile_id.'&b_id='.$kamar->booking->id.'&no_kamar='.$kamar->no_kamar}}" target="_blank">
                                                                                    <button type="button" class="btn btn-light">Extend Stay</button>
                                                                                </a> --}}
                                                                            <!-- New Extend Stay: new booking -->
																		@endif
																	@endif

                                                                    @if(strtotime(@$kamar->end_detail) > strtotime('-1 day', strtotime(date('Y-m-d H:i:s', strtotime(getSystemDate())))) )
                                                                        @if ($kamar->nama_pelanggan != null)
                                                                        <div class="dropdownA btn-tooltip float-right" title="More Option">
                                                                            <a href="#" data-toggle="dropdown">
                                                                                <i class="icon-more"></i>
                                                                            </a>
                                                                            <div class="dropdown-menu dropdown-menu-right">

                                                                                <a href="#depositmodal_{{$kamar->id}}"
                                                                                    class="text-teal btn-tooltip dropdown-item"
                                                                                    data-target="#depositmodal"
                                                                                    data-toggle="modal"
                                                                                    onclick="ClickBtnDeposit({{@$kamar->booking->id}}, '{{$kamar->no_kamar}}', '{{addslashes($kamar->nama_pelanggan)}}', null, '{{addslashes($kamar->booking)}}')"
                                                                                    title="Add Payment">
                                                                                        <i class="fas fa-money-check-alt"></i>Add Payment
                                                                                </a>

                                                                                @if ($hotel_n_budget)
                                                                                <a href="#transaksimodal_{{$kamar->id}}"
                                                                                    class="text-success btn-tooltip dropdown-item"
                                                                                    data-target="#transaksimodal"
                                                                                    data-toggle="modal"
                                                                                    onclick="ClickBtnTransaksi({{$kamar->id}}, '{{$kamar->no_kamar}}', {{@$kamar->booking->id}}, '{{addslashes($kamar->nama_pelanggan)}}')"
                                                                                    title="Add Transaction"
                                                                                >
                                                                                    <i class="fas fa-file-medical"></i>Add Transaction
                                                                                </a>
                                                                                @endif

                                                                                <a href="{{url('invoice-draft/'.@$kamar->guestbill_id)}}"
                                                                                    class="text-warning btn-tooltip dropdown-item"
                                                                                    title="FO Invoice"
                                                                                >
                                                                                    <i class="fas fa-file-invoice-dollar"></i>FO Invoice
                                                                                </a>

                                                                                <a href="#transferbillmodal_{{$kamar->id}}"
                                                                                    class="text-blue btn-tooltip dropdown-item"
                                                                                    onclick="ClickBtnTransferBill({{@$kamar->guestbill_id}})"
                                                                                    data-target="#transferbillmodal"
                                                                                    data-toggle="modal"
                                                                                    title="Transfer Bill"
                                                                                >
                                                                                    <i class="icon icon-file-upload2"></i>Transfer Bill
                                                                                </a>

                                                                                <a href="#draftprintbillmodal_{{$kamar->id}}"
                                                                                    class="text-brown btn-tooltip dropdown-item"
                                                                                    onclick="ClickBtnDraftPrintBill({{@$kamar->guestbill_id}}, {{@$kamar->booking->id}}, '{{ $kamar->no_kamar }}')"
                                                                                    data-target="#draftprintbillmodal"
                                                                                    data-toggle="modal"
                                                                                    title="Print Bill"
                                                                                >
                                                                                    <i class="icon icon-printer2"></i>Print Bill
                                                                                </a>

                                                                                <a href="#/"
                                                                                    class="text-info btn-tooltip btn-wakeup dropdown-item"
                                                                                    data-kamar_id="{{$kamar->id}}"
                                                                                    data-wakeup_time="{{$kamar->wakeupcall_time}}"
                                                                                    data-target="#wakeUpCallModal"
                                                                                    data-toggle="modal"
                                                                                    title="Wake Up Call"
                                                                                >
                                                                                    <i class="fas fa-phone"></i>Wake Up Call
                                                                                </a>

                                                                                <a href="#"
                                                                                    class="text-warning btn-tooltip dropdown-item"
                                                                                    title="Change Room"
                                                                                    data-target="#changeRoomModal"
                                                                                    data-toggle="modal"
                                                                                    onclick="changeRoom({{$kamar->id}}, '{{$kamar->no_kamar}}', {{@$kamar->booking->id}}, {{@$kamar->jenisKamars}})"
                                                                                >
                                                                                    <i class="fas fa-running"></i>Change Room
                                                                                </a>

                                                                                <a href="{{url('bookings/create?g_id=').$kamar->booking->guest_profile_id.'&b_id='.$kamar->booking->id.'&no_kamar='.$kamar->no_kamar}}"
                                                                                    class="text-secondary btn-tooltip dropdown-item"
                                                                                    title="Extend Stay"
                                                                                >
                                                                                   <i class="icon-notebook"></i>Extend Stay
                                                                                </a>
                                                                                {{-- <a href="#"
                                                                                    class="text-secondary btn-tooltip dropdown-item"
                                                                                    title="Extend Stay"
                                                                                    onclick='extendstayindividual({{@$kamar->booking->id}}, {{$kamar->no_kamar}})'
                                                                                > --}}

                                                                            </div>
                                                                        </div>
                                                                        @endif
                                                                    @endif

																	<a href="detail_kamar_{{$kamar->id}}"
																		id="detail_kamar_{{$kamar->id}}"
																		class="text-info btn-tooltip float-right"
																			data-target="#detailKamarModal"
																			data-toggle="modal"
																			onclick="ClickBtnDetailKamar({{@$kamar->id}}, {{$kamar->jenisKamars}}, {{$kamar->connecting_room_1?$kamar->connecting_room_1:'0'}}, {{$kamar->connecting_room_2?$kamar->connecting_room_2:'0'}}, '{{$kamar->keterangan_connecting}}')"
																			title="Room Detail"><i class="icon icon-eye"></i></a>
																</div>
																<div class="card-body text-center">
																	{{-- Untuk mengambil nama jenis kamar berdasarkan array nomor_kamar di data booking --}}
																	@php
                                                                    $masih_bisa_di_booking = false;

                                                                    // DEFINE START STATUS BOOKING AND JENIS KAMAR
                                                                    $status_booking_kamar   = '';
                                                                    $jns_booking_kamar      = '';

																	$kamardiblock = false;
																	$namablocker = null;
																	// foreach ($bookings as $booking) {
																	// 	foreach($booking->bookingDetails as $detail) {
																	// 			if ($detail->nomor_kamar == $kamar->no_kamar) {

                                                                    //                 // GET STATUS BOOKING AND JENIS KAMAR
                                                                    //                 $status_booking_kamar = $detail->status_booking;
                                                                    //                 $jns_booking_kamar = $detail->jns_kamar;

																	// 				if ($detail->block_kamar == 1) {
																	// 					$kamardiblock = true;
																	// 					$namablocker = $booking->title.'. '.$booking->nama;

																	// 				} else {
																	// 					$kamardiblock = false;
																	// 					$namablocker = null;
																	// 				}
																	// 			}
																	// 	}
																	// }


																	if($kamar->booking){

                                                                        $jenis_kamar = $jns_booking_kamar ? $jns_booking_kamar : '';

                                                                        if ($status_booking_kamar == 2) {
                                                                            $jenis_kamar = '';
                                                                        }

                                                                        if ($status_booking_kamar == 4 && !in_array(getSystemDate(), [formatDateAwal($kamar->start_detail), formatDateAwal($kamar->end_detail)])) {
                                                                            $masih_bisa_di_booking = true;
                                                                        }

																	}
																	else{
																		$jenis_kamar = '';
																	}
																	@endphp
																	<span>{{$masih_bisa_di_booking ? '' : $jenis_kamar}}</span><br>
																	<span class="{{$kamar->booking ? ( !$masih_bisa_di_booking ? config('custom.status_booking_color.'.@$status_booking_kamar).' font-weight-bold' : '') : ''}}" style="font-size: 120%">
																		@if($kamar->booking && !$masih_bisa_di_booking)
																			@if($status_booking_kamar == 2)
																			{!! !in_array($kamar->status, ['VC']) ? $kamar->no_kamar : '<a href="#" onclick=\'getDataKamar("'.$kamar->no_kamar.'", '.$kamar->jenisKamars.')\' data-toggle="modal"><i class="fas fa-door-open"></i>&nbsp;'.$kamar->no_kamar.'</a>' !!}
																			@else
																			{{$kamar->no_kamar}}
																			@endif
																		@else
																			@if ($kamardiblock == 1)
																				<span class="text-danger">
																					<i class="icon-lock"></i> {{$kamar->no_kamar}}
																				</span> <br>
																				<span>{{$namablocker}}</span>
																			@else
																				{!! !in_array($kamar->status, ['VC']) ? $kamar->no_kamar : '<a href="#" onclick=\'getDataKamar("'.$kamar->no_kamar.'", '.$kamar->jenisKamars.')\' data-toggle="modal"><i class="fas fa-door-open"></i>&nbsp;'.$kamar->no_kamar.'</a>' !!}
																			@endif
																		@endif
																	</span>
																	@if($kamar->booking && !$masih_bisa_di_booking)
																		@if(strtotime($kamar->end_detail) > strtotime('-1 day', strtotime(date('Y-m-d H:i:s', strtotime(getSystemDate())))) )
																		<br>
																		<span class="{{$kamar->booking ? config('custom.status_booking_color.'.$status_booking_kamar).' font-weight-bold' : ''}}" >
																			<a data-no_identitas="{{@$kamar->booking->no_identitas}}" data-name_guest="{{$kamar->nama_pelanggan}}" id="show_guest" data-target="#myModal" data-toggle="modal" href="#myModal">
                                                                                @php
                                                                                    $nama_pelanggan = strlen($kamar->nama_pelanggan) > 9 ? substr($kamar->nama_pelanggan, 0, 9).'...' : $kamar->nama_pelanggan
                                                                                @endphp

																				{!! $kamar->booking->incognito == 1 ? '<i class="fas fa-user-secret"></i>&nbsp;'.$nama_pelanggan.'(Incognito)' : '<i class="fas fa-user"></i>&nbsp;'.substr($nama_pelanggan, 12) !!}
																			</a>
																		</span>
																		@endif
																	@endif
																	{!! getExpectedArrival($kamar->hotel_id, $kamar->no_kamar) !!}


																	@if ($kamar->nama_pelanggan != null)
																		<br><span id="wakeCallTime" value="{{$kamar->wakeupcall_time}}">{{$kamar->wakeupcall_time}}</span>
																			@if ($kamar->wakeupcall_time != null)
																			<a href="{{route('delwakeupcall', $kamar->id) }}" class="btn-tooltip" title="Hapus Wake Up Call">
																				<small><i id="iconcircle" class="text-danger fas fa-times-circle  "></i></small>
																			</a>
																		@endif
																	@endif

																	{{-- <div class="my-1">
																		<a href="lock" id="lock" class="{{ $kamar->status_lock == 1 ? 'text-danger btn-tooltip' : 'text-success' }} btn-tooltip" data-target="#modalStatusLock" onclick="updateStatusLock({{$kamar->no_kamar}}, {{$kamar->status_lock}}, {{$kamar->id}})" data-toggle="modal" title="{{ $kamar->status_lock == 1 ? 'POS Lock' : 'POS Unlock' }}" data-placement="right">
																			@if ($kamar->status_lock == 1)
																				<i class="fas fa-lock"></i>
																			@else
																				<i class="fas fa-lock-open"></i>
																			@endif
																		</a>
																	</div> --}}
																</div>

																<div class="card-header px-1 py-1">
																	@if($kamar->booking)
																		@if ($kamar->nama_pelanggan && !in_array(@$kamar->booking->segmentasi_rate_code, [4,5]))
																			{{-- <div class="text-center "> --}}
																				{{-- <a href="detail_kamar_{{$kamar->id}}"
																				id="detail_kamar_{{$kamar->id}}"
																				class="text-info btn-tooltip"
																					data-target="#detailKamarModal"
																					data-toggle="modal"
																					onclick="ClickBtnExtendStay({{@$kamar->id}}, {{$kamar->jenisKamars}}, {{$kamar->connecting_room_1?$kamar->connecting_room_1:'0'}}, {{$kamar->connecting_room_2?$kamar->connecting_room_2:'0'}})"
																					title="Room Detail"><i class="icon icon-eye"></i></a> --}}

																					{{-- <button type="button" class="btn btn-light" data-toggle="modal" data-target="#historyExtend" onclick="ClickBtnHistoryExtendStay({{ kamar->booking_id }}, {{ kamar->room_index }})">History Extend Stay</button>
																			</div> --}}
																		@endif
																	@endif
																</div>

																<div class="card-footer text-center p-0 m-0" style="line-height: 0.1">

																	<p class="p-0">
																		<form action="{{route('roomview.updatekamar')}}" id="form_kamar_{{$kamar->id}}" method="post">
																			@csrf
																			<input type="hidden" name="id_kamar" value="{{$kamar->id}}">
                                                                            <div style="font-size: 15px">
                                                                                @if($kamar->status != 'VC' )
                                                                                    @if (in_array($kamar->status, ['OOO', "OS"]))
                                                                                    <span class="text-warning text-status" id="text_status_kamar_{{$kamar->id}}">{{$kamar->status}}</span>
                                                                                    @else
                                                                                    <span class="text-danger text-status" id="text_status_kamar_{{$kamar->id}}">{{$kamar->status}}</span>
                                                                                    @endif
                                                                                @else
                                                                                <span class="text-success text-status" id="text_status_kamar_{{$kamar->id}}">{{$kamar->status}}</span>
                                                                                @endif
                                                                                <a href="#/"
                                                                                        id="link_status_kamar_{{$kamar->id}}"
                                                                                        class="text-primary btn-tooltip link-status"
                                                                                        onclick="editStatusKamar({{$kamar->id}})"
                                                                                        title="Change Room Status"
                                                                                        >
                                                                                    <small><i class="icon-arrow-down5"></i></small>
                                                                                </a>
                                                                            </div>

																			<select name="status_kamar" id="status_kamar_{{$kamar->id}}" data-id="{{$kamar->id}}" data-room_no="{{ $kamar->no_kamar }}" class="form-control select-status" style="display:none">
																				@if($kamar->bookingDetail)
																					@foreach(config('custom.status_kamar') as $key => $val)
																						@if (!in_array($key, ['OD', 'OC', 'OOO', 'OS']))
																							@continue
																						@endif
																							<option value="{{$key}}" {{$key == $kamar->status ? 'selected' : ''}}>{{$val}}</option>
																					@endforeach
																				@else
																					@foreach(config('custom.status_kamar') as $key => $val)
																						@if (in_array($key, ['OD', 'OC']))
																							@continue
																						@endif
																							<option value="{{$key}}" {{$key == $kamar->status ? 'selected' : ''}}>{{$val}}</option>
																					@endforeach
																				@endif
																				{{--
																					@if (!in_array($kamar->status, ['OC', 'OD']))
																						@foreach(config('custom.status_kamar') as $key => $val)
																							@if (in_array($key, ['OD', 'OC']))
																								@continue
																							@endif
																								<option value="{{$key}}" {{$key == $kamar->status ? 'selected' : ''}}>{{$val}}</option>
																						@endforeach
																					@else
																						@foreach(config('custom.status_kamar') as $key => $val)
																							@if (!in_array($key, ['OD', 'OC']))
																								@continue
																							@endif
																								<option value="{{$key}}" {{$key == $kamar->status ? 'selected' : ''}}>{{$val}}</option>
																						@endforeach
																					@endif
																				--}}
																			</select>

                                                                            <input type="hidden" name="keterangan" id="keterangan_ooo" class="keterangan_ooo" value="">
                                                                            <input type="hidden" name="tanggal_deadline" id="tanggal_deadline_ooo" class="tanggal_deadline_ooo" value="">

																			<br>
																			<br>
																			<br>
																			<br>
																			<a href="#" id="cancel_status_kamar_{{$kamar->id}}" onclick="cancelStatus({{$kamar->id}})" style="top: 15px; display:none">Cancel</a>
																		</form>
																	</p>

																	<hr class=" p-0 m-0">

																	<p class="p-1 m-0">

                                                                    @if(false)<!--Hide-->
																	{{-- @if(strtotime($kamar->end_date) > strtotime('-1 day', strtotime(date('Y-m-d H:i:s', strtotime(getSystemDate())))) ) --}}
																		@if ($kamar->nama_pelanggan != null)
																		{{-- <a href="#pembayaranmodal_{{$kamar->id}}"
																			id="btn_pembayaranmodal_{{$kamar->id}}"
																			class="text-grey btn-tooltip btn_pembayaranmodal"
																			data-target="#pembayaranmodal"
																			data-toggle="modal"
																			onclick="ClickBtnPembayaran({{@$kamar->booking->id}}, {{$kamar->no_kamar}})"
																			title="Payment">
																				<i class="fas fa-wallet"></i>
																			</a>

																		<a href="#refundmodal_{{$kamar->id}}"
																			id="btn_refundmodal_{{$kamar->id}}"
																			class="text-orange btn-tooltip btn_refundmodal"
																			data-target="#refundmodal"
																			data-toggle="modal"
																			onclick="ClickBtnRefund({{@$kamar->booking->id}}, {{$kamar->no_kamar}})"
																			title="Refund">
																				<i class="fas fa-receipt"></i>
																			</a>

																			<span id="hr_{{$kamar->id}}" class="hrbatas text-slate mx-1">|</span> --}}

																			{{-- Hitung Total Tagihan --}}

																			@php
																				// $nominalpembayaran = 0;
																				// $nominalrefund = 0;
																				// $balance_total = 0;
																				// $nominaltransaksishop = 0;

                                                                                // // Get Booking Detail per item
                                                                                // $nominal_total  = 0;

                                                                                //     // get price per_item with same room_index
                                                                                //     foreach ($booking->bookingDetails as $index_bd => $value_bd) {
                                                                                //         if ($value_bd->room_index == $detail->room_index) {
                                                                                //             $nominal_total += $value_bd->per_item;
                                                                                //         }
                                                                                //     }

																				// $nominalinvoice = @$nominal_total - @$kamar->booking->invoice->total_deposit;
																				// if (@$kamar->booking->invoice->pembayaran) {
																				// 	foreach ($kamar->booking->invoice->pembayaran as $pembayaran) {
																				// 		if($pembayaran->tipe_pembayaran == 1){
																				// 			$nominalpembayaran += $pembayaran->nominal;
																				// 		}
																				// 		else{
																				// 			$nominalrefund += $pembayaran->nominal;
																				// 		}
																				// 	}
																				// }

																				// if (@$kamar->booking->invoice->shop_transaction) {
																				// 	foreach ($kamar->booking->invoice->shop_transaction as $transaction) {
																				// 		$nominaltransaksishop += $transaction->grand_total;
																				// 	}
																				// }

                                                                                // if (count(@$kamar->booking->pembayaran_pos)) {
                                                                                //     foreach ($kamar->booking->pembayaran_pos as $pos) {
                                                                                //         if ($pos->jenis_transaksi == 1) {
                                                                                //             $nominaltransaksishop += $pos->nominal;
                                                                                //         }
                                                                                //     }
                                                                                // }

																				// $balance_total = $nominalinvoice + $nominaltransaksishop - $nominalpembayaran;
																				// $balance_total = $balance_total + $nominalrefund;
                                                                                // $balance_total = $array_balance_total[$kamar->booking_id][$kamar->no_kamar];
																			@endphp

																			<a href="#depositmodal_{{$kamar->id}}"
																			id="btn_depositmodal_{{$kamar->id}}"
																			class="text-teal btn-tooltip btn_depositmodal"
																			data-target="#depositmodal"
																			data-toggle="modal"
																			onclick="ClickBtnDeposit({{@$kamar->booking->id}}, '{{$kamar->no_kamar}}', '{{addslashes($kamar->nama_pelanggan)}}', null, '{{addslashes($kamar->booking)}}')"
																			title="Add Payment">
																				<small><i class="fas fa-money-check-alt
																					"></i></small>
																			</a>

                                                                            @if ($hotel_n_budget)
																			<a href="#transaksimodal_{{$kamar->id}}"
																			id="btn_transaksimodal_{{$kamar->id}}"
																			class="text-success btn-tooltip btn_transaksimodal"
																			data-target="#transaksimodal"
																			data-toggle="modal"
																			onclick="ClickBtnTransaksi({{$kamar->id}}, '{{$kamar->no_kamar}}', {{@$kamar->booking->id}}, '{{addslashes($kamar->nama_pelanggan)}}')"
																			title="Add Transaction">
																				<small><i class="fas fa-file-medical"></i></small>
																			</a>
                                                                            @endif

																			{{-- Url Sebelumnya: url('rv_downloadguestbill', @$kamar->booking->id) --}}
																			<a href="{{url('invoice-draft/'.@$kamar->guestbill_id)}}"
																			id="linkguestbill_{{$kamar->id}}"
																			class="text-warning btn-tooltip linkguestbill"
																			title="FO Invoice"
																			target="_blank"
																			>
																				<small><i class="fas fa-file-invoice-dollar"></i></small>
																			</a>

																			<a href="#transferbillmodal_{{$kamar->id}}"
																				id="btn_transferbillmodal_{{$kamar->id}}"
																				class="text-blue btn-tooltip btn_transferbillmodal"
																				onclick="ClickBtnTransferBill({{@$kamar->guestbill_id}})"
																				data-target="#transferbillmodal"
																				data-toggle="modal"
																				title="Transfer Bill">
																					<small><i class="icon icon-file-upload2"></i></small>
																				</a>

																			{{-- draft print bill --}}
																			<a href="#draftprintbillmodal_{{$kamar->id}}"
																				id="btn_draftprintbillmodal_{{$kamar->id}}"
																				class="text-brown btn-tooltip btn_draftprintbillmodal"
																				onclick="ClickBtnDraftPrintBill({{@$kamar->guestbill_id}}, {{@$kamar->booking->id}}, '{{ $kamar->no_kamar }}')"
																				data-target="#draftprintbillmodal"
																				data-toggle="modal"
																				title="Print Bill">
																					<small><i class="icon icon-printer2"></i></small>
																				</a>

																			<a href="#/"
																				id="wake_up_call_{{$kamar->id}}"
																				class="text-info btn-tooltip link-status btn-wakeup"
																				data-kamar_id="{{$kamar->id}}"
																				data-wakeup_time="{{$kamar->wakeupcall_time}}"
																				data-target="#wakeUpCallModal"
																				data-toggle="modal"
																				title="Wake Up Call"
																				>
																				<small><i class="fas fa-phone"></i></small>
																			</a>

																			<a href="#"
																			id="changeroom_{{$kamar->id}}"
																			class="text-warning btn-tooltip link-status"
																			title="Change Room"
																				data-target="#changeRoomModal"
																				data-toggle="modal"
																				onclick="changeRoom({{$kamar->id}}, '{{$kamar->no_kamar}}', {{@$kamar->booking->id}}, {{@$kamar->jenisKamars}})"
																			>
																				<small><i class="fas fa-running"></i></small>
																			</a>

																			@endif
																		@endif

																			{{-- <a href="#/"
																			id="link_status_kamar_{{$kamar->id}}"
																			class="text-danger btn-tooltip link-status"
																			onclick="editStatusKamar({{$kamar->id}})"
																			title="Change Room Status"
																			>
																				<small><i class="fas fa-pencil-alt"></i></small>
																			</a> --}}
																	</p>

																	{{--
																		<a href="{{url('kamars')}}/?edit={{$kamar->id}}"
																		class="text-danger btn-tooltip"
																		style="position:absolute; right: 5px"
																		title="Change Room Status"
																		>
																			<small><i class="fas fa-pencil-alt"></i></small>
																		</a>
																	--}}
																</div>
															</div>
														</div>
														@endforeach
													</div>
												</div>

											</ul>
										</li>

									</ul>

									{{-- <div class="row">
										<div class="col-md-12">
											<h5 class="font-weight-bold">Lantai {{$key}}</h5>
										</div>
									</div> --}}
									@endforeach
								@else
								<div class="row">
									<div class="col-md-12">
										<div class="alert alert-danger text-center mb-2" role="alert">
											Belum Ada Data Kamar [<a href="{{route('kamars.create')}}">&nbsp;+ Tambahkan&nbsp;</a>]
										</div>
									</div>
								</div>
								@endif
							@else
							<div class="row">
								<div class="col-md-12">
									<div class="alert alert-danger text-center mb-2" role="alert">
										Hotel belum dipilih
									</div>
								</div>
							</div>
                            @endif
						</div>
						@endif
					@endif
					<!-- ERROR END -->

					</div>
				</div>
				<!-- /hover rows -->
			</div>
		</div>
	</div>
	<!-- /content area -->

{{--
--------------------------------------------------------------
Guest Profile
--------------------------------------------------------------
--}}

	<!-- Danger modal -->
	<div id="myModal" class="modal fade" tabindex="-1">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-info" align="center">
					<h6 class="modal-title"><i class="fas fa-user mr-1"></i> Guest Profile</h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<div class="modal-body">

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Guest Name</label>
                        <div class="col-sm-1">:</div>
						<div class="col-sm-8">
							<div id="guest_name" class="form-control-plaintext"></div>
						</div>
					</div>

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Address</label>
                        <div class="col-sm-1">:</div>
						<div class="col-sm-8">
							<div id="guest_address" class="form-control-plaintext"></div>
						</div>
					</div>

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Phone</label>
                        <div class="col-sm-1">:</div>
						<div class="col-sm-8">
							<div id="guest_phone" class="form-control-plaintext"></div>
						</div>
					</div>

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Email</label>
                        <div class="col-sm-1">:</div>
						<div class="col-sm-8">
							<div id="guest_email" class="form-control-plaintext"></div>
						</div>
					</div>

					<div id="warn-text" class="form-group row" style="display: none">
						<div class="col-sm-12">
							<div class="form-control-plaintext text-warning font-weight-semibold">Guest Data Not Found</div>
						</div>
					</div>

				</div>

			</div>
		</div>
	</div>
	<!-- /default modal -->

{{--
--------------------------------------------------------------
Transaksi
--------------------------------------------------------------
--}}

<!-- Transaksi Modal -->
<div id="transaksimodal" class="modal fade">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header bg-success" align="center">
				<h6 class="modal-title"><i class="fas fa-file-medical mr-1"></i> Add Transaction</h6>
				<button type="button" class="close" data-dismiss="modal">&times;</button>
			</div>

			<form action="{{url('rv_savetransaksi')}}" method="POST" id="add_transaction">
				<div class="modal-body">
					@csrf

					@if(Auth::user()->role == 1 || Auth::user()->role == 5)
						<input type="hidden" name="hotel_id" value="{{ Session::get('hotel_id') }}" />
					@else
						<input type="hidden" name="hotel_id" value="{{ hotelID() }}" />
					@endif

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Transaction Date</label>
						<div class="col-sm-9">
							<input type="text" class="form-control" name="transaction_date" value="{{ formatDate(getSystemDate(), 'd-m-Y')}}" readonly>
						</div>
					</div>

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Room Number</label>
						<div class="col-sm-9">
							<div id="tr_no_kamar" class="form-control-plaintext"></div>
							<input id="input_kamar" name="kamar_id" type="hidden">
							<input id="tr_booking_id" name="tr_booking_id" type="hidden">
						</div>
					</div>

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Name</label>
						<div class="col-sm-9">
							<input id="tr_nama_kamar" name="nama" class="form-control border-1 border-teal" type="text">
						</div>
					</div>


                    <div id="maintransaction">

                        <div class="form-group row">
                            <label class="col-form-label col-sm-3">Shop</label>
                            <div class="col-sm-9">
                                {{-- <select onchange="getSelectTipeMenus(this.value), getSelectMenuList(this.value)"  class="form-control border-1 border-teal" name="shop_id[]" id="shop_id"> --}}
                                <select data-add_trans_id="1" class="form-control border-1 border-teal getSelectTipeMenus getSelectMenuList resetjumlahtotal" name="shop_id[]" id="shop_id1">
                                    <option value="">--Select Shop--</option>
                                    @foreach ($shops as $shop)
                                        <option value="{{$shop->id}}"
                                                data-service="{{$shop->services}}"
                                                data-ppn="{{$shop->ppn}}"
                                        >
                                            {{$shop->nama}}
                                        </option>
                                    @endforeach
                                </select>
                            </div>
                        </div>

                        <div class="form-group row">
                            <label class="col-form-label col-lg-3">Item Type</label>
                            <div class="col-lg-9">
                                <select name="tipe_menu_id[]" id="tipe_menu_id1"
                                        class="form-control form-control-select2 getSelectMenuList resetjumlahtotal"
                                        data-container-css-class="border-teal"
                                        data-dropdown-css-class="border-teal"
                                        data-add_trans_id="1"
                                        required
                                        >
                                        {{-- onchange="getSelectMenuList(this.value)" --}}
                                    <option value="">-- Select Item Type --</option>
                                </select>
                            </div>
                        </div>

                        <div class="form-group row">
                            <label class="col-form-label col-lg-3">Menu List</label>
                            <div class="col-lg-9">
                                <select name="menu_id[]" id="menu_id1"
                                        class="form-control form-control-select2"
                                        data-container-css-class="border-teal"
                                        data-dropdown-css-class="border-teal"
                                        data-add_trans_id="1"
                                        onchange="hitungtotal(1)"
                                        required
                                >
                                    <option value="">-- Select Menu --</option>
                                </select>
                            </div>
                        </div>

                        <div class="non_paid_out">
                        <div class="form-group row">
                            <label for="jumlah" class="col-form-label col-lg-3">Qty</label>
                            <div class="col-lg-4">
                                <input type="number" id="jumlah1" name="jumlah[]" onchange="hitungtotal(1)" class="form-control border-teal border-1 hitungjumlah" min="1" value="1" autofocus required>
                            </div>
                            {{-- <label for="diskon" class="col-form-label col-lg-1">Disc.</label>
                            <div class="col-lg-4">
                                <input type="number" id="diskon1" name="diskon[]" onchange="hitungtotal(1)" class="form-control border-teal border-1 " min="0" value="0" autofocus required>
                            </div> --}}
                        </div>
                        </div>

                        <div class="form-group row">
                            <label for="total_biaya" id="label_total_biaya1" class="col-form-label col-lg-3">Sub Total</label>
                            <div class="col-lg-4">
                                <input type="text" id="subtotal1" class="form-control border-teal border-1 changesubtotal" data-add_trans_id="1" onchange="subTotalNominal(this.value, 1)" readonly>
                                <input type="hidden" id="total_biaya1" name="total_biaya[]" class="form-control border-teal border-1 " required>
                            </div>
                        </div>

                        <div class="non_paid_out">
                        <div class="form-group row">
                            <label for="service" class="col-form-label col-lg-3">Service</label>
                            <div class="col-lg-4">
                                <input type="text" id="service1" name="service[]" class="form-control border-teal border-1 " required readonly>
                            </div>
                            <label for="ppn" class="col-form-label col-lg-1">Gov. Tax</label>
                            <div class="col-lg-3">
                                <input type="text" id="ppn1" name="ppn[]" class="form-control border-teal border-1 " required readonly>
                            </div>
                        </div>

                        <div class="form-group row">
                            <label for="grand_total" class="col-form-label col-lg-3">Grand Total</label>
                            <div class="col-lg-4">
                                <input type="text" id="grand_total1" name="grand_total[]" class="form-control border-teal border-1 input_comma_custom" onchange="calculateReverse(this.value, 1)" required>
                            </div>
                        </div>
                        </div>

                        <div class="form-group row">
                            <label for="description_transaction" class="col-form-label col-lg-3">Description</label>
                            <div class="col-lg-9">
                                <input type="text" id="description_transaction1" name="description[]" class="form-control border-teal border-1 description_input">
                            </div>
                        </div>

                    </div>

                    <input type="hidden" id="noadditionaltransaction" value="2">
                    <div class="form-group row">
                        <div class="col-lg-12">
                            <button class="form-control btn-success buttonaddmoretransaction" type="button"><i class="icon-plus22"></i> Add More</button>
                        </div>
                    </div>

                    <div id="additional_transaction">

                    </div>

				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
					<button type="submit" class="btn bg-primary submit-add-transaction">Save</button>
				</div>

			</form>


		</div>
	</div>
</div>
<!-- /default modal -->

{{--
--------------------------------------------------------------
Deposit
--------------------------------------------------------------
--}}

	<!-- Deposit Modal -->
	<div id="depositmodal" class="modal fade">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-teal" align="center">
					<h6 class="modal-title"><i class="fas fa-money-check-alt mr-1"></i> Add Payment</h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<div class="modal-body">
					<form action="{{url('rv_savedeposit')}}" method="POST" id="add_payment">
					@csrf

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Room No.</label>
						<div class="col-sm-9">
							<div id="deposit_no_kamar" class="form-control-plaintext"></div>
							<input type="hidden" id="booking_id" name="booking_id">
							<input type="hidden" id="nomor_kamar_depo_modal" name="nomor_kamar">
						</div>
					</div>

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Name</label>
						<div class="col-sm-9">
							<input id="deposit_nama_kamar" name="nama" class="form-control border-1 border-teal" type="text" required>
						</div>
					</div>

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Payment Method</label>
						<div class="col-sm-9">
							<select name="jenis_deposit"
									id="jenis_deposit"
									class="form-control border-teal border-1"
									required
							>
								<option value="">** Select Payment Method **</option>
								@foreach (config('custom.jenis_deposit') as $key => $val)
								    @if (!in_array($key, [3]))
                                        <option value="{{$key}}">{{$val}}</option>
                                        @continue
                                    @endif
								@endforeach
							</select>
						</div>
					</div>

					<div class="form-group row" id="jenis_deposit_option" style="display: none">
						<label for="platform_deposit" class="col-form-label col-sm-3">Payment Platform</label>
						<div class="col-lg-9">
							<select name="platform_pembayaran_id"
									id="deposit_platform_pembayaran_id"
									class="form-control form-control-select2 border-1 border-1"
							>
								<option value="">** Select Payment Platform **</option>
							</select>
						</div>
					</div>

                    <div class="form-group row wrap_segmentation_option" style="display: none">
						<label for="segmentation" class="col-form-label col-sm-3">Segmentation</label>
						<div class="col-lg-9">
							<select name="segmentation"
									id="segmentation"
									class="form-control form-control-select2 border-1 border-1 segmentation-option"
							>
								<option value="">** Select Segmentation **</option>

                                @foreach (config('custom.segment_ratecodes') as $key => $val)
                                    @if (in_array($key, [1,7,12,13]))
                                        @continue
                                    @endif

                                    <option value="{{$key}}" class="segmentation_value">{{$val}}</option>
                                @endforeach

                                {{-- <option value="999">Transfer</option> --}}
							</select>
						</div>
					</div>

					<div class="form-group row" id="deposit_transfer" style="display: none">
						<label for="daftar_transfer" class="col-form-label col-sm-3">Transfer List</label>
						<div class="col-lg-9">
							<select name="transfer_akunting_id"
									id="deposit_transfer_akunting_id"
									class="form-control form-control-select2 border-1 border-teal"
                                    onchange="insertSelectTransfer();"
							>
								<option value="">-- Select Data (Opsional) --</option>
								@foreach ($transfers as $transfer)
								<option value="{{$transfer->id}}"
										data-voucher="{{$transfer->voucher}}"
										data-nominal = "{{$transfer->nominal}}"
								>
									{{$transfer->nama}} /  Rp.{{ribuan($transfer->nominal)}} ({{$transfer->keterangan}})
								</option>
								@endforeach
							</select>
							<br>
							<span id="warning_deposit_transfer" class="text-danger"></span>
						</div>
					</div>

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Voucher</label>
						<div class="col-lg-9">
							<input type="text" class="form-control" name="voucher" id="voucher_deposit">
						</div>
					</div>

					<div class="form-group row" style="display:none" id="not-transfer">
						<label class="col-form-label col-sm-3">Nominal</label>
						<div class="col-sm-9">
							<input id="nominal_deposit" name="nominal" type="text" class="form-control border-teal border-1 input_comma_custom" required>
                            <span class="text-success" id="nominal_tagihan">Total Bill : </span>
                        </div>
					</div>

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Transaction Date</label>
						<div class="col-sm-9">
							<input type="text" class="form-control" name="transaction_date" id="transaction_date" value="{{formatDate(getSystemDate())}}" readonly>
						</div>
					</div>

                    <div class="form-group row">
                        <label for="description_payment" class="col-form-label col-lg-3">Description</label>
                        <div class="col-lg-9">
                            <input type="text" id="description_payment" name="description" class="form-control border-teal border-1">
                        </div>
                    </div>

				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
					<button type="submit" class="btn bg-primary submit-add-payment submit-button-check">Save</button>
				</div>

				</form>


			</div>
		</div>
	</div>
	<!-- /default modal -->

{{--
--------------------------------------------------------------
Draft Print Modal
--------------------------------------------------------------
--}}

	<!-- Draft Print Modal -->
	<div id="draftprintbillmodal" class="modal fade" tabindex="-1">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-brown" align="center">
					<h6 class="modal-title"><i class="icon icon-printer2 mr-1"></i> Print Bill</h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<form action="{{url('rv_printdraft')}}" id="printdraftform" method="POST">
					@csrf
                    <input type="hidden" id="draftprintbillmodal_invoiceid" name="invoice_id">
					<div class="modal-body">

							<table class="table datatable-basic-invoice table-hover" id="tabledraftprintbill">
								<thead>
									<tr>
										<th>#</th>
										<th>No.</th>
	                                    <th>Date</th>
										<th>Description</th>
										<th>Qty</th>
										<th>Total</th>
										{{-- <th class="text-center">Actions</th> --}}
									</tr>
								</thead>
								<tbody>

								</tbody>
							</table>

					</div>

					<div class="modal-footer">
						<button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
						<button type="submit" class="btn bg-primary" onclick="$('#printdraftform').attr('target', '_blank');">Print</button>
					</div>

				</form>
			</div>
		</div>
	</div>
	<!-- /default modal -->

{{--
--------------------------------------------------------------
Wakeup Call
--------------------------------------------------------------
--}}

    <!--MODAL-->
    <div id="wakeUpCallModal" class="modal fade" tabindex="-1">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-info" align="center">
					<h6 class="modal-title"><i class="fas fa-phone mr-1"></i>Wake Up Call</h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

                <form id="userdata_edit" action="{{route('setwakeupcall')}}" method="post">
                    @method('patch')
                    @csrf

                    <div class="modal-body">
                        <input type="hidden" name="kamar_id" id="kamar_id" value="" class="form-control mb-3" required>
                        <div class="form-group row">
                            <label class="col-form-label col-sm-3">Set date :</label>
                            <div class="col-sm-9">
                                <input type="" name="wakeupcalldate" id="wakeupcalldate" class="form-control daterange-single-wakeup"  value="">
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-form-label col-sm-3">Set time :</label>
                            <div class="col-sm-9">
                                <input type="text" name="wakeupcalltime" id="wakeupcalltime" class="form-control input-timepicker"  value="">
                            </div>
                        </div>
                    </div>

                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                        <button type="submit" id="submit_wakeUpCall" class="btn btn-primary">Submit</button>
                    </div>

                </form>
			</div>
		</div>
	</div>
  <!--/MODAL-->
  <!--ALERT-->
    <div id="wakeCallTimeAlert" data-bs-backdrop="static" data-bs-keyboard="false" class="modal fade" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header bg-danger" align="center">
                    <h6 class="modal-title"><i class="fas fa-clock  mr-1"></i>Alert</h6>
                    <button type="button" class="close" onclick="location.reload()">&times;</button>
                </div>
                <div class="modal-body">
                    Peringatan Waktu Wake Up Call! <br>
                    Nama
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" onclick="location.reload()">Close</button>
                </div>
            </div>
        </div>
    </div>
  <!--ALERT-->

{{--
--------------------------------------------------------------
Quick Booking
--------------------------------------------------------------
--}}
    <!-- Quick Booking Modal -->
    <div id="bookingModal" class="modal fade">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header bg-info" align="center">
                    <h6 class="modal-title"><i class="fas fa-door-open"></i> Booking Room <span id="text_no_kamar"></span></h6>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>

                <div class="modal-body scroll-vertical" style="max-height: 600px">
                    <form action="{{url('quick-booking')}}"  method="POST" id="form-quick-booking" class="form-validate-jquery">
                        @csrf
                        <input type="hidden" name="hotel_id" id="hotel_id_booking" value="{{ Session::get('hotel_id') ?? \Auth::user()->hotel_id }}" />
                        <input type="hidden" name="nomor_kamar" id="nomor_kamar">
                        <input type="hidden" name="segmentasi_rate_code" id="segmentasi_rate_code" value="7">
                        <input type="hidden" name="check_system_date" value="{{ getSystemDate() }}">
                        <div class="form-group row">
                            <label class="col-form-label col-sm-2">Reservation Number</label>
                            <div class="col-lg-10">
                                <input type="text" id="kode_booking" name="kode_booking" value="Auto Generate" class="form-control" readonly>
                            </div>
                        </div>

                        <div class="form-group row">
                            <label class="col-form-label col-sm-2">Name</label>
                            <div class="col-lg-10">
                                <input class="form-control" list="datalistOptions" name="nama" id="nama_booking" placeholder="Please input name here ..." autocomplete="off" required>
                                <datalist id="datalistOptions">
                                @foreach($autocompletes as $autocomplete)
                                <option value="{{$autocomplete->name}} - {{$autocomplete->id_cardno}}" data='{{json_encode($autocomplete)}}' data-id="{{ $autocomplete->id }}">{{$autocomplete->address}}</option>
                                @endforeach
                                </datalist>
                                <input type="hidden" name="guest_profile_id" id="guest_profile_id">
                                <div id="show_remark" class="pl-1 pt-1 text-danger"></div>
                            </div>
                        </div>

                        <div class="form-group row">
                            <label for="jns_kelamin" class="col-form-label col-lg-2">Gender</label>
                            <div class="col-lg-10">
                                <div class="form-check form-check-inline">
                                    <label class="form-check-label">
                                        <input type="radio" class="form-check-input-styled" name="jns_kelamin" value="Laki-laki" checked data-fouc>
                                        Male
                                    </label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <label class="form-check-label">
                                        <input type="radio" class="form-check-input-styled" name="jns_kelamin" value="Perempuan" data-fouc>
                                        Female
                                    </label>
                                </div>
                            </div>
						</div>
                        {{--
                            <div class="form-group row">
                                <label class="col-form-label col-sm-2">Segmentasi</label>
                                <div class="col-lg-10">
                                    <select name="segmentasi_rate_code"
                                            id="segmentasi_rate_code"
                                            class="form-control form-control-select2"
                                            required
                                    >
                                        <option value="">-- Select Segment --</option>
                                        @foreach(config('custom.segment_ratecodes') as $key => $val)
                                        <option value="{{$key}}">{{$val}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="form-group row">
                            <label class="col-form-label col-sm-2">Company</label>
                            <div class="col-lg-10">
                                <select name="company_id" id="company_id" class="form-control form-control-select2" disabled>
                                    <option value="">-- Pilih Company --</option>
                                    @foreach($companies as $company)
                                    <option value="{{$company->id}}"
                                            data-status="{{$company->status_ledger}}"
                                            data-status-text="{{ config('custom.status_ledger')[$company->status_ledger] }}"
                                            data-perusahaan="{{$company->comp_title}} {{$company->name}}"
                                    >{{$company->comp_title}} {{$company->name}}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="form-group row">
                            <div class="col-sm-2"></div>
                            <div class="col-lg-10">
                                <span class="text-danger" id="company_danger"></span>
                            </div>
                        </div>
                        --}}
                        <div class="form-group row">
                            <label class="col-form-label col-sm-2">Room Type</label>
                            <div class="col-lg-10">
                                <select name="jns_kamar"
                                        id="jns_kamar";
                                        data-idx="0"
                                        class="form-control form-control-select2"
                                        required
                                >
                                    <option data-id=""
                                            data-diskon=""
                                            data-kapasitas="0"
                                            value="">-- Choose Room Type --</option>
                                </select>
                                <input type="hidden" name="diskon" id="diskon" value="0">
                                <input type="hidden" name="disctype" id="disctype" value="0">
                                <input type="hidden" name="jenis_kamar_id" id="jenis_kamar_id">
                                {{-- <input type="hidden" name="pax[]" id="pax"> --}}
                            </div>
                        </div>

                        <div class="form-group row">
                            <label class="col-form-label col-sm-2">Pax</label>
                            <div class="col-lg-10">
                                <input type="number" name="pax" id="pax" class="form-control" value="0" onchange="calculatePrice(0)">
                            </div>
                        </div>

                        <div class="form-group row">
                            <label class="col-form-label col-sm-2">Rate Code</label>
                            <div class="col-lg-10">
                                <select name="rate_codes"
                                        id="rate_code"
                                        data-idx="0"
                                        class="form-control form-control-select2"
                                        onchange="calculatePrice(1)"
                                        required
                                >
                                    <option value="" data-id="0" data-harga="0" data-include_breakfast="0">-- Select Rate Code --</option>
                                </select>
                                <input type="hidden" name="per_item_total" id="per_item_total">
                                <input type="hidden" name="per_item_services" id="per_item_services">
                                <input type="hidden" name="per_item_tax" id="per_item_tax">
                                <input type="hidden" name="per_item_arr" id="per_item_arr">
                                <input type="hidden" name="per_item_arr_services" id="per_item_arr_service">
                                <input type="hidden" name="per_item_arr_tax" id="per_item_arr_tax">
                                <input type="hidden" id="selratecodeid" name="selratecodeid">
                                <input type="hidden" id="ratecode_id" name="ratecode_id">
                                <input type="hidden" name="arrangement_id" id="per_arrangement_id">
                            </div>
                        </div>

                        <div class="form-group row">
                            <label class="col-form-label col-sm-2">Arrangement</label>
                            <div class="col-lg-10">
                                <select name="arrangement_codes"
                                        id="arrangement_code"
                                        data-idx="0"
                                        class="form-control form-control-select2"
                                        onchange="calculatePrice(0)"
                                        required
                                >
                                    <option value="" data-harga="0">-- Select Arrangement --</option>
                                    @foreach($arrangements as $arrangement)
                                        @php
                                        $harga_arrangement = 0;
                                        $service_arrangement = 0;
                                        $tax_arrangement = 0;
                                        @endphp

                                        @if($arrangement->arrangementCodeDetail)
                                            @foreach($arrangement->arrangementCodeDetail as $arrangement_detail)
                                                @php
                                                // $service_arrangement_temp = $arrangement_detail->harga * ($arrangement_detail->shop ? ($arrangement_detail->shop->services/100) : 0);
                                                // $service_arrangement += $service_arrangement_temp;
                                                // $tax_arrangement_temp = ($service_arrangement_temp * ($arrangement_detail->shop ? ($arrangement_detail->shop->ppn/100) : 0)) + $service_arrangement_temp;
                                                // $tax_arrangement += $tax_arrangement_temp;
                                                // $harga_arrangement += $arrangement_detail->harga;
                                                $tax_shop = $arrangement_detail->shop ? $arrangement_detail->shop->ppn : 0;
                                                $service_shop = $arrangement_detail->shop ? $arrangement_detail->shop->services : 0;

                                                $tax_arrangement_temp = ($arrangement_detail->harga * $tax_shop)/(100+$tax_shop);
                                                $tax_arrangement += $tax_arrangement_temp;

                                                $harga_exclude_tax = $arrangement_detail->harga - $tax_arrangement_temp;
                                                $service_arrangement_temp = ($harga_exclude_tax * $service_shop)/(100+$service_shop);
                                                $service_arrangement += $service_arrangement_temp;

                                                $harga_arrangement += $arrangement_detail->harga;
                                                @endphp
                                            @endforeach
                                        @endif

                                        <option value="{{$arrangement->arrangement_code}}"
                                                data-id="{{$arrangement->id}}"
                                                data-harga="{{$harga_arrangement}}"
                                                data-service="{{$service_arrangement}}"
                                                data-tax="{{$tax_arrangement}}"
                                        >{{$arrangement->arrangement_code}}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>

                        <!-- For Container Hidden Arrangement -->
                        <div id="hidden_arrangement_code_container">
                        </div>

                        <div class="form-group row">
                            <label class="col-form-label col-sm-2">Room Number Availability</label>
                            <div class="col-lg-10">
                                    <button type="button" data-toggle="modal" data-target="#modal_room_availability" class="btn btn-primary addError" onclick="openModalRoomAvailability()">
                                        <i class="fab fa-buromobelexperte"></i>
                                    </button>
                            </div>
                        </div>

                        <div class="form-group row">
                            <label class="col-form-label col-sm-2">Night</label>
                            <div class="col-lg-10">
                                <input type="number" class="form-control" id="jumlah_malam" name="jml_malam" min="1" value="1">
                            </div>
                        </div>

                        <div class="form-group row">
                            <label class="col-form-label col-sm-2">Start Date</label>
                            <div class="col-lg-10">
                                <input type="text"
                                        name="start_date"
                                        id="start_date"
                                        class="form-control"
                                        value="{{ dateFormat(getSystemDate(), 'd-m-Y') }}" readonly
                                >
                            </div>
                        </div>

                        <div class="form-group row">
                            <label class="col-form-label col-sm-2">End Date</label>
                            <div class="col-lg-10">
                                <input type="text"
                                        name="end_date"
                                        id="end_date"
                                        class="form-control"
                                        value="{{ date( 'd-m-Y', strtotime( getSystemDate().' +1 day' ) ) }}"
                                        readonly
                                >
                            </div>
                        </div>

                        <div class="form-group row">
                            <label class="col-form-label col-sm-2">Discount</label>
                            <div class="col-lg-3">
                                <select name="discount_type_man" id="discount_type_man" class="form-control form-control-select2" onchange="opsidiskonbooking(this.value)">
                                    <option value="">--Disable--</option>
                                    <option value="1">Percentage</option>
                                    <option value="2">Nominal</option>
                                </select>
                            </div>
                            <div class="col-lg-3">
                                <input type="text" class="form-control" name="discount_value_man" id="discount_value_man" value="0" onchange="calculatePrice(1, '', 'diskon')" disabled>
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-form-label col-sm-2" id="roomrate_label">Room Rate/Night</label>
                            <div class="col-lg-10">
                                <input type="text" class="form-control" name="per_item" id="per_item" value="0" onchange="recountWalkinRate()">
                            </div>
                        </div>

                        <div class="form-group row" id="total_rate_label">
                            <label class="col-form-label col-sm-2">Total Rate</label>
                            <div class="col-lg-10">
                                <input type="text" id="total_biaya_booking_text" oninput="formatRibuan()" class="form-control" readonly>
                                <input type="hidden" name="total_biaya" id="total_biaya_booking" class="form-control">
                                <span class="text-danger" id="ket_diskon"></span>
                            </div>
                        </div>

                        <legend>Payment Section</legend>

                        <div class="form-group row">
                            <label class="col-form-label col-lg-2">Use Payment:</label>
                            <div class="col-lg-10">
                                <div class="form-check form-check-inline">
                                    <label class="form-check-label">
                                        <input type="radio"
                                                name="type_payment_book"
                                                class="form-check-input-styled type_payment_book"
                                                style="border-color: red"
                                                value="0"
                                                data-fouc
                                                checked
                                        >
                                        No
                                    </label>
                                </div>

                                <div class="form-check form-check-inline">
                                    <label class="form-check-label">
                                        <input type="radio"
                                                name="type_payment_book"
                                                class="form-check-input-styled type_payment_book"
                                                style="border-color: red"
                                                value="1"
                                                data-fouc
                                        >
                                        Yes
                                    </label>
                                </div>
                            </div>
                        </div>

                        <div id="section_payment_book" style="display: none;">
                            <div class="form-group row">
                                <label class="col-form-label col-sm-2">Payment Method</label>
                                <div class="col-sm-9">
                                    <select name="jenis_deposit"
                                            id="jenis_deposit_book"
                                            class="form-control border-teal border-1"
                                    >
                                        <option value="">** Select Payment Method **</option>
                                        @foreach (config('custom.jenis_deposit') as $key => $val)
                                            @if (!in_array($key, [3,5]))
                                                <option value="{{$key}}">{{$val}}</option>
                                                @continue
                                            @endif
                                        @endforeach
                                    </select>
                                </div>
                            </div>

                            <div class="form-group row" id="jenis_deposit_option_book" style="display: none">
                                <label for="platform_deposit" class="col-form-label col-sm-2">Payment Platform</label>
                                <div class="col-lg-9">
                                    <select name="platform_pembayaran_id"
                                            id="deposit_platform_pembayaran_id_book"
                                            class="form-control form-control-select2 border-1 border-1"
                                    >
                                        <option value="">** Select Payment Platform **</option>
                                    </select>
                                </div>
                            </div>

                            <div class="form-group row wrap_segmentation_option_book" style="display: none">
                                <label for="segmentation_book" class="col-form-label col-sm-2">Segmentation</label>
                                <div class="col-lg-9">
                                    <select name="segmentation"
                                            id="segmentation_book"
                                            class="form-control form-control-select2 border-1 border-1 segmentation-option_book"
                                    >
                                        <option value="">** Select Segmentation **</option>

                                        @foreach (config('custom.segment_ratecodes') as $key => $val)
                                            @if (in_array($key, [1,7,12,13]))
                                                @continue
                                            @endif

                                            <option value="{{$key}}" class="segmentation_value_book">{{$val}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>

                            <div class="form-group row" id="deposit_transfer_book" style="display: none">
                                <label for="daftar_transfer_book" class="col-form-label col-sm-2">Transfer List</label>
                                <div class="col-lg-9">
                                    <select name="transfer_akunting_id"
                                            id="deposit_transfer_akunting_id_book"
                                            class="form-control form-control-select2 border-1 border-teal"
                                            onchange="insertSelectTransfer();"
                                    >
                                        <option value="">-- Select Data (Opsional) --</option>
                                        @foreach ($transfers as $transfer)
                                        <option value="{{$transfer->id}}"
                                                data-voucher="{{$transfer->voucher}}"
                                                data-nominal = "{{$transfer->nominal}}"
                                        >
                                            {{$transfer->nama}} /  Rp.{{ribuan($transfer->nominal)}} ({{$transfer->keterangan}})
                                        </option>
                                        @endforeach
                                    </select>
                                    <br>
                                    <span id="warning_deposit_transfer_book" class="text-danger"></span>
                                </div>
                            </div>

                            <div class="form-group row">
                                <label class="col-form-label col-sm-2">Voucher</label>
                                <div class="col-lg-9">
                                    <input type="text" class="form-control" name="voucher" id="voucher_deposit_book">
                                </div>
                            </div>

                            <div class="form-group row" style="display:none" id="not-transfer-book">
                                <label class="col-form-label col-sm-2">Nominal</label>
                                <div class="col-sm-9">
                                    <input id="nominal_deposit_book" name="nominal" type="text" class="form-control border-teal border-1 input_comma_custom">
                                    {{-- <span class="text-success" id="nominal_tagihan_book">Total Bill : </span> --}}
                                </div>
                            </div>

                            <div class="form-group row">
                                <label class="col-form-label col-sm-2">Transaction Date</label>
                                <div class="col-sm-9">
                                    <input type="text" class="form-control" name="transaction_date" id="transaction_date_book" value="{{formatDate(getSystemDate())}}" readonly>
                                </div>
                            </div>

                            <div class="form-group row">
                                <label for="description_payment_book" class="col-form-label col-lg-2">Description</label>
                                <div class="col-lg-9">
                                    <input type="text" id="description_payment_book" name="description" class="form-control border-teal border-1">
                                </div>
                            </div>
                        </div>

                        <div class="modal-footer">
                            <button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
                            <button type="submit" id="submit" class="btn btn-success submit-quick-booking">Submit</button>
                        </div>
                    </form>
                </div>
			</div>
		</div>
	</div>
  	<!-- /default modal -->

{{--
--------------------------------------------------------------
Pembayaran + Refund
--------------------------------------------------------------
--}}

  <!-- Pembayaran Modal -->
	<div id="pembayaranmodal" class="modal fade" tabindex="-1">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-grey" align="center">
					<h6 class="modal-title"><i class="fas fa-wallet mr-1"></i> Add Payment</h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<div class="modal-body">
					<form action="{{url('rv_savepembayaran')}}" method="POST">
					@csrf

					@if(Auth::user()->role == 1 || Auth::user()->role == 5)
						<input type="hidden" name="hotel_id" value="{{ Session::get('hotel_id') }}" />
					@else
						<input type="hidden" name="hotel_id" value="{{ hotelID() }}" />
					@endif
						<input type="hidden" id="pembayaran_booking_id" name="booking_id">

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Nama</label>
						<div class="col-sm-9">
							<input id="nama" name="nama" class="form-control border-1 border-teal" type="text">
						</div>
					</div>

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Segmentasi</label>
						<div class="col-lg-9">
							<select name="segment" id="pembayaran_segment" class="form-control form-control-select2 border-1 border-1" required >
								<option value="">-- Select Segment --</option>
								@foreach(config('custom.segment_ratecodes') as $key => $val)
									<option value="{{$key}}">{{$val}}</option>
								@endforeach
							</select>
						</div>
					</div>

					<div class="form-group row" id="pembayaran_company_ledger" style="display: none">
						<label class="col-form-label col-sm-3">City Ledger</label>
						<div class="col-lg-9">
							<select name="company_ledger" id="company_ledger" class="form-control form-control-select2 border-1 border-1">
								<option value="">-- Pilih City Ledger --</option>
								@foreach($company_ledgers as $comled)
									<option value="{{$comled->id}}">{{$comled->name}}</option>
								@endforeach
							</select>
						</div>
					</div>

					<div class="form-group row">
						<label for="total_biaya" class="col-form-label col-lg-3">Nominal</label>
						<div class="col-lg-9">
							<input type="number" id="nominal" name="nominal" class="form-control border-teal border-1 " required>
						</div>
					</div>

				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
					<button type="submit" class="btn bg-primary submit-button-check">Save</button>
				</div>

				</form>


			</div>
		</div>
	</div>
	<!-- /default modal -->


	<!-- Refund Modal -->
	<div id="refundmodal" class="modal fade" tabindex="-1">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-orange" align="center">
					<h6 class="modal-title"><i class="fas fa-wallet mr-1"></i> Tambah Refund</h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<div class="modal-body">
					<form action="{{url('rv_saverefund')}}" method="POST">
					@csrf

					@if(Auth::user()->role == 1 || Auth::user()->role == 5)
						<input type="hidden" name="hotel_id" value="{{ Session::get('hotel_id') }}" />
					@else
						<input type="hidden" name="hotel_id" value="{{ hotelID() }}" />
					@endif
						<input type="hidden" id="refund_booking_id" name="booking_id">

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Nama</label>
						<div class="col-sm-9">
							<input id="nama" name="nama" class="form-control border-1 border-teal" type="text">
						</div>
					</div>

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Segmentasi</label>
						<div class="col-lg-9">
							<select name="segment" id="refund_segment" class="form-control form-control-select2 border-1 border-1" required >
								<option value="">-- Select Segment --</option>
								@foreach(config('custom.segment_ratecodes') as $key => $val)
									<option value="{{$key}}">{{$val}}</option>
								@endforeach
							</select>
						</div>
					</div>

					<div class="form-group row" id="refund_company_ledger" style="display: none">
						<label class="col-form-label col-sm-3">City Ledger</label>
						<div class="col-lg-9">
							<select name="company_ledger" id="company_ledger" class="form-control form-control-select2 border-1 border-1">
								<option value="">-- Pilih City Ledger --</option>
								@foreach($company_ledgers as $comled)
									<option value="{{$comled->id}}">{{$comled->name}}</option>
								@endforeach
							</select>
						</div>
					</div>

					<div class="form-group row">
						<label for="total_biaya" class="col-form-label col-lg-3">Nominal Refund</label>
						<div class="col-lg-9">
							<input type="number" id="nominal_refund" name="nominal" class="form-control border-teal border-1 input_comma_custom" required>
						</div>
					</div>

				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
					<button type="submit" class="btn bg-primary submit-button-check">Save</button>
				</div>

				</form>


			</div>
		</div>
	</div>
	<!-- /default modal -->


    <!-- Pembayaran + Checkout -->

	<!-- Checkout Pembayaran Modal -->
	<div id="checkout_pembayaranmodal" class="modal fade">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-success" align="center">
					{{-- <h6 class="modal-title"><i class="fas fa-wallet mr-1"></i> Pembayaran & Checkout</h6> --}}
					<h6 class="modal-title"><i class="fas fa-wallet mr-1"></i><span id="modal_co_title">Payment & Checkout</span></h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<div class="modal-body">
					<form action="{{url('rv_savepembayaran_checkout')}}"
						  method="POST"
						  id="form_checkout"
						  class="form-validate-checkout"
					>
					@csrf
					@if(Auth::user()->role == 1 || Auth::user()->role == 5)
						<input type="hidden" name="hotel_id" value="{{ Session::get('hotel_id') }}" />
					@else
						<input type="hidden" name="hotel_id" value="{{ hotelID() }}" />
					@endif
						<input type="hidden" id="checkout_pembayaran_booking_id" name="booking_id">
						<input type="hidden" id="checkout_pembayaran_room_index" name="room_index">
						<input type="hidden" id="checkout_co_awal_status" name="co_awal_status">

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Name</label>
						<div class="col-sm-9">
							<input id="checkout_pembayaran_nama" name="nama" class="form-control border-1 border-teal addError" type="text">
						</div>
					</div>

                    <div class="form-group row element_co_awal">
						<label class="col-form-label col-sm-3">Payment Method</label>
						<div class="col-lg-9">
							<!-- Kode lama ada onchange="setJenisPembayaran()" -->
							<select name="jenis_pembayaran_id"
									id="checkout_jenis_pembayaran"
									onchange="setJenisPembayaran()"
									class="form-control form-control-select2 addError"
									required
							>
								<option value="">** Select Payment Method **</option>
								@foreach(config('custom.jenis_pembayaran') as $key => $value)
                                    @if(!in_array($key, [3]))
                                    <option value="{{$key}}">{{$value}}</option>
                                    @endif
								@endforeach
							</select>
						</div>
					</div>

					<div class="form-group row" id="checkout_jenis_pembayaran_option" style="display: none">
						<label for="platform_pembayaran" class="col-form-label col-sm-3">Payment Platform</label>
						<div class="col-lg-9">
							<select name="platform_pembayaran_id"
									id="platform_pembayaran_id"
									class="form-control form-control-select2 border-1 border-1 addError"
							>
								<option value="">** Select Payment Platform **</option>
							</select>
						</div>
					</div>

					<div class="form-group row" id="pembayaran_transfer" style="display: none">
						<label for="platform_pembayaran" class="col-form-label col-sm-3">Transfer List</label>
						<div class="col-lg-9">
							<select name="transfer_akunting_id"
									id="pembayaran_transfer_akunting_id"
									class="form-control form-control-select2 border-1 border-teal addError"
							>
								<option value="">-- Select Data(Opsional) --</option>
								@foreach ($transfers as $transfer)
								<option value="{{$transfer->id}}"
										data-voucher="{{$transfer->voucher}}"
										data-nominal = "{{$transfer->nominal}}"
								>
									{{$transfer->nama}} /  Rp.{{ribuan($transfer->nominal)}} ({{$transfer->keterangan}})
								</option>
								@endforeach
							</select>
							<br>
							<span id="warning_pembayaran_transfer" class="text-danger"></span>
						</div>
					</div>

                    <div class="form-group row">
                        <div class="col-lg-3"></div>
                        <div class="col-lg-8">
                            <span class="text-danger" id="alert-limit-ledger"></span>
                        </div>
                    </div>

                    <div class="form-group row wrap_segmentation_option" style="display: none">
						<label class="col-form-label col-sm-3">Segmentation</label>
						<div class="col-lg-9">
							<select name="segment" id="checkout_pembayaran_segment" class="form-control form-control-select2 border-1 border-1 addError">
								<option value="">-- Select Segmentation --</option>
                                @foreach (config('custom.segment_ratecodes') as $key => $val)
                                    @if (in_array($key, [1,7,12,13]))
                                        @continue
                                    @endif

                                    <option value="{{$key}}" class="segmentation_value">{{$val}}</option>
                                @endforeach

                                {{-- <option value="999">Transfer</option> --}}
							</select>
						</div>
					</div>

                    <div class="form-group row element_co_awal">
						<label class="col-form-label col-sm-3">Voucher</label>
						<div class="col-lg-9">
							<input type="text" class="form-control addError" name="voucher" id="voucher">
						</div>
					</div>

                    <!-- <div class="form-group row" id="checkout_jenis_pembayaran_option" style="display: none">
                        <label class="col-form-label col-sm-3"></label>
                        <div class="col-lg-9" id="form_deposit">
                            <div class="row">
                                <div class="col-md">
                                    No. Kartu
                                </div>
                                <div class="col-md">
                                    Bank
                                </div>
                            </div>
                            <div class="row mb-2" data-idx="0" id="row_jenis_pembayaran">
                                <div class="col-md">
                                    <input type="text" name="no_kartu" id="checkout_no_kartu" class="form-control" disabled required>
                                </div>
                                <div class="col-md">
                                    <input type="text" name="bank" id="checkout_bank" class="form-control" disabled required>
                                </div>
                            </div>
                        </div>
                    </div> -->

					{{-- <div class="form-group row">
						<label class="col-form-label col-sm-3">Segmentation</label>
						<div class="col-lg-9">
							<select name="segment" id="checkout_pembayaran_segment" class="form-control form-control-select2 border-1 border-1 addError" required disabled>
								<option value="">-- Select Segmentation --</option>
								@foreach(config('custom.segment_ratecodes') as $key => $val)
									<option value="{{$key}}">{{$val}}</option>
								@endforeach
							</select>
						</div>
					</div> --}}

					{{-- <div class="form-group row" id="checkout_pembayaran_company_ledger" style="display: none">
						<label class="col-form-label col-sm-3" for="company_ledger"> City Ledger</label>
						<div class="col-lg-9">
							<select name="company_ledger" id="company_ledger_pembayaran_checkout" class="form-control addError" disabled>
								<option value="">-- Select City Ledger --</option>
								@foreach($company_ledgers as $comled)
								<option value="{{$comled->id}}"
										data-status="{{$comled->status_ledger}}"
										data-status-text="{{ config('custom.status_ledger')[$comled->status_ledger] }}"
										data-perusahaan="{{$comled->comp_title}} {{$comled->name}}"
								>{{$comled->comp_title}} {{$comled->name}}</option>
								@endforeach
							</select>
						</div>
						<div class="col-lg-3"></div>
						<div class="col-lg-9">
							<span class="text-danger" id="company_danger"></span>
						</div>
					</div> --}}

                    <div class="form-group row">
                        <label class="col-form-label col-lg-2">Bill type<span class="text-danger">*</span> </label>
                        <div class="col-lg-10">
                            <div class="form-check form-check-inline">
                                <label class="form-check-label">
                                    <input type="radio" class="form-check-input-styled typebillco" name="typebill" id="tipe-bill-single-co" value="single" checked data-fouc>
                                    Already generated rate only
                                </label>
                            </div>
                            <div class="form-check form-check-inline">
                                <label class="form-check-label">
                                    <input type="radio" class="form-check-input-styled typebillco" name="typebill" id="tipe-bill-multiple-co" value="multiple" data-fouc>
                                    All remaining rate to today
                                </label>
                            </div>
                        </div>
                    </div>

                    @if (true)
                    <div class="m-2">
                       <label> Details : </label>
                        <table class="table datatable-basic table-hover" >
                            <thead>
                                <tr>
                                    <th>Description</th>
                                    <th>Qty</th>
                                    <th style="text-align:right">Price</th>
                                    <th style="text-align:right">Total</th>
                                </tr>
                            </thead>
                            <tbody id="tabelb_rincian_depo_booking">
                            </tbody>
                            <tbody class="tabelb_rincian_pembayaran_sebagian_booking">
                            </tbody>
                            <tbody id="tabelb_rincian_booking">
                            </tbody>
                            <tbody id="tabelb_rincian_shop_booking">
                            </tbody>
                            <tbody class="tabelb_rincian_pembayaranpos">
                            </tbody>
                        </table>
                    </div>
                    @endif

					<div class="form-group row">
						<label for="total_biaya" class="col-form-label col-lg-3 label_nominal_modal_co">Nominal</label>
						<div class="col-lg-9">
							<input type="text" id="checkout_pembayaran_nominal" name="nominal" value="" class="form-control border-teal border-1 addError" required>
							<span class="text-success" id="nominalbayar"></span>
						</div>
					</div>

				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
					<button type="submit" id="submit_pembayaran_checkout" onclick="checkBeforeCheckout()" class="btn bg-primary submit-button-check">Save</button>
				</div>

				</form>


			</div>
		</div>
	</div>
	<!-- /default modal -->




	<!-- Checkout Refund Modal -->
	<div id="checkout_refundmodal" class="modal fade">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-orange" align="center">
					<h6 class="modal-title"><i class="fas fa-wallet mr-1"></i> Refund & Checkout</h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<div class="modal-body">
					<form action="{{url('rv_saverefund_checkout')}}" method="POST" id="form_checkout_refund">
					@csrf

					@if(Auth::user()->role == 1 || Auth::user()->role == 5)
						<input type="hidden" name="hotel_id" value="{{ Session::get('hotel_id') }}" />
					@else
						<input type="hidden" name="hotel_id" value="{{ hotelID() }}" />
					@endif
						<input type="hidden" id="checkout_refund_booking_id" name="booking_id">
						<input type="hidden" id="checkout_refund_room_index" name="room_index">

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Name</label>
						<div class="col-sm-9">
							<input id="checkout_refund_nama" name="nama" class="form-control border-1 border-teal" type="text">
						</div>
					</div>

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Segment</label>
						<div class="col-lg-9">
							<select name="segment" id="checkout_refund_segment" class="form-control form-control-select2 border-1 border-1" required disabled>
								<option value="">-- Select Segment --</option>
								@foreach(config('custom.segment_ratecodes') as $key => $val)
									<option value="{{$key}}">{{$val}}</option>
								@endforeach
							</select>
						</div>
					</div>

					{{-- <div class="form-group row">
						<label class="col-form-label col-sm-3">Metode Pembayaran</label>
						<div class="col-lg-9">
							<select name="jenis_pembayaran_id"
									id="refund_jenis_pembayaran"
									onchange="setJenisRefund()"
									class="form-control form-control-select2"
									required
							>
								<option value="">** Select Payment Method **</option>
								@foreach(config('custom.jenis_refund') as $key => $value)
								<option value="{{$key}}">{{$value}}</option>
								@endforeach
							</select>
						</div>
					</div> --}}

					{{-- <div class="form-group row" id="refund_jenis_pembayaran_option" style="display: none">
						<label for="platform_pembayaran" class="col-form-label col-sm-3">Platform Pembayaran</label>
						<div class="col-lg-9">
							<select name="platform_pembayaran_id"
									id="refund_platform_pembayaran_id"
									class="form-control border-1 border-1"
									disabled
							>
								<option value="">** Select Payment Platform **</option>
							</select>
						</div>
					</div> --}}

					{{-- <div class="form-group row" id="refund_transfer" style="display: none">
						<label for="platform_pembayaran" class="col-form-label col-sm-3">Daftar Transfer</label>
						<div class="col-lg-9">
							<select name="transfer_akunting_id"
									id="refund_transfer_akunting_id"
									class="form-control form-control-select2 border-1 border-teal"
							>
								<option value="">-- Select Data (Optional) --</option>
								@foreach ($refund_transfers as $transfer)
								<option value="{{$transfer->id}}"
										data-voucher="{{$transfer->voucher}}"
										data-nominal = "{{$transfer->nominal}}"
								>
									{{$transfer->nama}} /  Rp.{{ribuan($transfer->nominal)}} ({{$transfer->keterangan}})
								</option>
								@endforeach
							</select>
							<br>
							<span id="warning_refund_transfer" class="text-danger"></span>
						</div>
					</div> --}}

                    {{-- <div class="form-group row">
						<label class="col-form-label col-sm-3">Voucher</label>
						<div class="col-lg-9">
							<input type="text" class="form-control" name="voucher" id="voucher_refund">
						</div>
					</div> --}}

					{{-- <div class="form-group row" id="checkout_refund_company_ledger" style="display: none">
						<label class="col-form-label col-sm-3">City Ledger</label>
						<div class="col-lg-9">
							<select name="company_ledger" id="checkout_refund_company_ledgers" class="form-control border-1 border-1" disabled>
								<option value="">-- Pilih City Ledger --</option>
								@foreach($company_ledgers as $comled)
									<option value="{{$comled->id}}">{{$comled->name}}</option>
								@endforeach
							</select>
						</div>
					</div> --}}

                    {{-- NEW REFUND METHOD USING ITEM PAID OUT --}}

                    @if (count($item_paid_out) > 0)
                    <div class="form-group row">
                        <label class="col-form-label col-sm-3">Paid out:</label>
						<div class="col-lg-9">
                            <select name="paid_out_status" id="paid_out_status_checkout" class="form-control border-1 border-1">
                                @foreach ($item_paid_out as $a)
                                    <option value="{{$a->id}}">{{$a->nama}}</option>
                                @endforeach
                            </select>
						</div>
                    </div>
                    @else
                    <div class="form-group row">
                        <label class="col-form-label col-sm-3">Paid out:</label>
                        <label class="col-form-label col-sm-9 text-danger">Please generate item paid out first. <a href="{{route('menus.index')}}/?a=1">click here!</a> </label>
                    </div>
                    @endif

                    @if (true)
                    <div class="m-2">
                       <label> Detail : </label>
                        <table class="table datatable-basic table-hover" >
                            <thead>
                                <tr>
                                    <th>Services</th>
                                    <th>Qty</th>
                                    <th style="text-align:right">Price</th>
                                    <th style="text-align:right">Total</th>
                                </tr>
                            </thead>
                            <tbody id="tabelb_rincian_depo_booking_refund">
                            </tbody>
                            <tbody class="tabelb_rincian_pembayaran_sebagian_booking">
                            </tbody>
                            <tbody id="tabelb_rincian_booking_refund">
                            </tbody>
                            <tbody id="tabelb_rincian_shop_booking_refund">
                            </tbody>
                            <tbody class="tabelb_rincian_pembayaranpos">
                            </tbody>
                        </table>
                    </div>
                    @endif

					<div class="form-group row">
						<label for="total_biaya" class="col-form-label col-lg-3">Nominal Refund</label>
						<div class="col-lg-9">
							<input type="text" id="checkout_nominal_refund" name="nominal" class="form-control border-teal border-1 input_comma_custom" required readonly>
							<span class="text-orange" id="refund_nominalbayar"></span>

						</div>
					</div>

				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
					<button type="submit" onclick="checkBeforeCheckoutRefund()" class="btn bg-primary submit-button-check" id="btn_refund" {{count($item_paid_out) > 0 ? '' : 'disabled' }}>Save</button>
				</div>

				</form>


			</div>
		</div>
	</div>
	<!-- /default modal -->

    <!--MODAL CHANGE ROOM-->
    <div id="changeRoomModal" 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-running mr-1"></i>Moving Room</h6>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>

                <form id="change_room_form" action="{{route('roomview.changekamar')}}" method="post">
                    @method('post')
                    @csrf

                    <div class="modal-body">
                        <input type="hidden" name="booking_id" id="change_room_booking_id" value="" class="form-control mb-3" required>
                        <input type="hidden" name="kamar_id" id="change_room_kamar_id" value="" class="form-control mb-3" required>

                        {{-- <input type="hidden" name="old_no_kamar" id="change_room_no_kamar" value="" class="form-control mb-3" required> --}}

                        {{-- <div class="form-group row">
                            <label class="col-form-label col-sm-3">Room Number : </label>
                            <div class="col-sm-9">
                                <input type="text" id="change_room_input_text" value="101" class="form-control">
                            </div>
                        </div> --}}


                        <label class="col-form-label" id="label_current_room"></label>

                        <hr class="mt-1">

                        <div class="form-group row">
                            <label for="jns_kelamin" class="col-form-label col-lg-3">Method Move Room: </label>
                            <div class="col-lg-10" id="radio-moving-room">
                                <div class="form-check form-check-inline">
                                    <label class="form-check-label">
                                        <input type="radio"
                                                class="form-check-input-styled moveroomtyperadio"
                                                name="type_move_room"
                                                value="1"
                                                style="border-color: red"
                                                data-fouc
                                                id="reguler_moving_room"
                                        >
                                        Moving Room (with change room rate per remaining day/night)
                                    </label>
                                </div>

                                <div class="form-check form-check-inline">
                                    <label class="form-check-label">
                                        <input type="radio"
                                                class="form-check-input-styled moveroomtyperadio"
                                                name="type_move_room"
                                                value="2"
                                                style="border-color: red"
                                                data-fouc
                                                id="force_moving_room"
                                        >
                                        Force Move Room (without adjust room rate)
                                    </label>
                                </div>
                            </div>
                        </div>

                        <hr class="mt-1">

                        <div class="change-room-remaining-days-more-than-0 d-none">
                            <input type="hidden" name="start_date" id="start_date_change_room">
                            <input type="hidden" name="end_date" id="end_date_change_room">
                            <input type="hidden" name="segmentasi" id="segmentasi_change_room">
                            <input type="hidden" name="jumlah_malam" id="jumlah_malam_change_room" value="">
                            <input type="hidden" name="date_system_check" value="{{getSystemDate()}}">

                            <div class="form-group row" id="change_room_number">
                                <label class="col-form-label col-sm-4">Room Number<span class="text-danger">*</span></label>
                                <div class="col-lg-8">
                                    <select name="new_id_kamar" id="available_rooms" class="form-control form-control-select2 border-1 border-1" required>
                                        <option value="">-- Choose Available Room --</option>
                                    </select>
                                </div>
                            </div>

                            <div class="form-group row">
                                <label class="col-form-label col-sm-4">Room Type<span class="text-danger">*</span></label>
                                <div class="col-lg-8">
                                    <select name="jns_kamar"
                                            id="jns_kamar_change_room"
                                            data-idx="0"
                                            onchange="getAvailableRooms(this.value)"
                                            class="form-control form-control-select2"
                                            required
                                    >
                                        <option data-id=""
                                                data-diskon=""
                                                data-kapasitas=""
                                                value="">-- Select Room Type --</option>

                                        @foreach($jenis_kamars as $jns)
                                            @php
                                            $diskon_kamar = count($jns->discount) > 0 ? $jns->discount[0]->diskon : 0;
                                            @endphp

                                            <option data-id="{{$jns->id}}"
                                                    data-diskon="{{$diskon_kamar}}"
                                                    data-kapasitas="{{$jns->kapasitas}}"
                                                    value="{{$jns->nama}}"
                                            >{{$jns->nama}} ({{$jns->kapasitas}} Orang)</option>
                                        @endforeach
                                    </select>
                                    <input type="hidden" name="diskon" id="diskon_change_room" value="0">
                                    <input type="hidden" name="jenis_kamar_id" id="jenis_kamar_id_change_room">
                                    <input type="hidden" name="company_id_change_room" id="company_id_change_room">
                                    <input type="hidden" name="pax" id="pax_change_room">
                                </div>
                            </div>

                            <div id="reguler-move-room-div">
                                {{-- <div class="form-group row">
                                    <label class="col-form-label col-sm-4">Rate Code<span class="text-danger">*</span></label>
                                    <div class="col-lg-8">
                                        <select name="rate_codes"
                                                id="rate_code_change_room"
                                                data-idx="0"
                                                class="form-control form-control-select2"
                                                onchange="calculatePrice(1, '_change_room')"
                                                required
                                        >
                                            <option value="" data-id="0" data-harga="0" data-include_breakfast="0">-- Select Rate Code --</option>
                                        </select>

                                        <input type="hidden" id="rate_code_id_hidden" name="ratecode_id">
                                        <input type="hidden" name="per_item_total" id="per_item_total_change_room">
                                        <input type="hidden" name="per_item_services" id="per_item_services_change_room">
                                        <input type="hidden" name="per_item_tax" id="per_item_tax_change_room">
                                        <input type="hidden" name="per_item_arr" id="per_item_arr_change_room">
                                        <input type="hidden" name="per_item_arr_services" id="per_item_arr_service_change_room">
                                        <input type="hidden" name="per_item_arr_tax" id="per_item_arr_tax_change_room">
                                    </div>
                                </div>

                                <div class="form-group row">
                                    <label class="col-form-label col-sm-4">Room Rate/Night</label>
                                    <div class="col-lg-8">
                                        <input type="text" name="per_item" id="per_item_change_room" class="form-control" onchange="recountWalkinRate('_change_room')">
                                    </div>
                                </div>

                                <div class="form-group row">
                                    <label class="col-form-label col-sm-4">Arrangement<span class="text-danger">*</span></label>
                                    <div class="col-lg-8">
                                        <select name="arrangement_codes"
                                                id="arrangement_code_change_room"
                                                data-idx="0"
                                                class="form-control form-control-select2"
                                                onchange="calculatePrice(0, '_change_room')"
                                                required
                                        >
                                            <option value="" data-harga="0">-- Select Arrangement --</option>
                                            @foreach($arrangements as $arrangement)
                                                @php
                                                    $harga_arrangement = 0;
                                                    $service_arrangement = 0;
                                                    $tax_arrangement = 0;
                                                @endphp

                                                @if($arrangement->arrangementCodeDetail)
                                                    @foreach($arrangement->arrangementCodeDetail as $arrangement_detail)
                                                        @php
                                                        // $service_arrangement_temp = $arrangement_detail->harga * ($arrangement_detail->shop ? ($arrangement_detail->shop->services/100) : 0);
                                                        // $service_arrangement += $service_arrangement_temp;
                                                        // $tax_arrangement_temp = ($service_arrangement_temp * ($arrangement_detail->shop ? ($arrangement_detail->shop->ppn/100) : 0)) + $service_arrangement_temp;
                                                        // $tax_arrangement += $tax_arrangement_temp;
                                                        // $harga_arrangement += $arrangement_detail->harga;
                                                        $tax_shop = $arrangement_detail->shop ? $arrangement_detail->shop->ppn : 0;
                                                        $service_shop = $arrangement_detail->shop ? $arrangement_detail->shop->services : 0;

                                                        $tax_arrangement_temp = ($arrangement_detail->harga * $tax_shop)/(100+$tax_shop);
                                                        $tax_arrangement += $tax_arrangement_temp;

                                                        $harga_exclude_tax = $arrangement_detail->harga - $tax_arrangement_temp;
                                                        $service_arrangement_temp = ($harga_exclude_tax * $service_shop)/(100+$service_shop);
                                                        $service_arrangement += $service_arrangement_temp;

                                                        $harga_arrangement += $arrangement_detail->harga;
                                                        @endphp
                                                    @endforeach
                                                @endif

                                                <option value="{{$arrangement->arrangement_code}}"
                                                        data-id="{{$arrangement->id}}"
                                                        data-harga="{{$harga_arrangement}}"
                                                        data-service="{{$service_arrangement}}"
                                                        data-tax="{{$tax_arrangement}}"
                                                >{{$arrangement->arrangement_code}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>

                                <!-- For Container Hidden Arrangement -->
                                <div id="hidden_arrangement_code_container_change_room">
                                </div>

                                <div class="form-group row">
                                    <label class="col-form-label col-sm-4">Total Room Rate</label>
                                    <div class="col-lg-8">
                                        <input type="text" id="total_biaya_booking_text_change_room" class="form-control" readonly>
                                        <input type="hidden" name="total_biaya" id="total_biaya_booking_change_room" class="form-control" value="0">
                                        <span class="text-danger" id="ket_diskon_change_room"></span>
                                    </div>
                                </div> --}}
                            </div>

                            <div class="form-group row">
                                <label for="reason" class="col-form-label col-lg-4">Reason</label>
                                <div class="col-lg-8">
                                    <textarea name="reason" id="reason" rows="5" class="form-control"></textarea>
                                </div>
                            </div>
                        </div>

                        <div class="change-room-remaining-days-is-0 d-none">
                            <div class="col-md-12 mt-2">
                                <div class="alert alert-danger text-center mb-2" role="alert" id="keterangan_alert_remaining">
                                    Remaining days is 0, can't change the room from this method
                                </div>
                            </div>
                        </div>

                    </div>

                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                        <button type="submit" id="submit_wakeUpCall" class="btn btn-primary action-submit-change-room">Submit</button>
                    </div>

                </form>
            </div>
        </div>
    </div>
    <!--/MODAL-->

    <!--MODAL ALERT STATUS-->
        <div id="alertStatusModal" class="modal fade">
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header bg-warning" align="center">
                        <h6 class="modal-title"><i class="fas fa-info mr-1"></i>Set Room Number</h6>
                        <button type="button" class="close" data-dismiss="modal">&times;</button>
                    </div>

                    <form id="set_room_number" action="{{route('roomview.choosekamar')}}" method="post">
                        @method('post')
                        @csrf

                        <div class="modal-body">
                            <input type="hidden" name="booking_id" id="alert_status_book_id" value="" class="form-control mb-3" required>
                            <input type="hidden" name="index" id="index_current_kamar" value="" class="form-control mb-3" required>
                            <input type="hidden" name="hotel_id" value="{{ $hotel_id }}" class="form-control mb-3" required>

                            <div>
                                <b>Reservation <span id="no_reservasi"></span> doesn't have Room No.!</b>, please choose Room No. first.
                                {{-- <b>Nomor Reservasi <span id="no_reservasi"></span> Belum Mempunyai Nomor Kamar yang di Pesan!</b>, silahkan pilih nomor kamar terlebih dahulu. --}}
                            </div>

                            <!-- <label class="col-form-label" id="label_current_jeniskamar"></label>

                            <div class="form-group row" id="change_room_number">
                                <label class="col-form-label col-sm-3">Kamar yang Tersedia :</label>
                                <div class="col-lg-8">
                                    <select name="id_kamar" id="alert_status_number_select" class="form-control form-control-select2 border-1 border-1">
                                    </select>
                                </div>
                            </div> -->

							<div class="container mt-2" id="set_room_number_form">

							</div>

                        </div>

                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" id="closekamar" data-dismiss="modal">Close</button>
                            <button type="button" id="submit_setnumberform" class="btn btn-primary" onclick="checkSetAllRoom(1)">Submit</button>
                        </div>
                    </form>

                </div>
            </div>
        </div>
    <!--/MODAL-->


{{--
--------------------------------------------------------------
Modal Detail Kamar
--------------------------------------------------------------
--}}

    <!--MODAL-->
    <div id="detailKamarModal" class="modal fade" tabindex="-1">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-info" align="center">
					<h6 class="modal-title"><i class="icon icon-eye mr-1"></i>Room Detail</h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<div class="modal-body">

                    <div class="form-group row">
                        <label class="col-form-label col-sm-4">Room Type</label>
						<div class="col-lg-8" id="detail_jeniskamar">

                        </div>
					</div>
                    <div class="form-group row">
                        <label class="col-form-label col-sm-4" id="label_connecting_room"></label>
                        <div class="col-lg-8" id="connecting_room">

                        </div>
                        <label class="col-form-label col-sm-4" id="label_keterangan_room"></label>
                        <div class="col-lg-8" id="keterangan_room">

                        </div>
                    </div>


				</div>
			</div>
		</div>
	</div>
  <!--/MODAL-->


  {{--
--------------------------------------------------------------
Modal Transfer Bill
--------------------------------------------------------------
--}}

    <!--MODAL-->
    <div id="transferbillmodal" class="modal fade" tabindex="-1">
		<div class="modal-dialog modal-lg">
			<div class="modal-content">

				<div class="modal-header bg-info" align="center">
					<h6 class="modal-title"><i class="icon icon-file-upload2 mr-1"></i>Transfer Bill</h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<div class="modal-body">

					<form action="{{url('rv_transferbill')}}" id="transferbillform" method="POST">
						@csrf

                        <input type="hidden" name="invoice_id" id="invoice_id" value="">

						<table class="table table-hover" id="tabletransferbill">
							<thead>
								<tr>
									<th>No.</th>
									<th>Description</th>
									<th>Qty</th>
									<th>Total</th>
									<th>Transfer to</th>
								</tr>
							</thead>
							<tbody>

							</tbody>
							<div id="pilihandetail">

							</div>
						</table>

						<div class="modal-footer">
							<button type="button" class="btn btn-link" style="margin: 10px" data-dismiss="modal">Close</button>
							<button type="submit" class="btn bg-info" style="margin: 10px">Transfer</button>
						</div>

					</form>
				</div>

			</div>
		</div>
	</div>
  	<!--/MODAL-->

{{--
--------------------------------------------------------------
Modal Extend Stay
--------------------------------------------------------------
--}}

    <!--MODAL-->
    <div id="extendStay" class="modal fade">
		<div class="modal-dialog modal-lg">
			<div class="modal-content">
				<div class="modal-header bg-light" align="center">
					<h6 class="modal-title">Extend Stay</h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<form action="{{ route('extend-stay.store')}}" method="post">
					@csrf

					<div class="modal-body" id="form-extendStay">

					</div>

					<div class="modal-footer">
						<button type="button" class="btn btn-link"  data-dismiss="modal">Close</button>
						<button type="submit" class="btn btn-light" id="submit_extend">Submit</button>
					</div>
				</form>
			</div>
		</div>
	</div>
  <!--/MODAL-->

{{--
--------------------------------------------------------------
Modal History Extend
--------------------------------------------------------------
--}}

    <!--MODAL-->
    <div id="historyExtend" class="modal fade" tabindex="-1">
		<div class="modal-dialog modal-lg">
			<div class="modal-content">
				<div class="modal-header bg-light" align="center">
					<h6 class="modal-title">History Extend Stay</h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<div class="modal-body">
					<table class="table datatable-basic table-hover">
						<thead>
							<tr>
								<th>No</th>
								<th>Start Date</th>
								<th>End Date</th>
								<th>Jumlah Malam</th>
								<th>Room Number</th>
							</tr>
						</thead>
						<tbody id="content-table">
							<tr>
								<td colspan="5" class="text-center">Tidak ada data extend!</td>
							</tr>
						</tbody>
					</table>
				</div>
			</div>
		</div>
	</div>
  <!--/MODAL-->

{{--
--------------------------------------------------------------
Modal Update Status lock
--------------------------------------------------------------
--}}

    <!--MODAL-->
    <div id="modalStatusLock" class="modal fade" tabindex="-1">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-light" align="center">
					<h6 class="modal-title">Edit Status Lock</span></h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<form action="{{ route('status-lock.update')}}" method="post" id="form_status_lock">
					@csrf

					<input type="hidden" name="id" id="id_booking_status_lock">
					{{-- <input type="hidden" name="no_kamar" id="no_kamar"> --}}
					<input type="hidden" name="nama_booking" id="nama_booking_status_lock">

					<div class="modal-body">
						<div class="form-group">
							<select class="form-control-select2 select-icons" name="status_lock" id="status_lock" data-fouc>
							</select>
						</div>
					</div>

					<div class="modal-footer">
						<button type="button" class="btn btn-link"  data-dismiss="modal">Close</button>
						<button type="submit" class="btn btn-light">Submit</button>
					</div>
				</form>
			</div>
		</div>
	</div>
  <!--/MODAL-->

{{--
--------------------------------------------------------------
Modal Cancel Reservation
--------------------------------------------------------------
--}}

    <!--MODAL-->
    <div id="modal_status_confirm_cancel" class="modal fade" tabindex="-1">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-danger" align="center">
                    <h6 class="modal-title"><i class="fas fa-exclamation mr-1"></i>Cancel Reservation</h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<form action="{{route('roomview.update')}}" method="post" id="statusform">
				    @csrf

					<input type="hidden" name="id" id="id_booking_cancel_reservation">
					<input type="hidden" name="status_booking" id="status_booking_cancel_reservation">
					<input type="hidden" name="hotel_id" id="hotel_id_cancel_reservation">
					<input type="hidden" name="detail_id" id="detail_id_cancel_reservation">

					<div class="modal-body">
                        <div class="form-group row">
                            <label for="reason" class="col-form-label col-lg-4">Reason</label>
                            <div class="col-lg-8">
                                <textarea name="reason_cancel_reservation" id="reason_cancel_reservation" rows="5" class="form-control"></textarea>
                            </div>
                        </div>
						<hr>
						<div class="form-group row">
							<div class="col-lg-4 header-checkbox-cancel-all-reservation">
								<h6><input type="checkbox" name="cancel_all_reservation" id="checkbox_cancel_all_reservation" value="1" onchange="checkboxCancelAllReservation(this)">&nbsp;<b>All</b></h6>
								<span class="text-muted">* Cancel all Reservation</span>
							</div>
						</div>
					</div>

					<div class="modal-footer modal-footer-confirmcancel">
						<button type="button" class="btn btn-link" data-dismiss="modal">Batal</button>
						<button type="submit" class="btn bg-danger submit-modal_confirmcancel">Ya</button>
					</div>
				</form>
			</div>
		</div>
	</div>
  <!--/MODAL-->

{{--
--------------------------------------------------------------
Pembayaran Day Use
--------------------------------------------------------------
--}}

	<!-- Day Use Pembayaran Modal -->
	<div id="dayUse_pembayaranModal" class="modal fade">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-success" align="center">
					<h6 class="modal-title"><i class="fas fa-wallet mr-1"></i><span id="modal_dayuse_title">Payment & Day Use</span></h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<div class="modal-body">
					<form class="form-submit-custom" action="{{url('rv_savepembayaran_dayUse')}}" method="POST">
					@csrf

					@if(Auth::user()->role == 1 || Auth::user()->role == 5)
						<input type="hidden" name="hotel_id" value="{{ Session::get('hotel_id') }}" />
					@else
						<input type="hidden" name="hotel_id" value="{{ hotelID() }}" />
					@endif
						<input type="hidden" id="dayUse_pembayaran_booking_id" name="booking_id">
						<input type="hidden" id="dayUse_pembayaran_room_index" name="room_index">
                        <input type="hidden" id="dayuse_co_awal_status" name="co_awal_status">

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Name</label>
						<div class="col-sm-9">
							<input id="dayUse_pembayaran_nama" name="nama" class="form-control border-1 border-teal" type="text">
						</div>
					</div>

                    <div class="form-group row element_co_awal">
						<label class="col-form-label col-sm-3">Payment Method</label>
						<div class="col-lg-9">
							<!-- Kode lama ada onchange="setJenisPembayaran()" -->
							<select name="jenis_pembayaran_id"
									id="dayUse_jenis_pembayaran"
									onchange="setJenisPembayaranDayUse()"
									class="form-control form-control-select2"
									required
							>
								<option value="">** Select Payment Method **</option>
								@foreach(config('custom.jenis_pembayaran') as $key => $value)
                                    @if(!in_array($key, [6,7]))
                                        <option value="{{$key}}">{{$value}}</option>
                                    @endif
								@endforeach
							</select>
						</div>
					</div>

                    <div class="form-group row wrap_segmentation_option" style="display: none">
						<label class="col-form-label col-sm-3">Segment</label>
						<div class="col-lg-9">
							<select name="segment" id="dayUse_pembayaran_segment" class="form-control form-control-select2 border-1 border-1">
								<option value="">-- Select Segment --</option>
                                @foreach (config('custom.segment_ratecodes') as $key => $val)
                                    @if (in_array($key, [1,7,12,13]))
                                        @continue
                                    @endif

                                    <option value="{{$key}}" class="segmentation_value">{{$val}}</option>
                                @endforeach

                                {{-- <option value="999">Transfer</option> --}}
							</select>
						</div>
					</div>


					<div class="form-group row element_co_awal" id="dayUse_jenis_pembayaran_option" style="display: none">
						<label for="platform_pembayaran" class="col-form-label col-sm-3">Payment Platform</label>
						<div class="col-lg-9">
							<select name="platform_pembayaran_id"
									id="dayUse_platform_pembayaran_id"
									class="form-control form-control-select2 border-1 border-1"
							>
								<option value="">** Select Payment Platform **</option>
							</select>
						</div>
					</div>

					<div class="form-group row" id="dayUse_pembayaran_transfer" style="display: none">
						<label for="platform_pembayaran" class="col-form-label col-sm-3">Transfer List</label>
						<div class="col-lg-9">
							<select name="transfer_akunting_id"
									id="dayUse_pembayaran_transfer_akunting_id"
									class="form-control form-control-select2 border-1 border-teal"
							>
								<option value="">-- Select Data (Optional) --</option>
								@foreach ($transfers as $transfer)
								<option value="{{$transfer->id}}"
										data-voucher="{{$transfer->voucher}}"
										data-nominal = "{{$transfer->nominal}}"
								>
									{{$transfer->nama}} /  Rp.{{ribuan($transfer->nominal)}} ({{$transfer->keterangan}})
								</option>
								@endforeach
							</select>
							<br>
							<span id="dayUse_warning_pembayaran_transfer" class="text-danger"></span>
						</div>
					</div>

                    <div class="form-group row element_co_awal">
						<label class="col-form-label col-sm-3">Voucher</label>
						<div class="col-lg-9">
							<input type="text" class="form-control" name="voucher" id="dayUse_voucher">
						</div>
					</div>

                    <!-- <div class="form-group row" id="dayUse_jenis_pembayaran_option" style="display: none">
                        <label class="col-form-label col-sm-3"></label>
                        <div class="col-lg-9" id="form_deposit">
                            <div class="row">
                                <div class="col-md">
                                    No. Kartu
                                </div>
                                <div class="col-md">
                                    Bank
                                </div>
                            </div>
                            <div class="row mb-2" data-idx="0" id="row_jenis_pembayaran">
                                <div class="col-md">
                                    <input type="text" name="no_kartu" id="dayUse_no_kartu" class="form-control" disabled required>
                                </div>
                                <div class="col-md">
                                    <input type="text" name="bank" id="dayUse_bank" class="form-control" disabled required>
                                </div>
                            </div>
                        </div>
                    </div> -->

					{{-- <div class="form-group row">
						<label class="col-form-label col-sm-3">Segmentasi</label>
						<div class="col-lg-9">
							<select name="segment" id="dayUse_pembayaran_segment" class="form-control form-control-select2 border-1 border-1" required disabled>
								<option value="">-- Select Segment --</option>
								@foreach(config('custom.segment_ratecodes') as $key => $val)
									<option value="{{$key}}">{{$val}}</option>
								@endforeach
							</select>
						</div>
					</div> --}}

					<div class="form-group row" id="dayUse_pembayaran_company_ledger" style="display: none">
						<label class="col-form-label col-sm-3" for="company_ledger"> City Ledger</label>
						<div class="col-lg-9">
							<select name="company_ledger" id="company_ledger_pembayaran_dayUse" class="form-control" disabled>
								<option value="">-- Pilih City Ledger --</option>
								@foreach($company_ledgers as $comled)
								<option value="{{$comled->id}}"
										data-status="{{$comled->status_ledger}}"
										data-status-text="{{ config('custom.status_ledger')[$comled->status_ledger] }}"
										data-perusahaan="{{$comled->comp_title}} {{$comled->name}}"
								>{{$comled->comp_title}} {{$comled->name}}</option>
								@endforeach
							</select>
						</div>
						<div class="col-lg-3"></div>
						<div class="col-lg-9">
							<span class="text-danger" id="dayUse_company_danger"></span>
						</div>
					</div>

                    <div class="form-group row">
                        <label class="col-form-label col-lg-2">Bill type<span class="text-danger">*</span> </label>
                        <div class="col-lg-10">
                            <div class="form-check form-check-inline">
                                <label class="form-check-label">
                                    <input type="radio" class="form-check-input-styled typebilldayusebayar" name="typebill" id="tipe-bill-single" value="single" checked data-fouc>
                                    Today rate only
                                </label>
                            </div>
                            <div class="form-check form-check-inline">
                                <label class="form-check-label">
                                    <input type="radio" class="form-check-input-styled typebilldayusebayar" name="typebill" id="tipe-bill-multiple" value="multiple" data-fouc>
                                    All remaining rate to today
                                </label>
                            </div>
                        </div>
                    </div>

                    @if (true)
                    <div class="m-2">
                       <label> Detail : </label>
                        <table class="table datatable-basic table-hover" >
                            <thead>
                                <tr>
                                    <th>Description</th>
                                    <th>Qty</th>
                                    <th style="text-align:right">Price</th>
                                    <th style="text-align:right">Total</th>
                                </tr>
                            </thead>
                            <tbody id="dayUse_tabelb_rincian_depo_booking">
                            </tbody>
                            <tbody class="tabelb_rincian_pembayaran_sebagian_booking">
                            </tbody>
                            <tbody id="dayUse_tabelb_rincian_booking">
                            </tbody>
                            <tbody class="dayuserateclass">
                            </tbody>
                            <tbody id="dayUse_tabelb_rincian_shop_booking">
                            </tbody>
                            <tbody class="tabelb_rincian_pembayaranpos">
                            </tbody>
                        </table>
                    </div>
                    @endif

					<div class="form-group row">
						<label for="total_biaya" class="col-form-label col-lg-3 label_nominal_modal_co">Nominal</label>
						<div class="col-lg-9">
							<input type="text" id="dayUse_pembayaran_nominal" name="nominal" value="" class="form-control border-teal border-1 input_comma_custom" required>
							<span class="text-success" id="dayUse_nominalbayar"></span>
						</div>
					</div>

				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
					<button type="submit" id="submit_pembayaran_dayUse" class="btn bg-primary btn-submit-custom btn-submit-dayuse submit-button-check">Save</button>
				</div>

				</form>


			</div>
		</div>
	</div>
	<!-- /default modal -->

{{--
--------------------------------------------------------------
Refund Day Use
--------------------------------------------------------------
--}}

	<!-- Day Use Refund Modal -->
	<div id="dayUse_refundModal" class="modal fade">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-orange" align="center">
					<h6 class="modal-title"><i class="fas fa-wallet mr-1"></i> Refund & Day Use</h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<div class="modal-body">
					<form class="form-submit-custom-ref" action="{{url('rv_saverefund_dayUse')}}" method="POST">
					@csrf

					@if(Auth::user()->role == 1 || Auth::user()->role == 5)
						<input type="hidden" name="hotel_id" value="{{ Session::get('hotel_id') }}" />
					@else
						<input type="hidden" name="hotel_id" value="{{ hotelID() }}" />
					@endif
						<input type="hidden" id="dayUse_refund_booking_id" name="booking_id">
						<input type="hidden" id="dayUse_refund_room_index" name="room_index">

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Name</label>
						<div class="col-sm-9">
							<input id="dayUse_refund_nama" name="nama" class="form-control border-1 border-teal" type="text">
						</div>
					</div>

					<div class="form-group row">
						<label class="col-form-label col-sm-3">Segment</label>
						<div class="col-lg-9">
							<select name="segment" id="dayUse_refund_segment" class="form-control form-control-select2 border-1 border-1" required disabled>
								<option value="">-- Choose Segment --</option>
								@foreach(config('custom.segment_ratecodes') as $key => $val)
									<option value="{{$key}}">{{$val}}</option>
								@endforeach
							</select>
						</div>
					</div>

					{{-- <div class="form-group row">
						<label class="col-form-label col-sm-3">Metode Pembayaran</label>
						<div class="col-lg-9">
							<select name="jenis_pembayaran_id"
									id="dayUse_refund_jenis_pembayaran"
									onchange="setJenisRefundDayUse()"
									class="form-control form-control-select2"
									required
							>
								<option value="">** Select Payment Method **</option>
								@foreach(config('custom.jenis_refund') as $key => $value)
								<option value="{{$key}}">{{$value}}</option>
								@endforeach
							</select>
						</div>
					</div> --}}

					{{-- <div class="form-group row" id="dayUse_refund_jenis_pembayaran_option" style="display: none">
						<label for="platform_pembayaran" class="col-form-label col-sm-3">Platform Pembayaran</label>
						<div class="col-lg-9">
							<select name="platform_pembayaran_id"
									id="dayUse_refund_platform_pembayaran_id"
									class="form-control border-1 border-1"
									disabled
							>
								<option value="">** Select Payment Platform **</option>
							</select>
						</div>
					</div> --}}

					{{-- <div class="form-group row" id="dayUse_refund_transfer" style="display: none">
						<label for="platform_pembayaran" class="col-form-label col-sm-3">Daftar Transfer</label>
						<div class="col-lg-9">
							<select name="transfer_akunting_id"
									id="dayUse_refund_transfer_akunting_id"
									class="form-control form-control-select2 border-1 border-teal"
							>
								<option value="">-- Select Data (Optional) --</option>
								@foreach ($refund_transfers as $transfer)
								<option value="{{$transfer->id}}"
										data-voucher="{{$transfer->voucher}}"
										data-nominal = "{{$transfer->nominal}}"
								>
									{{$transfer->nama}} /  Rp.{{ribuan($transfer->nominal)}} ({{$transfer->keterangan}})
								</option>
								@endforeach
							</select>
							<br>
							<span id="dayUse_warning_refund_transfer" class="text-danger"></span>
						</div>
					</div> --}}

                    {{-- <div class="form-group row">
						<label class="col-form-label col-sm-3">Voucher</label>
						<div class="col-lg-9">
							<input type="text" class="form-control" name="voucher" id="dayUse_voucher_refund">
						</div>
					</div> --}}

					{{-- <div class="form-group row" id="dayUse_refund_company_ledger" style="display: none">
						<label class="col-form-label col-sm-3">City Ledger</label>
						<div class="col-lg-9">
							<select name="company_ledger" id="dayUse_refund_company_ledgers" class="form-control border-1 border-1" disabled>
								<option value="">-- Pilih City Ledger --</option>
								@foreach($company_ledgers as $comled)
									<option value="{{$comled->id}}">{{$comled->name}}</option>
								@endforeach
							</select>
						</div>
					</div> --}}

                    {{-- NEW REFUND METHOD USING ITEM PAID OUT --}}
                    @if (count($item_paid_out) > 0)
                    <div class="form-group row">
                        <label class="col-form-label col-sm-3">Paid out:</label>
						<div class="col-lg-9">
                            <select name="paid_out_status" id="paid_out_status_dayuse" class="form-control form-control-select2 border-1 border-1">
                                @foreach ($item_paid_out as $a)
                                    <option value="{{$a->id}}">{{$a->nama}}</option>
                                @endforeach
                            </select>
						</div>
                    </div>
                    @else
                    <div class="form-group row">
                        <label class="col-form-label col-sm-3">Paid out:</label>
                        <label class="col-form-label col-sm-9 text-danger">Please generate item paid out first. <a href="{{route('menus.index')}}/?a=1">click here!</a> </label>
                    </div>
                    @endif

                    @if (true)
                    <div class="m-2">
                       <label> Detail : </label>
                        <table class="table datatable-basic table-hover" >
                            <thead>
                                <tr>
                                    <th>Services</th>
                                    <th>Qty</th>
                                    <th style="text-align:right">Price</th>
                                    <th style="text-align:right">Total</th>
                                </tr>
                            </thead>
                            <tbody id="dayUse_tabelb_rincian_depo_booking_refund">
                            </tbody>
                            <tbody class="tabelb_rincian_pembayaran_sebagian_booking">
                            </tbody>
                            <tbody id="dayUse_tabelb_rincian_booking_refund">
                            </tbody>
                            <tbody class="dayuserateclass">
                            </tbody>
                            <tbody id="dayUse_tabelb_rincian_shop_booking_refund">
                            </tbody>
                            <tbody class="tabelb_rincian_pembayaranpos">
                            </tbody>
                        </table>
                    </div>
                    @endif

					<div class="form-group row">
						<label for="total_biaya" class="col-form-label col-lg-3">Nominal Refund</label>
						<div class="col-lg-9">
							<input type="text" id="dayUse_nominal_refund" name="nominal" class="form-control border-teal border-1 input_comma_custom" required readonly>
							<span class="text-orange" id="refund_nominalbayar"></span>

						</div>
					</div>

				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
					<button type="submit" class="btn bg-primary btn-submit-custom-ref btn-submit-dayuse-ref submit-button-check" id="btn_refund" {{count($item_paid_out) > 0 ? '' : 'disabled' }}>Save</button>
				</div>

				</form>


			</div>
		</div>
	</div>
	<!-- /default modal -->

{{--
--------------------------------------------------------------
Reservation Deposit Info
--------------------------------------------------------------
--}}

	<div id="reservation_deposit_info_modal" class="modal fade">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-success" align="center">
					<h6 class="modal-title"><i class="fas fa-file-invoice-dollar mr-1"></i> Reservation Deposit Info - Guest <span class="guest-name"></span></h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<div class="modal-body">

                    <div id="container_table_reservation_deposit_info">

                        {{-- <table class="table-reservation-deposit-info d-none" id="table_reservation_deposit_info">
                            <tr>
                                <th>Reservation Number</th>
                                <td>: <span class="reservation-number">-</span></td>
                            </tr>

                            <tr>
                                <th>Reservation Name</th>
                                <td>: <span class="guest-name">-</span></td>
                            </tr>

                            <tr>
                                <th>Group Name</th>
                                <td>: <span class="group-name">-</span></td>
                            </tr>

                            <tr>
                                <th>Deposit Date Input</th>
                                <td>: <span class="deposit_date_input">-</span></td>
                            </tr>

                            <tr>
                                <th>Arrival</th>
                                <td>: <span class="arrival">-</span></td>
                            </tr>

                            <tr>
                                <th>Deposit To</th>
                                <td>: <span class="deposit-to">-</span></td>
                            </tr>

                            <tr>
                                <th>Deposit Paid</th>
                                <td>: <span class="deposit-paid">-</span></td>
                            </tr>

                            <tr>
                                <th>Balance</th>
                                <td>: <span class="balance">-</span></td>
                            </tr>

                            <tr>
                                <th>Pay Date</th>
                                <td>: <span class="pay-date">-</span></td>
                            </tr>
                        </table> --}}

                    </div>

                    <div id="empty_reservation_deposit_info">
                        <h2 class="text-center">
                            There are no reservation deposit info!
                        </h2>
                    </div>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
				</div>
			</div>
		</div>
	</div>

{{--
--------------------------------------------------------------
Log File
--------------------------------------------------------------
--}}

	<div id="log_file_modal" class="modal fade">
		<div class="modal-dialog modal-xl">
			<div class="modal-content">
				<div class="modal-header bg-info" align="center">
					<h6 class="modal-title"><i class="icon-history mr-1"></i>Log File - Guest <span class="guest-name"></span></h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<div class="modal-body">
                    <table class="table datatable-basic table-hover">
                        <thead>
                            <tr>
                                <th>#</th>
                                <th>User</th>
                                <th>Datetime</th>
                                <th>Activity</th>
                                <th>Before</th>
                                <th>After</th>
                            </tr>
                        </thead>

                        <tbody id="tbody_log_file">
                        </tbody>
                    </table>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
				</div>
			</div>
		</div>
	</div>

{{--
--------------------------------------------------------------
Remarks
--------------------------------------------------------------
--}}
    <div id="info_remark_modal" class="modal fade">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header bg-info" align="center">
                    <h6 class="modal-title"><i class="icon-info3 mr-1"></i> Remarks - Guest <span class="guest-name"></span></h6>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>

                <div class="modal-body">
                    <div class="form-group row">
                        <label for="keterangan_pembayaran" class="col-form-label col-lg-4">Payment Description</label>
                        <div class="col-lg-8 form-control-plaintext" id="keterangan_pembayaran">
                            {{-- <textarea name="keterangan_pembayaran" id="keterangan_pembayaran" rows="5" class="form-control" readonly></textarea> --}}
                        </div>
                    </div>

                    <div class="form-group row">
                        <label for="guest_remark" class="col-form-label col-lg-4">Guest Remark</label>
                        <div class="col-lg-8 form-control-plaintext" id="guest_remark">
                            {{-- <textarea name="guest_remark" id="guest_remark" rows="5" class="form-control" readonly></textarea> --}}
                        </div>
                    </div>

                    <div class="form-group row">
                        <label for="reservation_remark" class="col-form-label col-lg-4">Reservation Remark</label>
                        <div class="col-lg-8 form-control-plaintext" id="reservation_remark">
                            {{-- <textarea name="reservation_remark" id="reservation_remark" rows="5" class="form-control" readonly></textarea> --}}
                        </div>
                    </div>
                </div>

                <div class="modal-footer">
                    <button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>

{{--
--------------------------------------------------------------
Room Revenue
--------------------------------------------------------------
--}}

	<div id="room_revenue_modal" class="modal fade">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-info" align="center">
					<h6 class="modal-title"><i class="fas fa-file-invoice-dollar mr-1"></i> Breakdown Room Revenue <span class="guest-name"></span> <span class="rate-code"></span> (Rate Rmcat = <span class="room-tag"></span>)</h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<div class="modal-body">
                    <table class="table datatable-basic table-hover">
                        <thead>
                            <tr>
                                <th style="width: 125px">Date</th>
                                <th>Description</th>
                                <th class="text-right">Total</th>
                            </tr>
                        </thead>

                        <tbody id="tbody_room_revenue">
                        </tbody>
                    </table>
				</div>

				<div class="modal-footer">
					<button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
				</div>
			</div>
		</div>
	</div>

    <!-- Incognito Modal -->
	<div id="incognito_change_modal" class="modal fade" tabindex="-1">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-warning" align="center">
                    <h6 class="modal-title">
                        <i class="fas fa-user-secret"></i>&nbsp; Incognito Status
                    </h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<form action="{{ route('roomview.rv_incognito_change')}}" method="post" id="incognito_change">
				    @csrf

					<input type="hidden" name="booking_detail_id" id="booking_detail_id_incognito">

					<div class="modal-body" align="center" id="text-incognito">
					</div>

					<div class="modal-footer modal-footer-confirmcancel">
						<button type="button" class="btn btn-link" data-dismiss="modal">Cancel</button>
						<button type="submit" class="btn bg-danger submit-modal_confirmcancel">Confirm</button>
					</div>
				</form>

			</div>
		</div>
	</div>
	<!-- /Incognito Modal -->

    <!-- Group Check In Modal -->
	<div id="group_checkin_modal" class="modal fade">
		<div class="modal-dialog modal-lg">
			<div class="modal-content">
				<div class="modal-header bg-warning" align="center">
                    <h6 class="modal-title">
                        <i class="fas fa-users"></i>&nbsp; Group Check In
                    </h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<form action="{{route('roomview.groupcheckin')}}" method="post" id="form_group_checkin">
				    @csrf

                    <!-- Hidden Input -->
                    <input type="hidden" name="group_by" id="group_checkin_group_name">
                    <input type="hidden" name="code" id="code_group_checkin">
                    <input type="hidden" name="booking_detail_id" id="booking_detail_id_checkin">

					<div class="modal-body scroll-vertical" align="center" id="html_group_checkin_modal" style="max-height: 600px">
                        {{-- Are You Sure Want to Group Check In with same group name? --}}
					</div>

					<div class="modal-footer modal-footer-confirmcancel">
						<button type="button" class="btn btn-link" data-dismiss="modal">Cancel</button>
                        <button type="button" class="btn bg-warning" onclick="checkSetAllRoom(2)">Confirm</button>
					</div>
				</form>

			</div>
		</div>
	</div>
	<!-- /Group Check In Modal -->

	<!-- Alert Modal -->
	<div id="alert_modal" class="modal fade" tabindex="-1">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-warning" align="center">
                    <h6 class="modal-title">
                       &nbsp;<h3>Alert!</h3>
                    </h6>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

                <div class="modal-body" align="center" id="text-alert">
                </div>

                <div class="modal-footer">
                    <button type="submit" class="btn bg-primary" data-dismiss="modal">OK</button>
                </div>

			</div>
		</div>
	</div>
	<!-- /Alert Modal -->

    <!-- Alert Modal -->
	<div id="about_browse_color_modal" class="modal fade" tabindex="-1">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-light" align="center">
                    <div class="modal-title">
                        <h5>  About browse Color!  </h5>
                    </div>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

                <div class="modal-body" align="center">
                    <table style="width: 100%">
                        <tr>
                            <td class="p-3"><div class="p-2" style="background-color: #73a9ff; text-align:center;">LONGSTAY GUEST</div></td>
                            <td class="p-3"><div class="p-2" style="background-color: yellow; text-align:center;">DAY-USE GUEST</div></td>
                            <td class="p-3"><div class="p-2" style="background-color: rgb(255, 0, 0); text-align:center; color:white;">CANCEL GUEST</div></td>
                        </tr>
                    </table>
                </div>

                <div class="modal-footer">
                    <button type="submit" class="btn bg-light" data-dismiss="modal">Close</button>
                </div>

			</div>
		</div>
	</div>
	<!-- /Alert Modal -->

    <!-- Alert Modal -->
	<div id="stat_group" class="modal fade" tabindex="-1">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-info" align="center">
                    <div class="modal-title">
                        <h5>  Statistics Group <span id="title_stat_group"></span>  </h5>
                    </div>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

                <div class="modal-body" style="font-weight: bold">
                    <div class="mt-2">

                        Total Room in This Group : <span id="count_stat_group"></span>

                        <legend></legend>

                        <div class="row col-lg-12">
                            <div class="col-lg-6">
                                Expected Arrival
                            </div>
                            <div class="col-lg-6">
                                : <span id="ea_stat_group">0</span>
                            </div>
                        </div>

                        <div class="row col-lg-12">
                            <div class="col-lg-6">
                                Expected Departure
                            </div>
                            <div class="col-lg-6">
                                : <span id="ed_stat_group">0</span>
                            </div>
                        </div>

                        <div class="row mt-1 col-lg-12">
                            <div class="col-lg-6">
                                Departure
                            </div>
                            <div class="col-lg-6">
                                : <span id="departure_stat_group">0</span>
                            </div>
                        </div>

                        <div class="row mt-1 col-lg-12">
                            <div class="col-lg-6">
                                In House
                            </div>
                            <div class="col-lg-6">
                                : <span id="inhouse_stat_group">0</span>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="modal-footer">
                    <button type="submit" class="btn bg-light" data-dismiss="modal">Close</button>
                </div>

			</div>
		</div>
	</div>
	<!-- /Alert Modal -->

    {{-- Modal Room Availability --}}
        <div id="modal_room_availability" 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="fab fa-buromobelexperte"></i>&nbsp; Room Number Availability
                        </h6>
                        <button type="button" class="close" data-dismiss="modal">&times;</button>
                    </div>

                    {{-- <div class="modal-body room-number-availability-modal-body scroll-vertical" style="height: 650px;"> --}}
                    <div class="modal-body room-number-availability-modal-body outer" >
                        <div class="inner">
							<table class="table table-sticky table-bordered table-striped" id="table_room_availibility" >
                                <tbody id="tbody_room_availability"></tbody>
							</table>
						</div>
                    </div>

                    <div class="modal-footer mt-3">
                        <div class="text-right">
                            <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    {{-- Modal Room Availability --}}

    <!--MODAL-->
        <div id="detail_reservation" class="modal fade" tabindex="-1">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header bg-info" align="center">
                        <h6 class="modal-title"><i class="icon icon-info22 mr-1"></i>Detail Reservation</h6>
                        <button type="button" class="close" data-dismiss="modal">&times;</button>
                    </div>

                    <div class="modal-body">

                        <div class="form-group row">
                            <div class="col-form-label col-sm-1 btn-block">
                                <i class="icon-user fa-fw" style="height: 100"></i>
                            </div>
                            <div class="col-form-label col-lg-8">
                                <span id="guest_name_detail" class="font-weight-bold">G. Dragmire</span>
                                <br>
                                <span class="text-muted"> <span id="segmentasi_detail">Walkin</span> | <span id="reservation_no_detail"></span> </span>
                            </div>
                        </div>
                        <div class="form-group row" style="text-align: center">
                            <div class="col-form-label col-sm-5" style="background-color: #f2f5f7">
                                <span id="start_date_detail" class="font-weight-bold">
                                </span>
                                <br>
                                <span id="start_time_detail">
                                </span>
                            </div>
                            <div class="col-form-label col-sm-2" style="background-color: #e6eaed">
                                <span id="night_detail" class="font-weight-bold" style="color: #000000">
                                </span>
                                <br>
                                <span style="color: #000000" class="font-weight-bold text-muted">Nights</span>
                            </div>
                            <div class="col-form-label col-lg-5" style="background-color: #f2f5f7" id="start_end_detail_1">
                                <span id="end_date_detail" class="font-weight-bold">
                                </span>
                                <br>
                                <span id="end_time_detail">
                                </span>
                            </div>
                        </div>
                        <div class="form-group row">
                            <div class="col-form-label col-sm-3">
                                <span class="font-weight-bold"> Booking Date </span>
                                <br>
                                <span id="created_at_detail"></span>
                            </div>
                            <div class="col-form-label col-sm-1"></div>
                            <div class="col-form-label col-lg-7" id="pax_detail_1" style="text-align: right">
                                <span class="font-weight-bold">Pax</span>
                                <br>
                               <i class="icon-man"></i> <span class="col-form-label" id="pax_detail"></span>
                            </div>
                        </div>
                        <div class="form-group row">
                            <div class="col-form-label col-sm-4">
                                <span class="font-weight-bold">Room/Room Type</span>
                                <br>
                                <span id="room_roomtype_detail"></span>
                            </div>
                        </div>
                        <div class="form-group row">
                            <div class="col-form-label col-sm-4">
                                <span class="font-weight-bold">Room Rate</span>
                                <br>
                                <span id="room_roomrate_detail"></span>
                            </div>
                        </div>

                        <legend></legend>

                        <div class="form-group row">
                            <label class="col-form-label col-sm-3">Total :</label>
                            <label class="col-form-label col-sm-1">:</label>
                            <div class="col-form-label col-lg-8" id="total_detail">
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-form-label col-sm-3">Paid :</label>
                            <label class="col-form-label col-sm-1">:</label>
                            <div class="col-form-label col-lg-8" id="paid_detail">
                            </div>
                        </div>
                        <div id="paid_out" class="form-group row">
                            <label class="col-form-label col-sm-3">Paid Out :</label>
                            <label class="col-form-label col-sm-1">:</label>
                            <div class="col-form-label col-lg-8" id="paid_out_detail">
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-form-label col-sm-3">Balance :</label>
                            <label class="col-form-label col-sm-1">:</label>
                            <div class="col-form-label col-lg-8" id="balance_detail">
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    <!--/MODAL-->

    <!--Modal check out groupm modal-->
    <div id="checkoutgroupmodal" class="modal fade">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header bg-info" align="center">
                    <h6 class="modal-title"><i class="icon icon-info22 mr-1"></i>Checked out group</h6>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>

                <form action="{{url('submitcheckoutgroup')}}" method="post">
                    @csrf
                    <div class="modal-body">
                        <div class="col-md-12 mt-2">
                            <div id="alert-description" class="alert alert-warning text-center mb-2" role="alert">
                                Please check the balance every bill first!
                            </div>
                        </div>
                        <div class="row" style="text-align: center">
                            <div class="col-md-4">
                                <div class="form-group font-weight-bold">
                                    ROOM
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group font-weight-bold">
                                    Guest Name
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group font-weight-bold">
                                    Condition C/O
                                </div>
                            </div>
                        </div>
                        <legend></legend>
                        <div id="list-room-cgroup" style="text-align: center">

                        </div>
                    </div>

                    <div class="modal-footer">
						<button type="button" class="btn bg-light" data-dismiss="modal">Cancel</button>
						<button type="submit" id="submitcheckoutall" class="btn bg-info">Checked out all</button>
					</div>
                </form>

            </div>
        </div>
    </div>
    <!--Modal check out groupm modal-->

    <!-- Keycard modal -->
    <div id="modal-extendstay" class="modal fade">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header bg-warning" align="center">
                    <h6 class="modal-title"><i class="fas fa-running mr-1"></i>Extend Stay</h6>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>

                <form id="extendstaygroup" action="{{url('extendstay-group')}}" method="post">
                    @method('post')
                    @csrf

                    <div class="modal-body">
                        <label class="col-form-label" id="label_current_room">
                            <tr>
                                <td style="width:110px; height:25px">Total Room<td>
                                <td>: 2<td>
                            </tr>
                        </label>
                        <hr class="mt-1">
                        <div class="row" style="text-align: center">
                            <div class="col-sm-1">
                                <div class="form-group font-weight-bold">
                                    Room
                                </div>
                            </div>
                            <div class="col-sm-3">
                                <div class="form-group font-weight-bold">
                                    Guest Name
                                </div>
                            </div>
                            <div class="col-sm-3">
                                <div class="form-group font-weight-bold">
                                    Last start - End
                                </div>
                            </div>
                            <div class="col-sm-2">
                                <div class="form-group font-weight-bold">
                                    Night
                                </div>
                            </div>
                            <div class="col-sm-3">
                                <div class="form-group font-weight-bold">
                                    Next start - End
                                </div>
                            </div>
                        </div>
                        <input type="hidden" name="booking_id" id="booking_id_es">
                        <div id="extendgroup-list" style="text-align: center">

                        </div>
                    </div>

                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                        <button type="submit" class="btn btn-primary">Submit</button>
                    </div>

                </form>
            </div>
        </div>
    </div>
    <!-- Keycard modal -->

    </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/extensions/jquery_ui/interactions.min.js')}}"></script>
    <script src="{{asset('global_assets/js/plugins/loaders/blockui.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/demo_pages/form_select2.js')}}"></script>

    <script src="{{asset('global_assets/js/plugins/forms/inputs/jquery.mask.js')}}"></script>

    <!-- Helpers JS -->
    <script src="{{asset('assets/js/custom.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('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/form_checkboxes_radios.js')}}"></script>
	<script src="{{asset('global_assets/js/demo_pages/gallery_library.js')}}"></script>

    <script src="{{asset('global_assets/js/plugins/forms/validation/validate.min.js')}}"></script>

	<script type="text/javascript">

    // Protect multiple click
        $(document).ready(function () {
            // add payment
                $('.submit-add-payment').click(function(){
                    let input = $('#add_payment').find(':input, select').not(':input[type=submit],:input[id=description_payment],:input[id=voucher_deposit],:hidden')

                    let lolos = true

                    $.each(input, function(key, val){
                        if (!$(val).val()) {
                            lolos = false

                            return;
                        }
                    });

                    if(lolos){
                        $(this).attr("disabled", true);
                        $('#add_payment').submit()
                    }
                })
                $('.btn-submit-dayuse').click(function(){
                    $('.form-submit-custom').submit()
                })
                $('.btn-submit-dayuse-ref').click(function(){
                    $('.form-submit-custom-ref').submit()
                })
            // add payment

            // add transaction
                $('#add_transaction input').on('change', function(e) {
                    $('.submit-add-transaction').attr("disabled", false);
                });
                $('#add_transaction select').on('change', function(e) {
                    $('.submit-add-transaction').attr("disabled", false);
                });
                $('.submit-add-transaction').click(function(){
                    $(this).attr("disabled", true);
                    let input = $('#add_transaction').find(':input, select').not(':input[type=submit],.description_input,:hidden,:button')

                    let lolos = true

                    $.each(input, function(key, val){
                        if (!$(val).val()) {
                            lolos = false

                            return;
                        }else if( $(val).attr('id') == 'jumlah' && !$(val).val() <= 0){
                            lolos = false

                            return;
                        }
                    });

                    if(lolos){
                        $(this).attr("disabled", true);
                        $('#add_transaction').submit()
                    }
                })
            // add transaction
        });
    // protect multiple click

    // variable untuk tax dan services
    let tax_percent_global      = 0;
    let services_percent_global = 0;

	//SPLIT BILL
	let jenis_identitas = {!! json_encode(config('custom.jenis_identitas')) !!};
	let tipe_booking = {!! json_encode(config('custom.tipe_booking')) !!};
	let jenis_pembayaran = {!! json_encode(config('custom.jenis_pembayaran')) !!};
	let jenis_refund = {!! json_encode(config('custom.jenis_refund')) !!};
	let status_bill = {!! json_encode(config('custom.status_bill')) !!};
	let jenis_deposit_text = {!! json_encode(config('custom.jenis_deposit')) !!};
    let segmentasi =  {!! json_encode(config('custom.segment_ratecodes')) !!};
    let hotel_id_now =  {!! json_encode($hotel_id) !!};
    let permission = {!! json_encode(\Auth::user()->permission_change_reserv) !!};

	let arrays_kamarss = [];
	function checkNomor(id){
		let nomor = $('#'+id).val()

		// make it check to prevent maximum callstack
		if (nomor) {
			if(arrays_kamarss.includes(nomor)) {
				$('#'+id).val('').trigger('change')

				callModalAlert("You can't selected same room number!")

				return;
			}
		}

		// to fill array container room number
		let all_nomors = $('.nomor_kamars')
		$.each(all_nomors, function(key, val){
			arrays_kamarss[key] = $(val).val()
		});

        // ======== Hidden After Add Room ========
            hiddenSelectedNomorKamar();
        // ======== Hidden After Add Room ========
        // setTimeout(function(){
        //     $('.nomor_kamars').select2();
        // }, 500);
	}

    // function for check all set room before submit group checkin
        function checkSetAllRoom(from){
            // from = 1 = Checkin
            // from = 2 = Group Checkin

            let all_nomors = []

            // to fill array container room number
            if (from == 2) {
                console.log('room-number-group-checkin');
                all_nomors = $('.room-number-group-checkin')
            }else{
                console.log('room-number-checkin');
                all_nomors = $('.room-number-checkin')
            }

            let success = true

            $.each(all_nomors, function(key, val){
                console.log($(val).val())
                if (!$(val).val()) {
                    success = false
                    return
                }
            });

            if (!success) {
                callModalAlert("Please make sure all the room number is not empty.");
            }else{
                if (from == 2) {
                    let booking_detail_id = $('#booking_detail_id_checkin').val()
                    let code = $('#code_group_checkin').val()
                    let group_name = $('#group_checkin_group_name').val()

                    checkStatusRoom(booking_detail_id, code, group_name)
                }else{
                    console.log('submitted check in group');
                    $('#set_room_number').submit()
                }
            }
        }
    // function for check all set room when group checkin

    // function for check Status Room
        function checkStatusRoom(booking_detail_id, code, group_name){
            $.ajax({
                type: 'GET',
                url: "{{ url('/check-status-room')}}/"+booking_detail_id+"/"+code+"/"+group_name,
                success: function (data) {
                    console.log(data)
                    if (data.result === 0) {
                        let html = ''

                        if (data.occupied.length > 0) {
                            html += 'Some Room Still Occupied '
                            html += Object.keys(data.occupied).map(function(key_room) {
                                                        return data.occupied[key_room];
                                                    }).join(', ');
                            html += ' , wait until vacant first.'
                        }else if (data.rooms.length > 0) {
                            html += 'Status room with number '
                            html += Object.keys(data.rooms).map(function(key_room) {
                                                        return data.rooms[key_room].no_kamar;
                                                    }).join(', ');
                            html += ' is VD, please change status room.'
                        }

                        callModalAlert(html);
                    }else{
                        $('#form_group_checkin').submit()
                    }
                }
            });
        }
    // function for check status room

    // function checkoutgroup
        function checkoutgroup(booking_id) {
            $('#submitcheckoutall').prop('disabled', true)
            var ready = 0;

            $.ajax({
                type: "get",
                url: "{{url('checkoutgroup-get')}}",
                data: {
                    booking_id:booking_id
                },
                async: false,
                cache: false,
                timeout: 30000,
                dataType: "json",
                success: function (response) {
                    var html = '';
                    $.each(response.bdetails, function (index, value) {
                        html += `
                            <div class="row">
                                <input type="hidden" name="detailid[${index}]" value="${value.id}">
                                <div class="col-md-4">
                                    <div class="form-group">
                                        <a href="{{url('invoice-draft')}}/${value.invoice_id}" title="FO Invoice">${value?.current}</a>
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="form-group">
                                        ${value?.guest_room}
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="form-group font-weight-bold">
                                        ${value.balance === 0 ? '<span class="text-success">Balance</span>' : '<span class="text-danger">Not balance</span>'}
                                    </div>
                                </div>
                            </div>
                        `;
                        if (value.balance === 0) {
                            ready++
                        }
                    });
                    if (ready > 0) {
                        $('#submitcheckoutall').prop('disabled', false)
                    }
                    $('#list-room-cgroup').html(html)
                }
            });

            $('#checkoutgroupmodal').modal('show')
        }
    // function checkoutgroup


	$('#alertStatusModal').on('hidden.bs.modal', function () {
		arrays_kamarss = [];
	})

    function checkValue() {
        let req_conditions = 0;
        $('.alert_status_number_select').each(function(index){
            console.log(this.value)
            if(this.value == null){
                req_conditions++;
            }else if(!this.value){
                req_conditions++;
            }
        });

        console.log(req_conditions)
        if (req_conditions > 0) {
            $('#submit_setnumberform').prop('disabled', true)
        }else{
            $('#submit_setnumberform').prop('disabled', false)
        }
    }

	// function to call modal and this additional param
	function callModalAlert(text) {
		$('#text-alert').html("<h3>"+text+"</h3>")
		$('#alert_modal').modal('show')
	}

    // Function auto arrangement
    function autoArrangement(btn, element = ""){
        let value_rate_code = $("#rate_code"+element).val();
        let status = parseInt($("#rate_code"+element).find('option[value="'+value_rate_code+'"]').attr('data-include_breakfast')); // ambil data status breakfast aktiv atau tidak
        let rate_code_id = parseInt($("#rate_code"+element).find('option[value="'+value_rate_code+'"]').attr('data-id')); // ambil data id rate code

        // Rate Code Arrangement Code Bundle, !Reminder variable btn : for condition when just change rate code and prevent maximum call error.
        if (status == 1 && btn == 1) {
            $.ajax({
                type: 'get',
                url: "{{ url('/getarrangementfromratecode')}}/"+rate_code_id,
                dataType: "json",
                success: function (data) {
                    $("#arrangement_code"+element).val(data.arrangement_code).trigger('change')//trigger change when rate code have bundle with arrangement

                    // Append new input for replace the disabled select arrangement code
                    let html_hidden = `<input type="hidden" class="hidden_arr_codes" id="arrangement_hidden" name="arrangement_codes" value="${data.arrangement_code}">`
                    $("#hidden_arrangement_code_container"+element).append(html_hidden)
                }
            });
        }else  if(btn == 1){
            $("#arrangement_code"+element).val('').trigger('change')//If not have linked or bundled arrangement code with rate code
            $("#arrangement_hidden"+element).remove()
        }
    }


	//modal cancel reservation
	$(document).on("click", ".statusbutton", function () {
		var hotel_id = $(this).data('hotel_id')
		var id = $(this).data('id_booking')
		var detail_id = $(this).data('detail_id')

		$('#id_booking_cancel_reservation').val(id)
		$('#hotel_id_cancel_reservation').val(hotel_id)
		$('#status_booking_cancel_reservation').val(13)
		$('#detail_id_cancel_reservation').val(detail_id)
	});

	// Js untuk modal status lock
	function updateStatusLock(status_lock, id, nama) {
		let html = `<option value="1" data-icon="lock4" ${status_lock == 1 ? 'selected' : ''}>Lock</option>
					<option value="0" data-icon="unlocked" ${status_lock == 0 ? 'selected' : ''}>Unlock</option>`
		console.log(id, nama)
		$('#id_booking_status_lock').val(id)
		$('#status_lock').html(html)
		// $('#no_kamar_text').text(no_kamar)
		$('#nama_booking_status_lock').val(nama)
	}

	//Cek status company jika status company inactive booking tidak dapat ditambahkan
	$('#company_ledger_pembayaran_checkout').on('change', function(){
			let company_val = $(this).val();
			let status_company = $(this).find('option[value="'+company_val+'"]').attr('data-status');
			let status_company_text = $(this).find('option[value="'+company_val+'"]').attr('data-status-text');
			let nama_perusahaan = $(this).find('option[value="'+company_val+'"]').attr('data-perusahaan');

			//Status 1: Active; 2: Deactive
			if(status_company == 2){
				let url = "{{url('companyguestprofile')}}";
				$('#company_danger').html('Status Ledger Perusahaan &nbsp;<a href="'+url+'/'+company_val+'/edit" target="_blank"><b>'+nama_perusahaan+'</b></a>&nbsp; Dalam Status <b>'+status_company_text+'</b> Tidak Dapat Menambahkan Transaksi');
				$('#submit_pembayaran_checkout').attr('disabled', 'disabled');
			}
			else{
				$('#company_danger').html('');
				$('#submit_pembayaran_checkout').removeAttr('disabled');
			}
	});


	function getDataKamar(nomor_kamar, data_kamar, night = null, guest_id = null){
        // alert(nomor_kamar)
        // reset modal
            // reset form
            $('#bookingModal').find('form').trigger('reset');

            // reset rate code
            $('#rate_code').val('').trigger('change')

            // reset total biata booking text
            $('#total_biaya_booking_text').val('');
            $('#nominal_deposit_book').val('');

            // Reset submit button
            $('.submit-quick-booking').attr('disabled', false)
        // Closing reset modal

        // If any Guest Profile
        if (guest_id) {
            let name = $('#datalistOptions').find('option[data-id="'+guest_id+'"]')
										.val();

            $('#nama_booking').val(name).trigger('change')
        }

        // If any night
        if (night) {
            $('#nomor_kamar').val(null)
            $('#jumlah_malam').val(night).trigger('change')
        }

        //Untuk mencari ketersediaan nomor kamar
            let checkin = moment("{{ getSystemDate() }}").format('YYYY-MM-DD')
            let checkout = moment("{{ getSystemDate() }}", 'YYYY-MM-DD').add(1, 'days').format('YYYY-MM-DD')

            $.ajax({
                type: "GET",
                url: "{{route('roomview.check-room-stock')}}",
                data: {
                    room_no:nomor_kamar,
                    checkin: checkin,
                    checkout: checkout,
                },
                success: function (response) {
                    if (response == 1) {
                        $('#bookingModal').modal('show');
                    }else{
                        callModalAlert("This room is not available.")
                    }
                }
            });
        //Untuk mencari ketersediaan nomor kamar

		let html = `<option data-id=""
							data-diskon=""
							data-kapasitas=""
							value="">-- Choose Room Type --</option>`;

		let html_rate_code = `<option value="" data-harga="0" data-include_breakfast="0">-- Select Rate Code --</option>`;

		let diskon_kamar = 0;

		$.each(data_kamar, function(key, val){
			diskon_kamar = val?.discount?.length > 0 ? val.discount[0].diskon : 0;
			diskon_tipe = val?.discount?.length > 0 ? val.discount[0].disctype : 0;
			html += `<option data-id="${val.id}"
                             data-diskon="${diskon_kamar}"
                             data-kapasitas="${val.kapasitas}"
                             data-disctype="${diskon_tipe}"
                             value="${val.nama}"
                     >${val.nama} (${val.kapasitas} Orang)</option>`
		});

		$('#jns_kamar').html(html);
		$('#text_no_kamar').html(nomor_kamar);
		$('#nomor_kamar').val(nomor_kamar);
        $('#rate_code').html(html_rate_code);
		$('#per_item_arr').val('0');
		$('#per_item_arr_service').val('0');
		$('#per_item_arr_tax').val('0');

		// getCodeBookingRealtime();
	}

    function loadScreen(element, status){
        // Status
            // 1 = Block
            // 2 = Unblock
        // Status

        if (status == 1) {
            $(element).block({
                message: '<span class="font-weight-semibold"><i class="icon-spinner4 spinner mr-2"></i>&nbsp; Please Wait...</span>',
                centerY: false,
                centerX: false,
                overlayCSS: {
                    backgroundColor: '#fff',
                    opacity: 0.8,
                    cursor: 'wait',
                    height:'100%'
                },
                css: {
                    border: 0,
                    padding: '10px 15px',
                    color: '#fff',
                    width: '30%',
                    position:'absolute',
                    '-webkit-border-radius': 3,
                    '-moz-border-radius': 3,
                    backgroundColor: '#333'
                }
            });
        }else if(status == 2){
            $(element).unblock();
        }
    }

    function openModalRoomAvailability() {
        let start_date = moment($('#start_date').val(), 'DD-MM-YYYY').format('YYYY-MM-DD')
        let end_date = moment($('#end_date').val(), 'DD-MM-YYYY').format('YYYY-MM-DD')
        let system_date = moment("{{ getSystemDate() }}", 'YYYY-MM-DD').format('YYYY-MM-DD')
        let room_no = $('#nomor_kamar').val()
        let guest_id = $('#guest_profile_id').val()
        let night = $('#jumlah_malam').val()
		    console.log(end_date);

        // reset
        $('#tbody_room_availability').html('')

        $.ajax({
            type: "GET",
            url: "{{ url('get-room-availability-by-room-no')}}/"+start_date+'/'+end_date+'/'+room_no,
            dataType: "json",
            beforeSend: function(){
                loadScreen('.room-number-availability-modal-body', 1)
            },
            success: function (response) {
                let dates = response.dates
                let jenis_kamars = response.jenis_kamars
                let stocks = response.stocks
                let ooo_schedule = response.ooo_schedule
                let alternative_rooms = response.alternative_rooms
                let alternative_stocks = response.alternative_stocks

                let month_element = ''
                let day_element = ''
                let room_no_element = ''
                let stock_element = ''
                let available_element = ''
                let checkin = ''
                let not_available = false
        				console.log(response);

                // dates for header
                $.each(dates, function(month, date){
                    let colspan_date = date.length

                    month_element += `<th class="text-center headcol position-month" colspan="${colspan_date}">${month}</th>`

                    $.each(date, function(key_day, day){
                        let day_name = moment(day).format('ddd')
                        let day_date = moment(day).format('DD')
                        day_element += `<th class="text-center headcol position-day" >
                                            ${day_name}
                                            <br>
                                            ${day_date}
                                        </th>`
                    });
                });

                // room available
                $.each(stocks, function(key_stock, stock){
                    if (stock < 1) {
                        stock_element += `<td class="text-center p-2 bg-danger text-white bodycol"><i class="fas fa-calendar-times"></i></td>`
                    }else{
                        stock_element += `<td class="text-center p-2 bg-success text-white bodycol" ><i class="fas fa-calendar-check"></i></td>`
                    }
                });

                room_no_element += `
                                            <tr>
                                                <td class="headcol position-room-no bg-info">
                                                    <button type="button" class="btn btn-link" style="color:#333">
                                                        ${room_no} (Now)
                                                    </button>
                                                </td>
                                                ${stock_element}
                                            </tr>
                                        `

                // alternative rooms
                $.each(alternative_rooms, function(key_alternative_rooms, alternative_room){
                    not_available = false
                    stock_element = ''
                    available_element = ''

                    // room available
                    $.each(alternative_stocks[alternative_room.no_kamar], function(key_alternative_stock, alternative_stock){
                        if (alternative_stock < 1) {
                            stock_element += `<td class="text-center p-2 bg-danger text-white bodycol"><i class="fas fa-calendar-times"></i></td>`

                            checkin = moment(key_alternative_stock, 'YYYY-MM-DD').format('YYYY-MM-DD')

                            if ((checkin == system_date) || (checkin >= start_date && checkin < end_date)) {
                                not_available = true
                            }
                        }else{
                            if (['OOO','OS'].includes(alternative_room.status)) {
                                stock_element += `<td class="text-center p-2 bg-danger text-white bodycol"><i class="fas fa-calendar-times"></i></td>`
                            }else{
                                stock_element += `<td class="text-center p-2 bg-success text-white bodycol"><i class="fas fa-calendar-check"></i></td>`
                            }
                        }
                    });

                    // Check if status alternative room is not VC, then give value true for not available variable
                    if (!['VC'].includes(alternative_room.status)) {
                        not_available = true
                    }

                    // add button element for variable room number element
                    if (not_available) {
                        available_element += `<button type="button" class="btn btn-link" style="color:#333">
                                                ${alternative_room.no_kamar}
                                            </button>`
                    }else{
                        available_element += `<button type="button" class="btn btn-link" onclick='getDataKamar('${alternative_room.no_kamar}', `+JSON.stringify(alternative_room?.jenis_kamars)+`, ${night ?? null}, ${guest_id ?? null})' data-dismiss="modal">
                                                ${alternative_room.no_kamar}
                                            </button>`

                    }

                    // add Room Number Alternative to variable Room number element
                    room_no_element += `
                                            <tr>
                                                <td class="headcol position-room-no" style="width: 200px; background: white;">
                                                    ${available_element}
                                                </td>
                                                ${stock_element}
                                            </tr>
                                        `
                });

                // alternative rooms
                $.each(alternative_rooms, function(key_alternative_rooms, alternative_room){
                    not_available = false
                    stock_element = ''
                    available_element = ''

                    // room available
                    $.each(alternative_stocks[alternative_room.no_kamar], function(key_alternative_stock, alternative_stock){
                        if (alternative_stock < 1) {
                            stock_element += `<td class="text-center p-2 bg-danger text-white bodycol"><i class="fas fa-calendar-times"></i></td>`

                            checkin = moment(key_alternative_stock, 'YYYY-MM-DD').format('YYYY-MM-DD')

                            if ((checkin == system_date) || (checkin >= start_date && checkin <= end_date)) {
                                not_available = true
                            }
                        }else{
                            if (['OOO','OS'].includes(alternative_room.status)) {
                                stock_element += `<td class="text-center p-2 bg-danger text-white bodycol"><i class="fas fa-calendar-times"></i></td>`
                            }else{
                                stock_element += `<td class="text-center p-2 bg-success text-white bodycol"><i class="fas fa-calendar-check"></i></td>`
                            }
                        }
                    });

                    // Check if status alternative room is not VC, then give value true for not available variable
                    if (!['VC'].includes(alternative_room.status)) {
                        not_available = true
                    }

                    // add button element for variable room number element
                    if (not_available) {
                        available_element += `<button type="button" class="btn btn-link" style="color:#333">
                                                ${alternative_room.no_kamar}
                                            </button>`
                    }else{
                        available_element += `<button type="button" class="btn btn-link" onclick='getDataKamar('${alternative_room.no_kamar}', `+JSON.stringify(alternative_room?.jenis_kamars)+`, ${night ?? null}, ${guest_id ?? null})' data-dismiss="modal">
                                                ${alternative_room.no_kamar}
                                            </button>`

                    }

                    // add Room Number Alternative to variable Room number element
                    room_no_element += `
                                            <tr>
                                                <td class="headcol position-room-no" style="width: 200px; background: white;">
                                                    ${available_element}
                                                </td>

                                                ${stock_element}
                                            </tr>
                                        `
                });

                let content = `
                                    <tr>
                                        <th class="headcol position-empty" background: white;" style="width:200px" rowspan="2">
                                        </th>

                                        ${month_element}
                                    </tr>

                                    <tr>
                                        ${day_element}
                                    </tr>

                                    ${room_no_element}
                                `
                $('#tbody_room_availability').html(content)
            },
            complete: function(){
                loadScreen('.room-number-availability-modal-body', 2)
            }
        });
    }

	//Jenis Kamar
	$('#jns_kamar').on('change', function(){
		let value = $(this).val();
		let diskon = $(this).find('option[value="'+value+'"]').attr('data-diskon');
		let disctype = $(this).find('option[value="'+value+'"]').attr('data-disctype');
		let jenis_kamar_id = $(this).find('option[value="'+value+'"]').attr('data-id');
		let pax = $(this).find('option[value="'+value+'"]').attr('data-kapasitas');
		let segmentasi = $('#segmentasi_rate_code').val();
		let checkin = moment( $('#start_date').val(), 'DD-MM-YYYY' ).format('YYYY-MM-DD');

        $('#pax').val(pax)

		$('#diskon').val(diskon);
		$('#disctype').val(disctype);
        $('#jenis_kamar_id').val(jenis_kamar_id);

		selectRateCode(jenis_kamar_id, segmentasi, checkin);

        $(this).valid()

         // reset modal
            // reset rate code
            $('#rate_code').val('').trigger('change');

            // reset total biata booking text
            $('#total_biaya_booking_text').val('');
            $('#nominal_deposit_book').val('');

            // reset date
            $('#jumlah_malam').val(1);
            $('#start_date').val("{{ dateFormat(getSystemDate(), 'd-m-Y') }}");
            $('#end_date').val("{{ date( 'd-m-Y', strtotime( getSystemDate().' +1 day' ) ) }}");
        // Closing reset modal
	});

    $('#rate_code').on('change', function(){
        $(this).valid()
    })

    $('#arrangement_code').on('change', function(){
        $(this).valid()
    })

	// $('#segmentasi_rate_code').on('change', function(){
	// 	let segmentasi_value = $(this).val();
	// 	let checkin = $('#start_date').val();
	// 	let jenis_kamar_value = $('#jns_kamar').val();
	// 	let jenis_kamar_id = $(this).find('option[value="'+jenis_kamar_value+'"]').attr('data-id');
	// 	//Enable pilihan company guest jika segmentasinya company (Value 2 (Corporate) atau 3 (Group corporate))
	// 	if(['2','3'].includes(segmentasi_value)){
	// 		$('#company_id').removeAttr('disabled');
	// 		$('#company_id').attr('required', 'required');
	// 	}else{
	// 		$('#company_id').removeAttr('required');
	// 		$('#company_id').attr('disabled', 'disabled');
	// 		$('#company_danger').html('');
	// 		$('#submit').removeAttr('disabled');
	// 	}
	// 	selectRateCode(jenis_kamar_id, segmentasi_value, checkin);
	// });

	//Cek status company jika status company inactive booking tidak dapat ditambahkan
	// $('#company_id').on('change', function(){
	// 	let company_val = $(this).val();
	// 	let status_company = $(this).find('option[value="'+company_val+'"]').attr('data-status');
	// 	let status_company_text = $(this).find('option[value="'+company_val+'"]').attr('data-status-text');
	// 	let nama_perusahaan = $(this).find('option[value="'+company_val+'"]').attr('data-perusahaan');
	//
	// 	//Status 1: Active; 2: Deactive
	// 	if(status_company == 2){
	// 		let url = "{{url('companyguestprofile')}}";
	// 		$('#company_danger').html('Status Ledger Perusahaan &nbsp;<a href="'+url+'/'+company_val+'/edit" target="_blank"><b>'+nama_perusahaan+'</b></a>&nbsp; Dalam Status <b>'+status_company_text+'</b> Tidak Dapat Menambahkan Transaksi');
	// 		$('#submit').attr('disabled', 'disabled');
	// 	}
	// 	else{
	// 		$('#company_danger').html('');
	// 		$('#submit').removeAttr('disabled');
	// 	}
	// });

	function selectRateCode(jenis_kamar, segmentasi, checkin){
		console.log(segmentasi)
		$.ajax({
			type: 'GET',
			url: "{{ url('/getratecodes')}}/"+jenis_kamar+"/7/"+checkin,
            data:{from:'walkin'},
			success: function (data) {
				$('#rate_code').html(data);
                console.log('If rate code just one:'+$('#rate_code').val())
                if($('#rate_code').val() != null){
                    // calculatePrice(1)
                    autoArrangement(1);
                }
			}
		});
	}

	function getCodeBookingRealtime(){
		$.ajax({
			type: 'GET',
			url: "{{ url('kode-booking-realtime')}}",
			success: function (data) {
				// $('#kode_booking').val(data);
			}
		});
	}

    // Calculate Price
    function calculatePrice(btn, element = '', fdisc = null){
		let ratecode_value = $("#rate_code"+element).val();
		let ratecode_id = $("#rate_code"+element).find('option[value="'+ratecode_value+'"]').attr('data-id');
		let harga = parseInt($("#rate_code"+element).find('option[value="'+ratecode_value+'"]').attr('data-harga'));
        // $('#roomrate_change').val(harga.toLocaleString('ID'));

		let status = parseInt($("#rate_code"+element).find('option[value="'+ratecode_value+'"]').attr('data-include_breakfast')); // ambil data status breakfast aktiv atau tidak

        let value_arrangement_code = $("#arrangement_code"+element).val();
        let arrangement_id = $("#arrangement_code"+element).find('option[value="'+value_arrangement_code+'"]').attr('data-id');
        let harga_arrangement = parseInt(getRealPriceArrangement(arrangement_id, '#pax'+element));
        // let harga_arrangement = parseInt($("#arrangement_code"+element).find('option[value="'+value_arrangement_code+'"]').attr('data-harga'));
        let arrangement_service = parseInt($("#arrangement_code"+element).find('option[value="'+value_arrangement_code+'"]').attr('data-service'));
        let arrangement_tax = parseInt($("#arrangement_code"+element).find('option[value="'+value_arrangement_code+'"]').attr('data-tax'));

        // new adjustment tax service arr item
        var this_pax = $('#pax'+element).val()
        arrangement_tax = arrangement_tax * this_pax;
        arrangement_service = arrangement_service * this_pax;

        $('#arrangement_hidden').val(value_arrangement_code)
        let segment_rate_code = $("#rate_code"+element).find('option[value="'+ratecode_value+'"]').attr('data-segmentrc'); // ambil data segment rate code

		let jumlah_malam = parseInt($('#jumlah_malam'+element).val());
		let diskon = parseInt($('#diskon'+element).val());
		let disctype = parseInt($('#disctype'+element).val());
		let tipe_rate_code = 1;
		// let diskon = 0;

        if ($('#diskon'+element).val() < 1) {
            if (parseInt($('#discount_type_man').val())) {
                disctype    = parseInt($('#discount_type_man').val());
                diskon      = parseInt($('#discount_value_man').val()) ?? 0;

                $('#diskon'+element).val(diskon)
                $('#disctype'+element).val(disctype)
            }
        }

        if (fdisc) {
            harga = parseInt(($('#per_item').val()).replaceAll(",",""));
            harga_arrangement = 0;
            console.log(harga)
        }

        var this_harga_diskon = (harga * (diskon/100));
        if (disctype == 2) {
            this_harga_diskon = diskon;
        }
        let harga_bef_disc = harga + harga_arrangement;

        harga = parseInt(harga - this_harga_diskon);//ADD DISKON PERCENT
        harga = harga + harga_arrangement; // SUM RATECODE PRICE AND ARRANGEMENT PRICE

        $.ajax({
            type: "get",
            url: "{{{url('/getinforatecode')}}}",
            data: {id:ratecode_id},
            dataType: "json",
            async: false,
            cache: false,
            timeout: 30000,
            success: function (rate) {
                tipe_rate_code = rate.tipe_rate_code
            }
        });
        let total = jumlah_malam * harga;
        if (tipe_rate_code == 2) {
            total = harga;
            $('#roomrate_label').html('Total Rate')
            $('#total_rate_label').hide()
        }else{
            $('#roomrate_label').html('Room Rate/Night')
            $('#total_rate_label').show()
        }

        // Assign tax dan services
        let tax             = Math.round(Number(((harga - harga_arrangement) * tax_percent_global)/(100+tax_percent_global)));//Find tax from normal price
        let harga_min_t     = (Number(((harga - harga_arrangement) - tax)));//price minus total tax
        let services        = Math.round(Number((harga_min_t * services_percent_global)/(100+services_percent_global)));//Find service from normal price
        let harga_item_real = (Number((harga - harga_arrangement) - (tax) - (services)));//input per item real

        console.log(harga_item_real)

        // Assign value to hidden input
        $("#per_item_services"+element).val(services);
        $("#per_item_tax"+element).val(tax);
        $("#per_item_total"+element).val(harga_item_real);
        $("#per_item_arr"+element).val(Number(harga_arrangement - arrangement_service - arrangement_tax));
        $("#per_item_arr_service"+element).val(arrangement_service);
        $("#per_item_arr_tax"+element).val(arrangement_tax);

        // assign ratecode id to hidden selratecode
        $('#selratecodeid').val(segment_rate_code)
        $('#ratecode_id').val(ratecode_id)
        $('#per_arrangement_id').val(arrangement_id)

        if (element == '_change_room') {
            $('#rate_code_id_hidden').val(ratecode_id)
        }

        console.log(segment_rate_code, ratecode_id, arrangement_id)

        // Assign value hidden
		$('#per_item'+element).val(ribuanWithComma(harga));

        if (!isNaN(total)) {
            $('#total_biaya_booking_text'+element).val(ribuanWithComma(total));
            $('#nominal_deposit_book'+element).val(ribuanWithComma(total));
            $('#total_biaya_booking'+element).val(total);
        }

        console.log(diskon)
		if(diskon !== 0 && !isNaN(diskon)){
            if (disctype == 2) {
                $("#ket_diskon"+element).html('<strike>'+ribuanWithComma(harga_bef_disc)+'</strike> Disc Fixed '+ribuanWithComma(diskon));
            }else{
                $("#ket_diskon"+element).html('<strike>'+ribuanWithComma(harga_bef_disc)+'</strike> Disc '+diskon+'%');
            }
		}else{
            $("#ket_diskon"+element).html(null);
        }

        // Calling Function Auto Arrangement
        if (!fdisc) {
        autoArrangement(btn, element);
        }
    }

    // Function get real price from arrangement
    function getRealPriceArrangement(arrangement_id, pax_element) {
        let price = 0;

        $.ajax({
            async: false,
            type: 'GET',
            url: "{{ url('get-arrangement-code/')}}/"+arrangement_id,
            success: function (response) {
                let pax = $(pax_element).val()
                let arrangement_code = response.arrangement_code

                if (arrangement_code?.arrangement_code_detail) {
                    $.each(arrangement_code.arrangement_code_detail, function(key_arrangement_code_detail, arrangement_code_detail){
                        if (arrangement_code_detail.always_one == 1) {
                            price += arrangement_code_detail.harga
                        }else{
                            price += arrangement_code_detail.harga * pax
                        }
                    });
                }
            }
        });

        return price
    }

	//Show Remark Booking
	$('#nama_booking').on('change', function(event){
		let data_text = $('#datalistOptions').find('option[value="'+$(this).val()+'"]')
										.attr('data');
		console.log(data_text);
		if(data_text != undefined){
			let data_json = JSON.parse(data_text);
			let hotel_id = $('#hotel_id_booking').val();

			//Clear Form
			$('#nama_booking').val('');

			//Assign Value
			$('#nama_booking').val(data_json.name);

			//Remark
			if (data_json.remark == null || data_json.remark == undefined){
				$('#show_remark').html('*Remark: -');
			}
			else if (data_json.remark != ""){
				if(data_json.hotel_id == hotel_id){
					$('#show_remark').html('*Remark: '+data_json.remark);
				}
				else{
					$('#show_remark').html('*Remark: -');
				}
			}

			$('#guest_profile_id').val(data_json.id);
		}
		else{
			$('#guest_profile_id').val('');
		}
	});

	//Jumlah Malam
    let jumlahmalamoldvalue = 1;
	$('#jumlah_malam').on('change', function(){
		let jml_malam = $(this).val();

		//Set Start Date And Date
		let start_date = $('#start_date').val();
		let end_date = moment(start_date, "DD-MM-YYYY").add(jml_malam, 'days').format('DD-MM-YYYY');
		$('#end_date').val(end_date)

        //Untuk mencari ketersediaan nomor kamar
            let checkin = moment(start_date, 'DD-MM-YYYY').format('YYYY-MM-DD')
            let checkout = moment(end_date, 'DD-MM-YYYY').format('YYYY-MM-DD')
            let nomor_kamar = $('#nomor_kamar').val()

            $.ajax({
                async: false,
                type: "GET",
                url: "{{route('roomview.check-room-stock')}}",
                data: {
                    room_no:nomor_kamar,
                    checkin: checkin,
                    checkout: checkout,
                    check:1
                },
                success: function (response) {
                    if (response < 1) {
                        callModalAlert("This room number is not available according to the to the selected range. Please check room number availability for details.")
                        $('.submit-quick-booking').attr('disabled', true)
                        $('#jumlah_malam').val(jumlahmalamoldvalue).trigger('change')
                        jumlahmalamoldvalue = jumlahmalamoldvalue;
                    }else{
                        $('.submit-quick-booking').attr('disabled', false)
                        jumlahmalamoldvalue = jml_malam;
                    }
                }
            });
        //Untuk mencari ketersediaan nomor kamar

		//Set Harga
		let ratecode_value = $('#rate_code').val();
		let ratecode_id = $('#rate_code').find('option[value="'+ratecode_value+'"]').attr('data-id');
		let harga = parseInt($('#rate_code').find('option[value="'+ratecode_value+'"]').attr('data-harga'));

        let status = parseInt($('#rate_code').find('option[value="'+ratecode_value+'"]').attr('data-include_breakfast')); // ambil data status breakfast aktiv atau tidak
		// let harga_breakfast = parseInt($('#rate_code').find('option[value="'+ratecode_value+'"]').attr('data-harga_breakfast')); // ambil data harga breakfast

        let value_arrangement_code = $("#arrangement_code").val();
        let arrangement_id = $("#arrangement_code").find('option[value="'+value_arrangement_code+'"]').attr('data-id');
        let harga_arrangement = parseInt(getRealPriceArrangement(arrangement_id, '#pax'));
        // let harga_arrangement = parseInt($("#arrangement_code").find('option[value="'+value_arrangement_code+'"]').attr('data-harga'));
		let arrangement_service = parseInt($("#arrangement_code").find('option[value="'+value_arrangement_code+'"]').attr('data-service'));
        let arrangement_tax = parseInt($("#arrangement_code").find('option[value="'+value_arrangement_code+'"]').attr('data-tax'));

        // new adjustment tax service arr item
        var this_pax = $('#pax').val()
        arrangement_tax = arrangement_tax * this_pax;
        arrangement_service = arrangement_service * this_pax;

        let diskon = parseInt($('#diskon').val());
        let disctype = parseInt($('#disctype').val());

        let harga_bef_disc = harga + harga_arrangement;

        var this_harga_diskon = (harga * (diskon/100));
        if (disctype == 2) {
            this_harga_diskon = diskon;
        }
        harga = parseInt(harga - this_harga_diskon);//ADD DISKON PERCENT
        // console.log('diskon: '+harga)
        harga = harga + harga_arrangement; // SUM RATECODE PRICE AND ARRANGEMENT PRICE

        $.ajax({
            type: "get",
            url: "{{{url('/getinforatecode')}}}",
            data: {id:ratecode_id},
            dataType: "json",
            async: false,
            cache: false,
            timeout: 30000,
            success: function (rate) {
                tipe_rate_code = rate.tipe_rate_code
            }
        });

		let total = jml_malam * harga;

        if (tipe_rate_code == 2) {
            total = harga;
        }

        // Assign tax dan services
        let tax             = Math.round(Number(((harga-harga_arrangement) * tax_percent_global)/(100+tax_percent_global)));//Find tax from normal price
        let harga_min_t     = (Number(((harga-harga_arrangement) - tax)));//price minus total tax
        let services        = Math.round(Number((harga_min_t * services_percent_global)/(100+services_percent_global)));//Find service from normal price
        let harga_item_real = (Number(((harga-harga_arrangement)) - (tax) - (services)));//input per item real

        console.log(harga_item_real)

        // Assign value to hidden input
        $("#per_item_services").val(services);
        $("#per_item_tax").val(tax);
        $("#per_item_total").val(harga_item_real);

        $("#per_item_arr").val(Number(harga_arrangement - arrangement_service - arrangement_tax));
		$("#per_item_arr_service").val(arrangement_service);
        $("#per_item_arr_tax").val(arrangement_tax);
        // Assign value hidde
        $('#per_item').val(ribuanWithComma(harga));

		$('#total_biaya_booking_text').val(ribuanWithComma(total));
		$('#nominal_deposit_book').val(ribuanWithComma(total));
		$('#total_biaya_booking').val(total);

        // console.log(diskon)
		if(diskon !== 0 && !isNaN(diskon)){
            if (disctype == 2) {
                $("#ket_diskon").html('<strike>'+ribuanWithComma(harga_bef_disc)+'</strike> Disc Fixed '+ribuanWithComma(diskon));
            }else{
                $("#ket_diskon").html('<strike>'+ribuanWithComma(harga_bef_disc)+'</strike> Disc '+diskon+'%');
            }
		}

        // Calling Function Auto Arrangement
        autoArrangement(0);

	});

	//Transaksi Shop
	function ClickBtnDeposit(id, kamar, nama, total_tagihan, booking){
		var booking_id = id
		var no_kamar = kamar
        var name = nama
        booking = JSON.parse(booking)

        // defined variable
        let segmentations = $('.segmentation_value')

		console.log(booking);

        $.ajax({
            type: "get",
            url: "{{url('get-totaltagihan-nominal')}}",
            data: {
                booking_id  :id,
                nomor_kamar :kamar,
            },
            dataType: "json",
            success: function (response) {
                $('#nominal_tagihan').html('Total Bill : '+ribuanWithComma(response))
            }
        });

        $('#deposit_nama_kamar').val(name)
		$('#booking_id').val(booking_id)
		$('#deposit_no_kamar').text(no_kamar)
		$('#nomor_kamar_depo_modal').val(no_kamar)
		$('#jenis_deposit').val('').trigger('change')
		$('#nominal').val(null)
		// $('#transaction_date').val(null)
		$('#description_payment').val(null)
        // $('#nominal_tagihan').html('Total Bill : '+ribuanWithComma(total_tagihan)) ===> di pindah ke dalam ajax

		//Cek apakah data booking termasuk ledger atau individual ledger
		var company_ledger = booking.company_id;
        var status_company_ledger  = booking?.company?.status_ledger
		var individual_ledger = booking?.guest_profile?.individual_ledger;
        var status_individual_ledger  = booking?.guest_profile?.status_ledger;
		var option_metode_pembayaran = '<option value="">** Select Payment Method **</option>';
		// // Jika customer adalah company ledger
		// if(company_ledger){
		// 	// console.log('Company Ledger');
		// 	$.each(jenis_deposit_text, function(index, metode_pembayaran){
		// 		if(['5'].includes(index)){
		// 			option_metode_pembayaran += `<option value="${index}">${metode_pembayaran}</option>`;
		// 		} else {
		// 			option_metode_pembayaran += `<option value="${index}">${metode_pembayaran}</option>`;
		// 		}
		// 	});

		// 	$.each(segmentations, function(index_segmentation, segmentation){
		// 		if($(segmentation).val() == booking.company.main_segment){
		// 			$("#segmentation option[value='"+$(segmentation).val()+"']").prop('disabled', false)
		// 		} else {
		// 			$("#segmentation option[value='"+$(segmentation).val()+"']").prop('disabled', true)
		// 		}
		// 	});
		// }
		// //Jika customer adalah individual ledger
		// else if(individual_ledger) {
		// 	// console.log('Individual Ledger');
		// 	$.each(jenis_deposit_text, function(index, metode_pembayaran){
		// 		option_metode_pembayaran += `<option value="${index}">${metode_pembayaran}</option>`;
		// 	});
		// }
		// // jika customer bukan company ledger maupun individual ledger
		// else{
		// 	// console.log('Non Ledger');
		// 	$.each(jenis_deposit_text, function(index, metode_pembayaran){
		// 		if(!['5', '3'].includes(index)){
		// 			option_metode_pembayaran += `<option value="${index}">${metode_pembayaran}</option>`;
		// 		}
		// 	});
		// }

        $.each(jenis_deposit_text, function(index, metode_pembayaran){
            if(!['3'].includes(index)){
                option_metode_pembayaran += `<option value="${index}">${metode_pembayaran}</option>`;
            }
        });

        // if (company_ledger) {
            // console.log(booking?.company?.main_segment, 'gsahsgagus')
            $(".segmentation_value").prop('disabled', true)

            console.log(booking?.guest_profile?.individual_ledger)
            $.each(segmentations, function(index_segmentation, segmentation){
                if(($(segmentation).val() == booking?.company?.main_segment  && status_company_ledger == 1) || (individual_ledger ? $(segmentation).val() == 14 && status_individual_ledger == 1 : false)){
                    // console.log('ini di coba ', individual_ledger ? $(segmentation).val() == 14 : false && status_individual_ledger == 1, individual_ledger ? $(segmentation).val() == 14 : false, status_individual_ledger == 1)
                    $("#segmentation option[value='"+$(segmentation).val()+"']").prop('disabled', false)
                } else {
                    $("#segmentation option[value='"+$(segmentation).val()+"']").prop('disabled', true)
                }
            });
        // }

		$('#jenis_deposit').html(option_metode_pembayaran);

		$('#deposit_daftar_transfer').attr('style','display:none')
		$('#depositcash').attr('style','display:none')
		$('.wrap_segmentation_option').attr('style','display:none')
        $('#segmentation').attr('required', false)
		$('#segmentation').val('').select2().trigger('change')
		$('#depositkredit').attr('style','display:none')
	}

	// Platform Pembayaran
	let platform_pembayarans = {!! json_encode($platforms); !!};
	$('#jenis_deposit').on('change', function(){
		let jenis_deposit = $(this).val();

		//Platform Pembayaran
		let option_pembayaran = `<option value="">** Select Payment Platform **</option>"`;

		//Reset Form Platform Pembayaran
		$('#deposit_platform_pembayaran_id').select2().val('').trigger('change');

		//Show Platform pembayaran jika memilih jenis deposit
		if(['2','4'].includes(jenis_deposit)){
			$('#deposit_transfer').hide()
			$('#jenis_deposit_option').show();

			$.each(platform_pembayarans[jenis_deposit], function(key, platform){
				option_pembayaran += `<option value="${platform.id}">${platform.nama}</option>`
			});

			$('#deposit_platform_pembayaran_id').html(option_pembayaran);
			$('#deposit_platform_pembayaran_id').attr('required', 'required');
			$('#not-transfer').show();

            $('.wrap_segmentation_option').hide()
            $('#segmentation').attr('required', false)
		}
		//Jika Jenis Deposit Transfer
		else if(jenis_deposit == '3'){
			$('#jenis_deposit_option').hide();
			$('#deposit_platform_pembayaran_id').removeAttr('required');
			$('#deposit_transfer').show();
			// $('#not-transfer').hide();
            $('.wrap_segmentation_option').hide()
            $('#segmentation').attr('required', false)
		}
		else{
			$('#jenis_deposit_option').hide();
			$('#deposit_platform_pembayaran_id').removeAttr('required');
			$('#deposit_transfer').hide();
			$('#not-transfer').show();

            if (jenis_deposit == '5') {
                $('.wrap_segmentation_option').show()
                $('#segmentation').attr('required', true)
            }else{
                $('.wrap_segmentation_option').hide()
                $('#segmentation').attr('required', false)
            }
		}
	});

    // function untuk jenis deposit
    $('#jenis_deposit_book').on('change', function(){
		let jenis_deposit = $(this).val();

		//Platform Pembayaran
		let option_pembayaran = `<option value="">** Select Payment Platform **</option>"`;

		//Reset Form Platform Pembayaran
		$('#deposit_platform_pembayaran_id_book').select2().val('').trigger('change');

		//Show Platform pembayaran jika memilih jenis deposit
		if(['2','4'].includes(jenis_deposit)){
			$('#deposit_transfer_book').hide()
			$('#jenis_deposit_option_book').show();

			$.each(platform_pembayarans[jenis_deposit], function(key, platform){
				option_pembayaran += `<option value="${platform.id}">${platform.nama}</option>`
			});

			$('#deposit_platform_pembayaran_id_book').html(option_pembayaran);
			$('#deposit_platform_pembayaran_id_book').attr('required', 'required');
			$('#not-transfer-book').show();

            $('.wrap_segmentation_option_book').hide()
            $('#segmentation_book').attr('required', false)
		}
		//Jika Jenis Deposit Transfer
		else if(jenis_deposit == '3'){
			$('#jenis_deposit_option_book').hide();
			$('#deposit_platform_pembayaran_id_book').removeAttr('required');
			$('#deposit_transfer_book').show();
			// $('#not-transfer-book').hide();
            $('.wrap_segmentation_option_book').hide()
            $('#segmentation_book').attr('required', false)
		}
		else{
			$('#jenis_deposit_option_book').hide();
			$('#deposit_platform_pembayaran_id_book').removeAttr('required');
			$('#deposit_transfer_book').hide();
			$('#not-transfer-book').show();

            if (jenis_deposit == '5') {
                $('.wrap_segmentation_option_book').show()
                $('#segmentation_book').attr('required', true)
            }else{
                $('.wrap_segmentation_option_book').hide()
                $('#segmentation_book').attr('required', false)
            }
		}
	});

	// $(document).on('change','#jenis_deposit', function() {
	// 	var jenis_deposit = $('#jenis_deposit option:selected').val()
	//
	// 	if (jenis_deposit == 1) {
	// 		$('#transfer_akunting_id').val('')
	// 		$('#deposit_bank').val('')
	// 		$('#no_kartu').val('')
	//
	// 		$('#depositcash').removeAttr('style')
	// 		$('#depositkredit').attr('style','display:none')
	// 		$('#deposit_daftar_transfer').attr('style','display:none')
	// 	}
	// 	else if (jenis_deposit == 2) {
	// 		$('#nominal_cash').val('')
	// 		$('#transfer_akunting_id').val('')
	//
	// 		$('#depositkredit').removeAttr('style')
	// 		$('#depositcash').attr('style','display:none')
	// 		$('#deposit_daftar_transfer').attr('style','display:none')
	// 	}
	// 	else if (jenis_deposit == 3) {
	// 		$('#nominal_cash').val('')
	// 		$('#nominal_kredit').val('')
	// 		$('#deposit_bank').val('')
	//
	// 		$('#deposit_daftar_transfer').removeAttr('style')
	// 		$('#depositcash').attr('style','display:none')
	// 		$('#depositkredit').attr('style','display:none')
	// 	}
	// 	else {
	// 		$('#deposit_daftar_transfer').attr('style','display:none')
	// 		$('#depositcash').attr('style','display:none')
	// 		$('#depositkredit').attr('style','display:none')
	//
	// 	}
	// })

	//Transaksi Shop
	function ClickBtnTransaksi(id, no_kamar, booking_id, nama){
		var id_kamar = id
		var no_kamar = no_kamar
		var booking_id = booking_id
        var name = nama

        $('#tr_nama_kamar').val(name)
		$('#tr_no_kamar').text(no_kamar)
		$('#tr_booking_id').val(booking_id)
		$('#input_kamar').val(id_kamar)
	}

	//pembayaran
	function ClickBtnPembayaran(id){
		var booking_id = id
		// var no_kamar = kamar

		$('#pembayaran_booking_id').val(booking_id)
		$('#pembayaran_segment').val('').trigger('change')

		$('#pembayaran_company_ledger').attr('style','display:none')
	}

	$(document).on('change','#pembayaran_segment', function() {
		var segment = $('#pembayaran_segment option:selected').val()

		if (segment == 2 || segment == 3) {
			$('#pembayaran_company_ledger').removeAttr('style')
		} else {
			$('#pembayaran_company_ledger').attr('style','display:none')
		}
	})

	//refund
	function ClickBtnRefund(id){
		var booking_id = id
		// var no_kamar = kamar

		$('#refund_booking_id').val(booking_id)
		$('#refund_segment').val('').trigger('change')

		$('#refund_company_ledger').attr('style','display:none')
	}

	$(document).on('change','#refund_segment', function() {
		var segment = $('#refund_segment option:selected').val()

		if (segment == 2 || segment == 3) {
			$('#refund_company_ledger').removeAttr('style')
		} else {
			$('#refund_company_ledger').attr('style','display:none')
		}
	})

	function getCorporateBySegment(id_segment){
		console.log(id_segment);
		$.ajax({
			type: 'GET',
			url: "{{ url('/get-corporate')}}/1/"+id_segment,
			success: function (data) {
				$('#company_ledger_pembayaran_checkout').html(data);
			}
		});
	}

	//checkout + pembayaran
	function ClickBtnPembayaranCheckout(id, nominal, nama, booking_id, room_index, coawal=false){
        // Reset Modal
        $("#checkout_jenis_pembayaran").val('').trigger("change");
        $("#voucher").val('');
        // defined variable
        let segmentations = $('.segmentation_value')

		//Data Bookingan
		var id = id
		var nominal = nominal
		var nama = nama

        let segment =  {!! json_encode(config('custom.segment_ratecodes')) !!};

		//Cek apakah data booking termasuk ledger atau individual ledger
		// var company_ledger = booking.company_id;
        // var status_company_ledger  = booking?.company?.status_ledger
        // var status_limittime  = booking?.company?.statuslimittime
        // var limittime         = booking?.company?.limittime
		// var individual_ledger = booking?.guest?.individual_ledger ?? booking?.guest_profile?.individual_ledger;
        // var status_individual_ledger  = booking?.guest?.status_ledger ?? booking?.guest_profile?.status_ledger;
		// var option_metode_pembayaran = '<option value="">** Select Payment Method **</option>';
        var option_metode_pembayaran= '<option value="">** Select Payment Method **</option>';

        $.ajax({
            type: "get",
            url: "{{url('get-data-booking')}}",
            data: {id:booking_id},
            dataType: "json",
            async:false,
            success: function (booking) {
                var company_ledger          = booking.company_id;
                var status_company_ledger   = booking?.company?.status_ledger
                var status_limittime        = booking?.company?.statuslimittime
                var limittime               = booking?.company?.limittime
                var individual_ledger       = booking?.guest?.individual_ledger ?? booking?.guest_profile?.individual_ledger;
                var status_individual_ledger= booking?.guest?.status_ledger ?? booking?.guest_profile?.status_ledger;

                // Jika customer adalah company ledger
                    // if(company_ledger){
                    // 	// console.log('Company Ledger');
                    // 	$.each(jenis_pembayaran, function(index, metode_pembayaran){
                    // 		// console.log(index);
                    // 		if(!['3','6','7','8'].includes(index)){
                    // 			if (['5'].includes(index)) {
                    // 				option_metode_pembayaran += `<option value="${index}">${metode_pembayaran} - ${booking.company.name}</option>`;
                    // 			} else {
                    // 				option_metode_pembayaran += `<option value="${index}">${metode_pembayaran}</option>`;
                    // 			}
                    // 		}
                    // 	});
                    // }
                    // //Jika customer adalah individual ledger
                    // else if(individual_ledger) {
                    // 	// console.log('Individual Ledger');
                    // 	$.each(jenis_pembayaran, function(index, metode_pembayaran){
                    // 		if(!['3','6','7','8'].includes(index)){
                    // 			option_metode_pembayaran += `<option value="${index}">${metode_pembayaran}</option>`;
                    // 		}
                    // 	});
                    // }
                    // // jika customer bukan company ledger maupun individual ledger
                    // else{
                    // 	// console.log('Non Ledger');
                    // 	$.each(jenis_pembayaran, function(index, metode_pembayaran){
                    // 		if(!['5','3','6','7','8'].includes(index)){
                    // 			option_metode_pembayaran += `<option value="${index}">${metode_pembayaran}</option>`;
                    // 		}
                    // 	});
		        // }

                $.each(jenis_deposit_text, function(index, metode_pembayaran){
                    if(!['3'].includes(index)){
                        option_metode_pembayaran += `<option value="${index}">${metode_pembayaran}</option>`;
                    }
                });

                $(".segmentation_value").prop('disabled', true)

                $.each(segmentations, function(index_segmentation, segmentation){
                    if(($(segmentation).val() == booking?.company?.main_segment  && status_company_ledger == 1) || (individual_ledger ? $(segmentation).val() == 14 && status_individual_ledger == 1 : false)){
                        $("#checkout_pembayaran_segment option[value='"+$(segmentation).val()+"']").prop('disabled', false)
                    } else {
                        $("#checkout_pembayaran_segment option[value='"+$(segmentation).val()+"']").prop('disabled', true)
                    }
                });

                let dateSystem = {!! json_encode(getSystemDate()) !!}
                console.log(status_limittime, limittime,dateSystem >  limittime)
                if (status_limittime == 1 && dateSystem > limittime) {
                    $('#alert-limit-ledger').html('This ledger has been disabled, pass the time limit '+  moment(limittime).format('YYYY-MM-DD')  );
                    $('#checkout_pembayaran_segment').prop('disabled', true)
                    $('#submit_pembayaran_checkout').prop('disabled', true)
                }else{
                    $('#alert-limit-ledger').html(null);
                    $('#checkout_pembayaran_segment').prop('disabled', false)
                    $('#submit_pembayaran_checkout').prop('disabled', false)
                }

                $('#checkout_jenis_pembayaran').html(option_metode_pembayaran);
                $('.wrap_segmentation_option').attr('style','display:none')
                $('#checkout_pembayaran_segment').attr('required', false)
                $('#checkout_pembayaran_segment').val('').select2().trigger('change')

                // if(['10','11'].includes(booking.segmentasi_rate_code))
                // {
                // 	// $('#nominalbayar').text('Nominal yang belum lunas : Rp ' + Number(0).toLocaleString("id-ID"))
                // 	$('#nominalbayar').text("bills that haven't paid off : Rp " + Number(0).toLocaleString())
                // }
                // else{
                // 	// $('#nominalbayar').text('Nominal yang belum lunas : Rp ' + Number(nominal).toLocaleString("id-ID"))
                // 	let dnum = String(nominal).replace(/(?<!\..*)(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')
                // 	$('#nominalbayar').text("bills that haven't paid off : Rp " + dnum)
                // }
                let dnum = String(nominal).replace(/(?<!\..*)(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')
                $('#nominalbayar').text("bills that haven't paid off : Rp " + dnum)

                $('#checkout_pembayaran_nama').val(nama)
                $('#checkout_pembayaran_booking_id').val(id)
                $('#checkout_pembayaran_room_index').val(room_index)

                // if(['10','11'].includes(booking.segmentasi_rate_code))
                // {
                // 	$('#checkout_pembayaran_nominal').val(0)
                // 	$('#checkout_jenis_pembayaran').removeAttr('required');
                // 	$('#checkout_jenis_pembayaran').attr('disabled', 'disabled');
                // }
                // else{
                // 	// $('#checkout_pembayaran_nominal').val(nominal.toLocaleString('ID'))
                // 	let dnum = String(nominal).replace(/(?<!\..*)(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')
                // 	$('#checkout_pembayaran_nominal').val(dnum)
                // 	$('#checkout_jenis_pembayaran').attr('required', 'required');
                // 	$('#checkout_jenis_pembayaran').removeAttr('disabled');
                // }
                // let dnum = String(nominal).replace(/(?<!\..*)(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')
                $('#checkout_pembayaran_nominal').val(dnum)
                $('#checkout_jenis_pembayaran').attr('required', 'required');
                $('#checkout_jenis_pembayaran').removeAttr('disabled');

                // // jika segmen bukan individual ledger, jangan tampilkan jenis pembayaran ledger
                // // console.log(booking.segmentasi_rate_code)
                // if (!['14'].includes(booking.segmentasi_rate_code)) {
                // 	$('#checkout_jenis_pembayaran option[value=5]').remove();
                // } else {
                // // jika segmen individual ledger, tampilkan jenis pembayran ledger
                // 	$('#checkout_jenis_pembayaran').append($('<option>', {value:5, text:'Ledger'}));
                // }

                // $('#checkout_pembayaran_segment').val(booking.segmentasi_rate_code).trigger('change')
                // $('#checkout_pembayaran_segment').val('').trigger('change')

                if (['2','3','4','5','6','8','9'].includes(booking.segmentasi_rate_code)) {
                    $('#checkout_pembayaran_company_ledger').removeAttr('style')

                    //Ambil Corporate Dengan Segment
                    // getCorporateBySegment(booking.segmentasi_rate_code);

                    setTimeout(function(){
                        $('#company_ledger_pembayaran_checkout').val(booking.company_id);
                    }, 1000);

                }else{
                    $('#checkout_pembayaran_company_ledger').attr('style','display:none')
                }

                    $.ajax({
                        type: 'POST',
                        url: "{{route('roomview.detailratebook')}}",
                        data: {
                            _token:'{{csrf_token()}}',
                            id: id,
                            room_index:room_index
                        },
                        success: function (response) {
                            let html = "";

                            console.log('Rincian Room Rate:');
                            console.log(response);

                            if(response.length > 0){
                                $.each(response, function(i, v){

                                    let dtotal = ''
                                    if (v) {
                                        dtotal = String(v.total).replace(/(?<!\..*)(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')
                                    }

                                    // backup table dalam response
                                    // <td align="right">${v?.total.toLocaleString('ID')}</td>
                                    // <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : (v?.total).toLocaleString('ID')}</td>

                                    if(response.length > 0){
                                    html += `
                                        <tr>
                                            <td><b>Rate Code ${moment(v.booking_detail?.date_now).format('DD-MM-YYYY')} : </b>${(v?.booking_detail?.rate_codes) ?? (v.description)}</td>
                                            <td>-</td>
                                            <td align="right">${dtotal}</td>
                                            <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : dtotal}</td>
                                        </tr>`
                                    }
                                    else{
                                    html += `
                                        <tr>
                                            <td>Rate Code -</td>
                                            <td>-</td>
                                            <td align="right">-</td>
                                            <td align="right">-</td>
                                        </tr>`
                                    }

                                    $('#tabelb_rincian_booking').html(html);

                                })

                            }else{
                                console.log('disabled');
                                $('#tabelb_rincian_booking').html(null);
                            }
                        }
                    });

                    $.ajax({
                        type: 'POST',
                        url: "{{route('roomview.detailshopbook')}}",
                        data: {
                            _token:'{{csrf_token()}}',
                            id: id,
                            room_index:room_index
                        },
                        success: function (response) {
                                let html = "";

                                // backup tabel dalam response
                                // <td align="right">${(v.nominal).toLocaleString('ID')}</td>
                                // <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : (v.nominal).toLocaleString('ID')}</td>

                                // Ambil Data pembayaran pos yang transfer kamar
                                if(response.pembayaran_pos.length > 0){
                                    $.each(response.pembayaran_pos, function(i, v){
                                        let dnom = ''
                                        if (v) {
                                            dnom = String(v.nominal).replace(/(?<!\..*)(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')
                                        }

                                        html += `
                                            <tr>
                                                <td><b>Outlet ${moment(v?.cart?.transaction_date).format('DD-MM-YYYY')}: </b>${v?.cart?.order_flag}</td>
                                                <td></td>
                                                <td align="right">${dnom}</td>
                                                <td align="right">${dnom}</td>
                                            </tr>`
                                    })

                                }

                                // backup tabel dalam response
                                // <td align="right">${(v.menu?.harga).toLocaleString('ID')}</td>
                                // <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : (v.grand_total).toLocaleString('ID')}</td>

                                // Ambil Data Item Transaksi Shop
                                if(response.shop_transactions.length > 0){
                                    $.each(response.shop_transactions, function(i, v){
                                        let dmharga = ''
                                        let dgtotal = ''
                                        if (v.menu) {
                                            dmharga = String((v?.grand_total/v?.jumlah)).replace(/(?<!\..*)(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')
                                        }
                                        dgtotal = String(v.grand_total).replace(/(?<!\..*)(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')

                                        html += `
                                            <tr>
                                                <td><b>Order  ${moment(v?.transaction_date).format('DD-MM-YYYY')}: </b>${v?.menu?.nama ?? v.keterangan_custom} ${v.description ? '- '+v.description:''} </td>
                                                <td>${v.jumlah}</td>
                                                <td align="right">${dmharga}</td>
                                                <td align="right">${dgtotal}</td>
                                            </tr>`
                                    })
                                }

                                $('#tabelb_rincian_shop_booking').html(html);//tambahkan rincian ke modal
                        }
                    });

                    $.ajax({
                        type: 'POST',
                        url: "{{route('roomview.detaildepobook')}}",
                        data: {
                            _token:'{{csrf_token()}}',
                            id: id,
                            room_index:room_index
                        },
                        success: function (response) {
                            let html = "";

                            console.log(response);

                            $.each(response, function(i, v){

                                // backup response dalam table
                                // <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : (v.nominal).toLocaleString('ID')}</td>
                                let dnom = ''
                                dnom = String(v.nominal).replace(/(?<!\..*)(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')

                                if(response.length > 0){
                                html += `
                                    <tr>
                                        <td><b>${v.deposit_reservasi == 1 ? 'Deposit' : 'Pembayaran' }  ${moment(v?.transaction_date).format('DD-MM-YYYY')} : </b> ${v.no_kwitansi == null ? ' - ' : v.no_kwitansi }: ${v.nama} ${jenis_deposit_text[v.jenis_deposit]} ${[2,4].includes(v.jenis_deposit) ? v.platform.nama : ([5].includes(v.jenis_deposit) ? (v.segmentation ? '-'+segment[v.segmentation] : '') : '')} ${v.voucher ? '/'+v.voucher : '' } ${v.description ? '-'+v.description : ''}</td>
                                        <td>-</td>
                                        <td align="right">-</td>
                                        <td align="right">${dnom}</td>
                                    </tr>`
                                }
                                else{
                                html += `
                                    <tr>
                                        <td><b>Pembayaran :</b> - </td>
                                        <td>-</td>
                                        <td align="right">-</td>
                                        <td align="right">-</td>
                                    </tr>`
                                }

                                $('#tabelb_rincian_depo_booking').html(html);

                            })
                        }
                    });

                    $.ajax({
                        type: 'POST',
                        url: "{{route('roomview.detailpembayaransebagianbook')}}",
                        data: {
                            _token:'{{csrf_token()}}',
                            id: id,
                            room_index:room_index
                        },
                        success: function (response) {
                            let html = "";

                            $.each(response, function(i, v){

                                // backup response dalam table
                                // <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : (v.nominal).toLocaleString('ID')}</td>

                                let dnom = ''
                                dnom = String(v.nominal).replace(/(?<!\..*)(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')

                                if(response.length > 0){
                                html += `
                                    <tr>
                                        <td><b>Pembayaran ${moment(v?.transaction_date).format('DD-MM-YYYY')} : </b> ${v.no_kwitansi == null ? ' - ' : v.no_kwitansi } : ${v?.booking?.nama} ${jenis_pembayaran[v.jenis_pembayaran_id]} ${[2,4].includes(v.jenis_pembayaran_id) ? v?.platform_pembayaran?.nama : ([5].includes(v.jenis_pembayaran_id) ? (v.segment ? '-'+segment[v.segment] : '') : '')} ${v?.voucher ? '/'+v?.voucher : ''}</td>
                                        <td>-</td>
                                        <td align="right">-</td>
                                        <td align="right">${dnom}</td>
                                    </tr>`
                                }
                                else{
                                html += `
                                    <tr>
                                        <td><b>Pembayaran :</b> - </td>
                                        <td>-</td>
                                        <td align="right">-</td>
                                        <td align="right">-</td>
                                    </tr>`
                                }

                                $('.tabelb_rincian_pembayaran_sebagian_booking').html(html);

                            })
                        }
                    });

                    $.ajax({
                        type: 'POST',
                        url: "{{route('roomview.detailpembayaranpos')}}",
                        data: {
                            _token:'{{csrf_token()}}',
                            id: id,
                            room_index:room_index
                        },
                        success: function (response) {
                            let html = "";

                            $.each(response, function(i, v){


                                if(response.length > 0){
                                html += `
                                    <tr>
                                        Transfer from Resto Mbah'e 2000006
                                        <td>Transfer from ${v?.cart?.shop?.nama} ${v?.cart?.order_flag}</td>
                                        <td>-</td>
                                        <td align="right">-</td>
                                        <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : ribuanWithComma(v.nominal)}</td>
                                    </tr>`
                                }

                                $('.tabelb_rincian_pembayaranpos').html(html);
                                console.log('rincian transfer to room pos')
                            })
                        }
                    });

                    if (coawal) {
                        $('#checkout_co_awal_status').val(1)
                        $('#checkout_pembayaran_nominal').val(null).hide().attr('disabled', true)
                        $('.label_nominal_modal_co').hide()
                        $('.element_co_awal').hide()
                        $('.element_co_awal select').prop('required', false);
                        $('.element_co_awal input').prop('required', false);
                        $('#modal_co_title').html('Checkout & Preview');
                    }else{
                        $('#checkout_co_awal_status').val(0)
                        $('#checkout_pembayaran_nominal').val(dnum).show().attr('disabled', false)
                        $('.label_nominal_modal_co').show()
                        $('.element_co_awal').show()
                        $('.element_co_awal select').prop('required', true);
                        $('#modal_co_title').html('Payment & Checkout');
                    }
            },
            error: function(xhr, status, error) {
                callModalAlert("Oops, something wrong can't get data booking!")
            }
        });
    }

	// $(document).on('change','#checkout_pembayaran_segment', function() {
	// 	var segment = $('#checkout_pembayaran_segment option:selected').val()

	// 	if (segment == 2 || segment == 3) {
	// 		$('#checkout_pembayaran_company_ledger').removeAttr('style')
	// 	} else {
	// 		$('#checkout_pembayaran_company_ledger').attr('style','display:none')
	// 	}
	// })

    // $(document).on('change','#checkout_jenis_pembayaran', function() {
	// 	var val = $('#checkout_jenis_pembayaran option:selected').val()
	//
	// 	if (val != 1) {
	// 		$('#checkout_jenis_pembayaran_option').removeAttr('style')
	// 	} else {
	// 		$('#checkout_jenis_pembayaran_option').attr('style','display:none')
	// 	}
	// })

	//checkout + refund
	function ClickBtnRefundCheckout(id, nominal, nama, booking_id, room_index){
        // Reset Modal
        $("#refund_jenis_pembayaran").val('').trigger("change");
        $("#voucher_refund").val('');

		console.log('masuk')
		var id = id
		var nominal = nominal
		var nama = nama

        let segment =  {!! json_encode(config('custom.segment_ratecodes')) !!};

        $.ajax({
            type: "get",
            url: "{{url('get-data-booking')}}",
            data: {id:booking_id},
            dataType: "json",
            async:false,
            success: function (booking){
                //Cek apakah data booking termasuk ledger atau individual ledger
                var company_ledger = booking.company_id;
                var individual_ledger = booking?.guest_profile?.individual_ledger;
                // var option_metode_pembayaran =  '<option value="">** Select Payment Method **</option>';
                var option_metode_pembayaran =  '<option value="">** Select Payment Method **</option>';

                // Jika customer adalah company ledger
                if(company_ledger){
                    // console.log('Company Ledger');
                    $.each(jenis_refund, function(index, metode_pembayaran){
                        // console.log(index);
                        if(!['6','7'].includes(index)){
                            if (['5'].includes(index)) {
                                option_metode_pembayaran += `<option value="${index}">${metode_pembayaran} - ${booking.company.name}</option>`;
                            } else {
                                option_metode_pembayaran += `<option value="${index}">${metode_pembayaran}</option>`;
                            }
                        }
                    });
                }
                //Jika customer adalah individual ledger
                else if(individual_ledger) {
                    // console.log('Individual Ledger');
                    $.each(jenis_refund, function(index, metode_pembayaran){
                        // console.log(index);

                        if(!['6','7'].includes(index)){
                            option_metode_pembayaran += `<option value="${index}">${metode_pembayaran}</option>`;
                        }
                    });
                }
                // jika customer bukan company ledger maupun individual ledger
                else{
                    // console.log('Non Ledger');
                    $.each(jenis_refund, function(index, metode_pembayaran){
                        // console.log(index);

                        if(!['5','6','7'].includes(index)){
                            option_metode_pembayaran += `<option value="${index}">${metode_pembayaran}</option>`;
                        }
                    });
                }
                $('#refund_jenis_pembayaran').html(option_metode_pembayaran);

                $('#refund_nominalbayar').text('Nominal Refund : Rp ' + ribuanWithComma(Number(Math.abs(nominal))))

                $('#checkout_refund_nama').val(nama)
                $('#checkout_refund_booking_id').val(id)
                $('#checkout_refund_room_index').val(room_index)
                $('#checkout_nominal_refund').val(ribuanWithComma(nominal * -1))
                $('#checkout_refund_segment').val(booking.segmentasi_rate_code).trigger('change')

                if (booking.segmentasi_rate_code == 2 || booking.segmentasi_rate_code == 3 ) {
                    $('#checkout_refund_company_ledgers').removeAttr('style')
                    $('#checkout_refund_company_ledgers').val(booking.company_id);

                    // setTimeout(function(){
                    // }, 3000);

                }else{
                    $('#checkout_refund_company_ledger').attr('style','display:none')
                }


                    $.ajax({
                        type: 'POST',
                        url: "{{route('roomview.detailratebook')}}",
                        data: {
                            _token:'{{csrf_token()}}',
                            id: id,
                            room_index:room_index
                        },
                        success: function (response) {
                            let html = "";

                            // console.log(response);

                            if(response.length > 0){
                            $.each(response, function(i, v){


                                if(response.length > 0){
                                html += `
                                    <tr>
                                        <td><b>Rate Code ${moment(v.booking_detail?.date_now).format('DD-MM-YYYY')} : </b>${(v?.booking_detail?.rate_codes) ?? (v.description)}</td>
                                        <td>-</td>
                                        <td align="right">${ribuanWithComma(v?.total)}</td>
                                        <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : ribuanWithComma(v?.total)}</td>
                                    </tr>`
                                }
                                else{
                                html += `
                                    <tr>
                                        <td>Rate Code -</td>
                                        <td>-</td>
                                        <td align="right">-</td>
                                        <td align="right">-</td>
                                    </tr>`
                                }

                                $('#tabelb_rincian_booking_refund').html(html);

                            })
                            }else{
                                $('#tabelb_rincian_booking_refund').html(null);
                            }
                        }
                    });

                    $.ajax({
                        type: 'POST',
                        url: "{{route('roomview.detailshopbook')}}",
                        data: {
                            _token:'{{csrf_token()}}',
                            id: id,
                            room_index: room_index
                        },
                        success: function (response) {

                                let html = "";

                                // Ambil Data pembayaran pos yang transfer kamar
                                if(response.pembayaran_pos.length > 0){
                                    $.each(response.pembayaran_pos, function(i, v){
                                        html += `
                                            <tr>
                                                <td><b>Outlet : </b>${v?.cart?.order_flag}</td>
                                                <td></td>
                                                <td align="right">${ribuanWithComma(v.nominal)}</td>
                                                <td align="right">${ribuanWithComma(v.nominal)}</td>
                                            </tr>`
                                    })

                                }

                                // Ambil Data Item Transaksi Shop
                                if(response.shop_transactions.length > 0){
                                    $.each(response.shop_transactions, function(i, v){
                                        html += `
                                            <tr>
                                                <td><b>Order ${moment(v?.transaction_date).format('DD-MM-YYYY')}: </b>${v?.menu?.nama ?? v.keterangan_custom} ${v.description ? '- '+v.description:''}</td>
                                                <td>${v.jumlah}</td>
                                                <td align="right">${ribuanWithComma((v?.grand_total/v?.jumlah))}</td>
                                                <td align="right">${ribuanWithComma(v.grand_total)}</td>
                                            </tr>`
                                    })
                                }


                                $('#tabelb_rincian_shop_booking_refund').html(html);

                        }
                    });

                    $.ajax({
                        type: 'POST',
                        url: "{{route('roomview.detaildepobook')}}",
                        data: {
                            _token:'{{csrf_token()}}',
                            id: id,
                            room_index: room_index
                        },
                        success: function (response) {
                            let html = "";

                            // console.log(response);

                            $.each(response, function(i, v){


                                if(response.length > 0){
                                html += `
                                    <tr>
                                        <td><b>${v.deposit_reservasi == 1 ? 'Deposit' : 'Pembayaran' } : </b>${v.no_kwitansi == null ? '-' : v.no_kwitansi }: ${v.nama} ${jenis_deposit_text[v.jenis_deposit]} ${[2,4].includes(v.jenis_deposit) ? v.platform.nama : ([5].includes(v.jenis_deposit) ? (v.segmentation ? '-'+segment[v.segmentation] : '') : '')} ${v.voucher ? '/'+v.voucher : '' } ${v.description ? '-'+v.description : ''}</td>
                                        <td>-</td>
                                        <td align="right">-</td>
                                        <td align="right">${ribuanWithComma(v.nominal)}</td>
                                    </tr>`
                                }
                                else{
                                html += `
                                    <tr>
                                        <td>Pembayaran:-</td>
                                        <td>-</td>
                                        <td align="right">-</td>
                                        <td align="right">-</td>
                                    </tr>`
                                }

                                $('#tabelb_rincian_depo_booking_refund').html(html);

                            })
                        }
                    });

                    $.ajax({
                        type: 'POST',
                        url: "{{route('roomview.detailpembayaransebagianbook')}}",
                        data: {
                            _token:'{{csrf_token()}}',
                            id: id,
                            room_index: room_index
                        },
                        success: function (response) {
                            let html = "";

                            $.each(response, function(i, v){


                                if(response.length > 0){
                                html += `
                                    <tr>
                                        <td><b>Pembayaran ${moment(v?.transaction_date).format('DD-MM-YYYY')}: </b> ${v.no_kwitansi == null ? ' - ' : v.no_kwitansi }: ${v?.booking?.nama} ${jenis_pembayaran[v.jenis_pembayaran_id]} ${[2,4].includes(v.jenis_pembayaran_id) ? v?.platformPembayaran?.nama : ([5].includes(v.jenis_pembayaran_id) ? (v.segment ? '-'+segment[v.segment] : '') : '')}</td>
                                        <td>-</td>
                                        <td align="right">-</td>
                                        <td align="right">${ribuanWithComma(v.nominal)}</td>
                                    </tr>`
                                }
                                else{
                                html += `
                                    <tr>
                                        <td><b>Pembayaran :</b> - </td>
                                        <td>-</td>
                                        <td align="right">-</td>
                                        <td align="right">-</td>
                                    </tr>`
                                }

                                $('.tabelb_rincian_pembayaran_sebagian_booking').html(html);

                            })
                        }
                    });

                    $.ajax({
                        type: 'POST',
                        url: "{{route('roomview.detailpembayaranpos')}}",
                        data: {
                            _token:'{{csrf_token()}}',
                            id: id,
                            room_index:room_index
                        },
                        success: function (response) {
                            let html = "";

                            $.each(response, function(i, v){


                                if(response.length > 0){
                                html += `
                                    <tr>
                                        Transfer from Resto Mbah'e 2000006
                                        <td>Transfer from ${v?.cart?.shop?.nama} ${v?.cart?.order_flag}</td>
                                        <td>-</td>
                                        <td align="right">-</td>
                                        <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : ribuanWithComma(v.nominal)}</td>
                                    </tr>`
                                }

                                $('.tabelb_rincian_pembayaranpos').html(html);
                                console.log('rincian transfer to room pos')
                            })
                        }
                    });
            },
            error: function(xhr, status, error) {
                callModalAlert("Oops, something wrong can't get data booking!")
            }
        });

	}

	function checkBeforeCheckoutRefund() {
            event.preventDefault();

            let booking_id = $('#checkout_refund_booking_id').val();
            let room_index = $('#checkout_refund_room_index').val();

            $.ajax({
                type: "get",
                url: "{{route('check-before-checkout')}}",
                data: {
                    booking_id:booking_id,
                    room_index:room_index
                },
                dataType: "json",
                success: function (response) {
                    if (response < 1) {
                        callModalAlert("Can't checkout, because the roomcharge haven't yet generate")
                    }else{
                        $('#form_checkout_refund').submit()
                    }
                }
            });
        }

	$(document).on('change','#checkout_refund_segment', function() {
		var segment = $('#checkout_refund_segment option:selected').val()

		if (segment == 2 || segment == 3) {
			$('#checkout_refund_company_ledger').removeAttr('style')
		} else {
			$('#checkout_refund_company_ledger').attr('style','display:none')
		}
	})

    //Change Room
	function changeRoom(id, no_kamar, booking_id, jeniskamar, tipe_change=null){
        // alert(no_kamar)
        $('#reguler-move-room-div').html(null)
        $('.change-room-remaining-days-more-than-0').removeClass('d-none').addClass('d-none')
        $('.change-room-remaining-days-is-0').removeClass('d-none').addClass('d-none')

            $('#changeRoomModal').find('form').trigger('reset');

            // reset rate code
            $('#rate_code_change_room').val('').trigger('change')

            // reset total biata booking text
            $('#total_biaya_booking_text_change_room').val('');

            // reset jumlah malam
            $('#jumlah_malam_change_room').val('');

            if (tipe_change == null) {
                console.log('masuk radio')
                $('#radio-moving-room').html(`
                    <div class="form-check form-check-inline">
                        <label class="form-check-label">
                            <input type="radio"
                                    class="form-check-input-styled moveroomtyperadio"
                                    name="moving_room_type"
                                    value="1"
                                    style="border-color: red"
                                    id="reguler_moving_room"
                                    onchange="changeRoom(${id}, '${no_kamar}', ${booking_id}, [], 1)"
                            >
                            Moving Room (Adjust <span class="text-danger">&nbsp; room rate</span>)
                        </label>
                    </div>

                    <div class="form-check form-check-inline">
                        <label class="form-check-label">
                            <input type="radio"
                                    class="form-check-input-styled moveroomtyperadio"
                                    name="moving_room_type"
                                    value="2"
                                    style="border-color: red"
                                    id="force_moving_room"
                                    onchange="changeRoom(${id}, '${no_kamar}', ${booking_id}, [], 2)"
                            >
                            Force Move Room (without adjust <span class="text-danger">&nbsp; room rate</span>)
                        </label>
                    </div>
                `);
                $('.moveroomtyperadio').uniform()
            }
        // Closing reset modal


        $('#arrangement_code_change_room').val('').trigger('change')

		var id_kamar = id
		var no_kamar = no_kamar
		var booking_id = booking_id
        let jenis_kamar_id = "";

        let dateSystem = {!! json_encode(getSystemDate()) !!}

        // ajax get data booking
        if (tipe_change) {

            $('#jns_kamar_change_room').prop('disabled', true);

            // checkedmark
            if([1].includes(tipe_change)){
                console.log('tipe change = ' + tipe_change)
                $('#force_moving_room').prop('checked', false).uniform();
                $('#reguler_moving_room').prop('checked', true).uniform();
                            }else if([2].includes(tipe_change)){
                console.log('tipe change = ' + tipe_change)
                $('#reguler_moving_room').prop('checked', false).uniform();
                $('#force_moving_room').prop('checked', true).uniform();
                            }

            let jenis_kamar_saat_ini = jeniskamar.map(function(jenis_kamar_value) {
                                                    return jenis_kamar_value.nama;
                                                }).join(', ');

            if (tipe_change == 1) {
                var html_reg_move_room = `
                    <div class="form-group row">
                        <label class="col-form-label col-sm-4">Rate Code<span class="text-danger">*</span></label>
                        <div class="col-lg-8">
                            <select name="rate_codes"
                                    id="rate_code_change_room"
                                    data-idx="0"
                                    class="form-control form-control-select2"
                                    onchange="calculatePrice(1, '_change_room')"
                                    required
                            >
                                <option value="" data-id="0" data-harga="0" data-include_breakfast="0">-- Select Rate Code --</option>
                            </select>

                            <input type="hidden" id="rate_code_id_hidden" name="ratecode_id">
                            <input type="hidden" name="per_item_total" id="per_item_total_change_room">
                            <input type="hidden" name="per_item_services" id="per_item_services_change_room">
                            <input type="hidden" name="per_item_tax" id="per_item_tax_change_room">
                            <input type="hidden" name="per_item_arr" id="per_item_arr_change_room">
                            <input type="hidden" name="per_item_arr_services" id="per_item_arr_service_change_room">
                            <input type="hidden" name="per_item_arr_tax" id="per_item_arr_tax_change_room">
                        </div>
                    </div>

                    <div class="form-group row">
                        <label class="col-form-label col-sm-4">Room Rate/Night</label>
                        <div class="col-lg-8">
                            <input type="text" name="per_item" id="per_item_change_room" class="form-control" onchange="recountWalkinRate('_change_room')">
                        </div>
                    </div>

                    <div class="form-group row">
                        <label class="col-form-label col-sm-4">Arrangement<span class="text-danger">*</span></label>
                        <div class="col-lg-8">
                            <select name="arrangement_codes"
                                    id="arrangement_code_change_room"
                                    data-idx="0"
                                    class="form-control form-control-select2"
                                    onchange="calculatePrice(0, '_change_room')"
                                    required
                            >
                                <option value="" data-harga="0">-- Select Arrangement --</option>
                                @foreach($arrangements as $arrangement)
                                    @php
                                        $harga_arrangement = 0;
                                        $service_arrangement = 0;
                                        $tax_arrangement = 0;
                                    @endphp

                                    @if($arrangement->arrangementCodeDetail)
                                        @foreach($arrangement->arrangementCodeDetail as $arrangement_detail)
                                            @php
                                            // $service_arrangement_temp = $arrangement_detail->harga * ($arrangement_detail->shop ? ($arrangement_detail->shop->services/100) : 0);
                                            // $service_arrangement += $service_arrangement_temp;
                                            // $tax_arrangement_temp = ($service_arrangement_temp * ($arrangement_detail->shop ? ($arrangement_detail->shop->ppn/100) : 0)) + $service_arrangement_temp;
                                            // $tax_arrangement += $tax_arrangement_temp;
                                            // $harga_arrangement += $arrangement_detail->harga;
                                            $tax_shop = $arrangement_detail->shop ? $arrangement_detail->shop->ppn : 0;
                                            $service_shop = $arrangement_detail->shop ? $arrangement_detail->shop->services : 0;

                                            $tax_arrangement_temp = ($arrangement_detail->harga * $tax_shop)/(100+$tax_shop);
                                            $tax_arrangement += $tax_arrangement_temp;

                                            $harga_exclude_tax = $arrangement_detail->harga - $tax_arrangement_temp;
                                            $service_arrangement_temp = ($harga_exclude_tax * $service_shop)/(100+$service_shop);
                                            $service_arrangement += $service_arrangement_temp;

                                            $harga_arrangement += $arrangement_detail->harga;
                                            @endphp
                                        @endforeach
                                    @endif

                                    <option value="{{$arrangement->arrangement_code}}"
                                            data-id="{{$arrangement->id}}"
                                            data-harga="{{$harga_arrangement}}"
                                            data-service="{{$service_arrangement}}"
                                            data-tax="{{$tax_arrangement}}"
                                    >{{$arrangement->arrangement_code}}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>

                    <!-- For Container Hidden Arrangement -->
                    <div id="hidden_arrangement_code_container_change_room">
                    </div>

                    <div class="form-group row">
                        <label class="col-form-label col-sm-4">Total Room Rate</label>
                        <div class="col-lg-8">
                            <input type="text" id="total_biaya_booking_text_change_room" class="form-control" readonly>
                            <input type="hidden" name="total_biaya" id="total_biaya_booking_change_room" class="form-control" value="0">
                            <span class="text-danger" id="ket_diskon_change_room"></span>
                        </div>
                    </div>
                `;
                $('#reguler-move-room-div').html(html_reg_move_room)
            }

            $.ajax({
                type: "GET",
                data:{
                    type:tipe_change,
                    nomor:no_kamar
                },
                url: "{{url('data-booking-room')}}/"+booking_id,
                success: function (response) {
                    let booking = response.booking
                    let bmark   = response.booking_detail_mark

                    let current_roomrate = '';

                    console.log(booking.booking_details.length);
                    if (booking.booking_details.length > 0) {
                    $.each(booking.booking_details, function(index_detail, value_detail){
                        console.log('masuk change room'+value_detail.nomor_kamar +'=='+no_kamar)
                        if(value_detail.nomor_kamar == no_kamar){
                            current_roomrate = value_detail.per_item

                            let remaining_days = moment(value_detail.end_date).diff(moment(dateSystem), 'days');

                            $('#start_date_change_room').val(dateSystem);
                            $('#pax_change_room').val(value_detail.pax);
                            $('#end_date_change_room').val(value_detail.end_date);
                            $('#segmentasi_change_room').val(booking.segmentasi_rate_code);
                            $('#jumlah_malam_change_room').val(parseInt(remaining_days));
                            $('#company_id_change_room').val(booking.company_id);

                            let html_label_current_room = ''

                            // room saat ini
                            html_label_current_room += `<tr>
                                                            <td style="width:110px; height:25px">Current Room<td>
                                                            <td>: `+no_kamar+` (`+value_detail.jns_kamar+`)<td>
                                                        </tr>`

                            html_label_current_room += `<tr>
                                                            <td style="width:110px; height:25px">Current Rate<td>
                                                            <td>: ${ribuanWithComma(current_roomrate)}<td>
                                                        </tr>`

                            // start date & end date
                            html_label_current_room += `<tr>
                                                            <td style="width:110px; height:25px">Reservation Date<td>
                                                            <td>: ${ moment(value_detail.start_date).format('DD-MM-YYYY')} - ${ moment(value_detail.end_date).format('DD-MM-YYYY')}<td>
                                                        </tr>`

                            // start date & end date
                            html_label_current_room += `<tr>
                                                            <td style="width:110px; height:25px">Remaining Days<td>
                                                            <td>: ${remaining_days} Days<td>
                                                        </tr>`

                            $('#label_current_room').html(html_label_current_room);

                            // // condition where remaining days is 0
                            // if (remaining_days == 0) {
                            //     // add class d-none
                            //     $('.change-room-remaining-days-more-than-0').removeClass('d-none').addClass('d-none')
                            //     $('.action-submit-change-room').removeClass('d-none').addClass('d-none')

                            //     // remove class d-none
                            //     $('.change-room-remaining-days-is-0').removeClass('d-none')

                            // } else {
                                // add class d-none
                                $('.change-room-remaining-days-is-0').removeClass('d-none').addClass('d-none')

                                // remove class d-none
                                $('.change-room-remaining-days-more-than-0').removeClass('d-none')
                                $('.action-submit-change-room').removeClass('d-none')
                            // }
                        }
                    });
                    }else{
                        let html_label_current_room = ''
                        let remaining_days = moment(bmark.end_date).diff(moment(dateSystem), 'days');

                            html_label_current_room += `<tr>
                                                            <td style="width:110px; height:25px">Current Room<td>
                                                            <td>: `+bmark.nomor_kamar+` (`+bmark.jns_kamar+`)<td>
                                                        </tr>`

                            html_label_current_room += `<tr>
                                                            <td style="width:110px; height:25px">Current Rate<td>
                                                            <td>: ${ribuanWithComma(bmark.per_item)}<td>
                                                        </tr>`

                            // start date & end date
                            html_label_current_room += `<tr>
                                                            <td style="width:110px; height:25px">Reservation Date<td>
                                                            <td>: ${ moment(bmark.start_date).format('DD-MM-YYYY')} - ${ moment(bmark.end_date).format('DD-MM-YYYY')}<td>
                                                        </tr>`

                            // start date & end date
                            html_label_current_room += `<tr>
                                                            <td style="width:110px; height:25px">Remaining Days<td>
                                                            <td>: ${remaining_days} Days<td>
                                                        </tr>`

                        $('#label_current_room').html(html_label_current_room);

                        // add class d-none
                        $('.change-room-remaining-days-more-than-0').removeClass('d-none').addClass('d-none')
                        $('.action-submit-change-room').removeClass('d-none').addClass('d-none')
                        // remove class d-none
                        if (bmark.rate_code.tipe_rate_code == 2) {
                            $('.change-room-remaining-days-is-0 #keterangan_alert_remaining').html("Can't change cause use rate code flat/monthly")
                        }else{
                            $('.change-room-remaining-days-is-0 #keterangan_alert_remaining').html("Remaining days is 0, can't change the room from this method")
                        }
                        $('.change-room-remaining-days-is-0').removeClass('d-none')
                    }
                }
            });

            $.ajax({
                type: "get",
                url: "{{url('get-data-kamar')}}",
                data: {id:id},
                dataType: "json",
                success: function (res) {
                    $.each(res.jenis_kamars, function(index, value) {

                    let jenis_kamar_id = value.id

                    $('#change_room_booking_id').val(booking_id)
                    $('#change_room_kamar_id').val(id_kamar)
                    $('#change_room_no_kamar').val(no_kamar)

                    // $('#label_current_room').html('Room Saat Ini :' +no_kamar+'');

                        $.ajax({
                            type: 'POST',
                            url: "{{route('roomview.optionchangekamar')}}",
                            data: {
                                _token:'{{csrf_token()}}',
                                id: id,
                                no_kamar: no_kamar,
                                booking_id: booking_id,
                                jenis_kamar_id: jenis_kamar_id
                            },
                            success: function (response) {
                                let html = "";
                                let option = "<option value=''>-- Choose Available Room --</option>";

                                    // console.log(response, 'ini res')
                                $.each(response, function(index, value){
                                    // Define variable jenis kamar
                                    let jenis_kamars = ''
                                        // Change jenis kamar array/object to string with comma
                                        jenis_kamars = value.jenis_kamars.map(function(jenis_kamar) {
                                                            return jenis_kamar.nama;
                                                        }).join(', ');

                                        // let option = "";
                                        // $.each(value, function(i, v){
                                            // console.log(value, 'ini value')
                                            option += `<option data-jenis_kamar="${jenis_kamars}" value="${value.id}">${value.no_kamar} (${jenis_kamars})</option>`
                                        // });


                                })

                                if(response.length > 0){
                                    html += `
                                        ${option}
                                        `
                                    }
                                    else{
                                    html += `--Kosong--`
                                }

                                // $('#change_room_number_select').html(html);
                                $('#available_rooms').html(html);
                            }
                        });
                    })
                }
            });

        }else{
            let jenis_kamar_saat_ini = jeniskamar.map(function(jenis_kamar_value) {
                                                    return jenis_kamar_value.nama;
                                                }).join(', ');
            $.ajax({
                type: "GET",
                data:{
                    type:tipe_change,
                    nomor:no_kamar
                },
                url: "{{url('data-booking-room')}}/"+booking_id,
                success: function (response) {
                    let booking = response.booking
                    let current_roomrate = '';
                    if (booking.booking_details.length > 0) {
                        $.each(booking.booking_details, function(index_detail, value_detail){
                            console.log('masuk change room'+value_detail.nomor_kamar +'=='+no_kamar)
                            if(value_detail.nomor_kamar == no_kamar){
                                current_roomrate = value_detail.per_item
                                let html_label_current_room = ''
                                let remaining_days = moment(value_detail.end_date).diff(moment(dateSystem), 'days');

                                // room saat ini
                                html_label_current_room += `<tr>
                                                                <td style="width:110px; height:25px">Current Room<td>
                                                                <td>: `+no_kamar+` (`+value_detail.jns_kamar+`)<td>
                                                            </tr>`

                                html_label_current_room += `<tr>
                                                                <td style="width:110px; height:25px">Current Rate<td>
                                                                <td>: ${ribuanWithComma(current_roomrate)}<td>
                                                            </tr>`

                                // start date & end date
                                html_label_current_room += `<tr>
                                                                <td style="width:110px; height:25px">Reservation Date<td>
                                                                <td>: ${ moment(value_detail.start_date).format('DD-MM-YYYY')} - ${ moment(value_detail.end_date).format('DD-MM-YYYY')}<td>
                                                            </tr>`

                                // start date & end date
                                html_label_current_room += `<tr>
                                                                <td style="width:110px; height:25px">Remaining Days<td>
                                                                <td>: ${remaining_days} Days<td>
                                                            </tr>`

                                $('#label_current_room').html(html_label_current_room);
                            }
                        })
                    }

                }
            });

        }
	}

	$(document).on('change', '#available_rooms', function() {
		var getroom_types = $('#available_rooms option:selected').data('jenis_kamar')

        console.log(getroom_types, $('#available_rooms').val() != '' )

		if (getroom_types != '' && $('#available_rooms').val() != '' ) {
            $('#jns_kamar_change_room').prop('disabled', false);

			// replace spasi
			var room_types2 = getroom_types.replace(/\s/g,"")
			// jadikan array
			var array_room = room_types2.split(',')
			console.log(getroom_types, array_room)

			// ketika ganti room
			// kembalikan seleksi jenis kamar ke semula
			$('#jns_kamar_change_room').val('');
			// reenable option
			$('#jns_kamar_change_room option').prop('disabled', false);


			$('#jns_kamar_change_room > option').each(function() {
				// replace spasi
				var thisroomvalue = this.value.replace(/\s/g,"")
				// console.log(thisroomvalue)

				// jika option room tidak sesuai dengan value jenis kamar yg dipilih di available room
				// disable option yg tidak sesuai
				if (!array_room.includes(thisroomvalue)) {
					// console.log('masuk '+thisroomvalue)
					$('#jns_kamar_change_room option[value="'+this.value+'"').prop('disabled','disabled');

					//reenable first option ( Choose Room type )
					$("#jns_kamar_change_room option:first").prop('disabled', false);
					// reinitialize select2
					$('#jns_kamar_change_room').select2()
				}
			})
		}else{
            console.log('RETURN TO NULL')
            $('#jns_kamar_change_room').prop('disabled', true);
            $('#jns_kamar_change_room').val(null);
            $('#jns_kamar_change_room option').prop('disabled', true);
            $('#rate_code_change_room').html('<option val="">-- Select Rate Code --</option>');
            $('#per_item_change_room').val(null)
            $('#total_biaya_booking_text_change_room').val(null)
            $('#total_biaya_booking_change_room').val(null)

            $('#rate_code_change_room').trigger('change')
            $('#jns_kamar_change_room').select2()
        }

	})

     //Change Room
	function alertStatus(book_id, jenis_kamar, index_detail){

        event.preventDefault()

        $('#alert_status_book_id').val(book_id)

        $('#index_current_kamar').val(index_detail)

        $('#label_current_jeniskamar').html('Jenis Kamar : <b>' + jenis_kamar + '</b>');

        let req_conditions_awal = 0;
        $('.nomor_kamars').each(function(index){
            if(this){
                if(this.value){
                    req_conditions_awal++;
                }
            }
        });

        if (req_conditions_awal > 0) {
            $('#submit_setnumberform').prop('disabled', false)
        }else{
            $('#submit_setnumberform').prop('disabled', true)
        }

        $.ajax({
            type: 'POST',
            url: "{{route('roomview.optionchoosekamar')}}",
            data: {
                _token      :'{{csrf_token()}}',
                id          : book_id,
                jenis_kamar : jenis_kamar,
                array_index : index_detail,
                hotel_id    : hotel_id_now
            },
            success: function (response) {
				$('#set_room_number_form').html('');
                $('#html_group_checkin_modal').html(null)
                // console.log(response);

                // return false;

				let html_jenis_kamar = "";
				let html_ratecode = "";
				let html_no_kamar = "";

				if(response.booking_details.length > 0){
					$.each(response.booking_details, function(index, value){
                        if (value.array_sub === 0 || value.array_sub_extend_stay === 0) {
                            if (value.extend_stay === 0){
                                return;
                            }

                            let html_options = '';
                            let option = "";

                            if (response.options[value.jns_kamar]) {
                                html_options += `<option value="">-- Please Choose Room Number --</option>`;

                                $.each(response.options[value.jns_kamar], function(index2, value2){
                                    option += `<option value="${value2.id}">${value2.no_kamar}</option>`
                                })

                                html_options += `${option}`;
                            }else{
                                html_options = `<option value="">-- No Room Available --</option>`;
                            }

                            html_jenis_kamar += `<input type="text" class="form-control mb-2" value="${value.jns_kamar}" disabled>`;
                            html_ratecode += `<input type="text" class="form-control mb-2" value="${value.rate_codes}" disabled>`;
                            html_no_kamar += `
                                <div class="mb-2">
                                    <input type="hidden" name="array_index[]" value="${value.array_index}" />
                                    <select name="id_kamar[]" id="id_kamar_${index}" onchange="checkNomor(this.id), checkValue()" class="nomor_kamar_${index} nomor_kamars alert_status_number_select form-control form-control-select2 room-number-checkin">
                                        ${html_options}
                                    </select>
                                </div>
                            `;
                        }
                    })
				}

				let html_set_kamar = `
					<div class="row">
						<div class="col-md-4">
							<div class="form-group">
								<label for="jenis_kamar" class="font-weight-bold">Room Type</label>
								${html_jenis_kamar}
							</div>
						</div>
						<div class="col-md-4">
							<div class="form-group">
								<label for="rate_code" class="font-weight-bold">Rate Code</label>
								${html_ratecode}
							</div>
						</div>
						<div class="col-md-4">
							<div class="form-group font-weight-bold">
								<label for="rate_code" class="font-weight-bold">Room Number</label>
								${html_no_kamar}
							</div>
						</div>
					</div>
				`;

				$('#set_room_number_form').html(html_set_kamar);
				$('.form-control-select2').select2();
                // $('.alert_status_number_select').html(html);

                let req_conditions = 0;
                $('.alert_status_number_select').each(function(index){
                    if(this){
                        if(this.value){
                            req_conditions++;
                        }
                    }
                });

                console.log(response.booking_details.length)
                if(response.booking_details.length < 1){
                    var html_alert_check = ` <div class="alert alert-danger alert-styled-left alert-dismissible">
                                                Reservations are not yet timed to be checked in!
                                            </div>`;
                    $('#set_room_number_form').html(html_alert_check);
                }

                if (req_conditions > 0) {
                    $('#submit_setnumberform').prop('disabled', false)
                }else{
                    $('#submit_setnumberform').prop('disabled', true)
                }

                // show modal set room number
                $('#alertStatusModal').modal('show')

            },
            error: function (request, error) {
                let req_conditions = 0;
                $('.alert_status_number_select').each(function(index){
                    if(this){
                        if(this.value){
                            req_conditions++;
                        }
                    }
                });

                if (req_conditions > 0) {
                    $('#submit_setnumberform').prop('disabled', false)
                }else{
                    $('#submit_setnumberform').prop('disabled', true)
                }
            }
        });
	}

	function getSelectShop(hotel_id){
		$.ajax({
			type: 'GET',
			url: "{{ url('/getshop/')}}/"+hotel_id,
			success: function (data) {
				$('#shop_id').html(data);
			}
		});
	}

    // function getSelectTipeMenus(shop_id){
    $(document).on('change','.getSelectTipeMenus', function() {
        var shop_id = $(this).find(':selected').val()
        var nomor = $(this).data('add_trans_id')
        // console.log(shop_id, nomor)
        if (shop_id) {
		$.ajax({
			type: 'GET',
			url: "{{ url('/gettipemenus/')}}/"+shop_id,
			success: function (data) {
				$('#tipe_menu_id'+nomor).html(data);
			}
		});
        }else{
            let data = '<option value="">-- Select Item Type --</option>'
            $('#tipe_menu_id'+nomor).html(data)
        }

        resetValueTransaction('shop', nomor)
	})

    // function getSelectMenuList(tipemenu_id){
    $(document).on('change','.getSelectMenuList', function() {
        var tipemenu_id = $(this).find(':selected').val()
        var nomor = $(this).data('add_trans_id')

        if (tipemenu_id) {
		$.ajax({
			type: 'GET',
			url: "{{ url('/getmenulist/')}}/"+tipemenu_id,
			success: function (data) {
				$('#menu_id'+nomor).html(data);
			}
		});
         }else{
            let data = '<option value="">-- Select Item --</option>'
            $('#menu_id'+nomor).html(data)
        }
        resetValueTransaction('type', nomor)
	})

    //Set Harga
    // $('[name="jumlah"]').on('change', function(){
    //     // Value Menu
    //     let value_harga_menu = $('#menu_id').val();
    //     if (value_harga_menu) {
	// 	    let harga = parseInt($('#menu_id').find('option[value="'+value_harga_menu+'"]').attr('data-harga'));
    //         let jumlah = $('#jumlah').val();
    //         let total = jumlah * harga;
    //         $('#total_biaya').val(total.toLocaleString('ID'));
    //     }

	// });

    $('[name="menu_id"]').on('change', function(){
        // Value Menu
        let value_harga_menu = $('#menu_id').val();
        if (value_harga_menu) {
            let harga = parseInt($('#menu_id').find('option[value="'+value_harga_menu+'"]').attr('data-harga'));
            let jumlah = $('#jumlah').val();
            let total = jumlah * harga;
            $('#total_biaya').val(total.toLocaleString('ID'));
        }

    });


    /* -------------------------------------------------------------------------- */
    /*                        reset jumlah dan total biaya                        */
    /* -------------------------------------------------------------------------- */

    // $('[name="tipe_menu_id"]').on('change', function(){
    $('.resetjumlahtotal').on('change', function(){
        var nomor = $(this).data('add_trans_id')
        // Value Menu
        // $('#jumlah').val('1');
        // $('#total_biaya').val('');
        $('#jumlah'+nomor).val('1');
        $('#total_biaya'+nomor).val('');
       });

    // $('[name="shop_id"]').on('change', function(){
    //       // Value Menu
    //       $('#jumlah').val('1');
    //      $('#total_biaya').val('');
    // });

    //Set Harga
    function hitungtotal(nomor) {

        // Value Menu
        let shop_svc = $('#shop_id'+nomor+' option:selected').data('service')
        let shop_ppn = $('#shop_id'+nomor+' option:selected').data('ppn')

        let value_harga_menu = $('#menu_id'+nomor).val();
        let harga = parseInt($('#menu_id'+nomor).find('option[value="'+value_harga_menu+'"]').attr('data-harga'));
        let qty = $('#jumlah'+nomor).val()
        let status = $('#menu_id'+nomor).find('option[value="'+value_harga_menu+'"]').attr('data-paid_out_status')

        console.log(value_harga_menu, harga, qty, status)

		if(!isNaN(harga) && !status){
			calculateReverse(ribuanWithComma(harga*qty), nomor);
		}

        // let jumlah = $('#jumlah').val()
        // let diskon = $('#diskon').val()
		//
		// let total = (jumlah * harga)
		// let subtotal = total - diskon
		//
		// let ppn = (subtotal+service) * shop_ppn/100
		// let service = subtotal * shop_svc/100

		// let subtotal_text = subtotal - service - ppn;
		//
        // $('#service').val(service.toLocaleString('ID'))
        // $('#ppn').val(ppn.toLocaleString('ID'))
		//
        // $('#total_biaya').val(total)
		//
        // $('#subtotal').val(subtotal_text.toLocaleString('ID'))
		//
        // // let grand_total = subtotal + service + ppn
        // let grand_total = subtotal

        $('#grand_total'+nomor).val(ribuanWithComma(harga*qty))

        // // // paid out condition item
        if (status) {
            $('.non_paid_out').hide();
            $('#label_total_biaya'+nomor).html('Nominal');
            $('#subtotal'+nomor).prop('readonly', false);
            let inputs = $('.non_paid_out').find(':input[required]')
            inputs.each(function() {
                // if (this.id == 'jumlah') {
                if (this.class == 'hitungjumlah') {
                    this.value = 1
                }else{
                    this.value = 0
                }
            })

        }else{
            $('.non_paid_out').show();
            $('#label_total_biaya'+nomor).html('Sub Total');
            $('#subtotal'+nomor).prop('readonly', true);
        }

    }

    function subTotalNominal(val, nomor){
        console.log(val, nomor)
        $('#total_biaya'+nomor).val(val)
        $('#grand_total'+nomor).val(val)
    }

    // $('#grand_total').on('input', function(){
    //         $('#grand_total').mask("#.##0", {reverse: true});//set separator number
    // })

    // $('#subtotal').on('input', function(){
    $('.changesubtotal').on('input', function(){
        var nomor = $(this).data('add_trans_id')
        // $('#subtotal').mask("#,##0", {reverse: true});//set separator number
        $('#subtotal'+nomor).mask("#,##0", {reverse: true});//set separator number
    })

    function calculateReverse(grand_total, nomor){
		console.log(grand_total);
        grand_total = Number((grand_total).replaceAll(",",""))

        // Value Menu
        let shop_svc = $('#shop_id'+nomor+' option:selected').data('service')
        let shop_ppn = $('#shop_id'+nomor+' option:selected').data('ppn')

        let tax             = Math.round(Number(((grand_total) * shop_ppn)/(100+shop_ppn)));//Find tax from grand total
        let harga_min_t     = (Number((grand_total - tax)));//price minus total tax
        let services        = Math.round(Number((harga_min_t * shop_svc)/(100+shop_svc)));//Find service from grand total that minus total tax,
        let sub_total = (Number((grand_total) - (tax) - (services)));//input per item real,  without arrangement price

        $('#ppn'+nomor).val(ribuanWithComma(tax))
        $('#service'+nomor).val(ribuanWithComma(services))
        $('#total_biaya'+nomor).val(ribuanWithComma(sub_total))
        $('#subtotal'+nomor).val(ribuanWithComma(sub_total))
    }

    function resetValueTransaction(condition, nomor){
        // nomor transaksi multiple
        var nomor = nomor
        if (condition == 'shop') {
            // reset value
            $('#tipe_menu_id'+nomor).val(null).trigger('change')
            $('#menu_id'+nomor).val(null).trigger('change')

            $('#subtotal'+nomor).val(null)
            $('#total_biaya'+nomor).val(null)
            $('#service'+nomor).val(null)
            $('#ppn'+nomor).val(null)
            $('#grand_total'+nomor).val(null)

        }else if(condition == 'type'){
            // reset value
            $('#menu_id'+nomor).val(null).trigger('change')

            $('#subtotal'+nomor).val(null)
            $('#total_biaya'+nomor).val(null)
            $('#service'+nomor).val(null)
            $('#ppn'+nomor).val(null)
            $('#grand_total'+nomor).val(null)
        }
    }

    //choose nama modal checkout
    //Pilih Nama Transfer
	function chooseNama(){
		let nama_transfer = $('#nama_deposit'+id).val();
		let data_transfer = $('#datalistTransfer'+id).find('option[value="'+nama_transfer+'"]').attr('data-transfer');
		data_transfer = JSON.parse(data_transfer);

		if(data_transfer){
			//Set value nama transfer
			$('#nama_deposit').val(data_transfer.nama);
			//Set Transfer Akunting ID
			$('#transfer_akunting_id').val(data_transfer.id);
			//Set Bank
			$('#bank').val(data_transfer.bank);
			//Set Nomninal Transfer
			$('#nominal').val(data_transfer.nominal);
		}
	}

    //Payment Checkout
	function setJenisPembayaran(){
		$('#submit_pembayaran_checkout').removeAttr('disabled');
		//1: Cash; 2: Credit Card; 3: Transfer;
		let jenis_deposit = $('#checkout_jenis_pembayaran').val();
		//Platform Pembayaran
		let option_pembayaran = `<option value="">** Select Payment Platform **</option>"`;

		//Reset Form Platform Pembayaran
		$('#platform_pembayaran_id').select2().val('').trigger('change');

		//Show Platform pembayaran jika memilih jenis deposit
		if(['2','4'].includes(jenis_deposit)){
			$('#pembayaran_transfer').hide()
			$('#checkout_jenis_pembayaran_option').show();

			$.each(platform_pembayarans[jenis_deposit], function(key, platform){
				// console.log(val)
				option_pembayaran += `<option value="${platform.id}">${platform.nama}</option>`
			});

			$('#platform_pembayaran_id').html(option_pembayaran);
			$('#platform_pembayaran_id').attr('required', 'required');
            $('.wrap_segmentation_option').hide()
            $('#checkout_pembayaran_segment').attr('required', false)

		}
		else if(jenis_deposit == '3'){
			$('#checkout_jenis_pembayaran_option').hide();
			$('#platform_pembayaran_id').removeAttr('required');
			$('#pembayaran_transfer_akunting_id').trigger('change');

			$('#pembayaran_transfer').show();
            $('.wrap_segmentation_option').hide()
            $('#checkout_pembayaran_segment').attr('required', false)
		}
		else{
			$('#checkout_jenis_pembayaran_option').hide();
			$('#platform_pembayaran_id').removeAttr('required');
			$('#pembayaran_transfer').hide();

            if (jenis_deposit == '5') {
                $('.wrap_segmentation_option').show()
                $('#checkout_pembayaran_segment').attr('required', true)
                $('#alert-limit-ledger').show()
                $('#submit_pembayaran_checkout').prop('disabled', true);
            }else{
                $('.wrap_segmentation_option').hide()
                $('#checkout_pembayaran_segment').attr('required', false)
                $('#alert-limit-ledger').hide()
            }
		}
	}

    $('#checkout_pembayaran_segment').on('change', function() {
        var stat = $('#checkout_pembayaran_segment').val()
        if (stat) {
            $('#submit_pembayaran_checkout').prop('disabled', false)
        }else{
            $('#submit_pembayaran_checkout').prop('disabled', false)
        }
    })

	//Set voucher ketika pilih pembayaran
	$('#pembayaran_transfer_akunting_id').on('change', function(){
		let value = $(this).val();
		let voucher = $(this).find('option[value="'+value+'"]').attr('data-voucher');
		let nominal_transfer = parseInt($(this).find('option[value="'+value+'"]').attr('data-nominal'));
		let nominal_pembayaran = parseInt(Number($('#checkout_pembayaran_nominal').val().replaceAll(",","")));
		let metode_pembayaran = $('#checkout_jenis_pembayaran').val();

		if(metode_pembayaran == 3){
			if(nominal_transfer != nominal_pembayaran){
				$('#warning_pembayaran_transfer').html('The selected transfer nominal does not match the payment nominal.');
				$('#submit_pembayaran_checkout').attr('disabled', 'disabled');
			}
			else{
				$('#warning_pembayaran_transfer').html('');
				$('#submit_pembayaran_checkout').removeAttr('disabled');
			}
		}

		$('#voucher').val(voucher);
	})

	//Pilih Jenis Refund
	function setJenisRefund(){
		$('#btn_refund').removeAttr('disabled');
		//1: Cash; 2: Credit Card; 3: Transfer;
		let jenis_deposit = $('#refund_jenis_pembayaran').val();
		//Platform Pembayaran
		let option_pembayaran = `<option value="">** Select Payment Platform **</option>"`;

		//Reset Form Platform Pembayaran
		$('#refund_platform_pembayaran_id').select2().val('').trigger('change');
		$('#refund_transfer_akunting_id').select2().val('').trigger('change');

		//Show Platform pembayaran jika memilih jenis deposit
		if(['2','4'].includes(jenis_deposit)){
			$('#refund_transfer').hide();
			$('#refund_jenis_pembayaran_option').show();

			$.each(platform_pembayarans[jenis_deposit], function(key, platform){
				console.log(platform.nama)
				option_pembayaran += `<option value="${platform.id}">${platform.nama}</option>`
			});

			$('#refund_platform_pembayaran_id').html(option_pembayaran);
			$('#refund_platform_pembayaran_id').removeAttr('disabled');
			$('#refund_platform_pembayaran_id').attr('required', 'required');
		}
		else if(jenis_deposit == '3'){
			$('#refund_jenis_pembayaran_option').hide();
			$('#refund_platform_pembayaran_id').removeAttr('required');

			$('#refund_transfer').show();
		}
		else{
			$('#refund_jenis_pembayaran_option').hide();
			$('#refund_platform_pembayaran_id').removeAttr('required');
			$('#refund_transfer').hide();
		}
	}

	//Set voucher ketika pilih refund
	$('#refund_transfer_akunting_id').on('change', function(){
		let value = $(this).val();
		let voucher = $(this).find('option[value="'+value+'"]').attr('data-voucher');
		let nominal_transfer = parseInt($(this).find('option[value="'+value+'"]').attr('data-nominal'));
		let nominal_refund = parseInt($('#checkout_nominal_refund').val());
		let metode_pembayaran = $('#refund_jenis_pembayaran').val();

		if(metode_pembayaran == 3){
			if(nominal_transfer != nominal_refund){
				$('#warning_refund_transfer').html('The selected transfer nominal does not match the refund nominal.');
				$('#btn_refund').attr('disabled', 'disabled');
			}
			else{
				$('#warning_refund_transfer').html('');
				$('#btn_refund').removeAttr('disabled');
			}
		}

		$('#voucher_refund').val(voucher);
	})
</script>

	<script type="text/javascript">
		$('.daterange-single').daterangepicker({
			singleDatePicker: true,
			minDate: "{{getSystemDate()}}",
            startDate: "{{getSystemDate()}}",
			locale: {
				format: 'YYYY-MM-DD'
			}
		});

        // date filter
		$('.daterange-filter').daterangepicker({
            startDate: `${moment("{{getSystemDate()}}").format('DD-MM-YYYY')}`,
            endDate: `${moment("{{getSystemDate()}}").format('DD-MM-YYYY')}`,
            applyClass: 'btn-primary',
            cancelClass: 'btn-light',
			locale: {
				format: 'DD-MM-YYYY'
			}
		});

		//JS Untuk memunculkan form status kamar
		function editStatusKamar(id_kamar){
			$('.text-status').removeAttr('style');
			$('.link-status').removeAttr('style');

			$('.btn_transaksimodal').removeAttr('style');
			$('.btn_depositmodal').removeAttr('style');
			// $('.btn_pembayaranmodal_').removeAttr('style');
			// $('.btn_refundmodal_').removeAttr('style');
			$('.hrbatas').removeAttr('style');
			$('.linkguestbill').removeAttr('style');
			$('.btn_draftprintbillmodal').removeAttr('style');
			$('.btn_transferbillmodal').removeAttr('style');

			$('.select-status').attr('style', 'display:none');

			$('#text_status_kamar_'+id_kamar).attr('style', 'display:none');
			$('#link_status_kamar_'+id_kamar).attr('style', 'display:none');
            $('#wake_up_call_'+id_kamar).attr('style', 'display:none');
			$('#btn_transaksimodal_'+id_kamar).attr('style', 'display:none');
			$('#btn_depositmodal_'+id_kamar).attr('style', 'display:none');
			$('#btn_pembayaranmodal_'+id_kamar).attr('style', 'display:none');
			$('#btn_refundmodal_'+id_kamar).attr('style', 'display:none');
			$('#hr_'+id_kamar).attr('style', 'display:none');
			$('#linkguestbill_'+id_kamar).attr('style', 'display:none');
            $('#changeroom_'+id_kamar).attr('style', 'display:none');
            $('#btn_draftprintbillmodal_'+id_kamar).attr('style', 'display:none');
            $('#btn_transferbillmodal_'+id_kamar).attr('style', 'display:none');

			$('#status_kamar_'+id_kamar).removeAttr('style');
			$('#cancel_status_kamar_'+id_kamar).removeAttr('style');
		}

		function cancelStatus(id_kamar){
			$('#text_status_kamar_'+id_kamar).removeAttr('style');
			$('#link_status_kamar_'+id_kamar).removeAttr('style');
            $('#wake_up_call_'+id_kamar).removeAttr('style');
			$('#btn_transaksimodal_'+id_kamar).removeAttr('style');
			$('#btn_depositmodal_'+id_kamar).removeAttr('style');
			$('#btn_pembayaranmodal_'+id_kamar).removeAttr('style');
			$('#btn_refundmodal_'+id_kamar).removeAttr('style');
			$('#hr_'+id_kamar).removeAttr('style');
			$('#linkguestbill_'+id_kamar).removeAttr('style');
            $('#changeroom_'+id_kamar).removeAttr('style');
            $('#btn_draftprintbillmodal_'+id_kamar).removeAttr('style');
            $('#btn_transferbillmodal_'+id_kamar).removeAttr('style');

			$('#status_kamar_'+id_kamar).attr('style', 'display:none');
			$('#cancel_status_kamar_'+id_kamar).attr('style', 'display:none');
		}

		// $(".card-body").on('click', function(){
		// 	$('.text-status').removeAttr('style');
		// 	$('.link-status').removeAttr('style');
		// 	$('.select-status').attr('style', 'display:none');
		// });

		//JS untuk mensubmit penggantioan status kamar
		$('.select-status').on('change', function(){
			let id_form = $(this).attr('data-id');
			let room_no = $(this).attr('data-room_no');
			let value = $(this).val();

            if (value == 'OOO' || value == 'OS') {
                var confirm = bootbox.dialog({
                    title: `Edit Status Room No.${room_no} To Out Of Order`,
                    message: `<div class="form-group row">
                                <label class="col-form-label col-lg-4">Description Out Of Order</label>
                                <div class="col-lg-8">
                                    <textarea class="form-control" id="keterangan" cols="30" rows="5"></textarea>
                                </div>
                            </div>

                            <div class="form-group row">
                                <label class="col-form-label col-lg-4">Tanggal Deadline</label>
                                <div class="col-lg-8">
                                    <div class="input-group">
                                        <span class="input-group-prepend">
                                            <span class="input-group-text"><i class="icon-calendar22"></i></span>
                                        </span>
                                        <input id="tanggal_deadline" value="" type="text" class="form-control daterange-single">
                                    </div>
                                </div>
                            </div>`,
                    buttons: {
                        ok: {
                            label: 'Submit',
                            className: 'btn-primary',
                            callback: function () {
                                $('.keterangan_ooo').val($('#keterangan').val())
                                $('.tanggal_deadline_ooo').val($('#tanggal_deadline').val())
                                $('#form_kamar_'+id_form).submit();
                            }
                        },
                        cancel: {
                            label: 'Cancel',
                            className: 'btn-link'
                        }
                    },

                });

                $('#tanggal_deadline').daterangepicker({
                    singleDatePicker : true,
                    startDate : "{{ getSystemDate() }}",
                    locale: {
                        format: 'YYYY-MM-DD'
                    }
                });

                confirm.init(function(){
                    $('.modal-header').addClass('bg-danger');
                    $('.modal-body').addClass('text-left font-weight-bold');
                });
            }else{
                $('#form_kamar_'+id_form).submit();
            }
		});

		$(document).on('click','#show_guest', function() {
			var no_identitas = $(this).data('no_identitas')
			var name_guest = $(this).data('name_guest')

			$('#guest_name').text('')
			$('#guest_address').text('')
			$('#guest_phone').text('')
			$('#guest_email').text('')

            if (no_identitas) {
                $.ajax({
                    type: 'GET',
                    url: "{{ url('/getguestprofile/')}}/"+no_identitas,
                    success: function (data) {
                        if (data.result == 'success') {
                            $('#guest_name').text(data.name ?? '-')
                            $('#guest_address').text(data.address ?? '-')
                            $('#guest_phone').text(data.phone ?? '-')
                            $('#guest_email').text(data.email ?? '-')
                            $("#warn-text").removeAttr('style');
                            $("#warn-text").attr('style', 'display:none');
                        } else {
                            console.log('fail')
                            $('#guest_name').text('-')
                            $('#guest_address').text('-')
                            $('#guest_phone').text('-')
                            $('#guest_email').text('-')
                            $("#warn-text").removeAttr('style');
                        }
                        console.log(data)
                    },
                    error: function() {
                        $('#guest_name').text(name_guest)
                    }
                });
            }else{
                $('#guest_name').text(name_guest??'-')
                $('#guest_address').text('-')
                $('#guest_phone').text('-')
                $('#guest_email').text('-')

            }
		})

		$('.form-control-select2').select2();

		let status_booking = {!! json_encode(config('custom.status_booking')) !!};
		let status_booking_color = {!! json_encode(config('custom.status_booking_color')) !!};

		function updateStatus(hotel_id, booking_id, status_booking, detail_id){
            // console.log(hotel_id, booking_id, status_booking, detail_id)

            // ==== ASSIGN VALUE TO FORM HIDDEN INPUT ==== //
            $("#form_booking_status").find('#id_booking').val(booking_id);
			$("#form_booking_status").find('#status_booking').val(status_booking);
			$("#form_booking_status").find('#hotel_id').val(hotel_id);
			$("#form_booking_status").find('#booking_detail_id').val(detail_id);

            // CONDITION IF CHECKED OUT BALANCE BUT NO ROOMCHARGE
            if (status_booking == 2) {
                event.preventDefault();
                $.ajax({
                    type: "get",
                    url: "{{route('rv-check-before-checkout')}}",
                    data: {
                        detail_id:detail_id,
                    },
                    dataType: "json",
                    success: function (response) {
                        if (response.data_count < 1 && response.jumlah_malam >= 1) {

                            callModalAlert("Can't checkout, because the roomcharge haven't yet generate")

                            // RESET
                            $("#form_booking_status").find('#id_booking').val(null);
                            $("#form_booking_status").find('#status_booking').val(null);
                            $("#form_booking_status").find('#hotel_id').val(null);
                            $("#form_booking_status").find('#booking_detail_id').val(null);

                            // RETURN
                            return false

                        }else{
                            // console.log('submitted')
                            $("#form_booking_status").submit() // ====> SUBMIT
                        }
                    }
                });
            }else{
                $("#form_booking_status").submit() // ====> SUBMIT
            }

		}

		// function day use
		function dayUse(hotel_id, booking_id, bookingDetail_id){
			$("#form_day_use").find('#id_booking_day_use').val(booking_id);
			$("#form_day_use").find('#id_booking_detail_day_use').val(bookingDetail_id);
			$("#form_day_use").find('#hotel_id_day_use').val(hotel_id);
			$("#form_day_use").submit();
		}

		//day use + pembayaran
		function ClickBtnPembayaranDayUse(id, nominal, nama, booking_id, room_index, coawal=false){
            // Reset Modal
            $("#dayUse_jenis_pembayaran").val('').trigger("change");
            $("#dayUse_voucher").val('');

			var id = id
			var nominal = nominal
			var nama = nama

            let segment =  {!! json_encode(config('custom.segment_ratecodes')) !!};

            // defined variable
            let segmentations = $('.segmentation_value')

            $.ajax({
                type: "get",
                url: "{{url('get-data-booking')}}",
                data: {id:booking_id},
                dataType: "json",
                async:false,
                success: function (booking) {

                    //Cek apakah data booking termasuk ledger atau individual ledger
                    var company_ledger = booking.company_id;
                    var status_company_ledger  = booking?.company?.status_ledger
                    var individual_ledger = booking?.guest?.individual_ledger ?? booking?.guest_profile?.individual_ledger;
                    var status_individual_ledger = booking?.guest?.status_ledger ?? booking?.guest_profile?.status_ledger;
                    // var option_metode_pembayaran = "";
                    var option_metode_pembayaran = '<option value="">** Select Payment Method **</option>';

                    // // Jika customer adalah company ledger
                    // if(company_ledger){
                    // 	// console.log('Company Ledger');
                    // 	$.each(jenis_pembayaran, function(index, metode_pembayaran){
                    // 		// console.log(index);
                    // 		if(!['3', '6','7','8'].includes(index)){
                    // 			option_metode_pembayaran += `<option value="${index}">${metode_pembayaran}</option>`;
                    // 		}
                    // 	});
                    // }
                    // //Jika customer adalah individual ledger
                    // else if(individual_ledger) {
                    // 	// console.log('Individual Ledger');
                    // 	$.each(jenis_pembayaran, function(index, metode_pembayaran){
                    // 		if(!['3','6','7','8'].includes(index)){
                    // 			option_metode_pembayaran += `<option value="${index}">${metode_pembayaran}</option>`;
                    // 		}
                    // 	});
                    // }
                    // // jika customer bukan company ledger maupun individual ledger
                    // else{
                    // 	// console.log('Non Ledger');
                    // 	$.each(jenis_pembayaran, function(index, metode_pembayaran){
                    // 		if(!['3','5','6','7','8'].includes(index)){
                    // 			option_metode_pembayaran += `<option value="${index}">${metode_pembayaran}</option>`;
                    // 		}
                    // 	});
                    // }

                    $.each(jenis_deposit_text, function(index, metode_pembayaran){
                        if(!['3'].includes(index)){
                            option_metode_pembayaran += `<option value="${index}">${metode_pembayaran}</option>`;
                        }
                    });

                    $(".segmentation_value").prop('disabled', true)

                    $.each(segmentations, function(index_segmentation, segmentation){
                        if(($(segmentation).val() == booking?.company?.main_segment  && status_company_ledger == 1) || (individual_ledger ? $(segmentation).val() == 14  && status_individual_ledger == 1 : false)){
                            $("#dayUse_pembayaran_segment option[value='"+$(segmentation).val()+"']").prop('disabled', false)
                        } else {
                            $("#dayUse_pembayaran_segment option[value='"+$(segmentation).val()+"']").prop('disabled', true)
                        }
                    });

                    $('.wrap_segmentation_option').attr('style','display:none')
                    $('#dayUse_pembayaran_segment').attr('required', false)
                    $('#dayUse_pembayaran_segment').val('').select2().trigger('change')

                    $('#dayUse_jenis_pembayaran').html(option_metode_pembayaran);

                    if(['10','11'].includes(booking.segmentasi_rate_code))
                    {
                        $('#dayUse_nominalbayar').text('Remaining Balance : Rp ' + ribuanWithComma(Number(0)))
                    }
                    else{
                        $('#dayUse_nominalbayar').text('Remaining Balance : Rp ' + ribuanWithComma(Number(nominal)))
                    }

                    $('#dayUse_pembayaran_nama').val(nama)
                    $('#dayUse_pembayaran_booking_id').val(id)
                    $('#dayUse_pembayaran_room_index').val(room_index)

                    if(['10','11'].includes(booking.segmentasi_rate_code))
                    {
                        $('#dayUse_pembayaran_nominal').val(0)
                        $('#dayUse_jenis_pembayaran').removeAttr('required');
                        $('#dayUse_jenis_pembayaran').attr('disabled', 'disabled');
                    }
                    else{
                        $('#dayUse_pembayaran_nominal').val(ribuanWithComma(nominal))
                        $('#dayUse_jenis_pembayaran').attr('required', 'required');
                        $('#dayUse_jenis_pembayaran').removeAttr('disabled');
                    }

                    // $('#dayUse_pembayaran_segment').val(booking.segmentasi_rate_code).trigger('change')
                    // $('#dayUse_pembayaran_segment').val('').trigger('change')

                    if (['2','3','4','5','6','8','9'].includes(booking.segmentasi_rate_code)) {
                        $('#dayUse_pembayaran_company_ledger').removeAttr('style')

                        //Ambil Corporate Dengan Segment
                        // getCorporateBySegment(booking.segmentasi_rate_code);

                        setTimeout(function(){
                            $('#company_ledger_pembayaran_dayUse').val(booking.company_id);
                        }, 1000);

                    }else{
                        $('#dayUse_pembayaran_company_ledger').attr('style','display:none')
                    }

                    $.ajax({
                        type: 'POST',
                        url: "{{route('roomview.detailratebook')}}",
                        data: {
                            _token:'{{csrf_token()}}',
                            id: id,
                            room_index: room_index
                        },
                        success: function (response) {
                            let html = "";

                            // console.log(response);

                            $.each(response, function(i, v){


                                if(response.length > 0){
                                html += `
                                    <tr>
                                        <td><b>Rate Code ${moment(v.booking_detail?.date_now).format('DD-MM-YYYY')} : </b>${(v?.booking_detail?.rate_codes) ?? (v.description) }</td>
                                        <td>-</td>
                                        <td align="right">${ribuanWithComma(v?.total)}</td>
                                        <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : ribuanWithComma(v?.total)}</td>
                                    </tr>`
                                }
                                else{
                                html += `
                                    <tr>
                                        <td>Rate Code -</td>
                                        <td>-</td>
                                        <td align="right">-</td>
                                        <td align="right">-</td>
                                    </tr>`
                                }

                                $('#dayUse_tabelb_rincian_booking').html(html);

                            })
                        }
                    });

                    dayuseratecall(id, room_index)//call

                    $.ajax({
                        type: 'POST',
                        url: "{{route('roomview.detailshopbook')}}",
                        data: {
                            _token:'{{csrf_token()}}',
                            id: id,
                            room_index:room_index
                        },
                        success: function (response) {

                                let html = "";

                                // Ambil Data pembayaran pos yang transfer kamar
                                if(response.pembayaran_pos.length > 0){
                                    $.each(response.pembayaran_pos, function(i, v){
                                        html += `
                                            <tr>
                                                <td><b>Outlet : </b>${v?.cart?.order_flag}</td>
                                                <td></td>
                                                <td align="right">${ribuanWithComma(v.nominal)}</td>
                                                <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : ribuanWithComma(v.nominal)}</td>
                                            </tr>`
                                    })

                                }

                                // Ambil Data Item Transaksi Shop
                                if(response.shop_transactions.length > 0){
                                    $.each(response.shop_transactions, function(i, v){
                                        html += `
                                            <tr>
                                                <td><b>Order : </b>${v?.menu?.nama ?? v.keterangan_custom} ${v.description ? '- '+v.description:''}</td>
                                                <td>${v.jumlah}</td>
                                                <td align="right">${ribuanWithComma((v?.grand_total/v?.jumlah))}</td>
                                                <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : ribuanWithComma(v.grand_total)}</td>
                                            </tr>`
                                    })
                                }


                                $('#dayUse_tabelb_rincian_shop_booking').html(html);

                        }
                    });

                    $.ajax({
                        type: 'POST',
                        url: "{{route('roomview.detaildepobook')}}",
                        data: {
                            _token:'{{csrf_token()}}',
                            id: id,
                            room_index:room_index
                        },
                        success: function (response) {
                            let html = "";

                            console.log(response);

                            $.each(response, function(i, v){


                                if(response.length > 0){
                                html += `
                                    <tr>
                                        <td><b>${v.deposit_reservasi == 1 ? 'Deposit' : 'Pembayaran' } : </b> ${v.no_kwitansi == null ? ' - ' : v.no_kwitansi }: ${v.nama} ${jenis_deposit_text[v.jenis_deposit]} ${[2,4].includes(v.jenis_deposit) ? v.platform.nama : ([5].includes(v.jenis_deposit) ? (v.segmentation ? '-'+segment[v.segmentation] : '') : '')}  ${v.voucher ? '/'+v.voucher : '' } ${v.description ? '-'+v.description : ''}</td>
                                        <td>-</td>
                                        <td align="right">-</td>
                                        <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : ribuanWithComma(v.nominal)}</td>
                                    </tr>`
                                }
                                else{
                                html += `
                                    <tr>
                                        <td><b>Pembayaran :</b> - </td>
                                        <td>-</td>
                                        <td align="right">-</td>
                                        <td align="right">-</td>
                                    </tr>`
                                }

                                $('#dayUse_tabelb_rincian_depo_booking').html(html);

                            })
                        }
                    });

                    $.ajax({
                        type: 'POST',
                        url: "{{route('roomview.detailpembayaransebagianbook')}}",
                        data: {
                            _token:'{{csrf_token()}}',
                            id: id,
                            room_index:room_index
                        },
                        success: function (response) {
                            let html = "";

                            $.each(response, function(i, v){


                                if(response.length > 0){
                                html += `
                                    <tr>
                                        <td><b>Pembayaran ${moment(v?.transaction_date).format('DD-MM-YYYY')} : </b> ${v.no_kwitansi == null ? ' - ' : v.no_kwitansi }: ${v?.booking?.nama} ${jenis_pembayaran[v.jenis_pembayaran_id]} ${[2,4].includes(v.jenis_pembayaran_id) ? v?.platform_pembayaran?.nama : ([5].includes(v.jenis_pembayaran_id) ? (v.segment ? '-'+segment[v.segment] : '') : '')}  ${v?.voucher ? '/'+v?.voucher : ''}</td>
                                        <td>-</td>
                                        <td align="right">-</td>
                                        <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : ribuanWithComma(v.nominal)}</td>
                                    </tr>`
                                }
                                else{
                                html += `
                                    <tr>
                                        <td><b>Pembayaran :</b> - </td>
                                        <td>-</td>
                                        <td align="right">-</td>
                                        <td align="right">-</td>
                                    </tr>`
                                }

                                $('.tabelb_rincian_pembayaran_sebagian_booking').html(html);

                            })
                        }
                    });

                    $.ajax({
                        type: 'POST',
                        url: "{{route('roomview.detailpembayaranpos')}}",
                        data: {
                            _token:'{{csrf_token()}}',
                            id: id,
                            room_index:room_index
                        },
                        success: function (response) {
                            let html = "";

                            $.each(response, function(i, v){


                                if(response.length > 0){
                                html += `
                                    <tr>
                                        Transfer from Resto Mbah'e 2000006
                                        <td>Transfer from ${v?.cart?.shop?.nama} ${v?.cart?.order_flag}</td>
                                        <td>-</td>
                                        <td align="right">-</td>
                                        <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : ribuanWithComma(v.nominal)}</td>
                                    </tr>`
                                }

                                $('.tabelb_rincian_pembayaranpos').html(html);
                                console.log('rincian transfer to room pos')
                            })
                        }
                    });

                    if (coawal) {
                        $('#dayuse_co_awal_status').val(1)
                        $('#dayUse_pembayaran_nominal').val(null).hide().attr('disabled', true)
                        $('.label_nominal_modal_co').hide()
                        $('.element_co_awal').hide()
                        $('.element_co_awal select').prop('required', false);
                        $('.element_co_awal input').prop('required', false);
                        $('#modal_dayuse_title').html('Dayuse & Preview');
                    }else{
                        $('#dayuse_co_awal_status').val(0)
                        $('#dayUse_pembayaran_nominal').val(ribuanWithComma(nominal)).show().attr('disabled', false)
                        $('.label_nominal_modal_co').show()
                        $('.element_co_awal').show()
                        $('.element_co_awal select').prop('required', true);
                        $('#modal_dayuse_title').html('Payment & Day Use');
                    }
                },
                error: function(xhr, status, error) {
                    callModalAlert("Oops, something wrong can't get data booking!")
                }
            });
		}

        function dayuseratecall(id,room_index,type=null) {
            // detailratebook-roomview-dayuse
            $.ajax({
				type: 'get',
				url: "{{url('detailratebook-roomview-dayuse')}}",
				data: {
					_token:'{{csrf_token()}}',
					id: id,
                    room_index: room_index,
                    type:type,
				},
				success: function (response) {
					let html = "";

                    var sum  = 0;
					$.each(response, function(i, v){

                        console.log(v?.per_item);
                        sum += v.per_item

						if(response.length > 0){
						html += `
							<tr>
                                <td><b>Rate Code ${moment(v?.date_now).format('DD-MM-YYYY')} : </b>${(v?.rate_codes) ?? (v.description) }</td>
                                <td>-</td>
                                <td align="right">${ribuanWithComma(v?.per_item)}</td>
								<td align="right">${['10','11'].includes(v?.booking?.segmentasi_rate_code) ? 0 : ribuanWithComma(v?.per_item)}</td>
                                <input type="hidden" class="nominal-dayuse" value="${v?.per_item}">
							</tr>`
						}
					})

                    $('.dayuserateclass').html(html);

                    if (type) {
                        $('#dayUse_pembayaran_nominal').val(ribuanWithComma(sum))
                        $('#dayUse_nominalbayar').text('Remaining Balance : Rp ' + ribuanWithComma(Number(sum)))
                    }

				}
			});
        }

        function roomratecall(id,room_index,type=null) {
            $('#tabelb_rincian_booking').html(null);
            var sum  = 0;

            $.ajax({
                type: 'POST',
                url: "{{route('roomview.detailratebook')}}",
                data: {
                    _token:'{{csrf_token()}}',
                    id: id,
                    room_index:room_index,
                    type:type
                },
                async:false,
                success: function (response) {
                    let html = "";
                    console.log(response.length);

                    if(response.length > 0){
                        $.each(response, function(i, v){

                            let dtotal = ''
                            let peritem = ''
                            if (v.per_item) {
                                dtotal = String(v.per_item).replace(/(?<!\..*)(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')
                                peritem = dtotal
                                sum+=v.per_item;
                            }else{
                                dtotal = String(v.total).replace(/(?<!\..*)(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')
                                if (v.harga_satuan) {
                                    peritem = String(v.harga_satuan).replace(/(?<!\..*)(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')
                                }else{
                                    peritem = String(v.total).replace(/(?<!\..*)(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')

                                }
                                if(v.booking_deposit_id){
                                    sum-=v.total;
                                }else{
                                    sum+=v.total;
                                }
                            }

                            // sum+=v.pert_item;

                            // backup table dalam response
                            // <td align="right">${v?.total.toLocaleString('ID')}</td>
                            // <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : (v?.total).toLocaleString('ID')}</td>

                            if(response.length > 0){
                            html += `
                                <tr>
                                    <td><b>${moment(v.booking_detail?.date_now).format('DD-MM-YYYY')} : </b>${(v?.rate_codes) ?? (v.description)}</td>
                                    <td>-</td>
                                    <td align="right">${peritem}</td>
                                    <td align="right">${v.booking ? (['10','11'].includes(v?.booking?.segmentasi_rate_code) ? 0 : dtotal) : dtotal }</td>
                                </tr>`
                            }
                            else{
                            html += `
                                <tr>
                                    <td>Rate Code -</td>
                                    <td>-</td>
                                    <td align="right">-</td>
                                    <td align="right">-</td>
                                </tr>`
                            }

                            $('#tabelb_rincian_booking').html(html);

                        })

                    }else{
                        console.log('disabled');
                        $('#tabelb_rincian_booking').html(null);
                    }
                }
            });
            console.log('ratecode: '+sum)
            $.ajax({
                type: 'POST',
                url: "{{route('roomview.detailshopbook')}}",
                data: {
                    _token:'{{csrf_token()}}',
                    id: id,
                    room_index:room_index
                },
                async:false,
                success: function (response) {
                        let html = "";

                        // backup tabel dalam response
                        // <td align="right">${(v.nominal).toLocaleString('ID')}</td>
                        // <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : (v.nominal).toLocaleString('ID')}</td>

                        // Ambil Data pembayaran pos yang transfer kamar
                        if(response.pembayaran_pos.length > 0){
                            $.each(response.pembayaran_pos, function(i, v){
                                let dnom = ''
                                if (v) {
                                    dnom = String(v.nominal).replace(/(?<!\..*)(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')
                                }

                                html += `
                                    <tr>
                                        <td><b>Outlet ${moment(v?.cart?.transaction_date).format('DD-MM-YYYY')}: </b>${v?.cart?.order_flag}</td>
                                        <td></td>
                                        <td align="right">${dnom}</td>
                                        <td align="right">${dnom}</td>
                                    </tr>`

                                sum -= v.nominal
                            })
                        }

                        // backup tabel dalam response
                        // <td align="right">${(v.menu?.harga).toLocaleString('ID')}</td>
                        // <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : (v.grand_total).toLocaleString('ID')}</td>

                        // Ambil Data Item Transaksi Shop
                        if(response.shop_transactions.length > 0){
                            $.each(response.shop_transactions, function(i, v){
                                let dmharga = ''
                                let dgtotal = ''
                                if (v.menu) {
                                    dmharga = String((v?.grand_total/v?.jumlah)).replace(/(?<!\..*)(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')
                                }
                                dgtotal = String(v.grand_total).replace(/(?<!\..*)(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')

                                html += `
                                    <tr>
                                        <td><b>Order  ${moment(v?.transaction_date).format('DD-MM-YYYY')}: </b>${v?.menu?.nama ?? v.keterangan_custom} ${v.description ? '- '+v.description:''} </td>
                                        <td>${v.jumlah}</td>
                                        <td align="right">${dmharga}</td>
                                        <td align="right">${dgtotal}</td>
                                    </tr>`

                                sum += v.grand_total
                            })
                        }

                        $('#tabelb_rincian_shop_booking').html(html);//tambahkan rincian ke modal
                }
            });
            console.log('detailshop: '+sum)
            $.ajax({
                type: 'POST',
                url: "{{route('roomview.detaildepobook')}}",
                data: {
                    _token:'{{csrf_token()}}',
                    id: id,
                    room_index:room_index
                },
                async:false,
                success: function (response) {
                    let html = "";

                    console.log(response);

                    $.each(response, function(i, v){

                        // backup response dalam table
                        // <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : (v.nominal).toLocaleString('ID')}</td>
                        let dnom = ''
                        dnom = String(v.nominal).replace(/(?<!\..*)(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')

                        sum -= v.nominal

                        if(response.length > 0){
                        html += `
                            <tr>
                                <td><b>${v.deposit_reservasi == 1 ? 'Deposit' : 'Pembayaran' }  ${moment(v?.transaction_date).format('DD-MM-YYYY')} : </b> ${v.no_kwitansi == null ? ' - ' : v.no_kwitansi }: ${v.nama} ${jenis_deposit_text[v.jenis_deposit]} ${[2,4].includes(v.jenis_deposit) ? v.platform.nama : ([5].includes(v.jenis_deposit) ? (v.segmentation ? '-'+segment[v.segmentation] : '') : '')} ${v.voucher ? '/'+v.voucher : '' } ${v.description ? '-'+v.description : ''}</td>
                                <td>-</td>
                                <td align="right">-</td>
                                <td align="right">${dnom}</td>
                            </tr>`
                        }
                        else{
                        html += `
                            <tr>
                                <td><b>Pembayaran :</b> - </td>
                                <td>-</td>
                                <td align="right">-</td>
                                <td align="right">-</td>
                            </tr>`
                        }

                        $('#tabelb_rincian_depo_booking').html(html);

                    })
                }
            });
            console.log('detaildepobook: '+sum)
            $.ajax({
                type: 'POST',
                url: "{{route('roomview.detailpembayaransebagianbook')}}",
                data: {
                    _token:'{{csrf_token()}}',
                    id: id,
                    room_index:room_index
                },
                async:false,
                success: function (response) {
                    let html = "";

                    $.each(response, function(i, v){

                        // backup response dalam table
                        // <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : (v.nominal).toLocaleString('ID')}</td>

                        let dnom = ''
                        dnom = String(v.nominal).replace(/(?<!\..*)(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')
                        sum -= v.nominal

                        if(response.length > 0){
                        html += `
                            <tr>
                                <td><b>Pembayaran ${moment(v?.transaction_date).format('DD-MM-YYYY')} : </b> ${v.no_kwitansi == null ? ' - ' : v.no_kwitansi } : ${v?.booking?.nama} ${jenis_pembayaran[v.jenis_pembayaran_id]} ${[2,4].includes(v.jenis_pembayaran_id) ? v?.platform_pembayaran?.nama : ([5].includes(v.jenis_pembayaran_id) ? (v.segment ? '-'+segment[v.segment] : '') : '')} ${v?.voucher ? '/'+v?.voucher : ''}</td>
                                <td>-</td>
                                <td align="right">-</td>
                                <td align="right">${dnom}</td>
                            </tr>`
                        }
                        else{
                        html += `
                            <tr>
                                <td><b>Pembayaran :</b> - </td>
                                <td>-</td>
                                <td align="right">-</td>
                                <td align="right">-</td>
                            </tr>`
                        }

                        $('.tabelb_rincian_pembayaran_sebagian_booking').html(html);

                    })
                }
            });
            console.log('detailpembayaransebagianbook: '+sum)
            $.ajax({
                type: 'POST',
                url: "{{route('roomview.detailpembayaranpos')}}",
                data: {
                    _token:'{{csrf_token()}}',
                    id: id,
                    room_index:room_index
                },
                async:false,
                success: function (response) {
                    let html = "";

                    $.each(response, function(i, v){


                        if(response.length > 0){
                        html += `
                            <tr>
                                Transfer from Resto Mbah'e 2000006
                                <td>Transfer from ${v?.cart?.shop?.nama} ${v?.cart?.order_flag}</td>
                                <td>-</td>
                                <td align="right">-</td>
                                <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : ribuanWithComma(v.nominal)}</td>
                            </tr>`
                        }
                        sum += v.nominal

                        $('.tabelb_rincian_pembayaranpos').html(html);
                        console.log('rincian transfer to room pos')
                    })
                }
            });
            console.log('detailpembayaranpos: '+sum)
            if (type) {
                $('#checkout_pembayaran_nominal').val(ribuanWithComma(sum))
                $('#nominalbayar').text('Remaining Balance : Rp ' + ribuanWithComma(Number(sum)))
            }
        }

        // typebilldayusebayar
        $(document).on('change', '.typebilldayusebayar', function() {
		    var tipe        = $('#dayUse_pembayaranModal input[type=radio][name=typebill]:checked').val();
            var id          = $('#dayUse_pembayaran_booking_id').val()
            var room_index  = $('#dayUse_pembayaran_room_index').val()
            if(tipe=='multiple'){
                dayuseratecall(id,room_index,'multiple')
            } else {
                dayuseratecall(id,room_index,'single')
            }
        })

        // typebillearlyco
        $(document).on('change', '.typebillco', function() {
		    var tipe        = $('#form_checkout input[type=radio][name=typebill]:checked').val();
            var id          = $('#checkout_pembayaran_booking_id').val()
            var room_index  = $('#checkout_pembayaran_room_index').val()
            if(tipe=='multiple'){
                roomratecall(id,room_index,'multiple')
            } else {
                roomratecall(id,room_index,'single')
            }
        })

		//day use + refund
		function ClickBtnRefundDayUse(id, nominal, nama, booking_id, room_index){
            // Reset Modal
            $("#dayUse_refund_jenis_pembayaran").val('').trigger("change");
            $("#dayUse_voucher_refund").val('');

			console.log('masuk'+nominal)
			var id = id
			var nominal = nominal
			var nama = nama

            let segment =  {!! json_encode(config('custom.segment_ratecodes')) !!};

            $.ajax({
                type: "get",
                url: "{{url('get-data-booking')}}",
                data: {id:booking_id},
                dataType: "json",
                async:false,
                success: function (booking) {
                        //Cek apakah data booking termasuk ledger atau individual ledger
                        var company_ledger = booking.company_id;
                        var individual_ledger = booking?.guest_profile?.individual_ledger;
                        var option_metode_pembayaran = "";

                        // Jika customer adalah company ledger
                        if(company_ledger){
                            // console.log('Company Ledger');
                            $.each(jenis_pembayaran, function(index, metode_pembayaran){
                                // console.log(index);
                                if(!['6','7','8'].includes(index)){
                                    option_metode_pembayaran += `<option value="${index}">${metode_pembayaran}</option>`;
                                }
                            });
                        }
                        //Jika customer adalah individual ledger
                        else if(individual_ledger) {
                            // console.log('Individual Ledger');
                            $.each(jenis_pembayaran, function(index, metode_pembayaran){
                                if(!['6','7','8'].includes(index)){
                                    option_metode_pembayaran += `<option value="${index}">${metode_pembayaran}</option>`;
                                }
                            });
                        }
                        // jika customer bukan company ledger maupun individual ledger
                        else{
                            // console.log('Non Ledger');
                            $.each(jenis_pembayaran, function(index, metode_pembayaran){
                                if(!['5','6','7','8'].includes(index)){
                                    option_metode_pembayaran += `<option value="${index}">${metode_pembayaran}</option>`;
                                }
                            });
                        }

                        $('#dayUse_refund_jenis_pembayaran').html(option_metode_pembayaran);

                        $('#dayUse_refund_nominalbayar').text('Nominal Refund  : Rp ' + ribuanWithComma(Number(Math.abs(nominal))))

                        $('#dayUse_refund_nama').val(nama)
                        $('#dayUse_refund_booking_id').val(id)
                        $('#dayUse_refund_room_index').val(room_index)
                        $('#dayUse_nominal_refund').val(ribuanWithComma(nominal * -1))
                        $('#dayUse_refund_segment').val(booking.segmentasi_rate_code).trigger('change')

                        if (booking.segmentasi_rate_code == 2 || booking.segmentasi_rate_code == 3 ) {
                            $('#dayUse_refund_company_ledgers').removeAttr('style')
                            $('#dayUse_refund_company_ledgers').val(booking.company_id);

                            // setTimeout(function(){
                            // }, 3000);

                        }else{
                            $('#dayUse_refund_company_ledger').attr('style','display:none')
                        }

                        dayuseratecall(id, room_index)//call

                        $.ajax({
                            type: 'POST',
                            url: "{{route('roomview.detailratebook')}}",
                            data: {
                                _token:'{{csrf_token()}}',
                                id: id,
                                room_index: room_index
                            },
                            success: function (response) {
                                let html = "";

                                // console.log(response);

                                $.each(response, function(i, v){


                                    if(response.length > 0){
                                    html += `
                                        <tr>
                                            <td><b>Rate Code ${moment(v.booking_detail?.date_now).format('DD-MM-YYYY')} : </b>${v?.booking_detail?.rate_codes ?? (v.description) }</td>
                                            <td>-</td>
                                            <td align="right">${ribuanWithComma(v?.total)}</td>
                                            <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : ribuanWithComma(v?.total)}</td>
                                        </tr>`
                                    }
                                    else{
                                    html += `
                                        <tr>
                                            <td>Rate Code -</td>
                                            <td>-</td>
                                            <td align="right">-</td>
                                            <td align="right">-</td>
                                        </tr>`
                                    }

                                    $('#dayUse_tabelb_rincian_booking_refund').html(html);

                                })
                            }
                        });

                        $.ajax({
                            type: 'POST',
                            url: "{{route('roomview.detailshopbook')}}",
                            data: {
                                _token:'{{csrf_token()}}',
                                id: id,
                                room_index:room_index
                            },
                            success: function (response) {
                                let html = "";

                                    // Ambil Data pembayaran pos yang transfer kamar
                                    if(response.pembayaran_pos.length > 0){
                                        $.each(response.pembayaran_pos, function(i, v){
                                            html += `
                                                <tr>
                                                    <td><b>Outlet : </b>${v?.cart?.order_flag}</td>
                                                    <td></td>
                                                    <td align="right">${ribuanWithComma(v.nominal)}</td>
                                                    <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : ribuanWithComma(v.nominal)}</td>
                                                </tr>`
                                        })

                                    }

                                    // Ambil Data Item Transaksi Shop
                                    if(response.shop_transactions.length > 0){
                                        $.each(response.shop_transactions, function(i, v){
                                            html += `
                                                <tr>
                                                    <td><b>Order : </b>${v?.menu?.nama ?? v.keterangan_custom} ${v.description ? '- '+v.description:''}</td>
                                                    <td>${v.jumlah}</td>
                                                    <td align="right">${ribuanWithComma((v?.grand_total/v?.jumlah))}</td>
                                                    <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : ribuanWithComma(v.grand_total)}</td>
                                                </tr>`
                                        })
                                    }

                                    $('#dayUse_tabelb_rincian_shop_booking_refund').html(html);
                            }
                        });

                        $.ajax({
                            type: 'POST',
                            url: "{{route('roomview.detaildepobook')}}",
                            data: {
                                _token:'{{csrf_token()}}',
                                id: id,
                                room_index:room_index
                            },
                            success: function (response) {
                                let html = "";

                                // console.log(response);

                                $.each(response, function(i, v){


                                    if(response.length > 0){
                                    html += `
                                        <tr>
                                            <td><b>${v.deposit_reservasi == 1 ? 'Deposit' : 'Pembayaran' } : </b>${v.no_kwitansi == null ? '-' : v.no_kwitansi }: ${v.nama} ${jenis_deposit_text[v.jenis_deposit]} ${[2,4].includes(v.jenis_deposit) ? v.platform.nama : ([5].includes(v.jenis_deposit) ? (v.segmentation ? '-'+segment[v.segmentation] : '') : '')} ${v.voucher ? '/'+v.voucher : '' } ${v.description ? '-'+v.description : ''}</td>
                                            <td>-</td>
                                            <td align="right">-</td>
                                            <td align="right">${ribuanWithComma(v.nominal)}</td>
                                        </tr>`
                                    }
                                    else{
                                    html += `
                                        <tr>
                                            <td>Pembayaran:-</td>
                                            <td>-</td>
                                            <td align="right">-</td>
                                            <td align="right">-</td>
                                        </tr>`
                                    }

                                    $('#dayUse_tabelb_rincian_depo_booking_refund').html(html);

                                })
                            }
                        });

                        $.ajax({
                            type: 'POST',
                            url: "{{route('roomview.detailpembayaransebagianbook')}}",
                            data: {
                                _token:'{{csrf_token()}}',
                                id: id,
                                room_index:room_index
                            },
                            success: function (response) {
                                let html = "";

                                $.each(response, function(i, v){


                                    if(response.length > 0){
                                    html += `
                                        <tr>
                                            <td><b>Pembayaran ${moment(v?.transaction_date).format('DD-MM-YYYY')} : </b> ${v.no_kwitansi == null ? ' - ' : v.no_kwitansi }: ${v?.booking?.nama} ${jenis_pembayaran[v.jenis_pembayaran_id]} ${[2,4].includes(v.jenis_pembayaran_id) ? v?.platformPembayaran?.nama : ([5].includes(v.jenis_pembayaran_id) ? (v.segment ? '-'+segment[v.segment] : '') : '')}</td>
                                            <td>-</td>
                                            <td align="right">-</td>
                                            <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : ribuanWithComma(v.nominal)}</td>
                                        </tr>`
                                    }
                                    else{
                                    html += `
                                        <tr>
                                            <td><b>Pembayaran :</b> - </td>
                                            <td>-</td>
                                            <td align="right">-</td>
                                            <td align="right">-</td>
                                        </tr>`
                                    }

                                    $('.tabelb_rincian_pembayaran_sebagian_booking').html(html);

                                })
                            }
                        });

                        $.ajax({
                            type: 'POST',
                            url: "{{route('roomview.detailpembayaranpos')}}",
                            data: {
                                _token:'{{csrf_token()}}',
                                id: id,
                                room_index:room_index
                            },
                            success: function (response) {
                                let html = "";

                                $.each(response, function(i, v){


                                    if(response.length > 0){
                                    html += `
                                        <tr>
                                            Transfer from Resto Mbah'e 2000006
                                            <td>Transfer from ${v?.cart?.shop?.nama} ${v?.cart?.order_flag}</td>
                                            <td>-</td>
                                            <td align="right">-</td>
                                            <td align="right">${['10','11'].includes(booking.segmentasi_rate_code) ? 0 : ribuanWithComma(v.nominal)}</td>
                                        </tr>`
                                    }

                                    $('.tabelb_rincian_pembayaranpos').html(html);
                                    console.log('rincian transfer to room pos')
                                })
                            }
                        });
                },
                error: function(xhr, status, error) {
                    callModalAlert("Oops, something wrong can't get data booking!")
                }
            });

		}

		//Payment day use
		function setJenisPembayaranDayUse(){
			$('#submit_pembayaran_dayUse').removeAttr('disabled');
			//1: Cash; 2: Credit Card; 3: Transfer;
			let jenis_deposit = $('#dayUse_jenis_pembayaran').val();
			//Platform Pembayaran
			let option_pembayaran = `<option value="">** Select Payment Platform **</option>"`;

			//Reset Form Platform Pembayaran
			$('#dayUse_platform_pembayaran_id').select2().val('').trigger('change');

			//Show Platform pembayaran jika memilih jenis deposit
			if(['2','4'].includes(jenis_deposit)){
				$('#dayUse_pembayaran_transfer').hide()
				$('#dayUse_jenis_pembayaran_option').show();

				$.each(platform_pembayarans[jenis_deposit], function(key, platform){
					// console.log(val)
					option_pembayaran += `<option value="${platform.id}">${platform.nama}</option>`
				});

				$('#dayUse_platform_pembayaran_id').html(option_pembayaran);
				$('#dayUse_platform_pembayaran_id').attr('required', 'required');
                $('.wrap_segmentation_option').hide()
                $('#dayUse_pembayaran_segment').attr('required', false)
			}
			else if(jenis_deposit == '3'){
				$('#dayUse_jenis_pembayaran_option').hide();
				$('#dayUse_platform_pembayaran_id').removeAttr('required');
				$('#dayUse_pembayaran_transfer_akunting_id').trigger('change');

				$('#dayUse_pembayaran_transfer').show();
                $('.wrap_segmentation_option').hide()
                $('#dayUse_pembayaran_segment').attr('required', false)
			}
			else{
				$('#dayUse_jenis_pembayaran_option').hide();
				$('#dayUse_platform_pembayaran_id').removeAttr('required');
				$('#dayUse_pembayaran_transfer').hide();

                if (jenis_deposit == '5') {
                    $('.wrap_segmentation_option').show()
                    $('#dayUse_pembayaran_segment').attr('required', true)
                }else{
                    $('.wrap_segmentation_option').hide()
                    $('#dayUse_pembayaran_segment').attr('required', false)
                }
			}
		}

		//Set voucher ketika pilih pembayaran dayuse
		$('#dayUse_pembayaran_transfer_akunting_id').on('change', function(){
			let value = $(this).val();
			let voucher = $(this).find('option[value="'+value+'"]').attr('data-voucher');
			let nominal_transfer = parseInt($(this).find('option[value="'+value+'"]').attr('data-nominal'));
			let nominal_pembayaran = parseInt($('#dayUse_pembayaran_nominal').val());
			let metode_pembayaran = $('#dayUse_jenis_pembayaran').val();

			if(metode_pembayaran == 3){
				if(nominal_transfer != nominal_pembayaran){
					$('#dayUse_warning_pembayaran_transfer').html('Nominal transfer yang dipilih tidak sesuai dengan nominal pembayaran');
					$('#submit_pembayaran_dayUse').attr('disabled', 'disabled');
				}
				else{
					$('#dayUse_warning_pembayaran_transfer').html('');
					$('#submit_pembayaran_dayUse').removeAttr('disabled');
				}
			}

			$('#dayUse_voucher').val(voucher);
		})

		//Pilih Jenis Refund day use
		function setJenisRefundDayUse(){
			//1: Cash; 2: Credit Card; 3: Transfer;
			let jenis_deposit = $('#dayUse_refund_jenis_pembayaran').val();
			//Platform Pembayaran
			let option_pembayaran = `<option value="">** Select Payment Platform **</option>"`;

			//Reset Form Platform Pembayaran
			$('#dayUse_refund_platform_pembayaran_id').select2().val('').trigger('change');
			$('#dayUse_refund_transfer_akunting_id').select2().val('').trigger('change');

			console.log(jenis_deposit);

			//Show Platform pembayaran jika memilih jenis deposit
			if(['2','4'].includes(jenis_deposit)){
				$('#dayUse_refund_transfer').hide();
				$('#dayUse_refund_jenis_pembayaran_option').show();

				$.each(platform_pembayarans[jenis_deposit], function(key, platform){
					// console.log(val)
					option_pembayaran += `<option value="${platform.id}">${platform.nama}</option>`
				});

				$('#dayUse_refund_platform_pembayaran_id').html(option_pembayaran);
				$('#dayUse_refund_platform_pembayaran_id').attr('required', 'required');
				$('#dayUse_refund_platform_pembayaran_id').removeAttr('disabled');

			}
			else if(jenis_deposit == '3'){
				$('#dayUse_refund_jenis_pembayaran_option').hide();
				$('#dayUse_refund_platform_pembayaran_id').removeAttr('required');

				$('#dayUse_refund_transfer').show();
			}
			else{
				$('#dayUse_refund_jenis_pembayaran_option').hide();
				$('#dayUse_refund_platform_pembayaran_id').removeAttr('required');
				$('#dayUse_refund_transfer').hide();
			}
		}

		//Set voucher ketika pilih refund day use
		$('#dayUse_refund_transfer_akunting_id').on('change', function(){
			let value = $(this).val();
			let voucher = $(this).find('option[value="'+value+'"]').attr('data-voucher');
			let nominal_transfer = parseInt($(this).find('option[value="'+value+'"]').attr('data-nominal'));
			let nominal_refund = parseInt($('#dayUse_nominal_refund').val());
			let metode_pembayaran = $('#dayUse_refund_jenis_pembayaran').val();

			if(metode_pembayaran == 3){
				if(nominal_transfer != nominal_refund){
					$('#dayUse_warning_refund_transfer').html('Nominal transfer yang dipilih tidak sesuai dengan nominal refund ');
					$('#dayUse_btn_refund').attr('disabled', 'disabled');
				}
				else{
					$('#dayUse_warning_refund_transfer').html('');
					$('#dayUse_btn_refund').removeAttr('disabled');
				}
			}

			$('#dayUse_voucher_refund').val(voucher);
		})

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

        $('.daterange-single-wakeup').daterangepicker({
			singleDatePicker: true,
            minDate: "{{ date('d-m-Y', strtotime(getSystemDate())) }}",
            startDate: "{{ date('d-m-Y', strtotime(getSystemDate())) }}",
			locale: {
                format:'DD-MM-YYYY'
            }
        });

		//Sort Booking
		// $("#sort_booking").on('change', function(){
		// 	let sortby = $(this).val();
		// 	$.ajax({
		// 		type: 'POST',
		// 		url: "{{route('roomview.sort')}}",
		// 		data: {
		// 			_token:'{{csrf_token()}}',
		// 			sortby: sortby
		// 		},
		// 		success: function (response) {
		// 			let html = "";
		// 			$.each(response, function(index, val){
		// 				let option = "";
		// 				$.each(status_booking, function(k, v){
		// 					option += `<a href="#/" onclick="updateStatus(${val.hotel_id}, ${val.id}, ${k})" class="dropdown-item ${k == val.status_booking ? 'active' : ''}">${v}</a>`
		// 				});
		//
		// 				html += `<div class="list-group-item list-group-item-action d-flex justify-content-between">
		// 							<div>
		// 								<span class="font-weight-bold">${val.nama}</span> <br>
		// 								<span class="text-muted">${val.nomor_kamar} - ${val.jns_kamar}</span> <br>
		// 								<span class="${status_booking_color[val.status_booking]} font-weight-bold">
		// 									${status_booking[val.status_booking]}
		// 									&nbsp;
		// 									{!! \Auth::user()->role == 1 ? '<span class="badge badge-secondary">${val.hotel.nama}</span>' : '' !!}
		// 								</span>
		// 							</div>
		// 							<div class="dropdown">
		// 								<a href="#" data-toggle="dropdown">
		// 									<i class="icon-more"></i>
		// 								</a>
		// 								<div class="dropdown-menu dropdown-menu-right">
		// 								${option}
		// 								</div>
		// 							</div>
		// 						</div>`;
		// 			});
		//
		// 			$('#list_booking').html(html);
		// 		}
		// 	});
		// });

        // Checkbox group name
        $('#checkbox_group_name').on('change', function(){
            if ($(this).val()==1) {
                $(this).val(0)
            }else{
                $(this).val(1)
            }
        });

		//Filter Booking
		$('#filter_by').on('change', function(){
			let filterby = $(this).val();
			let tanggal = $('#tanggal').val();
			let nama = $('#search_nama').val();
            pagination_page = 1;
			filter(filterby, tanggal, nama);

            // Set session for filter by when refresh page
                sessionStorage.setItem("filter_by", filterby); // Set Item on Session Storage
            // Set session for filter by when refresh page
		});

		//Filter Booking
		$('#tanggal').on('change', function(){
			let tanggal = $(this).val();
			let filterby = $('#filter_by').val();
			let nama = $('#search_nama').val();
            pagination_page = 1;
			filter(filterby, tanggal, nama);
		});

		//Filter Guest Nama
		$('#search_nama').on('change', function(){
			let nama = $(this).val();
			let filterby = $('#filter_by').val();
			let tanggal = $('#tanggal').val();
            pagination_page = 1;
			filter(filterby, tanggal, nama);
		});

        // event enter function call
            var input1 = document.getElementById("search_nama");

            input1.addEventListener("keyup", function(event) {
                if (event.keyCode === 13) {
                    console.log('enter')
                    event.preventDefault();

                    let nama = $(this).val();
                    let filterby = $('#filter_by').val();
                    let tanggal = $('#tanggal').val();
                    pagination_page = 1;
                    filter(filterby, tanggal, nama);
                }
            });
        // event enter function call

        var pagination_page = 1;
        function paginationFunction(id,page) {
            event.preventDefault();
            $('.pagination li').removeClass('active');
            $(this).parent('li').addClass('active');

            let nama        = $('#search_nama').val();
            let filterby    = $('#filter_by').val();
            let tanggal     = $('#tanggal').val();


            if (page == 'next') {
                pagination_page += 1;
                filter(filterby, tanggal, nama);
            } else {
                pagination_page -= 1;
                filter(filterby, tanggal, nama);
            }

            $('#'+id).prop('disabled', true)
        }

		function filter(filterby, tanggal, nama){
            console.log(pagination_page)
            $('#list_booking').html(null); // reset

            var _loadhtml = ` <div class="row p-1">
                                <div class="col-md-12">
                                    <div class="alert alert-warning text-center mb-2" role="alert">
                                        <i class="icon-spinner2 spinner"></i> Loading data...
                                    </div>
                                </div>
                            </div>`;
            $('#list_booking').html(_loadhtml)

            // checkbox group name
            var chGroup                 = $('#checkbox_group_name').val();
            var condition_filter_name   = 0; //0:default guest room, 1:filter by name reservation

            // protect nama
            if (chGroup == 1) {
                condition_filter_name   = 1;
            }

			// var uri = $('#linkroomview').data('uri');
            var uri = $('#linkroomview').attr('href');
            var baseUrl = uri.split('?')[0]; // Get the base URL without parameters
            var newParams = `?f=${filterby}&t=${tanggal}&nama=${nama}`;
			// console.log(uri);
            $('#linkroomview').attr('href', baseUrl + newParams);

			$.ajax({
				type: 'GET',
				url: "{{route('roomview.filter')}}?page="+pagination_page,
				data: {
					_token:'{{csrf_token()}}',
					filterby: filterby,
					tanggal: tanggal,
					search_nama: nama,
                    condition_filter_name: condition_filter_name
				},
				success: function (response) {
					let html = "";
					let dropdown = "";
					var linkroomview = "{{url('bookings')}}"
                    let system_date = response.system_date;

                    // return false;

					// untuk menghitung EA, Departure, dan In House
					let expected_arrival = response.expected_arrival;
					let expected_departure = response.expected_departure;
					let departure = response.departure;
					let in_house = response.in_house;

					// console.log(response)
					if(response.booking_details.length > 0){
						// $.each(response.bookings, function(index, val){
							// Untuk menghitung EA, Departure, dan In House
							// if (val.status_booking == 4) {
							// 	expected_arrival++
							// }else if(val.status_booking == 2) {
							// 	departure++
							// }else if(val.status_booking == 1) {
							// 	in_house++
							// }

							if(response.booking_details.length > 0){
                                $.each(response.booking_details, function(index_kamar, val_kamar){
                                    if (val_kamar.array_sub == 0 || val_kamar.array_sub_extend_stay == 0) {
                                        if (val_kamar.extend_stay == 0){
                                            return;
                                        }

                                        // get total tagihan
                                        let balance_total   = val_kamar.nomor_kamar != null ? response.array_total_tagihan[val_kamar.booking_id][val_kamar.nomor_kamar] : response.array_total_tagihan[val_kamar.booking_id][""][val_kamar.room_index];
                                        let balance_total_checkout   = val_kamar.nomor_kamar != null ? response.array_total_tagihan_checkout[val_kamar.booking_id][val_kamar.nomor_kamar] : response.array_total_tagihan_checkout[val_kamar.booking_id][""][val_kamar.room_index];
                                        let balance_total_dayuse   = val_kamar.nomor_kamar != null ? response.array_total_dayuse[val_kamar.booking_id][val_kamar.nomor_kamar] : response.array_total_dayuse[val_kamar.booking_id][""][val_kamar.room_index];
                                        let balance_total_room   = val_kamar.nomor_kamar != null ? response.array_total_totalroom[val_kamar.booking_id][val_kamar.nomor_kamar] : response.array_total_totalroom[val_kamar.booking_id][""][val_kamar.room_index];
                                        console.log(balance_total+" - "+balance_total_checkout+" - "+balance_total_dayuse+" - "+balance_total_room)
                                        // console.log(val_kamar.nomor_kamar, val_kamar.booking_id, val_kamar.room_index)


										// GET INVOICE
										// let getinvoice      = val_kamar.nomor_kamar != null ? response.invoice_array[val_kamar.booking_id][val_kamar.nomor_kamar] : response.invoice_array[val_kamar.booking_id][""][val_kamar.room_index];

										if (val_kamar.nomor_kamar != null) {
											// var getinvoice = response.invoice_array[val_kamar.booking_id][val_kamar.nomor_kamar]
										} else {
                                            // var getinvoice = response.invoice_array[val_kamar.booking_id][''][val_kamar.room_index] ?? false;

                                            // if (!val_kamar.guestbill_noinvoice) {
                                            //     val_kamar.guestbill_noinvoice = undefined
                                            // }
											// if ([val_kamar.no_kamar]) {
											// }else {
											// 	var getinvoice = response.invoice_array[val_kamar.booking_id][""][val_kamar.room_index]
											// }
										}
										// console.log(getinvoice);
                                        // $.ajax({
                                        //     type: "get",
                                        //     url: "{{ route('get.totaltagihan') }}",
                                        //     data: {
                                        //         booking     : val_kamar.booking_id,
                                        //         room_index  : val_kamar.room_index,
                                        //         nomor_kamar : val_kamar.nomor_kamar
                                        //     },
                                        //     dataType: "json",
                                        //     success: function (response) {
                                        //         balance_total = response;
                                        //     }
                                        // });

                                        //var for total
                                        let nominalpembayaran = 0;
                                        let nominalrefund = 0;
                                        let nominaltransaksishop = 0;
                                        let nominal_total  = 0;


                                        var option = "";

                                        $.each(status_booking, function(k, v){
                                            if (val_kamar.nomor_kamar == null) {
                                                if (val_kamar.status_booking == 13) {
                                                    if([4].includes(parseInt(k))){
                                                        option += `<a href="#/"
                                                                onclick="updateStatus(${val_kamar.booking.hotel_id}, ${val_kamar.booking.id}, ${k},  ${val_kamar.id})"
                                                                class="dropdown-item"
                                                                >${v}</a>`
                                                    }
                                                }else {
                                                    if(![5,9,10,11,12,2].includes(parseInt(k))){
                                                        if(k == 13){
                                                            if (permission == 0) {
                                                            // if (val.segmentasi_rate_code != 7) {
                                                                option += `<a href="#/"
                                                                                data-toggle="modal"
                                                                                data-target="#modal_status_confirm_cancel"
                                                                                data-id_booking="${val_kamar.booking.id}"
                                                                                data-hotel_id="${val_kamar.booking.hotel_id}"
                                                                                data-detail_id="${val_kamar.id}"
                                                                                class="dropdown-item ${k == val_kamar.status_booking ? 'active' : ''} statusbutton"
                                                                                style="${k == val_kamar.status_booking ? 'display: none' : ''}"
                                                                                disabled>
                                                                                Cancel Reservation
                                                                            </a>`
                                                            }
                                                            return;
                                                            // ${val_kamar.booking.segmentasi_rate_code == 7 ? 'pointer-events: none;' : ''}
                                                            // } else {
                                                            //     return;
                                                            // }
                                                        }

                                                        option += `<a href="#/"
                                                                    onclick='alertStatus( ${val_kamar.booking.id}, "${val_kamar.jns_kamar}", ${val_kamar.array_index})'
                                                                    class="dropdown-item ${k != val_kamar.status_booking ? 'bg-warning' : ''}"
                                                                    style="${k == val_kamar.status_booking ? 'display: none' : ''}"
                                                                   >${v}</a>`
                                                        // option += `<a href="#/"
                                                        //             onclick='alertStatus( ${val_kamar.booking.id}, "${val_kamar.jns_kamar}", ${val_kamar.array_index})'
                                                        //             class="dropdown-item ${k != val_kamar.status_booking ? 'bg-warning' : ''}"
                                                        //             style="${k == val_kamar.status_booking ? 'display: none' : ''}"
                                                        //             data-target="#alertStatusModal"
                                                        //             data-toggle="modal">${v}</a>`
                                                        return;
                                                    }
                                                }
                                            }else if(val_kamar.nomor_kamar){

                                                if(![5,9,10,11,12].includes(parseInt(k))){

                                                    if (val_kamar.status_booking == 1) {
                                                        var value = val_kamar.booking;

                                                        if (k == 2) {
                                                            if (balance_total_checkout < 0 || balance_total_dayuse < 0) {
                                                                option += `<a href="#checkout_refundmodal"
                                                                    id="btn_checkout_refundmodal"
                                                                    class="btn-tooltip btn_checkout_refundmodal dropdown-item"
                                                                    data-target="#checkout_refundmodal"
                                                                    data-toggle="modal"
                                                                    onclick='ClickBtnRefundCheckout(${val_kamar.booking.id},${balance_total_checkout},"${val_kamar.booking.nama}", ${val_kamar.booking.id}, ${val_kamar.room_index})'
                                                                    title="Refund">
                                                                        <i class="text-orange fas fa-receipt"></i>
                                                                        Checkout + Refund
                                                                    </a>`;

                                                                // day use refund
                                                                if (balance_total_dayuse < 0 && moment(val_kamar.start_date).format('YYYY-MM-DD') == "{{getSystemDate()}}") {
                                                                    option += `<a 	data-target="#dayUse_refundModal"
                                                                                    data-toggle="modal"
                                                                                    class="btn-tooltip dropdown-item"
                                                                                    onclick='ClickBtnRefundDayUse(${val_kamar.booking.id},${balance_total_dayuse},"${val_kamar.booking.nama}", ${val_kamar.booking.id}, ${val_kamar.room_index})''
                                                                                    title="Day Use (Refund)"
                                                                                >
                                                                                    <i class="text-orange fas fa-receipt"></i>
                                                                                    Day Use + Refund
                                                                                </a>`
                                                                }

                                                                if (balance_total_room == 0){
                                                                    option +=   `<a href="#checkout_pembayaranmodal"
                                                                                    id="btn_checkout_pembayaranmodal"
                                                                                    class="btn-tooltip btn_checkout_pembayaranmodal dropdown-item"
                                                                                    data-target="#checkout_pembayaranmodal"
                                                                                    data-toggle="modal"
                                                                                    onclick="ClickBtnPembayaranCheckout(${val_kamar.booking.id},${balance_total_checkout},'${val_kamar.booking.nama}', ${val_kamar.booking.id}, ${val_kamar.room_index}, ${true})"
                                                                                    title="Payment">
                                                                                        <i class="text-grey fas fa-wallet"></i>
                                                                                        {{-- Checkout + Pelunasan --}}
                                                                                        Checkout + Preview
                                                                                </a>`
                                                                    if (balance_total_room == 0 && moment(val_kamar.start_date).format('YYYY-MM-DD') == "{{getSystemDate()}}"){
                                                                        // {{-- day use pelunasan --}}
                                                                        option += `
                                                                            <a data-target="#dayUse_pembayaranModal"
                                                                                data-toggle="modal"
                                                                                class="btn-tooltip dropdown-item"
                                                                                onclick="ClickBtnPembayaranDayUse(${val_kamar.booking.id},${balance_total_dayuse},'${val_kamar.booking.nama}', ${val_kamar.booking.id}, ${val_kamar.room_index}, ${true})"
                                                                                title="Day Use (Payment)"
                                                                            >
                                                                                <i class="text-grey fas fa-wallet"></i>
                                                                                {{-- Day Use + Pelunasan --}}
                                                                                Day Use + Preview
                                                                            </a>
                                                                        `
                                                                    }
                                                                }
                                                                return;
                                                            }
                                                            else if (balance_total_checkout > 0 || balance_total_dayuse > 0){
                                                                option += `<a href="#checkout_pembayaranmodal"
                                                                    id="btn_checkout_pembayaranmodal"
                                                                    class="btn-tooltip btn_checkout_pembayaranmodal dropdown-item"
                                                                    data-target="#checkout_pembayaranmodal"
                                                                    data-toggle="modal"
                                                                    onclick='ClickBtnPembayaranCheckout(${val_kamar.booking.id},${balance_total_checkout},"${val_kamar.booking.nama}", ${val_kamar.booking.id}, ${val_kamar.room_index})'
                                                                    title="Payment">
                                                                        <i class="text-grey fas fa-wallet"></i>
                                                                        Checkout + Acquittance
                                                                    </a>`;

                                                                if (balance_total_dayuse > 0 && moment(val_kamar.start_date).format('YYYY-MM-DD') == "{{getSystemDate()}}") {
                                                                    option += `<a data-target="#dayUse_pembayaranModal"
                                                                                    data-toggle="modal"
                                                                                    class="btn-tooltip dropdown-item"
                                                                                    onclick='ClickBtnPembayaranDayUse(${val_kamar.booking.id},${balance_total_dayuse},"${val_kamar.booking.nama}", ${val_kamar.booking.id}, ${val_kamar.room_index})'
                                                                                    title="Day Use (Payment)"
                                                                                >
                                                                                    <i class="text-grey fas fa-wallet"></i>
                                                                                    Day Use + Acquittance
                                                                                </a>`
                                                                }else if(balance_total_checkout == 0){
                                                                    // Early Checkout
                                                                        option +=   `<a href="#checkout_pembayaranmodal"
                                                                                    id="btn_checkout_pembayaranmodal"
                                                                                    class="btn-tooltip btn_checkout_pembayaranmodal dropdown-item"
                                                                                    data-target="#checkout_pembayaranmodal"
                                                                                    data-toggle="modal"
                                                                                    onclick="ClickBtnPembayaranCheckout(${val_kamar.booking.id},${balance_total_checkout},'${val_kamar.booking.nama}', ${val_kamar.booking.id}, ${val_kamar.room_index}, ${true})"
                                                                                    title="Payment">
                                                                                        <i class="text-grey fas fa-wallet"></i>
                                                                                        Checkout + Preview
                                                                                </a>`
                                                                };
                                                                return;
                                                            }
                                                        }

                                                        // if (k == 4) {
                                                        //     if (val_kamar.extend_stays.length != 0) {
                                                        //         $continue = false;
                                                        //         if (val_kamar.extend_stays.length == 1) {
                                                        //             $.each(val_kamar.extend_stays, function(index, extend_stay){
                                                        //                 if (extend_stay.end_date != moment(val.end_date).format('YYYY-MM-DD')){
                                                        //                     $continue = true;
                                                        //                 }
                                                        //             })
                                                        //         }
                                                        //         if ($continue) {
                                                        //             return;
                                                        //         }
                                                        //     }
                                                        // }

                                                        if(k == 13 || k == 1){
                                                            return;
                                                        }
                                                    }

                                                    if (val_kamar.status_booking == 4) {
                                                        if(![5,9,10,11,12,2].includes(parseInt(k))){
                                                            if (val_kamar?.kamar_status == 'VD' && k == 1) {
                                                                option += `<a href="#/"
                                                                onclick="updateStatus(${val_kamar.booking.hotel_id}, ${val_kamar.booking.id}, ${k}, ${val_kamar.id})"
                                                                class="dropdown-item ${k == val_kamar.status_booking ? 'active' : ''} bg-danger"
                                                                style="${k == val_kamar.status_booking ? 'display: none' : ''}; pointer-events: none;"
                                                                ${k == val_kamar.status_booking ? 'disabled' : ''}
                                                                >Room status is "VD", cannot checkin!</a>`
                                                            }
                                                            // else if( !val_kamar?.kamar_status && k == 1){
                                                            else if( ['OD','OC'].includes(val_kamar?.kamar_status) && k == 1){
                                                                option += `<a href="#/"
                                                                onclick="updateStatus(${val_kamar.booking.hotel_id}, ${val_kamar.booking.id}, ${k}, ${val_kamar.id})"
                                                                class="dropdown-item ${k == val_kamar.status_booking ? 'active' : ''} bg-danger"
                                                                style="${k == val_kamar.status_booking ? 'display: none' : ''}; pointer-events: none;"
                                                                ${k == val_kamar.status_booking ? 'disabled' : ''}
                                                                >Room still occupied, cannot checkin!</a>`
                                                            }else if($.inArray(['OOO','OS'], val_kamar?.kamar_status) > -1 && k == 1){
                                                                option += `<a href="#/"
                                                                onclick="updateStatus(${val_kamar.booking.hotel_id}, ${val_kamar.booking.id}, ${k}, ${val_kamar.id})"
                                                                class="dropdown-item ${k == val_kamar.status_booking ? 'active' : ''} bg-danger"
                                                                style="${k == val_kamar.status_booking ? 'display: none' : ''}; pointer-events: none;"
                                                                ${k == val_kamar.status_booking ? 'disabled' : ''}
                                                                >Room Status is, cannot checkin!</a>`
                                                            }
                                                            else if(k == 13){
                                                                // if (val.segmentasi_rate_code != 7) {
                                                                    if (permission == 0) {
                                                                    option += `<a href="#/"
                                                                                    data-toggle="modal"
                                                                                    data-target="#modal_status_confirm_cancel"
                                                                                    data-id_booking="${val_kamar.booking.id}"
                                                                                    data-hotel_id="${val_kamar.booking.hotel_id}"
                                                                                    data-detail_id="${val_kamar.id}"
                                                                                    class="dropdown-item ${k == val_kamar.status_booking ? 'active' : ''} statusbutton"
                                                                                    style="${k == val_kamar.status_booking ? 'display: none' : ''}"
                                                                                    disabled>
                                                                                    Cancel Reservation
                                                                                </a>`
                                                                    }
                                                                // } else {
                                                                //     return;
                                                                // ${val_kamar.booking.segmentasi_rate_code == 7 ? 'pointer-events: none;' : ''}
                                                                // }
                                                            }
                                                            else {
                                                                option += `<a href="#/"
                                                                onclick="updateStatus(${val_kamar.booking.hotel_id}, ${val_kamar.booking.id}, ${k},  ${val_kamar.id})"
                                                                class="dropdown-item ${k == val_kamar.status_booking ? 'active' : ''}"
                                                                style="${k == val_kamar.status_booking ? 'display: none;' : ''}${moment("{{getSystemDate()}}", "YYYY-MM-DD").isBefore(moment(val_kamar.start_date, "YYYY-MM-DD")) && k == 1 ? 'display: none;' : ''}"
                                                                ${k == val_kamar.status_booking ? 'disabled' : ''}
                                                                >${v}</a>`
                                                            }
                                                            return;
                                                        }
                                                    }else if(val_kamar.status_booking == 2) {
                                                        if(![5,9,10,11,12,2,1,4,13].includes(parseInt(k))){
                                                            option += `<a href="#/"
                                                                    onclick="updateStatus(${val_kamar.booking.hotel_id}, ${val_kamar.booking.id}, ${k},  ${val_kamar.id})"
                                                                    class="dropdown-item ${k != val_kamar.status_booking ? 'active' : ''}"
                                                                    style="${k == val_kamar.status_booking ? 'display: none' : ''}"
                                                                    ${k == val_kamar.status_booking ? 'disabled' : ''}
                                                                    >${v}</a>`
                                                        }
                                                    }else if(val_kamar.status_booking == 1){
                                                        // define variable for check condition
                                                        let check_extend_stay = false;
                                                        let check_transaksi = false;
                                                        let check_segmentasi = false;
                                                        let check_lebih_dari_date_system = false;
                                                        let check_available_bills = false;

                                                        // check Available Bill
                                                            $.ajax({
                                                                async: false,
                                                                type : 'get',
                                                                url : "{{ url('get-available-bills') }}/"+val_kamar.id,
                                                                success: function (response) {
                                                                    check_available_bills = response
                                                                }
                                                            })
                                                        // check Available Bill

                                                        if (k == 4){
                                                            // check extend stay
                                                                // if (val_kamar.extend_stays.length != 0) {
                                                                //     if (val_kamar.extend_stays.length == 1) {
                                                                //         $.each(val_kamar.extend_stays, function(index, extend_stay){
                                                                //             if (extend_stay.end_date != moment(val_kamar?.end_date).format('YYYY-MM-DD')){
                                                                //                 check_extend_stay = true;
                                                                //             }
                                                                //         })
                                                                //     }
                                                                // }
                                                            // closing check extend stay

                                                            // check transaksi
                                                                // $.each(val_kamar?.booking?.deposits, function(k, deposit){
                                                                //     if (deposit.jenis_transaksi == 1) {
                                                                //         check_transaksi = true;
                                                                //     }
                                                                // })

																// if (getinvoice != undefined) {

																// 	$.each(getinvoice.shop_transaction, function(k, shop_transaction){
																// 		if (shop_transaction.jenis_transaksi == 1) {
																// 			check_transaksi = true;
																// 		}
																// 	})
																// }
                                                            // closing check transaksi

                                                            // check segmentasi
                                                                if (val_kamar.booking.segmentasi_rate_code == 7) {
                                                                    check_segmentasi = true;
                                                                }
                                                            // closing check segmentasi

                                                            // check lebih dari date system
                                                                if (moment("{{getSystemDate()}}", "YYYY-MM-DD").isAfter(moment(val_kamar.start_date, "YYYY-MM-DD"))) {
                                                                    check_lebih_dari_date_system = true;
                                                                }
                                                            // closing check lebih dari date system

                                                            // if (moment("{{getSystemDate()}}", "YYYY-MM-DD").isAfter(moment(val.start_date, "YYYY-MM-DD")) || val.segmentasi_rate_code == 7) {
                                                            //     return;
                                                            // }
                                                        }

                                                        option += `<a href="#/"
                                                                    onclick="updateStatus(${val_kamar?.booking?.hotel_id}, ${val_kamar?.booking?.id}, ${k},  ${val_kamar.id})"
                                                                    class="dropdown-item ${k == val_kamar.status_booking ? 'active' : ''}"
                                                                    style="${(k == 4 &&( check_extend_stay || check_lebih_dari_date_system || check_available_bills)) ? 'display:none;' : ''}"
                                                                    ${k == val_kamar.status_booking ? 'disabled' : ''}
                                                                    >${k == 4 ? 'Cancel Check In' : v}</a>`
                                                    }else if(val_kamar.status_booking == 13){
                                                        if([4].includes(parseInt(k))){
                                                            option += `<a href="#/"
                                                                    onclick="updateStatus(${val_kamar.booking.hotel_id}, ${val_kamar.booking.id}, ${k},  ${val_kamar.id})"
                                                                    class="dropdown-item"
                                                                    >${v}</a>`
                                                        }
                                                    }else{
                                                        // if (k == 4){
                                                        //     if (moment("{{getSystemDate()}}", "YYYY-MM-DD").isAfter(moment(val.start_date, "YYYY-MM-DD")) || val.segmentasi_rate_code == 7) {
                                                        //         return;
                                                        //     }
                                                        // }

                                                        option += `<a href="#/"
                                                                    onclick="updateStatus(${val_kamar?.booking?.hotel_id}, ${val_kamar?.booking?.id}, ${k})"
                                                                    class="dropdown-item ${k == val_kamar.status_booking ? 'active' : ''}"
                                                                    style="${k == val_kamar.status_booking ? 'display: none' : ''}"
                                                                    ${k == val_kamar.status_booking ? 'disabled' : ''}
                                                                    >${v}</a>`
                                                    }

                                                }

                                            }

                                        });

                                        if(val_kamar.status_booking == 1){
                                            if (val_kamar.checkcountbooking > 1) {
                                                option += `<a href="#checkoutgroup"
                                                            id="checkoutgroup"
                                                            class="btn-tooltip dropdown-item"
                                                            onclick="checkoutgroup(${val_kamar.booking_id})"
                                                            title="Checked out group">
                                                                <i class="text-orange fas fa-receipt"></i>
                                                                Checkout this group booking.
                                                        </a>`
                                            }
                                        }

                                        if(val_kamar.status_booking == 2){
                                            option += 	`
                                                            <a href="#/" onclick="updateStatus(${val_kamar.booking.hotel_id}, ${val_kamar.booking.id}, 1,  ${val_kamar.id})" class="dropdown-item">Cancel Checkout</a>
                                                            <a class="dropdown-item" href="{{url('rv_downloadkwitansi')}}/${val_kamar?.booking?.id}" target="_blank">Print Receipts</a>
                                                            <a class="dropdown-item" href="{{url('print-invoice')}}/${val_kamar.guestbill_id}" target="_blank">Print Bill</a>
                                                        `
                                        }else if(val_kamar.status_booking == 1 && balance_total == 0 && val_kamar.jumlah_malam != 0 && moment(val_kamar.start_date).format('YYYY-MM-DD') == "{{getSystemDate()}}"){
                                            option += `<a 	class="dropdown-item"
                                                            onclick="dayUse(${val_kamar.booking.hotel_id}, ${val_kamar.booking.id}, ${val_kamar.id})">Day Use + CO</a>

                                                        `
                                        }

                                        // Guest Bill
                                        if (val_kamar.nomor_kamar) {
											// console.log('---------------')
                                            if ([10,11].includes(parseInt(val_kamar.booking.segmentasi_rate_code))) {
                                                if( [10,11].includes(parseInt(val_kamar.booking.segmentasi_rate_code))){
                                                }else{
													if (val_kamar.guestbill_noinvoice) {
														// val_kamar.guestbill_noinvoice = '-'
													} else {
														val_kamar.guestbill_noinvoice = '-';
													}
                                                }
                                            }
                                        }


										// cek invoice apakah string
										if (val_kamar.guestbill_id) {
											option += `<a class="dropdown-item" href="{{url('invoice-draft')}}/${val_kamar.guestbill_id}"><i class="fas fa-file-invoice-dollar"></i>Bill Number: ${val_kamar.guestbill_noinvoice}</a>`
										} else {
											option += `<a class="dropdown-item" href="#" target="_blank">Data Mismatch, Contact Admin</a>`
										}

                                        // Log File
                                        option += `<a class="dropdown-item"
                                                        data-target="#log_file_modal"
                                                        data-toggle="modal"
                                                        onclick='logFile(${val_kamar.booking.id}, null, ${val_kamar.room_index}), guestName("${val_kamar.booking.nama}")'
                                                        title="Log File"
                                                    >
                                                        Log File
                                                    </a>`

                                        // Remarks
                                        option += `<a class="dropdown-item"
                                                        data-target="#info_remark_modal"
                                                        data-toggle="modal"
                                                        onclick='infoRemark(${val_kamar.booking.id}), guestName("${val_kamar.booking.nama}")'
                                                        title="Remarks"
                                                    >
                                                        Remarks
                                                    </a>`

                                        // Room Revenue
                                        option += `<a class="dropdown-item"
                                                        data-target="#room_revenue_modal"
                                                        data-toggle="modal"
                                                        onclick="roomRevenue(${val_kamar.id}), guestName('${val_kamar.booking.nama}')"
                                                        title="Room Revenue"
                                                    >
                                                        Room Revenue
                                                    </a>
                                                    `

                                        // Incognito Change
                                        option += `<a class="dropdown-item"
                                                        data-target="#incognito_change_modal"
                                                        data-toggle="modal"
                                                        onclick="openModalIncognito(${val_kamar.id}, ${val_kamar.incognito})"
                                                        title="change incognito status"
                                                    >
                                                        ${val_kamar.incognito == 1 ? 'Remove Incognito' : 'Incognito'}
                                                    </a>`

                                        // Group check in by group name
                                        if ( val_kamar.booking.group_name != null && val_kamar.status_booking == 4) {
                                            option += `<a class="dropdown-item"
                                                            data-target="#group_checkin_modal"
                                                            data-toggle="modal"
                                                            onclick="openModalGroupCheckin('${val_kamar?.booking?.group_name}', 1, ${val_kamar.id})"
                                                            title="Group Check In"
                                                        >
                                                          Group Check In - group (${val_kamar?.booking?.group_name})
                                                        </a>`
                                        }

                                        // Group check in by group name
                                        if ( val_kamar.booking.kode_booking && val_kamar.status_booking == 4) {
                                            option += `<a class="dropdown-item"
                                                            data-target="#group_checkin_modal"
                                                            data-toggle="modal"
                                                            onclick="openModalGroupCheckin(${val_kamar?.booking?.kode_booking}, 2, ${val_kamar.id})"
                                                            title="Group Check In"
                                                        >
                                                          Group Check In - number reservation (${val_kamar?.booking?.kode_booking})
                                                        </a>`
                                        }

                                        // PRINT RC BY GROUP href="{{url('rv_printrc')}}/${val_kamar.booking.id}
                                        option += `<a class="dropdown-item"
                                                        href="{{url('rv_printrc_group')}}/${val_kamar.booking_id}"
                                                        title="Print RC Group - Reservation Number"
                                                        target="_blank"
                                                    ><i class="icon-printer2 mr-1"></i>
                                                    Print RC Group - Reservation Number (${val_kamar?.booking?.kode_booking})
                                                    </a>`

                                        // {{-- Modal Browse Color --}}
                                        // option += `<a class="dropdown-item"
                                        //                 data-target="#room_revenue_modal"
                                        //                 data-toggle="modal"
                                        //                 title="About Browse Color"
                                        //             >
                                        //                 About Browse Color
                                        //             </a>`

                                        // {{-- Modal Confirmation Letter --}}
                                        option += `{{-- Print Confirmation Letter --}}
                                                    <a class="dropdown-item"
                                                        target="_blank"
                                                        href="{{url('roomview/confirmation-letter/')}}/${val_kamar.booking.id}"
                                                        title="Confirmation Letter"
                                                    >
                                                        Confirmation Letter
                                                    </a>`


                                        if(val_kamar){
                                            dropdown = `<div class="dropdown">
                                                            <a href="#" data-toggle="dropdown">
                                                                <i class="icon-more"></i>
                                                            </a>
                                                            <div class="dropdown-menu dropdown-menu-right">
                                                            ${option}
                                                            </div>
                                                        </div>`
                                        }
                                        else{
                                            dropdown = "";
                                        }

                                        let ID_currency = balance_total_room.toLocaleString('en-US')

                                        $biaya_html = `<span class="badge badge-secondary">Rp ${ID_currency}</span>`

                                        // define variable html arrangement with string empty
                                        let html_arrangement = '';

                                        // check if any arrangement codes
                                        if (val_kamar.arrangement_codes) {
                                            html_arrangement += `<span class="badge badge-info">${val_kamar.arrangement_codes}</span>`
                                        }

                                        // console.log(val_kamar.extend_stays.length)
                                        // if (val_kamar.extend_stays.length != 0) {
                                        //     if (val_kamar.extend_stays.length > 1) {
                                        //         // console.log('oi')
                                        //         $status_booking_color = 1;
                                        //         $status_booking = 'In House';
                                        //     } else {
                                        //         $.each(val_kamar.extend_stays, function(index, extend_stay){
                                        //             // console.log(extend_stay.end_date, moment(val.end_date).format('YYYY-MM-DD'))
                                        //             if (extend_stay.end_date != moment(val_kamar.end_date).format('YYYY-MM-DD')){
                                        //                 $status_booking_color = 2;
                                        //                 $status_booking = 'Checked Out'
                                        //                 return
                                        //             } else{
                                        //                 $status_booking_color = 1;
                                        //                 $status_booking = 'in House'
                                        //                 return
                                        //             }
                                        //         })
                                        //     }
                                        // } else {
                                            $status_booking_color = 1;
                                            $status_booking = 'In House'
                                        // }

                                        // Define variable checkin and checkout with string empty
                                        let checkin = ''
                                        let checkout = ''

                                        // check day use
                                        if (val_kamar.checkin) {
                                            checkin = moment(val_kamar.checkin, "YYYY-MM-DD").format('YYYY-MM-DD');
                                        } else {
                                            checkin = moment(val_kamar.start_date, "YYYY-MM-DD").format('YYYY-MM-DD');
                                        }

                                        if (val_kamar.checkout) {
                                            checkout = moment(val_kamar.checkout, "YYYY-MM-DD").format('YYYY-MM-DD');
                                        }else{
                                            checkout = moment(val_kamar.end_date, "YYYY-MM-DD").format('YYYY-MM-DD');
                                        }

                                        // call custom segment
                                        let segment =  {!! json_encode(config('custom.segment_ratecodes')) !!};
                                        let source =  {!! json_encode(config('custom.source')) !!};

                                        let color_card = '';
                                        // ambil class css
                                        if (val_kamar.status_booking == 13) {
                                            color_card = 'canceled';
                                        }else{
                                            if ( val_kamar.jumlah_malam > 7) {
                                                color_card = 'longstay';
                                            }else if ( val_kamar.jumlah_malam < 1) {
                                                color_card = 'dayuse';
                                            }
                                        }

                                        var html_ota_cancel = '';
                                        if(val_kamar?.booking?.status_ota){
                                            html_ota_cancel = `<i class="icon-alert text-danger btn-tooltip"  title="Cancelled reservation from OTA"></i>`
                                            color_card = 'canceled';
                                        }

                                        html += `<div class="list-group-item list-group-item-action d-flex justify-content-between ${color_card} ">
                                                    <div>
                                                        <span class="font-weight-bold">
                                                            ${moment(val_kamar?.booking?.guest_profile?.birth_date,'YYYY-MM-DD').format('MM-DD') == system_date ? '<i class="fas fa-birthday-cake"></i>' : ''}
                                                            ${val_kamar.incognito == 1 ?  '<i class="fas fa-user-secret"></i>' : ''}
                                                            ${val_kamar?.booking?.reservation_deposit.length > 0 && val_kamar.booking.check_status_reservation.length < 1 && val_kamar.status_booking == 4 && val_kamar.room_index == 1 ?  '<i class="icon-cash"></i>' : ''}
                                                            <a href="${linkroomview+'/'+val_kamar.booking.id+'/edit'}" target="_blank">${val_kamar.guest_room ? val_kamar.guest_room : val_kamar.booking.nama }</a>
                                                            ${val_kamar.incognito == 1 ?  '(Incognito)' : ''}
                                                            <span class="font-weight-semibold"> - ${ ![2,3,4,5,6,8,9].includes(parseInt(val_kamar.booking.segmentasi_rate_code)) ? segment[val_kamar.booking.segmentasi_rate_code] : val_kamar?.booking?.company?.name }  <a href="#" onclick="showStatsGroup('${val_kamar.booking.group_name}')">${val_kamar.booking.group_name ? '('+val_kamar.booking.group_name+')' : ''}</a> </span>
                                                            ${html_ota_cancel}
                                                            <a href="#"
                                                                class="text-info btn-tooltip"
                                                                onclick="showModalDetailReservation(${val_kamar.booking_id}, ${val_kamar.id})"
                                                                title="Detail Reservation"><i class="icon icon-info22"></i>
                                                            </a>
                                                            ${val_kamar.expected_arrival !== null && val_kamar.status_booking != 1 && val_kamar.status_booking != 2 ? '&nbsp;<span class="badge badge-danger font-weight-bold">Expected arrival: '+moment(val_kamar.expected_arrival, 'YYYY-MM-DD hh:mm:ss').format('hh:mm:ss')+'</span>' : ''}
                                                        </span> <br>
                                                        <span class="">${val_kamar.booking.kode_booking }</span> <span class="text-dark">(${source[val_kamar.booking.source]})</span> <br>
                                                        <span class="">${ response?.current_room[val_kamar.booking_id][val_kamar.room_index] ?? 'No Room' } - ${val_kamar.jns_kamar} (${val_kamar?.pax} Pax)</span>
                                                        ${val_kamar.block_kamar == 1 ? '<i class="icon-lock text-danger"></i>' : ''}
                                                        <br>
                                                        <span class="text-success"><i class="icon-enter2"></i>&nbsp;${ moment(checkin, "YYYY-MM-DD").format('DD-MM-YYYY')} - </span>
                                                        <span class="text-danger"><i class="icon-exit2"></i>&nbsp;${ moment(checkout, "YYYY-MM-DD").format('DD-MM-YYYY')}</span> <br>
                                                        <span class="font-weight-bold">
                                                            <span class="mr-1 ${([1].includes(parseInt(val_kamar.status_booking))) ? status_booking_color[$status_booking_color] : status_booking_color[val_kamar.status_booking]}">
                                                            ${([1].includes(parseInt(val_kamar.status_booking))) ? $status_booking : status_booking[val_kamar.status_booking] }
                                                            </span>
                                                            ${$biaya_html}
                                                            ${html_arrangement}
                                                        </span>
                                                    </div>
                                                    ${dropdown}
                                                </div>`;

                                                // =================================    PRINT RC AND DEPOSIT   =========================

                                                // define variable with empty string
                                                let reservation_deposit_button = '';

                                                // Check if any reservation deposit
                                                // // if (val.reservation_deposit) {
                                                //     reservation_deposit_button += `<div class="col-md-6">
                                                //                                     <button class="btn ${val_kamar.checkin ? 'btn-success' : 'btn-danger'} btn-sm"
                                                //                                         data-target="#reservation_deposit_info_modal"
                                                //                                         data-toggle="modal"
                                                //                                         onclick='reservationDepositInfo(${val_kamar?.booking_id}, ${val_kamar?.booking?.reservation_deposit?.length ?? 0}, "${ val_kamar.booking.kode_booking }", "${val_kamar.room_index}"), guestName("${ val_kamar.booking.nama }")'
                                                //                                         title="Reservation Deposit Info"
                                                //                                         style="width: 100%;height: 24px;padding:0;">
                                                //                                         <i class="fa fa-file-invoice-dollar"></i> Deposit Info
                                                //                                     </button>
                                                //                                 </div>`
                                                // // }

                                                if (val_kamar) {
                                                    html += `<div class="mb-1 row">
                                                                <div class="col-md-12">
                                                                    <a class="btn btn-success btn-sm" href="{{url('rv_printrc')}}/${val_kamar.id}"
                                                                        target="_blank"
                                                                        style="width: 100%;height: 24px;padding:0;">
                                                                        <i class="icon-printer2 mr-1"></i>
                                                                        Print RC
                                                                    </a>
                                                                </div>

                                                                ${reservation_deposit_button}
                                                            </div>`;
                                                }

                                                // =================================    PRINT RC AND DEPOSIT   =========================
                                    }
                                });
							}

						// });
					}
					else{
						html += `<div class="row p-1">
									<div class="col-md-12">
										<div class="alert alert-danger text-center mb-2" role="alert">
											Data Tidak Ada
										</div>
									</div>
								</div>`
					}

					let countFilter = '';

					if (filterby == 4 || filterby == 0) {
						countFilter += 	`<div class="row mt-1 col-lg-12" id="container-expected_arrival">
												<div class="col-lg-6">
													Expected Arrival
												</div>
												<div class="col-lg-6">
													: <span id="#expected_arrival">${expected_arrival}</span>
												</div>
											</div>`
					}

                    if (filterby == 5 || filterby == 0) {
						countFilter += 	`<div class="row mt-1 col-lg-12" id="container-expected_departure">
												<div class="col-lg-6">
													Expected Departure
												</div>
												<div class="col-lg-6">
													: <span id="#expected_departure">${expected_departure}</span>
												</div>
											</div>`
					}

					if (filterby == 2 || filterby == 0) {
						countFilter += 	`<div class="row mt-1 col-lg-12" id="container-departure">
												<div class="col-lg-6">
													Departure
												</div>
												<div class="col-lg-6">
													: <span id="departure">${departure}</span>
												</div>
											</div>`
					}
					if (filterby == 1 || filterby == 0) {
						countFilter += 	`<div class="row mt-1 col-lg-12" id="container-in_house">
												<div class="col-lg-6">
													In House
												</div>
												<div class="col-lg-6">
													: <span id="in_house">${in_house}</span>
												</div>
											</div>`
					}

					$('#list_booking').html(html);
					$('#container-count').html(countFilter)


                    $('#this_page_current').html(response.this_page+'/'+response.total_page)

                        if (response.last_page) {
                            $('#button_page_next').prop('disabled',true).addClass('text-muted')
                        }else{
                            $('#button_page_next').prop('disabled',false).removeClass('text-muted')
                        }

                        if (response.this_page == 1) {
                            $('#button_page_prev').prop('disabled',true).addClass('text-muted')
                        } else {
                            $('#button_page_prev').prop('disabled',false).removeClass('text-muted')
                        }
				}
			});
            $("#search_nama").blur();
		}

		//Komponen Tooltip
  		$(".load-tooltip").tooltip();

		$( document ).ready(function() {
	        // 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

            @if ( session('alert_html'))
                callModalAlert('Cancel Check in Group. Some Room Still Occupied');
            @endif

            let stored_accordion_ids = JSON.parse(sessionStorage.getItem("opened_accordion_roomview")); //get stored opened accordion id on roomview
            if (stored_accordion_ids) {
                $.each(JSON.parse(stored_accordion_ids), function (this_key, this_value) {
                    $('#accordion_button_lantai_'+this_value).trigger('click')
                });
            }

            // Filter By when refresh page
                let filter_by = JSON.parse(sessionStorage.getItem("filter_by")); //get stored opened accordion id on roomview

                if (filter_by) {
                    $('#filter_by').select2().val(filter_by).trigger('change');
                }
            //  Filter By when refresh page

			let f_tanggal =$('#tanggal').val();
            pagination_page = 1;
			filter(null, f_tanggal, null);
		});

        let accordion_ids = [0];
		// onlick accordion button class
		$('.accordion_button_lantai_class').on('click', function(){
            setTimeout(function() {
                let accordions           = $('.accordion_lantais');
                $.each(accordions, function(key, value){
                    if($(value).hasClass('nav-item-open')){
                        // console.log('open')
                        accordion_ids[key] = $(value).attr('value')
                    } else{
                        // console.log('tidak-open')
                        accordion_ids[key] = 0
                        // accordion_ids.splice( key )
                    }
                });

                let converted_accordion_ids = '['+accordion_ids.toString()+']' // convert to string first
                sessionStorage.setItem("opened_accordion_roomview", JSON.stringify(converted_accordion_ids)); // Set Item on Session Storage
            }, 1000)
		})

        //Date Time Picker
        var DateTimePickers = function() {

        // Anytime picker
        var _componentAnytime = function() {
            if (!$().AnyTime_picker) {
                console.warn('Warning - anytime.min.js is not loaded.');
                return;
            }

            $('.input-timepicker').AnyTime_picker({
                format: '%H:%i'
            });

            // On demand picker
            $('#button-checkin').on('click', function (e) {
                $('#input-checkin').AnyTime_noPicker().AnyTime_picker().focus();
                e.preventDefault();
            });

            // On demand picker
            $('#button-checkout').on('click', function (e) {
                $('#input-checkout').AnyTime_noPicker().AnyTime_picker().focus();
                e.preventDefault();
            });
        };


        //
        // Return objects assigned to module
        //

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

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


        $('#wakeUpCallModal').on('show.bs.modal', function (event) {
            console.log('modal opened');
                var button = $(event.relatedTarget);

                var id = button.data('kamar_id');
                var time = button.data('wakeup_time');
                var modal = $(this);
                modal.find('.modal-body #kamar_id').val(id);

                if(time){
                    var m = time.split(" ");

                    modal.find('.modal-body #wakeupcalldate').val(moment( m[0] ).format('DD-MM-YYYY'));
                    modal.find('.modal-body #wakeupcalltime').val(m[1]);
                }
                // modal.find('.modal-body #kamar_id').val(id);
                // modal.find('.modal-body #wakeupcalltime').val(time);
        })

		$('.btn-wakeup').on('click', function(){
			let wakeup_time = $(this).attr('data-wakeup_time');
			let array_wakeup = wakeup_time.split(" ");
			let tanggal = array_wakeup[0];
			let jam = array_wakeup[1];

			console.log(tanggal);
			console.log(jam);

			$('#wakeupcalldate').val(tanggal);
			$('#wakeupcalltime').val(jam);
		})


		function alertCall(){
            var rawTime = new Date();
			var currentTime = ((rawTime.getHours()<10?'0':'')+rawTime.getHours()) + ":" + ((rawTime.getMinutes()<10?'0':'')+rawTime.getMinutes());

			var arraykamars = @php echo json_encode($kamars); @endphp

            var mTime = moment().toDate();
            let sTime = moment(mTime).toString();

            $.each(arraykamars, function(index, value) {
                $.each(value, function(i, v) {
					if(v.wakeupcall_time){
						var time = v.wakeupcall_time;
	                    var id = v.id;
	                    var no = v.no_kamar;

						// console.log('Tanggal: '+time);


	                    let mTime = moment().toDate();
	                    var mWakeUpCall = moment(time, 'YYYY-MM-DD').toDate();
	                    var sWakeUpCall = moment(time, 'YYYY-MM-DD hh:mm').subtract(0, 'minutes').toDate();
						var alarm_hidup = moment(sWakeUpCall, moment.defaultFormat).format('HH:mm')

	                    if (alarm_hidup == currentTime){
	                        $.ajax({
	                            type : 'get',
	                            url : "{{ url('roomview/removewakeupcall') }}/"+id,
	                            success: function (data) {
	                                $('#wakeCallTimeAlert').modal('show');
	                                let html = "";
	                                    html += `<div class="modal-dialog modal-sm">
	                                                <div class="modal-content">
	                                                    <div class="modal-header bg-danger" align="center">
	                                                        <h6 class="modal-title"><i class="fas fa-clock  mr-1"></i>Alert</h6>
	                                                        <button type="button" class="close" onclick="location.reload()">&times;</button>
	                                                    </div>
	                                                    <div class="modal-body">
	                                                        Peringatan Waktu Wake Up Call Kurang 10 Menit! <br>
	                                                        Kamar No ${no}
	                                                    </div>
	                                                    <div class="modal-footer">
	                                                        <button type="button" class="btn btn-secondary" onclick="location.reload()">Close</button>
	                                                    </div>
	                                                </div>
	                                            </div>`

	                                $('#wakeCallTimeAlert').html(html);
	                                $('#wakeCallTimeAlert').data('bs.modal')._config.backdrop = 'static';
	                            }
	                        })
	                    }
					}
                })
            });

        	setTimeout(alertCall, 1000);
		}
        alertCall();

	</script>

	<script>
			function ClickBtnDraftPrintBill(id, booking_id, no_kamar) {
				var html = ''
                $('#draftprintbillmodal_invoiceid').val(null)
				$.ajax({
					type: 'GET',
					url: "{{url('rv_draftprintbill')}}",
					data: {
						_token:'{{csrf_token()}}',
						id: id,
                        booking_id: booking_id,
                        nomor_kamar:no_kamar
					},
					success: function (res) {
						var no = 1;
						var qty = 0

                        $('#draftprintbillmodal_invoiceid').val(id) //id invoice
                        console.log(res.transactions.length)
                        if ( res.invoices[0].invoicedetail.length > 0 || res.deposits.length > 0 || res.transactions.length > 0) {
                            // $.each(res.invoices, function(index, value) {
                                if (res.invoices[0].invoicedetail.length > 0) {
                                    $.each(res.invoices[0].invoicedetail, function(index2, value2) {
                                        // console.log(index2, value2)
                                        if (value2.qty == null) {
                                            qty = '-'
                                        } else {
                                            qty = value2.qty
                                        }
                                        html += `
                                                <tr>
                                                <input type='hidden' name='invoice_id' value='${res.invoices[0].id}'>
                                                <td><input type='checkbox' name='invoice_det[]' value='${value2.id}'></td>
                                                <td>${no}</td>
                                                <td>${moment(value2.date, 'YYYY-MM-DD hh:mm:ss').format('DD-MM-YYYY')}</td>
                                                <td>${value2.description}</td>
                                                <td>
                                                ${qty}
                                                </td>
                                                <td>Rp ${ribuanWithComma(Number(value2.total))}</td>
                                                </tr>`;
                                        no++;
                                    })
                                }
                            // })

                            // $.each(res.deposits, function(index, value) {
                                // console.log(value, 'ini valkue')
                                if (res.deposits.length > 0) {
                                    $.each(res.deposits, function(index2, value2) {

                                        // console.log(index2, value2)
                                        if (value2.qty == null) {
                                            qty = '-'
                                        } else {
                                            qty = value2.qty
                                        }
                                        html += `
                                                <tr>
                                                <td><input type='checkbox' name='booking_deposits[${no}]' value='${value2.id}'></td>
                                                <td>${no}</td>
                                                <td>${moment(value2.transaction_date, 'YYYY-MM-DD hh:mm:ss').format('DD-MM-YYYY')}</td>
                                                <td>${value2.deposit_reservasi == 1 ? "Deposit" : 'Pembayaran'} ${jenis_deposit_text[value2.jenis_deposit]} ${[2,4].includes(value2.jenis_deposit) ? value2.platform.nama : ''} A.N ${value2.nama} ${value2.voucher ? '/'+value2.voucher : '' } ${value2.description ? '-'+value2.description : ''}</td>
                                                <td>
                                                -
                                                </td>
                                                <td>Rp ${ribuanWithComma(Number(value2.nominal))}</td>
                                                </tr>`;
                                        no++;
                                    })
                                }
                                // })

                                if (res.transactions.length > 0) {
                                    $.each(res.transactions, function(index2, value2) {

                                        // console.log(index2, value2)
                                        if (value2.qty == null) {
                                            qty = '-'
                                        } else {
                                            qty = value2.qty
                                        }
                                        html += `
                                                <tr>
                                                <td><input type='checkbox' name='transactions[${no}]' value='${value2.id}'></td>
                                                <td>${no}</td>
                                                <td>${moment(value2.transaction_date, 'YYYY-MM-DD hh:mm:ss').format('DD-MM-YYYY')}</td>
                                                <td>${value2.menu ? value2?.menu?.nama : value2.keterangan_custom} ${value2.description ? '-'+value2.description : ''}</td>
                                                <td>
                                                    ${value2?.jumlah}
                                                </td>
                                                <td>Rp ${ribuanWithComma(Number(value2.grand_total))}</td>
                                                </tr>`;
                                        no++;
                                    })
                                }
                        } else {
                            html += `<tr><td colspan="6" style="text-align:center;"> No Data (Data will be available after running audit) </td></tr>`;
                        }

						$('#tabledraftprintbill tbody').empty()
						$('#tabledraftprintbill tbody').append(html)
					}
				})


			}


	function ClickBtnDetailKamar(id, jeniskamars, room1, room2, ketval) {
		console.log(id, jeniskamars, room1, room2, ketval)

		$('#connecting_room').empty()
		$('#detail_jeniskamar').empty()
        $('#label_connecting_room').empty()
        $('#keterangan_room').empty()
        $('#label_keterangan_room').empty()

		var co_room = ''
		var co_room1 = ''
        var label_room = ''
        var label_keterangan = ''
        var keterangan = ''
		if (room1 != 0) {
			co_room1 += 'No. '+room1
		} else {
			co_room1 += 'Not Connected'
		}

		var co_room2 = ''
		if (room2 != 0) {
			co_room2 += 'No. '+room2
		} else {
			co_room2 += 'Not Connected'
		}

		var jns_kamar = '<div class="form-control-plaintext">'

		$.each(jeniskamars, function(index, value) {
						jns_kamar += value.nama
						if (index != (jeniskamars.length - 1) ) {
							jns_kamar += ' , '
						}
		})
		jns_kamar += '</div>'

		if (room1 == 0 && room2 == 0) {
			co_room = ''
		} else {
            label_room += 'Connecting Room'
            if (room1) {
			    co_room += '<div class="form-control-plaintext">- ' + co_room1 + '</div>'
            }
            if (room2) {
                co_room += '<div class="form-control-plaintext">- ' + co_room2 + '</div>'
            }

            if (ketval) {
                label_keterangan += 'Description'
                keterangan += '<div class="form-control-plaintext">' + ketval + '</div>'
            }else{
                label_keterangan += 'Description'
                keterangan += '<div class="form-control-plaintext"> - / None </div>'
            }
		}
		$('#connecting_room').append(co_room)
		$('#detail_jeniskamar').append(jns_kamar)
        $('#label_connecting_room').append(label_room)
        $('#label_keterangan_room').append(label_keterangan)
        $('#keterangan_room').append(keterangan)
	}

	//Transfer Bill
	function ClickBtnTransferBill(id) {
        $('#invoice_id').val(id)
		var html = ''
		var cekopt = ''
        var count  = 0;

				$.ajax({
					type: 'GET',
					url: "{{url('rv_getdata_transferbill')}}",
					data: {
						_token:'{{csrf_token()}}',
						id: id
					},
					success: function (res) {
						var no = 1;
						var qty = 0

						$.each(res.invoice_utama, function(index2, value2) {

							console.log(res.invoice_utama);

							//Load Data Invoice Detail
							if(value2.invoicedetail.length > 0){
								$.each(value2.invoicedetail, function(index3, value3) {
									if (value3.qty == null) {
										qty = '-'
									} else {
										qty = value3.qty
									}

									html += `
											<tr>
											<td>${no}</td>
											<td>${value3.description}</td>
											<td>
											${qty}
											</td>
											<td>Rp ${ribuanWithComma(Number(value3.total))}</td>
											<td>`
									html += `<input type='hidden' id='detail_id_${value3.id}' name='detail_id[]' value='${value3.id}'>`;
									html += `<input type='hidden' id='shop_transaction_id_${value3.id}' name='shop_transaction_id[]'>`;
									html += `<input type='hidden' id='deposit_id_${value3.id}' name='deposit_id[]'>`;
                                    html += `<input type='hidden' id='pembayaran_pos${value3.id}' name='pembayaran_pos[]'> `;
									html += `<select id='trf_room_${value3.id}' class="form-control" name="transferto_room[]">`;
									html += '<option value="">-- Pilih Room --</option>';

                                    if (res.invoices.length > 0) {
                                        $.each(res.invoices, function (ind, value) {
                                            // $.each(val.invoice, function (index, value) {
                                                // if (cekopt === value.room_no) {
                                                // 	return
                                                // 	// skip iteration if it's the same value as previous iteration value
                                                // }

                                                if(null !== value.nomor_kamar){
                                                    html += `<option value='${value.id}'>${value.nomor_kamar} - ${value.nama_pelanggan}</option>`
                                                }

                                                // cekopt = value.room_no
                                            // })
                                            cekopt = ''
                                        })
                                    }else {
                                        html += `<option value="">-- Tidak ada kamar yg tersedia --</option>`
                                    }

									html += '</select>'
									html += `</td>
											</tr>`;
									no++;
									count++;
								})
							}

							//Load Shop Transaction ID
							if(value2.shop_transaction.length > 0){
								$.each(value2.shop_transaction, function(idx_shop, value_shop) {
									html += `
											<tr>
											<td>${no}</td>
											<td>${value_shop.menu ? value_shop.menu.nama : value_shop.keterangan_custom} ${value_shop.description ? '- '+value_shop.description : ''}</td>
											<td>
											${value_shop.jumlah}
											</td>
											<td>Rp ${ribuanWithComma(Number(value_shop.grand_total))}</td>
											<td>`
									html += `<input type='hidden' id='detail_id_${value_shop.id}' name='detail_id[]'>`;
									html += `<input type='hidden' id='shop_transaction_id_${value_shop.id}' name='shop_transaction_id[]' value='${value_shop.id}'>`;
									html += `<input type='hidden' id='deposit_id_${value_shop.id}' name='deposit_id[]'>`;
                                    html += `<input type='hidden' id='pembayaran_pos${value_shop.id}' name='pembayaran_pos[]'> `;
									html += `<select class="form-control" name="transferto_room[]">`;
									html += '<option value="">-- Pilih Room --</option>';

                                    if (res.invoices.length > 0) {
                                        $.each(res.invoices, function (ind, value) {
                                            // $.each(val.invoice, function (index, value) {
                                                // if (cekopt === value.room_no) {
                                                // 	return
                                                // 	// skip iteration if it's the same value as previous iteration value
                                                // }

                                                if(null !== value.nomor_kamar){
                                                    html += `<option value='${value.id}'>${value.nomor_kamar} - ${value.nama_pelanggan}</option>`
                                                }

                                                // cekopt = value.room_no
                                            // })
                                            cekopt = ''
                                        })
                                    }else {
                                        html += `<option value="">-- Tidak ada kamar yg tersedia --</option>`
                                    }

									html += '</select>'
									html += `</td>
											</tr>`;
									no++;
									count++;
								})
							}

							//Load Deposit ID
							if(value2.bookings.deposits.length > 0){
								$.each(value2.bookings.deposits, (idx_deposit, value_deposit) => {
                                    if(value_deposit.jenis_transaksi == 1 && value_deposit.deleted_at === null && value_deposit.room_index == value2.room_index){
									html += `
											<tr>
											<td>${no}</td>
											<td>${value_deposit.deposit_reservasi == 1 ? 'Deposit' : 'Payment' } ${jenis_deposit_text[value_deposit.jenis_deposit]} ${value_deposit.platform ?? ''} A.N. ${value_deposit.nama} ${value_deposit.voucher ? '/'+value_deposit.voucher : ''} ${ value_deposit.description ? '- '+value_deposit.description : ''}</td>
											<td></td>
											<td>Rp ${ribuanWithComma(Number(value_deposit.nominal))}</td>
											<td>`
									html += `<input type='hidden' id='detail_id_${value_deposit.id}' name='detail_id[]'>`;
									html += `<input type='hidden' id='shop_transaction_id_${value_deposit.id}' name='shop_transaction_id[]'>`;
									html += `<input type='hidden' id='deposit_id_${value_deposit.id}' name='deposit_id[]'  value='${value_deposit.id}'>`;
									html += `<input type='hidden' id='pembayaran_pos${value_deposit.id}' name='pembayaran_pos[]'> `;
									html += `<select class="form-control" name="transferto_room[]">`;
									html += '<option value="">-- Pilih Room --</option>';

                                    if (res.invoices.length > 0) {
                                        $.each(res.invoices, function (ind, value) {
                                            // $.each(val.invoice, function (index, value) {
                                                if(null !== value.nomor_kamar){
                                                    html += `<option value='${value.id}'>${value.nomor_kamar} - ${value.nama_pelanggan}</option>`
                                                }
                                            // })
                                        })
                                    }else {
                                        html += `<option value="">-- Tidak ada kamar yg tersedia --</option>`
                                    }

									html += '</select>'
									html += `</td>
											</tr>`;
									no++;
									count++;
                                    }
								});
							}

                            //Load PembayaranPOS yang nonstay ID ini
                            if(value2.bookings.pembayaran_pos.length > 0){
                                $.each(value2.bookings.pembayaran_pos, function(idx_pos, value_pos) {
                                    if(value_pos.jenis_pembayaran_id == 6 || value_pos.jenis_pembayaran_id == 7 && value_pos.room_index == room_index){
                                        html += `
                                                <tr>
                                                <td>${no}</td>
                                                <td>Outlet Bill: ${value_pos?.cart?.order_flag}</td>
                                                <td>Rp ${ribuanWithComma(Number(value_pos.nominal))}</td>
                                                <td>Rp ${ribuanWithComma(Number(value_pos.nominal))}</td>
                                                <td>`
                                        html += `<input type='hidden' id='detail_id_${value_pos.id}' name='detail_id[]'>`;
                                        html += `<input type='hidden' id='shop_transaction_id_${value_pos.id}' name='shop_transaction_id[]'>`;
                                        html += `<input type='hidden' id='deposit_id_${value_pos.id}' name='deposit_id[]'>`;
                                        html += `<input type='hidden' id='pembayaran_pos${value_pos.id}' name='pembayaran_pos[]' value='${value_pos.id}'> `;
                                        html += `<select class="form-control form-control-select2" name="transferto_room[]">`;
                                        html += '<option value="">-- Select Room --</option>';

                                        if (res.invoices.length > 0) {
                                            $.each(res.invoices, function (ind, value) {
                                                // $.each(val.invoice, function (index, value) {

                                                    if(null !== value.nomor_kamar){
                                                        html += `<option value='${value.id}'>${value.nomor_kamar} - ${value.nama_pelanggan}</option>`
                                                    }

                                                // })
                                            })
                                        }else{
                                            html += `<option value="">-- No Room Available --</option>`
                                        }

                                        html += '</select>'
                                        html += `</td>
                                                </tr>`;
                                        no++;
										count++;
                                    }
                                })
                            }

						})

                        if(count == 0){
                            html = '<tr><td colspan="5" style="text-align:center">No Data To Transfer</td></tr>';
                        }

						$('#tabletransferbill tbody').empty()
						$('#tabletransferbill tbody').append(html)
                        $('.form-control-select2').select2()
					}
				})

	}

	// function selectDetail(detail_id) {
	// 	html =''
	// 	val = $('#trf_room_'+detail_id+' :selected').val()
	// 	console.log(detail_id, val)

	// 	if (val != '') {
	// 		$('#detail_id_'+detail_id).prop('disabled',false)
	// 	} else {
	// 		$('#detail_id_'+detail_id).prop('disabled',true)
	// 	}
	// 	// html += `<input type='text' name='detail_id' value='${detail_id}'>`
	// 	// $('#pilihandetail').append(html)
	// }

	</script>

	{{-- Js Extend Stay --}}
	<script type="text/javascript">

		// Untuk me-refresh select2
		function selectRefresh(){
			$('.form-control-select2').select2();
		}

		// Function Ketika Tombol Extend Stay di tekan
		function ClickBtnExtendStay(booking_id, nomor_kamar) {
            // reset extend stay
            $('#form-extendStay').html('');

			// let start_date = moment(booking.start_date).format("YYYY-MM-DD")
			// let end_date = moment(booking.end_date).format("YYYY-MM-DD")
			// console.log(booking)

			// $('#booking_details').val(JSON.stringify(booking.booking_details));
			// $('#jumlah_malam_awal').val(booking.jml_malam);
			// $('#nama_pelanggan').val(booking.nama);
			// $('#jumlah_malam_awal_readonly').val(booking.jml_malam);
			// $('#start_date_extend').val(start_date);
			// $('#end_date_extend').val(end_date);
			// $('#end_date_for_start_date_extend').val(end_date);
			// $('#total_biaya_text_extend').val(booking.total_biaya);
			// $('#total_biaya_before_extend').val(booking.total_biaya);
			// $('#jml_dewasa').val(booking.jml_dewasa);

            $.ajax({
				type: 'GET',
				url: "{{ url('roomview/get-data-booking-detail-for-extend-stay')}}/"+booking_id+"/"+nomor_kamar,
				success: function (data) {
                    let booking_detail = data.booking_detail

                    let session = {!! json_encode(Session::get("hotel_id") ?? \Auth::user()->hotel_id) !!}
                    let arrangements = {!! json_encode($arrangements) !!}
                    let start_date = moment(booking_detail.start_date).format("DD-MM-YYYY")
                    let end_date = moment(booking_detail.end_date).add(1, 'days').format("DD-MM-YYYY")
                    let end_date_for_start_date_extend = moment(booking_detail.end_date).format("DD-MM-YYYY")
                    let segments =  {!! json_encode(config('custom.segment_ratecodes')) !!};
                    let companies =  {!! json_encode($companies) !!};
                    let jenis_kamars = {!! json_encode($jenis_kamars) !!};
                    let total_tagihan = data.total_tagihan

                    let htmlOptionSegments = '<option value="">-- Select Segment --</option>'
                    $.each(segments, function(key, val){
                        htmlOptionSegments += `<option value="${key}" ${booking_detail.booking.segmentasi_rate_code == key ? 'selected' : ''}>${val}</option>`
                    });

                    let htmlOptionCompanies = '<option value="">-- Pilih Company --</option>'
                    $.each(companies, function(key, val){
                        let status_ledger = {!! json_encode(config("custom.status_ledger")) !!}
                        htmlOptionCompanies += `
                                                    <option value="${val.id}"
                                                            data-status="${val.status_ledger}"
                                                            data-status-text="${status_ledger[val.status_ledger]}"
                                                            data-perusahaan="${val.comp_title} ${val.name}"
                                                            ${booking_detail.booking.company_id == val.id ? 'selected' : ''}
                                                    >
                                                            ${val.comp_title} ${val.name}
                                                    </option>
                                                `
                    });

                    let htmlOptionJenisKamars = '<option value="" data-id="" data-diskon="" data-kapasitas"">-- Choose Room type --</option>'
                    $.each(jenis_kamars, function(key, val){
                        diskon_kamar = val.discount.length > 0 ? val.discount[0].diskon : 0;
                        htmlOptionJenisKamars += `
                                                    <option data-id="${val.id}"
                                                            data-diskon="${diskon_kamar}"
                                                            data-kapasitas="${val.kapasitas}"
                                                            value="${val.id}"
                                                    >
                                                        ${val.nama} (${val.kapasitas} Orang)
                                                    </option>
                                                `
                    });

                    let htmlOptionArrangements = '<option value="" data-harga="0">-- Select Arrangements --</option>'
                    $.each(arrangements, function(key, val){
                        let harga_arrangement = 0;
                        let service_arrangement = 0;
                        let tax_arrangement = 0;

                        if(val.arrangement_code_detail){
                            // let tax_shop = 0
                            // let service_shop = 0
                            // let tax_arrangement_temp = 0
                            // let tax_arrangement = 0
                            // let tax_arrangement = 0
                            $.each(val.arrangement_code_detail, function(key_arrangement_detail, arrangement_detail){
                                tax_shop = arrangement_detail.shop ? arrangement_detail?.shop?.ppn : 0;
                                service_shop = arrangement_detail.shop ? arrangement_detail?.shop?.services : 0;

                                tax_arrangement_temp = (arrangement_detail.harga * tax_shop)/(100+tax_shop);
                                tax_arrangement += tax_arrangement_temp;

                                harga_exclude_tax = arrangement_detail.harga - tax_arrangement_temp;
                                service_arrangement_temp = (harga_exclude_tax * service_shop)/(100+service_shop);
                                service_arrangement += service_arrangement_temp;

                                harga_arrangement += arrangement_detail.harga;
                            })
                        }

                        htmlOptionArrangements += `
                                                    <option data-id="${val.id}"
                                                            data-harga="${val?.total_harga?.total ?? 0}"
                                                            data-services="${service_arrangement}"
                                                            data-tax="${tax_arrangement}"
                                                            value="${val.arrangement_code}"
                                                    >
                                                        ${val.arrangement_code}
                                                    </option>
                                                `
                    });

                    let html = `
                                    <h5>Extend Kamar ${nomor_kamar}</h5>

                                    <input type="hidden" name="hotel_id" id="hotel_id_extend" value="${session}" />
                                    <input type="hidden" name="jumlah_malam_awal" id="jumlah_malam_awal" value="${booking_detail.jumlah_malam}">
                                    <input type="hidden" name="jml_dewasa" id="jml_dewasa" value="${booking_detail.pax}">
                                    <input type="hidden" name="nama_pelanggan" id="nama_pelanggan" value="${booking_detail.booking.nama}">
                                    <input type="hidden" name="booking_detail_id" id="booking_detail_id_extend" value="${booking_detail.id}">
                                    <input type="hidden" name="booking_id" id="booking_id_extend" value="${booking_detail?.booking?.id}">
                                    <input type="hidden" name="nomor_kamar_sebelumnya" id="nomor_kamar_sebelumnya" value="${booking_detail?.nomor_kamar}">
                                    <input type="hidden" name="room_index" id="room_index" value="${booking_detail?.room_index}">
                                    <input type="hidden" name="segment_rate_code_drop_id" id="segment_rate_code_drop_id_extend" value="${booking_detail?.segment_rate_code_drop_id}">
                                    <input type="hidden" name="ratecode_id" id="rate_code_id_extend" value="${booking_detail?.ratecode_id}">
                                    <input type="hidden" name="arrangement_id" id="arrangement_id_extend" value="${booking_detail?.arrangement_id}">

                                    <input type="hidden" name="per_item_real" id="per_item_real_extend" value="">
                                    <input type="hidden" name="per_item_services" id="per_item_services_extend" value="">
                                    <input type="hidden" name="per_item_tax" id="per_item_tax_extend" value="">

                                    <input type="hidden" name="per_item_arr" id="per_item_arr_extend" value="">
                                    <input type="hidden" name="per_item_arr_services" id="per_item_arr_services_extend" value="">
                                    <input type="hidden" name="per_item_arr_tax" id="per_item_arr_tax_extend" value="">

                                    <div class="form-group row">
                                        <label class="col-form-label col-lg-2">Jumlah Malam</label>
                                        <div class="col-lg-10 row">
                                            <div class="col-lg-2">
                                                <input type="number" class="form-control" id="jumlah_malam_awal_readonly" value="${booking_detail.jumlah_malam}" readonly>
                                            </div>

                                            <div class="col-lg-1 text-center my-auto">
                                                +
                                            </div>

                                            <div class="col-lg-2">
                                                <input type="number" class="form-control" id="jumlah_malam_extend" name="jml_malam" value="1" min="1">
                                            </div>
                                        </div>

                                        <input type="hidden" name="end_date_for_start_date_extend" id="end_date_for_start_date_extend" value="${end_date_for_start_date_extend}">
                                    </div>

                                    <div class="form-group row">
                                        <label class="col-form-label col-lg-2">Start Date</label>
                                        <div class="col-lg-2">
                                            <input type="text"
                                                    name="start_date"
                                                    id="start_date_extend"
                                                    class="form-control"
                                                    value="${start_date}" readonly
                                            >
                                        </div>

                                        <label class="col-form-label col-lg-2 text-right">End Date</label>
                                        <div class="col-lg-2">
                                            <input type="text"
                                                        name="end_date"
                                                    id="end_date_extend"
                                                    class="form-control"
                                                    value="${end_date}"
                                                    readonly
                                            >
                                        </div>
                                    </div>

                                    <div class="form-group row">
                                        <label for="jns_kamar" class="col-form-label col-lg-2">Segmentasi</label>
                                        <div class="col-lg-4">
                                            <select name="segmentasi_rate_code"
                                                    id="segmentasi_rate_code_extend"
                                                    class="form-control form-control-select2"
                                                    disabled
                                            >
                                                ${htmlOptionSegments}
                                            </select>
                                        </div>
                                    </div>

                                    <div class="form-group row">
                                        <label for="company_id" class="col-form-label col-lg-2">Company</label>
                                        <div class="col-lg-4">
                                            <select name="company_id" id="company_id_extend" class="form-control form-control-select2" disabled>
                                                ${htmlOptionCompanies}
                                            </select>
                                        </div>
                                        <div class="col-lg-6">
                                            <span class="text-danger" id="company_danger_extend"></span>
                                        </div>
                                    </div>

                                    <div class="form-group row">
                                        <label for="jns_kamar" class="col-form-label col-lg-2">Kamar</label>
                                        <div class="col-lg-10" id="form_kamar">

                                            <!-- Alert -->
                                            <!-- <div class="row" id="alert-kamar" style="display:none">
                                                 <div class="col-md-12">
                                                     <div class="alert alert-danger alert-dismissible fade show" role="alert">
                                                         <strong>Kapasitas Kamar Tidak Cukup!</strong> Silahkan memilih jenis kamar lain
                                                         <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                                         <span aria-hidden="true">&times;</span>
                                                         </button>
                                                     </div>
                                                 </div>
                                             </div> -->
                                            <div class="row">
                                                <div class="col-lg-4">
                                                    Jenis Kamar:
                                                </div>
                                                <div class="col-lg-2">
                                                    Nomor Kamar:
                                                </div>
                                                <div class="col-lg-3">
                                                    Rate Code:
                                                </div>
                                                <div class="col-lg-3">
                                                    Arrangement:
                                                </div>
                                            </div>
                                            <div class="row mb-2" data-idx="row_0" id="row_0">
                                                <div class="col-lg-4">
                                                    <select name="jns_kamar[]"
                                                            id="jns_kamar_extend0"
                                                            data-idx="0"
                                                            onchange="getKamar(this.id)"
                                                            class="form-control form-control-select2"
                                                            required
                                                    >
                                                        ${htmlOptionJenisKamars}
                                                    </select>
                                                    <input type="hidden" name="diskon[]" id="diskon_extend0">
                                                </div>
                                                <div class="col-lg-2">
                                                    <select name="nomor_kamar[]"
                                                            id="nomor_kamar_extend0"
                                                            data-idx="0"
                                                            class="form-control form-control-select2"
                                                            data-default_extend_stay="1"
                                                            data-default_nomor_kamar="${booking_detail.nomor_kamar}"
                                                            required
                                                    >
                                                        <option value="">-- Pilih Nomor Kamar --</option>
                                                    </select>
                                                    <input type="hidden"
                                                            id="jml_kamar_extend0"
                                                            name="jml_kamar[]"
                                                            class="form-control"
                                                            min="1"
                                                            value="1"
                                                    >
                                                </div>
                                                <div class="col-lg-3">
                                                    <select name="rate_codes[]"
                                                            id="rate_code_extend0"
                                                            data-idx="0"
                                                            onchange="getPrice(this.getAttribute('data-idx'), 1)"
                                                            class="form-control form-control-select2"
                                                            data-default_extend_stay="1"
                                                            data-default_rate_code="${booking_detail.rate_codes}"
                                                            required
                                                    >
                                                        <option value="" data-id="0" data-harga="0" data-include_breakfast="0">-- Select Rate Code --</option>
                                                    </select>
                                                </div>
                                                <div class="col-lg-3">
                                                    <select name="arrangement_codes[]"
                                                            id="arrangement_code_extend0"
                                                            data-idx="0"
                                                            onchange="getPrice(this.getAttribute('data-idx'), 2)"
                                                            class="form-control form-control-select2"
                                                            required
                                                    >
                                                        ${htmlOptionArrangements}
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="form-group row">
                                        <label class="col-form-label col-sm-2">Room Rate/Night</label>

                                        <div class="col-lg-10">
                                            <input type="text" class="form-control" name="per_item_night_text" id="per_item_night_extend_text" onChange="recount()" value="0" min="0">
                                            <input type="hidden" class="form-control" name="per_item_night" id="per_item_night_extend" value="0" min="0">
                                        </div>
                                    </div>

                                    <div class="form-group row">
                                        <label class="col-form-label col-sm-2">Biaya</label>
                                        <div class="col-lg-4">
                                            <input type="text" id="total_biaya_before_text_extend" class="form-control" value="${total_tagihan.toLocaleString('ID')}" readonly>
                                        </div>

                                        <div class="col-lg-1 text-center my-auto">
                                            +
                                        </div>

                                        <div class="col-lg-4">
                                            <input type="text" min="0" name="per_item_text[]" id="per_item_extend0_text" class="form-control" placeholder="Harga" readonly>
                                            <input type="hidden" min="0" name="per_item[]" id="per_item_extend0" class="form-control" placeholder="Harga">
                                            <span class="text-danger" id="ket_diskon_extend0"></span>
                                        </div>
                                    </div>

                                    <div class="form-group row">
                                        <label class="col-form-label col-sm-2">Total Biaya</label>
                                        <div class="col-lg-10">
                                            <input type="text" id="total_biaya_text_extend" class="form-control" value="${total_tagihan.toLocaleString('ID')}" readonly>
                                            <input type="hidden" name="total_biaya_before_extend" id="total_biaya_before_extend" class="form-control" value="${total_tagihan}">
                                            <input type="hidden" name="total_biaya_extend" id="total_biaya_extend" class="form-control">
                                            <span class="text-danger" id="ket_diskon_extend"></span>
                                        </div>
                                    </div>
                                `;

                    $('#form-extendStay').html(html);
                    selectRefresh();

                    $('#jns_kamar_extend0').select2().val(booking_detail.jenis_kamar_id).trigger('change');
                    $('#arrangement_code_extend0').select2().val(booking_detail.arrangement_codes).trigger('change');
                    // $('#nomor_kamar_extend_0').select2().val(booking_detail.nomor_kamar).trigger('change');
                    // $('#rate_code_extend0').select2().val(booking_detail.rate_codes).trigger('change');

                    $('#per_item_night_extend_text').on('input', function(){
                        $('#per_item_night_extend_text').mask("#.##0", {reverse: true});//set separator number
                    })

                    $('#per_item_extend0_text').on('input', function(){
                        $('#per_item_extend0_text').mask("#.##0", {reverse: true});//set separator number
                    })

                    // Jika di extend stay bisa multiple kamar, copas kode ini.. jika memang fix tidak multiple, hapus kode ini
                    // <div class="col-lg-1">
                    //     <button type="button" onclick="tambahKamar()" class="btn btn-success">
                    //         <i class="fas fa-plus-circle"></i>
                    //     </button>
                    // </div>
                }
			});


		};

		$('#form-extendStay').on('keyup', '#jumlah_malam_extend', function(){
			let value = $(this).val();
			if (value == '0') {
				$(this).val(1);
			}else if(value > 0){
				$('#submit_extend').attr('disabled', false)
			}

			if (value == '') {
				$('#submit_extend').attr('disabled', true)
			}
		})

		// Jika id jumlah malam extend di rubah
		$('#form-extendStay').on('change', '#jumlah_malam_extend', function(){
			$('#submit_extend').attr('disabled', false)

			let jml_malam = parseInt($(this).val());
			let jml_malam_awal = parseInt($('#jumlah_malam_awal').val());

			if (jml_malam > 0 && jml_malam != '') {
				jml_malam = jml_malam;
			} else {
				jml_malam = 1;
				$(this).val(jml_malam);
			}

			let jml_malam_total = jml_malam + jml_malam_awal;

			//Set Start Date And Date
			let start_date = $('#start_date_extend').val();
			let end_date_update = moment(start_date, "DD-MM-YYYY").add(jml_malam_total, 'days').format('DD-MM-YYYY');
			$('#end_date_extend').val(end_date_update)

            let harga_kumulatif = $('#per_item_night_extend').val()

			//Set Harga
			// let harga_kumulatif = 0;
			// let harga_tiap_item = $('[name="per_item[]"]');
			// $.each(harga_tiap_item, function(key, val){
			// 	let harga_kamar = $(val).val();
			// 	console.log(harga_kamar)
			// 	if(!isNaN(harga_kamar)){
			// 		harga_kumulatif += parseInt(harga_kamar);
			// 	}
			// });

			if(!isNaN(harga_kumulatif)){
				// Grand Total, total harga Dikali jumlah malam
				let grand_total = harga_kumulatif * jml_malam;

				let final_total = grand_total + parseInt($('#total_biaya_before_extend').val());
				$('#total_biaya_extend').val(final_total);
				$('#per_item_extend0').val(grand_total);
				$('#per_item_extend0_text').val(grand_total.toLocaleString('ID'));
				$('#total_biaya_text_extend').val(final_total.toLocaleString('ID'))
			}
		});

		// Untuk ambil harga dari ratecode
		function getPrice(indeks, from){
            // from = 1 (rate code)
            // from = 2 (arrangement code)

			// Value Rate code
			let value_rate_code = $("#rate_code_extend"+indeks).val();
			let harga = parseInt($("#rate_code_extend"+indeks).find('option[value="'+value_rate_code+'"]').attr('data-harga'));

            let status = parseInt($("#rate_code"+indeks).find('option[value="'+value_rate_code+'"]').attr('data-include_breakfast')); // ambil data status breakfast aktiv atau tidak
			// let harga_breakfast = parseInt($("#rate_code"+indeks).find('option[value="'+value_rate_code+'"]').attr('data-harga_breakfast')); // ambil data harga breakfast

            // console.log(harga_breakfast, status);

            // cek status breakfast untuk di kalkulasikan
            // if (status == 1) {
            //     harga = harga + harga_breakfast //tambah dengan harga breakfast.
            // }

			let value_arrangement_code = $("#arrangement_code_extend"+indeks).val();
            let arrangement_id = $("#arrangement_code_extend"+indeks).find('option[value="'+value_arrangement_code+'"]').attr('data-id')
            let harga_arrangement = parseInt(getRealPriceArrangement(arrangement_id, '#jml_dewasa'));
            let arrangement_service = parseInt($("#arrangement_code_extend"+indeks).find('option[value="'+value_arrangement_code+'"]').attr('data-services'));
            let arrangement_tax = parseInt($("#arrangement_code_extend"+indeks).find('option[value="'+value_arrangement_code+'"]').attr('data-tax'));
			// let harga_arrangement = parseInt($("#arrangement_code_extend"+indeks).find('option[value="'+value_arrangement_code+'"]').attr('data-harga'));

            // new adjustment tax service arr item
            var this_pax = $('#jml_dewasa').val()
            arrangement_tax = arrangement_tax * this_pax;
            arrangement_service = arrangement_service * this_pax;

            $('#arrangement_id_extend').val(arrangement_id)

			let harga_awal = parseInt(harga_arrangement) + parseInt(harga);

			// let diskon = parseInt($("#diskon_extend"+indeks).val());
			let diskon = 0;
			let harga_diskon = parseInt(harga_awal - (harga_awal * (diskon/100)));

			//Assign harga per kamar
			$("#per_item_night_extend").val(harga_diskon);
			$("#per_item_night_extend_text").val(harga_diskon.toLocaleString('ID'));

			if(diskon !== 0 && !isNaN(diskon)){
				$("#ket_diskon_extend"+indeks).html('<strike>'+harga+'</strike> Disc '+diskon+'%');
			}

            // Assign tax dan services
            let tax             = Math.round(Number(((harga_awal - harga_arrangement) * tax_percent_global)/(100+tax_percent_global)));//Find tax from normal price
            let harga_min_t     = (Number(((harga_awal - harga_arrangement) - tax)));//price minus total tax
            let services        = Math.round(Number((harga_min_t * services_percent_global)/(100+services_percent_global)));//Find service from normal price
            let harga_item_real = (Number((harga_awal - harga_arrangement) - (tax) - (services)));//input per item real

            // Assign value to hidden input
            $("#per_item_services_extend").val(services);
            $("#per_item_tax_extend").val(tax);
            $("#per_item_real_extend").val(harga_item_real);
            $("#per_item_arr_extend").val(Number(harga_arrangement - arrangement_service - arrangement_tax));
            $("#per_item_arr_services_extend").val(arrangement_service);
            $("#per_item_arr_tax_extend").val(arrangement_tax);

            // Segment rate code rop id
            let segment_rate_code_drop_id = $("#rate_code_extend"+indeks).find('option[value="'+value_rate_code+'"]').attr('data-segmentrc'); // ambil data segment rate code
            $('#segment_rate_code_drop_id_extend').val(segment_rate_code_drop_id)

            // rate code id
            let rate_code_id = $("#rate_code_extend"+indeks).find('option[value="'+value_rate_code+'"]').attr('data-id'); // ambil data segment rate code
            $('#rate_code_id_extend').val(rate_code_id)

			//Update Total Harga Dari Option rate code yang sudah dipilih
			let harga_kumulatif = 0;
		         harga_kumulatif += $('#per_item_night_extend').val();

			//final Total, total harga Dikali jumlah malam lalu di tambah total biaya sebelumnya
			if(!isNaN(harga_kumulatif)){
				let jml_malam = $('#jumlah_malam_extend').val();
				let grand_total = harga_kumulatif * parseInt(jml_malam);

				let final_total = grand_total + parseInt($('#total_biaya_before_extend').val());
				$('#total_biaya_extend').val(final_total);
                $('#total_biaya_after_text_extend').val(grand_total);
                $('#per_item_extend0').val(grand_total);
                $('#per_item_extend0_text').val(grand_total.toLocaleString('ID'));
				$('#total_biaya_text_extend').val(final_total.toLocaleString('ID'));
			}

            if (from === 1) {
                autoArrangement(1, '_extend'+indeks);
            }
		}

        //Hitung total kembali jika harga diedit
		function recountWalkinRate(element = ''){
            let ratecode_value = $("#rate_code"+element).val();
		    let ratecode_id = $("#rate_code"+element).find('option[value="'+ratecode_value+'"]').attr('data-id');
            let tipe_rate_code = 1;

			let harga = parseInt(( $('#per_item'+element).val()).replaceAll(",","") );
            let days  = parseInt($('#jumlah_malam'+element).val());

            $.ajax({
                type: "get",
                url: "{{{url('/getinforatecode')}}}",
                data: {id:ratecode_id},
                dataType: "json",
                async: false,
                cache: false,
                timeout: 30000,
                success: function (rate) {
                    tipe_rate_code = rate.tipe_rate_code
                }
            });
            let value_arrangement_code = $("#arrangement_code"+element).val();
            let arrangement_id = $("#arrangement_code"+element).find('option[value="'+value_arrangement_code+'"]').attr('data-id');
            let harga_arrangement = parseInt(getRealPriceArrangement(arrangement_id, '#pax'+element));
            let arrangement_service = parseInt($("#arrangement_code"+element).find('option[value="'+value_arrangement_code+'"]').attr('data-service'));
            let arrangement_tax = parseInt($("#arrangement_code"+element).find('option[value="'+value_arrangement_code+'"]').attr('data-tax'));
            // let harga_arrangement = parseInt($("#arrangement_code"+element).find('option[value="'+value_arrangement_code+'"]').attr('data-harga'));

            // new adjustment tax service arr item
            var this_pax = $('#pax'+element).val()
            arrangement_tax = arrangement_tax * this_pax;
            arrangement_service = arrangement_service * this_pax;

            // Assign tax dan services
            console.log( "a:"+harga )

            var harga_real = harga - (harga_arrangement??0)

            console.log( "b:"+harga_real )

            let tax             = Math.round(Number((harga_real * tax_percent_global)/(100+tax_percent_global)));//Find tax from normal price
            let harga_min_t     = (Number((harga_real - tax)));//price minus total tax
            let services        = Math.round(Number((harga_min_t * services_percent_global)/(100+services_percent_global)));//Find service from normal price
            let harga_item_real = (Number((harga_real) - (tax) - (services)));//input per item real

            console.log( "c:"+harga_item_real )

            // Assign value to hidden input
            $("#per_item_services"+element).val(services);
            $("#per_item_tax"+element).val(tax);
            $("#per_item_total"+element).val(harga_item_real);
            $("#per_item_arr"+element).val(harga_arrangement - arrangement_service - arrangement_tax);

            let total           = harga * days;
            if (tipe_rate_code == 2) {
                total = harga;
                $('#roomrate_label').html('Total Rate')
                $('#total_rate_label').hide()
            }else{
                $('#roomrate_label').html('Room Rate/Night')
                $('#total_rate_label').show()
            }
            $('#total_biaya_booking'+element).val(total);
            $('#total_biaya_booking_text'+element).val(ribuanWithComma(total));
            $('#nominal_deposit_book'+element).val(ribuanWithComma(total));
		}

		//Hitung total kembali jika harga diedit
		function recount(){
            $('#per_item_night_extend').val(($('#per_item_night_extend_text').val()).replaceAll(".",""));

			// let harga_kumulatif = 0;
			// let harga_tiap_item = $('[name="per_item[]"]');
			// $.each(harga_tiap_item, function(key, val){
			// 	let harga_kamar = $(val).val();
			// 	if(!isNaN(harga_kamar)){
			// 		harga_kumulatif += parseInt(harga_kamar);
			// 	}
			// });

            let harga_kumulatif = $('#per_item_night_extend').val()

			//final Total, total harga Dikali jumlah malam lalu di tambah total biaya sebelumnya
			if(!isNaN(harga_kumulatif)){
                let jml_malam = $('#jumlah_malam_extend').val();
				let grand_total = harga_kumulatif * jml_malam;

                $('#per_item_extend0').val(grand_total)
                $('#per_item_extend0_text').val(grand_total.toLocaleString('ID'))

				let final_total = grand_total + parseInt($('#total_biaya_before_extend').val());
				$('#total_biaya_extend').val(final_total);
                $('#total_biaya_after_text_extend').val(grand_total);
				$('#total_biaya_text_extend').val(final_total.toLocaleString('ID'));
			}
		}

		//Update Rate Code Ketika Segmentasi Segment Diganti
		$('#form-extendStay').on('change', '#segmentasi_rate_code_extend', function(){
			let segmentasi = $(this).val();
			// console.log(segmentasi)

			//Enable pilihan company guest jika segmentasinya company (Value 2 (Corporate) atau 3 (Group corporate))
			if(['2','3'].includes(segmentasi)){
				$('#company_id_extend').removeAttr('disabled');
				$('#company_id_extend').attr('required', 'required');
			}else{
				$('#company_id_extend').removeAttr('required');
				$('#company_id_extend').attr('disabled', 'disabled');

				$('#company_danger_extend').html('');
				$('#submit_extend').removeAttr('disabled');
			}

			// Ambil Ratecode berdasarkan Segmentasinya
			let startDate = $('#end_date_for_start_date_extend').val();
			let checkin = moment(startDate).format('YYYY-MM-DD') ?? '';
			let company_id = $('#company_id_extend').val();


			let jenis_kamars = $('[name="jns_kamar[]"]');

			$.each(jenis_kamars, function(key, val){
				let jenis_kamar_value = $('#jns_kamar_extend'+key).val();
				let jenis_kamar_id = $('#jns_kamar_extend'+key).find('option[value="'+jenis_kamar_value+'"]').attr('data-id');
				if(['2','3'].includes(segmentasi)){
					selectRateCodeCompanyExtend('#rate_code_extend'+key, jenis_kamar_id, company_id, segmentasi, checkin);
				}
				else{
					selectRateCodeExtend('#rate_code_extend'+key, jenis_kamar_id, segmentasi, checkin);
				}
			});
		});

		//Cek status company jika status company inactive booking tidak dapat ditambahkan
		$('#form-extendStay').on('change', '#company_id_extend' , function(){
			let company_val = $(this).val();
			let status_company = $(this).find('option[value="'+company_val+'"]').attr('data-status');
			let status_company_text = $(this).find('option[value="'+company_val+'"]').attr('data-status-text');
			let nama_perusahaan = $(this).find('option[value="'+company_val+'"]').attr('data-perusahaan');

			//Status 1: Active; 2: Deactive
			if(status_company == 2){
				let url = "{{url('companyguestprofile')}}";
				$('#company_danger_extend').html('Status Ledger Perusahaan &nbsp;<a href="'+url+'/'+company_val+'/edit" target="_blank"><b>'+nama_perusahaan+'</b></a>&nbsp; Dalam Status <b>'+status_company_text+'</b> Tidak Dapat Menambahkan Transaksi');
				$('#submit_extend').attr('disabled', 'disabled');
			}
			else{
				$('#company_danger_extend').html('');
				$('#submit_extend').removeAttr('disabled');
			}
		});

		//Select Ratecode untuk segmentasi non corporate
		function selectRateCodeExtend(select_element, jenis_kamar, segmentasi, checkin){
			var scheckin = moment(checkin).format('YYYY-MM-DD');
			// console.log("{{ url('/getratecodes')}}/"+jenis_kamar+"/"+segmentasi+"/"+scheckin+'halo, rate_code_extend');
                    console.log('coba seharusnya dapat', scheckin, segmentasi, jenis_kamar)
			$.ajax({
				type: 'GET',
				url: "{{ url('/getratecodes')}}/"+jenis_kamar+"/"+segmentasi+"/"+scheckin,
				success: function (data) {
                    console.log('seharusnya dapat')
					$(select_element).html(data);

                    // check if default extend stay
                        let default_extend_stay = $(select_element).data('default_extend_stay')

                        if (default_extend_stay == 1) {
                            let default_rate_code = $(select_element).data('default_rate_code')

                            $(select_element).select2().val(default_rate_code).trigger('change');
                            $(select_element).data('default_extend_stay', 0);
                        }
                    // check if default extend stay
				}
			});
		}

		//Select ratecode untuk segmentasi corporate
		function selectRateCodeCompanyExtend(select_element, jenis_kamar, company_id, segmentasi, checkin){
			var scheckin = moment(checkin).format('YYYY-MM-DD');
			// console.log("{{ url('/getcompanyratecodes')}}/"+jenis_kamar+"/"+company_id+"/"+segmentasi+"/"+scheckin+'halo, rate_codeCompany');
			$.ajax({
				type: 'GET',
				url: "{{ url('/getcompanyratecodes')}}/"+jenis_kamar+"/"+company_id+"/"+segmentasi+"/"+scheckin,
				success: function (data) {
					$(select_element).html(data);

                    // check if default extend stay
                        let default_extend_stay = $(select_element).data('default_extend_stay')

                        if (default_extend_stay == 1) {
                            let default_rate_code = $(select_element).data('default_rate_code')

                            $(select_element).select2().val(default_rate_code).trigger('change');
                            $(select_element).data('default_extend_stay', 0);
                        }
                    // check if default extend stay
				}
			});
		}

		// Select Nomor Kamar
		function selectNomorKamar(select_element, booking_detail_id, jenis_kamar, checkin, checkout){
			var scheckin = moment(checkin).format('YYYY-MM-DD');
			var scheckout = moment(checkout).format('YYYY-MM-DD');
			// $('#start_date').val(scheckin)
			// $('#end_date').val(scheckout)

			console.log("{{ url('/getnomorkamarextend')}}/"+booking_detail_id+"/"+jenis_kamar+"/"+scheckin+"/"+scheckout);

			if(booking_detail_id != "" && jenis_kamar != "" && scheckin != "" && scheckout != ""){
				$.ajax({
					type: 'GET',
					url: "{{ url('/getnomorkamarextend')}}/"+booking_detail_id+"/"+jenis_kamar+"/"+scheckin+"/"+scheckout,
					success: function (data) {
						$(select_element).html(data);

                        // check if default extend stay
                            let default_extend_stay = $(select_element).data('default_extend_stay')

                            if (default_extend_stay == 1) {
                                let default_nomor_kamar = $(select_element).data('default_nomor_kamar')

                                $(select_element).select2().val(default_nomor_kamar).trigger('change');
                                $(select_element).data('default_extend_stay', 0);
                            }
                        // check if default extend stay
					}
				});
			}
			else{
				$(select_element).html('<option value="">-- Pilih Nomor Kamar --</option>');
			}
		}

		//Untuk ambil nomor kamar dan ratecode
		function getKamar(id_select){
			//Hotel ID
			let hotel_id = $("#hotel_id_extend").val();

			//Element html nomor kamar
			let idx = $("#"+id_select).data('idx');
			let select_element = "#nomor_kamar_extend"+idx;
			let select_rate_code = "#rate_code_extend"+idx;

			//Data Segmentasi
			let segmentasi = $("#segmentasi_rate_code_extend").val();
			let booking_detail_id = $("#booking_detail_id_extend").val();

			//Option item
			let jenis_kamar_options = $("#"+id_select).html();
			let nomor_kamar_options = $(select_element).html();

			//Data Jenis Kamar
			let jenis_kamar_val = $("#"+id_select).val();
			let jenis_kamar = $("#"+id_select).find('option[value="'+jenis_kamar_val+'"]').attr('data-id');
			let diskon = $("#"+id_select).find('option[value="'+jenis_kamar_val+'"]').attr('data-diskon');

			//Company ID
			let company_id = $('#company_id_extend').val();

			//Assign diskon per kamar
			$("#diskon_extend"+idx).val(diskon);

			// Update total kapasitas kamar dari option jenis kamar yang sudah dipilih
			let kapasitas_total = 0;
			let kamar2 = $('[name="jns_kamar[]"]');
			$.each(kamar2, function(key, val){
				let val_option = $(val).val();
				let kapasitas_kamar = parseInt($(val).find('option[value="'+val_option+'"]').attr('data-kapasitas'));
				if(!isNaN(kapasitas_kamar)){
					kapasitas_total += kapasitas_kamar;
				}
			});

			//Untuk mengecek kapasitas, jika kapasitas kamar tidak cukup akan muncul alert
			let jumlah_dewasa = $('#jml_dewasa').val();

			// if(jumlah_dewasa > kapasitas_total){
			// 	$("#alert-kamar").removeAttr('style');
			// }
			// else{
			// 	$("#alert-kamar").removeAttr('style');
			// 	$("#alert-kamar").attr('style', 'display:none');
			// }

			//Untuk mencari ketersediaan nomor kamar
			// var range = $('#inpDatePicker').data('daterangepicker');
			let startDate = $('#end_date_for_start_date_extend').val();
			let endDate = $('#end_date_extend').val();

			if(startDate && endDate){
				var checkin = moment(startDate, 'DD-MM-YYYY').format('YYYY-MM-DD');
				var checkout = moment(endDate, 'DD-MM-YYYY').format('YYYY-MM-DD');

				selectNomorKamar(select_element, booking_detail_id, jenis_kamar, checkin, checkout);
			}

			if(['2','3','4','5','6','8','9'].includes(segmentasi)){
				selectRateCodeCompanyExtend(select_rate_code, jenis_kamar, company_id, segmentasi, checkin);
			}
			else{
				selectRateCodeExtend(select_rate_code, jenis_kamar, segmentasi, checkin);
			}
		}

		//Untuk ambil nomor kamar dan ratecode
		function getAvailableRooms(){
            let value = $('#jns_kamar_change_room').val();
            let diskon = $('#jns_kamar_change_room').find('option[value="'+value+'"]').attr('data-diskon');
            let jenis_kamar_id = $('#jns_kamar_change_room').find('option[value="'+value+'"]').attr('data-id');

            $('#diskon_change_room').val(diskon);
            $('#jenis_kamar_id_change_room').val(jenis_kamar_id);

            // console.log(value)
			// //Hotel ID
			let hotel_id = {!! json_encode(hotelID()) !!};;

			// //Element html nomor kamar
			// let idx = $("#"+id_select).data('idx');
			let select_element = "#available_rooms";
			let select_rate_code = "#rate_code_change_room";

			// //Data Segmentasi
			let segmentasi = $("#segmentasi_change_room").val();

			// //Option item
			// let jenis_kamar_options = $("#"+id_select).html();
			// let nomor_kamar_options = $(select_element).html();

			//Data Jenis Kamar
			let jenis_kamar_val = $("#jns_kamar_change_room").val();
			let jenis_kamar = $("#jns_kamar_change_room").find(':selected').attr('data-id');
			// let diskon = $("#jns_kamar_change_room").find(':selected').attr('data-diskon');

			// //Company ID
			// let company_id = $('#company_id_extend').val();
			let company_id = $('#company_id_change_room').val();

			// //Assign diskon per kamar
			// $("#diskon_extend"+idx).val(diskon);

			// // Update total kapasitas kamar dari option jenis kamar yang sudah dipilih
			// let kapasitas_total = 0;
			// let kamar2 = $('[name="jns_kamar[]"]');
			// $.each(kamar2, function(key, val){
			// 	let val_option = $(val).val();
			// 	let kapasitas_kamar = parseInt($(val).find('option[value="'+val_option+'"]').attr('data-kapasitas'));
			// 	if(!isNaN(kapasitas_kamar)){
			// 		kapasitas_total += kapasitas_kamar;
			// 	}
			// });

			// //Untuk mengecek kapasitas, jika kapasitas kamar tidak cukup akan muncul alert
			// let jumlah_dewasa = $('#jml_dewasa').val();

			// if(jumlah_dewasa > kapasitas_total){
			// 	$("#alert-kamar").removeAttr('style');
			// }
			// else{
			// 	$("#alert-kamar").removeAttr('style');
			// 	$("#alert-kamar").attr('style', 'display:none');
			// }

			//Untuk mencari ketersediaan nomor kamar
			// var range = $('#inpDatePicker').data('daterangepicker');
			let startDate = $('#start_date_change_room').val();
			let endDate = $('#end_date_change_room').val();

			if(startDate && endDate){
				var checkin = startDate;
				var checkout = endDate;
				// selectNomorKamar(select_element, 0, jenis_kamar, checkin, checkout);
			}

			if(['2','3','4','5','6','8','9'].includes(segmentasi)){
				selectRateCodeCompanyExtend(select_rate_code, jenis_kamar, company_id, segmentasi, checkin);
			}
			else{
				selectRateCodeExtend(select_rate_code, jenis_kamar, segmentasi, checkin);
			}
		}

		let new_idx = 1;

        // Jika extend stay tidak bisa multiple, function di bawah bisa di hapus
		// function tambahKamar(){
		// 	let jenis_kamar_options = $("#jns_kamar_extend0").html();
		// 	let nomor_kamar_options = $("#nomor_kamar_extend0").html();
		// 	let html = `<div class="row mb-2" data-idx="row_${new_idx}" id="row_${new_idx}">
		// 					<div class="col-lg-3">
		// 						<select name="jns_kamar[]"
		// 								id="jns_kamar_extend${new_idx}"
		// 								data-idx="${new_idx}"
		// 								onchange="getKamar(this.id)"
		// 								class="form-control form-control-select2"
		// 								required
		// 						>
		// 							${jenis_kamar_options}
		// 						</select>
		// 						<input type="hidden" name="diskon[${new_idx}]" id="diskon_extend${new_idx}">
		// 					</div>
		// 					<div class="col-lg-2">
		// 						<select name="nomor_kamar[${new_idx}]"
		// 								id="nomor_kamar_extend${new_idx}"
		// 								data-idx="${new_idx}"
		// 								class="form-control form-control-select2"
		// 								required
		// 						>
		// 							<option value="">-- Pilih Nomor Kamar --</option>
		// 						</select>
		// 						<input type="hidden"
		// 							   id="jml_kamar_extend${new_idx}"
		// 							   name="jml_kamar[${new_idx}]"
		// 							   class="form-control"
		// 							   min="1"
		// 							   value="1"
		// 						>
		// 					</div>
		// 					<div class="col-lg-2">
		// 						<select name="rate_codes[${new_idx}]" id="rate_code_extend${new_idx}" data-idx="${new_idx}" onchange="getPrice(this.getAttribute('data-idx'))" class="form-control form-control-select2" required>
		// 							<option value="" data-harga="0" data-include_breakfast="0">-- Select Rate Code --</option>
		// 						</select>
		// 					</div>
		// 					<div class="col-lg-2">
		// 						<select name="arrangement_codes[${new_idx}]"
		// 								id="arrangement_code_extend${new_idx}"
		// 								data-idx="${new_idx}"
		// 								onchange="getPrice(this.getAttribute('data-idx'))"
		// 								class="form-control form-control-select2"
		// 						>
		// 							<option value="" data-harga="0">-- Select Arrangement --</option>
		// 							@foreach($arrangements as $arrangement)
		// 							<option value="{{$arrangement->arrangement_code}}"
		// 									data-id="{{$arrangement->id}}"
		// 									data-harga="{{$arrangement->totalHarga->total ?? 0}}"
		// 							>{{$arrangement->arrangement_code}}</option>
		// 							@endforeach
		// 						</select>
		// 					</div>
		// 					<div class="col-lg-2">
		// 						<input type="number" min="0" name="per_item[]" onchange="recount()" id="per_item_extend${new_idx}" class="form-control" placeholder="Harga">
		// 						<span class="text-danger" id="ket_diskon_extend${new_idx}"></span>
		// 					</div>
		// 					<div class="col-lg-1">
		// 						<button type="button" onclick="removeKamar(${new_idx})" class="btn btn-danger">
		// 							<i class="fas fa-times-circle"></i>
		// 						</button>
		// 					</div>
		// 				</div>`
		// 	new_idx++;
		// 	$('#form_kamar').append(html);
		// 	$('.form-control-select2').select2();

		// 	//Hitung total kembali jika harga diedit
		// 	$('[name="per_item[]"]').on('change', function(){
		// 		let harga_kumulatif = 0;
		// 		let harga_tiap_item = $('[name="per_item[]"]');
		// 		$.each(harga_tiap_item, function(key, val){
		// 			let harga_kamar = $(val).val();
		// 			if(!isNaN(harga_kamar)){
		// 				harga_kumulatif += parseInt(harga_kamar);
		// 			}
		// 		});
		// 		//Grand Total, total harga Dikali jumlah malam
		// 		let jml_malam = $('#jml_malam').val();
		// 		let grand_total = harga_kumulatif * jml_malam;
		// 		$('#total_biaya').val(grand_total);
		// 	});
		// }

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

		//Disable submit dengan enter
		$(document).ready(function() {
		  $(window).keydown(function(event){
		    if(event.keyCode == 13) {
		      event.preventDefault();
		      return false;
		    }
		  });

          // ambil data ppn services global
          $.ajax({
            type: "get",
            url: "{{url('get-global-prices')}}",
            dataType: "json",
            success: function (response) {
                    tax_percent_global         = response.tax;
                    services_percent_global    = response.services;
                }
            });

		});

	</script>

	{{-- Js History Extend Stay --}}
	<script type="text/javascript">
		// Function Ketika Tombol History Extend Stay di tekan
		function ClickBtnHistoryExtendStay(booking_id, room_index) {
            console.log('ini adalah', booking_id)
            $.ajax({
                type: "GET",
                url: "{{url('data-extend-stay')}}/"+booking_id+'/'+room_index,
                success: function (data) {
                    console.log(data)
                    let extendStays = data;
                    let content = '';

                    if (extendStays.length != 0) {
                        $.each(extendStays, function(key, extendStay){
                            content += `<tr>
                                            <td>${key + 1}</td>
                                            <td>${moment(extendStay.start_date, 'YYYY-MM-DD hh:mm:ss').format('DD-MM-YYYY')}</td>
                                            <td>${moment(extendStay.end_date, 'YYYY-MM-DD hh:mm:ss').format('DD-MM-YYYY')}</td>
                                            <td>${moment(extendStay.end_date).diff(moment(extendStay.start_date), 'days')} Malam</td>
                                            <td>${extendStay.nomor_kamar ?? '-'}</td>
                                        </tr>`
                        });
                    }else{
                        content += `<tr>
                                        <<td colspan="5" class="text-center">Tidak ada data extend!</td>
                                    </tr>`
                    }

                    $('#content-table').html(content);
                }
            });

			// let content = '';

			// let extendStays = new Array();
			// $.each(bookingDetails, function(key, bookingDetail){
			// 	$.each(bookingDetail.extend_stays, function(key, extendStay){
			// 		extendStays.push(extendStay);
			// 	});
			// });
			// extendStays = extendStays.sort(function(a,b){
			// 				return new Date(b.start_date) - new Date(a.start_date);
			// 			});

			// if (extendStays.length != 0) {
			// 	$.each(extendStays, function(key, extendStay){
			// 		content += `<tr>
			// 						<td>${key + 1}</td>
			// 						<td>${extendStay.start_date}</td>
			// 						<td>${extendStay.end_date}</td>
			// 						<td>${moment(extendStay.end_date).diff(moment(extendStay.start_date), 'days')} Malam</td>
			// 						<td>${extendStay.booking_detail.nomor_kamar}</td>
			// 					</tr>`
			// 	});
			// }else{
			// 	content += `<tr>
			// 					<<td colspan="5" class="text-center">Tidak ada data extend!</td>
			// 				</tr>`
			// }
		}

        function insertSelectTransfer() {

            // Ambil data nominal dan voucher
            let nominal =   $('#deposit_transfer_akunting_id').find(':selected').data('nominal');
            let voucher =  $('#deposit_transfer_akunting_id').find(':selected').data('voucher');

            // insert in input nominal and voucher
            $('#nominal_deposit').val(nominal);
            $('#voucher_deposit').val(voucher);
        }

        // $('#nominal_deposit').on('input', function(){
        //     // $('#nominal_deposit').mask("#.##0", {reverse: true});//set separator number
        //     $('#nominal_deposit').mask("#.##0", {
        //                                             reverse: true,
        //                                             translation: {
        //                                                 '#': {
        //                                                 pattern: /-|[0-9*]/,
        //                                                 recursive: true
        //                                                 }
        //                                             }
        //                                         });//set separator number
        // })

        // $('#checkout_nominal_refund').on('input', function(){
        //     $('#checkout_nominal_refund').mask("#.##0", {reverse: true});//set separator number
        // })

        $('#checkout_pembayaran_nominal').on('input', function(){
            // $('#checkout_pembayaran_nominal').mask("#.##0", {reverse: true});//set separator number
            $('#checkout_pembayaran_nominal').mask("#,##0", {reverse: true});//set separator number
        })

        // $('#dayUse_nominal_refund').on('input', function(){
        //     $('#dayUse_nominal_refund').mask("#.##0", {reverse: true});//set separator number
        // })

        // $('#dayUse_pembayaran_nominal').on('input', function(){
        //     $('#dayUse_pembayaran_nominal').mask("#.##0", {reverse: true});//set separator number
        // })

        $('#total_biaya_booking_text_change_room').on('input', function(){
            $('#total_biaya_booking_text_change_room').mask("#.##0", {reverse: true});//set separator number
        })

        $('#per_item').on('input', function(){
            $('#per_item').mask("#,##0", {reverse: true});//set separator number
        })

        $('#per_item_change_room').on('input', function(){
            $('#per_item_change_room').mask("#.##0", {reverse: true});//set separator number
        })

        // function reservation deposit info
        function reservationDepositInfo(bookingid, booking_deposit_length, kode_booking, room_index) {
            console.log(bookingid, booking_deposit_length, kode_booking, room_index)

            $('#container_table_reservation_deposit_info').html(null)
            $('#empty_reservation_deposit_info').addClass('d-none');

            //reservation number
            // $('.reservation-number').text(kode_booking ?? '-');

            console.log(booking_deposit_length > 0)
            // check if booking deposit id is not 0
            if(booking_deposit_length > 0){
				// $('#table_reservation_deposit_info').removeClass('d-none');
				// $('#empty_reservation_deposit_info').addClass('d-none');

                // ajax get data reservation deposit info
                $.ajax({
                    type: "GET",
                    data:{room_index:room_index},
                    url: "{{url('reservation-deposit-info')}}/"+bookingid,
                    success: function (data) {
                        // console.log(data.booking_deposits.length)

                        // penyesuaian booking deposit reservation multiple!
                        if (data.booking_deposits.length  > 0 ) {

                            let table = ``;
                            let cond  = 0;
                            $.each(data.booking_deposits, function (indexdepo, indexvalue) {
                                if (indexvalue.booking.check_status_reservation.length > 0 && indexvalue.room_index == room_index) {

                                    cond++;
                                    let deposit_to = indexvalue?.nominal ?? 0
                                    let deposit_paid = indexvalue?.nomor_kamar ? (indexvalue?.nominal) : 0

                                    // Calculate deposit paid and deposit to become a balance
                                    let balance = deposit_to - deposit_paid

                                    table +=`
                                                <legend style="font-size:14px; font-weight:bold;">#Deposit</legend>
                                                <table class="table-reservation-deposit-info" id="table_reservation_deposit_info">
                                                    <tr>
                                                        <th>Reservation Number</th>
                                                        <td>: <span class="reservation-number">${kode_booking}</span></td>
                                                    </tr>

                                                    <tr>
                                                        <th>Reservation Name</th>
                                                        <td>: <span class="guest-name">${indexvalue?.booking?.nama}</span></td>
                                                    </tr>

                                                    <tr>
                                                        <th>Group Name</th>
                                                        <td>: <span class="group-name">${indexvalue?.booking?.company?.name ?? '-'}</span></td>
                                                    </tr>

                                                    <tr>
                                                        <th>Deposit Date Input</th>
                                                        <td>: <span class="deposit_date_input">${indexvalue?.transaction_date ? moment(indexvalue?.transaction_date, 'YYYY-MM-DD hh:mm:ss').format('DD-MM-YYYY') : '-'}</span></td>
                                                    </tr>

                                                    <tr>
                                                        <th>Arrival</th>
                                                        <td>: <span class="arrival">${indexvalue?.nomor_kamar ? moment(indexvalue?.booking?.booking_details[0].checkin, 'YYYY-MM-DD hh:mm:ss').format('DD-MM-YYYY') : '-'}</span></td>
                                                    </tr>

                                                    <tr>
                                                        <th>Deposit To</th>
                                                        <td>: <span class="deposit-to">${indexvalue?.nominal ? 'Rp. '+ribuanWithComma(deposit_to) : '-'}</span></td>
                                                    </tr>

                                                    <tr>
                                                        <th>Deposit Paid</th>
                                                        <td>: <span class="deposit-paid">${indexvalue?.nomor_kamar ? 'Rp. '+ribuanWithComma(deposit_paid) : '-'}</span></td>
                                                    </tr>

                                                    <tr>
                                                        <th>Balance</th>
                                                        <td>: <span class="balance">${indexvalue?.nominal ? 'Rp. '+ribuanWithComma(balance) : '-' }</span></td>
                                                    </tr>

                                                    <tr>
                                                        <th>Pay Date</th>
                                                        <td>: <span class="pay-date">${indexvalue?.nomor_kamar ? moment(indexvalue?.booking?.booking_details[0]?.checkin, 'YYYY-MM-DD hh:mm:ss').format('DD-MM-YYYY') : '-'}</span></td>
                                                    </tr>
                                                </table>`

                                    // // Define variable
                                    // let deposit_to = indexvalue?.nominal ?? 0
                                    // let deposit_paid = 0

                                    // // Check if deposit paid
                                    // if (indexvalue?.booking?.checkin) {
                                    //     deposit_paid = indexvalue?.nominal ?? 0
                                    // }

                                    // // Calculate deposit paid and deposit to become a balance
                                    // let balance = deposit_to - deposit_paid

                                    // // reservation name
                                    // // $('.guest-name').text(indexvalue?.booking?.nama ?? '-');

                                    // // group name
                                    // $('.group-name').text(indexvalue?.booking?.company?.name ?? '-');

                                    // // Deposit Date Input
                                    // $('.deposit_date_input').text(indexvalue?.transaction_date ? moment(indexvalue?.transaction_date, 'YYYY-MM-DD hh:mm:ss').format('DD-MM-YYYY') : '-')

                                    // // arrival
                                    // $('.arrival').text(indexvalue?.booking?.booking_details[0].checkin ? moment(indexvalue?.booking?.booking_details[0].checkin, 'YYYY-MM-DD hh:mm:ss').format('DD-MM-YYYY') : '-')

                                    // // deposit to
                                    // $('.deposit-to').text(indexvalue?.nominal ? 'Rp. '+deposit_to.toLocaleString('ID') : '-');

                                    // // deposit paid
                                    // $('.deposit-paid').text( indexvalue?.booking?.checkin ? 'Rp. '+deposit_paid.toLocaleString('ID') : '-');

                                    // // balance
                                    // $('.balance').text(indexvalue?.nominal ? 'Rp. '+balance.toLocaleString('ID') : '-' );

                                    // // pay date
                                    // $('.pay-date').text(indexvalue?.booking?.booking_details[0]?.checkin ? moment(indexvalue?.booking?.booking_details[0]?.checkin, 'YYYY-MM-DD hh:mm:ss').format('DD-MM-YYYY') : '-');

                                }else if(indexvalue.booking.check_status_reservation.length < 1 && room_index == 1){

                                    cond++;
                                    let deposit_to = indexvalue?.nominal ?? 0
                                    let deposit_paid = 0

                                    // Calculate deposit paid and deposit to become a balance
                                    let balance = deposit_to - deposit_paid

                                    table +=`
                                                <legend style="font-size:14px; font-weight:bold;">#Deposit</legend>
                                                <table class="table-reservation-deposit-info" id="table_reservation_deposit_info">
                                                    <tr>
                                                        <th>Reservation Number</th>
                                                        <td>: <span class="reservation-number">${kode_booking}</span></td>
                                                    </tr>

                                                    <tr>
                                                        <th>Reservation Name</th>
                                                        <td>: <span class="guest-name">${indexvalue?.booking?.nama}</span></td>
                                                    </tr>

                                                    <tr>
                                                        <th>Group Name</th>
                                                        <td>: <span class="group-name">${indexvalue?.booking?.company?.name ?? '-'}</span></td>
                                                    </tr>

                                                    <tr>
                                                        <th>Deposit Date Input</th>
                                                        <td>: <span class="deposit_date_input">${indexvalue?.transaction_date ? moment(indexvalue?.transaction_date, 'YYYY-MM-DD hh:mm:ss').format('DD-MM-YYYY') : '-'}</span></td>
                                                    </tr>

                                                    <tr>
                                                        <th>Arrival</th>
                                                        <td>: <span class="arrival">${indexvalue?.booking?.booking_details[0].checkin ? moment(indexvalue?.booking?.booking_details[0].checkin, 'YYYY-MM-DD hh:mm:ss').format('DD-MM-YYYY') : '-'}</span></td>
                                                    </tr>

                                                    <tr>
                                                        <th>Deposit To</th>
                                                        <td>: <span class="deposit-to">${indexvalue?.nominal ? 'Rp. '+ribuanWithComma(deposit_to) : '-'}</span></td>
                                                    </tr>

                                                    <tr>
                                                        <th>Deposit Paid</th>
                                                        <td>: <span class="deposit-paid">${indexvalue?.booking?.booking_details[0].checkin ? 'Rp. '+ribuanWithComma(deposit_paid) : '-'}</span></td>
                                                    </tr>

                                                    <tr>
                                                        <th>Balance</th>
                                                        <td>: <span class="balance">${indexvalue?.nominal ? 'Rp. '+ribuanWithComma(balance) : '-' }</span></td>
                                                    </tr>

                                                    <tr>
                                                        <th>Pay Date</th>
                                                        <td>: <span class="pay-date">${indexvalue?.booking?.booking_details[0]?.checkin ? moment(indexvalue?.booking?.booking_details[0]?.checkin, 'YYYY-MM-DD hh:mm:ss').format('DD-MM-YYYY') : '-'}</span></td>
                                                    </tr>
                                                </table>`
                                }
                            });

                            if (cond == 0) {
                                $('#table_reservation_deposit_info').addClass('d-none');
                                $('#empty_reservation_deposit_info').removeClass('d-none');
                            }

                            $('#container_table_reservation_deposit_info').html(table)

                        }else{
                            $('#table_reservation_deposit_info').addClass('d-none');
                            $('#empty_reservation_deposit_info').removeClass('d-none');
                        }
                    }
                });
            }
			else{
				$('#table_reservation_deposit_info').addClass('d-none');
                $('#empty_reservation_deposit_info').removeClass('d-none');
			}
        }

        // function formatRibuan
        function formatRibuan(angka) {
			var value = $('#total_biaya_booking_text_change_room').val()
			// console.log(value)
			$('#total_biaya_booking_change_room').val(value)
            $('#total_biaya_booking_text').mask("#,##0", {reverse: true});//set separator number
        }

        // function log file
        function logFile(booking_id, nama=null,room_index) {
            // console.log(id)

            // ajax get data log file
            $.ajax({
                type: "GET",
                url: "{{url('log-file')}}/"+booking_id,
                data:{
                    room_index:room_index
                },
                success: function (data) {
                    // console.log(data)

                    // Define variable
                    let html_log = '';

                    // Check if data is empty
                    if (data.length == 0) {
                        html_log += `<tr>
                                        <td colspan="4" class="text-center">Tidak ada data!</td>
                                    </tr>`
                    }else{
                        // Define varibale no with value 1
                        let no = 1

                        // foreach data logs
                        $.each(data.logs, function(key, log){
                            let after_json = JSON.parse(log.json_after)

                            // define variable short with empty string
                            let short_before = ''
                            let short_after = ''

                            // define variable long with empty string
                            let long_before = ''
                            let long_after = ''

                            // before
                                // check json from (before)
                                if (log.json_from != 'null') {
                                    // long Before
                                        // Define varibable json parse
                                        let json_parse_before = JSON.parse(log.json_from)

                                        // check long before
                                        if (json_parse_before){
                                            // check long before is array
                                            if (Array.isArray(json_parse_before) || typeof json_parse_before == 'object') {
                                                // Foreach json parse before
                                                $.each(json_parse_before, function(h1, b1){
                                                    // check if b1 is array
                                                    if (Array.isArray(b1)){
                                                        // Foreach b1
                                                        $.each(b1, function(h2, b2){
                                                            // check if b2 is array
                                                            if (Array.isArray(b2)){
                                                                // Foreach b2
                                                                $.each(b2, function(h3, b3){
                                                                    // check if b3 is array
                                                                    if (Array.isArray(b3)) {
                                                                        // Foreach b3
                                                                        $.each(b3, function(h4, b4){
                                                                            // add long before html
                                                                            long_before += `${h4} : ${b4 ?? ''} <br>`
                                                                        })
                                                                    }
                                                                    else {
                                                                        // add long before html
                                                                        long_before += `${h3} : ${b3 ?? ''} <br>`
                                                                    }
                                                                })
                                                            }else {
                                                                // add long before html
                                                                long_before += `${h2} : ${b2 ?? ''} <br>`
                                                            }
                                                        })
                                                    }else {
                                                        // add long before html
                                                        long_before += `${h1} : ${b1 ?? ''} <br>`
                                                    }
                                                })
                                            }
                                            else {
                                                // add long before html with json parse before
                                                long_before += json_parse_before
                                            }

                                            // add long before with action hide
                                            long_before += `<a href="#/" class="link_hide" onclick="hideMore(${log.id})">[hide]</a></div>`
                                        }
                                        else {
                                            // add long before html with empty condition
                                            long_before += `<div class="text-center" style="vertical-align: top;">( --- Empty --- )</div>`
                                        }
                                    // closing long before

                                    // short before
                                        // check if variable json from is more than 10
                                        if (log.json_from) {
                                            if (log.json_from.length > 10) {
                                                // remove element array then add in varibale short before
                                                short_before = log.json_from.substr(0, 15).replace(/{|"/g, "");
                                            }else{
                                                // add json from in varibale short before
                                                short_before = log.json_from
                                            }
                                        }

                                        // add "more" beside the data short before
                                        short_before += `&nbsp<a href="#/" class="link_hide" onclick="showMore(${log.id})">[more]</a>`
                                    // closing short before
                                }else{
                                    // Define variable with value EMPTY
                                    short_before = '-- EMPTY -- '
                                }
                            // closing before

                            // after
                                // check json after
                                if (log.json_after != 'null') {
                                    // long after
                                        // Define varibable json parse
                                        let json_parse_after = JSON.parse(log.json_after)

                                        // check long after
                                        if (json_parse_after){
                                            // check long after is array
                                            if (Array.isArray(json_parse_after) || typeof json_parse_after == 'object') {
                                                // Foreach json parse after
                                                $.each(json_parse_after, function(h1, b1){
                                                    // check if b1 is array
                                                    if (Array.isArray(b1)){
                                                        // Foreach b1
                                                        $.each(b1, function(h2, b2){
                                                            // check if b2 is array
                                                            if (Array.isArray(b2)){
                                                                // Foreach b2
                                                                $.each(b2, function(h3, b3){
                                                                    // check if b3 is array
                                                                    if (Array.isArray(b3)) {
                                                                        // Foreach b3
                                                                        $.each(b3, function(h4, b4){
                                                                            // add long after html
                                                                            long_after += `${h4} : ${b4 ?? ''} <br>`
                                                                        })
                                                                    }
                                                                    else {
                                                                        // add long after html
                                                                        long_after += `${h3} : ${b3 ?? ''} <br>`
                                                                    }
                                                                })
                                                            }else {
                                                                // add long after html
                                                                long_after += `${h2} : ${b2 ?? ''} <br>`
                                                            }
                                                        })
                                                    }else {
                                                        // add long after html
                                                        long_after += `${h1} : ${b1 ?? ''} <br>`
                                                    }
                                                })
                                            }
                                            else {
                                                // add long after html with json parse after
                                                long_after += json_parse_after
                                            }

                                            // add long after with action hide
                                            long_after += `<a href="#/" class="link_hide" onclick="hideMore(${log.id})">[hide]</a></div>`
                                        }
                                        else {
                                            // add long after html with empty condition
                                            long_after += `<div class="text-center" style="vertical-align: top;">( --- Empty --- )</div>`
                                        }
                                    // closing long after

                                    // short after
                                        // check if variable json after is more than 10
                                        if (log.json_after.length > 10) {
                                            // remove element array then add in varibale short after
                                            short_after = log.json_after.substr(0, 15).replace(/{|"/g, "");
                                        }else{
                                            // add json after in varibale short after
                                            short_after = log.json_after
                                        }

                                        // add "more" beside the data short after
                                        short_after += `&nbsp<a href="#/" class="link_hide" onclick="showMore(${log.id})">[more]</a>`
                                    // closing short after
                                }else{
                                    // Define variable with value EMPTY
                                    short_after = '-- EMPTY -- '
                                }
                            // closing after

                            html_log += `<tr>
                                            <td style="vertical-align: top">${no}</td>
                                            <td style="vertical-align: top">${log.user.nama}</td>
                                            <td style="vertical-align: top">${log.created_at}</td>
                                            <td style="vertical-align: top">${log.modul}</td>
                                            <td style="vertical-align: top">
                                                <div class="singkatan${log.id} resetS" style="white-space: nowrap">
                                                    ${short_before == '' ?'<div class="text-center" style="vertical-align: top;">( --- Empty --- )</div>' : short_before}
                                                </div>

                                                <div class="kepanjangan${log.id} resetK" style="display: none;">
                                                    ${long_before == '' ? '<div class="text-center" style="vertical-align: top;">( --- Empty --- )</div>' : long_before}
                                                </div>
                                            </td>

                                            <td style="vertical-align: top">
                                                <div class="singkatan${log.id} resetS" style="white-space: nowrap">
                                                    ${short_after == '' ? '<div class="text-center" style="vertical-align: top;">( --- Empty --- )</div>' : short_after}
                                                </div>

                                                <div class="kepanjangan${log.id} resetK" style="display: none;">
                                                    ${long_after == '' ? '<div class="text-center" style="vertical-align: top;">( --- Empty --- )</div>' : long_after}
                                                </div>
                                            </td>
                                        </tr>`

                            no++
                        });
                    }

                    // Insert html log to table
                    $('#tbody_log_file').html(html_log);
                }
            });
        }

        // function show more
        function showMore(id){
            $(".resetS").show();
            $(".resetK").hide();
			$(".singkatan"+id).hide();
			$(".kepanjangan"+id).show();
		}

        // function hide more
		function hideMore(id){
			$(".kepanjangan"+id).hide();
			$(".singkatan"+id).show();
		}

        // function info remark
        function infoRemark(booking_id){
            // console.log(id)

            // ajax get data reservation deposit info
            $.ajax({
                type: "GET",
                url: "{{url('data-booking')}}/"+booking_id,
                success: function (data) {
                    console.log(data)

                    // check if booking is not null
                    if(data.booking){
                        // Payment Description
                        $('#keterangan_pembayaran').html(data.booking.ket_pembayaran);
                        // $('#keterangan_pembayaran').text(data.booking.ket_pembayaran);

                        // Guest Remark
                        $('#guest_remark').html(data.booking.remark);
                        // $('#guest_remark').text(data.booking.remark);

                        // Reservation Remark
                        $('#reservation_remark').html(data.booking.reservation_remark);
                        // $('#reservation_remark').text(data.booking.reservation_remark);
                    }
                }
            });
        }

		// function guest name
		function guestName(guest_name){
			$(".guest-name").text(guest_name);
		}

		// function room revenue
		function roomRevenue(booking_detail_id){
			// ajax get room revenue
            $.ajax({
                type: "GET",
                url: "{{url('room-revenue')}}/"+booking_detail_id,
                success: function (data) {
                    // console.log(data)

                    // check if data is not null
                    if (data.booking_details) {
                        // insert booking details from data to variable booking details
                        let booking_details = data.booking_details;

                        // check if booking details is more than 0
                        if (booking_details.length > 0) {
                            // Add data to header modal
                                // rate code
                                $('.rate-code').text(booking_details[booking_details.length - 1].rate_codes)

                                // room tag
                                $('.room-tag').text(booking_details[booking_details.length - 1]?.jenis_kamar?.room_tag)
                            // closing add data to header modal

                            // Define variable with empty string
                            let html_room_revenue = '';

                            // Define variable with 0 value
                            let expected_total_revenue = 0;

                            // looping data booking details
                            $.each(booking_details, function (index, booking_detail) {
                                // insert variable html room revenue with html
                                    // Main
                                    html_room_revenue += `<tr>
                                                            <td>${moment(booking_detail.date_now).format('DD-MM-YYYY') ?? ''}</td>
                                                            <td>Roomrate = ${ribuanWithComma(booking_detail.per_item)} - ${segmentasi[booking_detail?.booking?.segmentasi_rate_code]} ${booking_detail?.arrangement ? '1-'+booking_detail.arrangement_codes : ''}</td>
                                                            <td class="text-right"></td>
                                                        </tr>`

                                    // detail include breakfast
                                    // if (booking_detail?.rate_code?.include_breakfast == 1) {
                                        // html_room_revenue += `<tr>
                                        //                         <td></td>
                                        //                         <td>Incl. 1 B'fast</td>
                                        //                         <td class="text-right">${booking_detail.per_item_arr.toLocaleString('ID')}</td>
                                        //                     </tr>`

                                        // Foreach arrangement then insert html room revenue
                                        $.each(booking_detail?.arrangement?.arrangement_code_detail, function (index, arrangement_code_detail) {
                                            html_room_revenue += `<tr>
                                                                    <td></td>
                                                                    <td>Incl. ${arrangement_code_detail.always_one == 1 ? 1 : booking_detail.pax} ${arrangement_code_detail?.menu?.nama ?? ''} ${arrangement_code_detail?.menu?.tipe_menu?.shop?.nama ?? ''}</td>
                                                                    <td class="text-right">${ ribuanWithComma(arrangement_code_detail.always_one == 1 ? arrangement_code_detail.harga : arrangement_code_detail.harga * booking_detail.pax)}</td>
                                                                </tr>`
                                        });
                                    // }

                                    // detail Lodging
                                    html_room_revenue += `<tr>
                                                                <td></td>
                                                                <td>Lodging</td>
                                                                <td class="text-right">${ribuanWithComma( booking_detail.per_item_real + booking_detail.per_item_services + booking_detail.per_item_tax )}</td>
                                                            </tr>`

                                    // total
                                    html_room_revenue += `<tr>
                                                                <td></td>
                                                                <td class="text-right">Total</td>
                                                                <td class="text-right">${ribuanWithComma(booking_detail.per_item)}</td>
                                                            </tr>`
                                // closing insert variable html room revenue with html

                                // Sum all total per item then insert to variable expected total revenue
                                expected_total_revenue += booking_detail.per_item;
                            });

                            // insert expected total revenue to variable html room revenue
                            html_room_revenue += `<tr>
                                                    <td></td>
                                                    <td class="text-right">Expected Total Revenue</td>
                                                    <td class="text-right">${ribuanWithComma(expected_total_revenue)}</td>
                                                </tr>
                                                `

                            // insert html room revenue to table
                            $('#tbody_room_revenue').html(html_room_revenue);
                        }
                    }
                }
            });
		}

        function openModalIncognito(id, status) {

            // input hidden value
            $('#booking_detail_id_incognito').val(id)

           // FOR CHECK THE INCOGNITO STATUS ON THIS BOOKING
           if (status == 0) {

            $('#text-incognito').html('Are you sure want <b>"make"</b> this booking "INCOGNITO"?')

            }else if (status == 1) {

            $('#text-incognito').html('Are you sure want <b>"remove"</b> this booking "INCOGNITO"?')

            }

        }

        //code === 1: for checkin by group name, 2: for checkin by no reservation
        function openModalGroupCheckin(params, code, booking_detail_id) {
            console.log('why')
            $('#set_room_number_form').html(null)
            $('#html_group_checkin_modal').html(null)
            $.ajax({
                type: "get",
                url: "{{url('checkgroupnameroom')}}",
                data: {
                    params : params,
                    code: code
                },
                dataType: "json",
                success: function (data) {

                    console.log(data.options)

                    $('#code_group_checkin').val(code)
                    $('#booking_detail_id_checkin').val(booking_detail_id)

                    if (data.details.length > 0) {

                        $.each(data.details, function (index, value) {

                            // select list room
                            let html_options = '';
                            let option = "";
                            let html_jenis_kamar = "";
                            let html_ratecode = "";
                            let html_no_kamar = "";

                                if (data.options[value.id][value.jns_kamar]) {
                                    html_options += `<option value="">-- Please Choose Room Number --</option>`;

                                    $.each(data.options[value.id][value.jns_kamar], function(index2, value2){
                                        option += `<option value="${value2.no_kamar}">${value2.no_kamar}</option>`
                                    })

                                    html_options += `${option}`;
                                }else{
                                    html_options = `<option value="">-- No Room Available --</option>`;
                                }

                                html_jenis_kamar += `<input type="text" class="form-control mb-2" value="${value.jns_kamar}" disabled>`;
                                html_ratecode += `<input type="text" class="form-control mb-2" value="${value.rate_codes}" disabled>`;
                                html_no_kamar += `
                                    <div class="mb-2">
                                        <input type="hidden" name="nama_guest[]" value="${value.guest_room ?? value?.booking?.nama}" />
                                        <input type="hidden" name="booking_id[]" value="${value.booking_id}" />
                                        <input type="hidden" name="room_index[]" value="${value.room_index}" />
                                        <select name="nomor_kamar[]" id="id_kamar_${index}" onchange="checkNomor(this.id)" class="nomor_kamar_${index} nomor_kamars alert_status_number_select form-control room-number-group-checkin">
                                            ${html_options}
                                        </select>
                                    </div>
                                `;

                            // html group input
                            let html =  `

                                    <legend></legend>

                                        <h4 style="text-align: start;">#${index+1} - ${value.guest_room ?? value?.booking?.nama}</h4>

                                        <div class="row">
                                            <div class="col-md-4">
                                                <div class="form-group">
                                                    <label for="jenis_kamar" class="font-weight-bold">Room Type</label>
                                                    <input type="text" class="form-control mb-2" value="${value.jns_kamar}" disabled>
                                                </div>
                                            </div>
                                            <div class="col-md-4">
                                                <div class="form-group">
                                                    <label for="rate_code" class="font-weight-bold">Rate Code</label>
                                                    <input type="text" class="form-control mb-2" value="${value.rate_codes}" disabled>
                                                </div>
                                            </div>
                                            <div class="col-md-4">
                                                <div class="form-group font-weight-bold">
                                                    <label for="rate_code" class="font-weight-bold">Room Number</label>
                                                    <div class="mb-2">
                                                        ${html_no_kamar}
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <legend></legend>
                                        `;

                            $('#html_group_checkin_modal').append(html)
                            $('.nomor_kamars').select2();

                        });

                    }else{
                        if (code == 1) {
                            $('#html_group_checkin_modal').html('Are You Sure Want to Group Check In with same group name?')
                        } else if(code == 2){
                            $('#html_group_checkin_modal').html('Are You Sure Want to Group Check In with same number reservation?')
                        }
                    }

                }
            });

            // Insert hidden group name.
            $('#group_checkin_group_name').val(params)

            $('.nomor_kamars').select2();
        }

        function checkBeforeCheckout() {
            event.preventDefault();
            let booking_id = $('#checkout_pembayaran_booking_id').val();
            let room_index = $('#checkout_pembayaran_room_index').val();
            var tipe       = $('#form_checkout input[type=radio][name=typebill]:checked').val();
            $.ajax({
                type: "get",
                url: "{{route('check-before-checkout')}}",
                data: {
                    booking_id:booking_id,
                    room_index:room_index
                },
                dataType: "json",
                success: function (response) {
                    if (response < 1) {
                        if (tipe!="multiple") {
                            callModalAlert("Can't checkout, because the roomcharge haven't yet generate")
                        }else{
                            $('#form_checkout').submit()
                        }
                    }else{
                        $('#form_checkout').submit()
                    }
                }
            });
        }

        $('#form_checkout').on('submit', function(e){
            $('#submit_pembayaran_checkout').prop('disabled', true)
            var check_co_awal = $('#checkout_co_awal_status').val()
            var empty = false;
            $('#form_checkout').find('[required]').each(function() {
                if ($(this).val() == '') {
                    empty = true;
                }
            });

            if (check_co_awal == 1) {
                empty = false;
            }
            console.log(empty)
            if (empty) {
                e.preventDefault();
                $("#submit_pembayaran_checkout").attr("disabled", false);
                setTimeout(() => {
                    $('body').unblock()
                    new PNotify({
                        title: 'Error',
                        text: 'Missing required input!, please check again.',
                        icon: 'icon-blocked',
                        type: 'error'
                    });
                }, 5000);
                return false;
            } else {
                console.log('submitted');
                return true
            }
        })

        $('#form_checkout_refund').on('submit', function(){
            $('#btn_refund').prop('disabled', true)
        })

        $('.form-submit-custom').on('submit', function(e){
            $('.btn-submit-custom').prop('disabled', true)
            var empty = false;
            $('.form-submit-custom').find('[required]').each(function() {
                if ($(this).val() == '') {
                    console.log($(this))
                    empty = true;
                }
            });
            console.log(empty)
            if (empty) {
                e.preventDefault();
                $(".btn-submit-custom").attr("disabled", false);
                return false;
            } else {
                return true
            }
        })

        $('.form-submit-custom-ref').on('submit', function(e){
            $('.btn-submit-custom-ref').prop('disabled', true)
            var empty = false;
            $('.form-submit-custom-ref').find('[required]').each(function() {
                if ($(this).val() == '') {
                    console.log($(this))
                    empty = true;
                }
            });
            console.log(empty)
            if (empty) {
                e.preventDefault();
                $(".btn-submit-custom-ref").attr("disabled", false);
                return false;
            } else {
                return true
            }
        })

		//modal
        function checkboxCancelAllReservation(checkbox){
            if(checkbox.checked == true){
                // $('.nomor-kamar-confirm-cancel').removeClass('d-none').addClass('d-none')
                // $('.header-checkbox-cancel-all-reservation').removeClass('col-lg-2').addClass('col-lg-5')

                $("#statusform").attr("action", "{{route('roomview.cancel-all-reservation')}}");
            }else{
                // $('.nomor-kamar-confirm-cancel').removeClass('d-none')
                // $('.header-checkbox-cancel-all-reservation').removeClass('col-lg-5').addClass('col-lg-2')

                $("#statusform").attr("action", "{{route('roomview.update')}}");
            }
        }

        $('.input_comma_custom').on('input', function (){
            $('.submit-button-check').prop('disabled', false)
        })

        // quick booking onsubmit
        $('#form-quick-booking').on('submit', function(e){
            $("#submit").attr("disabled", true);
            var empty = false;
            $('#form-quick-booking').find('[required]').each(function() {
                if ($(this).val() == '') {
                    empty = true;
                }
            });

            console.log(empty)
            if (empty) {
                e.preventDefault();
                $(".submit-quick-booking").attr("disabled", false);
                return false;
            } else {
                return true;
            }
        })

        function showStatsGroup(group_name_params) {
            event.preventDefault()

            let tanggal = $('#tanggal').val();

            $.ajax({
                type: "get",
                url: "{{ route('get-stat-group-name') }}",
                data: {
                    group_name_params:group_name_params,
                    tanggal:tanggal,
                },
                dataType: "json",
                success: function (response) {
                    $('#stat_group').modal('show')

                    $('#title_stat_group').html(group_name_params)

                    $('#count_stat_group').html(response.count_all)
                    $('#ea_stat_group').html(response.expected_arrival)
                    $('#ed_stat_group').html(response.expected_departure)
                    $('#departure_stat_group').html(response.departure)
                    $('#inhouse_stat_group').html(response.in_house)
                }
            });
        }

        // function for hidden selected nomor kamar in another option nomor kamar.
        function hiddenSelectedNomorKamar(){
            // console.log('hidden nomor executed: '+ a)
            $('.nomor_kamars').select2('close');

            let all_select_kamars = $('.nomor_kamars')

            $.each(all_select_kamars, function (index_kamars, value_kamars) {

                let this_id = $(value_kamars).attr('id')
                $("#"+this_id+" option").prop('disabled', false)

                $.each(arrays_kamarss, function(a_indexed, a_valued){
                    // console.log('el:'+$("#"+this_id).val(), 'a_val:'+a_valued)
                    // New Prototype
                    if ($("#"+this_id).val() != a_valued) {
                        $("#"+this_id+" option[value='"+a_valued+"']").prop('disabled', true)
                    }else{
                        $("#"+this_id+" option[value='"+a_valued+"']").prop('disabled', false)
                    }

                });

            })

            $('.nomor_kamars').select2();
        }

        var FormValidation = function(){

        // Validation config
        var _componentValidation = function() {
            if (!$().validate) {
                console.warn('Warning - validate.min.js is not loaded.');
                return;
            }

            // Initialize
            var validator = $('.form-validate-jquery').validate({
                focusInvalid: true,
                ignore: 'input[type=hidden], .select2-search__field', // ignore hidden fields
                errorClass: 'validation-invalid-label',
                //successClass: 'validation-valid-label',
                validClass: 'validation-valid-label',
                highlight: function(element, errorClass) {
                    $(element).removeClass(errorClass);
                    $(element).closest('.addError').addClass('has-error');
                },
                unhighlight: function(element, errorClass) {
                    $(element).removeClass(errorClass);
                    $(element).closest('.addError').removeClass('has-error');
                },
                // success: function(label) {
                //    label.addClass('validation-valid-label').text('Success.'); // remove to hide Success message
                //},

                // Different components require proper error label placement
                errorPlacement: function(error, element) {
                    // Unstyled checkboxes, radios
		                if (element.parents().hasClass('form-check')) {
							$(element).closest('.addError').addClass('has-error');
		                    error.appendTo( element.parents('.form-check').parent() );
		                }

		                // Input with icons and Select2
		                else if (element.parents().hasClass('form-group-feedback') || element.hasClass('select2-hidden-accessible')) {
							$(element).closest('.addError').addClass('has-error');
		                    error.appendTo( element.parent() );
		                }

		                // Input group, styled file input
		                else if (element.parent().is('.uniform-uploader, .uniform-select') || element.parents().hasClass('input-group')) {
							$(element).closest('.addError').addClass('has-error');
		                    error.appendTo( element.parent().parent() );
		                }

		                // Other elements
		                else {
							$(element).closest('.addError').addClass('has-error');
		                    error.insertAfter(element);
		                }
                },
                messages: {
                    hotel_id: {
                        required: 'Mohon diisi.'
                    },
                },
            });

            // Reset form
            $('#reset').on('click', function() {
                validator.resetForm();
            });
        };

        // Return objects assigned to module
        return {
            init: function() {
                _componentValidation();
            }
        }
        }();

        var FormValidationCheckout = function() {

        // Validation config
        var _componentValidation = function() {
            if (!$().validate) {
                console.warn('Warning - validate.min.js is not loaded.');
                return;
            }

            // Initialize
            var validator = $('.form-validate-checkout').validate({
                focusInvalid: false,
                ignore: 'input[type=hidden], .select2-search__field', // ignore hidden fields
                errorClass: 'validation-invalid-label',
                //successClass: 'validation-valid-label',
                validClass: 'validation-valid-label',
                highlight: function(element, errorClass) {
                    $(element).removeClass(errorClass);
                    $(element).closest('.addError').addClass('has-error');
                },
                unhighlight: function(element, errorClass) {
                    $(element).removeClass(errorClass);
                    $(element).closest('.addError').removeClass('has-error');
                },
                // success: function(label) {
                //    label.addClass('validation-valid-label').text('Success.'); // remove to hide Success message
                //},

                // Different components require proper error label placement
                errorPlacement: function(error, element) {

                    // Unstyled checkboxes, radios
                    if (element.parents().hasClass('form-check')) {
                        $(element).closest('.addError').addClass('has-error');
                        error.appendTo( element.parents('.form-check').parent() );
                    }

                    // Input with icons and Select2
                    else if (element.parents().hasClass('form-group-feedback') || element.hasClass('select2-hidden-accessible')) {
                        $(element).closest('.addError').addClass('has-error');
                        error.appendTo( element.parent() );
                    }

                    // Input group, styled file input
                    else if (element.parent().is('.uniform-uploader, .uniform-select') || element.parents().hasClass('input-group')) {
                        $(element).closest('.addError').addClass('has-error');
                        error.appendTo( element.parent().parent() );
                    }

                    // Other elements
                    else {
                        $(element).closest('.addError').addClass('has-error');
                        error.insertAfter(element);
                    }
                },
                messages: {
                },
            });

            // Reset form
            $('#reset').on('click', function() {
                validator.resetForm();
            });
        };

        // Return objects assigned to module
        return {
            init: function() {
                _componentValidation();
            }
        }
        }();



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

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

        //Payment Section @quickbooking
        $('.type_payment_book').on('change', function() {
            if (this.value == '1') {
                // alert('partial_detail')
                $('#section_payment_book').show()
                $('#nominal_deposit_book').attr('required', 'required');
                $('#jenis_deposit_book').attr('required', 'required');
                // $('#section_payment_book input').prop('disabled', false)
            }else if(this.value == '0'){
                // alert('all')
                $('#section_payment_book').hide()
                $('#nominal_deposit_book').removeAttr('required');
                $('#jenis_deposit_book').removeAttr('required');
                // $('#section_payment_book input').prop('disabled', true)
            }
        })
        //Payment Section @quickbooking

        function showModalDetailReservation(booking_id, detail_id) {
            $.ajax({
                type: "get",
                url: "{{url('get-detail-reservation-data')}}",
                data: { booking_id:booking_id,
                        detail_id:detail_id
                    },
                dataType: "json",
                success: function (data) {
                    console.log(data)
                    $('#detail_reservation #reservation_no_detail').html(data.kode_booking)
                    $('#detail_reservation #guest_name_detail').html(data.guest_name)
                    $('#detail_reservation #start_date_detail').html(data.start_date)
                    $('#detail_reservation #end_date_detail').html(data.end_date)
                    $('#detail_reservation #start_time_detail').html(data.start_time)
                    $('#detail_reservation #end_time_detail').html(data.end_time)
                    $('#detail_reservation #segmentasi_detail').html(data.segmentasi)
                    $('#detail_reservation #created_at_detail').html(data.created_date)
                    $('#detail_reservation #night_detail').html(data.night)
                    $('#detail_reservation #pax_detail').html(data.pax)
                    $('#detail_reservation #room_roomtype_detail').html(data.room+'/'+data.room_type)
                    $('#detail_reservation #room_roomrate_detail').html(ribuanWithComma(data.room_rate)+'/night')

                    $('#detail_reservation #total_detail').html(data.total)
                    $('#detail_reservation #paid_detail').html(data.paid)
                    $('#detail_reservation #balance_detail').html(data.balance)

                    if (data.paid_out > 0) {
                        $('#detail_reservation #paid_out').show()
                        $('#detail_reservation #paid_out_detail').html(ribuanWithComma(data.paid_out))
                    }else{
                        $('#detail_reservation #paid_out').hide()
                        $('#detail_reservation #paid_out_detail').html(0)
                    }

                    $('#detail_reservation').modal('show')
                }
            });
        }

	</script>

    <script>
        // add div transaction
        $(document).on('click', '.buttonaddmoretransaction', function() {
            var maindata = document.getElementById('maintransaction');
            var nomor = $('#noadditionaltransaction').val()

            console.log(nomor)
            html = ''

                html += `<div id='add_trans_${nomor}'>`

                html +=  '<div class="form-group row">'
                    html += '<label class="col-form-label col-sm-3">Shop</label>'
                    html += '<div class="col-sm-9">'

                    html += `<select data-add_trans_id="${nomor}" class="form-control border-1 border-teal getSelectTipeMenus getSelectMenuList" name="shop_id[]" id="shop_id${nomor}">'
                                <option value="">--Select Shop--</option>
                                    @foreach ($shops as $shop)
                                        <option value="{{$shop->id}}"
                                                data-service="{{$shop->services}}"
                                                data-ppn="{{$shop->ppn}}"
                                        >
                                            {{$shop->nama}}
                                        </option>
                                    @endforeach
                                </select>
                            </div>`
                html += '</div>'

                html += `<div class="form-group row">
                            <label class="col-form-label col-lg-3">Item Type</label>
                            <div class="col-lg-9">
                                <select name="tipe_menu_id[]" id="tipe_menu_id${nomor}"
                                        class="form-control form-control-select2 getSelectMenuList resetjumlahtotal"
                                        data-container-css-class="border-teal"
                                        data-dropdown-css-class="border-teal"
                                        data-add_trans_id="${nomor}"
                                        required
                                        >
                                    <option value="">-- Select Item Type --</option>
                                </select>
                            </div>
                        </div>`

                html += `<div class="form-group row">
                            <label class="col-form-label col-lg-3">Menu List</label>
                            <div class="col-lg-9">
                                <select name="menu_id[]" id="menu_id${nomor}"
                                        class="form-control form-control-select2"
                                        data-container-css-class="border-teal"
                                        data-dropdown-css-class="border-teal"
                                        data-add_trans_id="${nomor}"
                                        onchange="hitungtotal(${nomor})"
                                        required
                                >
                                    <option value="">-- Select Menu --</option>
                                </select>
                            </div>
                        </div>`

                html += `<div class="non_paid_out">
                        <div class="form-group row">
                            <label for="jumlah" class="col-form-label col-lg-3">Qty</label>
                            <div class="col-lg-4">
                                <input type="number" id="jumlah${nomor}" name="jumlah[]" onchange="hitungtotal(${nomor})" class="form-control border-teal border-1 hitungjumlah" min="1" value="1" autofocus required>
                            </div>
                        </div>
                        </div>`

                html += `<div class="form-group row">
                            <label for="total_biaya" id="label_total_biaya${nomor}" class="col-form-label col-lg-3">Sub Total</label>
                            <div class="col-lg-4">
                                <input type="text" id="subtotal${nomor}" class="form-control border-teal border-1 changesubtotal" data-add_trans_id="${nomor}" onchange="subTotalNominal(this.value, ${nomor})" readonly>
                                <input type="hidden" id="total_biaya${nomor}" name="total_biaya[]" class="form-control border-teal border-1 " required>
                            </div>
                        </div>`

                html += '<div class="non_paid_out">'
                    html += `<div class="form-group row">
                                <label for="service" class="col-form-label col-lg-3">Service</label>
                                <div class="col-lg-4">
                                    <input type="text" id="service${nomor}" name="service[]" class="form-control border-teal border-1 " required readonly>
                                </div>
                                <label for="ppn" class="col-form-label col-lg-1">Gov. Tax</label>
                                <div class="col-lg-3">
                                    <input type="text" id="ppn${nomor}" name="ppn[]" class="form-control border-teal border-1 " required readonly>
                                </div>
                            </div>`

                    html += `<div class="form-group row">
                                <label for="grand_total" class="col-form-label col-lg-3">Grand Total</label>
                                <div class="col-lg-4">
                                    <input type="text" id="grand_total${nomor}" name="grand_total[]" class="form-control border-teal border-1 input_comma_custom" onchange="calculateReverse(this.value, ${nomor})" required>
                                </div>
                            </div>`
                html += '</div>'

                html+= `<div class="form-group row">
                            <label for="description_transaction" class="col-form-label col-lg-3">Description</label>
                            <div class="col-lg-9">
                                <input type="text" id="description_transaction${nomor}" name="description[]" class="form-control border-teal border-1 description_input">
                            </div>
                        </div>`



                html += `<button class="form-control btn-success buttonaddmoretransaction" type="button"><i class="icon-plus22"></i> Add More</button>`
                html += `<button class='form-control btn-danger buttonremovetransaction' data-add_trans_id='${nomor}' type='button'><i class='icon-minus2'></i> Remove Transaction </button>`
                html += '<hr>'
                html += '</div>'

            // tambah nomor
            var plusnomor = parseInt(nomor) + 1
            $('#noadditionaltransaction').val(plusnomor)

            $('#additional_transaction').append(html);
        })

        // delete div transaction
        $(document).on('click', '.buttonremovetransaction', function() {
            var nomor = $(this).data('add_trans_id')
            console.log(nomor)
            $('#add_trans_'+nomor).remove()
        })

        // Reset div add transaction
        $('#transaksimodal').on('hidden.bs.modal', function () {
            // refresh current page
            $('#additional_transaction').html(null);

            // reset form
            $('#transaksimodal').find('form').trigger('reset');
            $('.getSelectTipeMenus').val('').trigger('change');

            // reset rate code
            // $('#rate_code').val('').trigger('change')
        })

        // Reset div add transaction
        $('#checkout_pembayaranmodal').on('hidden.bs.modal', function () {
            // reset form
            $('#checkout_pembayaranmodal input[name="typebill"]').prop('checked', false);
            $('#tipe-bill-single-co').prop('checked', true);
            $('.form-check-input-styled').uniform();
        })

        // Reset div add transaction
        $('#dayUse_pembayaranModal').on('hidden.bs.modal', function () {
            // reset form
            $('#dayUse_pembayaranModal input[name="typebill"]').prop('checked', false);
            $('#tipe-bill-single').prop('checked', true);
            $('.form-check-input-styled').uniform();
        })

        function extendstayindividual(id, no_kamar, room_index) {
            $.ajax({
                type: "get",
                url: "{{url('checkoutgetindividual-get')}}",
                data: {
                    booking_id:id,
                    no_kamar:no_kamar,
                    room_index:room_index,
                },
                async: false,
                cache: false,
                timeout: 30000,
                dataType: "json",
                success: function (response) {
                    var html = '';
                    $('#booking_id_es').val(id)
                    $.each(response.bdetails, function (index, value) {
                        html += `
                            <div class="row">
                                <input type="hidden" name="detailid[${index}]" value="${value.id}">
                                <input type="hidden" id="end_date_es${index}" value="${value.end_date}">
                                <div class="col-sm-1 col-form-label">
                                    <div class="form-group">
                                        ${value?.current}
                                    </div>
                                </div>
                                <div class="col-sm-3 col-form-label">
                                    <div class="form-group">
                                        ${value?.guest_room}
                                    </div>
                                </div>
                                <div class="col-sm-3 col-form-label">
                                    <div class="form-group">
                                        ${moment(value?.start_date).format('DD-MM-YYYY')} - ${moment(value?.end_date).format('DD-MM-YYYY')}
                                    </div>
                                </div>
                                <div class="col-sm-2">
                                    <div class="form-group font-weight-bold">
                                        <input type="number" id="night_change_es${index}" name="night[${index}]" onchange="changedatees(${index})" class="form-control" value="1" min="1">
                                    </div>
                                </div>
                                <div class="col-sm-3 col-form-label">
                                    <div class="form-group" id="next-date-es${index}">
                                        ${moment(value?.end_date).format('DD-MM-YYYY')} - ${moment(value?.end_date).add(1, 'days').format('DD-MM-YYYY')}
                                    </div>
                                </div>
                            </div>
                        `;
                    });
                    $('#extendgroup-list').html(html)
                    $('#modal-extendstay').modal('show')
                }
            });
        }

        function changedatees(index) {
            var end_date = $('#end_date_es'+index).val()
            var night = $('#night_change_es'+index).val()

            var start = moment(end_date).format('DD-MM-YYYY')
            var end   = moment(start,"DD-MM-YYYY").add('days', night).format('DD-MM-YYYY');
            var date  = start+' - '+end
            $('#next-date-es'+index).html(date)
        }

        function opsidiskonbooking(data){
            if(data){
                console.log('ada')
                $('#diskon').val(0)
                $('#disctype').val(1)
                $('#discount_value_man').prop('disabled', false).prop('required', true).val(0)
                calculatePrice(1, '', 'diskon')
            }else{
                console.log('tdk')
                $('#diskon').val(0)
                $('#disctype').val(1)
                $('#discount_value_man').prop('disabled', true).prop('required', false).val(0)
                calculatePrice(1)
                new PNotify({
                    title: 'Alert',
                    text: 'Reset to default rate.'
                });
            }
        }
    </script>

@endsection