fixx:designed bugs

This commit is contained in:
mehrdad_adabi 2025-09-09 20:27:30 +03:30
parent 17b738dbf3
commit d240fb39fa
4 changed files with 102 additions and 31 deletions

View File

@ -618,18 +618,18 @@ export function DigitalInnovationPage() {
return ( return (
<DashboardLayout title="نوآوری دیجیتال"> <DashboardLayout title="نوآوری دیجیتال">
<div className="grid grid-cols-2 gap-8 justify-between p-6 space-y-4 h-full"> <div className="p-6 space-y-4 grid justify-between gap-8 sm:grid-cols-1 xl:grid-cols-[40%_60%]">
{/* Stats Cards */} {/* Stats Cards */}
<div className="flex flex-col gap-6 w-full mb-0"> <div className="flex flex-col gap-6 w-full mb-0">
<div className="space-y-6 w-full"> <div className="space-y-6 w-full">
{/* Stats Grid */} {/* Stats Grid */}
<div className="grid grid-cols-2 gap-5"> <div className="grid grid-cols-2 gap-5">
{loading || statsLoading {loading
? // Loading skeleton for stats cards - matching new design ? // Loading skeleton for stats cards - matching new design
Array.from({ length: 4 }).map((_, index) => ( Array.from({ length: 4 }).map((_, index) => (
<Card <Card
key={`skeleton-${index}`} key={`skeleton-${index}`}
className="bg-[linear-gradient(to_bottom_left,#464861,50%,#111628)] backdrop-blur-sm rounded-2xl overflow-hidden" className="bg-[linear-gradient(to_bottom_left,#464861,50%,#111628)] backdrop-blur-sm rounded-2xl overflow-hidden !h-full"
> >
<CardContent className="p-0"> <CardContent className="p-0">
<div className="flex flex-col justify-between gap-2"> <div className="flex flex-col justify-between gap-2">
@ -691,7 +691,7 @@ export function DigitalInnovationPage() {
</div> </div>
{/* Process Impacts Chart */} {/* Process Impacts Chart */}
<Card className="bg-[linear-gradient(to_bottom_left,#464861,50%,#111628)] backdrop-blur-sm rounded-lg w-full overflow-hidden"> <Card className="bg-[linear-gradient(to_bottom_left,#464861,50%,#111628)] backdrop-blur-sm rounded-lg w-full overflow-hidden h-full ">
{/* <CardContent > */} {/* <CardContent > */}
<CustomBarChart <CustomBarChart
title="تاثیرات نوآوری دیجیتال به صورت درصد مقایسه ای" title="تاثیرات نوآوری دیجیتال به صورت درصد مقایسه ای"
@ -847,7 +847,40 @@ export function DigitalInnovationPage() {
</CardContent> </CardContent>
{/* Footer */} {/* Footer */}
<div className="p-2 px-4 bg-gray-700/50"> <div className="p-2 px-4 bg-gray-700/50">
<div className="grid grid-cols-[minmax(100px,0fr)_minmax(80px,1fr)_minmax(100px,2fr)_minmax(10px,1fr)_minmax(100px,1fr)] text-sm text-gray-300 font-persian items-center ">
<div></div>
<div className="text-center text-gray-400 ">
کل پروژهها:{" "}
<span className="font-bold">
{formatNumber(actualTotalCount)}
</span>
</div>
<div className="flex flex-row-reverse">
<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>
<div className="text-center text-gray-400 py-2">
میانگین:{" "}
<span className="font-bold">
{formatNumber(
((stats.avarageProjectScore ?? 0) as number).toFixed?.(1) ??
0
)}
</span>
</div>
<div></div>
</div>
</div>
{/* <div className="p-2 px-4 bg-gray-700/50">
<div className="flex flex-row gap-4 text-sm text-gray-300 font-persian justify-between"> <div className="flex flex-row gap-4 text-sm text-gray-300 font-persian justify-between">
<div className="text-center gap-2 items-center w-1/3 pr-16"> <div className="text-center gap-2 items-center w-1/3 pr-16">
<div className="text-base text-gray-401 mb-1"> <div className="text-base text-gray-401 mb-1">
@ -874,7 +907,7 @@ export function DigitalInnovationPage() {
</div> </div>
</div> </div>
</div> </div>
</div> </div> */}
</Card> </Card>
</div> </div>

View File

@ -691,8 +691,8 @@ export function GreenInnovationPage() {
<DashboardLayout title="نوآوری سبز"> <DashboardLayout title="نوآوری سبز">
<div className="p-6 space-y-4 h-[23.5rem]"> <div className="p-6 space-y-4 h-[23.5rem]">
{/* Stats Cards */} {/* Stats Cards */}
<div className="flex gap-6 mb-5"> <div className="flex gap-6 mb-5 md:flex-col xl:flex-row">
<div className="flex flex-col justify-between w-1/2"> <div className="flex flex-col justify-between xl:w-1/2 sm:w-full sm:gap-2">
{loading || statsLoading {loading || statsLoading
? // Loading skeleton for stats cards - matching new design ? // Loading skeleton for stats cards - matching new design
Array.from({ length: 2 }).map((_, index) => ( Array.from({ length: 2 }).map((_, index) => (
@ -949,7 +949,7 @@ export function GreenInnovationPage() {
<Card className="bg-transparent backdrop-blur-sm rounded-lg overflow-hidden"> <Card className="bg-transparent backdrop-blur-sm rounded-lg overflow-hidden">
<CardContent className="p-0"> <CardContent className="p-0">
<div className="relative"> <div className="relative">
<Table containerClassName="overflow-auto custom-scrollbar max-h-[calc(90vh-400px)]"> <Table containerClassName="overflow-auto custom-scrollbar h-[25rem]">
<TableHeader> <TableHeader>
<TableRow className="bg-[#3F415A]"> <TableRow className="bg-[#3F415A]">
{columns.map((column) => ( {columns.map((column) => (
@ -1051,14 +1051,14 @@ export function GreenInnovationPage() {
</CardContent> </CardContent>
<div className="p-2 px-4 bg-gray-700/50"> <div className="p-2 px-4 bg-gray-700/50">
<div className="flex flex-row gap-4 text-sm text-gray-300 font-persian justify-between"> <div className="grid grid-cols-[41%_41%] text-sm text-gray-300 font-persian justify-between">
<div className="text-center gap-2 items-center w-1/3 pr-36"> <div className="text-center gap-2 items-center">
<div className="text-base text-gray-401 mb-1"> <div className="text-base text-gray-401 mr-10">
کل پروژه ها :{formatNumber(actualTotalCount)} کل پروژه ها :{formatNumber(actualTotalCount)}
</div> </div>
</div> </div>
<div className="flex items-center flex-row gap-20 status justify-center w-2/3"> <div className="flex items-center flex-row status justify-between w-[calc(40%-5px)]">
<div className="flex flex-row-reverse"> <div className="flex flex-row-reverse">
<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-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-purple-500 "></span>

View File

@ -710,9 +710,9 @@ export function InnovationBuiltInsidePage() {
return ( return (
<DashboardLayout title="نوآوری ساخت داخل"> <DashboardLayout title="نوآوری ساخت داخل">
<div className="p-6 space-y-4 flex justify-between gap-8 sm:flex-col xl:flex-row"> <div className="p-6 space-y-4 justify-between gap-8 grid sm:grid-cols-1 xl:grid-cols-[40%_60%]">
{/* Stats Cards */} {/* Stats Cards */}
<div className="flex gap-6 w-full"> <div className="flex gap-6 w-full mb-0">
<div className="flex flex-col justify-between w-full gap-6"> <div className="flex flex-col justify-between w-full gap-6">
{statsLoading {statsLoading
? // Loading skeleton for stats cards - matching new design ? // Loading skeleton for stats cards - matching new design
@ -978,6 +978,37 @@ export function InnovationBuiltInsidePage() {
</CardContent> </CardContent>
<div className="p-2 px-4 bg-gray-700/50"> <div className="p-2 px-4 bg-gray-700/50">
<div className="grid grid-cols-[minmax(100px,1fr)_minmax(80px,1fr)_minmax(100px,2fr)_minmax(10px,1fr)_minmax(100px,1fr)] text-sm text-gray-300 font-persian items-center ">
<div></div>
<div className="text-right text-gray-400 mr-6">
کل پروژهها:{" "}
<span className="font-bold">
{formatNumber(actualTotalCount)}
</span>
</div>
<div className="flex flex-row-reverse">
<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>
<div className="text-center text-gray-400 py-2">
میانگین:{" "}
<span className="font-bold">
{formatNumber(
((tblAvarage ?? 0) as number).toFixed?.(1) ?? 0
)}
</span>
</div>
<div></div>
</div>
</div>
{/* <div className="p-2 px-4 bg-gray-700/50">
<div className="flex gap-4 text-sm text-gray-300 font-persian justify-between sm:flex-col xl:flex-row"> <div className="flex gap-4 text-sm text-gray-300 font-persian justify-between sm:flex-col xl:flex-row">
<div className="text-center items-center xl:w-full pr-6 sm:w-full"> <div className="text-center items-center xl:w-full pr-6 sm:w-full">
<div className="text-base text-gray-401 mb-1"> <div className="text-base text-gray-401 mb-1">
@ -1002,7 +1033,7 @@ export function InnovationBuiltInsidePage() {
</div> </div>
</div> </div>
</div> </div>
</div> </div> */}
</Card> </Card>
</div> </div>

View File

@ -1,6 +1,6 @@
import * as React from "react" import * as React from "react";
import { cn } from "~/lib/utils" import { cn } from "~/lib/utils";
const Card = React.forwardRef< const Card = React.forwardRef<
HTMLDivElement, HTMLDivElement,
@ -9,13 +9,13 @@ const Card = React.forwardRef<
<div <div
ref={ref} ref={ref}
className={cn( className={cn(
"rounded-lg border bg-card text-card-foreground shadow-sm", "rounded-lg border bg-card text-card-foreground shadow-sm ",
className className
)} )}
{...props} {...props}
/> />
)) ));
Card.displayName = "Card" Card.displayName = "Card";
const CardHeader = React.forwardRef< const CardHeader = React.forwardRef<
HTMLDivElement, HTMLDivElement,
@ -26,8 +26,8 @@ const CardHeader = React.forwardRef<
className={cn("flex flex-col space-y-1.5 p-6", className)} className={cn("flex flex-col space-y-1.5 p-6", className)}
{...props} {...props}
/> />
)) ));
CardHeader.displayName = "CardHeader" CardHeader.displayName = "CardHeader";
const CardTitle = React.forwardRef< const CardTitle = React.forwardRef<
HTMLParagraphElement, HTMLParagraphElement,
@ -41,8 +41,8 @@ const CardTitle = React.forwardRef<
)} )}
{...props} {...props}
/> />
)) ));
CardTitle.displayName = "CardTitle" CardTitle.displayName = "CardTitle";
const CardDescription = React.forwardRef< const CardDescription = React.forwardRef<
HTMLParagraphElement, HTMLParagraphElement,
@ -53,16 +53,16 @@ const CardDescription = React.forwardRef<
className={cn("text-sm text-muted-foreground", className)} className={cn("text-sm text-muted-foreground", className)}
{...props} {...props}
/> />
)) ));
CardDescription.displayName = "CardDescription" CardDescription.displayName = "CardDescription";
const CardContent = React.forwardRef< const CardContent = React.forwardRef<
HTMLDivElement, HTMLDivElement,
React.HTMLAttributes<HTMLDivElement> React.HTMLAttributes<HTMLDivElement>
>(({ className, ...props }, ref) => ( >(({ className, ...props }, ref) => (
<div ref={ref} className={cn("p-6 pt-0", className)} {...props} /> <div ref={ref} className={cn("p-6 pt-0", className)} {...props} />
)) ));
CardContent.displayName = "CardContent" CardContent.displayName = "CardContent";
const CardFooter = React.forwardRef< const CardFooter = React.forwardRef<
HTMLDivElement, HTMLDivElement,
@ -73,7 +73,14 @@ const CardFooter = React.forwardRef<
className={cn("flex items-center p-6 pt-0", className)} className={cn("flex items-center p-6 pt-0", className)}
{...props} {...props}
/> />
)) ));
CardFooter.displayName = "CardFooter" CardFooter.displayName = "CardFooter";
export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent } export {
Card,
CardContent,
CardDescription,
CardFooter,
CardHeader,
CardTitle,
};