@extends('layout.app')
@section('title')
    SPV - Disposisi| {{env('APP_NAME')}}
@endsection
@section('content')
    <div class="m-grid__item m-grid__item--fluid m-wrapper">
        <div class="m-content">
            <div class="row">
                <div class="col-12">
                    <div class="m-portlet m-portlet--creative m-portlet--first m-portlet--bordered-semi " id="data">
                        <div class="m-portlet__head">
                            <div class="m-portlet__head-caption">
                                <div class="m-portlet__head-title">
                                    <h2 class="m-portlet__head-label m-portlet__head-label--accent">
									<span>
										Disposisi
									</span>
                                    </h2>
                                </div>
                            </div>
                        </div>
                        <div class="m-portlet__body">
                            <div class="m-section" id="data-kategori">
                                <div class="m-section__content">
                                    {!! Form::open(['route' => 'spv.update.disposisi','id'=>'SpvData']) !!}
                                    <input type="hidden" name="dataID" id="dataID" value="{{$data->recid}}">
                                    <div class="row">
										<div class="col-lg-12 activeWorker pt-3">
                                            <table class="table table-bordered" id="workerTable">
                                                <thead>
                                                    <tr class="text-center">
                                                        <td width="10%">REQ</td>
                                                        <td width="30%">Nama Worker</td>
                                                        <td width="10%">Estimasi</td>
                                                        <td width="50%">Remark SPV</td>
                                                    </tr>
                                                </thead>
                                                <tbody>
													@foreach($data->data_requirement as $row)
														<tr>
															<td>
																<button type="button" class="btn btn-danger" data-toggle="m-popover" title data-html="true" data-content="{{($row->sumber=='user' && $row->requirement_revision != '') ? '<b>Requirement:</b><br>'.$row->requirement_revision.'<br><b>Keterangan:</b><br>'.$row->keterangan_revision : '<b>Requirement:</b><br>'.$row->requirement.'<br><b>Keterangan:</b><br>'.$row->keterangan}}" data-original-title>
																REQ_{{$row->data_recid.'_'.$row->recid}}
																</button>
															</td>
															@if($row->disposisi_at == null)
																<td>
																	<input class="form-control m-input m-input--air m--hide"  name="req_ids[]" value="{{$row->recid}}">
																	<select class="form-control m-select2 d-block worker" name="worker[]" value="">
																		<option value="">aa</option>
																		@foreach($worker as $row)
																			<option value="{{$row->nip}}">{{$row->nama}}</option>
																		@endforeach
																	</select>
																</td>
																<td>
																	<input type="number" class="form-control number estimasi" name="estimasi[]" placeholder="Estimasi">
																</td>
																<td>
																	<textarea class="form-control" rows="2" name="remarkspv[]" placeholder="Remark SPV"></textarea>
																</td>
															@else
																<td>{{$row->worker->nama}}</td>
																<td>{{$row->estimasi}} Hari</td>
																<td>{{$row->remark}}</td>
															@endif
														</tr>
													@endforeach
												</tbody>
                                            </table>
                                        </div>
                                        <div class="col-lg-12">
                                            <div class="row" id="listChecker">
                                                <div class="col-lg-4 pt-3">
                                                    <div class="form-group m-form__group">
                                                        <label class="">Nama Checker</label>
                                                        <select class="form-control m-select2" name="checkerID" required id="checker">
															<option value="">a</option>
                                                            @foreach($disposisi as $worker)
                                                                <option value="{{$worker->nip}}">{{$worker->nip}} - {{$worker->nama}}</option>
                                                            @endforeach
                                                        </select>
                                                    </div>

                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-lg-12 mt-4">
                                            <button type="button" class="btn btn-secondary" data-dismiss="modal">
                                                Close
                                            </button>
                                            <button type="submit" id="submitSpv" class="btn btn-primary">
                                                Save changes
                                            </button>
                                        </div>
                                    </div>
                                    {!! Form::close() !!}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <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>
@endsection
@section('css')
    <link href="{{asset('assets/vendors/custom/datatables/datatables.bundle.css')}}" rel="stylesheet" type="text/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/datatables/datatables.bundle.js')}}" type="text/javascript"></script>
    <script src="{{asset('assets/vendors/custom/switch/bootstrap-switch.js')}}" type="text/javascript"></script>

    <script type="text/javascript">

        $(document).ready(function () {
			$("#checker").select2({
                placeholder: "Select Checker",
				width: '100%',
				allowClear: true
            });
			$(".worker").select2({
                placeholder: "Select Worker",
				width: '100%',
				allowClear: true
            });
            $(".worker").change(function(){
				if($(this).val() == ''){
					$(this).parent().parent().find('.estimasi').removeAttr('required');
				}else{
					$(this).parent().parent().find('.estimasi').attr('required', true);
				}
            });
			var checker = "{{$data->nip_checker}}";
			if(checker != ''){
				$("#checker").val(checker).trigger('change');
				$("#checker").attr('readonly', true);
			}

            $('body').on('click','.removeWorker',function () {
                $(this).parents('tr').remove()
            })
        });

        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');
		}

    </script>
@endsection