Skip to content

feat: Add lecture evaluation retrieval feature #33

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
6-keem merged 2 commits into from
Feb 6, 2025
Merged

feat: Add lecture evaluation retrieval feature #33

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
0204ff0
feat: Add lecture evaluation retrieval feature
6-keem Feb 6, 2025
9332c01
Merge branch 'main' of https://github.com/dotbugi/jongbugi into develop
6-keem Feb 6, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
107 changes: 63 additions & 44 deletions src/content/subject/components/CourseEvaluationModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import ReactDOM from 'react-dom';
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table';
import { fetchCourseEvaluationData } from '@/hooks/fetchAPI';
import { CourseEvaluation, Description } from '@/types/types';
import { CourseEvaluation } from '@/types/types';
import { useEffect, useState, useContext } from 'react';
import { Button } from '@/components/ui/button';
import { ShadowRootContext } from '@/lib/ShadowRootContext';
Expand All @@ -12,9 +12,8 @@ interface ModalProp {
}

export function CourseEvaluationModal({ code, onClose }: ModalProp) {
const [courseEvaluation, setCourseEvaluation] = useState<CourseEvaluation | null>(null);
const [courseEvaluations, setCourseEvaluation] = useState<CourseEvaluation[]>([]);
const shadowRoot = useContext(ShadowRootContext);

const [isVisible, setIsVisible] = useState(false);

useEffect(() => {
Expand All @@ -36,6 +35,14 @@ export function CourseEvaluationModal({ code, onClose }: ModalProp) {
}, 300);
};

const groupedCourses: { [key: string]: CourseEvaluation[] } = {};
courseEvaluations.forEach((evaluation) => {
if (!groupedCourses[evaluation.kyokwacode]) {
groupedCourses[evaluation.kyokwacode] = [];
}
groupedCourses[evaluation.kyokwacode].push(evaluation);
});

const modalContent = (
<div
className={`fixed inset-0 z-50 left-44 flex items-center justify-center bg-black bg-opacity-50 transition-opacity duration-300 ${
Expand All @@ -44,50 +51,62 @@ export function CourseEvaluationModal({ code, onClose }: ModalProp) {
onClick={handleClose}
>
<div className="bg-white rounded-lg shadow-lg w-3/4 max-w-2xl p-6 relative" onClick={(e) => e.stopPropagation()}>
{/* 닫기 버튼 */}
<Button onClick={onClose} className="absolute top-2 right-2" variant="ghost">
×
</Button>
{courseEvaluation ? (
<div>
<h2 className="text-xl font-bold mb-4">과목해설</h2>
<Table>
<TableHeader>
<TableRow className="bg-zinc-100 hover:bg-zinc-100">
<TableHead className="w-[15%]">교과코드</TableHead>
<TableHead className="w-[25%]">과목명</TableHead>
<TableHead className="w-[15%]">교수</TableHead>
<TableHead className="w-[15%]">학년도</TableHead>
<TableHead className="w-[15%]">학기</TableHead>
<TableHead className="w-[15%]">점수</TableHead>
</TableRow>
</TableHeader>
<TableBody>
<TableRow className="bg-white hover:bg-white">
<TableCell>{courseEvaluation.courseCode}</TableCell>
<TableCell>{courseEvaluation.courseName}</TableCell>
<TableCell>{courseEvaluation.professor}</TableCell>
<TableCell>{courseEvaluation.academicYear}</TableCell>
<TableCell>{courseEvaluation.semester}</TableCell>
<TableCell>{courseEvaluation.score}</TableCell>
</TableRow>
<TableRow className="bg-zinc-100 hover:bg-zinc-100">
<TableHead colSpan={6}>도움말</TableHead>
</TableRow>
<TableRow className="bg-white hover:bg-white">
<TableCell colSpan={6} className="text-left">
<ul className="list-disc pl-5">
<li>해당 교과에 대한 교강사의 최근 2학기 강의평가 점수 조회 화면입니다.</li>
<li>수강 신청 2주 전부터 정정일까지 확인 가능합니다.</li>
</ul>
</TableCell>
</TableRow>
</TableBody>
</Table>
</div>
) : (
<div className="text-center">로딩 중...</div>
)}
<h2 className="text-xl font-bold mb-4">과목해설</h2>
<Table>
<TableHeader>
<TableRow className="bg-zinc-100 hover:bg-zinc-100">
<TableHead className="w-[15%]">교과코드</TableHead>
<TableHead className="w-[25%]">과목명</TableHead>
<TableHead className="w-[15%]">교수</TableHead>
<TableHead className="w-[15%]">학년도</TableHead>
<TableHead className="w-[15%]">학기</TableHead>
<TableHead className="w-[15%]">점수</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{courseEvaluations.length > 0 ? (
Object.entries(groupedCourses).map(([key, evaluations]) =>
evaluations.map((evaluation, index) => (
<TableRow
key={`${evaluation.kyokwacode}-${evaluation.hakneando}-${evaluation.hakgi}`}
className="bg-white hover:bg-white"
>
{index === 0 && (
<>
<TableCell rowSpan={evaluations.length}>{evaluation.kyokwacode}</TableCell>
<TableCell rowSpan={evaluations.length}>{evaluation.kyokwaname}</TableCell>
<TableCell rowSpan={evaluations.length}>{evaluation.kyosu}</TableCell>
</>
)}
<TableCell>{evaluation.hakneando}</TableCell>
<TableCell>{evaluation.hakgi}</TableCell>
<TableCell>{evaluation.jumsu}</TableCell>
</TableRow>
))
)
) : (
<TableRow>
<TableCell colSpan={6} className="text-center">
데이터가 존재하지 않습니다.
</TableCell>
</TableRow>
)}
<TableRow className="bg-zinc-100 hover:bg-zinc-100">
<TableHead colSpan={6}>도움말</TableHead>
</TableRow>
<TableRow className="bg-white hover:bg-white">
<TableCell colSpan={6} className="text-left">
<ul className="list-disc pl-5">
<li>해당 교과에 대한 교강사의 최근 2학기 강의평가 점수 조회 화면입니다.</li>
<li>수강 신청 2주 전부터 정정일까지 확인 가능합니다.</li>
</ul>
</TableCell>
</TableRow>
</TableBody>
</Table>
</div>
</div>
);
Expand Down
22 changes: 12 additions & 10 deletions src/hooks/fetchAPI.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -289,7 +289,7 @@ export const fetchCourseEvaluationData = ({
setCourseEvaluation,
}: {
code: string;
setCourseEvaluation: (courseEvaluation: CourseEvaluation) => void;
setCourseEvaluation: (courseEvaluation: CourseEvaluation[]) => void;
}) => {
var xhr = new XMLHttpRequest();
xhr.open('POST', 'https://info.hansung.ac.kr/jsp_21/student/kyomu/siganpyo_aui_data.jsp', true);
Expand All @@ -306,15 +306,17 @@ export const fetchCourseEvaluationData = ({
const parser = new xml2js.Parser();
const result: ParsedXML = await parser.parseStringPromise(xml);

// const item: any = result.root.items[0].item[0];
const courseEvaluation: CourseEvaluation = {
academicYear: '2001',
courseCode: code,
courseName: '크롬익스텐션',
professor: '홍길동',
score: '4.5',
semester: '2학기',
};
const items: any[] = result?.root?.items?.[0]?.item || [];

const courseEvaluation: CourseEvaluation[] = items.map((item) => ({
kyokwacode: item.kyokwacode?.[0] || '',
kyokwaname: item.kyokwaname?.[0] || '',
kyosu: item.kyosu?.[0] || '',
hakgi: item.hakgi?.[0] || '',
hakneando: item.hakneando?.[0] || '',
jumsu: item.jumsu?.[0] || '',
}));

setCourseEvaluation(courseEvaluation);
} catch (err) {
console.error('XML parsing failed:', err);
Expand Down
12 changes: 6 additions & 6 deletions src/types/types.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -111,12 +111,12 @@ export interface Description {
}

export interface CourseEvaluation {
courseCode: string;
courseName: string;
professor: string;
academicYear: string;
semester: string;
score: string;
kyokwacode: string;
kyokwaname: string;
kyosu: string;
hakneando: string;
hakgi: string;
jumsu: string;
}

/**
Expand Down
Loading