diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx
index b11b9d0..0b549ed 100644
--- a/frontend/src/App.jsx
+++ b/frontend/src/App.jsx
@@ -6,7 +6,7 @@ import Assignment from "./pages/generation/Assignment";
import Deposit from "./pages/generation/Deposit";
import Intro from "./Intro";
import Admin from "./pages/admin/Admin";
-import MagageStudent from "./pages/admin/ManageStudent.jsx";
+import ManageStudent from "./pages/admin/ManageStudent.jsx";
import ManageTask from "./pages/admin/ManageTask.jsx";
import AttendanceCode from "./pages/admin/AttendanceCode";
import Attendance from "./pages/generation/Attendance";
@@ -22,7 +22,7 @@ function App() {
} />
} />
} />
- } />
+ } />
} />
} />
diff --git a/frontend/src/api/api.js b/frontend/src/api/api.js
index 2cd0305..7dc75ea 100644
--- a/frontend/src/api/api.js
+++ b/frontend/src/api/api.js
@@ -1,7 +1,10 @@
import axios from "axios";
const api = axios.create({
- baseURL: "http://api.:8080/api",
+ baseURL: "http://api.pirocheck.org:8080/api",
+ // 수정 필요한지 재검 필요함
+ // "http://api.pirocheck.org:8080/api"
+ // 기존: "http://api.:8080/api"
withCredentials: true,
});
diff --git a/frontend/src/api/students.js b/frontend/src/api/students.js
new file mode 100644
index 0000000..eac3665
--- /dev/null
+++ b/frontend/src/api/students.js
@@ -0,0 +1,8 @@
+import api from "./api";
+
+export const getStudentsByName = async (name) => {
+ const res = await api.get("/admin/managestudent", {
+ params: { name },
+ });
+ return res.data; // [{ id: ..., name: ... }]
+};
diff --git a/frontend/src/components/Header.jsx b/frontend/src/components/Header.jsx
index 914c888..fe0403d 100644
--- a/frontend/src/components/Header.jsx
+++ b/frontend/src/components/Header.jsx
@@ -10,7 +10,7 @@ const Header = () => {
if (path.includes("assignment")) title = "ASSIGNMENT\nCHECK";
else if (path.includes("deposit")) title = "DEPOSIT";
else if (path.includes("attendance")) title = "ATTENDANCE\nCHECK";
- else if (path.includes("magagestudent")) title = "수강생 관리";
+ else if (path.includes("managestudent")) title = "수강생 관리";
else if (path.includes("magagetask")) title = "과제 관리";
else if (path.includes("attendancecode")) title = "출석코드 생성";
diff --git a/frontend/src/pages/admin/Admin.jsx b/frontend/src/pages/admin/Admin.jsx
index fa42daf..6b9e4e9 100644
--- a/frontend/src/pages/admin/Admin.jsx
+++ b/frontend/src/pages/admin/Admin.jsx
@@ -9,7 +9,7 @@ const Admin = () => {
PIROCHECK
diff --git a/frontend/src/pages/admin/ManageStudent.jsx b/frontend/src/pages/admin/ManageStudent.jsx
index eef36a7..252175f 100644
--- a/frontend/src/pages/admin/ManageStudent.jsx
+++ b/frontend/src/pages/admin/ManageStudent.jsx
@@ -1,31 +1,86 @@
-import { useState } from "react";
+import { useEffect, useState } from "react";
+import { getStudentsByName } from "../../api/students";
import Header from "../../components/Header";
import InputBlock from "../../components/InputBlock";
import style from "./ManageStudent.module.css";
-const MagageStudent = () => {
+const ManageStudent = () => {
const [studentName, setStudentName] = useState([""]);
+ const [page, setPage] = useState(1);
+ const [students, setStudents] = useState([]); // 서버 데이터 저장
+
+ const studentsPerPage = 6;
+
+ useEffect(() => {
+ const fetchStudents = async () => {
+ try {
+ const name = studentName[0] || "";
+ const data = await getStudentsByName(name);
+ setStudents(data);
+ } catch (err) {
+ console.error("수강생 불러오기 실패:", err);
+ }
+ };
+
+ fetchStudents();
+ }, [studentName]);
const handleChange = (index, value) => {
- const studentNames = [...studentName];
- studentNames[index] = value;
- setStudentName(studentNames);
+ const newNames = [...studentName];
+ newNames[index] = value;
+ setStudentName(newNames);
+ setPage(1); // 검색 시 페이지 초기화
};
+ const totalPages = Math.ceil(students.length / studentsPerPage);
+ const paginatedStudents = students.slice(
+ (page - 1) * studentsPerPage,
+ page * studentsPerPage
+ );
+
return (
-
+
+
+
+ {paginatedStudents.map((student, index) => (
+
+ ))}
+
+
+ {students.length > studentsPerPage && (
+
+
+
+ {page} / {totalPages}
+
+
+
+ )}
+
);
};
-export default MagageStudent;
+export default ManageStudent;
diff --git a/frontend/src/pages/admin/ManageStudent.module.css b/frontend/src/pages/admin/ManageStudent.module.css
index 5e87c6a..014c39f 100644
--- a/frontend/src/pages/admin/ManageStudent.module.css
+++ b/frontend/src/pages/admin/ManageStudent.module.css
@@ -4,3 +4,44 @@
flex-direction: column;
align-items: center;
}
+.student_list {
+ margin-top: 60px;
+ display: flex;
+ flex-direction: column;
+ gap: 20px;
+ width: 100%;
+}
+.under_header {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+}
+.student_button {
+ background-color: #333;
+ color: white;
+ padding: 15px;
+ border-radius: 8px;
+ border: 1px solid #39ff14;
+ text-align: left;
+ font-size: 16px;
+ width: 100%;
+}
+.pagination {
+ margin-top: 60px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ gap: 12px;
+}
+.pagination button {
+ background-color: #111;
+ color: #39ff14;
+ padding: 8px 12px;
+ border: 1px solid #39ff14;
+ border-radius: 6px;
+ cursor: pointer;
+}
+.pagination button:disabled {
+ opacity: 0.5;
+ cursor: not-allowed;
+}