feat: start innvoation-built-in page
This commit is contained in:
MehrdadAdabi
parent
957b05cdbd
commit
8df1fbc422
|
|
@ -41,8 +41,7 @@ import {
|
|||
UsersIcon,
|
||||
UserIcon,
|
||||
RefreshCw,
|
||||
Radar,
|
||||
Cog,
|
||||
|
||||
ChevronUp,
|
||||
ChevronDown,
|
||||
} from "lucide-react";
|
||||
|
|
@ -268,7 +267,7 @@ export function GreenInnovationPage() {
|
|||
try {
|
||||
fetchingRef.current = true;
|
||||
if (reset) {
|
||||
|
||||
|
||||
setCurrentPage(1);
|
||||
} else {
|
||||
setLoadingMore(true);
|
||||
|
|
@ -395,9 +394,9 @@ export function GreenInnovationPage() {
|
|||
};
|
||||
}, [loadMore, hasMore, loadingMore]);
|
||||
|
||||
useEffect(()=>{
|
||||
setLoading(true);
|
||||
},[])
|
||||
useEffect(() => {
|
||||
setLoading(true);
|
||||
}, [])
|
||||
const handleSort = (field: string) => {
|
||||
fetchingRef.current = false;
|
||||
setSortConfig((prev) => ({
|
||||
|
|
@ -453,7 +452,7 @@ export function GreenInnovationPage() {
|
|||
if (typeof payload === "string") {
|
||||
try {
|
||||
payload = JSON.parse(payload);
|
||||
} catch {}
|
||||
} catch { }
|
||||
}
|
||||
const parseNum = (v: unknown): any => {
|
||||
if (v == null) return 0;
|
||||
|
|
@ -687,68 +686,68 @@ export function GreenInnovationPage() {
|
|||
<div className="flex flex-col justify-between w-1/2">
|
||||
{loading || statsLoading
|
||||
? // Loading skeleton for stats cards - matching new design
|
||||
Array.from({ length: 2 }).map((_, index) => (
|
||||
<Card
|
||||
key={`skeleton-${index}`}
|
||||
className="bg-[linear-gradient(to_bottom_left,#464861,50%,#111628)] backdrop-blur-sm rounded-lg overflow-hidden"
|
||||
>
|
||||
<CardContent className="p-0 h-[11.5rem]">
|
||||
<div className="flex flex-col gap-2 h-full">
|
||||
<div className="border-b-2 border-gray-500/20 p-2.5">
|
||||
<div
|
||||
className="h-6 bg-gray-600 rounded animate-pulse"
|
||||
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>
|
||||
Array.from({ length: 2 }).map((_, index) => (
|
||||
<Card
|
||||
key={`skeleton-${index}`}
|
||||
className="bg-[linear-gradient(to_bottom_left,#464861,50%,#111628)] backdrop-blur-sm rounded-lg overflow-hidden"
|
||||
>
|
||||
<CardContent className="p-0 h-[11.5rem]">
|
||||
<div className="flex flex-col gap-2 h-full">
|
||||
<div className="border-b-2 border-gray-500/20 p-2.5">
|
||||
<div
|
||||
className="h-6 bg-gray-600 rounded animate-pulse"
|
||||
style={{ width: "60%" }}
|
||||
/>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
))
|
||||
<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>
|
||||
</CardContent>
|
||||
</Card>
|
||||
))
|
||||
: Object.entries(sustainabilityStats).map(([key, value]) => (
|
||||
<Card
|
||||
key={key}
|
||||
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">
|
||||
<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 ">
|
||||
<h3 className="text-lg font-bold text-white font-persian p-4">
|
||||
{value.title}
|
||||
</h3>
|
||||
<Card
|
||||
key={key}
|
||||
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">
|
||||
<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 ">
|
||||
<h3 className="text-lg font-bold text-white font-persian p-4">
|
||||
{value.title}
|
||||
</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 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>
|
||||
<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>
|
||||
<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>
|
||||
</CardContent>
|
||||
</Card>
|
||||
))}
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{/* Process Impacts Chart */}
|
||||
|
|
@ -910,20 +909,20 @@ export function GreenInnovationPage() {
|
|||
<div className={"flex flex-col gap-3 p-4overflow-y-hidden p-4"}>
|
||||
{statsLoading
|
||||
? Array.from({ length: 10 }).map((_, index) => (
|
||||
<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-3 w-32 bg-gray-500/40 rounded animate-pulse"></span>
|
||||
</div>
|
||||
))
|
||||
<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-3 w-32 bg-gray-500/40 rounded animate-pulse"></span>
|
||||
</div>
|
||||
))
|
||||
: Array.from({ length: 4 }).map((_, index) => (
|
||||
<div key={`${index}-1`} className="flex gap-2">
|
||||
<LoaderCircle
|
||||
size={"18px"}
|
||||
className="text-emerald-400"
|
||||
/>
|
||||
<span>استاندارد Iso 2005</span>
|
||||
</div>
|
||||
))}
|
||||
<div key={`${index}-1`} className="flex gap-2">
|
||||
<LoaderCircle
|
||||
size={"18px"}
|
||||
className="text-emerald-400"
|
||||
/>
|
||||
<span>استاندارد Iso 2005</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
|
@ -1118,9 +1117,9 @@ export function GreenInnovationPage() {
|
|||
<span className="text-white font-bold font-persian">
|
||||
{selectedProjectDetails?.start_date
|
||||
? moment(
|
||||
selectedProjectDetails?.start_date,
|
||||
"YYYY-MM-DD"
|
||||
).format("YYYY/MM/DD")
|
||||
selectedProjectDetails?.start_date,
|
||||
"YYYY-MM-DD"
|
||||
).format("YYYY/MM/DD")
|
||||
: "-"}
|
||||
</span>
|
||||
</div>
|
||||
|
|
@ -1133,9 +1132,9 @@ export function GreenInnovationPage() {
|
|||
<span className="text-white font-bold font-persian">
|
||||
{selectedProjectDetails?.done_date
|
||||
? moment(
|
||||
selectedProjectDetails?.done_date,
|
||||
"YYYY-MM-DD"
|
||||
).format("YYYY/MM/DD")
|
||||
selectedProjectDetails?.done_date,
|
||||
"YYYY-MM-DD"
|
||||
).format("YYYY/MM/DD")
|
||||
: "-"}
|
||||
</span>
|
||||
</div>
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -6,15 +6,19 @@ export default [
|
|||
route("dashboard/project-management", "routes/project-management.tsx"),
|
||||
route(
|
||||
"dashboard/innovation-basket/process-innovation",
|
||||
"routes/innovation-basket.process-innovation.tsx",
|
||||
"routes/innovation-basket.process-innovation.tsx"
|
||||
),
|
||||
route(
|
||||
"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(
|
||||
"/dashboard/innovation-basket/digital-innovation",
|
||||
"routes/digital-innovation-page.tsx",
|
||||
"routes/digital-innovation-page.tsx"
|
||||
),
|
||||
route("dashboard/ecosystem", "routes/ecosystem.tsx"),
|
||||
route("404", "routes/404.tsx"),
|
||||
|
|
|
|||
17
app/routes/innovation-built-insider-page.tsx
Normal file
17
app/routes/innovation-built-insider-page.tsx
Normal 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>
|
||||
);
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user