feat: start innvoation-built-in page

This commit is contained in:
MehrdadAdabi 2025-09-02 18:55:30 +03:30
parent 957b05cdbd
commit 8df1fbc422
4 changed files with 1164 additions and 86 deletions

View File

@ -41,8 +41,7 @@ import {
UsersIcon, UsersIcon,
UserIcon, UserIcon,
RefreshCw, RefreshCw,
Radar,
Cog,
ChevronUp, ChevronUp,
ChevronDown, ChevronDown,
} from "lucide-react"; } from "lucide-react";
@ -268,7 +267,7 @@ export function GreenInnovationPage() {
try { try {
fetchingRef.current = true; fetchingRef.current = true;
if (reset) { if (reset) {
setCurrentPage(1); setCurrentPage(1);
} else { } else {
setLoadingMore(true); setLoadingMore(true);
@ -395,9 +394,9 @@ export function GreenInnovationPage() {
}; };
}, [loadMore, hasMore, loadingMore]); }, [loadMore, hasMore, loadingMore]);
useEffect(()=>{ useEffect(() => {
setLoading(true); setLoading(true);
},[]) }, [])
const handleSort = (field: string) => { const handleSort = (field: string) => {
fetchingRef.current = false; fetchingRef.current = false;
setSortConfig((prev) => ({ setSortConfig((prev) => ({
@ -453,7 +452,7 @@ export function GreenInnovationPage() {
if (typeof payload === "string") { if (typeof payload === "string") {
try { try {
payload = JSON.parse(payload); payload = JSON.parse(payload);
} catch {} } catch { }
} }
const parseNum = (v: unknown): any => { const parseNum = (v: unknown): any => {
if (v == null) return 0; if (v == null) return 0;
@ -687,68 +686,68 @@ export function GreenInnovationPage() {
<div className="flex flex-col justify-between w-1/2"> <div className="flex flex-col justify-between w-1/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) => (
<Card <Card
key={`skeleton-${index}`} key={`skeleton-${index}`}
className="bg-[linear-gradient(to_bottom_left,#464861,50%,#111628)] backdrop-blur-sm rounded-lg overflow-hidden" className="bg-[linear-gradient(to_bottom_left,#464861,50%,#111628)] backdrop-blur-sm rounded-lg overflow-hidden"
> >
<CardContent className="p-0 h-[11.5rem]"> <CardContent className="p-0 h-[11.5rem]">
<div className="flex flex-col gap-2 h-full"> <div className="flex flex-col gap-2 h-full">
<div className="border-b-2 border-gray-500/20 p-2.5"> <div className="border-b-2 border-gray-500/20 p-2.5">
<div <div
className="h-6 bg-gray-600 rounded animate-pulse" className="h-6 bg-gray-600 rounded animate-pulse"
style={{ width: "60%" }} style={{ width: "60%" }}
/> />
</div>
<div className="flex items-center justify-center flex-col p-2.5 mt-4">
<div
className="h-8 bg-gray-600 rounded mb-1 animate-pulse"
style={{ width: "40%" }}
/>
<div
className="h-4 bg-gray-600 rounded animate-pulse"
style={{ width: "80%" }}
/>
</div>
</div> </div>
</CardContent> <div className="flex items-center justify-center flex-col p-2.5 mt-4">
</Card> <div
)) className="h-8 bg-gray-600 rounded mb-1 animate-pulse"
style={{ width: "40%" }}
/>
<div
className="h-4 bg-gray-600 rounded animate-pulse"
style={{ width: "80%" }}
/>
</div>
</div>
</CardContent>
</Card>
))
: Object.entries(sustainabilityStats).map(([key, value]) => ( : Object.entries(sustainabilityStats).map(([key, value]) => (
<Card <Card
key={key} key={key}
className="bg-[linear-gradient(to_bottom_left,#464861,50%,#111628)] rounded-lg backdrop-blur-sm border-gray-700/50" className="bg-[linear-gradient(to_bottom_left,#464861,50%,#111628)] rounded-lg backdrop-blur-sm border-gray-700/50"
> >
<CardContent className="p-0 h-full"> <CardContent className="p-0 h-full">
<div className="flex flex-col justify-between gap-2 h-full"> <div className="flex flex-col justify-between gap-2 h-full">
<div className="flex justify-between items-center border-b-2 border-gray-500/20 "> <div className="flex justify-between items-center border-b-2 border-gray-500/20 ">
<h3 className="text-lg font-bold text-white font-persian p-4"> <h3 className="text-lg font-bold text-white font-persian p-4">
{value.title} {value.title}
</h3> </h3>
</div>
<div className="flex items-center justify-between p-6 flex-row-reverse">
<div className="flex flex-col">
<span className="text-3xl font-bold text-emerald-400 mb-1 font-persian">
% {value.percent?.value}
</span>
<span className="text-sm text-gray-400 font-persian">
{value.percent?.description}
</span>
</div> </div>
<div className="flex items-center justify-between p-6 flex-row-reverse"> <b className="block w-0.5 h-8 bg-gray-600 rotate-45" />
<div className="flex flex-col"> <div className="flex flex-col">
<span className="text-3xl font-bold text-emerald-400 mb-1 font-persian"> <span className="text-3xl font-bold text-emerald-400 mb-1 font-persian">
% {value.percent?.value} {value.total?.value}
</span> </span>
<span className="text-sm text-gray-400 font-persian"> <span className="text-sm text-gray-400 font-persian">
{value.percent?.description} {value.total?.description}
</span> </span>
</div>
<b className="block w-0.5 h-8 bg-gray-600 rotate-45" />
<div className="flex flex-col">
<span className="text-3xl font-bold text-emerald-400 mb-1 font-persian">
{value.total?.value}
</span>
<span className="text-sm text-gray-400 font-persian">
{value.total?.description}
</span>
</div>
</div> </div>
</div> </div>
</CardContent> </div>
</Card> </CardContent>
))} </Card>
))}
</div> </div>
{/* Process Impacts Chart */} {/* Process Impacts Chart */}
@ -910,20 +909,20 @@ export function GreenInnovationPage() {
<div className={"flex flex-col gap-3 p-4overflow-y-hidden p-4"}> <div className={"flex flex-col gap-3 p-4overflow-y-hidden p-4"}>
{statsLoading {statsLoading
? Array.from({ length: 10 }).map((_, index) => ( ? Array.from({ length: 10 }).map((_, index) => (
<div key={index} className="flex gap-2 items-center"> <div key={index} className="flex gap-2 items-center">
<span className="h-4 w-4 bg-gray-500/40 rounded-full animate-pulse"></span> <span className="h-4 w-4 bg-gray-500/40 rounded-full animate-pulse"></span>
<span className="h-3 w-32 bg-gray-500/40 rounded animate-pulse"></span> <span className="h-3 w-32 bg-gray-500/40 rounded animate-pulse"></span>
</div> </div>
)) ))
: Array.from({ length: 4 }).map((_, index) => ( : Array.from({ length: 4 }).map((_, index) => (
<div key={`${index}-1`} className="flex gap-2"> <div key={`${index}-1`} className="flex gap-2">
<LoaderCircle <LoaderCircle
size={"18px"} size={"18px"}
className="text-emerald-400" className="text-emerald-400"
/> />
<span>استاندارد Iso 2005</span> <span>استاندارد Iso 2005</span>
</div> </div>
))} ))}
</div> </div>
</CardContent> </CardContent>
</Card> </Card>
@ -1118,9 +1117,9 @@ export function GreenInnovationPage() {
<span className="text-white font-bold font-persian"> <span className="text-white font-bold font-persian">
{selectedProjectDetails?.start_date {selectedProjectDetails?.start_date
? moment( ? moment(
selectedProjectDetails?.start_date, selectedProjectDetails?.start_date,
"YYYY-MM-DD" "YYYY-MM-DD"
).format("YYYY/MM/DD") ).format("YYYY/MM/DD")
: "-"} : "-"}
</span> </span>
</div> </div>
@ -1133,9 +1132,9 @@ export function GreenInnovationPage() {
<span className="text-white font-bold font-persian"> <span className="text-white font-bold font-persian">
{selectedProjectDetails?.done_date {selectedProjectDetails?.done_date
? moment( ? moment(
selectedProjectDetails?.done_date, selectedProjectDetails?.done_date,
"YYYY-MM-DD" "YYYY-MM-DD"
).format("YYYY/MM/DD") ).format("YYYY/MM/DD")
: "-"} : "-"}
</span> </span>
</div> </div>

File diff suppressed because it is too large Load Diff

View File

@ -6,15 +6,19 @@ export default [
route("dashboard/project-management", "routes/project-management.tsx"), route("dashboard/project-management", "routes/project-management.tsx"),
route( route(
"dashboard/innovation-basket/process-innovation", "dashboard/innovation-basket/process-innovation",
"routes/innovation-basket.process-innovation.tsx", "routes/innovation-basket.process-innovation.tsx"
), ),
route( route(
"dashboard/innovation-basket/green-innovation", "dashboard/innovation-basket/green-innovation",
"routes/green-innovation.tsx", "routes/green-innovation.tsx"
),
route(
"/dashboard/innovation-basket/internal-innovation",
"routes/innovation-built-insider-page.tsx"
), ),
route( route(
"/dashboard/innovation-basket/digital-innovation", "/dashboard/innovation-basket/digital-innovation",
"routes/digital-innovation-page.tsx", "routes/digital-innovation-page.tsx"
), ),
route("dashboard/ecosystem", "routes/ecosystem.tsx"), route("dashboard/ecosystem", "routes/ecosystem.tsx"),
route("404", "routes/404.tsx"), route("404", "routes/404.tsx"),

View File

@ -0,0 +1,17 @@
import { ProtectedRoute } from "~/components/auth/protected-route";
import InnovationBuiltInsidePage from "~/components/dashboard/project-management/innovation-built-inside-page";
export function meta() {
return [
{ title: "نوآوری در فرآیند - سیستم مدیریت فناوری و نوآوری" },
{ name: "description", content: "مدیریت پروژه‌های نوآوری در فرآیند" },
];
}
export default function InnovationBuiltInside() {
return (
<ProtectedRoute requireAuth={true}>
<InnovationBuiltInsidePage />
</ProtectedRoute>
);
}