<script type="text/javascript"
    src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $(".filter").click(function() {
            $(".panelfilter").slideToggle("slow");
        });
    });
</script>

<div class="content-header">
    <div class="row align-items-center">
        <div class="content-header-left col-md-6 col-12 mb-md-0 mb-1">
            <h3 class="content-header-title"><?= $judul ?></h3>
            <div class="row breadcrumbs-top">
                <div class="breadcrumb-wrapper col-12">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item"><a href="<?= site_url() ?>">Dashboard</a>
                        </li>
                        <li class="breadcrumb-item"><a href="#">Kelola Absensi</a>
                        </li>
                        <li class="breadcrumb-item active"><?= $judul ?>
                        </li>
                    </ol>
                </div>
            </div>
        </div>
        <div class="content-header-right col-md-6 col-12">
            <div class="float-md-right">
                <button type="button" class="btn btn-biru" data-toggle="modal" data-target="#tambahcabang">
                    <i class="fa fa-plus"></i> Tambah Data
                </button>
                <a href="#" class="filter btn" style="background-color: transparent!important; color: #1C77D4; font-family: 'Poppins Medium';">
                    <i class="fa fa-filter"></i> Filter Pencarian <small>
                        <i class="fa fa-chevron-down"></i>
                    </small>
                </a>
            </div>
        </div>
    </div>
    <div class="panelfilter">
        <div class="row">
            <div class="col-6 col-md-3">
                <div class="form-group">
                    <input type="text" id="projectinput1" class="form-control" placeholder="Tanggal Mulai">
                </div>
            </div>
            <div class="col-6 col-md-3">
                <div class="form-group">
                    <input type="text" id="projectinput1" class="form-control" placeholder="Tanggal Selesai">
                </div>
            </div>
            <div class="col-6 col-md-3">
                <div class="form-group">
                    <select class="form-control" id="exampleFormControlSelect1">
                      <option>Status Pengajuan</option>
                      <option>2</option>
                      <option>3</option>
                      <option>4</option>
                      <option>5</option>
                    </select>
                </div>
            </div>  
            <div class="col-6 col-md-3">
                <div class="form-group">
                    <select class="form-control" id="exampleFormControlSelect1">
                      <option>Jenis Izin</option>
                      <option>2</option>
                      <option>3</option>
                      <option>4</option>
                      <option>5</option>
                    </select>
                </div>
            </div>   
            <div class="col-6 col-md-6">
                <div class="form-group">
                    <select class="form-control" id="exampleFormControlSelect1">
                      <option>Nama Karyawan</option>
                      <option>2</option>
                      <option>3</option>
                      <option>4</option>
                      <option>5</option>
                    </select>
                </div>
            </div>                
            <div class="col-6 col-md-6">
                <button type="button" class="btn btn-info btn-block">Pencarian</button>
            </div>
        </div>
    </div>
</div>
<div class="daftar-pengajuan">
    <div class="row">
        <div class="col-md-4 col-sm-12">
            <div class="card">
                <div class="card-header head-list-izin">
                    <h4 class="card-title">
                        <i class="fa fa-clock-o"></i>
                        <small class="block">
                            Pengajuan
                        </small>
                        Kamis, 01/03/2020
                        <button type="button" class="btn btn-success square">
                            Izin
                        </button>
                    </h4>
                    <div class="btn-group">
                        <button type="button" class="btn dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            <i class="fa fa-ellipsis-v"></i>
                        </button>
                        <div class="dropdown-menu arrow">
                            <button class="dropdown-item" type="button">Action</button>
                            <button class="dropdown-item" type="button">Another action</button>
                            <button class="dropdown-item" type="button">Something else here</button>

                        </div>
                    </div>
                </div>
                <div class="card-content">
                    <div class="card-body">
                        <h4 class="judul">
                            Izin Sakit Diare
                        </h4>
                        <p>
                            <small class="block">
                                <i class="fa fa-user-o"></i> Oleh Agung Setiadi
                            </small>
                        </p>
                        <div class="infotgl">
                            <div class="row">
                                <div class="col-6 col-md-6">
                                    <font color="#11c086" class="mr-md-1">Mulai</font> 08/03/2020
                                </div>
                                <div class="col-6 col-md-6">
                                    <font color="#fc5656" class="mr-md-1"> Selesai</font> 08/03/2020
                                </div>
                            </div>                             
                        </div>
                        <div class="deskripsi">
                            Saya Meminta izin untuk hari ini Senin, 01 April 2020 untuk tidak bisa bekerja dikarenakan kondisi sedang sakit diare dari Malam sampai pagi ini masih terus berlangsung, mohon sudi kiranya HOD memberikan izin tidak bekerja untuk saya istirahat. Demikian Informasi yang dapat saya sampaikan terima kasih.
                        </div>
                    </div>
                </div>
                <div class="card-footer">
                    <div class="row">
                        <div class="col-md-6">
                            <button type="button" class="btn btn-light square btn-block">
                                Belum Disetujui HOD
                            </button>
                        </div>
                        <div class="col-md-6">
                            <button type="button" class="btn btn-light square btn-block">
                                Belum Disetujui HR
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-4 col-sm-12">
            <div class="card">
                <div class="card-header head-list-izin">
                    <h4 class="card-title">
                        <i class="fa fa-clock-o"></i>
                        <small class="block">
                            Pengajuan
                        </small>
                        Kamis, 01/03/2020
                        <button type="button" class="btn btn-warning square">
                            Cuti
                        </button>
                    </h4>
                    <div class="btn-group">
                        <button type="button" class="btn dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            <i class="fa fa-ellipsis-v"></i>
                        </button>
                        <div class="dropdown-menu arrow">
                            <button class="dropdown-item" type="button">Action</button>
                            <button class="dropdown-item" type="button">Another action</button>
                            <button class="dropdown-item" type="button">Something else here</button>

                        </div>
                    </div>
                </div>
                <div class="card-content">
                    <div class="card-body">
                        <h4 class="judul">
                            Ambil Cuti Tahunan
                        </h4>
                        <p>
                            <small class="block">
                                <i class="fa fa-user-o"></i> oleh Lisyito Raharjo
                            </small>
                        </p>
                        <div class="infotgl">
                            <div class="row">
                                <div class="col-6 col-md-6">
                                    <font color="#11c086" class="mr-md-1">Mulai</font> 08/03/2020
                                </div>
                                <div class="col-6 col-md-6">
                                    <font color="#fc5656" class="mr-md-1"> Selesai</font> 08/03/2020
                                </div>
                            </div>                             
                        </div>
                        <div class="deskripsi">
                            Saya Meminta izin untuk hari ini Senin, 01 April 2020 untuk tidak bisa bekerja dikarenakan ambil cuti tahunan saya yang masih banyak. Salam
                        </div>
                    </div>
                </div>
                <div class="card-footer">
                    <div class="row">
                        <div class="col-md-6">
                            <button type="button" class="btn btn-light square btn-block">
                                Belum Disetujui HOD
                            </button>
                        </div>
                        <div class="col-md-6">
                            <button type="button" class="btn btn-light square btn-block">
                                Belum Disetujui HR
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-4 col-sm-12">
            <div class="card">
                <div class="card-header head-list-izin">
                    <h4 class="card-title">
                        <i class="fa fa-clock-o"></i>
                        <small class="block">
                            Pengajuan
                        </small>
                        Kamis, 01/03/2020
                        <button type="button" class="btn btn-facebook square">
                            Dinas Luar
                        </button>
                    </h4>
                    <div class="btn-group">
                        <button type="button" class="btn dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            <i class="fa fa-ellipsis-v"></i>
                        </button>
                        <div class="dropdown-menu arrow">
                            <button class="dropdown-item" type="button">Action</button>
                            <button class="dropdown-item" type="button">Another action</button>
                            <button class="dropdown-item" type="button">Something else here</button>

                        </div>
                    </div>
                </div>
                <div class="card-content">
                    <div class="card-body">
                        <h4 class="judul">
                            Izin Dinas Luar ke Daerah Makassar
                        </h4>
                        <p>
                            <small class="block">
                                <i class="fa fa-user-o"></i> oleh Lukas Harjanto
                            </small>
                        </p>
                        <div class="infotgl">
                            <div class="row">
                                <div class="col-6 col-md-6">
                                    <font color="#11c086" class="mr-md-1">Mulai</font> 08/03/2020
                                </div>
                                <div class="col-6 col-md-6">
                                    <font color="#fc5656" class="mr-md-1"> Selesai</font> 08/03/2020
                                </div>
                            </div>                             
                        </div>
                        <div class="deskripsi">
                            Saya Meminta izin untuk hari ini Senin, 01 April 2020 untuk tidak bisa bekerja di Kantor untuk Dinas Luar ke Daerah Makassar karena pasar disana sangat potensial
                        </div>
                    </div>
                </div>
                <div class="card-footer">
                    <div class="row">
                        <div class="col-md-6">
                            <button type="button" class="btn btn-light square btn-block">
                                Belum Disetujui HOD
                            </button>
                        </div>
                        <div class="col-md-6">
                            <button type="button" class="btn btn-light square btn-block">
                                Belum Disetujui HR
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
