feat: 전체 수강생 관리(Delete) 추가
This commit is contained in:
parent
d3d6245c6b
commit
9ac4fbc29f
@ -2,7 +2,7 @@ import styles from './LectureEnroll.module.css';
|
|||||||
import { useLectureEnrollCancel } from '../../hooks/api/useLectureEnrollCancel';
|
import { useLectureEnrollCancel } from '../../hooks/api/useLectureEnrollCancel';
|
||||||
import { useLectureEnrollAccept } from '../../hooks/api/useLectureEnrollAccept';
|
import { useLectureEnrollAccept } from '../../hooks/api/useLectureEnrollAccept';
|
||||||
|
|
||||||
export default function LectureEnroll({ userName, enrollid, onDelete }) {
|
export default function LectureEnroll({ userName, enrollid, onDelete, enrolled = true }) {
|
||||||
const { lectureEnrollCancel } = useLectureEnrollCancel();
|
const { lectureEnrollCancel } = useLectureEnrollCancel();
|
||||||
const { lectureEnrollAccept } = useLectureEnrollAccept();
|
const { lectureEnrollAccept } = useLectureEnrollAccept();
|
||||||
|
|
||||||
@ -28,12 +28,14 @@ export default function LectureEnroll({ userName, enrollid, onDelete }) {
|
|||||||
<div className={styles.enrollLink}>
|
<div className={styles.enrollLink}>
|
||||||
<span>{userName}</span>
|
<span>{userName}</span>
|
||||||
<div className={styles.buttonWrapper}>
|
<div className={styles.buttonWrapper}>
|
||||||
|
{!enrolled && (
|
||||||
<button
|
<button
|
||||||
onClick={handleAccept}
|
onClick={handleAccept}
|
||||||
className={styles.accept}
|
className={styles.accept}
|
||||||
>
|
>
|
||||||
등록
|
등록
|
||||||
</button>
|
</button>
|
||||||
|
)}
|
||||||
<button
|
<button
|
||||||
onClick={handleCancel}
|
onClick={handleCancel}
|
||||||
className={styles.reject}
|
className={styles.reject}
|
||||||
|
@ -8,6 +8,10 @@
|
|||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.enrollLink:hover {
|
||||||
|
background-color: var(--background-secondary);
|
||||||
|
}
|
||||||
|
|
||||||
.buttonWrapper {
|
.buttonWrapper {
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: 8px;
|
gap: 8px;
|
||||||
|
@ -3,36 +3,56 @@ import LectureEnroll from '../../components/LectureEnroll/LectureEnroll';
|
|||||||
import { useParams } from 'react-router-dom';
|
import { useParams } from 'react-router-dom';
|
||||||
import { useLectureEnroll } from '../../hooks/api/useLectureEnroll';
|
import { useLectureEnroll } from '../../hooks/api/useLectureEnroll';
|
||||||
import { useState, useEffect } from 'react';
|
import { useState, useEffect } from 'react';
|
||||||
|
import styles from './LectureEnrollPage.module.css';
|
||||||
|
|
||||||
export default function QuestionListPage() {
|
export default function LectureEnrollPage() {
|
||||||
const { lectureId } = useParams();
|
const { lectureId } = useParams();
|
||||||
const { data } = useLectureEnroll(lectureId);
|
const { data } = useLectureEnroll(lectureId);
|
||||||
const [lectures, setLectures] = useState([]);
|
const [newStudents, setNewStudents] = useState([]);
|
||||||
|
const [students, setStudents] = useState([]);
|
||||||
|
console.log(data);
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (data?.data) {
|
if (data?.data) {
|
||||||
setLectures(data.data);
|
setNewStudents(data.data[1]);
|
||||||
|
setStudents(data.data[0]);
|
||||||
}
|
}
|
||||||
}, [data]);
|
}, [data]);
|
||||||
|
|
||||||
|
const handleNewDelete = async (enrollId) => {
|
||||||
|
setNewStudents(newStudents.filter((student) => student.id !== enrollId));
|
||||||
|
};
|
||||||
|
|
||||||
const handleDelete = async (enrollId) => {
|
const handleDelete = async (enrollId) => {
|
||||||
setLectures(lectures.filter((lecture) => lecture.id !== enrollId));
|
setStudents(students.filter((student) => student.id !== enrollId));
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<ArticleBoard
|
<ArticleBoard
|
||||||
title="수강신청관리"
|
title="수강신청 관리"
|
||||||
canCreate={false}
|
canCreate={false}
|
||||||
>
|
>
|
||||||
{lectures.length &&
|
{newStudents.length &&
|
||||||
lectures.map?.((lecture) => (
|
newStudents.map?.((student) => (
|
||||||
<LectureEnroll
|
<LectureEnroll
|
||||||
key={`${lecture.id}`}
|
key={`${student.id}`}
|
||||||
enrollid={lecture.id}
|
enrollid={student.id}
|
||||||
userName={lecture.userName}
|
userName={student.userName}
|
||||||
|
onDelete={handleNewDelete}
|
||||||
|
enrolled={false}
|
||||||
|
/>
|
||||||
|
))}
|
||||||
|
<div>
|
||||||
|
<h3 className={styles.title}>전체 수강생 관리</h3>
|
||||||
|
{students.length &&
|
||||||
|
students.map?.((student) => (
|
||||||
|
<LectureEnroll
|
||||||
|
key={`${student.id}`}
|
||||||
|
enrollid={student.id}
|
||||||
|
userName={student.userName}
|
||||||
onDelete={handleDelete}
|
onDelete={handleDelete}
|
||||||
/>
|
/>
|
||||||
))}
|
))}
|
||||||
|
</div>
|
||||||
</ArticleBoard>
|
</ArticleBoard>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -0,0 +1,6 @@
|
|||||||
|
.title {
|
||||||
|
font-size: 32px;
|
||||||
|
line-height: 1.2;
|
||||||
|
font-weight: 700;
|
||||||
|
padding-left: 20px;
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user