diff --git a/package-lock.json b/package-lock.json index e801e52..976b144 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11,6 +11,7 @@ "next": "15.0.3", "react": "19.0.0-rc-66855b96-20241106", "react-dom": "19.0.0-rc-66855b96-20241106", + "react-icons": "^5.5.0", "tailwind-merge": "^2.3.0", "tailwindcss-animate": "^1.0.7" }, @@ -1701,6 +1702,15 @@ "react": "19.0.0-rc-66855b96-20241106" } }, + "node_modules/react-icons": { + "version": "5.5.0", + "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-5.5.0.tgz", + "integrity": "sha512-MEFcXdkP3dLo8uumGI5xN3lDFNsRtrjbOEKDLD7yv76v4wpnEq2Lt2qeHaQOr34I/wPN3s3+N08WkQ+CW37Xiw==", + "license": "MIT", + "peerDependencies": { + "react": "*" + } + }, "node_modules/read-cache": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz", diff --git a/package.json b/package.json index b2efd97..3dbfa7f 100644 --- a/package.json +++ b/package.json @@ -9,18 +9,19 @@ "lint": "next lint" }, "dependencies": { + "next": "15.0.3", "react": "19.0.0-rc-66855b96-20241106", "react-dom": "19.0.0-rc-66855b96-20241106", - "next": "15.0.3", + "react-icons": "^5.5.0", "tailwind-merge": "^2.3.0", "tailwindcss-animate": "^1.0.7" }, "devDependencies": { - "typescript": "^5", "@types/node": "^20", "@types/react": "^18", "@types/react-dom": "^18", "postcss": "^8", - "tailwindcss": "^3.4.1" + "tailwindcss": "^3.4.1", + "typescript": "^5" } } diff --git a/src/app/(root)/(dashboard)/_components/overview.tsx b/src/app/(root)/(dashboard)/_components/overview.tsx new file mode 100644 index 0000000..70dc135 --- /dev/null +++ b/src/app/(root)/(dashboard)/_components/overview.tsx @@ -0,0 +1,53 @@ +import React from 'react'; +import { useRouter } from 'next/navigation'; +import { FaUserGraduate, FaBook, FaChartBar } from 'react-icons/fa'; +type Props = { + name: String; + activity: String; + attendance: String; + performance: String; + route: String; +}; + +function overview({ name, activity, attendance, performance, route }: Props) { + const router = useRouter(); + + return ( +
+ {/* Students Overview */} +

{name} Overview

+
+

+ {' '} + Total {name}: 2284 +

+

+ {' '} + Active {activity}:{' '} + 84 +

+

+ {attendance}:{' '} + 98% +

+

+ {' '} + {performance}:{' '} + 9.0/10 +

+
+ +
+ ); +} + +export default overview; diff --git a/src/app/(root)/(dashboard)/batches/[batchId]/students/[studentId]/page.tsx b/src/app/(root)/(dashboard)/batches/[batchId]/students/[studentId]/page.tsx new file mode 100644 index 0000000..46260f5 --- /dev/null +++ b/src/app/(root)/(dashboard)/batches/[batchId]/students/[studentId]/page.tsx @@ -0,0 +1,86 @@ +'use client'; +import { useState } from 'react'; + +const students = [ + { name: 'Abhinav Mishra', class: 11, level: 'excellent' }, + { name: 'Abhinav Mishra', class: 11, level: 'optimal' }, + { name: 'Abhinav Mishra', class: 11, level: 'inefficient' }, + { name: 'Abhinav Mishra', class: 11, level: 'excellent' }, + { name: 'Abhinav Mishra', class: 11, level: 'optimal' }, + { name: 'Abhinav Mishra', class: 11, level: 'inefficient' }, + { name: 'Abhinav Mishra', class: 11, level: 'excellent' }, + { name: 'Abhinav Mishra', class: 11, level: 'optimal' }, + { name: 'Abhinav Mishra', class: 11, level: 'inefficient' }, +]; + +const levelColors = { + excellent: 'bg-green-200 border-green-400', + optimal: 'bg-yellow-200 border-yellow-400', + inefficient: 'bg-red-200 border-red-400', +}; + +const progressColors = { + excellent: 'bg-green-500 w-3/4', + optimal: 'bg-yellow-500 w-2/4', + inefficient: 'bg-red-500 w-1/4', +}; + +export default function StudentsInfo() { + const [filter, setFilter] = useState('all'); + + const filteredStudents = + filter === 'all' ? students : students.filter((s) => s.level === filter); + + return ( +
+

Students Info

+ + +
+ {['all', 'excellent', 'optimal', 'inefficient'].map((level) => ( + + ))} +
+ +
+ {filteredStudents.map((student, index) => ( +
+ + 😎 + +
+

{student.name}

+

Class: {student.class}

+

Level:

+
+
+
+
+
+ ))} +
+
+ ); +} diff --git a/src/app/(root)/(dashboard)/batches/_components/batchCard.tsx b/src/app/(root)/(dashboard)/batches/_components/batchCard.tsx new file mode 100644 index 0000000..bb34197 --- /dev/null +++ b/src/app/(root)/(dashboard)/batches/_components/batchCard.tsx @@ -0,0 +1,56 @@ +import React from 'react'; + +import { useRouter } from 'next/navigation'; + +type Props = { + batch: String; + index: number; +}; + +function batchCard({ batch, index }: Props) { + const router = useRouter(); + + return ( +
+
+
+ {batch.charAt(0)} +
+

{batch}

+ + Active + +
+

+ Subject: Mathematics, + Chemistry, Physics +

+

+ Total Students: 120/180 +

+
+
+
+

- By Dr. Sarah Wilson

+ +
+ ); +} + +export default batchCard; diff --git a/src/app/(root)/(dashboard)/batches/page.tsx b/src/app/(root)/(dashboard)/batches/page.tsx new file mode 100644 index 0000000..d81153c --- /dev/null +++ b/src/app/(root)/(dashboard)/batches/page.tsx @@ -0,0 +1,43 @@ +'use client'; + +import Image from 'next/image'; +import { useRouter } from 'next/navigation'; +import BatchCard from './_components/batchCard'; + +export default function StudentBatches() { + const router = useRouter(); + + return ( +
+
+

Student Batches of Institute

+
+ + + +
+ + {['11th standard', '12th standard'].map((standard, index) => ( +
+

{standard}

+
+ {['Omega', 'Sigma', 'Omega'].map((batch, index) => ( + + ))} +
+ +
+ ))} +
+
+ ); +} diff --git a/src/app/(root)/(dashboard)/icon.svg b/src/app/(root)/(dashboard)/icon.svg new file mode 100644 index 0000000..0b81b07 --- /dev/null +++ b/src/app/(root)/(dashboard)/icon.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + + + diff --git a/src/app/(root)/(dashboard)/page.tsx b/src/app/(root)/(dashboard)/page.tsx index 75a3155..c07d825 100644 --- a/src/app/(root)/(dashboard)/page.tsx +++ b/src/app/(root)/(dashboard)/page.tsx @@ -1,7 +1,96 @@ -import Image from "next/image"; +'use client'; + +import React from 'react'; +import { useRouter } from 'next/navigation'; +import { + FaUserGraduate, + FaBook, + FaChartBar, + FaUniversity, + FaPhoneAlt, + FaEnvelope, + FaPen, +} from 'react-icons/fa'; +import { FaPencil } from 'react-icons/fa6'; +import Overview from './_components/overview'; + +const InstituteDashboard = () => { + const router = useRouter(); -export default function Home() { return ( - <>Home +
+ {/* Header Section */} +
+

+ Institute Overview & Management +

+ +
+ + {/* Institute Details */} +
+ Institute Logo +
+

Established in 2001

+

+ Chaitanya Bharathi Institute +

+

+ Institute Code: 21XYZ1234 +

+
+ +
+

+

+ {' '} + Address: +
+ 123, Main Street, City, Country +

+

+

+ Contact:{' '} +
+ +1234567890 +

+

+

+ Email:{' '} +
+ info@institute.com +

+
+
+ + {/* Overview Section */} +
+ {/* Students Overview */} + + + {/* Teachers Overview */} + +
+
); -} +}; + +export default InstituteDashboard; diff --git a/src/app/(root)/(dashboard)/teachers/page.tsx b/src/app/(root)/(dashboard)/teachers/page.tsx new file mode 100644 index 0000000..b8f9006 --- /dev/null +++ b/src/app/(root)/(dashboard)/teachers/page.tsx @@ -0,0 +1,7 @@ +import React from 'react'; + +function page() { + return
Teacher page
; +} + +export default page;