mirror of
https://github.com/R0m1k3/LogiFlow.git
synced 2026-10-22 14:38:19 +02:00
Remove pending order notification and improve order alert styling
Removes the top-level notification for pending orders and updates the styling for pending order alerts to use color-coded severity based on how long an order has been pending. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 98f01874-e00c-4bbe-9d71-b0b338001848 Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/1957c339-2757-4d1f-8e92-e9f71a1ce58e/98f01874-e00c-4bbe-9d71-b0b338001848/XDIQsDu
This commit is contained in:
1 parent
beed32daea
commit
38c48bd6f6
1 file changed
+29
-25
@@ -351,14 +351,6 @@ export default function Dashboard() {
|
|||||||
|
|
||||||
{/* Alerts */}
|
{/* Alerts */}
|
||||||
<div className="space-y-3">
|
<div className="space-y-3">
|
||||||
{pendingOrdersCount > 0 && (
|
|
||||||
<div className="bg-orange-50 border-l-4 border-orange-400 p-4 flex items-center space-x-3 shadow-sm">
|
|
||||||
<AlertTriangle className="h-5 w-5 text-orange-600" />
|
|
||||||
<span className="text-sm font-medium text-orange-800">
|
|
||||||
<strong>{pendingOrdersCount} commande(s) en attente</strong> nécessitent une planification
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{dlcStats.expiringSoon > 0 && (
|
{dlcStats.expiringSoon > 0 && (
|
||||||
<div className="bg-yellow-50 border-l-4 border-yellow-400 p-4 flex items-center space-x-3 shadow-sm">
|
<div className="bg-yellow-50 border-l-4 border-yellow-400 p-4 flex items-center space-x-3 shadow-sm">
|
||||||
@@ -454,25 +446,37 @@ export default function Dashboard() {
|
|||||||
</CardTitle>
|
</CardTitle>
|
||||||
</CardHeader>
|
</CardHeader>
|
||||||
<CardContent className="space-y-3 p-6 max-h-96 overflow-y-auto">
|
<CardContent className="space-y-3 p-6 max-h-96 overflow-y-auto">
|
||||||
{pendingOrders.length > 0 ? pendingOrders.map((order: any) => (
|
{pendingOrders.length > 0 ? pendingOrders.map((order: any) => {
|
||||||
<div key={order.id} className="flex items-center justify-between p-4 bg-gray-50 hover:bg-gray-100 transition-colors border-l-3 border-orange-500">
|
// Calculer le nombre de jours en attente
|
||||||
<div className="flex items-center space-x-3">
|
const orderDate = safeDate(order.createdAt);
|
||||||
<div className="h-2 w-2 bg-orange-500"></div>
|
const daysPending = orderDate ? Math.floor((new Date().getTime() - orderDate.getTime()) / (1000 * 60 * 60 * 24)) : 0;
|
||||||
<div>
|
const isOverdue = daysPending > 10;
|
||||||
<p className="font-medium text-gray-900">{order.supplier?.name}</p>
|
|
||||||
<p className="text-sm text-gray-600">{order.group?.name}</p>
|
return (
|
||||||
|
<div key={order.id} className={`flex items-center justify-between p-4 transition-colors border-l-3 ${
|
||||||
|
isOverdue ? 'bg-red-50 hover:bg-red-100 border-red-500' : 'bg-orange-50 hover:bg-orange-100 border-orange-500'
|
||||||
|
}`}>
|
||||||
|
<div className="flex items-center space-x-3">
|
||||||
|
<div className={`h-2 w-2 ${isOverdue ? 'bg-red-500' : 'bg-orange-500'}`}></div>
|
||||||
|
<div>
|
||||||
|
<p className="font-medium text-gray-900">{order.supplier?.name}</p>
|
||||||
|
<p className="text-sm text-gray-600">{order.group?.name}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="text-right">
|
||||||
|
<Badge
|
||||||
|
variant={isOverdue ? 'destructive' : 'secondary'}
|
||||||
|
className="text-xs"
|
||||||
|
>
|
||||||
|
{daysPending} jour{daysPending > 1 ? 's' : ''}
|
||||||
|
</Badge>
|
||||||
|
<p className="text-xs text-gray-500 mt-1">
|
||||||
|
{safeFormat(order.plannedDate, "d MMM")}
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="text-right">
|
);
|
||||||
<Badge variant="secondary" className="text-xs">
|
}) : (
|
||||||
En attente
|
|
||||||
</Badge>
|
|
||||||
<p className="text-xs text-gray-500 mt-1">
|
|
||||||
{safeFormat(order.plannedDate, "d MMM")}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)) : (
|
|
||||||
<p className="text-gray-600 text-center py-8">Aucune commande en attente</p>
|
<p className="text-gray-600 text-center py-8">Aucune commande en attente</p>
|
||||||
)}
|
)}
|
||||||
</CardContent>
|
</CardContent>
|
||||||
|
|||||||
Reference in new issue
Block a user