manus-admin/demat-facturation
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Checkpoint: Ajout du filtre destinataire dans la liste des factures (dropdown + recherche textuelle), graphique "Top 10 destinataires" et liste détaillée dans le dashboard, filtre destinataire dans les paramètres SFTP (sftpRecipientFilter) avec application lors de l'export

Browse Source
This commit is contained in:
Manus
2026-04-12 05:20:55 -04:00
parent 604426523d
commit edf7cc704d
10 changed files with 1707 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
client/src/pages/Invoices.tsx
View File

@@ -32,7 +32,8 @@ import {
TableRow,
} from "@/components/ui/table";
import { trpc } from "@/lib/trpc";
import { Search, FileText, Download, FileSpreadsheet, Trash2, Edit, Trash } from "lucide-react";
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
import { Search, FileText, Download, FileSpreadsheet, Trash2, Edit, Trash, Filter } from "lucide-react";
import * as XLSX from 'xlsx';
import { toast } from "sonner";
import { useLocation } from "wouter";
@@ -42,6 +43,7 @@ export default function Invoices() {
const [searchQuery, setSearchQuery] = useState("");
const [selectedIds, setSelectedIds] = useState<number[]>([]);
const [statusFilter, setStatusFilter] = useState<string>("all");
const [recipientFilter, setRecipientFilter] = useState<string>("all");
const [deleteDialogOpen, setDeleteDialogOpen] = useState(false);
const [invoiceToDelete, setInvoiceToDelete] = useState<number | null>(null);
const [addDialogOpen, setAddDialogOpen] = useState(false);
@@ -175,12 +177,20 @@ export default function Invoices() {
}
};
// Collect unique recipients for the filter dropdown
const uniqueRecipients = Array.from(
new Set(
(invoices || []).map(inv => (inv as any).recipientName).filter(Boolean)
)
).sort();
const filteredInvoices = invoices?.filter((inv) => {
// Filter by search query
if (searchQuery) {
const query = searchQuery.toLowerCase();
const matchesSearch = inv.supplierName?.toLowerCase().includes(query) ||
inv.invoiceNumber?.toLowerCase().includes(query);
inv.invoiceNumber?.toLowerCase().includes(query) ||
(inv as any).recipientName?.toLowerCase().includes(query);
if (!matchesSearch) return false;
}
@@ -190,6 +200,15 @@ export default function Invoices() {
if (statusFilter === "not_exported" && inv.exportStatus !== "not_exported") return false;
if (statusFilter === "export_error" && inv.exportStatus !== "export_error") return false;
}
// Filter by recipient
if (recipientFilter !== "all") {
if (recipientFilter === "__empty__") {
if ((inv as any).recipientName) return false;
} else {
if ((inv as any).recipientName !== recipientFilter) return false;
}
}
return true;
});
@@ -336,17 +355,32 @@ export default function Invoices() {
<Card>
<CardContent className="pt-6">
{/* Search */}
<div className="mb-4">
<div className="relative">
{/* Search + Recipient Filter */}
<div className="mb-4 flex gap-3 flex-wrap">
<div className="relative flex-1 min-w-[200px]">
<Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400 w-4 h-4" />
<Input
placeholder="Rechercher par fournisseur ou numéro..."
placeholder="Rechercher par fournisseur, destinataire ou numéro..."
value={searchQuery}
onChange={(e) => setSearchQuery(e.target.value)}
className="pl-10"
/>
</div>
<div className="flex items-center gap-2 min-w-[220px]">
<Filter className="w-4 h-4 text-gray-400 shrink-0" />
<Select value={recipientFilter} onValueChange={setRecipientFilter}>
<SelectTrigger className="w-full">
<SelectValue placeholder="Filtrer par destinataire" />
</SelectTrigger>
<SelectContent>
<SelectItem value="all">Tous les destinataires</SelectItem>
<SelectItem value="__empty__">Sans destinataire</SelectItem>
{uniqueRecipients.map((r) => (
<SelectItem key={r} value={r}>{r}</SelectItem>
))}
</SelectContent>
</Select>
</div>
</div>
{/* Status Filters */}