Skip to content

Commit 48de5a4

Browse files
UdithaWijethungaUdithaWijethunga
authored
Merge pull request #88 from RUBA-Labs/Uditha_Wijethunga_Dev
Uditha wijethunga dev
2 parents 9afd843 + f761481 commit 48de5a4

7 files changed

Lines changed: 495 additions & 55 deletions

File tree

‎src/app/(main)/(dashboard)/(pages)/academic/TabContents/AcademicTimetable.tsx‎

Lines changed: 139 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,139 @@
1+
"use client";
2+
import { useState } from "react";
3+
import { Button } from "@/components/ui/button";
4+
import {
5+
Card,
6+
CardContent,
7+
CardHeader,
8+
CardTitle,
9+
} from "@/components/ui/card";
10+
import { ChevronLeft, ChevronRight } from "lucide-react";
11+
12+
import {
13+
Table,
14+
TableBody,
15+
TableCell,
16+
TableHead,
17+
TableHeader,
18+
TableRow,
19+
} from "@/components/ui/table";
20+
21+
import { Input } from "@/components/ui/input";
22+
23+
const Timetable = () => {
24+
const [currentDate, setCurrentDate] = useState(new Date());
25+
const [selectedStartTime, setSelectedStartTime] = useState<string>("");
26+
27+
const handlePrevDay = () => {
28+
setCurrentDate((prevDate) => {
29+
const newDate = new Date(prevDate);
30+
newDate.setDate(newDate.getDate() - 1);
31+
return newDate;
32+
});
33+
};
34+
35+
const handleNextDay = () => {
36+
setCurrentDate((prevDate) => {
37+
const newDate = new Date(prevDate);
38+
newDate.setDate(newDate.getDate() + 1);
39+
return newDate;
40+
});
41+
};
42+
43+
const formattedDate = currentDate.toLocaleDateString("en-US", {
44+
weekday: "long",
45+
year: "numeric",
46+
month: "long",
47+
day: "numeric",
48+
});
49+
50+
// Mock data for the timetable
51+
const timetableData = [
52+
{
53+
locationCode: "E-FAC",
54+
roomName: "E-LH1",
55+
courseCode: "CO221",
56+
startTime: "08:00",
57+
endTime: "10:00",
58+
},
59+
{
60+
locationCode: "E-FAC",
61+
roomName: "E-LH2",
62+
courseCode: "CO222",
63+
startTime: "10:00",
64+
endTime: "12:00",
65+
},
66+
{
67+
locationCode: "E-FAC",
68+
roomName: "E-LH1",
69+
courseCode: "CO223",
70+
startTime: "13:00",
71+
endTime: "15:00",
72+
},
73+
{
74+
locationCode: "E-FAC",
75+
roomName: "E-LH3",
76+
courseCode: "CO224",
77+
startTime: "08:00",
78+
endTime: "10:00",
79+
},
80+
];
81+
82+
const filteredTimetableData = selectedStartTime
83+
? timetableData.filter((entry) => entry.startTime === selectedStartTime)
84+
: timetableData;
85+
86+
return (
87+
<Card>
88+
<CardHeader className="flex flex-row items-center justify-between">
89+
<Button variant="outline" size="icon" onClick={handlePrevDay}>
90+
<ChevronLeft className="h-4 w-4" />
91+
</Button>
92+
<CardTitle className="text-center text-lg font-medium">
93+
{formattedDate}
94+
</CardTitle>
95+
<Button variant="outline" size="icon" onClick={handleNextDay}>
96+
<ChevronRight className="h-4 w-4" />
97+
</Button>
98+
</CardHeader>
99+
<CardContent>
100+
<div className="mb-4 flex items-center space-x-2">
101+
<label htmlFor="startTimeInput" className="text-sm font-medium">
102+
Select Start Time:
103+
</label>
104+
<Input
105+
id="startTimeInput"
106+
type="time"
107+
value={selectedStartTime}
108+
onChange={(e) => setSelectedStartTime(e.target.value)}
109+
className="w-[110px]"
110+
/>
111+
</div>
112+
113+
<Table>
114+
<TableHeader>
115+
<TableRow>
116+
<TableHead>Location Code</TableHead>
117+
<TableHead>Room Name</TableHead>
118+
<TableHead>Course Code</TableHead>
119+
<TableHead>End Time</TableHead>
120+
</TableRow>
121+
</TableHeader>
122+
<TableBody>
123+
{filteredTimetableData.map((entry, index) => (
124+
<TableRow key={index}>
125+
<TableCell>{entry.locationCode}</TableCell>
126+
<TableCell>{entry.roomName}</TableCell>
127+
<TableCell>{entry.courseCode}</TableCell>
128+
<TableCell>{entry.endTime}</TableCell>
129+
</TableRow>
130+
))}
131+
</TableBody>
132+
</Table>
133+
</CardContent>
134+
</Card>
135+
);
136+
};
137+
138+
139+
export default Timetable;

‎src/app/(main)/(dashboard)/(pages)/academic/TabContents/Timetable.tsx‎

Lines changed: 0 additions & 17 deletions
This file was deleted.

‎src/app/(main)/(dashboard)/(pages)/academic/page.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { DashboardPageProviders } from "../../providers/DashboardPageProviders"
33
//tabs
44
import { Home } from "./TabContents/Home";
55
import { MessageBox } from "./TabContents/MessageBox";
6-
import { Timetable } from "./TabContents/Timetable";
6+
import Timetable from "./TabContents/AcademicTimetable";
77
import { ExamClaims } from "./TabContents/ExamClaims";
88

99

‎src/app/(main)/(dashboard)/(pages)/student/TabContents/Home.tsx‎

Lines changed: 82 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,88 @@
1+
"use client"
2+
import * as React from "react"
3+
import Autoplay from "embla-carousel-autoplay"
4+
import Image from "next/image"
5+
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
6+
import { Button } from "@/components/ui/button"
7+
8+
9+
import {
10+
Carousel,
11+
CarouselContent,
12+
CarouselItem,
13+
CarouselNext,
14+
CarouselPrevious,
15+
} from "@/components/ui/carousel"
16+
17+
// Assets
18+
import priview1 from "@/assets/priview-01.jpg"
19+
import priview2 from "@/assets/priview-02.jpg"
20+
import priview3 from "@/assets/priview-03.jpg"
21+
22+
23+
124
export function Home(){
25+
26+
const plugin = React.useRef(
27+
Autoplay({ delay: 3000, stopOnInteraction: true })
28+
)
29+
30+
const upcomingEvent = {
31+
title: "Introduction to Machine Learning",
32+
time: "10:00 AM - 12:00 PM",
33+
location: "Hall 203",
34+
}
35+
236
return(
337
<>
4-
<h1>Home</h1>
38+
<div>
39+
<div className="mt-8">
40+
<h2 className="text-2xl font-bold mb-4">Upcoming Event</h2>
41+
<Card>
42+
<CardHeader>
43+
<CardTitle>{upcomingEvent.title}</CardTitle>
44+
<CardDescription>{upcomingEvent.time} - {upcomingEvent.location}</CardDescription>
45+
</CardHeader>
46+
<CardContent>
47+
<Button>View Details</Button>
48+
</CardContent>
49+
</Card>
50+
</div>
51+
</div>
52+
53+
<div className="mt-8" />
54+
55+
56+
{/* Carousel Section */}
57+
<div>
58+
<Carousel
59+
plugins={[plugin.current]}
60+
className="w-full"
61+
>
62+
<CarouselContent>
63+
{[priview1, priview2, priview3].map((imgSrc, index) => (
64+
<CarouselItem key={index}>
65+
<div className="p-1">
66+
<Card>
67+
<CardContent className="relative aspect-[4/1] p-0 overflow-hidden">
68+
<Image
69+
src={imgSrc}
70+
alt={`Preview ${index + 1}`}
71+
fill
72+
className="object-cover rounded"
73+
/>
74+
</CardContent>
75+
</Card>
76+
</div>
77+
</CarouselItem>
78+
))}
79+
</CarouselContent>
80+
<CarouselPrevious />
81+
<CarouselNext />
82+
</Carousel>
83+
</div>
84+
85+
<div className="mt-8" />
586
</>
687
)
788
}

‎src/app/(main)/(dashboard)/(pages)/student/TabContents/MySchedule.tsx‎

Lines changed: 0 additions & 30 deletions
This file was deleted.

0 commit comments

Comments
 (0)