diff --git a/login-frontend/src/App.css b/login-frontend/src/App.css deleted file mode 100644 index 1a8c21d..0000000 --- a/login-frontend/src/App.css +++ /dev/null @@ -1,38 +0,0 @@ -/* .App { - text-align: center; -} - -.App-logo { - height: 40vmin; - pointer-events: none; -} - -@media (prefers-reduced-motion: no-preference) { - .App-logo { - animation: App-logo-spin infinite 20s linear; - } -} - -.App-header { - background-color: #282c34; - min-height: 100vh; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - font-size: calc(10px + 2vmin); - color: white; -} - -.App-link { - color: #61dafb; -} - -@keyframes App-logo-spin { - from { - transform: rotate(0deg); - } - to { - transform: rotate(360deg); - } -} */ diff --git a/login-frontend/src/App.js b/login-frontend/src/App.js index 5a615c3..0a38997 100644 --- a/login-frontend/src/App.js +++ b/login-frontend/src/App.js @@ -1,14 +1,15 @@ import React, { useState } from 'react'; -import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom'; +import { BrowserRouter as Router, Routes, Route} from 'react-router-dom'; -import './App.css'; import '../node_modules/bootstrap/dist/css/bootstrap.min.css'; import FirstPage from './pages/FirstPage'; import AuthPage from './pages/authPage'; -import StudentDashBoard from './pages/StudentDashboard'; -import Course from './components/coursePage/Course'; -import Course1 from './components/coursePage/Course1'; +import StudentDashBoard from './pages/dashboardPage/StudentDashboard'; +import Course from './pages/coursePage/Course'; +import Course1 from './pages/coursePage/Course1'; +import CourseRegistration from './pages/coursePage/CourseRegistration'; +import TeacherDashBoard from './pages/dashboardPage/TeacherDashBoard'; function App() { const [username, setUsername] = useState(''); @@ -27,19 +28,23 @@ function App() { const data = await response.text(); setMessage(data); }; - return ( } /> - } /> - } /> - } /> - } /> + } /> + } /> + } /> + } /> + } /> + } /> + + } /> } /> } /> } /> } /> + } /> ); diff --git a/login-frontend/src/components/auth/changePassword.js b/login-frontend/src/components/auth/changePassword.js new file mode 100644 index 0000000..bab67eb --- /dev/null +++ b/login-frontend/src/components/auth/changePassword.js @@ -0,0 +1,87 @@ +import React, { useState } from 'react'; +import { useAuth } from '../../hooks/useAuth'; // Assuming useAuth hook exists +import Alert from '@mui/material/Alert' +import { useNavigate } from 'react-router-dom'; +function ChangePassword(props) { + const [email, setEmail] = useState(''); + const [password, setPassword] = useState(''); + const [retypepass, setRetypepass] = useState(''); + const [errorMsg, setErrorMsg] = useState(null); + const [successMsg, setSuccessMsg] = useState(null); + const auth = useAuth(); + const navigate = useNavigate(); + const handleLogin = async (event) => { + event.preventDefault(); + try { + const response = await auth.login(email, password); + console.log("response data: ", response); + if (response.message === "Login successful") { + setErrorMsg(null); + setSuccessMsg("Login successful!"); + navigate('/student/dashboard'); + } else { + setErrorMsg(response.message); + setSuccessMsg(null); + } + } catch (error) { + setErrorMsg(error?.message || "Error"); + console.error('Login error:', error.message); + } +}; + return ( +
+ {errorMsg && {errorMsg}} + {successMsg && {successMsg}} +
+ + + + +
+
+ ); +} + +export default ChangePassword; + diff --git a/login-frontend/src/components/auth/login.js b/login-frontend/src/components/auth/login.js index eda0f58..481c708 100644 --- a/login-frontend/src/components/auth/login.js +++ b/login-frontend/src/components/auth/login.js @@ -1,7 +1,6 @@ import React, { useState } from 'react'; import { useAuth } from '../../hooks/useAuth'; // Assuming useAuth hook exists import Alert from '@mui/material/Alert' -import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom'; import { useNavigate } from 'react-router-dom'; function Login(props) { const [email, setEmail] = useState(''); @@ -31,10 +30,6 @@ function Login(props) { } }; - const handleClickChange = () => { - props.handleViewChange('Register'); - }; - return (
{errorMsg && {errorMsg}} @@ -43,12 +38,12 @@ function Login(props) {
); } diff --git a/login-frontend/src/components/auth/register.js b/login-frontend/src/components/auth/register.js deleted file mode 100644 index de9feb8..0000000 --- a/login-frontend/src/components/auth/register.js +++ /dev/null @@ -1,38 +0,0 @@ -import React, { useState } from 'react'; -import { useAuth } from '../../hooks/useAuth'; - -function Register(props) { - const [name, setName] = useState(''); - const [email, setEmail] = useState(''); - const [password, setPassword] = useState(''); - const auth = useAuth(); - - const handleRegister = async (event) => { - event.preventDefault(); - auth.register(name, email, password); - }; - const handleClickChange = () => { - props.handleViewChange('Login'); - } - - return ( -
-
- - - - -
-

or already have an ACCOUNT?

- -
- ); -} - -export default Register; diff --git a/login-frontend/src/components/dashboard/lessonPlan.js b/login-frontend/src/components/dashboard/lessonPlan.js new file mode 100644 index 0000000..b15d1ba --- /dev/null +++ b/login-frontend/src/components/dashboard/lessonPlan.js @@ -0,0 +1,18 @@ +import React from 'react'; // Use React for functional components +import '../../../node_modules/bootstrap/dist/css/bootstrap.min.css'; +function SubjectSchedule(props){ + return( + <> + +
+ + ) +} +export default SubjectSchedule; \ No newline at end of file diff --git a/login-frontend/src/components/DashBoard/studentInfo.js b/login-frontend/src/components/dashboard/studentInfo.js similarity index 97% rename from login-frontend/src/components/DashBoard/studentInfo.js rename to login-frontend/src/components/dashboard/studentInfo.js index 72f57e8..2a2376a 100644 --- a/login-frontend/src/components/DashBoard/studentInfo.js +++ b/login-frontend/src/components/dashboard/studentInfo.js @@ -25,7 +25,7 @@ function StudentInfo(props) {

#Class

-

SV000000

+

None

#Major

None

#Faculty

@@ -33,7 +33,7 @@ function StudentInfo(props) {

#Identity Card Number

-

SV000000

+

None

#Date of issue of identity card

None

#Place of issue of identity card

diff --git a/login-frontend/src/components/DashBoard/studentTraining.js b/login-frontend/src/components/dashboard/studentTraining.js similarity index 100% rename from login-frontend/src/components/DashBoard/studentTraining.js rename to login-frontend/src/components/dashboard/studentTraining.js diff --git a/login-frontend/src/components/dashboard/subjectSchedule.js b/login-frontend/src/components/dashboard/subjectSchedule.js new file mode 100644 index 0000000..a883d87 --- /dev/null +++ b/login-frontend/src/components/dashboard/subjectSchedule.js @@ -0,0 +1,18 @@ +import React from 'react'; // Use React for functional components +import '../../../node_modules/bootstrap/dist/css/bootstrap.min.css'; +function SubjectSchedule(props){ + return( + <> + +
+ + ) +} +export default SubjectSchedule; \ No newline at end of file diff --git a/login-frontend/src/components/dashboard/teacherInfo.js b/login-frontend/src/components/dashboard/teacherInfo.js new file mode 100644 index 0000000..75a7885 --- /dev/null +++ b/login-frontend/src/components/dashboard/teacherInfo.js @@ -0,0 +1,78 @@ +import React from 'react'; // Use React for functional components +import '../../../node_modules/bootstrap/dist/css/bootstrap.min.css'; +function StudentInfo(props) { + return ( + <> + +
+ Last updated time: dd/mm/yyyy realtime +
+
+

Personal Information

+
+
{/* Combined styles */} +
+
+ +
+

+ Last profile photo update time: ___ +

+
+
+

#Full Name

+

SV000000

+

#Teacher ID

+

None

+

#Sex

+

None

+
+
+

#Class

+

None

+

#Degree

+

None

+

#Faculty

+

None

+
+
+

#Identity Card Number

+

None

+

#Date of issue of identity card

+

None

+

#Place of issue of identity card

+

None

+
+
+
+

Address Information

+
+
+
+

#Address

+

None

+
+
+

#Telephone Number

+

None

+
+
+

#University Email

+

None

+
+
+

#Other Email

+

None

+
+
+ + ); +} + +export default StudentInfo; diff --git a/login-frontend/src/components/header_footer/FirstFooter.js b/login-frontend/src/components/header_footer/FirstFooter.js index aa02d1f..88f9891 100644 --- a/login-frontend/src/components/header_footer/FirstFooter.js +++ b/login-frontend/src/components/header_footer/FirstFooter.js @@ -6,7 +6,7 @@ import '../../../node_modules/bootstrap/dist/css/bootstrap.min.css'; function FirstFooter() { return ( <> -
+
@@ -59,7 +59,7 @@ function FirstFooter() { Copyright © 2024

-
+
); } diff --git a/login-frontend/src/components/header_footer/FirstHeader.js b/login-frontend/src/components/header_footer/FirstHeader.js index 334897c..3b570ea 100644 --- a/login-frontend/src/components/header_footer/FirstHeader.js +++ b/login-frontend/src/components/header_footer/FirstHeader.js @@ -22,17 +22,17 @@ function FirstHeader() { <> logo - -

GIẢNG VIÊN

+ +

TEACHER

- -

SINH VIÊN

+ +

STUDENT

- -

QUẢN LÝ

+ +

ADMIN

-
- +
+ - + - Thông báo + Notifications - {/* Notifications */} {notifications.map((notification, index) => ( {notification} ))} {notifications.length === 0 && ( No notifications )} - {/* - - Clear Notifications - */}
diff --git a/login-frontend/src/components/header_footer/Footer.js b/login-frontend/src/components/header_footer/Footer.js index e6cb36a..c493842 100644 --- a/login-frontend/src/components/header_footer/Footer.js +++ b/login-frontend/src/components/header_footer/Footer.js @@ -5,14 +5,14 @@ import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom'; function Footer() { return ( <> -
+

Copyright © 2024 | All rights reserved

Mọi thắc mắc vui lòng liên hệ email: info@mut.edu.vn

-
+ ); } diff --git a/login-frontend/src/components/header_footer/Header.js b/login-frontend/src/components/header_footer/StudentHeader.js similarity index 86% rename from login-frontend/src/components/header_footer/Header.js rename to login-frontend/src/components/header_footer/StudentHeader.js index 43df0e1..a54a915 100644 --- a/login-frontend/src/components/header_footer/Header.js +++ b/login-frontend/src/components/header_footer/StudentHeader.js @@ -4,10 +4,10 @@ import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom'; import { Navbar, Nav, Form, Button, Row, Col } from "react-bootstrap"; import NavDropdown from 'react-bootstrap/NavDropdown'; -function Header() { +function StudentHeader() { return ( <> - + logo {/**/} @@ -15,7 +15,7 @@ function Header() { Khóa học của tôi - Đăng ký môn học + Đăng ký môn học
@@ -34,4 +34,4 @@ function Header() { ); } -export default Header; \ No newline at end of file +export default StudentHeader; \ No newline at end of file diff --git a/login-frontend/src/components/header_footer/TeacherHeader.js b/login-frontend/src/components/header_footer/TeacherHeader.js new file mode 100644 index 0000000..cae5a62 --- /dev/null +++ b/login-frontend/src/components/header_footer/TeacherHeader.js @@ -0,0 +1,28 @@ +import React, { useState, useEffect } from 'react'; +import axios from 'axios'; +import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom'; +import { Navbar, Nav, Form, Button, Row, Col } from "react-bootstrap"; +import NavDropdown from 'react-bootstrap/NavDropdown'; + +function TeacherHeader() { + return ( + <> + + logo +
+

NGUYEN VAN B - MSGV

+
+ +
+ + ); +} + +export default TeacherHeader; \ No newline at end of file diff --git a/login-frontend/src/context/authContext.js b/login-frontend/src/context/authContext.js index 25aabd1..dad336d 100644 --- a/login-frontend/src/context/authContext.js +++ b/login-frontend/src/context/authContext.js @@ -30,7 +30,5 @@ export function AuthProvider({ children }) { }; const value = { user, login, register }; - console.log("value after set ", value) - return {children}; } diff --git a/login-frontend/src/pages/authPage.js b/login-frontend/src/pages/authPage.js index de937ee..141a14b 100644 --- a/login-frontend/src/pages/authPage.js +++ b/login-frontend/src/pages/authPage.js @@ -1,18 +1,32 @@ -import React, { useState } from 'react'; +import React, { useEffect, useState } from 'react'; import { AuthProvider } from '../context/authContext'; import Login from '../components/auth/login'; -import Register from '../components/auth/register'; +import ChangePassword from './../components/auth/changePassword'; const authBG = "https://i.ibb.co/9YFh3Tn/lhuEjVn.jpg"; const logo = "https://i.ibb.co/CMwkBmw/lSgDz8N.png"; function App() { - const [currentView, setCurrentView] = useState('Login'); - - const handleViewChange = (newView) => { - setCurrentView(newView); - }; + const [authType, setAuthType] = useState('Login'); + useEffect(() => { + const pathname = window.location.pathname; + + const regex = /\/(login|changepassword)/g; + const match = pathname.match(regex); + if(match[0] === '/login'){ + setAuthType('Login'); + } + else if(match[0] === '/changepassword'){ + setAuthType('ChangePassword'); + } + }, []); + const switchToChangePassword = () => { + switch (authType){ + case 'Login': return ; + case 'ChangePassword': return ; + } + } return (
-
+

Welcome

- {currentView === 'Login' ? ( - // Pass prop as function reference - ) : ( - // Pass prop as function reference - )} + {switchToChangePassword()}
diff --git a/login-frontend/src/components/coursePage/Course.js b/login-frontend/src/pages/coursePage/Course.js similarity index 82% rename from login-frontend/src/components/coursePage/Course.js rename to login-frontend/src/pages/coursePage/Course.js index 255b412..0dc39b3 100644 --- a/login-frontend/src/components/coursePage/Course.js +++ b/login-frontend/src/pages/coursePage/Course.js @@ -7,16 +7,16 @@ import Navbar from 'react-bootstrap/Navbar'; import NavDropdown from 'react-bootstrap/NavDropdown'; import { Button } from 'react-bootstrap'; -import Header from './../header_footer/Header'; -import Footer from './../header_footer/Footer'; +import StudentHeader from '../../components/header_footer/StudentHeader'; +import Footer from '../../components/header_footer/Footer'; function Course() { const course_bg = 'http://i.ibb.co/GVRnWJC/course-bg.jpg'; return ( <> -
-
+ +

CHĂM CHỈ DỄ DÀNG THÀNH CÔNG

diff --git a/login-frontend/src/components/coursePage/Course1.js b/login-frontend/src/pages/coursePage/Course1.js similarity index 90% rename from login-frontend/src/components/coursePage/Course1.js rename to login-frontend/src/pages/coursePage/Course1.js index 339cce9..3806fa0 100644 --- a/login-frontend/src/components/coursePage/Course1.js +++ b/login-frontend/src/pages/coursePage/Course1.js @@ -10,13 +10,13 @@ import Card from 'react-bootstrap/Card'; import Col from 'react-bootstrap/Col'; import Row from 'react-bootstrap/Row'; -import Header from './../header_footer/Header'; -import Footer from './../header_footer/Footer'; +import StudentHeader from '../../components/header_footer/StudentHeader'; +import Footer from '../../components/header_footer/Footer'; function Course1() { return ( <> -
+

Khóa học của tôi

diff --git a/login-frontend/src/pages/coursePage/CourseRegistration.js b/login-frontend/src/pages/coursePage/CourseRegistration.js new file mode 100644 index 0000000..caa6bfa --- /dev/null +++ b/login-frontend/src/pages/coursePage/CourseRegistration.js @@ -0,0 +1,200 @@ +import React, { useState, useEffect } from 'react'; +import axios from 'axios'; +import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom'; +import { Table, Button, Modal, Form, Row, Col, Tab, ListGroup } from 'react-bootstrap'; + +import StudentHeader from '../../components/header_footer/StudentHeader'; +import Footer from '../../components/header_footer/Footer'; + +const CourseRegistration = () => { + const [courses, setCourses] = useState([]); + const [showModal, setShowModal] = useState(false); + const [selectedCourse, setSelectedCourse] = useState(null); + const [teacher, setTeacher] = useState(''); + const [time, setTime] = useState(''); + + useEffect(() => { + fetchCourses(); + }, []); + + const fetchCourses = async () => { + try { + const response = await fetch('your_api_endpoint_here'); + const data = await response.json(); + setCourses(data); + } catch (error) { + console.error('Error fetching courses:', error); + } + }; + + const handleRegister = async () => { + // Your code to post registration data to the server + // This could involve sending selectedCourse, teacher, and time + // to the server to handle the registration process + alert('Đăng ký môn thành công'); + setTeacher(''); + setTime(''); + setShowModal(false); + }; + + const handleCloseModal = () => { + setTeacher(''); + setTime(''); + setShowModal(false); + }; + + const handleShowModal = () => { + //setSelectedCourse(course); + setShowModal(true); + }; + + return ( + <> + + + + + + + Đăng ký học phần + + + Chương trình đào tạo + + + + + + +

Chọn môn học đăng ký

+ + + + + + + + + + + {/*courses.map(course => ( + + + + + + + ))*/} + + + + + + + + + + + + + + + + + + + +
Tên môn họcPhòng họcSố lượngAction
{course.name}{course.room}{course.amount} + +
LTNC413-H640 + +
ABC101-H150 + +
XYZ202-H260 + +
+ +

Phiếu đăng ký

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
STTMã môn họcTên môn họcPhòng họcSố lượngGiảng viênGiờ học
1COxxxxLTNC413-H640Mai Đức Trung13:00-15:00
2COxxxxABC101-H150Tên Giảng Viênhh:mm-hh:mm
+
+ +

CHƯƠNG TRÌNH ĐÀO TẠO

+
+
+ +
+
+