Magang-2025/Kasir
11
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

rapihin

Browse Source
This commit is contained in:
dhilanradya 2025-10-15 09:14:30 +07:00
parent 3ba9b200b5
commit 899a81c709
1 changed files with 15 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
resources/js/pages/Kasir.vue
View File

@ -4,7 +4,7 @@
<div <div
class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-5 gap-3 sm:gap-2 mx-auto min-h-[75vh]" class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-5 gap-3 sm:gap-2 mx-auto min-h-[75vh]"
> >
<!-- Left Section - Form Kasir -->
<div class="lg:col-span-3"> <div class="lg:col-span-3">
<div <div
class="bg-white rounded-xl shadow-lg border border-gray-200 overflow-hidden h-auto lg:h-full" class="bg-white rounded-xl shadow-lg border border-gray-200 overflow-hidden h-auto lg:h-full"
@ -15,13 +15,13 @@
</div> </div>
</div> </div>
<!-- Right Section - Transaction List -->
<div class="lg:col-span-2"> <div class="lg:col-span-2">
<div <div
class="bg-white rounded-xl shadow-lg border border-gray-200 overflow-hidden lg:h-fit sticky top-4 max-h-[70vh] overflow-y-auto" class="bg-white rounded-xl shadow-lg border border-gray-200 overflow-hidden lg:h-fit sticky top-4 max-h-[70vh] overflow-y-auto"
> >
<div class="p-3 sm:p-4 md:p-6"> <div class="p-3 sm:p-4 md:p-6">
<!-- Simplified Transaction List - Hari Ini Only -->
<KasirTransaksiList <KasirTransaksiList
:transaksi="transaksi.data || []" :transaksi="transaksi.data || []"
:loading="loading" :loading="loading"
@ -34,7 +34,7 @@
</div> </div>
</div> </div>
<!-- ✅ POPUP KONFIRMASI -->
<ModalConfirm <ModalConfirm
v-if="showConfirm" v-if="showConfirm"
title="Konfirmasi" title="Konfirmasi"
@ -52,7 +52,7 @@ import axios from "axios";
import mainLayout from "../layouts/mainLayout.vue"; import mainLayout from "../layouts/mainLayout.vue";
import KasirForm from "../components/KasirForm.vue"; import KasirForm from "../components/KasirForm.vue";
import KasirTransaksiList from "../components/KasirTransaksiList.vue"; import KasirTransaksiList from "../components/KasirTransaksiList.vue";
import ModalConfirm from "../components/ModalConfirm.vue"; // ✅ Tambah ini import ModalConfirm from "../components/ModalConfirm.vue";
const transaksi = ref({ const transaksi = ref({
data: [], data: [],
@ -62,18 +62,17 @@ const loading = ref(true);
const currentPage = ref(1); const currentPage = ref(1);
const limit = 10; const limit = 10;
const showConfirm = ref(false); // ✅ const showConfirm = ref(false);
const confirmMessage = ref("Apakah kamu yakin?"); // ✅ const confirmMessage = ref("Apakah kamu yakin?");
let lastTransaksi = null; // untuk tau data transaksi terakhir let lastTransaksi = null;
// ✅ Placeholder jika user tekan "Ya"
const handleConfirm = () => { const handleConfirm = () => {
showConfirm.value = false; showConfirm.value = false;
console.log("User konfirmasi, cetak struk di sini...", lastTransaksi); console.log("User konfirmasi, cetak struk di sini...", lastTransaksi);
// TODO: jalankan fungsi cetakStruk(lastTransaksi)
}; };
// Fetch hanya transaksi hari ini
const fetchTransaksiHariIni = async (page = 1) => { const fetchTransaksiHariIni = async (page = 1) => {
try { try {
loading.value = true; loading.value = true;
@ -106,14 +105,14 @@ const fetchTransaksiHariIni = async (page = 1) => {
} }
}; };
// Handle pagination
const handlePageChange = (page) => { const handlePageChange = (page) => {
if (page >= 1 && page <= (transaksi.value.pagination?.last_page || 1)) { if (page >= 1 && page <= (transaksi.value.pagination?.last_page || 1)) {
fetchTransaksiHariIni(page); fetchTransaksiHariIni(page);
} }
}; };
// ✅ Popup setelah transaksi tersimpan
const handleTransaksiSaved = async (newTransaksi) => { const handleTransaksiSaved = async (newTransaksi) => {
const formattedNewTransaksi = { const formattedNewTransaksi = {
id: newTransaksi.id, id: newTransaksi.id,
@ -127,7 +126,7 @@ const handleTransaksiSaved = async (newTransaksi) => {
}; };
transaksi.value.data.unshift(formattedNewTransaksi); transaksi.value.data.unshift(formattedNewTransaksi);
lastTransaksi = formattedNewTransaksi; // ✅ Simpan untuk cetak lastTransaksi = formattedNewTransaksi;
if (transaksi.value.pagination) { if (transaksi.value.pagination) {
transaksi.value.pagination.total += 1; transaksi.value.pagination.total += 1;
@ -137,10 +136,10 @@ const handleTransaksiSaved = async (newTransaksi) => {
} }
confirmMessage.value = "Transaksi berhasil disimpan. Cetak struk sekarang?"; confirmMessage.value = "Transaksi berhasil disimpan. Cetak struk sekarang?";
showConfirm.value = true; // ✅ Munculkan popup showConfirm.value = true;
}; };
// Auto-refresh setiap 10 detik untuk update real-time
let refreshInterval = null; let refreshInterval = null;
const startAutoRefresh = () => { const startAutoRefresh = () => {
if (refreshInterval) clearInterval(refreshInterval); if (refreshInterval) clearInterval(refreshInterval);