diff --git a/apps/admin/app/students/@modal/_components/OutstandingModalButton.tsx b/apps/admin/app/students/@modal/_components/OutstandingModalButton.tsx index 5376f054..007f3682 100644 --- a/apps/admin/app/students/@modal/_components/OutstandingModalButton.tsx +++ b/apps/admin/app/students/@modal/_components/OutstandingModalButton.tsx @@ -37,6 +37,14 @@ const OutstandingModalButton = () => { }, }; + const handleClickCloseModal = () => { + setSelectedStudents({ + students: new Set(), + firstStudentName: "", + }); + onClose(); + }; + const handleClickOutstanding = async () => { if (!study || !achievement || !type) return; @@ -45,31 +53,25 @@ const OutstandingModalButton = () => { const fetch = apiMap["COMPLETE"][type]; return fetch({ studyId: study.studyId, - studentIds: students, + studentIds: Array.from(students), }); } const fetch = apiMap["ACHIEVEMENT"][type]; return fetch(study.studyId, { - studentIds: students, + studentIds: Array.from(students), achievementType: achievement as AchievementType, }); }; const result = await fetchApi(); - if (result.success) { - revalidateTagByName(tags.students); - setEnabledOutstandingStudents({ - enabled: false, - }); - } - }; - - const handleClickCloseModal = () => { - setSelectedStudents({ - students: new Set(), - firstStudentName: "", + revalidateTagByName(tags.students); + setEnabledOutstandingStudents({ + enabled: false, }); - onClose(); + + if (!result.success) { + handleClickCloseModal(); + } }; return enabled ? ( diff --git a/apps/admin/app/students/_components/StudentTable/StudentList.tsx b/apps/admin/app/students/_components/StudentTable/StudentList.tsx index 4074a1b5..7bd9d04f 100644 --- a/apps/admin/app/students/_components/StudentTable/StudentList.tsx +++ b/apps/admin/app/students/_components/StudentTable/StudentList.tsx @@ -1,6 +1,8 @@ +import { styled } from "@styled-system/jsx"; import { Text } from "@wow-class/ui"; import { useAtom, useAtomValue } from "jotai"; import type { StudyStudentApiResponseDto } from "types/dtos/studyStudent"; +import Checkbox from "wowds-ui/Checkbox"; import Table from "wowds-ui/Table"; import { @@ -36,9 +38,9 @@ const StudentList = ({ if (!studentList.length) return 스터디 수강생이 없어요.; const handleChangeSelectedStudents = (ids: number[]) => { - const firstStudent = - selectedStudents.firstStudentName || - studentList.find((student) => student.memberId === ids[0])?.name; + const firstStudent = studentList.find( + (student) => student.memberId === ids[0] + )?.name; setSelectedStudents({ firstStudentName: firstStudent, @@ -46,34 +48,63 @@ const StudentList = ({ }); }; + const isAllChecked = studentList.length === selectedStudents.students.size; + return ( - - - handleChangeSelectedStudents( - studentList.map((student) => student.memberId) - ) - } - > - {STUENT_INFO_LIST_BEFORE.map((info) => ( - {info} - ))} - {studentList[0] && } - {STUDENT_INFO_LIST_AFTER.map((info) => ( - {info} - ))} - +
+ + + {enabled && ( + + { + if (isAllChecked) { + setSelectedStudents({ + firstStudentName: "", + students: new Set(), + }); + return; + } + handleChangeSelectedStudents( + studentList.map((student) => student.memberId) + ); + }} + /> + + )} + {STUENT_INFO_LIST_BEFORE.map((info) => ( + {info} + ))} + {studentList[0] && ( + + )} + {STUDENT_INFO_LIST_AFTER.map((info) => ( + {info} + ))} + + {studentList.map((student) => ( + onChange={() => { + if (selectedStudents.students.has(student.memberId)) { + const newSet = new Set(selectedStudents.students); + newSet.delete(student.memberId); + handleChangeSelectedStudents([...newSet]); + return; + } handleChangeSelectedStudents([ ...selectedStudents.students, student.memberId, - ]) - } + ]); + }} > @@ -84,3 +115,11 @@ const StudentList = ({ }; export default StudentList; + +const tableCheckBoxStyle = { + minWidth: "15px", + display: "flex", + minHeight: "44px", + justifyContent: "center", + alignItems: "center", +};