web-dinda-private/resources/views/pimpinan/laporan_karyawan/index.blade.php

102 lines
3.5 KiB
PHP

@extends('layouts.app_pimpinan')
@section('title', 'Laporan Karyawan')
@section('content')
<div class="container">
<h1 class="mb-4">Laporan Gaji Karyawan</h1>
<form id="filterForm" class="mb-4">
{{-- @csrf --}}
<div class="row g-2 align-items-end">
<div class="col d-flex gap-2">
<div class="col-auto">
<label for="nama" class="form-label">Cari Nama:</label>
<input type="text" name="nama" id="nama" class="form-control" placeholder="Ketik nama...">
</div>
<div class="col-auto">
<label for="filter" class="form-label">Filter Tanggal:</label>
<select name="filter" id="filter" class="form-select">
<option value="minggu_ini">Minggu Ini</option>
<option value="hari_ini">Hari Ini</option>
<option value="bulan_ini">Bulan Ini</option>
<option value="kloter_terbaru">Kloter Terbaru</option>
<option value="semua">Semua</option>
</select>
</div>
</div>
<div class="col-auto mt-4">
<a id="downloadExcel" class="btn btn-success">Unduh Excel</a>
<a id="downloadPDF" class="btn btn-danger">Unduh PDF</a>
</div>
</div>
</form>
<div class="table-responsive" id="dataContainer">
@include('pimpinan.laporan_karyawan._table', ['data' => $data])
</div>
</div>
<script>
document.addEventListener('DOMContentLoaded', function () {
const filterSelect = document.getElementById('filter');
const namaInput = document.getElementById('nama');
const downloadBtn = document.getElementById('downloadExcel');
const downloadBtnPDF = document.getElementById('downloadPDF');
const container = document.getElementById('dataContainer');
async function fetchData() {
const params = new URLSearchParams({
filter: filterSelect.value,
nama: namaInput.value,
ajax: 1
});
try {
const response = await fetch("{{ route('laporan.karyawan') }}?" + params.toString(), {
headers: {
'X-Requested-With': 'XMLHttpRequest'
}
});
if (!response.ok) throw new Error('Gagal memuat data');
const html = await response.text();
if (container) {
container.innerHTML = html;
}
} catch (error) {
alert("Gagal memuat data: " + error.message);
}
}
filterSelect.addEventListener('change', fetchData);
let timeout = null;
namaInput.addEventListener('input', function () {
clearTimeout(timeout);
timeout = setTimeout(fetchData, 500);
});
downloadBtn.addEventListener('click', function (e) {
e.preventDefault();
const urlParams = new URLSearchParams({
filter: filterSelect.value,
nama: namaInput.value,
export: 'excel'
});
window.location.href = "{{ route('laporan.karyawan') }}" + '?' + urlParams.toString();
});
downloadBtnPDF.addEventListener('click', function (e) {
e.preventDefault();
const urlParams = new URLSearchParams({
filter: filterSelect.value,
nama: namaInput.value,
export: 'pdf'
});
window.location.href = "{{ route('laporan.karyawan') }}" + '?' + urlParams.toString();
});
});
</script>
@endsection