@extends('template_absen')

@section('title')
	HRIS | Cetak Laporan
@stop

@section('top_script')
	@include('laporan::layouts.top_script_absen')
    <style type="text/css">
        .dataTables_scrollHead > .dataTables_scrollHeadInner > table {
            margin-bottom: 0 !important;
        }
    </style>
@stop

@section('content')
<section>
    <div class="row" style="padding:10px">
        <div class="form-group" style="margin-bottom: 0px">
			<div class="col-md-6" style="padding-left: 0px">
				<div class="form-group" style="margin-bottom: 0px">
					@can('laporan.cetak.absen_ringkas')
					<div class="col-lg-3">
						<button id="ringkas" class="btn btn-sm btn-default btn-block btn-option" style="font-size: 10px; font-weight: bold"> RINGKAS</button>
					</div>
					@endcan 
					@can('laporan.cetak.absen_rinci')
					<div class="col-lg-3">
						<button id="rinci" class="btn btn-sm btn-default btn-block btn-option" style="font-size: 10px; font-weight: bold"> RINCI</button>
					</div>
					@endcan
					@can('laporan.cetak.absen_rinci_per_hari')
					<div class="col-lg-3">
						<button id="rinci_per_hari" class="btn btn-sm btn-default btn-block btn-option" style="font-size: 10px; font-weight: bold"> RINCI PER HARI</button>
					</div>
					@endcan
					@can('laporan.cetak.absen_monitoring')
					<div class="col-lg-3">
						<button id="monitoring" class="btn btn-sm btn-default btn-block btn-option" style="font-size: 10px; font-weight: bold"> MONITORING</button>
					</div>
					@endcan
				</div>
			</div>
			<div class="col-md-6" style="padding-left: 0px">
				<div class="form-group" style="margin-bottom: 0px">
					@can('laporan.cetak.absen_lembur')
					<div class="col-lg-3">
						<button id="lembur" class="btn btn-sm btn-default btn-block btn-option" style="font-size: 10px; font-weight: bold"> LEMBUR</button>
					</div>
					@endcan
					@can('laporan.cetak.absen_pemeberitahuan')
					<div class="col-lg-3">
						<button id="pemberitahuan" class="btn btn-sm btn-default btn-block btn-option" style="font-size: 10px; font-weight: bold"> PEMBERITAHUAN</button>
					</div>
					@endcan
					@can('laporan.cetak.absen_jadwal')
					<div class="col-lg-3">
						<button id="jadwal" class="btn btn-sm btn-default btn-block btn-option" style="font-size: 10px; font-weight: bold"> JADWAL</button>
					</div>
					@endcan
					@can('laporan.cetak.absen_cuti')
					<div class="col-lg-3">
						<button id="cuti" class="btn btn-sm btn-default btn-block btn-option" style="font-size: 10px; font-weight: bold"> CUTI</button>
					</div>
					@endcan
				</div>
			</div>
		</div>
    </div>
    <form id="form-laporan" name="laporan" class="bs-example form-horizontal" method="POST" target="_blank" style="height: 100%">
    <div class="row" style="padding:0; background-color:#fff; margin:0px; height:100%">
        <div class="col-md-5" style="padding:15px 15px; height:100%; border-right:1px solid #cfcfcf">
            {{ csrf_field() }}
            <div class="form-group">
                <div class="col-lg-12">
                    <input name="keyword" type="text" class="form-control" placeholder="Cari...">
					<input name="list_pegawai" type="hidden">
                </div>
            </div>
            <input type="hidden" name="cetak_laporan">
            <input type="hidden" name="pegawai">
			<input type="hidden" name="jabatan">
            <div class="form-group">
                <div class="col-lg-12 m-b field f_jadwal">
                    <select class="select2-option" style="width:100%;" name="bulan">
                        <option value="01">Januari</option>
                        <option value="02">Februari</option>
                        <option value="03">Maret</option>
                        <option value="04">April</option>
                        <option value="05">Mei</option>
                        <option value="06">Juni</option>
                        <option value="07">Juli</option>
                        <option value="08">Agustus</option>
                        <option value="09">September</option>
                        <option value="10">Oktober</option>
                        <option value="11">November</option>
                        <option value="12">Desember</option>
                    </select>
                </div>
                <div class="col-lg-12 m-b field f_rinci_per_hari">
                    <input type="text" name="tanggal" placeholder="Tanggal" data-date-format="dd-mm-yyyy" data-date-autoclose="true" class="input-s datepicker-input form-control text-center" style="width:100%">
                </div>
                <div class="col-lg-12 field f_ringkas f_rinci f_monitoring f_lembur f_pemberitahuan">
                    <div class="input-group m-b">
                        <input type="text" name="tanggal_mulai" placeholder="Mulai" data-date-format="dd-mm-yyyy" data-date-autoclose="true" size="16" class="input-s datepicker-input form-control text-center" autocomplete="off">
                        <span class="input-group-addon" style="color:#grey;">s/d</span>
                        <input type="text" name="tanggal_selesai" placeholder="Sampai" data-date-format="dd-mm-yyyy" data-date-autoclose="true" size="16" class="input-s datepicker-input form-control text-center" autocomplete="off">
                    </div>
                </div>
                
                <div class="col-lg-12 field f_ringkas f_rinci ">
                    <div class="input-group m-b">
                        <span class="input-group-addon" style="color:#grey;">Terlambat</span>
                        <input type="text" name="jumlah_telat" class="input-s form-control" placeholder="Terlambat">
                        <span class="input-group-addon" style="color:#grey;">satuan (menit)</span>
                    </div>
                </div>
                <div class="col-lg-12 field f_lembur">
                    <div class="input-group m-b">
                        <span class="input-group-addon" style="color:#grey;">lembur pagi</span>
                        <input type="text" name="mulai_lembur_pagi" class="input-s form-control" placeholder="Mulai">
                        <span class="input-group-addon" style="color:#grey;">satuan</span>
                        <select class="select2-option" style="width:100%;" name="satuan_pagi">
                            <option value="HOUR">Jam</option>
                            <option value="MINUTE">Menit</option>
                        </select>
                    </div>
                    <div class="input-group m-b">
                        <span class="input-group-addon" style="color:#grey;">lembur pulang</span>
                        <input type="text" name="mulai_lembur" class="input-s form-control" placeholder="Mulai">
                        <span class="input-group-addon" style="color:#grey;">satuan</span>
                        <select class="select2-option" style="width:100%;" name="satuan">
                            <option value="HOUR">Jam</option>
                            <option value="MINUTE">Menit</option>
                        </select>
                    </div>
                </div>
                <div class="col-lg-12 m-b field f_lembur">
                    <span class="help-block m-b-none">** Kolom <span style="font-weight: bold">'lembur pagi'</span> dan <span style="font-weight: bold">'lembur pulang'</span> digunakan untuk membatasi range waktu lembur.</span>
                </div>
                <div class="col-lg-6 field f_ringkas">
                    <input name="filter_insentif" type="checkbox">
                    <label style="vertical-align: middle"><span>Insentif Shift Sore / Malam</span></label>
                </div>
				<div class="col-lg-6 field f_ringkas">
                    <input name="filter_pemberitahuan" type="checkbox">
                    <label style="vertical-align: middle"><span>Cetak Pemberitahuan </span><span class="text-danger">(pdf)</span></label>
                </div>
            </div>
            <div class="form-group" style="margin-bottom:0px; padding:10px; background-color:#eee; border-top:1px solid #428BCA; border-bottom:1px solid #428BCA">
                <div class="col-lg-6 field f_lembur">
                    <button id="libnas" data-form="pdf" class="btn btn-sm btn-submit btn-info btn-block" type="button" style="font-weight:bold"><i class="fa fa-print"></i> Lembur S/M & Libnas</button>
                </div>
                <div class="col-lg-6 field f_lembur">
                    <button id="hari_kerja" data-form="pdf" class="btn btn-sm btn-lembur btn-warning btn-block" type="button"><i class="fa fa-print"></i> Lembur Hari Kerja</button>
                </div>
                <div class="col-lg-6 field f_ringkas f_rinci_per_hari f_monitoring f_pemberitahuan f_jadwal f_cuti">
                    <button id="exp-pdf" data-form="pdf" class="btn btn-sm btn-submit btn-danger btn-block" type="button" style="font-weight:bold"><i class="fa fa-print"></i> PDF</button>
                </div>
                <div class="col-lg-6 field f_ringkas f_rinci_per_hari f_monitoring ">
                    <button id="exp-excel" data-form="excel" class="btn btn-sm btn-submit btn-primary btn-block" type="button"><i class="fa fa-print"></i> Excel</button>
                </div>
            </div>
			<div class="form-group" style="margin-bottom:0px; padding:10px; border-top:1px solid #428BCA; border-bottom:1px solid #428BCA">
                <div class="col-md-12" style="margin-bottom:10px">
                    <form class="col-md-12" id="submit_search">
                        <input type="text" class="form-control" name="cari" placeholder="Cari Jabatan">
                    </form>
                </div>
                <div class="col-md-12" id="jabatan-tree" style=" height:270px; overflow-x:auto; overflow-y:auto;"></div>    
            </div>
            <div class="form-group" style="margin-top:0px; margin-bottom:0px; padding:10px; background-color:#eee; border-top:1px solid #428BCA; border-bottom:1px solid #428BCA">
                <div class="col-lg-12">
                    <button id="btn-tree-filter" class="btn btn-sm btn-default btn-block" type="button"><i class="fa fa-search"></i> Show Data</button>
                </div>
            </div>
        </div>
        <div class="col-md-7" style="padding:15px; height:90%; border-right:1px solid #cfcfcf;">
            <div class="form-group">
                <div class="col-sm-4">
                    <label class="radio-inline">
                        <input type="radio" value="all" name="filter" class="filter"> All </label>
                    <label class="radio-inline">
                        <input type="radio" value="pusat" name="filter" class="filter"> Pusat </label>
                    <label class="radio-inline">
                        <input type="radio" value="luar" name="filter" class="filter"> Luar </label>
                </div>
				<div class="col-sm-4 text-center" style="padding-top:5px">
					<label>Terpilih : <span class="text-danger" style="font-weight:normal" id="jumlah_terpilih">0</span></label>
				</div>
                <div class="col-sm-4 text-right" style="padding-top:5px">
                    <label>Jumlah : <span style="font-weight:normal" id="jumlah_total">0</span> <span style="font-weight:normal" id="jumlah_total">data</span></label>
                </div>
            </div>
            <div style="padding:0px; margin-bottom: 10px; width: 100%; height:100%; overflow: scroll; overflow-x: auto; overflow-y: auto;">
                <section class="scrollable w-f">
                    <section class="panel panel-default">
                        <div class="table-responsive">
                            <table id="tab-filter" class="table table-striped m-b-none">
                                <thead>
                                    <tr>
                                        <th class="text-center" width="7%"></th>
                                        <th class="text-center" width="12%">FINGER</th>
                                        <th class="text-center" width="15%">NIP</th>
                                        <th class="text-center" width="29%">NAMA</th>
                                        <th class="text-center" width="37%">BAGIAN</th>
                                    </tr>
                                </thead>
                                <tbody id="data-list" style="font-size:10px">
                                </tbody>
                            </table>
                        </div>
                    </section>
                </section>
            </div>
        </div>
    </div>
    </form>
</section>
@stop

@section('bottom_script')
	@include('laporan::layouts.bottom_script_absen')
@stop