@extends('template')

@section('title')
    HRIS | Pembuatan SPPD
@stop

@section('top_script')
    @include('sppd::layouts.top_script')
    <style type="text/css">
        tbody td {
            vertical-align: middle !important;
        }
        tbody td ol {
            padding-left: 10px;
        }
        table > tbody > tr > td {
            padding: 0px;
        }
        tbody td {
            vertical-align: middle !important;
        }
        table thead tr th {
            background-color: #2e3e4e !important;
            color: #ffffff;
            font-size: 10px !important;
        }
        table thead tr th input {
            border-radius: 0px;
            line-height: 16px;
        }
        table thead tr th input::placeholder { color: #efefef !important; }
        table .select2-container {
            border-radius: 0;
        }
        table .select2-container .select2-choice {
            height: 34px;
            line-height: 31px !important;
        }
        table .select2-container .select2-choice > .select2-chosen {
            font-size: 10px;
            color: #a7a2a2 !important;
        }
        .panel .table td {
            padding: 2px 5px;
            vertical-align: middle;
        }
        .table>tbody.list-table-biaya>tr>td {
            padding: 3px;
        }
        .table>tbody.list-table-biaya>tr>td.text-right {
            padding-right: 5px;
        }
        .table>tbody.tbody-list-biaya>tr>td {
            padding:5px;
            font-size: 11px
        }
        .tooltip {
            z-index: 1050 !important;
        }
    </style>
@stop

@section('content')
<section class="scrollable padder">
    <ul class="breadcrumb no-border no-radius b-b b-light pull-in">
        <li><a href="{{ url('home') }}"><i class="fa fa-home"></i> Home</a></li>
        <li><a href="#">Sppd</a></li>
        <li class="active">Pembuatan SPPD</li>
    </ul>
    <div class="m-b-md text-center">
        <h5 class="m-b-none"><strong>PEMBUATAN</strong> SPPD</h5>
        <span style="font-size: 11px">Fitur untuk pembuatan sppd</span>
    </div>
    <!-- <div class="alert alert-warning alert-block">
        <button type="button" class="close" data-dismiss="alert">×</button>
        <h4><i class="fa fa-bell-alt"></i>Mohon Maaf...</h4>
        <p>Fitur ini masih dalam tahap percobaan dan masih belum dapat digunakan.</p>
    </div> -->
    <section class="panel panel-default">
        <div class="panel-body" style="padding:0px">
            <div class="row" style="padding: 5px">
                <div class="col-md-12">
                    <button type="button" class="btn btn-success btn-xs pull-right button-sppd-refresh" style="border-radius:0"><i class="fa fa-refresh"></i></button>
                    <button type="button" class="btn btn-info btn-xs pull-right modal-button-sppd" style="border-radius:0; margin-right: 5px"><i class="fa fa-plus"></i> SPPD</button>
                </div>
            </div>
            <section class="panel panel-info" style="margin-bottom: 0px; border-top:2px dotted #ccc">
                <div class="table-responsive">
                    <span class="msg_table"></span>
                    <table id="data-sppd" class="table table-hover table-bordered table-striped m-b-none" style="font-size:11px;">
                        <thead>
                            <tr>
                                <th class="text-center" style="vertical-align: middle;" width="100px">NO SPPD</th>
                                <th class="text-center" style="vertical-align: middle;" width="100px">BERANGKAT</th>
                                <th class="text-center" style="vertical-align: middle;" width="100px">KEMBALI</th>
                                <th class="text-center" style="vertical-align: middle;" width="85px">STATUS</th>
                                <th class="text-center" style="vertical-align: middle;" width="160px">UBAH STATUS</th>
                                <th class="text-center" style="vertical-align: middle;" width="60px">DOK</th>
                                <th class="text-center" style="vertical-align: middle;" width="145px">AKSI</th>
                                <!-- <th class="text-center" style="vertical-align: middle;" width="140px">STATUS PARAF</th>
                                <th class="text-center" style="vertical-align: middle;" width="100px">APPROVAL</th> -->
                                <th class="text-center" style="vertical-align: middle;" width="150px">CETAK</th>
                                <th class="text-center" style="vertical-align: middle;" width="180px">TUJUAN</th>
                                <th class="text-center" style="vertical-align: middle;" width="320px">MAKSUD</th>
                            </tr>
                            <tr>
                                <td style="padding:0; border:0 none;" class="text-center"><input type="text" class="form-control default-input cari" placeholder="Cari SPPD" style="width: 100%; border-radius:0px; height: 27px; padding: 3px 7px; font-size:10px"></td>
                                <td style="padding:0; border:0 none;" class="text-center"><input type="text" class="form-control default-input cari" placeholder="dd-mm-yyyy" style="width: 100%; border-radius:0px; height: 27px; padding: 3px 7px; font-size:10px"></td>
                                <td style="padding:0; border:0 none;" class="text-center"><input type="text" class="form-control default-input cari" placeholder="dd-mm-yyyy" style="width: 100%; border-radius:0px; height: 27px; padding: 3px 7px; font-size:10px"></td>
                                <td style="padding:0; border:0 none;">
                                    <select class="select2-option" data-placeholder="Pilih Status" style="width: 100%; border-radius:0px; height: 27px; font-size:10px">
                                        <option value=""></option>
                                        <option value="menunggu">Menunggu</option>
                                        <option value="paraf">Paraf</option>
                                        <option value="kirim">Kirim</option>
                                        <option value="selesai">Selesai</option>
                                    </select>
                                </td>
                                <td style="padding:0; border:0 none;"><input type="text" style="width: 100%; border-radius:0px; height: 27px; padding: 3px 7px; font-size:10px" class="form-control default-input" disabled></td>
                                <td style="padding:0; border:0 none;"><input type="text" style="width: 100%; border-radius:0px; height: 27px; padding: 3px 7px; font-size:10px" class="form-control default-input" disabled></td>
                                <td style="padding:0; border:0 none;"><input type="text" style="width: 100%; border-radius:0px; height: 27px; padding: 3px 7px; font-size:10px" class="form-control default-input" disabled></td>
                                <!-- <td style="padding:0; border:0 none;"><input type="text" style="width: 100%; border-radius:0px; height: 27px; padding: 3px 7px; font-size:10px" class="form-control default-input" disabled></td>
                                <td style="padding:0; border:0 none;"><input type="text" style="width: 100%; border-radius:0px; height: 27px; padding: 3px 7px; font-size:10px" class="form-control default-input" disabled></td> -->
                                <td style="padding:0; border:0 none;"><input type="text" style="width: 100%; border-radius:0px; height: 27px; padding: 3px 7px; font-size:10px" class="form-control default-input" disabled></td>
                                <td style="padding:0; border:0 none;" class="text-center"><input type="text" class="form-control default-input cari" placeholder="Cari Tujuan" style="width: 100%; border-radius:0px; height: 27px; padding: 3px 7px; font-size:10px"></td>
                                <td style="padding:0; border:0 none;" class="text-center"><input type="text" class="form-control default-input cari" placeholder="Cari Maksud" style="width: 100%; border-radius:0px; height: 27px; padding: 3px 7px; font-size:10px"></td>
                            </tr>
                        </thead>
                        <tbody>
                        </tbody>
                    </table>
                </div>
            </section>
        </div>
    </section>
</section>
<div id="modal-ubah-nomor" class="modal fade in" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog">
        <div class="modal-content">
            <form id="form-ubah-nomor">
                <div class="modal-header" style="border-radius:6px 6px 0 0; color:#3a87ad; background-color:#f5f5f5; padding:15px !important">
                    <button class="close" data-dismiss="modal" type="button">×</button>
                    <h4 class="modal-title">Ubah Nomor</h4>
                </div>
                <div class="modal-body" style="padding-top:10px; padding-bottom:0px">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group" style="margin-bottom:10px">
                                <label>Nomor SPPD:</label>
                                <input type="hidden" name="sppd_id_nomor">
                                <input type="text" class="form-control default-input" id="no_sppd" name="no_sppd" placeholder="Nomor SPPD">
                            </div>
                            <div class="form-group" style="margin-bottom: 10px">
                                <label>Tanggal SPPD:</label>
                                <input type="text" style="width:100%" data-date-format="dd-mm-yyyy" size="16" class="input-s datepicker-input form-control" name="tanggal_sppd" placeholder="Tanggal Surat">
                            </div>
                        </div>    
                    </div>
                </div>
                <div class="modal-footer" style="background-color:#f5f5f5; border-radius:0 0 6px 6px; margin-top:0px">
                    <button type="reset" class="btn btn-sm btn-danger" data-dismiss="modal">Close</button>
                    <button type="submit" class="btn btn-sm btn-success">Simpan</button>
                </div>
            </form>
        </div>
    </div>
</div>
<div id="modal-ubah-paraf" class="modal fade in" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog">
        <div class="modal-content">
            <form id="form-ubah-paraf">
                <div class="modal-header" style="border-radius:6px 6px 0 0; color:#3a87ad; background-color:#f5f5f5">
                    <button class="close" data-dismiss="modal" type="button">×</button>
                    <h4 class="modal-title">Ubah Paraf</h4>
                </div>
                <div class="modal-body" style="padding-bottom:0px">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group" style="margin-bottom: 10px">
                                <label>Pegawai:</label>
                                <input type="hidden" name="pegawai_id_paraf">
                                <input type="hidden" name="sppd_id_paraf">
                                <input type="text" class="form-control default-input" id="autocomplete-paraf" name="autocomplete-paraf" placeholder="Pegawai Paraf">
                            </div>
                        </div>    
                    </div>
                    <div class="row">
                        <div class="col-md-4">
                            <div class="form-group" style="margin-bottom: 10px">
                                <label>Bypass:</label><br>
                                <select name="bypass" style="width:100%" data-placeholder="Pilih Status Bypass" class="select2-option">
                                    <option value=""></option>
                                    <option value="1">Ya</option>
                                    <option value="0">Tidak</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-md-8">
                            <div class="form-group">
                                <label>Keterangan Bypass:</label>
                                <textarea class="form-control" rows="3" name="ket_bypass" placeholder="Isi Keterangan Jika di bypass"></textarea>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer" style="background-color:#f5f5f5; border-radius:0 0 6px 6px; margin-top:0px">
                    <button type="reset" class="btn btn-sm btn-danger" data-dismiss="modal">Close</button>
                    <button type="submit" class="btn btn-sm btn-success">Simpan</button>
                </div>
            </form>
        </div>
    </div>
</div>
<div id="modal-daftar-biaya" class="modal fade in" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" style="width: 80%">
        <div class="modal-content">
            <div class="modal-header" style="border-radius:6px 6px 0 0; color:#3a87ad; background-color:#f5f5f5">
                <button class="close" data-dismiss="modal" type="button">×</button>
                <h4 class="modal-title">Penyesuaian Biaya SPPD</h4>
            </div>
            <div class="modal-body" style="overflow-x:scroll">
                <input type="hidden" name="sppd_id_biaya">
                <div class="table-responsive">
                    <table id="data-list-biaya" class="table table-hover table-bordered table-striped m-b-none" style="table-layout:fixed">
                        <thead>
                            <tr>
                                <th class="text-center" style="vertical-align: middle;" width="60px">AKSI</th>
                                <th class="text-center" style="vertical-align: middle;" width="90px">NIP</th>
                                <th class="text-center" style="vertical-align: middle;" width="180px">NAMA</th>
                                <th class="text-center" style="vertical-align: middle;" width="200px">JABATAN</th>
                                <th class="text-center" style="vertical-align: middle;" width="110px">Transportasi</th>
                                <th class="text-center" style="vertical-align: middle;" width="110px">Kendaraan</th>
                                <th class="text-center" style="vertical-align: middle;" width="110px">Penginapan</th>
                                <th class="text-center" style="vertical-align: middle;" width="110px">Makan</th>
                                <th class="text-center" style="vertical-align: middle;" width="110px">Uang Saku</th>
                                <th class="text-center" style="vertical-align: middle;" width="110px">Transport Dalam Kota</th>
                                <th class="text-center" style="vertical-align: middle;" width="110px">Laundry</th>
                                <th class="text-center" style="vertical-align: middle;" width="110px">Uang Saku (Tidak Menginap)</th>
                                <th class="text-center" style="vertical-align: middle;" width="110px">Uang Harian</th>
                                <th class="text-center" style="vertical-align: middle;" width="110px">Transport dan Makan</th>
                            </tr>
                        </thead>
                        <tbody class="tbody-list-biaya">
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<div id="modal-rinci-biaya" class="modal fade in" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" style="width: 60%">
        <div class="modal-content">
            <div class="modal-header" style="border-radius:6px 6px 0 0; color:#3a87ad; background-color:#f5f5f5">
                <button class="close" data-dismiss="modal" type="button">×</button>
                <h4 class="modal-title">Rinci Biaya SPPD</h4>
            </div>
            <div class="modal-body">
                <input type="hidden" name="sppd_id_biaya">
                <div class="table-responsive">
                    <div class="form-group" style="margin-bottom: 10px">
                        <div class="input-group">
                            <span class="input-group-addon">Tanggal Cetak Rinci</span>
                            <input type="text" name="cetak_rinci" style="width:100%" data-date-format="dd-mm-yyyy" data-cetak="rinci" size="16" class="input-s tgl-print datepicker-input form-control" placeholder="Tanggal Cetak Rinci">
                            <span class="input-group-addon">Tanggal Cetak Kwitansi</span>
                            <input type="text" name="cetak_kwitansi" style="width:100%" data-date-format="dd-mm-yyyy" data-cetak="kwitansi" size="16" class="input-s tgl-print datepicker-input form-control" placeholder="Tanggal Cetak Kwitansi">
                        </div>
                    </div>
                    <table width="100%" id="data-rinci-biaya" class="table table-hover table-bordered table-striped m-b-none" style="font-size: 11px;">
                        <thead>
                            <tr>
                                <th class="text-center" style="vertical-align: middle;" width="60px">AKSI</th>
                                <th class="text-center" style="vertical-align: middle;" width="120px">NIP</th>
                                <th class="text-center" style="vertical-align: middle;" width="200px">NAMA</th>
                                <th class="text-center" style="vertical-align: middle;">JABATAN</th>
                                <th class="text-center" style="vertical-align: middle;" width="110px">TIKET</th>
                                <th class="text-center" style="vertical-align: middle;" width="110px">HOTEL</th>
                                <th class="text-center" style="vertical-align: middle;" width="110px">UANG SAKU</th>
                            </tr>
                        </thead>
                        <tbody class="tbody-rinci-biaya">
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<div id="modal-reject-info" class="modal fade in" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header" style="border-radius:6px 6px 0 0; color:#3a87ad; background-color:#f5f5f5">
                <button class="close" data-dismiss="modal" type="button">×</button>
                <h4 class="modal-title">Keterangan Reject</h4>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-12">
                        <div id="info"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div id="modal-sppd" class="modal fade in" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" style="width: 80%">
        <div class="modal-content">
            <form id="form-sppd">
                <div class="modal-header" style="border-radius:6px 6px 0 0; color:#3a87ad; background-color:#f5f5f5">
                    <button class="close close-modal" type="button">×</button>
                    <h4 class="modal-title">Pembuatan SPPD</h4>
                </div>
                <div class="modal-body" style="max-height:470px; overflow-y:scroll">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="col-md-6" style="padding: 0">
                                <div class="form-group" style="margin-bottom: 10px">
                                    <label>Periode:</label>
                                    <input type="text" class="form-control default-input" name="periode" placeholder="Periode">
                                </div>
                                <div class="form-group" style="margin-bottom: 10px">
                                    <label>No SPPD:</label>
                                    <input type="hidden" name="sppd_id">
                                    <input type="text" class="form-control default-input" name="no_sppd" placeholder="Nomor SPPD">
                                </div>
                                <div class="form-group" style="margin-bottom: 10px">
                                    <label>Tanggal:</label>
                                    <div class="input-group">
                                        <input type="text" style="width:100%" data-date-format="dd-mm-yyyy" size="16" class="input-s datepicker-input form-control" name="berangkat" placeholder="Tanggal Berangkat">
                                        <span class="input-group-addon">s/d</span>
                                        <input type="text" style="width:100%" data-date-format="dd-mm-yyyy" size="16" class="input-s datepicker-input form-control" name="kembali" placeholder="Tanggal Kembali">
                                        
                                    </div>
                                </div>
                                <div class="form-group" style="margin-bottom: 10px">
                                    <label>Dasar Perhitungan Biaya:</label>
                                    <select class="select2-option" name="dasar_biaya" data-placeholder="Pilih Dasar Biaya" style="width: 100%; border-radius:0px; height:33px">
                                        <option value=""></option>
										<option value="10 Tahun 2024 Tgl. 26 Juni 2024">10 Tahun 2024 Tgl. 26 Juni 2024</option>
                                        <option value="08 Tahun 2010 Tgl. 21 Juni 2010">08 Tahun 2010 Tgl. 21 Juni 2010</option>
                                        <option value="02 Tahun 2015 Tgl. 9 Februari 2015">02 Tahun 2015 Tgl. 9 Februari 2015</option>
                                        <option value="08 Tahun 2010 Tgl. 21 Juni 2010 dan 02 Tahun 2015 Tgl. 9 Februari 2015">08 Tahun 2010 Tgl. 21 Juni 2010 dan 02 Tahun 2015 Tgl. 9 Februari 2015</option>
										<option value="04 Tahun 2023 Tgl. 14 Maret 2023">04 Tahun 2023 Tgl. 14 Maret 2023</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-6" style="padding: 0 0 0 15px">
                                <div class="form-group" style="margin-bottom: 10px">
                                    <label>Atas Perintah:</label>
                                    <input type="hidden" name="perintah">
                                    <input type="text" class="form-control default-input" id="autocomplete-perintah" name="sh_perintah" placeholder="Pejabat yang memerintahkan">
                                </div>
                                <div class="form-group" style="margin-bottom: 10px">
                                    <label>Tgl SPPD:</label>
                                    <input type="text" style="width:100%" data-date-format="dd-mm-yyyy" size="16" class="input-s datepicker-input form-control" name="tanggal_sppd" placeholder="Tanggal SPPD">
                                </div>                              
                                <div class="form-group" style="margin-bottom: 10px">
                                    <label>Kendaraan yang digunakan:</label>
                                    <select class="select2-option" name="kendaraan[]" multiple="multiple" data-placeholder="Pilih Kendaraan" style="width: 100%; border-radius:0px; height:33px">
                                        <option value=""></option>
                                        <option value="pesawat">Pesawat</option>
                                        <option value="kereta api">Kereta Api</option>
                                        <option value="bus">Bus</option>
                                        <option value="kendaraan dinas">Kendaraan Dinas</option>
                                    </select>
                                </div>
                            </div>
                        </div>    
                    </div>
                    <div class="row">
                        <div class="col-md-6">
                            <div class="form-group" style="margin-bottom: 10px">
                                <label>NO.SP</label>
                                <input type="text" class="form-control default-input" id="cbnosp" name="cbnosp" placeholder="Nomor SP">
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label>Dasar SPPD:</label>
                                <textarea class="form-control" name="dasar" placeholder="Dasar SPPD"></textarea>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group">
                                <label>Keterangan Perhitungan Biaya Perjalanan:</label>
                                <textarea class="form-control" name="keterangan_perhitungan" placeholder="Perhitunngan Biaya Perjalanan">Semua biaya dibebankan pada Anggaran PDAM Surya Sembada Kota Surabaya sesuai Peraturan Direksi No. 10 Tahun 2024</textarea>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group">
                                <label>Maksud:</label>
                                <textarea class="form-control" name="maksud" placeholder="Maksud Perjalanan"></textarea>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group">
                                <label>Keterangan lain-lain:</label>
                                <textarea class="form-control" name="keterangan_lain" placeholder="Keterangan lain-lain / Pengikut">Membuat laporan hasil perjalanan dinas kepada Direksi.</textarea>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <fieldset style="width:100%">
                                <legend id="personal-form" style="margin-bottom:10px">TUJUAN</legend>
                                <div class="col-md-2" style="padding:0 0 0 0">
                                    <div class="form-group" style="margin-bottom: 10px">
                                        <input type="hidden" name="dari_temp">
                                        <input type="hidden" name="id_dari_temp">
                                        <input type="hidden" name="id_dari">
                                        <input type="text" class="form-control default-input" id="autocomplete-dari" name="dari" placeholder="Dari">
                                    </div>
                                </div>
                                <div class="col-md-2" style="padding:0 0 0 15px">
                                    <div class="form-group" style="margin-bottom: 10px">
                                        <input type="hidden" name="ke_temp">
                                        <input type="hidden" name="id_ke_temp">
                                        <input type="hidden" name="id_ke">
                                        <input type="text" class="form-control default-input" id="autocomplete-ke" name="ke" placeholder="Ke">
                                    </div>
                                </div>
                                <div class="col-md-2" style="padding:0 0 0 15px">
                                    <div class="form-group" style="margin-bottom: 10px">
                                        <input type="hidden" name="lama_temp">
                                        <input type="text" class="form-control default-input" name="lama" placeholder="lama">
                                    </div>
                                </div>
                               <div class="col-md-2" style="width:12%; padding:0 0 0 15px">
                                    <div class="checkbox">
                                        <label class="checkbox-custom">
                                            <input type="hidden" name="luar_negeri_temp">
                                            <input type="checkbox" id="luar_negeri" name="luar_negeri"> <i class="fa fa-fw fa-square-o"></i> Luar Negeri
                                        </label>
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="form-group" style="margin-bottom: 10px">
                                        <button type="button" class="btn btn-sm btn-info btn-tujuan" style="height:34px">Tambah Tujuan</button>
                                    </div>
                                </div>
                                <table id="data-spl" class="table table-hover table-bordered table-striped m-b-none" style="font-size:11px">
                                    <thead>
                                        <tr>
                                            <th class="text-center" style="vertical-align: middle;" width="7%">NO</th>
                                            <th class="text-center" style="vertical-align: middle;" width="25%">DARI</th>
                                            <th class="text-center" style="vertical-align: middle;" width="25%">KE</th>
                                            <th class="text-center" style="vertical-align: middle;" width="10%">LAMA (hari)</th>
                                            <th class="text-center" style="vertical-align: middle;" width="10%">AKSI</th>
                                        </tr>
                                    </thead>
                                    <tbody class="tbody-tujuan">
                                    </tbody>
                                </table>
                            </fieldset>
                        </div>
                    </div>
                    <div class="col-md-12" style="padding:0; margin-top:15px; margin-bottom:15px">
                        <fieldset style="width:100%">
                            <legend id="personal-form" style="margin-bottom:10px">DAFTAR PEGAWAI</legend>
                            <div class="col-md-6" style="padding:0 0 0 0">
                                <div class="form-group" style="margin-bottom: 10px">
                                    <input type="hidden" name="pegawai_id">
                                    <input type="hidden" name="jabatan">
                                    <input type="hidden" name="layer">
                                    <input type="hidden" name="nip">
                                    <input type="hidden" name="nama">
                                    <input type="hidden" name="pegawai_id_temp">
                                    <input type="hidden" name="jabatan_temp">
                                    <input type="hidden" name="layer_temp">
                                    <input type="hidden" name="nip_temp">
                                    <input type="hidden" name="nama_temp">
                                    <input type="hidden" name="checkbox_temp">
                                    <input type="text" class="form-control default-input" id="autocomplete-pegawai" name="pegawai" placeholder="Cari Pegawai">
                                </div>
                            </div>
                            <div class="col-md-2" style="width:12%; padding:0 0 0 15px">
                                <div class="checkbox">
                                    <label class="checkbox-custom">
                                        <input type="checkbox" id="diperintah" name="diperintah"> <i class="fa fa-fw fa-square-o"></i> Diperintah
                                    </label>
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group" style="margin-bottom: 10px">
                                    <button type="button" class="btn btn-sm btn-info btn-pegawai" style="height:34px">Tambah Pegawai</button>
                                </div>
                            </div>
                            <table id="data-spl" class="table table-hover table-bordered table-striped m-b-none" style="font-size:11px">
                                <thead>
                                    <tr>
                                        <th class="text-center" style="vertical-align: middle;" width="7%">NO</th>
                                        <th class="text-center" style="vertical-align: middle;" width="10%">NIP</th>
                                        <th class="text-center" style="vertical-align: middle;" width="27%">NAMA</th>
                                        <th class="text-center" style="vertical-align: middle;" width="46%">JABATAN</th>
                                        <th class="text-center" style="vertical-align: middle;" width="10%">AKSI</th>
                                    </tr>
                                </thead>
                                <tbody class="tbody-pegawai">
                                </tbody>
                            </table>
                        </fieldset>
                    </div>
                </div>
                <div class="modal-footer" style="background-color:#f5f5f5; border-radius:0 0 6px 6px; margin-top:0px">
                    <button type="button" class="btn btn-sm btn-danger close-modal">Close</button>
                    <button type="submit" class="btn btn-sm btn-success">Simpan</button>
                </div>
            </form>
        </div>
    </div>
</div>
<div id="modal-biaya" class="modal fade in" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" style="width:80%">
        <div class="modal-content">
            <div class="modal-header" style="border-radius:6px 6px 0 0; color:#3a87ad; background-color:#f5f5f5">
                <button class="close" data-dismiss="modal" type="button" onclick="destroy_select()">×</button>
                <h4 class="modal-title">Perubahan Biaya SPPD</h4>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-12">
                        <div style="font-weight:bold">NAMA : <span id="detail-nama"></span></div>
                        <div style="font-weight:bold">TUJUAN : <span id="detail-tujuan"></span></div>
                        <div style="font-weight:bold">LAMA HARI : <span id="detail-hari"></span> hari</div>
                        <input type="hidden" name="biaya_id">
                    </div>
                </div>
                <table id="data-biaya" class="table table-hover table-bordered m-b-none" style="font-size:11px; margin-top:10px">
                    <tbody class="tbody-biaya">
                    </tbody>
                    <tfoot>
                        <tr style="font-weight:bold">
                            <td colspan="4" class="text-center">TOTAL BIAYA</td>
                            <td class="text-center" style="width:5%">=</td>
                            <td class="text-right"><span id="total_nominal"></span></td>
                            <td class="text-center" style="width:5%">-</td>
                            <td class="text-right"><span id="total_pengurang"></span></td>
                            <td class="text-center" style="width:5%">=</td>
                            <td class="text-right"><span id="total_keseluruhan"></span></td>
                        </tr>
                    </tfoot>
                </table>
            </div>
            <div class="modal-footer" style="background-color:#f5f5f5; border-radius:0 0 6px 6px; margin-top:0px">
                <button type="reset" class="btn btn-sm btn-danger" data-dismiss="modal" onclick="destroy_select()">Close</button>
                <button type="submit" class="btn btn-sm btn-success simpan-biaya">Simpan</button>
            </div>
        </div>
    </div>
</div>
<div id="modal-detail-rinci-biaya" class="modal fade in" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" style="width:60%">
        <div class="modal-content">
            <div class="modal-header" style="border-radius:6px 6px 0 0; color:#3a87ad; background-color:#f5f5f5">
                <button class="close" data-dismiss="modal" type="button" onclick="destroy_select()">×</button>
                <h4 class="modal-title">Perubahan Rinci Biaya SPPD</h4>
            </div>
            <form id="form-rinci-biaya">
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-12">
                        <div style="font-weight:bold">NAMA : <span id="detail-rinci-nama"></span></div>
                        <div style="font-weight:bold">TUJUAN : <span id="detail-rinci-tujuan"></span></div>
                        <div style="font-weight:bold">LAMA HARI : <span id="detail-rinci-hari"></span> hari</div>
                        <input type="hidden" name="rinci_biaya_id">
                    </div>
                </div>
                <table id="data-biaya" class="table table-hover table-bordered m-b-none" style="font-size:11px; margin-top:10px">
                    <tbody class="tbody-detail-rinci-biaya">
                    </tbody>
                    <tfoot>
                        <tr style="font-weight:bold">
                            <td class="text-center">TOTAL BIAYA</td>
                            <td class="text-right"><span id="total_nominal" class="input-mask"></span></td>
                            <td class="text-center" style="width:5%">-</td>
                            <td class="text-right"><span id="total_pengurang" class="input-mask"></span></td>
                            <td class="text-center" style="width:5%">=</td>
                            <td class="text-right"><span id="total_keseluruhan" class="input-mask"></span></td>
                        </tr>
                    </tfoot>
                </table>
            </div>
            <div class="modal-footer" style="background-color:#f5f5f5; border-radius:0 0 6px 6px; margin-top:0px">
                <button type="reset" class="btn btn-sm btn-danger" data-dismiss="modal" onclick="destroy_select()">Close</button>
                <button type="submit" class="btn btn-sm btn-success">Simpan</button>
            </div>
            </form>
        </div>
    </div>
</div>
<div id="modal-bs" class="modal fade in" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" style="width: 80%">
        <div class="modal-content">
            <form id="form-bs">
                <div class="modal-header" style="border-radius:6px 6px 0 0; color:#3a87ad; background-color:#f5f5f5">
                    <button class="close close-modal" data-dismiss="modal" type="button">×</button>
                    <h4 class="modal-title">Pembuatan BS</h4>
                </div>
                <div class="modal-body" style="max-height:470px; overflow-y:scroll">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="col-md-6" style="padding: 0">
                                <div class="form-group" style="margin-bottom: 10px">
                                    <label>NO. BS:</label>
                                    <input type="text" class="form-control default-input" name="no_bs" placeholder="Nomor Bon Sementara">
                                </div>
                                <div class="form-group" style="margin-bottom: 10px">
                                    <label>D a s a r:</label>
                                    <input type="text" class="form-control default-input" name="dasar">
                                </div>
                                <div class="form-group" style="margin-bottom: 10px">
                                    <label>Untuk Keperluan:</label>
                                    <input type="hidden" name="sppd_id">
                                    <input type="text" class="form-control default-input" name="keperluan">
                                </div>
                                <div class="form-group" style="margin-bottom: 10px">
                                    <label>Penerima:</label>
                                    <input type="hidden" name="penerima">
                                    <input type="text" class="form-control default-input" name="pegawai_penerima" placeholder="Pegawai Penerima (NIP/Nama)" id="autocomplete-penerima">
                                </div>
                            </div>
                            <div class="col-md-6" style="padding: 0 0 0 15px">
                                <div class="form-group" style="margin-bottom: 10px">
                                    <label>Tgl BS:</label>
                                    <input type="text" style="width:100%" data-date-format="dd-mm-yyyy" class="input-s datepicker-input form-control" name="tgl_bs" placeholder="Tanggal BS">
                                </div>
                                <div class="form-group" style="margin-bottom: 10px">
                                    <label>Diperintahkan Kepada:</label>
                                    <input type="text" class="form-control default-input" name="diperintahkan_kepada">
                                </div>
                                <div class="form-group" style="margin-bottom: 10px">
                                    <label>Jumlah yang diperlukan:</label>
                                    <input type="text" class="form-control default-input input-mask" name="jumlah_nominal" placeholder="Jumlah Biaya SPPD">
                                </div>                         
                            </div>
                        </div>    
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group">
                                <label>Keterangan:</label>
                                <textarea class="form-control" name="keterangan"></textarea>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group">
                                <label>Ketentuan:</label>
                                <textarea class="form-control" name="ketentuan" readonly></textarea>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer" style="background-color:#f5f5f5; border-radius:0 0 6px 6px; margin-top:0px">
                    <button type="button" class="btn btn-sm btn-danger" data-dismiss="modal">Close</button>
                    <button type="submit" class="btn btn-sm btn-success">Simpan</button>
                </div>
            </form>
        </div>
    </div>
</div>
@stop

@section('bottom_script')
    @include('sppd::layouts.bottom_script')
    <script src="{{asset('asset-payroll/libs/jquery/maskinput/jquery.inputmask.bundle.js')}}"></script>
@stop