From 09ef37d0748cd1f26df585d0de1591429451d2f0 Mon Sep 17 00:00:00 2001
From: Inhyuk Oh <49269218+ohinhyuk@users.noreply.github.com>
Date: Sun, 27 Aug 2023 14:54:58 +0900
Subject: [PATCH] =?UTF-8?q?Feature:=20=ED=95=99=EA=B8=B0=EB=B3=84=20?=
=?UTF-8?q?=EC=84=B8=EB=B6=80=20=ED=95=AD=EB=AA=A9=EC=9D=84=20API=EB=A5=BC?=
=?UTF-8?q?=20=EC=97=B0=EA=B2=B0=20=ED=95=A8=EC=9C=BC=EB=A1=9C=EC=8D=A8=20?=
=?UTF-8?q?=ED=95=99=EA=B8=B0=EB=B3=84=20=EC=84=B8=EB=B6=80=ED=95=AD?=
=?UTF-8?q?=EB=AA=A9=EC=9D=84=20CR=EC=9D=84=20=ED=95=A0=20=EC=88=98=20?=
=?UTF-8?q?=EC=9E=88=EB=8B=A4.(#20)=20(#21)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
* style : 헤더 컴포넌트 완성
* style : sidebar(drawer) 완성
* feat : Drawer와 상태를 연결
* feat : 커스텀 테이블 생성
* refactor : 커스텀 테이블의 pagination을 refactoring함
* Refactor(custom): 테이블 관련 데이터 파일 분리
* 커밋 컨밴션을 위한 cz-commitizen 설정
* Docs: pR 문서 템플릿 작성
* Refactor: 테이블 컴포넌트를 다양한 데이터를 넣을 수 있도록 Row 부분을 리펙토링 하여 정의한이터에 따라 값이 유연하게 들어갈 수 있게 함(#4)
* Feat: 테이블 관련 필드를 field 파일에 모아둠 (#4)
* Refactor: boardList정의 + 사이드바 블럭 리펙터링
* Refactor: milleageHeader를 컴포넌트로 꺼내면서 로직을 포함하고 있는 함수들과 UI를 리펙터링함
* Feat: 마일리지 카테고리 리스트에 필요한 리스트들을 enum을 이용하여 정리
* Refactor: 마일리지 카테고리 게시판 리펙터링 완료 (#4)
* Feat: 마일리지 항목 게시판 enum 설정 (#4)
* Feat: 마일리지 항목 데이터 인터페이스 설정(#4)
* Feat: 마일리지 항목 관련 데이터 생성 함수(#4)
* Feat: 마일리지 항목 관련 테이블 헤더(#4)
* Feat: 마일리지 항목 row값 설정
* Feat: 마일리지 조회 게시판 enum 설정(#4)
* Feat: 마일리지 조회 데이터 인터페이스 설정(#4)
* Feat: 마일리지 조회 데이터 생성 함수(#4)
* Feat: 마일리지 조회 데이터 생성 함수(#4)
* Feat: 마일리지 조회 데이터 추가(#4)
* Feat: 마일리지 등록 enum 설계(#4)
* Feat: 마일리지 조회 데이터 인터페이스 + 데이터 생성 함수(#4)
* Feat: 마일리지 등록 테이블 헤더(#4)
* Feat: 마일리지 등록 더미데이터 입력(#4)
* Fix: semester을 number -\> string으로 타입 수정 , 테이블 데이터들이 모두 select 되지 않는 버그 수정(#4)
* Style: mediaQuery와 styled-component를 이용하여 테이블의 반응형 구축(#4)
* Feat: 신청자 관리 데이터 인터페이스(4)
* Feat: 신청자 관리 enum (#4)
* Feat: 신청자 관리 데이터 생성함수 (#4)
* Fix: 신청자 관리 카테고리를 제외 시킴(#4)
* Feat: 신청자 관리 헤더 내용 정리(#4)
* Feat: 신청자 관리 더미데이터(#4)
* Feat: 학생 관리 테이블 완성(#4)
* Feat: 사용자 관리 테이블 enum 설정(#4)
* Feat: 사용자 관리 데이터 인터페이스 설정(#4)
* Feat: 사용자 관리 데이터 생성함수(#4)
* Feat: 사용자 관리 테이블 studentName -\> name으로 필드 이름 변경
* Feat: 사용자관리 테이블 데이터생성함수(#4)
* Feat: 사용자 관리 테이블 완료(#4)
* Feat: 마일리지 선정 결과 enum 설정(#4)
* Feat: 마일리지 선정결과 인터페이스 + 데이터 생성함수(#4)
* Fix: 마일리지 선정 결과에서 register num을 삭제하였음(#4)
* Feat: 마일리지 선정결과 테이블 헤더 설정(#4)
* Feat: 마일리지 선정결과 완료(#4)
* Chore: 빌드 시 esLint를 무시할 수 있도록 next.config.js를 수정해주었음
* Feat: 마일리지 카테고리 모달관련 reducers를 만듬 (open , close) (#7)
* Feat: 마일리지 카테고리 관련 모달을 열고 닫는 액션 export(#7)
* Fix: 문법에 맞게 reducers return 값 수정(#7)
* Feat: mUI 모달 컴포넌트 생성(#7)
* Feat: root Reducer에 modal Reducer를 연결하고 모달의 useState를 selector와 dispatch로 대체함으로 써 모달을 컴포넌트에 연결 시킴
* Feat: 카테고리 관련 모달 이름 data파일에 정의(#7)
* Fix: 모달 관련 state를 재사용 하기로 결정하여 state의 갯수를 줄임(#7)
* Feat: icon Converter를 통해 어떤 타입의 모달이냐에 따라 다른 아이콘을 부여(#7)
* Feat: title Converter를 두어 모달의 제목을 모달의 타입에 따라 융통성있게 가져감(#7)
* Fix: 모달이 type을 인식하지 못하는 이슈로 인해 modalType을 reducer에서 관리(#7)
* Feat: formik , yup 설치 및 활용을 통한 모달 속 폼 제작(#7)
* Feat: 마일리지 카테고리 추가 기능 폼 구현 완료(#7)
* Style: mui템플릿 Theme기본 설정을 변경 시켜서 텍스트 필드의 스타일을 변경시킴(#7)
* Feat: 관리를 눌렀을 때 초기값을 전달하여 세팅하는 것 까지 연결 (#7)
* Feat: 마일리지 카테고리 모달 완성 + 컴포넌트 분리(#7)
* Refactor: 모달 제목 , 모달 열기 버튼 리펙터링(#7)
* Feat: 테이블에 타입 지정하고 타입을 활용해서 제목 변경(#7)
* Feat: 타입 컨버터를 통해 각 모달의 기능에 맞춰줌(#7)
* Feat: 카테고리 항목 모달 폼 제작(#7)
* Feat: 카테고리 항목 모달에 토글 추가(#7)
* Feat: 영어를 한글로 UI를 보여주는 함수 구현(#7)
* Feat: 마일리지 항목 모달 리펙터링(#7)
* Feat: 마일리지 카테고리, 마일리지 항목 모달 연결(#7)
* Feat: 게시판 데이터에 마일리지 글로벌 항목 추가(#12)
* Feat: 각각의 컴포넌트에 type을 지정해주어 각 컴포넌트에 맞는 테이블의 제목을 나타나게 한다.(#12)
* Feat: 마일리지 글로벌 항목 관련 테이블 생성(#12)
* Fix: 마일리지 항목 -\> 마일리지 학기별 항목으로 수정(#12)
* Feat: 자동완성 state연결(#15)
* Feat: 카테고리 filter 관련 Reducer 생성 (#15)
* Feat: 카테고리 필터링 완료(#15)
* Feat: 마일리지 글로벌 항목 리스트 상태를 리덕스로 관리(#15)
* Feat: 마일리지 학기별 항목 리스트도 리덕스로 관리 (#15)
* Feat: 학기 필터링 상태 Reducer에 추가(#15)
* Feat: 학기 필터링 드롭다운 컴포넌트(#15)
* Feat: 학기 필터링 적용 완료(#15)
* Feat: 보이기 필터링 드롭다운 컴포넌트 생성 , reducer 생성(#15)
* Feat: 보이기 필터링 연결(#15)
* Feat: 항목명 필터링 컴포넌트, 상태 생성(#15)
* Fix: 마일리지 학기별 항목의 보이기 값이 boolean임에 맞춰 데이터를 true/false로 변경(#15)
* Feat: 카테고리 CRUD API apitest 페이지에서 연결테스트(#16)
* Refactor: pages 폴더 내에서만 서버사이드 렌더링이 작동하기 때문에 header와 drawer를 main layout으로 리펙터링 한다(#15))
* Fix: 테이블 리스트 컴포넌트들을 페이지로 이동 시키기 이전에 현재 페이지 상태에 대한 상태를 reducer로 관리(#15)
* Fix: 컴포넌트 리턴 함수를 drawer컴포넌트에서 메인 페이지로 꺼내옴
* Refactor: 서버 사이드 렌더링을 위하여 board 컴포넌트를 페이지로 리펙터링(#15)
* Feat: 마일리지 카테고리 서버사이드 fetching API 연결(#15)
* Feat: 카테고리 추가 API 연결 완료(#15)
* Feat: 카테고리 수정 API 연결 (#15)
* Feat: 삭제 API를 여러개 동시에 하기 위해 선택 된 것을 삭제할 수 있도록 선택된 id들전역상태로 관리(#16)
* Feat: 선택된 번호들을 다른 페이지로 갔을 시 초기화 되도록 설정(#16)
* Feat: 카테고리 다중 삭제 API 연결 완료(#16)
* Feat: 글로벌 세부항목 가져오기 API 연결(#18)
* Refactor: 글로벌 카테고리 모달 버튼 리펙터링(#18)
* Feat: 메뉴바 state가redux persist로 유지되도록 함(#18)
* Feat: 학기별 세부항목 조회를 위한 interface 생성(#20)
* Feat: 마일리지 학기별 항목 READ 연결(#20)
* Feat: 세부항목 모달+ CREATE API 연결(#20)
* Feature: 글로벌 세부항목 API을 연결 함으로써 데이터베이스에 글로벌 세부항목 CRUD을 할 수 있다. (#19)
* style : 헤더 컴포넌트 완성
* style : sidebar(drawer) 완성
* feat : Drawer와 상태를 연결
* feat : 커스텀 테이블 생성
* refactor : 커스텀 테이블의 pagination을 refactoring함
* Refactor(custom): 테이블 관련 데이터 파일 분리
* 커밋 컨밴션을 위한 cz-commitizen 설정
* Docs: pR 문서 템플릿 작성
* Refactor: 테이블 컴포넌트를 다양한 데이터를 넣을 수 있도록 Row 부분을 리펙토링 하여 정의한이터에 따라 값이 유연하게 들어갈 수 있게 함(#4)
* Feat: 테이블 관련 필드를 field 파일에 모아둠 (#4)
* Refactor: boardList정의 + 사이드바 블럭 리펙터링
* Refactor: milleageHeader를 컴포넌트로 꺼내면서 로직을 포함하고 있는 함수들과 UI를 리펙터링함
* Feat: 마일리지 카테고리 리스트에 필요한 리스트들을 enum을 이용하여 정리
* Refactor: 마일리지 카테고리 게시판 리펙터링 완료 (#4)
* Feat: 마일리지 항목 게시판 enum 설정 (#4)
* Feat: 마일리지 항목 데이터 인터페이스 설정(#4)
* Feat: 마일리지 항목 관련 데이터 생성 함수(#4)
* Feat: 마일리지 항목 관련 테이블 헤더(#4)
* Feat: 마일리지 항목 row값 설정
* Feat: 마일리지 조회 게시판 enum 설정(#4)
* Feat: 마일리지 조회 데이터 인터페이스 설정(#4)
* Feat: 마일리지 조회 데이터 생성 함수(#4)
* Feat: 마일리지 조회 데이터 생성 함수(#4)
* Feat: 마일리지 조회 데이터 추가(#4)
* Feat: 마일리지 등록 enum 설계(#4)
* Feat: 마일리지 조회 데이터 인터페이스 + 데이터 생성 함수(#4)
* Feat: 마일리지 등록 테이블 헤더(#4)
* Feat: 마일리지 등록 더미데이터 입력(#4)
* Fix: semester을 number -\> string으로 타입 수정 , 테이블 데이터들이 모두 select 되지 않는 버그 수정(#4)
* Style: mediaQuery와 styled-component를 이용하여 테이블의 반응형 구축(#4)
* Feat: 신청자 관리 데이터 인터페이스(4)
* Feat: 신청자 관리 enum (#4)
* Feat: 신청자 관리 데이터 생성함수 (#4)
* Fix: 신청자 관리 카테고리를 제외 시킴(#4)
* Feat: 신청자 관리 헤더 내용 정리(#4)
* Feat: 신청자 관리 더미데이터(#4)
* Feat: 학생 관리 테이블 완성(#4)
* Feat: 사용자 관리 테이블 enum 설정(#4)
* Feat: 사용자 관리 데이터 인터페이스 설정(#4)
* Feat: 사용자 관리 데이터 생성함수(#4)
* Feat: 사용자 관리 테이블 studentName -\> name으로 필드 이름 변경
* Feat: 사용자관리 테이블 데이터생성함수(#4)
* Feat: 사용자 관리 테이블 완료(#4)
* Feat: 마일리지 선정 결과 enum 설정(#4)
* Feat: 마일리지 선정결과 인터페이스 + 데이터 생성함수(#4)
* Fix: 마일리지 선정 결과에서 register num을 삭제하였음(#4)
* Feat: 마일리지 선정결과 테이블 헤더 설정(#4)
* Feat: 마일리지 선정결과 완료(#4)
* Chore: 빌드 시 esLint를 무시할 수 있도록 next.config.js를 수정해주었음
* Feat: 마일리지 카테고리 모달관련 reducers를 만듬 (open , close) (#7)
* Feat: 마일리지 카테고리 관련 모달을 열고 닫는 액션 export(#7)
* Fix: 문법에 맞게 reducers return 값 수정(#7)
* Feat: mUI 모달 컴포넌트 생성(#7)
* Feat: root Reducer에 modal Reducer를 연결하고 모달의 useState를 selector와 dispatch로 대체함으로 써 모달을 컴포넌트에 연결 시킴
* Feat: 카테고리 관련 모달 이름 data파일에 정의(#7)
* Fix: 모달 관련 state를 재사용 하기로 결정하여 state의 갯수를 줄임(#7)
* Feat: icon Converter를 통해 어떤 타입의 모달이냐에 따라 다른 아이콘을 부여(#7)
* Feat: title Converter를 두어 모달의 제목을 모달의 타입에 따라 융통성있게 가져감(#7)
* Fix: 모달이 type을 인식하지 못하는 이슈로 인해 modalType을 reducer에서 관리(#7)
* Feat: formik , yup 설치 및 활용을 통한 모달 속 폼 제작(#7)
* Feat: 마일리지 카테고리 추가 기능 폼 구현 완료(#7)
* Style: mui템플릿 Theme기본 설정을 변경 시켜서 텍스트 필드의 스타일을 변경시킴(#7)
* Feat: 관리를 눌렀을 때 초기값을 전달하여 세팅하는 것 까지 연결 (#7)
* Feat: 마일리지 카테고리 모달 완성 + 컴포넌트 분리(#7)
* Refactor: 모달 제목 , 모달 열기 버튼 리펙터링(#7)
* Feat: 테이블에 타입 지정하고 타입을 활용해서 제목 변경(#7)
* Feat: 타입 컨버터를 통해 각 모달의 기능에 맞춰줌(#7)
* Feat: 카테고리 항목 모달 폼 제작(#7)
* Feat: 카테고리 항목 모달에 토글 추가(#7)
* Feat: 영어를 한글로 UI를 보여주는 함수 구현(#7)
* Feat: 마일리지 항목 모달 리펙터링(#7)
* Feat: 마일리지 카테고리, 마일리지 항목 모달 연결(#7)
* Feat: 게시판 데이터에 마일리지 글로벌 항목 추가(#12)
* Feat: 각각의 컴포넌트에 type을 지정해주어 각 컴포넌트에 맞는 테이블의 제목을 나타나게 한다.(#12)
* Feat: 마일리지 글로벌 항목 관련 테이블 생성(#12)
* Fix: 마일리지 항목 -\> 마일리지 학기별 항목으로 수정(#12)
* Feat: 자동완성 state연결(#15)
* Feat: 카테고리 filter 관련 Reducer 생성 (#15)
* Feat: 카테고리 필터링 완료(#15)
* Feat: 마일리지 글로벌 항목 리스트 상태를 리덕스로 관리(#15)
* Feat: 마일리지 학기별 항목 리스트도 리덕스로 관리 (#15)
* Feat: 학기 필터링 상태 Reducer에 추가(#15)
* Feat: 학기 필터링 드롭다운 컴포넌트(#15)
* Feat: 학기 필터링 적용 완료(#15)
* Feat: 보이기 필터링 드롭다운 컴포넌트 생성 , reducer 생성(#15)
* Feat: 보이기 필터링 연결(#15)
* Feat: 항목명 필터링 컴포넌트, 상태 생성(#15)
* Fix: 마일리지 학기별 항목의 보이기 값이 boolean임에 맞춰 데이터를 true/false로 변경(#15)
* Feat: 카테고리 CRUD API apitest 페이지에서 연결테스트(#16)
* Refactor: pages 폴더 내에서만 서버사이드 렌더링이 작동하기 때문에 header와 drawer를 main layout으로 리펙터링 한다(#15))
* Fix: 테이블 리스트 컴포넌트들을 페이지로 이동 시키기 이전에 현재 페이지 상태에 대한 상태를 reducer로 관리(#15)
* Fix: 컴포넌트 리턴 함수를 drawer컴포넌트에서 메인 페이지로 꺼내옴
* Refactor: 서버 사이드 렌더링을 위하여 board 컴포넌트를 페이지로 리펙터링(#15)
* Feat: 마일리지 카테고리 서버사이드 fetching API 연결(#15)
* Feat: 카테고리 추가 API 연결 완료(#15)
* Feat: 카테고리 수정 API 연결 (#15)
* Feat: 삭제 API를 여러개 동시에 하기 위해 선택 된 것을 삭제할 수 있도록 선택된 id들전역상태로 관리(#16)
* Feat: 선택된 번호들을 다른 페이지로 갔을 시 초기화 되도록 설정(#16)
* Feat: 카테고리 다중 삭제 API 연결 완료(#16)
* Feat: 글로벌 세부항목 가져오기 API 연결(#18)
* Refactor: 글로벌 카테고리 모달 버튼 리펙터링(#18)
* Feat: 메뉴바 state가redux persist로 유지되도록 함(#18)
---
package-lock.json | 7 +-
src/components/common/modal/SWModal.tsx | 15 +-
.../{ItemForm.tsx => GlobalItemForm.tsx} | 2 +-
src/components/modalForm/SemesterItemForm.tsx | 125 ++++++
src/pages/mileage/item/semester/index.tsx | 406 +++++++++++-------
5 files changed, 377 insertions(+), 178 deletions(-)
rename src/components/modalForm/{ItemForm.tsx => GlobalItemForm.tsx} (99%)
create mode 100644 src/components/modalForm/SemesterItemForm.tsx
diff --git a/package-lock.json b/package-lock.json
index fac2810..6d34cb6 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8392,9 +8392,10 @@
"integrity": "sha512-wcCp8vu8FT22BnvKVPjXa/ICBWRq/zjFfdofZy1WSpQZpphblv12/bOQLBC1rMM7SGOFS9ltVmKOHil5+Ml7gA=="
},
"node_modules/glob": {
- "version": "10.3.3",
- "resolved": "https://registry.npmjs.org/glob/-/glob-10.3.3.tgz",
- "integrity": "sha512-92vPiMb/iqpmEgsOoIDvTjc50wf9CCCvMzsi6W0JLPeUKE8TWP1a73PgqSrqy7iAZxaSD1YdzU7QZR5LF51MJw==",
+ "version": "7.2.3",
+ "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz",
+ "integrity": "sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==",
+ "dev": true,
"dependencies": {
"foreground-child": "^3.1.0",
"jackspeak": "^2.0.3",
diff --git a/src/components/common/modal/SWModal.tsx b/src/components/common/modal/SWModal.tsx
index aeb3632..9bad884 100644
--- a/src/components/common/modal/SWModal.tsx
+++ b/src/components/common/modal/SWModal.tsx
@@ -60,7 +60,9 @@ import CategoryForm from 'src/components/modalForm/CategoryForm';
import ModalIconButton from './ModalIconButton';
import ModalTitle from './ModalTitle';
import { values } from 'lodash';
-import ItemForm from 'src/components/modalForm/ItemForm';
+import ItemForm from 'src/components/modalForm/GlobalItemForm';
+import GlobalItemForm from 'src/components/modalForm/GlobalItemForm';
+import SemesterItemForm from 'src/components/modalForm/SemesterItemForm';
export const ButtonFlexBox = styled(Box)({
display: 'flex',
@@ -91,19 +93,16 @@ const modalForm = (modalType, beforeData) => {
return ;
case EDITCATEGORY:
return ;
- case DELETECATEGORY:
- return ;
case ADDITEM:
- return ;
+ return ;
case EDITITEM:
- return ;
+ return ;
case ADDGLOBALITEM:
- return ;
+ return ;
case EDITGLOBALITEM:
- return ;
+ return ;
default:
return default
;
-
}
};
diff --git a/src/components/modalForm/ItemForm.tsx b/src/components/modalForm/GlobalItemForm.tsx
similarity index 99%
rename from src/components/modalForm/ItemForm.tsx
rename to src/components/modalForm/GlobalItemForm.tsx
index 0d88132..318e0a1 100644
--- a/src/components/modalForm/ItemForm.tsx
+++ b/src/components/modalForm/GlobalItemForm.tsx
@@ -63,7 +63,7 @@ const StyleFieldForm = styled(Form)({
gap: '20px',
});
-export default function ItemForm({ beforeData }) {
+export default function GlobalItemForm({ beforeData }) {
const modalType = useSelector((state) => state.modal.modalType);
console.log(modalType, beforeData);
diff --git a/src/components/modalForm/SemesterItemForm.tsx b/src/components/modalForm/SemesterItemForm.tsx
new file mode 100644
index 0000000..21ef69c
--- /dev/null
+++ b/src/components/modalForm/SemesterItemForm.tsx
@@ -0,0 +1,125 @@
+import { ErrorMessage, Field, Form, Formik } from 'formik';
+import { ButtonFlexBox } from '../common/modal/SWModal';
+import {
+ TITLE,
+ CATEGORY,
+ DESCRIPTION,
+ MAX_MILEAGE,
+ MAX_POINTS,
+ NUM,
+ POINT,
+ SEMESTER,
+ MILEAGE,
+} from 'src/assets/data/fields';
+import * as Yup from 'yup';
+import Button from '@mui/material/Button';
+import { ADDCATEGORY, ADDITEM, EDITCATEGORY, EDITITEM } from 'src/assets/data/modal/modals';
+import { TextField, styled } from '@mui/material';
+import { useDispatch, useSelector } from 'react-redux';
+import { dispatch } from 'src/redux/store';
+import { closeModal } from 'src/redux/slices/modal';
+import CancelButton from '../common/modal/CancelButton';
+import SubmitButton from '../common/modal/SubmitButton';
+import axiosInstance from 'src/utils/axios';
+import { useRouter } from 'next/router';
+
+export default function SemesterItemForm({ beforeData }) {
+ const modalType = useSelector((state) => state.modal.modalType);
+ const router = useRouter();
+
+ const SemesterItemSchema = Yup.object().shape({
+ [SEMESTER]: Yup.string().required('필수입니다.'),
+ [NUM]: Yup.number().integer().required('필수입니다.'),
+ [MILEAGE]: Yup.number().integer().required('필수입니다.'),
+ [MAX_MILEAGE]: Yup.number().integer().required('필수입니다.'),
+ });
+
+ const handleSubmit = (values, { setSubmitting, resetForm }) => {
+ // 카테고리 추가
+ // 1) newData 생성
+ // 2) axios post
+ // 3) alert
+ // 4) reload
+
+ const newData = {
+ itemId: values[NUM],
+ points: values[MILEAGE],
+ [MAX_POINTS]: values[MAX_MILEAGE],
+ };
+
+ switch (modalType) {
+ case ADDITEM:
+ axiosInstance
+ .post(`/api/mileage/semesters/${values[SEMESTER]}/items`, newData)
+ .then((res) => {
+ alert('학기별 항목이 추가되었습니다.');
+ router.reload();
+ })
+ .catch((err) => alert('학기별 항목 추가에 실패했습니다.'));
+ break;
+
+ case EDITITEM:
+ axiosInstance
+ .patch(`/api/mileage/semesters/${values[SEMESTER]}/items`, newData)
+ .then((res) => {
+ alert('학기별 항목이 수정되었습니다.');
+ router.reload();
+ })
+ .catch((err) => alert('학기별 항목 수정에 실패했습니다.'));
+ break;
+ }
+ };
+
+ return (
+
+ {({ isSubmitting, errors, touched }) => (
+
+ )}
+
+ );
+}
diff --git a/src/pages/mileage/item/semester/index.tsx b/src/pages/mileage/item/semester/index.tsx
index c84e524..64ffbd7 100644
--- a/src/pages/mileage/item/semester/index.tsx
+++ b/src/pages/mileage/item/semester/index.tsx
@@ -12,6 +12,7 @@ import {
ITEM,
DESCRIPTION,
DESCRIPTION1,
+ SEMESTERITEM,
DESCRIPTION2,
FILE_DESCRIPTION,
ISVISIBLE_STUDENT,
@@ -28,6 +29,7 @@ import { useSelector, dispatch } from 'src/redux/store';
import { useDispatch } from 'react-redux';
import { useEffect } from 'react';
import { setMileageSemesterList } from 'src/redux/slices/data';
+import axiosInstance from 'src/utils/axios';
/**
* @component [마일리지 학기별 항목] 게시판
@@ -63,186 +65,258 @@ interface Data {
[MileageSemesterItemBoard.MANAGE]: string;
}
-export default function MileageSemesterItem() {
- /**
- * @kind [마일리지 학기별 항목]
- * @brief 데이터 생성 함수
- *
- * */
- function createData(
- num: number,
- category: string,
- semester: string,
- item: string,
- mileage: number,
- isVisible: boolean,
- registeredDate: string,
- manage: string
- ): Data {
- return {
- [MileageSemesterItemBoard.NUM]: num,
- [MileageSemesterItemBoard.CATEGORY]: category,
- [MileageSemesterItemBoard.SEMESTER]: semester,
- [MileageSemesterItemBoard.ITEM]: item,
- [MileageSemesterItemBoard.MILEAGE]: mileage,
- [MileageSemesterItemBoard.ISVISIBLE]: isVisible,
- [MileageSemesterItemBoard.REGISTERED_DATE]: registeredDate,
- [MileageSemesterItemBoard.MANAGE]: manage,
- };
- }
-
- /**
- * @kind [마일리지 학기별 항목]
- * @brief 테이블 헤더
- */
- const headCells = [
- {
- id: [MileageSemesterItemBoard.NUM],
- numeric: false,
- disablePadding: true,
- label: '번호',
- },
- {
- id: [MileageSemesterItemBoard.CATEGORY],
- numeric: true,
- disablePadding: false,
- label: '카테고리명',
- },
- {
- id: [MileageSemesterItemBoard.SEMESTER],
- numeric: true,
- disablePadding: false,
- label: '학기',
- },
- {
- id: [MileageSemesterItemBoard.ITEM],
- numeric: true,
- disablePadding: false,
- label: '항목명',
- },
- {
- id: [MileageSemesterItemBoard.MILEAGE],
- numeric: true,
- disablePadding: false,
- label: '마일리지',
- },
- {
- id: [MileageSemesterItemBoard.ISVISIBLE],
- numeric: true,
- disablePadding: false,
- label: '보이기',
- },
- {
- id: [MileageSemesterItemBoard.REGISTERED_DATE],
- numeric: true,
- disablePadding: false,
- label: '등록일',
- },
- {
- id: [MileageSemesterItemBoard.MANAGE],
- numeric: true,
- disablePadding: false,
- label: '관리',
- },
- ];
-
- const IParams = {
- [CATEGORY]: '카테고리테스트',
- [SEMESTER]: '2022-01',
- [ITEM]: '웹 서비스 캠프',
- [MILEAGE]: 30,
- [MAX_MAILEAGE]: 50,
- [DESCRIPTION1]: '설명 1',
- [DESCRIPTION2]: '설명 2',
- [FILE_DESCRIPTION]: '첨부파일 설명',
- [ISVISIBLE]: true,
- [ISVISIBLE_STUDENT]: false,
- [ISINPUT_STUDENT]: false,
- [ISDUPLICATE_RECORD]: false,
- [ISEVALUATE_CSEE]: false,
- [ISEVALUATE_PORTFOLIO]: false,
- [ISEVALUATE_FUSION]: false,
+/**
+ * @kind [마일리지 학기별 항목]
+ * @brief 데이터 생성 함수
+ *
+ * */
+function createData(
+ num: number,
+ category: string,
+ semester: string,
+ item: string,
+ mileage: number,
+ isVisible: boolean,
+ registeredDate: string,
+ manage: string
+): Data {
+ return {
+ [MileageSemesterItemBoard.NUM]: num,
+ [MileageSemesterItemBoard.CATEGORY]: category,
+ [MileageSemesterItemBoard.SEMESTER]: semester,
+ [MileageSemesterItemBoard.ITEM]: item,
+ [MileageSemesterItemBoard.MILEAGE]: mileage,
+ [MileageSemesterItemBoard.ISVISIBLE]: isVisible,
+ [MileageSemesterItemBoard.REGISTERED_DATE]: registeredDate,
+ [MileageSemesterItemBoard.MANAGE]: manage,
};
+}
+
+/**
+ * @kind [마일리지 학기별 항목]
+ * @brief 테이블 헤더
+ */
+const headCells = [
+ {
+ id: [MileageSemesterItemBoard.NUM],
+ numeric: false,
+ disablePadding: true,
+ label: '번호',
+ },
+ {
+ id: [MileageSemesterItemBoard.CATEGORY],
+ numeric: true,
+ disablePadding: false,
+ label: '카테고리명',
+ },
+ {
+ id: [MileageSemesterItemBoard.SEMESTER],
+ numeric: true,
+ disablePadding: false,
+ label: '학기',
+ },
+ {
+ id: [MileageSemesterItemBoard.ITEM],
+ numeric: true,
+ disablePadding: false,
+ label: '항목명',
+ },
+ {
+ id: [MileageSemesterItemBoard.MILEAGE],
+ numeric: true,
+ disablePadding: false,
+ label: '마일리지',
+ },
+ {
+ id: [MileageSemesterItemBoard.ISVISIBLE],
+ numeric: true,
+ disablePadding: false,
+ label: '보이기',
+ },
+ {
+ id: [MileageSemesterItemBoard.REGISTERED_DATE],
+ numeric: true,
+ disablePadding: false,
+ label: '등록일',
+ },
+ {
+ id: [MileageSemesterItemBoard.MANAGE],
+ numeric: true,
+ disablePadding: false,
+ label: '관리',
+ },
+];
- /**
+const IParams = {
+ [CATEGORY]: '카테고리테스트',
+ [SEMESTER]: '2022-01',
+ [ITEM]: '웹 서비스 캠프',
+ [MILEAGE]: 30,
+ [MAX_MAILEAGE]: 50,
+ [DESCRIPTION1]: '설명 1',
+ [DESCRIPTION2]: '설명 2',
+ [FILE_DESCRIPTION]: '첨부파일 설명',
+ [ISVISIBLE]: true,
+ [ISVISIBLE_STUDENT]: false,
+ [ISINPUT_STUDENT]: false,
+ [ISDUPLICATE_RECORD]: false,
+ [ISEVALUATE_CSEE]: false,
+ [ISEVALUATE_PORTFOLIO]: false,
+ [ISEVALUATE_FUSION]: false,
+};
+
+/**
* @kind [마일리지 학기별 항목]
* @description 마일리지 학기별 항목 리스트
*/
- const rows = [
- createData(
- 1,
- '전공 마일리지',
- '2022-01',
- '웹 서비스 캠프',
- 30,
- true,
- '2023-08-21',
+const rows = [
+ createData(
+ 1,
+ '전공 마일리지',
+ '2022-01',
+ '웹 서비스 캠프',
+ 30,
+ true,
+ '2023-08-21',
-
- ),
- createData(
- 2,
- '비교과 - 연구활동',
- '2022-01',
- '웹 서비스 캠프',
- 30,
- true,
- '2023-08-21',
+
+ ),
+ createData(
+ 2,
+ '비교과 - 연구활동',
+ '2022-01',
+ '웹 서비스 캠프',
+ 30,
+ true,
+ '2023-08-21',
-
- ),
- createData(
- 3,
- '비교과 - 전공활동',
- '2022-01',
- '웹 서비스 캠프',
- 30,
- true,
- '2023-08-21',
+
+ ),
+ createData(
+ 3,
+ '비교과 - 전공활동',
+ '2022-01',
+ '웹 서비스 캠프',
+ 30,
+ true,
+ '2023-08-21',
-
- ),
- createData(
- 4,
- '비교과 - 특강참여',
- '2022-01',
- '웹 서비스 캠프',
- 30,
- false,
- '2023-08-21',
+
+ ),
+ createData(
+ 4,
+ '비교과 - 특강참여',
+ '2022-01',
+ '웹 서비스 캠프',
+ 30,
+ false,
+ '2023-08-21',
-
- ),
- createData(
- 5,
- '비교과 - 학회활동',
- '2022-02',
- '웹 서비스 캠프',
- 30,
- true,
- '2023-08-21',
-
- ),
- createData(
- 6,
- '비교과 - 행사참여',
- '2022-02',
- '웹 서비스 캠프',
- 30,
- false,
- '2023-08-21',
-
- ),
- ];
+
+ ),
+ createData(
+ 5,
+ '비교과 - 학회활동',
+ '2022-02',
+ '웹 서비스 캠프',
+ 30,
+ true,
+ '2023-08-21',
+
+ ),
+ createData(
+ 6,
+ '비교과 - 행사참여',
+ '2022-02',
+ '웹 서비스 캠프',
+ 30,
+ false,
+ '2023-08-21',
+
+ ),
+];
+
+interface IItem {
+ id: number;
+ itemName: string;
+ isPortfolio: boolean;
+ description1: string;
+ description2: string;
+ stuType: string; // 'C', 'F', 'CF' 중 하나로 제한하려면 "C" | "F" | "CF"와 같이 명시할 수 있습니다.
+}
+
+interface ICategory {
+ id: number;
+ name: string;
+ maxPoints: number;
+}
+
+interface ISemesterItem {
+ item: IItem;
+ category: ICategory;
+ semesterName: string;
+ weight: number;
+}
+interface ISemesterItemList {
+ semesterItems: ISemesterItem[];
+}
+
+export const getServerSideProps: GetServerSideProps<{
+ fetchData: ISemesterItemList;
+}> = async () => {
+ // const res = await fetch(`${process.env.NEXT_PUBLIC_HOST_API_KEY}/api/mileage/categories`);
+ const res = await axiosInstance.get(`/api/mileage/semesters/2023-01/items`);
+ const fetchData = res.data;
+ console.log(fetchData);
+ return { props: { fetchData } };
+};
+export default function MileageCategory({
+ fetchData,
+}: InferGetServerSidePropsType) {
const data = useSelector((state) => state.data.mileageSemesterList);
const dispatch = useDispatch();
- useEffect(() => {
- dispatch(setMileageSemesterList(rows));
- }, []);
+ console.log(fetchData);
+
+ const convertedFetchList = fetchData.semesterItems?.map((semesterItem) => {
+ const beforeData = {
+ [NUM]: semesterItem.item.id,
+ [CATEGORY]: semesterItem.category.name,
+ [SEMESTER]: semesterItem.semesterName,
+ [SEMESTERITEM]: semesterItem.item.itemName,
+ [MILEAGE]: semesterItem.weight,
+ [MAX_MAILEAGE]: semesterItem.category.maxPoints,
+ [DESCRIPTION1]: semesterItem.item.description1,
+ [DESCRIPTION2]: semesterItem.item.description2,
+ [FILE_DESCRIPTION]: '첨부파일 설명', // 업서야 되는 듯
+ [ISVISIBLE]: true,
+ [ISVISIBLE_STUDENT]: false,
+ [ISINPUT_STUDENT]: false,
+ [ISDUPLICATE_RECORD]: false,
+ [ISEVALUATE_CSEE]: semesterItem.item.stuType === 'F' ? false : true,
+ [ISEVALUATE_PORTFOLIO]: semesterItem.item.isPortfolio,
+ [ISEVALUATE_FUSION]: semesterItem.item.stuType === 'C' ? false : true,
+ };
+ return createData(
+ semesterItem.item.id,
+ semesterItem.category.name,
+ semesterItem.semesterName,
+ semesterItem.item.itemName,
+ semesterItem.weight,
+ true,
+ '2023-08-21',
+
+ );
+ });
- return ;
+ return (
+
+ );
}