fix: ThankYou page discount rows and improved hidden field detection

1. ThankYou page - Added discount row to order summary
   - All 3 template variations (receipt-inner, receipt-outer, default)
   - Shows discount with negative amount in green when > 0
   - Already had shipping/tax rows, now complete breakdown

2. Checkout - Enhanced isFieldHidden helper
   - Now checks both type='hidden' AND hidden=true flags
   - Any standard field can be hidden via PHP snippet
   - Existing city/state/postcode/country checks unchanged
This commit is contained in:
Dwindi Ramadhana
2026-01-08 23:23:56 +07:00
parent 0e561d9e8c
commit 7a45b243cb
2 changed files with 21 additions and 2 deletions

View File

@@ -222,10 +222,11 @@ export default function Checkout() {
loadCheckoutFields(); loadCheckoutFields();
}, [cart.items, isVirtualOnly]); }, [cart.items, isVirtualOnly]);
// Helper to check if a standard field should be hidden (set to type: 'hidden' in PHP) // Helper to check if a standard field should be hidden (set to type: 'hidden' or hidden: true in PHP)
const isFieldHidden = (fieldKey: string): boolean => { const isFieldHidden = (fieldKey: string): boolean => {
const field = checkoutFields.find(f => f.key === fieldKey); const field = checkoutFields.find(f => f.key === fieldKey);
return field?.type === 'hidden'; // Check both type='hidden' and the hidden flag from API
return field?.type === 'hidden' || field?.hidden === true;
}; };
// Filter custom fields by fieldset // Filter custom fields by fieldset

View File

@@ -147,6 +147,12 @@ export default function ThankYou() {
<span className="font-mono">{formatPrice(parseFloat(order.tax_total))}</span> <span className="font-mono">{formatPrice(parseFloat(order.tax_total))}</span>
</div> </div>
)} )}
{parseFloat(order.discount_total || 0) > 0 && (
<div className="flex justify-between text-sm text-green-600">
<span>DISCOUNT:</span>
<span className="font-mono">-{formatPrice(parseFloat(order.discount_total))}</span>
</div>
)}
<div className="flex justify-between text-lg font-bold border-t-2 border-gray-900 pt-2 mt-2"> <div className="flex justify-between text-lg font-bold border-t-2 border-gray-900 pt-2 mt-2">
<span>TOTAL:</span> <span>TOTAL:</span>
<span className="font-mono">{formatPrice(parseFloat(order.total || 0))}</span> <span className="font-mono">{formatPrice(parseFloat(order.total || 0))}</span>
@@ -263,6 +269,12 @@ export default function ThankYou() {
<span className="font-mono">{formatPrice(parseFloat(order.tax_total))}</span> <span className="font-mono">{formatPrice(parseFloat(order.tax_total))}</span>
</div> </div>
)} )}
{parseFloat(order.discount_total || 0) > 0 && (
<div className="flex justify-between text-sm text-green-600">
<span>DISCOUNT:</span>
<span className="font-mono">-{formatPrice(parseFloat(order.discount_total))}</span>
</div>
)}
<div className="flex justify-between text-lg font-bold border-t-2 border-gray-900 pt-2 mt-2"> <div className="flex justify-between text-lg font-bold border-t-2 border-gray-900 pt-2 mt-2">
<span>TOTAL:</span> <span>TOTAL:</span>
<span className="font-mono">{formatPrice(parseFloat(order.total || 0))}</span> <span className="font-mono">{formatPrice(parseFloat(order.total || 0))}</span>
@@ -415,6 +427,12 @@ export default function ThankYou() {
<span>{formatPrice(parseFloat(order.tax_total))}</span> <span>{formatPrice(parseFloat(order.tax_total))}</span>
</div> </div>
)} )}
{parseFloat(order.discount_total || 0) > 0 && (
<div className="flex justify-between text-green-600">
<span>Discount</span>
<span>-{formatPrice(parseFloat(order.discount_total))}</span>
</div>
)}
<div className="flex justify-between font-bold text-lg text-gray-900 pt-2 border-t"> <div className="flex justify-between font-bold text-lg text-gray-900 pt-2 border-t">
<span>Total</span> <span>Total</span>
<span>{formatPrice(parseFloat(order.total || 0))}</span> <span>{formatPrice(parseFloat(order.total || 0))}</span>