Add TTC amount configuration and display for financial tracking

Introduces `nocodbInvoiceAmountTTCColumnName` to `Groups.tsx` and `amountTTC` to `PaymentSchedule` interface in `PaymentSchedulePage.tsx` to support TTC calculations and display. Updates backend routes in `routes.ts` to include `amountTTC` and modifies `PaymentSchedulePage.tsx` to show both HT and TTC totals.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 1e4433b5-47ab-464c-b663-fea2e53367dd
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Event-Id: 01a3488a-852e-4c10-8349-442dbf9fc720
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/1957c339-2757-4d1f-8e92-e9f71a1ce58e/1e4433b5-47ab-464c-b663-fea2e53367dd/vfXE6SO
This commit is contained in:
michaelschal committed 2025-11-04 10:34:39 +00:00
1 parent da6ec893d2
commit 8e13dcb94c
4 files changed
+76 -14

No files matched your search

Binary file not shown.

After

Width:  |  Height:  |  Size: 46 KiB

+17 -1
View File
@@ -50,6 +50,7 @@ export default function Groups() {
invoiceColumnName: "",
nocodbBlColumnName: "",
nocodbAmountColumnName: "",
nocodbInvoiceAmountTTCColumnName: "",
nocodbSupplierColumnName: "",
nocodbDueDateColumnName: "",
webhookUrl: "",
@@ -106,6 +107,7 @@ export default function Groups() {
invoiceColumnName: "",
nocodbBlColumnName: "",
nocodbAmountColumnName: "",
nocodbInvoiceAmountTTCColumnName: "",
nocodbSupplierColumnName: "",
nocodbDueDateColumnName: "",
webhookUrl: "",
@@ -151,6 +153,7 @@ export default function Groups() {
invoiceColumnName: "",
nocodbBlColumnName: "",
nocodbAmountColumnName: "",
nocodbInvoiceAmountTTCColumnName: "",
nocodbSupplierColumnName: "",
nocodbDueDateColumnName: "",
webhookUrl: "",
@@ -259,6 +262,7 @@ export default function Groups() {
invoiceColumnName: "",
nocodbBlColumnName: "",
nocodbAmountColumnName: "",
nocodbInvoiceAmountTTCColumnName: "",
nocodbSupplierColumnName: "",
nocodbDueDateColumnName: "",
webhookUrl: "",
@@ -276,6 +280,7 @@ export default function Groups() {
invoiceColumnName: group.invoiceColumnName || "",
nocodbBlColumnName: group.nocodbBlColumnName || "",
nocodbAmountColumnName: group.nocodbAmountColumnName || "",
nocodbInvoiceAmountTTCColumnName: group.nocodbInvoiceAmountTTCColumnName || "",
nocodbSupplierColumnName: group.nocodbSupplierColumnName || "",
nocodbDueDateColumnName: group.nocodbDueDateColumnName || "",
webhookUrl: group.webhookUrl || "",
@@ -624,7 +629,7 @@ export default function Groups() {
</div>
<div>
<Label htmlFor="nocodbAmountColumnName">Colonne Montant</Label>
<Label htmlFor="nocodbAmountColumnName">Colonne Montant HT</Label>
<Input
id="nocodbAmountColumnName"
value={formData.nocodbAmountColumnName}
@@ -633,6 +638,16 @@ export default function Groups() {
/>
</div>
<div>
<Label htmlFor="nocodbInvoiceAmountTTCColumnName">Colonne Montant TTC</Label>
<Input
id="nocodbInvoiceAmountTTCColumnName"
value={formData.nocodbInvoiceAmountTTCColumnName}
onChange={(e) => handleChange('nocodbInvoiceAmountTTCColumnName', e.target.value)}
placeholder="ex: Montant_TTC"
/>
</div>
<div>
<Label htmlFor="nocodbSupplierColumnName">Colonne Fournisseur</Label>
<Input
@@ -713,6 +728,7 @@ export default function Groups() {
invoiceColumnName: "",
nocodbBlColumnName: "",
nocodbAmountColumnName: "",
nocodbInvoiceAmountTTCColumnName: "",
nocodbSupplierColumnName: "",
nocodbDueDateColumnName: "",
webhookUrl: "",
+58 -13
View File
@@ -18,6 +18,7 @@ interface PaymentSchedule {
invoiceReference: string;
dueDate: string;
amount: number;
amountTTC: number;
supplierName: string;
paymentMethod: string | null;
groupId: number;
@@ -87,12 +88,17 @@ export default function PaymentSchedulePage() {
});
}, [data?.schedules, selectedMonth]);
// Calculer le total du mois
// Calculer le total du mois (HT)
const monthTotal = useMemo(() => {
return filteredSchedules.reduce((sum, schedule) => sum + schedule.amount, 0);
}, [filteredSchedules]);
// Grouper par mode de paiement
// Calculer le total du mois (TTC)
const monthTotalTTC = useMemo(() => {
return filteredSchedules.reduce((sum, schedule) => sum + schedule.amountTTC, 0);
}, [filteredSchedules]);
// Grouper par mode de paiement (HT)
const paymentMethodTotals = useMemo(() => {
const totals: Record<string, number> = {};
filteredSchedules.forEach(schedule => {
@@ -102,6 +108,16 @@ export default function PaymentSchedulePage() {
return totals;
}, [filteredSchedules]);
// Grouper par mode de paiement (TTC)
const paymentMethodTotalsTTC = useMemo(() => {
const totals: Record<string, number> = {};
filteredSchedules.forEach(schedule => {
const method = schedule.paymentMethod || 'Non défini';
totals[method] = (totals[method] || 0) + schedule.amountTTC;
});
return totals;
}, [filteredSchedules]);
if (!selectedStoreId) {
return (
<div className="flex-1 flex items-center justify-center">
@@ -188,10 +204,21 @@ export default function PaymentSchedulePage() {
<DollarSign className="h-4 w-4 text-muted-foreground" />
</CardHeader>
<CardContent>
<div className="text-2xl font-bold" data-testid="text-month-total">
{monthTotal.toFixed(2)} €
<div className="space-y-1">
<div className="flex justify-between items-baseline">
<span className="text-sm text-gray-600">HT:</span>
<span className="text-xl font-bold" data-testid="text-month-total-ht">
{monthTotal.toFixed(2)} €
</span>
</div>
<div className="flex justify-between items-baseline">
<span className="text-sm text-gray-600">TTC:</span>
<span className="text-xl font-bold text-blue-600" data-testid="text-month-total-ttc">
{monthTotalTTC.toFixed(2)} €
</span>
</div>
</div>
<p className="text-xs text-muted-foreground">
<p className="text-xs text-muted-foreground mt-2">
{filteredSchedules.length} échéance{filteredSchedules.length > 1 ? 's' : ''}
</p>
</CardContent>
@@ -203,11 +230,20 @@ export default function PaymentSchedulePage() {
<CreditCard className="h-4 w-4 text-muted-foreground" />
</CardHeader>
<CardContent>
<div className="text-sm space-y-1">
{Object.entries(paymentMethodTotals).map(([method, total]) => (
<div key={method} className="flex justify-between">
<span className="text-gray-600">{method}:</span>
<span className="font-semibold">{total.toFixed(2)} €</span>
<div className="text-sm space-y-2">
{Object.entries(paymentMethodTotals).map(([method, totalHT]) => (
<div key={method} className="border-b pb-2 last:border-b-0">
<div className="font-medium text-gray-700 mb-1">{method}</div>
<div className="flex justify-between text-xs">
<span className="text-gray-500">HT:</span>
<span className="font-semibold">{totalHT.toFixed(2)} €</span>
</div>
<div className="flex justify-between text-xs">
<span className="text-gray-500">TTC:</span>
<span className="font-semibold text-blue-600">
{paymentMethodTotalsTTC[method]?.toFixed(2) || '0.00'} €
</span>
</div>
</div>
))}
</div>
@@ -272,9 +308,18 @@ export default function PaymentSchedulePage() {
)}
</div>
</div>
<div className="text-right">
<div className="text-xl font-bold text-blue-600">
{schedule.amount.toFixed(2)} €
<div className="text-right space-y-1">
<div className="flex items-center gap-2 justify-end">
<span className="text-xs text-gray-500">HT:</span>
<span className="text-lg font-semibold">
{schedule.amount.toFixed(2)} €
</span>
</div>
<div className="flex items-center gap-2 justify-end">
<span className="text-xs text-gray-500">TTC:</span>
<span className="text-lg font-bold text-blue-600">
{schedule.amountTTC.toFixed(2)} €
</span>
</div>
</div>
</div>
+1
View File
@@ -445,6 +445,7 @@ export async function registerRoutes(app: Express): Promise<Server> {
invoiceReference: delivery.invoiceReference,
dueDate: delivery.dueDate,
amount: delivery.invoiceAmount ? parseFloat(delivery.invoiceAmount) : 0,
amountTTC: delivery.invoiceAmountTTC ? parseFloat(delivery.invoiceAmountTTC) : 0,
supplierName: supplier?.name || 'Fournisseur inconnu',
paymentMethod: supplier?.paymentMethod || null,
groupId: group.id,