@extends('layout')

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

@section('content')

<!-- Page header -->
<div class="page-header page-header-light">
	<div class="page-header-content header-elements-md-inline">
		<div class="page-title d-flex">
			<h3 class="font-weight-bold"><span class="font-weight-light">Edit Delivery</h3>
				<a href="#" class="header-elements-toggle text-default d-md-none"><i class="icon-more"></i></a>
			</div>
		</div>
	</div>
	<!-- /page header -->

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

					<div class="row">
						<div class="col-md-6">
							<div class="form-group">

								<div class="row">
									<div class="col-md-4">Customer</div>
									<div class="col">: {{ucwords(@$delivery->user->nama)}}</div>
								</div>
								<div class="row">
									<div class="col-md-4">No Surat Jalan</div>
									<div class="col">: <span class="font-weight-semibold">{{$delivery->no_surat_jalan}}</span></div>
								</div>
								{{-- <div class="row">
									<div class="col-md-4">Alamat kirim</div>
									<div class="col">: {{$delivery->alamat_kirim}}</div>
								</div> --}}
								<div class="row">
									<div class="col-md-4">Notes</div>
									<div class="col">: {{$delivery->notes}}</div>
								</div>

							</div>
						</div>
						<div class="col-md-6">
							<div class="form-group">
								<div class="row">
									<div class="col-md-4">Status Kirim</div>
									<div class="col">: {{ config('custom.status_kirim.'.$delivery->status_kirim) }}</div>
								</div>
								<div class="row">
									<div class="col-md-4">Jenis Pengiriman</div>
									<div class="col">: {{ config('custom.jenis_pengiriman.'.$delivery->jenis_pengiriman) }}</div>
								</div>
								<div class="row">
									<div class="col-md-4">Ekspedisi</div>
									<div class="col">: {{  @$delivery->ekspedisi_delivery->nama}} </div>
								</div>
							</div>
						</div>
					</div>

					<legend class="text-uppercase font-size-sm font-weight-bold">Detail</legend>

					<table class="table ">
						<thead>
							<tr>
								<th>No.</th>
								<th>No. Invoice</th>
								<th>Info Resi</th>
								<th>Total Tagihan</th>
								<th>Tanggal Lunas</th>
							</tr>
						</thead>
						<tbody>

							@php
								$i = 1;
							@endphp
							
							{{-- ambil dari invoice detail, sistem baru --}}
							@if (count($delivery->invoice_detail) > 0)
								@foreach ($delivery->invoice_detail as $detail)
									<tr>
										<td>{{ $i }}</td>
										<td>
											{{ @$detail->invoice->no_invoice }}
										</td>
										<td>
											<a href="{{url('invoice/'.@$detail->invoice->id)}}" target="_blank">
												<span class="font-weight-semibold">{{ @$detail->invoice->no_invoice }}</span>
											</a>
											<br>
											<span>{{config('custom.status_invoice.'.@$detail->invoice->status)}}</span>
										</td>
										<td>Rp {{ ribuan(@$detail->invoice->total_tagihan) }}</td>
										<td>{{@$detail->invoice->tgl_lunas?@$detail->invoice->tgl_lunas:'-'}}</td>
									</tr>
									@php
									$i++;
									@endphp
								@endforeach

							{{-- ambil dari delivery detail, handle data lama --}}
							@else

								@foreach ($delivery->delivery_detail as $detail)
								<tr>
									<td>{{ $i }}</td>
									<td class="text-warning">{{@$detail->invoice->no_invoice?@$detail->invoice->no_invoice:'-'}}</td>
									<td>
										@foreach ($detail->invoice->invoice_detail as $inv_detail)
											@if (!$loop->first)
												<br>
											@endif
											{{-- {{@$inv_detail3->receipt_detail->receipt->shipping_mark}} --}}
											<a href="{{url('receipt/'.@$inv_detail->receipt_detail->receipt->id)}}" target="_blank">
												<span class="font-weight-semibold">{{@$inv_detail->receipt_detail->receipt->no_resi}}</span> 
											</a>
											<br>
											<span>Kode Detail :</span> <span class="font-weight-semibold">{{@$inv_detail->barang_id}}</span>
										@endforeach
									</td>
									<td>Rp {{ribuan(@$detail->invoice->total_tagihan)}}</td>
									<td>{{@$detail->invoice->tgl_lunas?@$detail->invoice->tgl_lunas:'-'}}</td>
								</tr>
								@php
								$i++;
								@endphp
								@endforeach
							@endif


						</tbody>
					</table>

					<br>
					<form class="form-validate-jquery" action="{{ route('delivery.update', $delivery->id)}}" method="post">
						@method('PATCH')
						@csrf

					<div class="form-group row">
						<label class="col-form-label col-lg-2">Status Kirim</label>
						<div class="col-lg-4">
							<select name="status_kirim" id="status_kirim" class="form-control form-control-select2" disabled>
								<option value="" selected disabled>-- Pilih Status Kirim --</option>
								@foreach (config('custom.status_kirim') as $key => $value)
									<option value="{{$key}}" {{$delivery->status_kirim == $key? 'selected':''}}>{{$value}}</option>
								@endforeach
								{{-- <option value="{{$key}}" {{$delivery->status_kirim == $key? 'selected':''}}>{{$value}}</option> --}}
							</select>
							<input type="hidden" name="status_kirim" value="{{$delivery->status_kirim}}">
						</div>

						<label class="col-form-label col-lg-2">Jenis Pengiriman</label>
						<div class="col-lg-4">
							<select name="jenis_pengiriman" id="jenis_pengiriman" class="form-control form-control-select2" required>
								@foreach(config('custom.jenis_pengiriman') as $key => $value)
									@if ($key == 0)
										@continue
									@endif
									<option value="{{$key}}" {{$delivery->jenis_pengiriman == $key? 'selected':''}}>{{$value}}</option>

								@endforeach
							</select>
						</div>
					</div>

					<div class="form-group row" id="div_ekspedisi" style="display:{{$delivery->jenis_pengiriman == 2? '':'none'}}">
						<label class="col-form-label font-weight-semibold col-lg-2">Ekspedisi</label>
						<div class="col-lg-4">
							<select class="form-control form-control-select2" id="ekspedisi_id" name="ekspedisi_id">
								<option value="">-- Choose Ekspedisi --</option>
								@foreach($ekspedisidelivery as $ekspedisi)
									<option value="{{$ekspedisi->id}}" {{ $delivery->ekspedisi_id == $ekspedisi->id? 'selected':'' }}>{{$ekspedisi->nama}}</option>
								@endforeach
								<option value="input_ekspedisi">-- Ekspedisi Baru --</option>
							</select>
						</div>
						<div class="col-lg-4">
							<input type="text" class="form-control new_ekspedisi" id="new_ekspedisi" name="new_ekspedisi" disabled>
						</div>
					</div>

					<div class="form-group row" id="formtgl_pengiriman" @if($delivery->status_kirim!=2) style="display:none" @endif>
						<!-- Tanggal Pengiriman / Pengambilan -->
						<label class="col-form-label col-lg-2">Tanggal Pengiriman / Pengambilan</label>
						<div class="col-lg-2">
							<input type="text" name="tgl_kirimambil" id="tgl_kirimambil" class="form-control daterange-single" value="{{ date('Y-m-d', strtotime($delivery->tgl_kirimambil)) }}" {{$delivery->status_kirim!=2?'disabled':''}}>
						</div>
						<div class="col-lg-2">
							<div class="input-group">
								<span class="input-group-prepend">
									<span class="input-group-text"><i class="icon-alarm"></i></span>
								</span>
								<input type="text" id="jam_pengiriman" name="jam_pengiriman" class="form-control pickatime-editable" value="{{ date('H:i', strtotime($delivery->tgl_kirimambil)) }}">
							</div>
						</div>

						<!-- Driver Pengiriman -->
						{{-- <label class="col-form-label col-lg-2 driver-pengiriman">
							Driver Pengiriman
						</label>
						<div class="col-lg-4 driver-pengiriman">
							<select name="driver_pengiriman"
									class="form-control form-control-select2 driver_pengiriman_input"
							>
								<option value="">** Pilih Driver **</option>
								@foreach($drivers as $driver)
								<option value="{{$driver->id}}" {{$delivery->driver_id == $driver->id ? 'selected' : ''}}>{{ucwords($driver->nama)}}</option>
								@endforeach
							</select>
						</div> --}}

					</div>

					<div class="form-group row" id="formtgl_selesai" @if($delivery->status_kirim!=3) style="display:none" @endif>
						<label class="col-form-label col-lg-2">Tanggal Selesai</label>
						<div class="col-lg-2">
							<input type="text" name="tgl_selesai" id="tgl_selesai" class="form-control daterange-single" value="{{ $delivery->tgl_selesai?date('Y-m-d', strtotime($delivery->tgl_selesai)):date('Y-m-d') }}" {{$delivery->status_kirim != 3? 'disabled':''}}>
						</div>
						<div class="col-lg-2">
							<div class="input-group">
								<span class="input-group-prepend">
									<span class="input-group-text"><i class="icon-alarm"></i></span>
								</span>
								<input type="text" id="jam_selesai" name="jam_selesai" class="form-control pickatime-editable" value="{{ date('H:i', strtotime($delivery->tgl_selesai)) }}">
							</div>
						</div>

						<!-- Driver Pengiriman -->
						{{-- <label class="col-form-label col-lg-2 driver-pengiriman">
							Driver Pengiriman
						</label>
						<div class="col-lg-4 driver-pengiriman">
							<select name="driver_pengiriman"
									class="form-control form-control-select2 driver_pengiriman_input"
							>
								<option value="">** Pilih Driver **</option>
								@foreach($drivers as $driver)
								<option value="{{$driver->id}}" {{$delivery->driver_id == $driver->id ? 'selected' : ''}}>{{ucwords($driver->nama)}}</option>
								@endforeach
							</select>
						</div> --}}

					</div>

					@php
						$readonly = '';
						$alamat = $telp = $map = '';
					@endphp
					<div class="form-group row">
						<label class="col-form-label col-lg-2">Alamat Customer</label>
						<div class="col-lg-10">
							<select class="form-control form-control-select2" name="alamat_customer" id="alamat_customer">
								<option value="new" data-telp_alamat="" data-map="">-- New Address --</option>
								<option value="default" data-telp_alamat="{{$info_customer->telp}}" data-map="{{$info_customer->map}}" {{$delivery->alamat_kirim == $alamatkirim? 'selected':''}}>{{$alamatkirim}}</option>
								@php
									if ($delivery->alamat_kirim == $alamatkirim) {
										$readonly = 'readonly';
										$alamat = $delivery->alamat_kirim;
										$telp = $info_customer->telp;
										$map = $info_customer->map;
									}
								@endphp
								@if (count($info_customer->multi_alamat) > 0)
									@foreach ($info_customer->multi_alamat as $mul_alamat)
										<option value="{{$mul_alamat->id}}" data-telp_alamat="{{$mul_alamat->telp}}" data-map="{{$mul_alamat->map}}" {{$delivery->alamat_kirim == $mul_alamat->alamat? 'selected':''}}>{{$mul_alamat->alamat}}</option>

										@php
											if ($delivery->alamat_kirim == $mul_alamat->alamat) {
												$readonly = 'readonly';
												
												$alamat = $mul_alamat->alamat;
												$telp = $mul_alamat->telp;
												$map = $mul_alamat->map;
											}
										@endphp
									@endforeach
								@endif
							</select>
						</div>
					</div>

					<div class="form-group row mb-4">
						<label class="col-form-label col-lg-2">No. Telpon Alamat</label>
						<div class="col-lg-10">
							{{-- <input class="form-control" type="text" name="telpon_alamat" id="telpon_alamat" value="{{$info_customer->telp}}" readonly> --}}
							<input class="form-control" type="text" name="telpon_alamat" id="telpon_alamat" value="{{$telp}}" readonly>
						</div>
					</div>

					<div class="form-group row mb-4">
						<label class="col-form-label col-lg-2">Link Map</label>
						<div class="col-lg-10">
							<input class="form-control" type="text" name="map_alamat" id="map_alamat" value="{{$map}}" {{$readonly}}>
						</div>
					</div>

					<div class="form-group row mb-4">
						<label class="col-form-label col-lg-2">Alamat Kirim</label>
						<div class="col-lg-10">
							<textarea class="form-control" id="alamat_kirim" name="alamat_kirim" cols="30" rows="4" {{$readonly}}>{{$alamat}}</textarea>
						</div>
					</div>

					<hr>

					<div class="form-group row mb-4">
						<label class="col-form-label col-lg-2">Notes</label>
						<div class="col-lg-10">
							<textarea class="form-control" id="notes" name="notes" cols="30" rows="4">{{$delivery->notes}}</textarea>
						</div>
					</div>


					<div class="text-right mb-3">
						<button type="submit" class="btn btn-primary text-uppercase">Submit <i class="icon-paperplane ml-2"></i></button>
					</div>
				</form>

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

	<!-- Danger modal -->
	<div id="modal_theme_danger" class="modal fade" tabindex="-1">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-danger" align="center">
					<button id="closemodal" type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<form action="" method="post" id="delform">
					@csrf
					@method('DELETE')
					<div class="modal-body" align="center">
						<h2> Hapus Data? </h2>
					</div>

					<div class="modal-footer">
						<button type="button" class="btn btn-link" data-dismiss="modal">Batal</button>
						<button type="submit" class="btn bg-danger" disabled>Hapus</button>
					</div>
				</form>
			</div>
		</div>
	</div>

	@endsection

	@section('js')
	<script src="{{asset('global_assets/js/plugins/media/fancybox.min.js')}}"></script>
	<script src="{{asset('global_assets/js/plugins/notifications/pnotify.min.js')}}"></script>
	<script src="{{asset('global_assets/js/plugins/tables/datatables/datatables.min.js')}}"></script>
	<script src="{{asset('global_assets/js/plugins/forms/validation/validate.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/forms/styling/uniform.min.js')}}"></script>
	<script src="{{asset('global_assets/js/main/bootstrap.bundle.min.js')}}"></script>

	<script src="{{asset('global_assets/js/plugins/ui/moment/moment.min.js')}}"></script>
	{{-- <script src="{{asset('global_assets/js/demo_pages/picker_date.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/daterangepicker.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/loaders/blockui.min.js')}}"></script>

	<script src="{{asset('global_assets/js/plugins/media/fancybox.min.js')}}"></script>
	<script src="{{asset('assets/js/app.js')}}"></script>
	<script src="{{asset('global_assets/js/demo_pages/form_inputs.js')}}"></script>

	<script type="text/javascript">
		$(document).on('change', '#alamat_customer', function() {
			var alamat = $('#alamat_customer').find(':selected').text();
			var alamat_val = $('#alamat_customer').val();
			var alamat_telp = $('#alamat_customer').find(':selected').attr('data-telp_alamat');
			var alamat_map = $('#alamat_customer').find(':selected').attr('data-map');
			if (alamat_val != 'new') {
				$('#alamat_kirim').val(alamat);
				$('#telpon_alamat').val(alamat_telp);
				$('#map_alamat').val(alamat_map);

				$('#alamat_kirim').attr('readonly', true);
				$('#telpon_alamat').attr('readonly', true);
				$('#map_alamat').attr('readonly', true);
			} else {
				$('#alamat_kirim').val('');
				$('#telpon_alamat').val('');
				$('#map_alamat').val('');
				$('#telpon_alamat').attr('readonly', false);
				$('#alamat_kirim').attr('readonly', false);
				$('#map_alamat').attr('readonly', false);
			}
		})

		// jika Jenis Pengiriman Tidak sama dengan
		@if($delivery->jenis_pengiriman != 1)
		// $(".driver-pengiriman").css("display", "");
		@else
		// $(".driver-pengiriman").css("display","none");
		@endif

		@if($delivery->status_kirim == 1)
		$('#formtgl_selesai').find('select').attr('disabled', 'disabled');
		$('#formtgl_pengiriman').find('select').attr('disabled', 'disabled');
		@elseif($delivery->status_kirim == 2)
		$('#formtgl_selesai').find('select').attr('disabled', 'disabled');
		$('#formtgl_pengiriman').find('select').removeAttr('disabled');
		@else
		$('#formtgl_selesai').find('select').removeAttr('disabled');
		$('#formtgl_pengiriman').find('select').attr('disabled');
		@endif

		$("#jenis_pengiriman").on('change', function(){
			var val = $(this).val();
			if(val == 2){
				// $("#pilih_driver").show();
				$('#div_ekspedisi').show()
			}else{
				// $("#pilih_driver").hide();
				$('#div_ekspedisi').hide()
			}
		});

		$("#ekspedisi_id").on('change', function(){
			var val = $(this).val();
			if(val == 'input_ekspedisi'){
				$('#new_ekspedisi').removeAttr('disabled')
			}else{
				$('#new_ekspedisi').val('')
				$('#new_ekspedisi').prop('disabled', true)
			}
		});

		$(document).on('change','#status_kirim', function() {
			let stat = $('#status_kirim').find('option:selected').val();

			if(stat==2){
				$('#formtgl_pengiriman').show();
				$('#formtgl_pengiriman').find('select').removeAttr('disabled');
				$('#formtgl_selesai').find('select').attr('disabled', 'disabled');

				$('#tgl_kirimambil').prop('required',true);
				$('#tgl_kirimambil').removeAttr('disabled');

				$('#formtgl_selesai').hide();
				$('#tgl_selesai').prop('required',false);
			} else if (stat==3) {
				$('#formtgl_selesai').show();
				$('#formtgl_selesai').find('select').removeAttr('disabled');
				$('#formtgl_pengiriman').find('select').attr('disabled', 'disabled');

				$('#tgl_selesai').prop('required',true);
				$('#tgl_selesai').removeAttr('disabled');

				$('#formtgl_pengiriman').hide();
				$('#tgl_kirimambil').prop('required',false);
			}else {
				$('#formtgl_pengiriman').hide();
				$('#tgl_kirimambil').prop('required',false);
				$('#formtgl_selesai').hide();
				$('#tgl_selesai').prop('required',false);

				$('#formtgl_selesai').find('select').attr('disabled', 'disabled');
				$('#formtgl_pengiriman').find('select').attr('disabled', 'disabled');
			}
		});

	</script>

<script>
	var DateTimePickers = function() {

		var _componentDaterange = function() {
			if (!$().daterangepicker) {
				console.warn('Warning - daterangepicker.js is not loaded.');
				return;
			}
			// Single picker
			$('.daterange-single').daterangepicker({
				singleDatePicker: true,
				locale: {
                    format:'YYYY-MM-DD'
                }
			});

		};

		// Pickatime picker
		var _componentPickatime = function() {
			if (!$().pickatime) {
				console.warn('Warning - picker.js and/or picker.time.js is not loaded.');
				return;
			}


			var $input_time = $('.pickatime-editable').pickatime({
				editable: true,
				format: 'H:i',
                formatLabel: 'H:i',
                // formatSubmit: 'H:i',
				onClose: function() {
					$('.datepicker').focus();
				}
			});
			var picker_time = $input_time.pickatime('picker');
			$input_time.on('click', function(event) {
				if (picker_time.get('open')) {
					picker_time.close();
				} else {
					picker_time.open();
				}
				event.stopPropagation();
			});

		};

		return {
			init: function() {
				_componentDaterange();
				// _componentPickadate();
				_componentPickatime();
				// _componentAnytime();
			}
		}
	}();
	// Initialize module
	// ------------------------------

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

</script>

	<script type="text/javascript">



		var $select = $('.form-control-select2').select2();

		$( document ).ready(function() {

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



				// 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

			});
		</script>

		@endsection