<style>
    .modal-header{
        background: #09c !important;
    }

    #menu-header{
        pointer-events: none;
    }

    #btn-menu{
        margin: 5px;
    }

    #menu > button{
        text-align: left !important;
    }

    @media only screen and (max-width: 500px) {
        #menu{
            padding-top: 20px;
        }
    }

    .modal-title{
        color: white;
        margin-bottom: 15px;
    }

    #hr{
        margin: 0px !important;
    }

    #headpanel{
        background-color: #09c !important;
        color: white !important;
    }

    #headpanel > h6 {
        /* text-align: center; */
    }

    .medhov{
        min-width: 150px !important;
        font-size: 13px !important;
        padding: 5px 5px;
        font-weight: bold;
    }
    .medhovs{
        min-width: 200px !important;
        font-size: 13px !important;
        padding: 5px 5px;
        font-weight: bold;
    }


  
</style>
<div class="content-wrapper">
    <div class="content">
       <div class="container-fluid">
     <!-- <p>mahasiswa pendaftaran</p>
        <p><?php //echo $this->nim;?></p>
        <p><?php //echo $this->name; ?></p>

        <div class="panel panel-default">
            hi bro
        </div> -->

            <div class="page-header-content">
                <div class="page-title">
                    <h4><i class="icon-arrow-left52 position-left"></i> <span class="text-semibold">Mahasiswa</span> - Pendaftaran</h4>

                    <ul class="breadcrumb position-right">
                        <li><a href="index.html">Home</a></li>
                        <li class="">Pendaftaran</li>
                        <li class="active">Pengajuan Tempat KP</li>
                        <!-- <li class="active">Upload Berkas</li> -->
                    </ul>
                </div>      
            </div>

            <!-- <input type="text" list="cars" />
<datalist id="cars">
  <option>Volvo</option>
  <option>Saab</option>
  <option>Mercedes</option>
  <option>Audi</option>
</datalist> -->

            <div class="row">
                <!-- <div class="col-lg-5">
                    <div style="" class="panel panel-white">
                        <div id="headpanel" class="panel-heading"> 
                            <h6 class="panel-title text-semibold "  > <span style="margin-bottom: 6px" class=" icon-office"></span> Data Pengajuan</h6>
                            
                        </div>
                        <div class="panel-body">
                            <ul class="media-list">
                                <li class="media">
                                    <div class="media-left media-middle medhov">
                                        <span >Perusahaan</span>
                                    </div>
                                    
                                    <div class="media-left media-middle medhovs">
                                        <span id="nama" ></span>
                                    </div>

                                </li>
                            </ul>

                            <ul class="media-list">
                                <li class="media">
                                    <div class="media-left media-middle medhov">
                                        <span>Alamat</span>
                                    </div>
                                    
                                    <div class="media-left media-middle medhovs">
                                        <span id="alamat"></span>
                                    </div>

                                </li>
                            </ul>

                            <ul class="media-list">
                                <li class="media">
                                    <div class="media-left media-middle medhov">
                                        <span>Telepon</span>
                                    </div>
                                    
                                    <div class="media-left media-middle medhovs">
                                        <span id="telepon"></span>
                                    </div>
                                </li>
                            </ul>

                            <ul class="media-list">
                                <li class="media">
                                    <div class="media-left media-middle medhov">
                                        <span>Penerima</span>
                                    </div>
                                    
                                    <div class="media-left media-middle medhovs">
                                        <span id="penerima"></span>
                                    </div>

                                </li>
                            </ul>

                            <ul class="media-list">
                                <li class="media">
                                    <div class="media-left media-middle medhov">
                                        <span>Bagian</span>
                                    </div>
                                    
                                    <div class="media-left media-middle medhovs">
                                        <span id="bagian"></span>
                                    </div>

                                </li>
                            </ul>

                            <ul class="media-list">
                                <li class="media">
                                    <div class="media-left media-middle medhov">
                                        <span>Tanggal KP</span>
                                    </div>
                                    
                                    <div class="media-left media-middle medhovs">
                                        <span id="tanggal"></span>
                                    </div>

                                </li>
                            </ul>

                        </div>
                        <hr id="hr">
                        
                        <h6 class="text-center">Status Pengajuan :</h6>
                        <h4 id="status" style="margin-bottom: 20px;" class="text-center"></h4>

                    </div>
                </div> -->

                <div class="col-md-5">
                    <div class="panel panel-info">
                        <div class="panel-heading">
                            <h6 class="panel-title">Data Pengajuan</h6>
                            <div class="heading-elements">
                                <ul class="icons-list">
                                    <li><a data-action="reload"></a></li>
                                    <!-- <li><a data-action="close"></a></li> -->
                                    <li><a data-action="collapse"></a></li>
                                </ul>
                            </div>
                        </div>

                        <div class="panel-body">
                            <ul class="media-list">
                                <li class="media">
                                    <div class="media-left media-middle medhov">
                                        <span >Perusahaan</span>
                                    </div>
                                    
                                    <div class="media-left media-middle medhovs">
                                        <span id="nama" ></span>
                                    </div>

                                </li>
                            </ul>

                            <ul class="media-list">
                                <li class="media">
                                    <div class="media-left media-middle medhov">
                                        <span>Alamat</span>
                                    </div>
                                    
                                    <div class="media-left media-middle medhovs">
                                        <span id="alamat"></span>
                                    </div>

                                </li>
                            </ul>

                            <ul class="media-list">
                                <li class="media">
                                    <div class="media-left media-middle medhov">
                                        <span>Telepon</span>
                                    </div>
                                    
                                    <div class="media-left media-middle medhovs">
                                        <span id="telepon"></span>
                                    </div>
                                </li>
                            </ul>

                            <ul class="media-list">
                                <li class="media">
                                    <div class="media-left media-middle medhov">
                                        <span>Penerima</span>
                                    </div>
                                    
                                    <div class="media-left media-middle medhovs">
                                        <span id="penerima"></span>
                                    </div>

                                </li>
                            </ul>

                            <ul class="media-list">
                                <li class="media">
                                    <div class="media-left media-middle medhov">
                                        <span>Bagian</span>
                                    </div>
                                    
                                    <div class="media-left media-middle medhovs">
                                        <span id="bagian"></span>
                                    </div>

                                </li>
                            </ul>

                            <ul class="media-list">
                                <li class="media">
                                    <div class="media-left media-middle medhov">
                                        <span>Tanggal KP</span>
                                    </div>
                                    
                                    <div class="media-left media-middle medhovs">
                                        <span id="tanggal"></span>
                                    </div>

                                </li>
                            </ul>

                        </div>
                        <hr id="hr">
                        
                        <h6 class="text-center">Status Pengajuan :</h6>
                        <h4 id="status" style="margin-bottom: 20px;" class="text-center"></h4>
                    </div>
                </div>

                <div class="col-md-4">
                    <div class="panel panel-info">
                        <div class="panel-heading">
                            <h6 class="panel-title">Menu</h6>
                            <div class="heading-elements">
                                <ul class="icons-list">
                                    <li><a data-action="reload"></a></li>
                                    <!-- <li><a data-action="close"></a></li> -->
                                    <li><a data-action="collapse"></a></li>
                                </ul>
                            </div>
                        </div>

                        <div class="panel-body">
                            <div id="menu">
                                <!-- <button id="menu-header"style=""type="button" class="btn btn-primary heading-btn  btn-block"><span class="icon-menu3"></span> Menu</button>
                                <hr> -->
                                <button style="margin:7px 0px" type="button" class="btn btn-secondary heading-btn btn-modal btn-block"><span class="icon-envelope"></span> Buat Surat Pengajuan</button>
                                <button style="margin:7px 0px" type="button" class="btn btn-secondary heading-btn btn-modalupdate btn-block"><span class="icon-mail-read"></span> Update Surat Pengajuan</button>
                                <button style="margin:7px 0px" type="button" class="btn btn-secondary heading-btn btn-download btn-block"><span class="icon-move-down"></span> Download Surat Pengajuan</button>
                                <!-- <button style="margin:7px 0px" type="button" class="btn btn-secondary heading-btn btn-kirimperusahaan btn-block"><span class="icon-move-down"></span> Konfirmasi Kirim ke Perusahaan</button> -->
                                <button style="margin:7px 0px" type="button" class="btn btn-secondary heading-btn btn-conf btn-block"><span class="icon-city"></span> Konfirmasi Perusahaan</button>
                            </div> 
                        </div>
                    </div>
                </div>

                <!-- <div class="col-lg-4">
                    <div class="panel panel-white">
                        <div id="headpanel" class="panel-heading"> 
                            <h6 class="panel-title text-semibold "  > <span style="" class=" icon-menu3"></span> Menu</h6>
                        </div>
                        <div class="panel-body">
                            <div id="menu">
                                <button id="menu-header"style=""type="button" class="btn btn-primary heading-btn  btn-block"><span class="icon-menu3"></span> Menu</button>
                                <hr>
                                <button style="margin:7px 0px" type="button" class="btn btn-secondary heading-btn btn-modal btn-block"><span class="icon-envelope"></span> Buat Surat Pengajuan</button>
                                <button style="margin:7px 0px" type="button" class="btn btn-secondary heading-btn btn-modalupdate btn-block"><span class="icon-mail-read"></span> Update Surat Pengajuan</button>
                                <button style="margin:7px 0px" type="button" class="btn btn-secondary heading-btn btn-download btn-block"><span class="icon-move-down"></span> Download Surat Pengajuan</button>
                                <button style="margin:7px 0px" type="button" class="btn btn-secondary heading-btn btn-conf btn-block"><span class="icon-city"></span> Konfirmasi Perusahaan</button>
                            </div> 
                        </div>
                    </div>
                </div> -->
            </div>

                  


            <div class="panel panel-white">
                <div class="panel-heading">
                    <h6 class="panel-title text-semibold" >Daftar Surat Pengajuan </h6>
                    <div class="heading-elements">
                        <!-- <button type="button" class="btn btn-primary heading-btn btn-modal"><span class="icon-envelope"></span> Buat Surat Pengajuan</button> -->
                    </div>
                </div>
                
                <div class="panel-body">
                    <div class="table-responsive">
                        <table class="table data-list table-stripped table-lg datatable-dom-position table-hover" id="list_pengajuan">
                            <thead>
                                <tr>
                                    <th scope="col" class="text-center text-muted" style="width: 30px;">#No</th> 
                                    <th>Nama Perusahaan</th>
                                    <th>Alamat Perusahaan</th>
                                    <th>Penerima Surat</th>
                                    <th>Status</th>
                                    <!-- <th>Action</th> -->
                                </tr>
                            </thead>
                        </table>
                    </div>
                </div>
            </div>
       </div>
    </div>
</div>


<!-- modal add -->
<div id="modal-add" class="modal fade" data-keyboard="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h6 class="modal-title">Pengajuan Perusahaan</h6>
            </div>

            <div class="modal-body">
                <div class="row" >
                    <div class="col-lg-6">
                        <div class="form-group">
                            <label>Nama Perusahaan:</label>
                            <input id="nama_perusahaan" value="" type="text" class="form-control" placeholder="Nama Perusahaan.." required>
                        </div>

                        <div class="form-group">
                            <label>Penerima Surat:</label>
                            <input id="penerima_surat" type="text" class="form-control" placeholder="Nama Penerima surat..">
                        </div>

                        <div class="form-group">
                            <label>Bagian / Divisi:</label>
                            <input id="divisi_penerima" type="text" class="form-control" placeholder="Bagian / Divisi Penerima surat...">
                        </div>

                        <div class="form-group">
                            <label>Nomor Telepon Perusahaan:</label>
                            <input id="telp_perusahaan"type="text" class="form-control" placeholder="No Telepon Perusahaan..">
                        </div>
                    </div>
                    <div class="col-lg-6">
                        <div class="form-group">
                            <label class="control-label text-semibold">Tanggal Perkiraan Mulai KP:</label>
                            <div class="input-group">
                                <span class="input-group-addon"><i class="icon-calendar22"></i></span>
                                <input id="tanggalAwal"type="text" class="form-control pickadate" placeholder="Tanggal Mulai&hellip;" value="">
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="control-label text-semibold">Tanggal Perkiraan Selesai KP:</label>
                            <div class="input-group">
                                <span class="input-group-addon"><i class="icon-calendar22"></i></span>
                                <input id="tanggalAkhir"type="text" class="form-control pickadate" placeholder="Tanggal Berhenti&hellip;" value="">
                            </div>
                        </div>


                        <div class="form-group">
                            <label>Alamat Perusahaan:</label>
                            <textarea id="alamat_perusahaan" rows="1" cols="5" class="form-control" placeholder="Alamat Perusahaan"></textarea>
                        </div>

                        <div class="form-group">
                            <label>Kode Pos</label>
                            <input id="pos_perusahaan" type="number" class="form-control" placeholder="Kode pos perusahaan...">
                        </div>
                    </div>
                </div>
                <input id="nim_mhs" value="<?php echo $this->nim;?>" type="text" class="form-control" placeholder="Nama Perusahaan..">
                
                

            </div>
            <hr id="hr">
            <div class="modal-footer">
                <button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
                <button id="submitpengajuan" type="button" class="btn btn-primary">Submit</button>
            </div>
        </div>
    </div>
</div>

<!-- modal update -->
<div id="modal-update" class="modal fade" data-keyboard="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h6 class="modal-title">Edit Pengajuan Perusahaan</h6>
            </div>

            <div class="modal-body">
                <div class="row" >
                    <div class="col-lg-6">
                        <div class="form-group">
                            <label>Nama Perusahaan:</label>
                            <input id="nama_perusahaanedt" value="" type="text" class="form-control" placeholder="Nama Perusahaan..">
                        </div>

                        <div class="form-group">
                            <label>Penerima Surat:</label>
                            <input id="penerima_suratedt" type="text" class="form-control" placeholder="Nama Penerima surat..">
                        </div>

                        <div class="form-group">
                            <label>Bagian / Divisi:</label>
                            <input id="divisi_penerimaedt" type="text" class="form-control" placeholder="Bagian / Divisi Penerima surat...">
                        </div>

                        <div class="form-group">
                            <label>Nomor Telepon Perusahaan:</label>
                            <input id="telp_perusahaanedt"type="text" class="form-control" placeholder="No Telepon Perusahaan..">
                        </div>

                    </div>
                    <div class="col-lg-6">
                        <div class="form-group">
                            <label class="control-label text-semibold">Tanggal Mulai KP:</label>
                            <div class="input-group">
                                <span class="input-group-addon"><i class="icon-calendar22"></i></span>
                                <input id="tanggalAwaledt"type="text" class="form-control pickadate" placeholder="Tanggal Mulai&hellip;" value="">
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="control-label text-semibold">Tanggal Berhenti KP:</label>
                            <div class="input-group">
                                <span class="input-group-addon"><i class="icon-calendar22"></i></span>
                                <input id="tanggalAkhiredt"type="text" class="form-control pickadate" placeholder="Tanggal Berhenti&hellip;" value="">
                            </div>
                        </div>

                        <div class="form-group">
                            <label>Alamat Perusahaan:</label>
                            <textarea id="alamat_perusahaanedt" rows="1" cols="5" class="form-control" placeholder="Alamat Perusahaan"></textarea>
                        </div>

                        <div class="form-group">
                            <label>Kode Pos</label>
                            <input id="pos_perusahaanedt" type="number" class="form-control" placeholder="Kode pos perusahaan...">
                        </div>
                    </div>
                </div>
                <input id="nim_mhsedt" value="<?php echo $this->nim;?>" type="text" class="form-control" placeholder="Nama Perusahaan..">
                
                

            </div>
            <hr id="hr">
            <div class="modal-footer">
                <button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
                <button id="submitupdate" type="button" class="btn btn-primary">Submit</button>
            </div>
        </div>
    </div>
</div>

<!-- modal update -->
<div id="modal-conf" class="modal fade" data-keyboard="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h6 class="modal-title">Form Konfirmasi Perusahaan</h6>
            </div>

            <div class="modal-body">
                <form action="#">
                    <div class="panel panel-flat">
                        <!-- <div class="panel-heading">
                            <h5 class="panel-title">Advanced legend</h5>
                            <div class="heading-elements">
                                <ul class="icons-list">
                                    <li><a data-action="collapse"></a></li>
                                    <li><a data-action="reload"></a></li>
                                    <li><a data-action="close"></a></li>
                                </ul>
                            </div>
                        </div> -->

                        <div class="panel-body" >
                            <div class="form-group">
                                <label class="display-block text-semibold">Diterima di perusahaan yang di ajukan?</label>

                                <label class="radio-inline">
                                    <input value="101" type="radio" name="konfirmasi" class="styled" checked="checked">
                                    ya
                                </label>

                                <label class="radio-inline">
                                    <input value="102"type="radio" name="konfirmasi" class="styled">
                                    tidak
                                </label>
                            </div>
                            <fieldset>
                                <legend class="text-semibold">
                                    <i class="icon-file-text2 position-left"></i>
                                    Informasi Perusahaan
                                    <a class="control-arrow" data-toggle="collapse" data-target="#demo1">
                                        <i class="icon-circle-down2"></i>
                                    </a>
                                </legend>

                                <div class="collapse out" id="demo1">
                                    <!-- <div class="form-group">
                                        <label>No referensi:</label>
                                        <input id="noref" type="text" class="form-control" placeholder="No Referensi perusahaan...">
                                    </div> -->

                                    <div class="form-group">
                                        <label>Nama perusahaan:</label>
                                        <input id="namaper" type="text" class="form-control" placeholder="Nama perusahaan.." disabled>
                                    </div>

                                    <div class="form-group">
                                        <label>Staff :</label>
                                        <input id="staff"type="text" class="form-control" placeholder="Nama pimpinan / staff perusahaan...">
                                    </div>

                                    <div class="form-group">
                                        <label class="control-label text-semibold">Tanggal Kerja Praktik:</label>
                                        <div class="row">
                                            <div class="col-lg-6">
                                                <div class="input-group">
                                                    <span class="input-group-addon"><i class="icon-calendar22"></i></span>
                                                    <input id="tanggalAwalconf"type="text" class="form-control pickadate" placeholder="Tanggal Mulai&hellip;" value="">
                                                </div>
                                            </div>
                                            <div class="col-lg-6">
                                                <div class="input-group">
                                                    <span class="input-group-addon"><i class="icon-calendar22"></i></span>
                                                    <input id="tanggalAkhirconf"type="text" class="form-control pickadate" placeholder="Tanggal Berhenti&hellip;" value="">
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label>Kontak :</label>
                                        <input id="kontak"type="text" class="form-control" placeholder="Telepon / fax perusahaan...">
                                    </div>

                                    <div class="form-group">
                                        <label>Alamat:</label>
                                        <textarea id="alamatper"rows="5" cols="5" class="form-control" placeholder="Alamat perusahaan..." disabled></textarea>
                                    </div>

                                    <div class="form-group">
                                        <label>Syarat perusahaan:</label>
                                        <textarea id="syarat"rows="5" cols="5" class="form-control" placeholder="Isi jika ada.."></textarea>
                                    </div>

                                    <div class="form-group">
                                        <label>Jumlah Mahasiswa yang dapat diterima:</label>
                                        <select id="jmlmhsw" data-placeholder="Jumlah mahasiswa" class="select">
                                            <option value="1">1</option> 
                                            <option value="2">2</option> 
                                            <option value="3">3</option> 
                                            <option value="4">4</option> 
                                            <option value="5">5</option> 
                                        </select>
                                    </div>
                                    
                                    
                                    <!-- <div class="form-group">
                                        <input class="form-control" type="text" list="cars" />
                                        <datalist class="select" id="cars">
                                            <option>Volvo</option>
                                            <option>Saab</option>
                                            <option>Mercedes</option>
                                            <option>Audi</option>
                                        </datalist>
                                    </div> -->
                                    


                                </div>
                            </fieldset>

                            <fieldset >
                                <legend class="text-semibold">
                                    <i class="icon-reading position-left"></i>
                                    Fasilitas perusahaan yang diberikan
                                    <span class="control-arrow" data-toggle="collapse" data-target="#demo2" disabled>
                                        <i class="icon-circle-down2"></i>
                                    </span>
                                </legend>

                                <div class="collapse out" id="demo2">

                                    <div class="form-group">
                                        <label class="display-block">Uang transport:</label>

                                        <label class="radio-inline">
                                            <input value="1" type="radio" name="transport" class="styled" checked="checked">
                                            ya
                                        </label>

                                        <label class="radio-inline">
                                            <input value="0"type="radio" name="transport" class="styled">
                                            tidak
                                        </label>
                                    </div>

                                    <div class="form-group">
                                        <label class="display-block">Penginapan di lokasi perusahaan:</label>

                                        <label class="radio-inline">
                                            <input value="1" type="radio" name="penginapan" class="styled" checked="checked">
                                            ya
                                        </label>

                                        <label class="radio-inline">
                                            <input value="0" type="radio" name="penginapan" class="styled">
                                            tidak
                                        </label>
                                    </div>

                                    <div class="form-group">
                                        <label>Uang makan:</label>
                                        <input id="makan" min='0' type="number" class="form-control" placeholder="Uang makan dari perusahaan...">
                                    </div>

                                    <div class="form-group">
                                        <label>Asuransi perusahaan:</label>
                                        <input id="asuransi" min='0'type="number" class="form-control" placeholder="Uang makan dari perusahaan...">
                                    </div>

                                    <div class="form-group">
                                        <label>Lain-lain:</label>
                                        <input id="lain" type="text" class="form-control" placeholder="Lain-lain...">
                                    </div>

                                    <div class="form-group">
                                        <label>Bukti konfirmasi:</label>
                                        <input id="file" type="file" class="file-styled">
                                        <span class="help-block">Upload formulir jawaban penerimaan Kerja praktik</span>
                                    </div>

                                </div>
                            </fieldset> 

                            <!-- <div class="text-right">
                                <button type="submit" class="btn btn-primary">Submit form <i class="icon-arrow-right14 position-right"></i></button>
                            </div> -->
                        </div>
                    </div>
                </form>
                <div class="alert alert-info alert-styled-left alert-bordered alertno">
                    <button type="button" class="close" data-dismiss="alert"></button>
                    <span class="text-semibold">Pemberitahuan!</span> Jika tidak diterima di perusahaan silahkan klik submit, untuk dapat mengajukan surat ke perusahaan lain.
                </div>
                <input id="nim_mhsconf" value="<?php echo $this->nim;?>" type="hidden" class="form-control" placeholder="Nama Perusahaan.."> 
            </div>
            <hr id="hr">
            <div class="modal-footer">
                <button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
                <button id="submitconf" type="button" class="btn btn-primary">Submit</button>
            </div>
        </div>
    </div>
</div>