@php
    if(!isset($action)) $action = 'create'; //create/update/view
@endphp
<div class="row"><div class="form-group col-md-12 required" element="div"><hr></div></div>
<input type="hidden" name="data_schedule" id="data_schedule" value="{{ $data['data_schedule'] != null ? $data['data_schedule'] : json_encode([]) }}">

<div class="row mt-4">
    <h4><br>Rencana Kerja Survey</h4><br><br>
    <div class="form-group col-md-12">
        <div class="card col-md-12" >
            <div class="card-header"><b>PIC / Pendamping</b></div>
            <div class="card-body">
                <div class="row">
                    <div class="form-group col-sm-6" element="div">
                        <label>Nama</label>
                        <input type="text" id="pic_survey_nama_rks" name="pic_survey_nama_rks" value="{{$action != 'create' && isset($jsondata_rks['pic']) ? json_decode($jsondata_rks['pic'])->nama : ''}}" {{$action == 'view' ? 'readonly' : ''}} class="form-control">
                    </div>
                    <div class="form-group col-md-3 required" element="div">
                        <label>No. Telp / Hp</label>
                        <input type="text" id="pic_survey_telp_rks" name="pic_survey_telp_rks" value="{{$action != 'create' && isset($jsondata_rks['pic']) ? json_decode($jsondata_rks['pic'])->telp : ''}}" {{$action == 'view' ? 'readonly' : ''}} class="form-control">
                    </div>
                    <div class="form-group col-md-3 required" element="div">
                        <label>Email</label>
                        <input type="text" id="pic_survey_email_rks" name="pic_survey_email_rks" value="{{$action != 'create' && isset($jsondata_rks['pic']) ? json_decode($jsondata_rks['pic'])->email : ''}}" {{$action == 'view' ? 'readonly' : ''}} class="form-control">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="form-group col-md-12">
        <div class="card col-md-12">
            <div class="card-header"><b>Dokumen Administrasi</b></div>
            <div class="card-body">
                
                <div class="row">
                    <div class="form-group col-sm-4" element="div">
                        <label> </label>
                    </div>
                    <div class="form-group col-md-1 required" element="div">
                        <label>Y</label>&ensp;&ensp;&ensp;
                        <label>T</label>
                    </div>
                    <div class="form-group col-md-7 required" element="div">
                        <label>Keterangan</label>
                    </div>
                </div>
                
                @foreach($rks_dok_administrasi as $idx => $row)
                <div class="row">
                    <div class="form-group col-sm-4" element="div">
                        <label>{{$rks_dok_administrasi[$idx]}}</label>
                    </div>
                    <div class="form-group col-md-1 required" element="div">
                        <input {{$action == 'view' ? 'disabled' : ''}} name="dok_admin_y_{{$idx}}" type="checkbox" value="Y" {{ isset($jsondata_rks['dok_admin']) && (json_decode($jsondata_rks['dok_admin'])[$idx]->is_yes == 'Y') ? "checked" : "" }}> &ensp;
                        <input {{$action == 'view' ? 'disabled' : ''}} name="dok_admin_y_{{$idx}}" type="checkbox" value="T" {{ isset($jsondata_rks['dok_admin']) && (json_decode($jsondata_rks['dok_admin'])[$idx]->is_yes == 'T') ? "checked" : "" }}>
                    </div>
                    <div class="form-group col-md-7 required" element="div">
                        <input type="text" id="dok_admin_ket_{{$idx}}" name="dok_admin_ket_{{$idx}}" value="{{$action == 'view' && isset($jsondata_rks['dok_admin']) ? json_decode($jsondata_rks['dok_admin'])[$idx]->ket : ''}}" {{$action == 'view' ? 'readonly' : ''}} class="form-control">
                    </div>
                </div>
                @endforeach
            </div>
        </div> 
    </div>
    <div class="form-group col-md-12">
        <div class="card col-md-12">
            <div class="card-header"><b>Dokumen Teknis</b></div>
            <div class="card-body">
                <div class="row">
                    <div class="form-group col-sm-4" element="div">
                        <label> </label>
                    </div>
                    <div class="form-group col-md-1 required" element="div">
                        <label>Y</label>&ensp;&ensp;&ensp;
                        <label>T</label>
                    </div>
                    <div class="form-group col-md-7 required" element="div">
                        <label>Keterangan</label>
                    </div>
                </div>
                @foreach($rks_dok_teknis as $idx => $row)
                <div class="row">
                    <div class="form-group col-sm-4" element="div">
                        <label>{{$rks_dok_teknis[$idx]}}</label>
                    </div>
                    <div class="form-group col-md-1 required" element="div">
                        <input {{$action == 'view' ? 'disabled' : ''}} name="dok_teknis_y_{{$idx}}" type="checkbox" value="Y" {{ isset($jsondata_rks['dok_teknis']) && (json_decode($jsondata_rks['dok_teknis'])[$idx]->is_yes == 'Y') ? "checked" : "" }}> &ensp;
                        <input {{$action == 'view' ? 'disabled' : ''}} name="dok_teknis_y_{{$idx}}" type="checkbox" value="T" {{ isset($jsondata_rks['dok_teknis']) && (json_decode($jsondata_rks['dok_teknis'])[$idx]->is_yes == 'T') ? "checked" : "" }}>
                    </div>
                    <div class="form-group col-md-7 required" element="div">
                        <input type="text" id="dok_teknis_ket_{{$idx}}" name="dok_teknis_ket_{{$idx}}" value="{{$action == 'view' && isset($jsondata_rks['dok_teknis']) ? json_decode($jsondata_rks['dok_teknis'])[$idx]->ket : ''}}" {{$action == 'view' ? 'readonly' : ''}} class="form-control">
                    </div>
                </div>
                @endforeach
            </div>
        </div>
    </div>
    <div class="form-group col-md-12">
        <div class="card col-md-12" >
            <div class="card-header"><b>Schedule</b></div>
            <div class="card-body">
                @if($action != 'view')
                    <div class="form-group col-md-12">
                        <button type="button" class="btn btn-primary" id="add_rkp"  data-bs-target="#modal_rk_survey" data-bs-toggle="modal"><span class="la la-plus"></span>Tambah</button>
                    </div>
                @endif
                <div class="form-group col-md-12">
                    <label></label>
                    <table class="bg-white table table-striped table-hover dataTable" id="table_rk_survey" style="width: 100%">
                        <thead>
                            <th>No.</th>
                            <th>Schedule</th>
                            <th>Tanggal</th>
                            <th>Keterangan</th>
                            <th>Output</th>
                            <th>Aksi</th>
                        </thead>
                        <tbody>

                        </tbody>
                    </table>
                </div>            
            </div>
        </div>
    </div>
    <div class="form-group col-md-12">
        <div class="card col-md-12" >
            <div class="card-header"><b>Biaya Perjalanan Dinas / Allowance</b></div>
            <div class="card-body">
                <div class="row">
                    <div class="form-group col-md-6" element="div">
                        <label>Rp Allowance</label>
                        <input type="text" name="rp_allowance" id="rp_allowance" value="{{$action != 'create' ? $data['rp_allowance'] : ''}}" {{$action == 'view' ? 'readonly' : ''}} class="form-control currency text-right">

                        @if($action != 'view')
                            <br><label>Upload File Allowance</label>
                            @component('components.inputfile', ['name' => 'file_allowance', 'disabled' => ($action == 'view')])@endcomponent
                        @endif
                        @if(!empty($data['file_allowance']))
                            <br><br>
                            @component("components.buttondownload", ["href" => url('tasks/downloadallowance/'. $data['file_allowance']), "label" => "Download File Allowance", "icon" => "download"])@endcomponent
                            &ensp;
                            <button type="button" class="btn btn-sm btn-link inline-create-button" id="view_modal_historyrkp" data-target="#modal_historyrkp" data-toggle="modal"><span class="la la-plus"></span>Lihat History Rencana Kerja Proyek</button>
                        @endif
                    </div>
                    <div class="form-group col-md-6" element="div">
                        <label>Catatan</label>
                        <textarea name="catatan_allowance" id="catatan_allowance" {{$action == 'view' ? 'readonly' : ''}} class="form-control" rows="5">{{$action != 'create' ? $data['catatan_allowance'] : ''}}</textarea>
                    </div>
                </div>            
            </div>
        </div>
    </div>
</div>

<!-- <div class="row">
    <div class="form-group col-md-6 required" element="div">
        <label>Rencana Kerja Survey (Rp) <span style="color:red">*</span></label>
        <input type="text" name="rp_allowance" id="rp_allowance" value="{{$action != 'create' ? $data['rp_allowance'] : ''}}" {{$action == 'view' ? 'readonly' : ''}} class="form-control currency text-right">
        @if($action != 'view')
            <br><label>Upload File Allowance</label>
            @component('components.inputfile', ['name' => 'file_allowance', 'disabled' => ($action == 'view')])@endcomponent
        @endif
        @if(!empty($data['file_allowance']))
            <br><br>
            @component("components.buttondownload", ["href" => url('tasks/downloadallowance/'. $data['file_allowance']), "label" => "Download File Allowance", "icon" => "download"])@endcomponent
            &ensp;
            <button type="button" class="btn btn-sm btn-link inline-create-button" id="view_modal_historyrkp" data-target="#modal_historyrkp" data-toggle="modal"><span class="la la-plus"></span>Lihat History Rencana Kerja Proyek</button>
        @endif
    </div>



    <div class="form-group col-md-6" element="div">
        <label>Catatan</label>
        <textarea name="catatan_allowance" id="catatan_allowance" {{$action == 'view' ? 'readonly' : ''}} class="form-control" rows="5">{{$action != 'create' ? $data['catatan_allowance'] : ''}}</textarea>
    </div>     
</div>-->


@push('modals')
    <!--Modal History RKP-->
    <div class="modal" aria-modal="true" role="dialog" id="modal_historyrkp">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">History Rencana Kerja Proyek</h4>
                    <button type="button" class="btn btn-default" aria-label="Close" data-dismiss="modal"><span aria-hidden="true">X</span></button>
                </div>
                <div class="modal-body">
                    <div class="card">
                        <div class="card-body row">
                            <table class="bg-white table table-striped table-hover dataTable" id="table_historyrkp" width="100%">
                                <thead>
                                <th>No</th>
                                <th>Keterangan</th>
                                <th>Catatan</th>
                                <th>User</th>
                                <th>Download File</th>
                                </thead>
                            </table>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal"><span class="la la-ban"></span> Close</button>
                </div>
            </div>
        </div>
    </div>

    @if($action != 'view')
        <div class="modal" aria-modal="true" role="dialog" id="modal_rk_survey">
            <form>
                @csrf
                <div class="modal-dialog" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h4 class="modal-title">Tambah Schedule</h4>
                            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                        </div>
                        <div class="modal-body">
                            <div class="card">
                                <div class="card-body row">
                                    <!-- text input -->
                                    <div class="form-group col-sm-12" element="div">
                                        <label>Schedule</label>
                                        <input type="text" name="schedule" id="schedule_rk_survey" value="" class="form-control">
                                    </div>
                                    <!-- text input -->
                                    <div class="form-group col-sm-12" element="div">
                                        <label>Tanggal</label>
                                        <input type="date" name="tgl_rk_survey" id="tgl_rk_survey" pattern="[0-9]{4}-[0-9]{2}-[0-9]{2}" placeholder="yyyy-mm-dd" class="form-control">
                                    </div>
                                    <!-- text input -->
                                    <div class="form-group col-sm-12" element="div">
                                        <label>Keterangan Kegiatan</label>
                                        <input type="text" name="ket" id="ket_rk_survey" value="" class="form-control">
                                    </div>
                                    <!-- text input -->
                                    <div class="form-group col-sm-12" element="div">
                                        <label>Output</label>
                                        <input type="text" name="output" id="output_rk_survey" value="" class="form-control">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-success" onclick="addRkSurvey('modal_rk_survey')">
                                <span class="la la-save" role="presentation" aria-hidden="true"></span> &nbsp;
                                <span data-value="save_and_back">Save and back</span>
                            </button>
                        </div>
                    </div>
                </div>
            </form>
        </div>

        <div class="modal" aria-modal="true" role="dialog" id="modal_rk_survey_edit">
            <form>
                @csrf
                <div class="modal-dialog" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h4 class="modal-title">Edit Schedule</h4>
                            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                        </div>
                        <div class="modal-body">
                            <div class="card">
                                <div class="card-body row">
                                    <!-- text input -->
                                    <div class="form-group col-sm-12" element="div">
                                        <label>Schedule</label>
                                        <input type="text" name="schedule" id="schedule_rk_survey_edit" value="" class="form-control" disabled>
                                        <input type="text" name="schedule" id="row_rk_survey_edit" value="" class="form-control" hidden>
                                    </div>
                                    <!-- text input -->
                                    <div class="form-group col-sm-12" element="div">
                                        <label>Tanggal</label>
                                        <input type="date" name="tgl_rk_survey" id="tgl_rk_survey_edit" pattern="[0-9]{4}-[0-9]{2}-[0-9]{2}" placeholder="yyyy-mm-dd" class="form-control">
                                    </div>
                                    <!-- text input -->
                                    <div class="form-group col-sm-12" element="div">
                                        <label>Keterangan Kegiatan</label>
                                        <input type="text" name="ket" id="ket_rk_survey_edit" value="" class="form-control">
                                    </div>
                                    <!-- text input -->
                                    <div class="form-group col-sm-12" element="div">
                                        <label>Output</label>
                                        <input type="text" name="output" id="output_rk_survey_edit" value="" class="form-control">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-success" onclick="EditRkSurvey('rk_survey')">
                                <span class="la la-save" role="presentation" aria-hidden="true"></span> &nbsp;
                                <span data-value="save_and_back">Save and back</span>
                            </button>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    @endif
@endpush

@push('after_scripts')
    <script>
        var table_historyrkp = $('#table_historyrkp').DataTable({
            paging: false,
            searching : false,
            info : false,
            ajax: {
                url : "{{ url('api/history/rkp') }}",
                type : 'GET',
                data: function (data) {
                    data.uuid = "{{$data['uuid']}}";
                }
            },
            columns: [
                {
                    "data": null,
                    "searchable": false,
                    "orderable": false,
                    render: function (data, type, full, meta) {
                        return +meta.row + 1;
                    }
                },
                {
                    "data": "type",
                },
                {
                    "data": "catatan",
                },
                {
                    "data": "cool_name",
                },
                {
                    "data": null,
                    "searchable": false,
                    "orderable": false,
                    "render": function (data, type, full, meta){
                        var btndownload = '';
                        if(full.nama_file !== null){
                            btndownload = `<a href="{{ url('tasks/downloadallowance/') }}/`+full.nama_file+`" target="_blank" class=" btn btn-raised btn-primary"><i class="fa fa-download"></i> Download</a>`;
                        }
                        return btndownload;
                    }
                },
            ],
        });

        $('input[type="checkbox"]').on('change', function() {
           
           if($(this).val() === 'Y' || $(this).val() === 'T'){
               $(this).siblings('input[type="checkbox"]').not(this).prop('checked', false);
           }
           
       });


        var arr_schedule = {!! isset($jsondata_rks['schedule']) && ($jsondata_rks['schedule']) != null ? ($jsondata_rks['schedule']) : json_encode($schedule) !!};
        var table_rk_survey = $('#table_rk_survey').DataTable({
            "ordering": false,
            "info": false,
            "paging": false,
            "searching": false,
            "bLengthChange": false,
            data: arr_schedule,
            columns: [
                {
                    "data": null,
                    "width" : "12px",
                    "searchable": false,
                    "orderable": false,
                    render: function (data, type, full, meta) {
                        return +meta.row + 1;
                    }
                },
                {
                    "data": "schedule",
                },
                {
                    "data": "tanggal",
                    "render": function (data){
                        return dateFormat(data);
                    }
                },
                {
                    "data": "keterangan",
                },
                {
                    "data": "output",
                },
                {
                    "data": null,
                    "searchable": false,
                    "orderable": false,
                    "render": function (data, type, full, meta){
                        var btndelete = '-';
                        @if ($action != 'view' ? true : false)
                            if(meta.row <= 3){
                                btndelete = `<button type="button" class="btn btn-sm btn-success editrks" onclick="openModal('modal_rk_survey_edit')" data-toggle="modal" value="'`+full.schedule+`'/'`+full.keterangan+`'/'`+full.tanggal+`'/'`+full.output+`'/'`+meta.row+`'"> Edit</button>`;
                            }else{
                                btndelete = `<button type="button" class="btn btn-sm btn-success editrks" onclick="openModal('modal_rk_survey_edit')" data-toggle="modal" value="'`+full.schedule+`'/'`+full.keterangan+`'/'`+full.tanggal+`'/'`+full.output+`'"> Edit</button> <button type="button" class="btn btn-sm btn-danger" onclick="deleteRks('`+meta.row+`')"><span class="la la-check" role="presentation" aria-hidden="true"></span> Hapus</button>`;
                            }
                        @endif
                            return btndelete;
                    }
                },
            ],
            processing: true,
            serverSide: false,
            order: [[1, 'desc']],
        });

        function addRkSurvey(modal){
            var obj = {};
            obj.schedule = $('#schedule_rk_survey').val();
            obj.tanggal = $('#tgl_rk_survey').val();
            obj.keterangan = $('#ket_rk_survey').val();
            obj.output = $('#output_rk_survey').val();
            arr_schedule.push(obj);
            table_rk_survey.clear().draw();
            table_rk_survey.rows.add(arr_schedule); // Add new data
            table_rk_survey.columns.adjust().draw(); // Redraw the DataTable
            $('#data_schedule').val(JSON.stringify(arr_schedule));
            $('#schedule_rk_survey').val('');
            $('#tgl_rk_survey').val('');
            $('#ket_rk_survey').val('');
            $('#output_rk_survey').val('');
            $('#modal_rk_survey').modal('hide');
            toggleModal(modal.toLowerCase());
        }

        function deleteRks(row){
            arr_schedule.splice(row,1);
            table_rk_survey.clear().draw();
            table_rk_survey.rows.add(arr_schedule); // Add new data
            table_rk_survey.columns.adjust().draw(); // Redraw the DataTable
            $('#data_schedule').val(JSON.stringify(arr_schedule));
        }

        $(document).on("click", ".editrks", function() {
            var data = $(this).val();
            var data_arr = data.split("/");
            for (let i = 0; i < data_arr.length; i++) {
                data_arr[i] = data_arr[i].replace(/'/g, '');
            };
            $('#schedule_rk_survey_edit').val(data_arr[0]);
            $('#ket_rk_survey_edit').val(data_arr[1]);
            $('#tgl_rk_survey_edit').val(data_arr[2]);
            $('#output_rk_survey_edit').val(data_arr[3]);

            $('#row_rk_survey_edit').val(data_arr[4]);
        });

        function EditRkSurvey(modal){
            var obj = {};
            obj.schedule = $('#schedule_rk_survey_edit').val();
            obj.ket = $('#ket_rk_survey_edit').val();
            obj.tgl = $('#tgl_rk_survey_edit').val();
            obj.output = $('#output_rk_survey_edit').val();

            var row = $('#row_rk_survey_edit').val();

            for(let i = 0; i < arr_schedule.length; i++){
                if(arr_schedule[i].schedule === obj.schedule){
                    arr_schedule[i].keterangan = obj.ket;
                    arr_schedule[i].tanggal = obj.tgl;
                    arr_schedule[i].output = obj.output;
                }
            }

            table_rk_survey.clear().draw();
            table_rk_survey.rows.add(arr_schedule); // Add new data
            table_rk_survey.columns.adjust().draw(); // Redraw the DataTable
            $('#rk_survey').val(JSON.stringify(arr_schedule));
            $('#data_schedule').val(JSON.stringify(arr_schedule));
            $('#modal_rk_survey_edit').modal('hide');
        }
    </script>
@endpush