fix: designed

app/components/dashboard/project-management/digital-innovation-page.tsx

@@ -73,7 +73,7 @@ interface DigitalInnovationMetrics {
 
 // Normalized interface for digital innovation stats
 interface DigitalInnovationStats {
-  // totalDigitalProjects: number;
+  totalDigitalProjects: number;
   increasedRevenue: number;
   increasedRevenuePercent: number;
   reduceCosts: number;
@@ -358,7 +358,7 @@ export function DigitalInnovationPage() {
 
   useEffect(() => {
     fetchTable(true);
-    fetchTotalCount();
+    // fetchTotalCount();
     fetchStats();
   }, [sortConfig]);
 
@@ -440,10 +440,9 @@ export function DigitalInnovationPage() {
   const fetchStats = async () => {
     try {
       setStatsLoading(true);
-      const raw = await apiService.callInnovationProcess<any>({
+      const raw = await apiService.call<any>({
         innovation_digital_function: {},
       });
-
       let payload: DigitalInnovationMetrics = raw?.data;
       if (typeof payload === "string") {
         try {
@@ -462,6 +461,9 @@ export function DigitalInnovationPage() {
         return 0;
       };
       const normalized: DigitalInnovationStats = {
+        totalDigitalProjects: parseNum(
+          payload.count_innovation_digital_projects
+        ),
         increasedRevenue: parseNum(payload?.increased_revenue),
         increasedRevenuePercent: parseNum(payload?.increased_revenue_percent),
         reduceCosts: parseNum(payload?.reduce_costs),
@@ -637,10 +639,10 @@ export function DigitalInnovationPage() {
     <DashboardLayout title="نوآوری دیجیتال">
       <div className="flex flex-row gap-8 justify-between p-6 space-y-4 h-full">
         {/* Stats Cards */}
-        <div className="flex flex-col gap-4 w-full">
+        <div className="flex flex-col gap-5 w-full">
           <div className="space-y-6 w-full">
             {/* Stats Grid */}
-            <div className="grid grid-cols-2 gap-3">
+            <div className="grid grid-cols-2 gap-5">
               {loading || statsLoading
                 ? // Loading skeleton for stats cards - matching new design
                   Array.from({ length: 4 }).map((_, index) => (
@@ -678,19 +680,19 @@ export function DigitalInnovationPage() {
                       key={card.id}
                       className="bg-[linear-gradient(to_bottom_left,#464861,50%,#111628)] backdrop-blur-sm border-gray-700/50"
                     >
-                      <CardContent className="p-2">
+                      <CardContent className="p-0">
                         <div className="flex flex-col justify-between gap-2">
-                          <div className="flex justify-between items-center border-b-2 mx-4 border-gray-500/20">
+                          <div className="flex justify-between items-center border-b-2 px-6 py-3 border-gray-500/20">
                             <h3 className="text-lg font-bold text-white font-persian ">
                               {card.title}
                             </h3>
                             <div
-                              className={`p-3 gird placeitems-center rounded-full w-fit `}
+                              className={`gird placeitems-center rounded-full w-fit `}
                             >
                               {card.icon}
                             </div>
                           </div>
-                          <div className="flex items-center justify-center flex-col p-1">
+                          <div className="flex items-center justify-center flex-col py-5">
                             <p
                               className={`text-3xl font-bold ${card.color} mb-1`}
                             >
@@ -750,7 +752,7 @@ export function DigitalInnovationPage() {
         <Card className="bg-transparent backdrop-blur-sm rounded-2xl overflow-hidden w-full h-max">
           <CardContent className="p-0">
             <div className="relative">
-              <Table containerClassName="overflow-auto custom-scrollbar h-[calc(90vh-270px)]">
+              <Table containerClassName="overflow-auto custom-scrollbar h-max-[calc(90vh-80px)] md:h-max-[calc(90vh-200px)] 2xl:h-[calc(90vh-220px)]">
                 <TableHeader>
                   <TableRow className="bg-[#3F415A]">
                     {columns.map((column) => (
@@ -863,35 +865,32 @@ export function DigitalInnovationPage() {
           </CardContent>
 
           {/* Footer */}
-          <div className="p-2 px-4 bg-gray-700/50">
+          <div className="p-3 px-4 bg-gray-700/50">
-            <div className="grid grid-cols-6 gap-4 text-sm text-gray-300 font-persian">
+            <div className="flex flex-row  text-sm text-gray-300 font-persian">
-              <div className="text-center gap-2 items-center flex">
+              <div className="text-center gap-2 items-center flex justify-center w-1/2">
                 <div className="text-base text-gray-401 mb-1">
-                  کل پروژه ها :{formatNumber(actualTotalCount)}
+                  کل پروژه ها :
+                  {formatNumber(stats.totalDigitalProjects)}
                 </div>
               </div>
-              {/* Project number column - empty */}
+
-              <div></div>
+              <div className="flex justify-center items-center gap-4 w-10/12">
-              {/* Title column - empty */}
-              <div></div>
-              {/* Project status column - empty */}
                 <div className="flex  items-center flex-row-reverse status ">
                   <span className="block w-7 h-2.5 bg-violet-500 rounded-tl-xl rounded-bl-xl"></span>
                   <span className="block w-7 h-2.5 bg-purple-500 "></span>
                   <span className="block w-7 h-2.5 bg-cyan-300 "></span>
                   <span className="block w-7 h-2.5 bg-pink-400 rounded-tr-xl rounded-br-xl"></span>
                 </div>
-              {/* Project rating column - show average */}
+
-              <div className="flex justify-center items-center gap-2">
+                <div className="flex flex-row gap-2">
-                <div className="text-base text-gray-400 mb-1">
+                  <div className="text-base text-gray-400 mb-1">میانگین :‌</div>
-                  میانگین امتیاز :‌
-                </div>
                   <div className="font-bold">
                     {formatNumber(((avarage ?? 0) as number).toFixed?.(1) ?? 0)}
                   </div>
                 </div>
               </div>
             </div>
+          </div>
         </Card>
       </div>
 

app/components/ui/custom-bar-chart.tsx

@@ -70,7 +70,7 @@ export function CustomBarChart({
     <div className={`space-y-6 ${className}`} style={{ height }}>
       <div className="border-b">
         {title && (
-          <h3 className="text-xl font-bold text-white font-persian text-right p-4">
+          <h3 className="text-lg font-bold text-white font-persian text-right p-4">
             {title}
           </h3>
         )}