feat: transaction modal - add per-unit price label + total amount field
All checks were successful
Deploy to Production / deploy (push) Successful in 3m42s

- Rename '가격' → '1주당 가격'
- Add '총 금액' field with auto-calculation
- Price ↔ Total synced via quantity
This commit is contained in:
머니페니 2026-04-16 22:51:13 +09:00
parent ae244153d6
commit 5009168246

View File

@ -128,6 +128,7 @@ export default function PortfolioDetailPage() {
tx_type: 'buy',
quantity: '',
price: '',
totalAmount: '',
executed_at: '',
memo: '',
});
@ -251,7 +252,7 @@ export default function PortfolioDetailPage() {
memo: txForm.memo || null,
});
setTxModalOpen(false);
setTxForm({ ticker: '', tx_type: 'buy', quantity: '', price: '', executed_at: '', memo: '' });
setTxForm({ ticker: '', tx_type: 'buy', quantity: '', price: '', totalAmount: '', executed_at: '', memo: '' });
setTxManualTicker(false);
await Promise.all([fetchPortfolio(), fetchTransactions()]);
} catch (err) {
@ -826,27 +827,60 @@ export default function PortfolioDetailPage() {
</SelectContent>
</Select>
</div>
<div className="space-y-2">
<Label htmlFor="tx-quantity"></Label>
<Input
id="tx-quantity"
type="number"
min="1"
placeholder="0"
value={txForm.quantity}
onChange={(e) => {
const qty = e.target.value;
const updates: Partial<typeof txForm> = { quantity: qty };
// Recalculate total if price exists
if (txForm.price && qty) {
updates.totalAmount = String(Math.round(parseFloat(txForm.price) * parseInt(qty, 10)));
}
setTxForm({ ...txForm, ...updates });
}}
/>
</div>
<div className="grid grid-cols-2 gap-4">
<div className="space-y-2">
<Label htmlFor="tx-quantity"></Label>
<Input
id="tx-quantity"
type="number"
min="1"
placeholder="0"
value={txForm.quantity}
onChange={(e) => setTxForm({ ...txForm, quantity: e.target.value })}
/>
</div>
<div className="space-y-2">
<Label htmlFor="tx-price"></Label>
<Label htmlFor="tx-price">1 </Label>
<Input
id="tx-price"
type="number"
min="1"
placeholder="0"
value={txForm.price}
onChange={(e) => setTxForm({ ...txForm, price: e.target.value })}
onChange={(e) => {
const price = e.target.value;
const updates: Partial<typeof txForm> = { price };
if (price && txForm.quantity) {
updates.totalAmount = String(Math.round(parseFloat(price) * parseInt(txForm.quantity, 10)));
}
setTxForm({ ...txForm, ...updates });
}}
/>
</div>
<div className="space-y-2">
<Label htmlFor="tx-total"> </Label>
<Input
id="tx-total"
type="number"
min="1"
placeholder="0"
value={txForm.totalAmount}
onChange={(e) => {
const total = e.target.value;
const updates: Partial<typeof txForm> = { totalAmount: total };
if (total && txForm.quantity && parseInt(txForm.quantity, 10) > 0) {
updates.price = String(Math.round(parseFloat(total) / parseInt(txForm.quantity, 10)));
}
setTxForm({ ...txForm, ...updates });
}}
/>
</div>
</div>