// src/stores/payment.js import { defineStore } from 'pinia'; // Variabel di luar store untuk menyimpan timer, agar persistensi di luar state Pinia let autoResetTimer = null; export const usePaymentStore = defineStore('payment', { state: () => ({ currentStep: 1, // 1: Menunggu Data, 2: Tampilkan QRIS, 3: Sukses, 4: Gagal patientInfo: { name: '', amount: '', expiry: '', // Dibiarkan kosong, waktu kedaluwarsa dihitung dari qrData.created_at }, qrData: { qrvalue: null, display_nobill: null, display_name: null, display_amount: null, status: null, // Status pembayaran: "1" (Pending), "2" (Sukses), "0" (Gagal/Expired) ip: null, created_at: null, // Tambahkan ini agar properti ada secara eksplisit // ... properti lain dari API akan ditambahkan melalui spread operator }, }), getters: { hasQrData: (state) => state.qrData && state.qrData.qrvalue, safeQrValue: (state) => state.qrData?.qrvalue || 'https://www.google.com', // Getter untuk cek apakah data siap isReadyForStatusCheck: (state) => { return state.qrData.display_nobill && state.qrData.display_name; }, // Getter untuk debug debugInfo: (state) => ({ step: state.currentStep, hasIdentifiers: !!(state.qrData.display_nobill && state.qrData.display_name), qrData: state.qrData, patientInfo: state.patientInfo, }) }, actions: { nextStep() { this.currentStep++; }, prevStep() { this.currentStep--; }, setStep(step) { console.log(`[STORE] Setting step from ${this.currentStep} to ${step}`); this.currentStep = step; }, /** * @description Memulai timer untuk reset state kembali ke Step 1 (Home) setelah 20 detik */ startAutoReset() { if (autoResetTimer) { clearTimeout(autoResetTimer); } console.log('🏠 [STORE] Starting auto return timer (20s) for reset.'); autoResetTimer = setTimeout(() => { console.log('🏠 [STORE] Auto return to home triggered'); this.reset(); }, 20000); }, reset() { console.log('--- [STORE] Resetting payment store ---'); this.currentStep = 1; this.patientInfo = { name: '', amount: '', expiry: '', }; this.qrData = { qrvalue: null, display_nobill: null, display_name: null, display_amount: null, status: null, ip: null, created_at: null, }; if (autoResetTimer) { clearTimeout(autoResetTimer); autoResetTimer = null; } }, updatePayment(apiResponse) { console.log("=== [STORE] UPDATE PAYMENT ==="); // Validasi response if (!apiResponse?.data || !Array.isArray(apiResponse.data) || apiResponse.data.length === 0) { console.error("Invalid API response structure or empty data array"); return; } const apiData = apiResponse.data[0]; const oldStatus = this.qrData.status; // Simpan status lama // Update qrData dengan semua properti dari API this.qrData = { qrvalue: apiData.qrvalue || apiData.qr_code || this.qrData.qrvalue, display_nobill: apiData.display_nobill || this.qrData.display_nobill, display_name: apiData.display_name || this.qrData.display_name, display_amount: apiData.display_amount || apiData.nominal || this.qrData.display_amount, status: apiData.status || this.qrData.status, ip: apiData.ip || this.qrData.ip, created_at: apiData.created_at || this.qrData.created_at, // Ambil 'created_at' // Spread untuk properti lain yang mungkin ada (misal: transaction_id, reason) ...apiData }; // Update patientInfo this.patientInfo = { name: this.qrData.display_name || this.patientInfo.name || 'Unknown', amount: this.qrData.display_amount || this.patientInfo.amount || '0', expiry: this.patientInfo.expiry, }; // --- LOGIKA TRANSISI STATUS OTOMATIS (SUCCESS/FAIL) --- const newStatus = this.qrData.status; // Log perubahan status (jika ada) if (oldStatus !== newStatus) { console.log(`[STORE] Status changed: ${oldStatus} -> ${newStatus}`); } // Proses transisi hanya jika kita berada di Step 2 (Menunggu Pembayaran) // DAN status yang diterima berbeda dari status sebelumnya if (this.currentStep === 2 && oldStatus !== newStatus) { if (newStatus === "2") { // Status Sukses console.log('🎉 [STORE] Status 2 (SUKSES) diterima. Pindah ke Step 3.'); this.currentStep = 3; this.startAutoReset(); } else if (newStatus === "0") { // Status Gagal console.log('❌ [STORE] Status 0 (GAGAL) diterima. Pindah ke Step 4.'); this.currentStep = 4; this.startAutoReset(); } } // ------------------------------------------------------ console.log("Updated qrData:", this.qrData); console.log("Updated patientInfo:", this.patientInfo); console.log("==================="); }, // Method untuk debug debugCurrentState() { console.log("=== PAYMENT STORE DEBUG ==="); console.log("Current Step:", this.currentStep); console.log("Patient Info:", this.patientInfo); console.log("QR Data:", this.qrData); console.log("Has QR Data:", this.hasQrData); console.log("Ready for Status Check:", this.isReadyForStatusCheck); console.log("Safe QR Value:", this.safeQrValue); console.log("=========================="); }, // Method untuk validasi data validateData() { const issues = []; if (!this.qrData.display_nobill) { issues.push('display_nobill missing'); } if (!this.qrData.display_name) { issues.push('display_name missing'); } if (!this.qrData.qrvalue && !this.qrData.qr_code) { issues.push('QR code missing'); } if (issues.length > 0) { console.warn('Data validation issues:', issues); return false; } return true; } }, });