Todd/little.beaver
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added edit feature

Browse Source
This commit is contained in:
Todd
2026-04-23 14:36:24 -04:00
parent 8a5092c56d
commit 1b875eb0b6
2 changed files with 52 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/App.jsx
View File

@ -74,6 +74,12 @@ function App() {
setQuoteItems(newItems);
};
const handleEditItem = (index, field, value) => {
const newItems = [...quoteItems];
newItems[index] = { ...newItems[index], [field]: value };
setQuoteItems(newItems);
};
const handlePrintQuote = () => {
setIsWorkOrderMode(false);
setTimeout(() => {
@ -222,6 +228,7 @@ function App() {
shippingCost={shippingCost}
onShippingChange={setShippingCost}
onRemoveItem={handleRemoveItem}
onEditItem={handleEditItem}
isWorkOrderMode={isWorkOrderMode}
/>

51
src/components/QuoteSummary.jsx
View File

@ -1,7 +1,7 @@
import React from 'react';
import { Trash2 } from 'lucide-react';
export default function QuoteSummary({ items, customer, shippingCost, onShippingChange, onRemoveItem, isWorkOrderMode }) {
export default function QuoteSummary({ items, customer, shippingCost, onShippingChange, onRemoveItem, onEditItem, isWorkOrderMode }) {
const provinceTaxRates = {
'ON': 0.13, // Ontario (HST)
'QC': 0.05, // Quebec (GST)
@ -25,7 +25,9 @@ export default function QuoteSummary({ items, customer, shippingCost, onShipping
const calculateSubtotal = () => {
return items.reduce((total, item) => {
const itemTotal = item.Price * item.quantity;
const qty = parseInt(item.quantity, 10) || 0;
const price = parseFloat(item.Price) || 0;
const itemTotal = price * qty;
const discountAmount = itemTotal * ((item.discount || 0) / 100);
return total + (itemTotal - discountAmount);
}, 0);
@ -68,16 +70,53 @@ export default function QuoteSummary({ items, customer, shippingCost, onShipping
</thead>
<tbody>
{items.map((item, index) => {
const itemTotal = item.Price * item.quantity;
const qty = parseInt(item.quantity, 10) || 0;
const price = parseFloat(item.Price) || 0;
const itemTotal = price * qty;
const discountAmount = itemTotal * ((item.discount || 0) / 100);
const finalPrice = itemTotal - discountAmount;
return (
<tr key={index}>
<td>{item['Item ID']}</td>
<td>{item.Description}</td>
{!isWorkOrderMode && <td>{formatCurrency(item.Price)}</td>}
{!isWorkOrderMode && <td>{item.discount ? `${item.discount}%` : '-'}</td>}
<td>{item.quantity}</td>
{!isWorkOrderMode && <td>
<span className="print-only-block" style={{ display: 'none' }}>{formatCurrency(price)}</span>
<div className="no-print" style={{ display: 'flex', alignItems: 'center' }}>
<span style={{ marginRight: '0.25rem' }}>$</span>
<input
type="number"
value={item.Price === '' ? '' : price}
onChange={(e) => onEditItem(index, 'Price', e.target.value === '' ? '' : parseFloat(e.target.value))}
style={{ width: '80px', padding: '0.25rem' }}
step="0.01"
/>
</div>
</td>}
{!isWorkOrderMode && <td>
<span className="print-only-block" style={{ display: 'none' }}>{item.discount ? `${item.discount}%` : '-'}</span>
<div className="no-print" style={{ display: 'flex', alignItems: 'center' }}>
<input
type="number"
value={item.discount === '' ? '' : (item.discount || '')}
onChange={(e) => onEditItem(index, 'discount', e.target.value === '' ? '' : parseFloat(e.target.value))}
style={{ width: '60px', padding: '0.25rem' }}
placeholder="0"
/>
<span style={{ marginLeft: '0.25rem' }}>%</span>
</div>
</td>}
<td>
<span className="print-only-block" style={{ display: 'none' }}>{qty}</span>
<div className="no-print">
<input
type="number"
value={item.quantity === '' ? '' : qty}
onChange={(e) => onEditItem(index, 'quantity', e.target.value === '' ? '' : parseInt(e.target.value, 10))}
style={{ width: '60px', padding: '0.25rem' }}
min="1"
/>
</div>
</td>
{!isWorkOrderMode && <td>{formatCurrency(finalPrice)}</td>}
{isWorkOrderMode && (
<td style={{ textAlign: 'center' }}>