@extends('template_diklat')

@section('title')
    DIKLAT | Pengajuan Pelatihan
@stop

@section('diklat_top_script')
    @include('pengajuan::layouts.diklat_top_script')
    <style type="text/css">
        table > tbody {
            overflow-y: auto;
            height: 10px;
        }
        .scroll-body{
            height: 500px;
            overflow-y: auto;
        }
        .dataTables_scrollHeadInner > table {
            width: 100% !important;
        }
        .bootstrap-tagsinput {
            width: 100%;
            line-height: 24px !important;
        }
        .tag {
            font-size: 12px;
            padding: .3em .4em .4em;
            margin: 0 .1em;
            line-height: 2.25;
            white-space: normal !important;
        }
        .tag a {
            color: #bbb;
            cursor: pointer;
            opacity: 0.6;
        }
        .tag a:hover {
            opacity: 1.0
        }
        .tag .remove {
            vertical-align: bottom;
            top: 0;
        }
        /*.tag a {
            margin: 0 0 0 .3em;
        }*/
        .tag a .glyphicon-white {
            color: #fff;
            margin-bottom: 7px;
        }
        .tag-content {
            padding: 5px !important; 
            border: 1px solid #ccc; 
            /*border-radius: 5px; */
            min-height: 34px;
            /*width:250px;
            max-width:250px;
            display: inline-block;*/
        }
        .act {
            margin-left: 5px;
        }

        .fileUpload {
            position: relative;
            overflow: hidden;
            /*margin: 10px;*/
            border-radius: 0 !important;
        }
        .fileUpload input.upload {
            position: absolute;
            top: 0;
            right: 0;
            margin: 0;
            padding: 0;
            font-size: 20px;
            cursor: pointer;
            opacity: 0;
            filter: alpha(opacity=0);
        }

        /*iframe*/
        #upload_frame {
            border:0px;
            height:40px;
            width:400px;
            display:none;
        }

        #progress_container {
            width: 300px; 
            height: 30px; 
            border: 1px solid #CCCCCC; 
            background-color:#EBEBEB;
            display: block; 
            margin:5px 0px -15px 0px;
        }

        #progress_bar {
            position: relative; 
            height: 30px; 
            background-color: #F3631C; 
            width: 0%; 
            z-index:10; 
        }

        #progress_completed {
            font-size:16px; 
            z-index:40; 
            line-height:30px; 
            padding-left:4px; 
            color:#FFFFFF;
        }
        table .label {
            font-size: 100% !important;
        }
        .select2-container--default .select2-selection--single {
            border-radius: 0 !important;
        }
        .metode-pengajuan {
            margin: 0; padding: 0; display: none;
        }
        .input-group .select2-container .select2-selection--single {
            height: 30px !important;
        }
        .input-group .select2-container--default .select2-selection--single .select2-selection__rendered {
            line-height: 25px !important
        }
        .select2-container--default .select2-selection--single .select2-selection__arrow {
            top:0 !important;
        }
        .file-data {
            text-decoration: underline;
        }
        .file-data:hover {
            color: red;
            text-decoration: underline;   
        }
        .abang {
            color: #d73925 !important;
        }
        .ijo {
            color: #00a65a !important;
        }
        .abu {
            color: #444 !important;
        }
        .datepicker {
            border-radius: 0;
            padding: 6px 12px;
        }
        table.dataTable tr.group td {
            vertical-align: middle;
        }
        table .label {
            font-size: 11px !important;
            padding-bottom: 2px;
        }
        table.dataTable thead .sorting:after {
            opacity: 0.85 !important;
        }
        table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:after {
            opacity: 0.85 !important;   
        }
    </style>
@stop

@section('content')
@if(format_date('U',$config->tgl_mulai) <= format_date('U') && format_date('U',$config->tgl_selesai) >= format_date('U'))
    <input type="hidden" name="check-p" value="1">
@else
    <input type="hidden" name="check-p" value="0">
@endif
<section class="content" style="padding: 5px !important">
    <div class="row">        
        <div class="col-xs-12">
            <div class="box" style="margin-bottom: 0px">
                <div class="box-body" style="padding: 0px">
                    <div class="col-xs-4" style="padding: 12px">
                        <h5 class="pull-left" style="margin: 0; font-weight: bold">
                            Pengajuan <small>Fitur untuk mengajukan pelatihan</small>
                        </h5>
                    </div>
                    <div class="col-xs-4" style="padding-top:8px;">
                        <div class="filter-doc">
                            <table cellpadding="0" border="0" cellspacing="0" style="width: 100%">
                                <tr>
                                    <td class="text-center">
                                        @if(\Auth::user()->can('pengajuan.program.sender'))
                                            <button class="btn btn-xs btn-info btn-flat act" id="act-send"><i class="fa fa-send"></i> Ajukan</button>
                                        @endif
                                        <button class="btn btn-xs btn-warning btn-flat act" id="act-surat-delete"><i class="fa fa-warning"></i> Delete Surat</button>
                                        @if(\Auth::user()->can('pengajuan.program.receiver'))
                                            <button class="btn btn-xs btn-success btn-flat act" id="act-approve"><i class="fa fa-check"></i> Diterima</button>
                                            <button class="btn btn-xs btn-danger btn-flat act" id="act-reject"><i class="fa fa-times"></i> Ditolak</button>
                                        @endif
                                    </td>
                                </tr>
                            </table>
                        </div>
                    </div>
                    <div class="col-xs-4" style="padding: 5px;">
                        <div class="input-group pull-right" style="width: 25%; margin-left: 5px">
                            <select class="select2" name="filter_table_periode" data-placeholder="Choose Here..." style="width: 100%; height: 30px !important">
                                <option value="all">Semua</option>
                                @for($i=(format_date('Y') + 1); $i > (format_date('Y') - 4); $i--)
                                    <option value="{{ $i }}">{{ $i }}</option>
                                @endfor
                            </select>
                            <span class="input-group-btn">
                                <button type="button" class="btn btn-info btn-sm btn-flat" id="search-table-pengajuan"><i class="fa fa-search"></i></button>
                            </span>
                        </div>
                        <button class="btn btn-sm btn-primary pull-right btn-flat act" id="act-surat"><i class="fa fa-plus"></i> Tambah Surat</button>
                        
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="box">
                <div class="box-body">
                    <table id="data-surat" class="table table-bordered table-hover" cellpadding="0" cellspacing="0" border="0" style="font-size: 11.5px; width: 100%">
                        <thead>
                            <tr style="background-color: #222d32; color: #fff">
                                <th class="text-center" style="width:25px; padding-right: 0; padding-left: 0">
                                    <input type="checkbox" id="check-all">
                                </th>
                                <th class="text-center" style="width:100px">Periode</th>
                                <th class="text-center" style="width:100px">Tanggal</th>
                                <th class="text-center" style="width:100px">No Surat</th>
                                <th class="text-center" style="width:100px">Peserta</th>
                                <th class="text-center">Keterangan</th>
                                <!-- <th class="text-center" style="width:100px">Approval</th> -->
                                <th class="text-center" style="width:100px">Status</th>
                            </tr>
                            <tr style="background-color: #eeeeee">
                                <th class="filter-table"></th>
                                <th class="filter-table"></th>
                                <th class="filter-table">
                                    <input style="width:100% !important" type="text" class="form-control" placeholder="Enter Here...">
                                </th>
                                <th class="filter-table">
                                    <input style="width:100% !important" type="text" class="form-control" placeholder="Enter Here...">
                                </th>
                                <th class="filter-table"></th>
                                <th class="filter-table">
                                    <input style="width:100% !important" type="text" class="form-control" placeholder="Enter Here...">
                                </th>
                                <!-- <th class="filter-table"></th> -->
                                <th class="filter-table">
                                    <select class="form-control select2" data-placeholder="Choose Here..." style="width: 100%">
                                        <option value=""></option>
                                        <option value="diajukan">Diajukan</option>
                                        <option value="ditolak">Ditolak</option>
                                        <option value="disetujui">Disetujui</option>
                                    </select>
                                </th>
                            </tr>
                        </thead>
                    </table>
                </div>
            </div>
        </div>
    </div>
</section>
<div class="modal fade" id="modal-surat" tabindex="-1" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close cancel-modal" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">Kelola Data</h4>
            </div>
            <form id="form-surat" role="form">
                <div class="modal-body">
                    <div class="row">
                        <input type="hidden" name="id">
                        <div class="form-group col-md-12">
                            <label>Tanggal Surat</label>
                            <div class="input-group date">
                                <div class="input-group-addon">
                                    <i class="fa fa-calendar"></i>
                                </div>
                                <input type="text" name="tanggal" class="form-control datepicker" placeholder="Masukkan Tanggal" autocomplete="off">
                            </div>
                        </div>
                        <div class="form-group col-md-12">
                            <label>No Surat</label>
                            <input class="form-control" name="no_surat" placeholder="Masukkan No Surat">
                        </div>
                        <div class="form-group col-md-12">
                            <label>Keterangan (optional)</label>
                            <textarea class="form-control" name="keterangan" placeholder="Masukkan Keterangan"></textarea>
                        </div>
                        <div class="form-group col-md-12">
                            <label>Dasar</label>
                            <select name="dasar" class="form-control select2" data-placeholder="Choose Here..." style="width: 100%">
                                <option value="">Surat Pengajuan SDM</option>
                                <option value="disposisi">Disposisi</option>
                            </select>
                        </div>
                        <div class="form-group col-md-12 disposisi-form">
                            <label>Disposisi</label>
                            <input class="form-control" name="disposisi" placeholder="Masukkan Jabatan">
                        </div>
                        <div class="form-group col-md-6 disposisi-form">
                            <label>No Disposisi</label>
                            <input class="form-control" name="nomor" placeholder="Masukkan No Disposisi">
                        </div>
                        <div class="form-group col-md-6 disposisi-form">
                            <label>Perihal</label>
                            <input class="form-control" name="perihal" placeholder="Masukkan No Disposisi">
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger pull-left cancel-modal pengajuan-cont">Cancel</button>
                    <button type="submit" class="btn btn-success submit-form pengajuan-cont">Save changes</button>
                    <div class="pengajuan-expired" style="border:1px solid #d73925; background-color:#ffd9d4;border-radius: 4px;text-align: left;padding: 5px; color:#d73925">
                        <span>Maaf, periode pengajuan telah lewat.</span>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

<div class="modal fade" id="modal-peserta" tabindex="-1" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" style="width: 95%">
        <div class="modal-content">
            <div class="modal-header" style="padding: 5px">
                <div class="col-md-6">
                    <h4 class="modal-title" style="font-weight: bold; margin: 5px 0">Peserta</h4>
                </div>
                <div class="col-md-6 text-right" style="padding: 0">
                    <span class="btn-top-modal" style="padding: 0; margin: 0">
                        @if(\Auth::user()->isRole('admin') || \Auth::user()->isRole('administrator_diklat_(po_sdm)'))
                            <button class="btn btn-sm btn-primary btn-flat" data-toggle="modal" id="act-modal" data-ck="a" data-id="{{ Session::get('my_session')->unit_id }}"><i class="fa fa-plus"></i> Tambah</button>
                        @else
                            <button class="btn btn-sm btn-primary btn-flat" data-toggle="modal" id="act-modal" data-ck="n" data-id="{{ Session::get('my_session')->unit_id }}"><i class="fa fa-plus"></i> Tambah</button>
                        @endif
                        <button class="btn btn-sm btn-warning btn-flat" id="act-delete"><i class="fa fa-times"></i> Delete</button>
                    </span>
                    <button class="btn btn-sm btn-danger btn-flat close-modal"><i class="fa fa-times"></i></button>
                </div>
            </div>
            <div class="modal-body">
                <input type="hidden" name="pengajuan_id">
                <table id="data" class="table table-bordered table-hover" style="font-size: 11.5px;">
                    <thead>
                        <tr style="background-color: #222d32; color: #fff">
                            <th class="text-center" style="width:50px !important; padding-right: 0 !important; padding-left: 0 !important">
                                <input type="checkbox" id="check-all-pengajuan">
                            </th>
                            <th class="text-center" style="width:75px">Tanggal Pengajuan</th>
                            <th class="text-center" style="width:75px">NIP</th>
                            <th class="text-center" style="width:150px">Nama</th>
                            <th class="text-center" style="width:350px">Jabatan</th>
                            <th class="text-center" style="width:500px">Judul</th>
                            <th class="text-center" style="width:100px">Kategori</th>
                            <th class="text-center" style="width:100px">Harga</th>
                            <th class="text-center" style="width:250px">Vendor</th>
                            <th class="text-center" style="width:250px">Keterangan</th>
                            <!-- <th class="text-center" style="width:75px">Referensi</th> -->
                            <!-- <th class="text-center" style="width:75px">Approval</th> -->
                            <th class="text-center" style="width:75px">Status</th>
                        </tr>
                        <tr style="background-color: #eeeeee">
                            <th class="filter-table"></th>
                            <th class="filter-table">
                                <input style="width:100% !important" type="text" class="form-control" placeholder="Enter Here...">
                            </th>
                            <th class="filter-table">
                                <input style="width:100% !important" type="text" class="form-control" placeholder="Enter Here...">
                            </th>
                            <th class="filter-table">
                                <input style="width:100% !important" type="text" class="form-control" placeholder="Enter Here...">
                            </th>
                            <th class="filter-table">
                                <input style="width:100% !important" type="text" class="form-control" placeholder="Enter Here...">
                            </th>
                            <th class="filter-table">
                                <input style="width:100% !important" type="text" class="form-control" placeholder="Enter Here...">
                            </th>
                            <th class="filter-table">
                                <select class="form-control select2" data-placeholder="Choose Here..." style="width: 100%">
                                    <option value=""></option>
                                    @foreach($kategori as $k => $v)
                                        <option value="{{ $v->nama }}">{{ $v->nama }}</option>
                                    @endforeach
                                </select>
                            </th>
                            <th class="filter-table">
                                <!-- <input id="filter-harga" style="width:100% !important" type="text" class="form-control" placeholder="Enter Here..."> -->
                            </th>
                            <th class="filter-table">
                                <input style="width:100% !important" type="text" class="form-control" placeholder="Enter Here...">
                            </th>
                            <th class="filter-table">
                                <input style="width:100% !important" type="text" class="form-control" placeholder="Enter Here...">
                            </th>
                            <!-- <th class="filter-table"></th>
                            <th class="filter-table"></th> -->
                            <th class="filter-table">
                                <select class="form-control select2" data-placeholder="Choose Here..." style="width: 100%">
                                    <option value=""></option>
                                    <option value="menunggu">Menunggu</option>
                                    <option value="reject">Reject</option>
                                    <option value="approved">Approved</option>
                                </select>
                            </th>
                        </tr>
                    </thead>
                </table>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="modal" tabindex="-1" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" style="width: 95%">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close cancel-modal" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">Kelola Data</h4>
            </div>
            <form id="form-modal" role="form" enctype="multipart/form-data">
                <div class="modal-body">
                    <div class="row">
                        <input type="hidden" name="id">
                        <input type="hidden" name="pengajuan_id">
                        <div class="form-group col-md-4">
                            <label>Bagian</label>
                            <select class="form-control" name="bagian_id" data-placeholder="Pilih Bagian" style="width: 100%">
                                <option value=""></option>
                                @foreach($bagian as $key => $value)
                                    <option value="{{ $value->id }}">{{ $value->nama }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="form-group col-md-4">
                            <label>Pegawai</label>
                            <input type="hidden" class="form-control" name="pegawai_id">
                            <input type="text" class="form-control" name="pegawai" placeholder="Masukkan Pegawai">
                        </div>
                        <div class="form-group col-md-4">
                            <label>Jabatan</label>
                            <input type="hidden" class="form-control" name="layer">
                            <input type="text" class="form-control" name="jabatan" placeholder="Masukkan Jabatan" disabled="disabled">
                        </div>
                        <div class="form-group col-md-12">
                            <label>Judul</label>
                            <button type="button" class="btn btn-primary pull-right btn-xs" id="act-judul">
                                <i class="fa fa-plus"></i> Judul
                            </button>
                            <input type="hidden" class="form-control" name="judul_id">
                            <input type="hidden" class="form-control" name="status_judul">
                            <input type="text" class="form-control" name="judul_readonly" placeholder="Pilih Judul" disabled="disabled">
                        </div>
                        <div class="form-group col-md-6">
                            <label>Harga</label>
                            <input type="text" class="form-control" name="harga_readonly" placeholder="Masukkan Harga" disabled="disabled">
                        </div>
                        <div class="form-group col-md-6">
                            <label>Kategori</label>
                            <input type="text" class="form-control" name="kategori_readonly" placeholder="Pilih Kategori" disabled="disabled">
                        </div>
                        <div class="form-group col-md-12">
                            <label>Vendor</label>
                            <input type="text" class="form-control" name="vendor" placeholder="Masukkan Vendor">
                        </div>
                        <div class="form-group col-md-12">
                            <label>Keterangan</label>
                            <textarea class="form-control" name="keterangan" placeholder="Masukkan Keterangan" style="max-width:1308px; height: 60px"></textarea>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger pull-left cancel-modal">Cancel</button>
                    <button type="button" class="btn btn-success submit-form">Save changes</button>
                </div>
            </form>
        </div>
    </div>
</div>

<div class="modal fade" id="modal-judul" tabindex="-1" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" style="width: 95%">
        <div class="modal-content">
            <div class="modal-header" style="padding: 5px">
                <div class="col-md-6">
                    <h4 class="modal-title" style="font-weight: bold; margin: 5px 0">Judul</h4>
                </div>
                <div class="col-md-6 text-right" style="padding: 0">
                    <!-- <button type="button" class="btn btn-sm btn-primary btn-flat btn-tmbh-judul"><i class="fa fa-plus"></i> Judul</button> -->
                    <button type="button" class="btn btn-sm btn-danger btn-flat close-modal">Close</button>
                </div>
            </div>
            <div class="modal-body">
                <table id="judul-table" class="table table-bordered table-hover" style="font-size: 11.5px;" width="100%">
                    <thead>
                        <tr style="background-color: #222d32; color: #fff">
                            <th class="text-center">Judul</th>
                            <th class="text-center">Kategori</th>
                            <th class="text-center">Harga</th>
                            <th class="text-center">Terverifikasi</th>
                            <th class="text-center">Aksi</th>
                        </tr>
                        <tr style="background-color: #eee">
                            <th class="filter-table">
                                <input class="form-control" type="text" placeholder="Enter Here..." style="width: 100%">
                            </th>
                            <th class="filter-table">
                                <select class="select2" style="width: 100%" data-placeholder="Choose Here..">
                                    <option value=""></option>
                                    @foreach($kategori as $k => $v)
                                        <option value="{{ $v->nama }}">{{ $v->nama }}</option>
                                    @endforeach
                                </select>
                            </th>
                            <th class="filter-table">
                                <!-- <input class="form-control" type="text" placeholder="Enter Here..." style="width: 100%"> -->
                            </th>
                            <th class="filter-table">
                                <select class="select2" data-placeholder="Select Here..." style="width: 100%">
                                    <option value=""></option>
                                    <option value="1">Sudah</option>
                                    <option value="0">Belum</option>
                                </select>
                            </th>
                            <th class="filter-table"></th>
                        </tr>
                    </thead>
                </table>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="modal-tmbh-judul" tabindex="-1" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" style="width: 95%">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close cancel-modal" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">Kelola Data</h4>
            </div>
            <form id="form-modal-tmbh-judul" role="form" enctype="multipart/form-data">
                <div class="modal-body scroll-body">
                    <div class="row" style="border-bottom: 2px dotted #ccc">
                        <h3 style="margin: 0px 14px 25px 14px !important; font-weight: bold; border-bottom: 1px solid black">Detail Judul</h3>
                        <input type="hidden" name="bagian_id">
                        <div class="form-group col-md-12">
                            <label>Judul Pelatihan</label>
                            <textarea class="form-control" name="judul" placeholder="Masukkan Judul Pelatihan"></textarea>
                        </div>
                        <div class="form-group col-md-12">
                            <label>Kompetensi</label>
                            <select name="kompetensi_id[]" data-placeholder="Pilih Kompetensi" multiple="multiple" style="width: 100%"></select>
                        </div>
                        <div class="form-group col-md-6">
                            <label>Harga</label>
                            <input type="text" class="form-control" name="harga" placeholder="Masukkan Harga">
                        </div>
                        <div class="form-group col-md-6">
                            <label>Kategori</label>
                            <select name="kategori_id" class="select2-judul" style="width: 100%" data-placeholder="Choose Here..">
                                <option value=""></option>
                                @foreach($kategori as $k => $v)
                                    <option value="{{ $v->id }}">{{ $v->nama }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="form-group col-md-12">
                            <label>Keterangan</label>
                            <textarea class="form-control" name="keterangan" placeholder="Masukkan Keterangan"></textarea>
                        </div>
                    </div>
                    <div class="row">
                        <h3 style="margin: 25px 14px 25px 14px !important; font-weight: bold; border-bottom: 1px solid black">Referensi</h3>
                        <div class="form-group col-md-8">
                            <label>Referensi (URL/LINK)</label>
                            <input type="text" class="form-control" name="link_referensi" placeholder="Masukkan Referensi (URL/LINK)">
                        </div>
                        <div class="form-group col-md-4">
                            <label>File Referensi</label>
                            <div class="input-group">
                                <input name="disabled_name" placeholder="Choose File" disabled="disabled" class="form-control uploadFile">
                                <span class="input-group-addon" style="vertical-align: top !important; padding: 0 !important; border: none">
                                    <div class="fileUpload btn btn-primary">
                                        <span><i class="fa fa-file"></i></span>
                                        <input type="file" class="upload uploadBtn" name="file_referensi" placeholder="Pilih File">
                                    </div>
                                </span>
                            </div>
                        </div>
                        <div class="form-group col-md-12">
                            <label>Keterangan</label>
                            <textarea class="form-control" name="keterangan_referensi" placeholder="Masukkan Keterangan"></textarea>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger pull-left cancel-modal">Cancel</button>
                    <button type="button" class="btn btn-success submit-form">Save changes</button>
                </div>
            </form>
        </div>
    </div>
</div>

<!-- <div class="modal fade" id="modal-peserta" tabindex="-1" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" style="width: 80%">
        <div class="modal-content">
            <div class="modal-header" style="padding: 5px">
                <div class="col-md-6">
                    <h4 class="modal-title" style="font-weight: bold; margin: 5px 0">Peserta</h4>
                </div>
                <div class="col-md-6 text-right" style="padding: 0">
                    <button type="button" class="btn btn-danger btn-flat close-modal">Close</button>
                    <button type="button" class="btn btn-success btn-flat" id="pilih-peserta">Pilih</button>
                </div>
            </div>
            <div class="modal-body">
                <table id="peserta" class="table table-bordered table-hover" style="font-size: 12px;" width="100%">
                    <thead>
                        <tr>
                            <th class="text-center" style="width: 25px"><input type="checkbox" id="check-all"></th>
                            <th class="text-center" style="width: 75px">Nip</th>
                            <th class="text-center" style="width: 150px">Nama</th>
                            <th class="text-center" style="width: 100px">Layer</th>
                            <th class="text-center">Jabatan</th>
                            <th class="text-center">Bagian</th>
                        </tr>
                        <tr style="background-color: #eee">
                            <th class="filter-table filter-table-peserta"></th>
                            <th class="filter-table filter-table-peserta"><input class="form-control" type="text" placeholder="Enter Here..." style="width: 100%"></th>
                            <th class="filter-table filter-table-peserta"><input class="form-control" type="text" placeholder="Enter Here..." style="width: 100%"></th>
                            <th class="filter-table filter-table-peserta">
                                <select class="form-control select2" data-placeholder="Select Here..." style="width: 100%">
                                    <option value=""></option>
                                    <option value="Direktur Utama">Direktur Utama</option>
                                    <option value="Direktur Bidang">Direktur Bidang</option>
                                    <option value="Manajer Senior">Manajer Senior</option>
                                    <option value="Manajer">Manajer</option>
                                    <option value="Supervisor">Supervisor</option>
                                    <option value="Staf Senior">Staf Senior</option>
                                    <option value="Staf">Staf</option>
                                </select>
                            </th>
                            <th class="filter-table filter-table-peserta"><input class="form-control" type="text" placeholder="Enter Here..." style="width: 100%"></th>
                            <th class="filter-table filter-table-peserta"><input class="form-control" type="text" placeholder="Enter Here..." style="width: 100%"></th>
                        </tr>
                    </thead>
                </table>
            </div>
        </div>
    </div>
</div> -->

<!-- <div class="modal fade" id="modal-pengajuan" tabindex="-1" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" style="width:50%">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">Form Pengajuan</h4>
            </div>
            <form id="form-modal-pengajuan" role="form">
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group">
                                <label>Pilih Metode</label>
                                <select class="form-control" name="metode" style="width: 100%" data-placeholder="Pilih Metode">
                                    <option value=""></option>
                                    <option value="baru">Pengajuan Baru</option>
                                    <option value="tambahan">Pengajuan Tambahan / Revisi</option>
                                </select>
                            </div>
                            <div class="metode-pengajuan pengajuan-baru">
                                <div class="form-group">
                                    <label>No Surat</label>
                                    <input type="text" class="form-control" name="no_surat" placeholder="Masukkan No Surat" width="100%">
                                </div>
                                <div class="form-group">
                                    <label>File Surat</label>
                                    <input type="hidden" name="file_id">
                                    <div class="input-group">
                                        <input type="text" class="form-control" name="file_data" placeholder="Pilih File Surat" disabled>
                                        <span class="input-group-btn">
                                            <button type="button" class="btn btn-danger btn-flat" id="clear-file-pengajuan"><i class="fa fa-times"></i> Clear</button>
                                        </span>
                                        <span class="input-group-btn">
                                            <button type="button" class="btn btn-info btn-flat" id="choose-file"><i class="fa fa-file"></i> Pilih File</button>
                                        </span>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label>Keterangan <span style="color: #ccc">(Optional)</span></label>
                                    <textarea class="form-control" name="keterangan" placeholder="Masukkan Keteragan"></textarea>
                                </div>
                            </div>
                            <div class="metode-pengajuan pengajuan-tambahan">
                                <table id="table-surat" class="table table-bordered table-hover" style="font-size: 12px; width: 100%">
                                    <thead>
                                        <tr>
                                            <th class="text-center"></th>
                                            <th class="text-center">Periode</th>
                                            <th class="text-center">Tanggal</th>
                                            <th class="text-center">No Surat</th>
                                        </tr>
                                    </thead>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger pull-left cancel-modal-pengajuan">Cancel</button>
                    <button type="submit" class="btn btn-success">Save changes</button>
                </div>
            </form>
        </div>
    </div>
</div> -->

<!-- <div class="modal fade" id="modal-pengajuan-file" tabindex="-1" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" style="width:50%">
        <div class="modal-content">
            <div class="modal-header" style="padding: 10px 0;">
                <div class="col-md-6">
                    <h4 class="modal-title">File Data</h4>    
                </div>
                <div class="col-md-6 text-right">
                    <button type="button" class="btn btn-danger btn-flat close-modal-file">Close</button>
                </div>                
            </div>
            <div class="modal-body">
                <form role="form" id="form-file-upload" enctype="multipart/form-data" style="border-bottom: 1px dotted #ccc;">
                    <div class="row">
                        <div class="form-group col-md-12">
                            <div class="input-group">
                                <input type="text" name="nama" class="form-control" placeholder="Nama File">
                                <span class="input-group-addon" style="vertical-align: top !important; padding: 0 !important; border: none; width: 40%">
                                    <input name="disabled_name" placeholder="Choose File" disabled="disabled" class="form-control uploadFile">
                                </span>
                                <span class="input-group-addon" style="vertical-align: top !important; padding: 0 !important; border: none">
                                    <div class="fileUpload btn btn-primary">
                                        <span><i class="fa fa-file"></i></span>
                                        <input type="file" name="data_file" placeholder="Pilih File" class="upload uploadBtn">
                                    </div>
                                </span>
                                <span class="input-group-btn">
                                    <button type="submit" class="btn btn-info btn-flat">Upload</button>
                                </span>
                            </div>
                        </div>
                        <div class="col-md-12" id="upload-progress" style="display: none;">
                            <div class="progress">
                                <div class="progress-bar progress-bar-success progress-bar-striped" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 40%">
                                    <span class="sr-only">0%</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
                <div class="row" style="margin-top: 10px">
                    <div class="col-md-12">
                        <table id="file" class="table table-bordered table-hover" style="font-size: 12px;" width="100%">
                            <thead>
                                <tr>
                                    <th class="text-center">Tanggal</th>
                                    <th class="text-center">Nama</th>
                                    <th class="text-center">Aksi</th>
                                </tr>
                            </thead>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div> -->

<div class="modal fade" id="modal-reject" tabindex="-1" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close cancel-modal" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">Keterangan Ditolak</h4>
            </div>
            <div class="modal-body">
                <label>Isikan alasan menolak data pengajuan ini?</label>
                <input type="text" class="form-control" name="keterangan" placeholder="Alasan Ditolak">
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-sm btn-danger" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-sm btn-info pull-right" id="act-simpan-reject">Simpan</button>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="modal-ket-reject" tabindex="-1" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close cancel-modal" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">Keterangan Ditolak</h4>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-12">
                        <p></p>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-sm btn-danger pull-right" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="modal-referensi" tabindex="-1" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close cancel-modal" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">Referensi</h4>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-12">
                        <div class="form-group">
                            <label>LINK / URL</label>
                            <p class="url"></p>
                        </div>
                        <div class="form-group">
                            <label>File</label>
                            <p class="file"></p>
                        </div>
                        <div class="form-group">
                            <label>Keterangan</label>
                            <p class="keterangan"></p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-sm btn-danger pull-right" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>
@stop

@section('diklat_bottom_script')
    @include('pengajuan::layouts.diklat_bottom_script')
@stop