@extends('layout.app_706')
@section('title')
	SPV Analisa
@endsection
@section('content')
	<!--begin::Subheader-->
    <div class="subheader py-2 py-lg-4  subheader-solid " id="kt_subheader">
        <div class=" container-fluid  d-flex align-items-center justify-content-between flex-wrap flex-sm-nowrap">
            <!--begin::Info-->
            <div class="d-flex align-items-center flex-wrap mr-2">
                <!--begin::Page Title-->
                <h5 class="text-dark font-weight-bold mt-2 mb-2 mr-5">
                    @yield('title')
                </h5>
                <!--end::Page Title-->
            </div>
            <!--end::Info-->
        </div>
    </div>
    <!--end::Subheader-->
	
    <!--begin::Entry-->
    <div class="d-flex flex-column-fluid">
        <!--begin::Container-->
        <div class=" container ">
			<div class="row">
				<div class="col-12">
					<div class="card card-custom gutter-b" id="data">
						<div class="card-body">
							<div class="m-section" id="data-kategori">
								<div class="m-section__content">
									{!! Form::open(['route' => 'spv.update.analisa','id'=>'SpvData']) !!}
									<input type="hidden" name="dataID" id="dataID" value="{{$data->recid}}">
									<div class="row">
										<div class="col-lg-12">
											<div class="row">
												<div class="col-lg-6">
													<div class="form-group m-form__group">
														<label class="col-form-label">Uraian Permohonan</label>
														<textarea name="uraianpermohonan" id="uraianpermohonan" disabled class="form-control _summernote">{{$data->uraian}}</textarea>
													</div>
												</div>
												<div class="col-lg-6" id="imageThumbnailDiv">
																										@if($data->foto != null)
														@if (strtolower($file[1])=='png'||strtolower($file[1])=='jpeg'||strtolower($file[1])=='jpg'||strtolower($file[1])=='bmp')
															<label class="col-form-label d-block">Image Data Request</label>
															<a href="{{asset('api/gambar/image&'.$data->foto)}}" id="linkImage" target="_blank">
																<img src="{{asset('api/gambar/image&'.$data->foto)}}" id="imgThumbnail" style="height: auto;width: 150px;">
															</a>
														@else
															<label class="col-form-label d-block">File Data Request</label>
															<a class="btn btn-primary" href="{{asset('api/download/image&'.$data->foto)}}" target="_blank">
																Download File
															</a>
														@endif
													@else
														<label class="col-form-label d-block">Lampiran File Permohonan Tidak Tersedia</label>
													@endif
												</div>
											</div>
										</div>
										<div class="col-lg-8">
											<label class="col-form-label">Bobot</label>
											<div class="form-group m-form__group">
												<input type="text" name="totalBobot" id="totalBobot" class="form-control d-inline" style="width:60%" value="{{($data->bobot==null)?'0':$data->bobot}}" readonly>
												<button type="button" class="btn btn-info d-inline" id="addBobot">Pembobotan</button>
											</div>
										</div>
										<div class="col-lg-6">
											<label class="col-form-label">Object Permohonan/Aplikasi </label>
											<div class="form-group m-form__group">
												<select class="form-control m-select2" name="objek" id="objek">
													<option value="">--Pilih Object Permohonan/Aplikasi--</option>
													@foreach($obj as $row)
														@if($data->objek_id == $row->id)
														<option selected value="{{$row->id}}">{{$row->nama}}</option>
														@else
														<option value="{{$row->id}}">{{$row->nama}}</option>
														@endif
													@endforeach
												</select>
											</div>
										</div>
										<div class="col-lg-6">
											<label class="col-form-label">Kategori </label>
											<div class="form-group m-form__group">
												<select class="form-control m-select2" name="kategori" id="kategori">
													<option value="">--Pilih Kategori--</option>
													@foreach($kategori as $row)
														@if($data->kategori_id == $row->recid)
														<option selected value="{{$row->recid}}">{{$row->nama}}</option>
														@else
														<option value="{{$row->recid}}">{{$row->nama}}</option>
														@endif
													@endforeach
												</select>
											</div>
										</div>
										<div class="col-lg-6">
											<label class="col-form-label">Perkiraan Tanggal Pengerjaan</label>
											<div class="form-group m-form__group">
												<input type="text" name="tgl_perkiraan" id="tgl_perkiraan" class="form-control d-inline" value="{{($data->tgl_perkiraan==null)?'':$data->tgl_perkiraan}}">
											</div>
										</div>
										<div class="col-lg-6">
											<label class="col-form-label">Perkiraan Lama Pengerjaan</label>
											<div class="form-group m-form__group">
												<input type="text" name="lama_perkiraan" class="form-control d-inline"  value="{{($data->lama_perkiraan==null)?'':$data->lama_perkiraan}}">
											</div>
										</div>
										<div class="col-lg-12">
											<button type="button" class="btn btn-info" id="btn-add">Tambah Requirement</button>
											<table class="table" style="margin-top: 20px;">
												<thead>
													<tr>
														<th style="width: 5%;">Code</th>
														<th style="width: 40%;">Requirement</th>
														<th style="width: 45%;">Keterangan</th>
														<th style="width: 10%;">#</th>
													</tr>
												</thead>
												<tbody id="t-bodi">
													@foreach($data->data_requirement as $row)
														<tr>
															<td><span class="m-badge m-badge--primary m-badge--wide">REQ_{{$row->data_recid.'_'.$row->recid}}</span></td>
															<td>
																<input class="form-control m-input m-input--air" readonly  name="requirement[]" value="{{($row->sumber=='user' && $row->requirement_revision != '') ? $row->requirement_revision : $row->requirement}}">
																<input class="form-control m-input m-input--air input-edit d-none"  name="edit[]" value="no">
																<input class="form-control m-input m-input--air d-none"  name="req_ids[]" value="{{$row->recid}}">
															</td>
															<td>
																<textarea class="_summernote2 form-control m-input m-input--air" readonly name="keterangan[]" rows="2">{{($row->sumber=='user' && $row->requirement_revision != '') ? $row->keterangan_revision : $row->keterangan}}</textarea>
															</td>
															<td>
																<button type="button" onclick="enableEdit($(this))" class="btn btn-outline-success btn-sm btn-elevate btn-icon btn-edit"><i class="la la-paint-brush"></i></button>
																<button type="button" onclick="cancelEdit($(this))" class="btn m-btn--pill btn-primary btn-sm btn-cancel d-none">Cancel</button>
																<!-- <button type="button" onclick="$(this).parent().parent().remove();" class="btn btn-outline-danger btn-sm btn-elevate btn-icon"><i class="la la-trash-o"></i></button>-->
															</td>
														</tr>
													@endforeach
												</tbody>
											</table>
										</div>
										
										<div class="modal" id="modal_bobot" role="dialog" data-keyboard="false" data-backdrop="static">
											<div class="modal-dialog modal-md" role="document">
												<div class="modal-content">
													<div class="modal-header">
														<h5 class="modal-title" id="">
															List Pembobotan
														</h5>
														<button type="button" class="close" data-dismiss="modal" aria-label="Close">
															<span aria-hidden="true">
																×
															</span>
														</button>
													</div>
													<div class="modal-body">
														<table class="table table-bordered table-hover m-table" id="tablelistBobot">
															<thead>
															<tr class="text-center">
																<td>Bobot</td>
																<td>Level</td>
															</tr>
															</thead>
															<tbody>
															@if ($data->bobot==null)
																@foreach($bagian as $item)
																	<tr>
																		<td>{{$item->nama}}</td>
																		<input type="hidden" name="idBobot[]" required value="{{$item->id}}">
																		<td>
																			<select class="form-control bobotclass" name="dataBobot[]" required>
																				<option value="">Pilih Level</option>
																				<option value="{{$item->tingkat_1}}">
																					{{$tingkat[$item->id]['tingkat_1']??'tinggi'}}
																				</option>
																				<option value="{{$item->tingkat_2}}">Sedang</option>
																				<option value="{{$item->tingkat_3}}">Rendah</option>
																			</select>
																		</td>
																	</tr>
																@endforeach
															@else
																@foreach($data->detailBobot as $detailBobot)
																	@foreach($bagian as $item)
																		@if ($detailBobot->bobot_id==$item->id)
																			<tr>
																				<td>{{$item->nama}}</td>
																				<input type="hidden" name="idBobot[]" required value="{{$item->id}}">
																				<td>
																					<select class="form-control bobotclass" name="dataBobot[]" required>
																						<option value="">Pilih Level</option>
																						<option value="{{$item->tingkat_1}}" {{($item->tingkat_1==$detailBobot->nilai)?'selected':''}}>Tinggi</option>
																						<option value="{{$item->tingkat_2}}" {{($item->tingkat_2==$detailBobot->nilai)?'selected':''}}>Sedang</option>
																						<option value="{{$item->tingkat_3}}" {{($item->tingkat_3==$detailBobot->nilai)?'selected':''}}>Rendah</option>
																					</select>
																				</td>
																			</tr>
																		@endif

																	@endforeach

																@endforeach
															@endif

															</tbody>
														</table>
													</div>
													<div class="modal-footer">
														<button type="button" class="btn btn-secondary" id="cancelBobot" data-dismiss="modal">
															Close
														</button>
														<button type="button" class="btn btn-primary" id="saveBobot">
															Save
														</button>
													</div>
												</div>
											</div>
										</div>

										<div class="col-lg-12 mt-4">
											<a href="{{ url()->previous() }}" class="btn btn-secondary" data-dismiss="modal">
												Back
											</a>
											<button type="submit" id="submitSpv" class="btn btn-primary">
												Save changes
											</button>
										</div>
									</div>
									{!! Form::close() !!}
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
        <!--end::Container-->
	</div>
    <!--end::Entry-->

	<div class="modal" id="modal_worker" role="dialog" data-keyboard="false" data-backdrop="static">
		<div class="modal-dialog modal-md" role="document">
			<div class="modal-content">
				<div class="modal-header">
					<h5 class="modal-title" id="">
						List Worker
					</h5>
					<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">
						×
					</span>
					</button>
				</div>
				<div class="modal-body">
					<table class="table table-bordered table-hover m-table" id="tablelistWorker">
						<thead>
							<tr class="text-center">
								<td>Nip</td>
								<td>Nama</td>
							</tr>
						</thead>
					</table>
				</div>
			</div>
		</div>
	</div>
	<table class="d-none" id="div-tr">
		<tr>
			<td><span class="m-badge m-badge--primary m-badge--wide">to be generated</span></td>
			<td>
				<input class="form-control m-input m-input--air"  name="requirement[]" value="">
				<input class="form-control m-input m-input--air input-edit d-none"  name="edit[]" value="yes">
				<input class="form-control m-input m-input--air d-none"  name="req_ids[]" value="no">
			</td>
			<td>
				<textarea class="form-control m-input m-input--air" name="keterangan[]" rows="2"></textarea>
			</td>
			<td>
				<button type="button" onclick="$(this).parent().parent().remove();" class="btn btn-outline-danger btn-sm btn-elevate btn-icon"><i class="la la-trash-o"></i></button>
			</td>
		</tr>
	</table>
@endsection
@section('css')
    <style>
        .select2-container .select2-selection--single{
            height: 40px!important;
        }
        #listChecker .select2.select2-container{
            display: block;
        }
    </style>
@endsection
@section('js')
    <!--begin::Page Vendors -->
    <script src="{{asset('assets/vendors/custom/switch/bootstrap-switch.js')}}" type="text/javascript"></script>
    <script src="{{asset('assets_7.0.6/js/pages/crud/forms/editors/summernote.js?v=7.0.6')}}" type="text/javascript"></script>
	<script type="text/javascript">

        $(document).ready(function () {
			$('._summernote').summernote({
				// height: 70,
				toolbar: false,
			});
			$('._summernote').summernote('disable');
			$('._summernote2').summernote({
				// height: 70,
				toolbar: false,
			});
			$('._summernote2').summernote('disable');
			$("#btn-add").click(function(){
				$("#t-bodi").append($("#div-tr tbody").html());
			});
            $("#bagian").select2({
                placeholder: "Select Bagian"
            });
            $("#bobot").select2({
                placeholder: "Select Bobot"
            });
            $("#checkerID").select2({
                placeholder: "Select Bobot"
            });
            $("#worker").select2({
                placeholder: "Select Bobot"
            });
            $("#objek").select2({
                placeholder: "Pilih Object Permohonan/Aplikasi"
            });
			$("#kategori").select2({
                placeholder: "Pilih Kategori"
            });
			$("#tgl_perkiraan").datepicker({
                todayHighlight:0,
                autoclose:true,
                clearBtn: true,
                format:"dd-mm-yyyy",
                orientation: "bottom left"
            });
            @if(isset($bobotLevel))
                $('#bobot').val('{{$data->bobot}}').trigger('change');
            @endif

            @if($data->detailBobot==null)
            $('#cancelBobot').on('click',function () {
                $('.bobotclass').prop('selectedIndex',0);
            });
            @endif

            $('#addBobot').on('click',function () {
                $('#modal_bobot').modal('show');
            });
            $('#saveBobot').on('click',function () {
                var sumBobot = 0;
                $('.bobotclass').each(function () {
                    sumBobot += parseFloat($(this).val());
                });
                if (!sumBobot){
                    alert('Pastikan Sudah memilih semua bobot level')
                } else{
                    $('#totalBobot').val(sumBobot);
                    $('#modal_bobot').modal('hide');
                }
            });

            $('#addWorker').on('click',function () {
                $('#modal_worker').modal('show');
                var workerList = $("input[name='nipWorkerSet[]']").map(function(){return $(this).val();}).get();
                $('#tablelistWorker').DataTable().destroy();
                $('#tablelistWorker').DataTable({
                    "processing": true,
                    "serverSide": true,
                    "ajax": {
                        url : "{{ route('spv.disposisi.getWorker')}}",
                        type: "POST",
                        data: {"nipWorker[]":workerList,"_token":"{{csrf_token()}}"}
                    },
                    "columns": [
                        {data: 'setworker','class':'text-center'},
                        {data: 'nama'},
                    ]
                });
            });

            $('#disposisi').on('switchChange.bootstrapSwitch',function () {
                var disposisi = $('#disposisi').bootstrapSwitch('state');
                if (disposisi===true){
                    $('#listDisposisi').show();
                    $('.activeWorker').show();
					$('#listChecker').show();
                } else{
                    $('#listDisposisi').hide();
                    $('.activeWorker').hide();
					$('#listChecker').hide();
                }
                $('#bagian').removeAttr('tabindex')
            });

            $('#checker').on('switchChange.bootstrapSwitch',function () {
                var checker = $('#checker').bootstrapSwitch('state');
                if (checker===true){
                    $('#listChecker').show();
                } else{
                    $('#listChecker').hide();
                }
            });

            $('#bagian').on('change',function () {
                var bagian = $('#bagian').val();
                _token = '_token';
                $.ajax({
                    type: "POST",
                    url: "{{route('get.bobot.level')}}",
                    data: {id: bagian, _token: "{{ csrf_token() }}"},
                    success: function (result)
                    {
                        if (result.status === true) {
                            $('#bobot').select2("val","");
                            $('#bobot').empty();
                            $('#bobot').append(result.levelBobot);
                        }else{
                            $('body').append(result.message);
                        }
                    },
                    error: function(jqXHR) {
                        $('body').append(jqXHR.responseJSON.message);
                    }
                });
            })

            $('body').on('click','.removeWorker',function () {
                $(this).parents('tr').remove()
            });
			
			$(document).on( 'change keyup keydown paste cut', 'textarea', function (){
                $(this).height(0).height(this.scrollHeight);
            })
            .find( 'textarea' ).change();
        });

        function setworker(nip) {
            $.ajax({
                type: "post",
                url: "{{route('spv.disposisi.setWorker')}}",
                data: {"nip": nip, "_token": "{{ csrf_token() }}"},
                success: function (result)
                {
                    if (result.status === true) {
                        $('#modal_worker').modal('hide');
                        $('#workerTable tbody').append(result.worker);
                    }else{
                        $('body').append(result.message);
                    }
                },
                error: function(jqXHR) {
                    $('body').append(jqXHR.responseJSON.message);
                }
            });
        }
		
		function enableEdit(element){
			element.parent().parent().find('.m-input--air').removeAttr('readonly');
			element.parent().find('.btn-cancel').removeClass('d-none');
			element.addClass('d-none');
			element.parent().parent().find('.input-edit').val('yes');
			element.parent().parent().find('._summernote2').summernote('enable');
		}
		
		function cancelEdit(element){
			element.parent().parent().find('.m-input--air').attr('readonly', true);
			element.parent().find('.btn-edit').removeClass('d-none');
			element.addClass('d-none');
			element.parent().parent().find('.input-edit').val('no');
			element.parent().parent().find('._summernote2').summernote('disable');
		}

    </script>
@endsection