@extends('layout.master')
@section('parentPageTitle', 'Mitra Hukum')
@section('title', 'Tambah Mitra Hukum')


@section('content')
<div class="section-body mt-3">
    <div class="container-fluid">
        <div class="card">
            <div class="card-body">
                <form method="post" action="{{route('luaran.pengmas.mitra_hukum.store')}}" enctype="multipart/form-data">
                @csrf
                    @if(Session::has('alert'))
                        <div class="alert alert-danger">
                            <div><button type="button" class="close" data-dismiss="alert"></button> &nbsp;&nbsp; {{Session::get('alert')}}</div>
                        </div>
                    @endif
                    <div class="col-lg-10 col-md-6 col-sm-12">
                        <div class="form-group">
                            <label for="pilih_hibah" class="col-sm-12 col-form-label">Pilih Jenis</label>
                            <select name="pilih_hibah" id="pilih_hibah" class="form-control">
                                <option value="0">Non Hibah</option>
                                <option value="1">Hibah</option>
                            </select>
                        </div>
                    </div>
                    <div class="row clearfix">
                        <div class="col-md-2 col-sm-12" id="filter_tahun">
                            <div class="form-group">
                                <label for="filterHibahPelaksanaan" class="col-sm-12 col-form-label">Pilih Tahun<span class="required" style="color: red;"> *</span></label>
                                <select name="filterHibahPelaksanaan" id="filterHibahPelaksanaan" class="form-control">
                                    <option value="">-- Pilih Tahun --</option>
                                    @for($i=2019;$i<2030;$i++)
                                    <option value="{{$i}}">{{$i}}</option>
                                    @endfor
                                </select>
                            </div>
                        </div>
                        <div class="col-md-8 col-sm-12" id="filter_hibah">
                            <div class="form-group">
                                <label for="filterHibahOption" class="col-sm-12 col-form-label">Pilih Hibah<span class="required" style="color: red;"> *</span></label>
                                <select name="hibah_id" id="filterHibahOption" class="form-control">
                                    
                                </select>
                            </div>
                        </div>
                        <div class="col-lg-12 col-md-12 col-sm-12">
                            <div class="form-group">
                                <label for="nama_mitra" class="col-sm-3 col-form-label">Nama Mitra<span class="required" style="color: red;"> *</span></label>
                                <input type="text" name="nama_mitra" class="form-control col-sm-10" placeholder="Nama Mitra">
                            </div>
                        </div>
                        <div class="col-lg-10 col-md-6 col-sm-12">
                            <div class="form-group">
                                <label for="team"><b>Pilih Anggota Dosen (Maks. 3)</b></label>
                                <select class="selectpicker form-control" name="team[]" id="team" multiple data-selected-text-format="count > 3" data-max-options="3" data-live-search="true">
                                    @foreach($dosen as $d)
                                    <option value="{{$d['nidn']}}">{{$d['nama_dosen']}}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-lg-12 col-md-6 col-sm-12 col-dosen-selected">
                            <div class="form-group row">
                                <div class="col-sm-10">
                                    <div class="table-responsive">
                                        <table class="table table-striped">
                                            <thead>
                                                <th>Nama Dosen</th>
                                                <th>Jabatan</th>
                                            </thead>
                                            <tbody id="tableDosenSelected">
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-12 col-md-6 col-sm-12">
                            <div class="form-group row">
                                <label for="team"><b>Pilih Anggota Mahasiswa (Maks. 2)</b> <button class="btn btn-primary" id="btnAdd" type="button" onclick="insRow()" title="Tambah Mahasiswa"><i class="fa fa-plus"></i></button></label>
                                <div class="col-sm-10">
                                    <div class="table-responsive">
                                        <table class="table table-striped" id="tablemahasiswa">
                                            <thead>
                                                <tr>
                                                    <th><b>NIM</b></th>
                                                    <th><b>Nama Mahasiswa</b></th>
                                                    <th><b>Peran</b></th>
                                                    <th><b>Action</b></th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                <tr>
                                                    <td>
                                                        <input type="text" placeholder="NIM 10 karakter" maxlength="10" id="nim" class="form-control tipenumber" name="mahasiswa[nim][]">
                                                    </td>
                                                    <td>
                                                        <input type="text" placeholder="Nama Mahasiswa" id="nim" class="form-control" name="mahasiswa[nama_mahasiswa][]">
                                                    </td>
                                                    <td>
                                                        <input type="hidden" id="peran" class="form-control" name="mahasiswa[peran][]" value="Anggota">Anggota
                                                    </td>
                                                    <td>
                                                        <button type="button" class="btn btn-danger btnremove" title="Hapus baris ini" id="btnRemove" onclick="deleteRow(this);" style="display:none;"><i class="fa fa-close"></i></button>
                                                    </td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-12 col-md-6 col-sm-12  col-no_standarisasi">
                            <div class="form-group">
                                <label for="no_keputusan" class="col-sm-3 col-form-label">No. Keputusan<span class="required" style="color: red;"> *</span></label>
                                <input type="text" id="no_keputusan" name="no_keputusan" class="form-control col-sm-10" placeholder="Nomor Standarisasi">
                            </div>
                        </div>
                        <div class="col-lg-12 col-md-12 col-sm-12 col-file_keputusan_berbadan_hukum">
                            <div class="form-group">
                                <label for="file_keputusan_berbadan_hukum" class="col-sm-4 col-form-label">Unggah File Keputusan Berbadan Hukum</label>
                                <div class="col-sm-12">
                                    <input type="file" id="file_keputusan_berbadan_hukum" name="file_keputusan_berbadan_hukum" class="form-control col-sm-10">
                                </div>
                                <ul>
                                    <li>
                                        <p>Format file untuk diunggah adalah ekstensi JPG/PNG/DOC/PDF</p>
                                    </li>
                                    <li>
                                        <p>Ukuran maksimal file adalah 5 MB</p>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="col-lg-12 col-md-12 col-sm-12">
                            <div class="form-group">
                                <label for="lembaga_pemberi_status" class="col-sm-3 col-form-label">Lembaga Pemberi Status<span class="required" style="color: red;"> *</span></label>
                                <input type="text" name="lembaga_pemberi_status" class="form-control col-sm-10" placeholder="Lembaga Pemberi Status">
                            </div>
                        </div>
                        <div class="col-lg-12 col-md-12 col-sm-12">
                            <div class="form-group">
                                <label for="alamat_mitra">Alamat Mitra<span class="required" style="color: red;"> *</span></label>
                                <textarea class="form-control col-sm-10" rows="5" id="alamat_mitra" name="alamat_mitra" placeholder="Alamat Mitra" rows="2" cols="10"></textarea>
                            </div>
                        </div>
                        <div class="col-lg-12 col-md-12 col-sm-12">
                            <div class="form-group">
                                <label for="keterangan_uraian">Keterangan Uraian</label>
                                <textarea class="form-control col-sm-10" rows="5" id="keterangan_uraian" name="keterangan_uraian" placeholder="Keterangan Uraian" rows="2" cols="10"></textarea>
                            </div>
                        </div>

                        <div class="col-10">
                            <div align="right">
                                <button type="button" class="btn btn-secondary" data-dismiss="modal" onclick="history.back();">Kembali</button>
                                <button type="submit" class="btn btn-primary">Simpan</button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>            
</div>
@stop

@section('page-styles')
<link rel="stylesheet" href="{{ asset('assets/plugins/sweetalert/sweetalert.css') }}">
<link rel="stylesheet" href="{{ asset('assets/plugins/bootstrap-datepicker/css/bootstrap-datepicker3.min.css') }}">
<link rel="stylesheet" href="{{ asset('assets/plugins/bootstrap-select/css/bootstrap-select.min.css') }}">

@stop

@section('page-script')
<script src="{{ asset('assets/plugins/sweetalert/sweetalert.min.js') }}"></script>

<script src="{{ asset('assets/plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js') }}"></script>
<script src="{{ asset('assets/js/core.js') }}"></script>
<script src="{{ asset('assets/js/page/dialogs.js') }}"></script>
<script src="{{ asset('assets/plugins/bootstrap-select/js/bootstrap-select.min.js') }}"></script>
<script>
    $(document).ready(function() {
        hibah_show();

        function hibah_show(){
            var pilih_hibah = $('#pilih_hibah').val();
            if(pilih_hibah == "0"){
                $("#filter_tahun").hide();
                $("#filter_hibah").hide();
            } else {
                document.getElementById("filterHibahPelaksanaan").value="";
                $("#filter_tahun").show();
            }
        }

        $("#pilih_hibah").change(function(){
            hibah_show();
        });
    })
    
    $(".col-dosen-selected").hide();
    window.localStorage['temp_ketua'] = '[]';

    $(document).on("change", "#team", function() {
        $(".col-dosen-selected").show();
        var options = $(this).find("option:selected");
        var selected = [];

        $(options).each(function() {
            selected.push($(this).text());
        });

        var a = '';
        for(var i = 0; i<selected.length; i++){
            a += '<tr>';
            a += '<td>' +selected[i] + '</td>';
            if(i > 0)
                a += '<td> Anggota </td>';
            else
                a += '<td> Ketua </td>';
            a += '</tr>';
        }

        $('#tableDosenSelected').html(a);
        window.localStorage['temp_ketua'] = JSON.stringify(selected);

        if(selected.length == 0){
            $(".col-dosen-selected").hide();
        }
    });

    function deleteRow(row) {
        var i = row.parentNode.parentNode.rowIndex;
        document.getElementById('tablemahasiswa').deleteRow(i);
    }

    function insRow() {
        // console.log('hi');
        var x = document.getElementById('tablemahasiswa');
        var new_row = x.rows[1].cloneNode(true);
        var len = x.rows.length;
        if(len <= 2){
            var inp1 = new_row.cells[0].getElementsByTagName('input')[0];
            inp1.id += len;
            inp1.value = '';
            var inp2 = new_row.cells[1].getElementsByTagName('input')[0];
            inp2.id += len;
            inp2.value = '';
            var inp3 = new_row.cells[2].getElementsByTagName('input')[0];
            inp3.id += len;
            inp3.value = 'Anggota';
            console.log(inp3);
            var inp4 = new_row.cells[3].getElementsByTagName('button')[0];
            inp4.id += len;
            inp4.style.display = 'block';

            x.appendChild(new_row);
        }
        // new_row.cells[0].innerHTML = len;
    }
</script>
@stop