feat(procurement): sync status pipeline cards, add supplier lead time badges, and enhance badge contrast

frontend/src/pages/Suppliers/CategoryPage.tsx

@@ -7,6 +7,7 @@ import { nextId } from "../../lib/api";
 import { useAddSupplier, useMaterials, useQuotes, useRemoveSupplier, useStoreData, useSuppliers } from "../../hooks";
 import { useAppStore } from "../../store";
 import { topicByName } from "../../lib/topics";
+import { daysBetween } from "../../lib/formatters";
 import { Header, PageLayout } from "../../components/layout/Header";
 import { EmptyState } from "../../components/EmptyState";
 import { Combobox } from "../../components/Combobox";
@@ -15,7 +16,6 @@ import { materialLabel } from "../../lib/quoteUtils";
 import { Button } from "../../components/ui/button";
 
 // صفحه‌ی تأمین‌کننده‌های یک دسته + فرم افزودن تأمین‌کننده
-// (سلسله‌مراتب دامنه: دسته → تأمین‌کننده؛ در v2.6 دسته = تاپیک)
 export function CategoryPage() {
   useStoreData();
   const { category: catParam = "" } = useParams();
@@ -36,12 +36,29 @@ export function CategoryPage() {
     contact: "",
   });
 
-  // همه‌ی تأمین‌کننده‌ها برای انتخاب سریع (task: کومبوکس کش‌شده)
+  // همه‌ی تأمین‌کننده‌ها برای انتخاب سریع
   const supplierOptions = useMemo(
     () => suppliers.map((s) => ({ id: s.id, name: s.name })),
     [suppliers],
   );
 
+  // محاسبه میانگین زمان تحویل اختصاصی هر تأمین‌کننده بر اساس سفارش‌های تحویل‌شده
+  const supLeadTimes = useMemo(() => {
+    const map = new Map<string, number | null>();
+    suppliers.forEach((s) => {
+      const supQuotes = quotes.filter(
+        (q) => q.supplier_id === s.id && q.status === "arrived" && q.accepted_date && q.arrived_date
+      );
+      const times = supQuotes
+        .map((q) => daysBetween(q.arrived_date, q.accepted_date))
+        .filter((x): x is number => x != null);
+
+      const avg = times.length ? Math.round(times.reduce((a, b) => a + b, 0) / times.length) : null;
+      map.set(s.id, avg);
+    });
+    return map;
+  }, [quotes, suppliers]);
+
   if (!cat) return <Navigate to="/suppliers" replace />;
 
   const sups = suppliersOfCategory(cat, cat, suppliers);
@@ -69,7 +86,6 @@ export function CategoryPage() {
       toast.error("نام تأمین‌کننده را وارد کنید.");
       return;
     }
-    // تأمین‌کننده دقیقاً زیر همین دسته ثبت می‌شود (۱ دسته به ازای هر تأمین‌کننده)
     const s: Supplier = {
       id: nextId("s", suppliers),
       topic: cat,
@@ -101,7 +117,15 @@ export function CategoryPage() {
         ) : (
           <div className="grid grid-cols-2 gap-3 sm:grid-cols-3 lg:grid-cols-4">
             {sups.map((s) => (
-              <SupplierCard key={s.id} s={s} topic={cat} deletable onDelete={removeSup} materials={supMats.get(s.id) || []} />
+              <SupplierCard
+                key={s.id}
+                s={s}
+                topic={cat}
+                deletable
+                onDelete={removeSup}
+                materials={supMats.get(s.id) || []}
+                avgLeadTime={supLeadTimes.get(s.id)}
+              />
             ))}
           </div>
         )}
@@ -161,4 +185,4 @@ export function CategoryPage() {
       </PageLayout>
     </div>
   );
-}
+}

frontend/src/pages/Suppliers/supplierUtils.tsx

@@ -1,7 +1,9 @@
 import { Link } from "react-router-dom";
-import { MapPin, Phone, User, Plus } from "lucide-react";
+import { MapPin, Phone, User, Plus, Timer } from "lucide-react";
 import type { Material, Supplier } from "../../lib/types";
 import { normalize } from "../../lib/normalize";
+import { fmtNum } from "../../lib/formatters";
+
 export function topicCategories(topic: string, materials: Material[], suppliers: Supplier[]): string[] {
   const out = new Set<string>();
   materials
@@ -19,32 +21,44 @@ export function suppliersOfCategory(topic: string, cat: string, suppliers: Suppl
   );
 }
 
-// کارت تأمین‌کننده
+// کارت تأمین‌کننده همراه با برچسب میانگین زمان تحویل
 export function SupplierCard({
   s,
   topic,
   deletable,
   onDelete,
   materials = [],
+  avgLeadTime,
 }: {
   s: Supplier;
   topic: string;
   deletable?: boolean;
   onDelete?: (id: string) => void;
-  // متریال‌های خریداری‌شده از این تأمین‌کننده (به‌جای دسته‌بندی)
   materials?: string[];
+  avgLeadTime?: number | null;
 }) {
   return (
     <div className="sup-card">
-      <div className="sc-head">
-        <Link to={`/suppliers/${s.id}`} className="sc-name-link">
+      <div className="sc-head flex items-start justify-between gap-2">
+        <Link to={`/suppliers/${s.id}`} className="sc-name-link min-w-0 flex-1 leading-snug">
           {s.name}
         </Link>
-        {deletable && onDelete && (
-          <button type="button" className="sup-del" title="حذف تأمین‌کننده" onClick={() => onDelete(s.id)}>
-            ×
-          </button>
-        )}
+        <div className="flex items-center gap-1.5 shrink-0">
+          {avgLeadTime != null && (
+            <span
+              className="inline-flex items-center gap-1 whitespace-nowrap rounded-md bg-emerald-100 border border-emerald-300/80 px-2 py-0.5 text-xs font-bold text-emerald-900 shadow-2xs dark:bg-emerald-950 dark:border-emerald-800 dark:text-emerald-200 tabular-nums"
+              title="میانگین زمان تحویل سفارش‌ها"
+            >
+              <Timer className="h-3.5 w-3.5 text-emerald-700 dark:text-emerald-400" />
+              <span>{fmtNum(avgLeadTime)} روز</span>
+            </span>
+          )}
+          {deletable && onDelete && (
+            <button type="button" className="sup-del" title="حذف تأمین‌کننده" onClick={() => onDelete(s.id)}>
+              ×
+            </button>
+          )}
+        </div>
       </div>
       <div className="sc-meta">
         <span>