From df5ee9e6bdd07f0d95dcecdc3cd8834e882d4c91 Mon Sep 17 00:00:00 2001
From: Andreas Knuth <andreas.knuth@gmail.com>
Date: Fri, 12 Jun 2026 10:03:37 -0500
Subject: [PATCH] use values from db

---
 public/js/views/accounting-view.js | 32 ++++++++++++++++++++++++++++++
 1 file changed, 32 insertions(+)

diff --git a/public/js/views/accounting-view.js b/public/js/views/accounting-view.js
index af958c7..2746c18 100644
--- a/public/js/views/accounting-view.js
+++ b/public/js/views/accounting-view.js
@@ -945,6 +945,38 @@ async function openTaxPeriodDetail(startDate, endDate, existingPeriod) {
 
     stEditingPeriodId = existingPeriod ? existingPeriod.id : null;
 
+    if (existingPeriod && existingPeriod.status === 'paid') {
+        const [py, pm] = String(existingPeriod.period_start).split('T')[0].split('-');
+        const MONTHS = ['January','February','March','April','May','June','July','August','September','October','November','December'];
+        const mLabel = MONTHS[Number(pm) - 1] + ' ' + py;
+        const adj = parseFloat(existingPeriod.adjustment_amount) || 0;
+        const adjStr = adj > 0 ? `\u2212${fmtMoney(adj)}` : adj < 0 ? `+$${Math.abs(adj).toFixed(2)}` : '\u2014';
+        const paidOn = formatDate(existingPeriod.booked_at);
+
+        detailEl.innerHTML = `
+            <div class="bg-white rounded-lg shadow-sm border border-gray-200 p-4">
+                <div class="flex items-center justify-between mb-3">
+                    <h3 class="font-semibold text-gray-800">${mLabel} \u2014 Sales Tax Detail (Paid)</h3>
+                    <button onclick="window.accountingView.closeTaxPeriodDetail()" class="px-2 py-1 text-gray-400 hover:text-gray-600 text-lg leading-none">&times;</button>
+                </div>
+                <p class="text-sm text-green-700 font-semibold mb-4">\u2705 Paid on ${paidOn}</p>
+                <table class="min-w-full text-sm border border-gray-200 rounded">
+                    <tbody>
+                        <tr class="border-t"><td class="px-3 py-2 text-gray-600">Total Sales</td><td class="px-3 py-2 text-right font-medium">${fmtMoney(parseFloat(existingPeriod.total_sales) || 0)}</td></tr>
+                        <tr class="border-t"><td class="px-3 py-2 text-gray-600">Nontaxable Sales</td><td class="px-3 py-2 text-right font-medium">${fmtMoney(parseFloat(existingPeriod.nontaxable_sales) || 0)}</td></tr>
+                        <tr class="border-t"><td class="px-3 py-2 text-gray-600">Taxable Sales</td><td class="px-3 py-2 text-right font-medium">${fmtMoney(parseFloat(existingPeriod.taxable_sales) || 0)}</td></tr>
+                        <tr class="border-t"><td class="px-3 py-2 text-gray-600">Tax Collected</td><td class="px-3 py-2 text-right font-medium">${fmtMoney(parseFloat(existingPeriod.tax_collected) || 0)}</td></tr>
+                        <tr class="border-t"><td class="px-3 py-2 text-gray-600">Adjustment</td><td class="px-3 py-2 text-right font-medium ${adj !== 0 ? 'text-red-600' : ''}">${adjStr}</td></tr>
+                        ${existingPeriod.adjustment_reason ? `<tr class="border-t"><td class="px-3 py-2 text-gray-500 text-xs pl-8" colspan="2">Reason: ${escapeHtml(existingPeriod.adjustment_reason)}</td></tr>` : ''}
+                        <tr class="border-t bg-gray-50 font-semibold"><td class="px-3 py-2">Net Paid</td><td class="px-3 py-2 text-right">${fmtMoney(parseFloat(existingPeriod.net_paid) || 0)}</td></tr>
+                    </tbody>
+                </table>
+            </div>`;
+        detailEl.classList.remove('hidden');
+        detailEl.scrollIntoView({ behavior: 'smooth' });
+        return;
+    }
+
     showLoading('sales-tax-detail', 'Loading tax summary from QBO…');
     let taxData;
     try {