109 lines
4.1 KiB
PHP
109 lines
4.1 KiB
PHP
@extends('layouts.app_pimpinan')
|
|
|
|
@section('title', 'Laporan Karyawan')
|
|
|
|
@section('content')
|
|
<div class="container mt-4">
|
|
<h3>Laporan Barang</h3>
|
|
|
|
<div style="width: auto; display: flex; flex-wrap: nowrap; justify-content: space-between; align-items: center;">
|
|
<div class="col-md-3 d-flex gap-0">
|
|
<button class="btn btn-outline-primary filter-btn {{ request('filter') == 'produk' ? 'active' : '' }}" data-filter="produk">Produk</button>
|
|
<button class="btn btn-outline-primary filter-btn {{ request('filter') == 'pendukung' ? 'active' : '' }}" data-filter="pendukung">Pendukung</button>
|
|
<input type="hidden" id="filter" value="{{ request('filter') }}">
|
|
</div>
|
|
|
|
<div class="col d-flex gap-2 mb-2" style="flex-wrap: nowrap; flex-direction: row; justify-content: flex-end; align-items: center;">
|
|
<div class="col-md-4" style="width: auto">
|
|
<input type="text" id="nama" class="form-control" placeholder="Cari nama barang..." value="{{ request('nama') }}">
|
|
</div>
|
|
<div class="col-md-2 d-flex gap-0" style="width: fit-content;">
|
|
<button id="downloadExcel" class="btn btn-success">Unduh Excel</button>
|
|
<button id="downloadPDF" class="btn btn-danger">Unduh PDF</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="dataContainer">
|
|
@include('pimpinan.laporan_barang._table', ['barangs' => $barangs])
|
|
</div>
|
|
</div>
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
const filterSelect = document.getElementById('filter');
|
|
const filterButtons = document.querySelectorAll('.filter-btn');
|
|
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.barang') }}?" + 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);
|
|
}
|
|
}
|
|
|
|
filterButtons.forEach(btn => {
|
|
btn.addEventListener('click', function () {
|
|
const current = document.getElementById('filter').value;
|
|
const selected = this.dataset.filter;
|
|
|
|
if (current === selected) {
|
|
// Nonaktifkan jika tombol aktif ditekan lagi
|
|
document.getElementById('filter').value = '';
|
|
filterButtons.forEach(b => b.classList.remove('active'));
|
|
} else {
|
|
document.getElementById('filter').value = selected;
|
|
filterButtons.forEach(b => b.classList.remove('active'));
|
|
this.classList.add('active');
|
|
}
|
|
|
|
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.barang') }}" + '?' + 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.barang') }}" + '?' + urlParams.toString();
|
|
});
|
|
});
|
|
</script>
|
|
|
|
|
|
@endsection
|