feat: start innvoation-built-in page
This commit is contained in:
parent
957b05cdbd
commit
8df1fbc422
|
|
@ -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
|
|
@ -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"),
|
||||||
|
|
|
||||||
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