Skip to content
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

어드민 원서 상세조회 페이지 성적 테이블 개발 #425

Merged
merged 6 commits into from
Sep 20, 2023
Merged

어드민 원서 상세조회 페이지 성적 테이블 개발 #425

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
5cd5b2f
ADD :: 없음 추가
arkk200 Sep 19, 2023
71f24f1
ADD :: 출결 상황 페이지
arkk200 Sep 19, 2023
bb87d01
ADD :: 봉사 시간 페이지
arkk200 Sep 19, 2023
0e41b7f
ADD :: 뺄 수 있는 코드 제거
arkk200 Sep 20, 2023
f64d04f
ADD :: 자격증 페이지
arkk200 Sep 20, 2023
04bfccf
ADD :: 자격증 라운드, SearchInput
arkk200 Sep 20, 2023
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
2 changes: 1 addition & 1 deletion apps/admin/src/components/form/FormDetailContent/FormStatus/FormStatus.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -77,7 +77,7 @@ const FormStatus = ({ id }: Props) => {
</Row>
</FormStatusBox>
<Column gap={8}>
<Button size="SMALL">원서 상태 변경하기</Button>
<Button size="SMALL">최종 접수 상태 변경하기</Button>
<Button size="SMALL" option="SECONDARY">
제출 서류 조회하기
</Button>
Expand Down
14 changes: 6 additions & 8 deletions apps/admin/src/components/form/FormDetailContent/성적/교과성적/교과성적.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { useFormDetailQuery } from '@/services/form/queries';
import getAchievementLevelsGroupList from '@/utils/functions/getAchievementLevelsGroupList';
import styled from 'styled-components';
import { Column } from '@maru/ui';
import 교과성적Header from './교과성적Header/교과성적Header';
import 교과성적Item from './교과성적Item/교과성적Item';

Expand All @@ -18,20 +18,18 @@ const 교과성적 = ({ id }: Props) => {
console.log(achievementLevelsGroupList);

return (
<Styled교과성적>
<Column>
<교과성적Header />
{achievementLevelsGroupList.map((group) => (
<교과성적Item
subjectName={group.subjectName}
achievementLevel21={group.achievementLevels[0]}
achievementLevel22={group.achievementLevels[1]}
achievementLevel31={group.achievementLevels[2]}
achievementLevel21={group.achievementLevels[0] || '없음'}
achievementLevel22={group.achievementLevels[1] || '없음'}
achievementLevel31={group.achievementLevels[2] || '없음'}
/>
))}
</Styled교과성적>
</Column>
);
};

export default 교과성적;

const Styled교과성적 = styled.div``;
51 changes: 23 additions & 28 deletions apps/admin/src/components/form/FormDetailContent/성적/교과성적/교과성적Header/교과성적Header.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,39 +1,34 @@
import { Column, Row, Th } from '@maru/ui';
import styled from 'styled-components';

const 교과성적Header = () => {
return (
<Styled교과성적Header>
<Row>
<Th width={123} height={100} borderTopLeftRadius={12}>
과목
<Row>
<Th width={123} height={100} borderTopLeftRadius={12}>
과목
</Th>
<Column>
<Th width={279} height={50}>
2학년
</Th>
<Column>
<Th width={279} height={50}>
2학년
</Th>
<Row>
<Th option="SECONDARY" width="50%" height={50}>
1학기
</Th>
<Th option="SECONDARY" width="50%" height={50}>
2학기
</Th>
</Row>
</Column>
<Column>
<Th width={140} height={50} borderTopRightRadius={12}>
3학년
</Th>
<Th option="SECONDARY" width={140} height={50}>
<Row>
<Th option="SECONDARY" width="50%" height={50}>
1학기
</Th>
</Column>
</Row>
</Styled교과성적Header>
<Th option="SECONDARY" width="50%" height={50}>
2학기
</Th>
</Row>
</Column>
<Column>
<Th width={140} height={50} borderTopRightRadius={12}>
3학년
</Th>
<Th option="SECONDARY" width={140} height={50}>
1학기
</Th>
</Column>
</Row>
);
};

export default 교과성적Header;

const Styled교과성적Header = styled.div``;
60 changes: 60 additions & 0 deletions apps/admin/src/components/form/FormDetailContent/성적/봉사시간/봉사시간.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,60 @@
import { useFormDetailQuery } from '@/services/form/queries';
import { color, font } from '@maru/theme';
import { CellInput, Column, Row, Td, Th } from '@maru/ui';
import { styled } from 'styled-components';

interface Props {
id: number;
}

const 봉사시간 = ({ id }: Props) => {
const { data: formDetailData } = useFormDetailQuery(id);

return (
<Column>
<Row>
<Th borderTopLeftRadius={12} width={162} height={56}>
학년
</Th>
<Th borderTopRightRadius={12} width={318} height={56}>
봉사시간
</Th>
</Row>
<Row>
<Td width={162} height={56} option="SECONDARY">
1학년
</Td>
<Td width={318} height={56}>
<CellInput value={formDetailData?.grade.volunteerTime1} readOnly />
<Hour>시간</Hour>
</Td>
</Row>
<Row>
<Td width={162} height={56} option="SECONDARY">
2학년
</Td>
<Td width={318} height={56}>
<CellInput value={formDetailData?.grade.volunteerTime2} readOnly />
<Hour>시간</Hour>
</Td>
</Row>
<Row>
<Td borderBottomLeftRadius={12} width={162} height={56} option="SECONDARY">
3학년
</Td>
<Td borderBottomRightRadius={12} width={318} height={56}>
<CellInput value={formDetailData?.grade.volunteerTime3} readOnly />
<Hour>시간</Hour>
</Td>
</Row>
</Column>
);
};

export default 봉사시간;

const Hour = styled.p`
${font.p2}
color: ${color.gray900};
margin-left: 8px;
`;
6 changes: 6 additions & 0 deletions apps/admin/src/components/form/FormDetailContent/성적/성적.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,9 @@ import { Column, Row } from '@maru/ui';
import { SwitchCase } from '@toss/react';
import { useState } from 'react';
import 교과성적 from './교과성적/교과성적';
import 봉사시간 from './봉사시간/봉사시간';
import 자격증 from './자격증/자격증';
import 출결상황 from './출결상황/출결상황';

interface Props {
id: number;
Expand All @@ -27,6 +30,9 @@ const 성적 = ({ id }: Props) => {
value={currentGraduationStep}
caseBy={{
'교과 성적': <교과성적 id={id} />,
'출결 상황': <출결상황 id={id} />,
'봉사 시간': <봉사시간 id={id} />,
자격증: <자격증 id={id} />,
}}
/>
</Row>
Expand Down
98 changes: 98 additions & 0 deletions apps/admin/src/components/form/FormDetailContent/성적/자격증/자격증.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,98 @@
import { useFormDetailQuery } from '@/services/form/queries';
import { CheckBox, Column, Row, Td, Th } from '@maru/ui';

interface Props {
id: number;
}

const 자격증 = ({ id }: Props) => {
const { data: formDetailData } = useFormDetailQuery(id);

const is기능사included =
formDetailData?.grade.certificateList.includes('CRAFTSMAN_INFORMATION_PROCESSING') ||
formDetailData?.grade.certificateList.includes(
'CRAFTSMAN_INFORMATION_EQUIPMENT_OPERATION',
) ||
formDetailData?.grade.certificateList.includes('CRAFTSMAN_COMPUTER');

return (
<Column>
<Row>
<Th width={416} height={56} borderTopLeftRadius={12}>
자격증명
</Th>
<Th width={200} height={56}>
시행기관
</Th>
<Th width={120} height={56}>
반영점수
</Th>
<Th width={80} height={56} borderTopRightRadius={12}>
선택
</Th>
</Row>
<Row>
<Td width={416} height={56}>
정보처리기능사, 정보기기운용기능사, 전자계산기기능사
</Td>
<Td width={200} height={56}>
한국산업인력공단
</Td>
<Td width={120} height={56}>
4점
</Td>
<Td width={80} height={56}>
<CheckBox checked={is기능사included} />
</Td>
</Row>
<Row>
<Td width={416} height={168} borderBottomLeftRadius={12}>
컴퓨터활용능력
</Td>
<Td width={200} height={168}>
한국산업인력공단
</Td>
<Column>
<Row>
<Td width={120} height={56}>
1급(3점)
</Td>
<Td width={80} height={56}>
<CheckBox
checked={formDetailData?.grade.certificateList.includes(
'COMPUTER_SPECIALIST_LEVEL_1',
)}
/>
</Td>
</Row>
<Row>
<Td width={120} height={56}>
2급(2점)
</Td>
<Td width={80} height={56}>
<CheckBox
checked={formDetailData?.grade.certificateList.includes(
'COMPUTER_SPECIALIST_LEVEL_2',
)}
/>
</Td>
</Row>
<Row>
<Td width={120} height={56}>
3급(1점)
</Td>
<Td width={80} height={56} borderBottomRightRadius={12}>
<CheckBox
checked={formDetailData?.grade.certificateList.includes(
'COMPUTER_SPECIALIST_LEVEL_3',
)}
/>
</Td>
</Row>
</Column>
</Row>
</Column>
);
};

export default 자격증;
94 changes: 94 additions & 0 deletions apps/admin/src/components/form/FormDetailContent/성적/출결상황/출결상황.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,94 @@
import { useFormDetailQuery } from '@/services/form/queries';
import { CellInput, Column, Row, Td, Th } from '@maru/ui';

interface Props {
id: number;
}

const 출결상황 = ({ id }: Props) => {
const { data: formDetailData } = useFormDetailQuery(id);

return (
<Column>
<Row>
<Th width={140} height={56} borderTopLeftRadius={12}>
학년
</Th>
<Th width={140} height={56}>
미인정 결석
</Th>
<Th width={140} height={56}>
미인정 지각
</Th>
<Th width={140} height={56}>
미인정 조퇴
</Th>
<Th width={140} height={56} borderTopRightRadius={12}>
미인정 결과
</Th>
</Row>
<Row>
<Td option="SECONDARY" width={140} height={56}>
1학년
</Td>
<Td width={140} height={56}>
<CellInput value={formDetailData?.grade.attendance1.absenceCount} readOnly />
</Td>
<Td width={140} height={56}>
<CellInput value={formDetailData?.grade.attendance1.latenessCount} readOnly />
</Td>
<Td width={140} height={56}>
<CellInput value={formDetailData?.grade.attendance1.earlyLeaveCount} readOnly />
</Td>
<Td width={140} height={56}>
<CellInput
value={formDetailData?.grade.attendance1.classAbsenceCount}
readOnly
/>
</Td>
</Row>
<Row>
<Td option="SECONDARY" width={140} height={56}>
2학년
</Td>
<Td width={140} height={56}>
<CellInput value={formDetailData?.grade.attendance2.absenceCount} readOnly />
</Td>
<Td width={140} height={56}>
<CellInput value={formDetailData?.grade.attendance2.latenessCount} readOnly />
</Td>
<Td width={140} height={56}>
<CellInput value={formDetailData?.grade.attendance2.earlyLeaveCount} readOnly />
</Td>
<Td width={140} height={56}>
<CellInput
value={formDetailData?.grade.attendance2.classAbsenceCount}
readOnly
/>
</Td>
</Row>
<Row>
<Td option="SECONDARY" width={140} height={56} borderBottomLeftRadius={12}>
3학년
</Td>
<Td width={140} height={56}>
<CellInput value={formDetailData?.grade.attendance3.absenceCount} readOnly />
</Td>
<Td width={140} height={56}>
<CellInput value={formDetailData?.grade.attendance3.latenessCount} readOnly />
</Td>
<Td width={140} height={56}>
<CellInput value={formDetailData?.grade.attendance3.earlyLeaveCount} readOnly />
</Td>
<Td width={140} height={56}>
<CellInput
value={formDetailData?.grade.attendance3.classAbsenceCount}
readOnly
/>
</Td>
</Row>
</Column>
);
};

export default 출결상황;
2 changes: 1 addition & 1 deletion packages/maru-ui/src/Input/SearchInput.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ const SearchInput = ({
export default SearchInput;

const StyledSearchInput = styled.div`
${flex({ alignItems: 'center' })}
${flex({ alignItems: 'center', justifyContent: 'space-between' })}
height: 40px;
padding: 0 12px 0 16px;
background-color: ${color.white};
Expand Down