From 861a5e449c830f763b3e23af158918f165d3b0a4 Mon Sep 17 00:00:00 2001
From: NamKyeongMin <kyeongmin35@gachon.ac.kr>
Date: Wed, 21 May 2025 11:28:55 +0900
Subject: [PATCH 1/2] =?UTF-8?q?[fix]:=20ManageStudent.jsx=20css=20?=
 =?UTF-8?q?=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/pages/admin/ManageStudent.module.css | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/frontend/src/pages/admin/ManageStudent.module.css b/frontend/src/pages/admin/ManageStudent.module.css
index 931680a..3a900c7 100644
--- a/frontend/src/pages/admin/ManageStudent.module.css
+++ b/frontend/src/pages/admin/ManageStudent.module.css
@@ -25,6 +25,9 @@
   text-align: left;
   font-size: 16px;
   width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
 }
 .student_button:hover {
   border: 1px solid #39ff14;

From 296161b61417980f9c8eb838523f1e211f8a2b9d Mon Sep 17 00:00:00 2001
From: NamKyeongMin <kyeongmin35@gachon.ac.kr>
Date: Wed, 21 May 2025 12:03:19 +0900
Subject: [PATCH 2/2] =?UTF-8?q?[add]:=20DetailManageStudent.jsx=20?=
 =?UTF-8?q?=EA=B5=AC=ED=98=84=EC=9D=84=20=EC=9C=84=ED=95=9C=20=EA=B2=BD?=
 =?UTF-8?q?=EB=A1=9C,=20api=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/App.jsx                          |  9 ++++
 frontend/src/api/students.js                  | 10 ++++
 .../src/pages/admin/DetailManageStudent.jsx   | 47 +++++++++++++++++++
 .../admin/DetailManageStudent.module.css      | 11 +++++
 frontend/src/pages/admin/ManageStudent.jsx    |  8 +++-
 5 files changed, 84 insertions(+), 1 deletion(-)
 create mode 100644 frontend/src/pages/admin/DetailManageStudent.jsx
 create mode 100644 frontend/src/pages/admin/DetailManageStudent.module.css

diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx
index 5d442d1..5bc8878 100644
--- a/frontend/src/App.jsx
+++ b/frontend/src/App.jsx
@@ -6,6 +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 DetailManageStudent from "./pages/admin/DetailManageStudent.jsx";
 import ManageStudent from "./pages/admin/ManageStudent.jsx";
 import ManageTask from "./pages/admin/ManageTask.jsx";
 import AttendanceCode from "./pages/admin/AttendanceCode";
@@ -68,6 +69,14 @@ function App() {
             </RequireAdmin>
           }
         />
+        <Route
+          path="/managestudent/detail/:studentId"
+          element={
+            <RequireAdmin>
+              <DetailManageStudent />
+            </RequireAdmin>
+          }
+        />
         <Route
           path="/managetask"
           element={
diff --git a/frontend/src/api/students.js b/frontend/src/api/students.js
index 271ee4f..fb52116 100644
--- a/frontend/src/api/students.js
+++ b/frontend/src/api/students.js
@@ -6,3 +6,13 @@ export const getStudentsByName = async (name) => {
   });
   return res.data; // [{ id: ..., name: ... }]
 };
+
+export const getStudentDetail = async (studentId) => {
+  try {
+    const res = await api.get(`/admin/managestudent/${studentId}`);
+    return res.data;
+  } catch (error) {
+    console.error("학생 상세 정보 불러오기 실패:", error);
+    throw error;
+  }
+};
diff --git a/frontend/src/pages/admin/DetailManageStudent.jsx b/frontend/src/pages/admin/DetailManageStudent.jsx
new file mode 100644
index 0000000..f932ea9
--- /dev/null
+++ b/frontend/src/pages/admin/DetailManageStudent.jsx
@@ -0,0 +1,47 @@
+import { useParams } from "react-router-dom";
+import { useEffect, useState } from "react";
+import Header from "../../components/Header";
+import style from "./DetailManageStudent.module.css";
+import { getStudentDetail } from "../../api/students";
+
+const DetailManageStudent = () => {
+  const { studentId } = useParams();
+  const [student, setStudent] = useState(null);
+
+  useEffect(() => {
+    const fetchStudent = async () => {
+      try {
+        const data = await getStudentDetail(studentId);
+        setStudent(data);
+      } catch (err) {
+        console.error("학생 상세 정보 불러오기 실패:", err);
+      }
+    };
+
+    fetchStudent();
+  }, [studentId]);
+
+  if (!student) return <div>loading...</div>;
+
+  return (
+    <div className={style.managestudent_wrapper}>
+      <Header />
+      <div className={style.under_header}>
+        <div className={style.student_card}>
+          <h2>{student.name}</h2>
+          <p>잔여 보증금: {student.deposit}원</p>
+          <p>보증금 방어권: {student.defence}</p>
+        </div>
+
+        <div className={style.assignment_list}>
+          {student.assignmentTitles.map((title, idx) => (
+            <button key={idx} className={style.assignment_button}>
+              {title}
+            </button>
+          ))}
+        </div>
+      </div>
+    </div>
+  );
+};
+export default DetailManageStudent;
diff --git a/frontend/src/pages/admin/DetailManageStudent.module.css b/frontend/src/pages/admin/DetailManageStudent.module.css
new file mode 100644
index 0000000..86fe69d
--- /dev/null
+++ b/frontend/src/pages/admin/DetailManageStudent.module.css
@@ -0,0 +1,11 @@
+.managestudent_wrapper {
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+  align-items: center;
+}
+.under_header {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
diff --git a/frontend/src/pages/admin/ManageStudent.jsx b/frontend/src/pages/admin/ManageStudent.jsx
index 252175f..80a02e3 100644
--- a/frontend/src/pages/admin/ManageStudent.jsx
+++ b/frontend/src/pages/admin/ManageStudent.jsx
@@ -1,4 +1,5 @@
 import { useEffect, useState } from "react";
+import { useNavigate } from "react-router-dom";
 import { getStudentsByName } from "../../api/students";
 import Header from "../../components/Header";
 import InputBlock from "../../components/InputBlock";
@@ -8,6 +9,7 @@ const ManageStudent = () => {
   const [studentName, setStudentName] = useState([""]);
   const [page, setPage] = useState(1);
   const [students, setStudents] = useState([]); // 서버 데이터 저장
+  const navigate = useNavigate();
 
   const studentsPerPage = 6;
 
@@ -54,7 +56,11 @@ const ManageStudent = () => {
         />
         <div className={style.student_list}>
           {paginatedStudents.map((student, index) => (
-            <button key={student.id || index} className={style.student_button}>
+            <button
+              key={student.id || index}
+              className={style.student_button}
+              onClick={() => navigate(`/managestudent/detail/${student.id}`)}
+            >
               {student.name} <span>&gt;</span>
             </button>
           ))}