From 4a491fc639f66835cf09335f9c4157e2f84a879e Mon Sep 17 00:00:00 2001 From: sotetero11 <106152149+SPTETERO@users.noreply.github.com> Date: Tue, 4 Jun 2024 10:45:43 +0900 Subject: [PATCH 1/3] =?UTF-8?q?feat:=2059-=ED=8B=80=20=EC=99=84=EC=84=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/App.js | 2 + src/components/Resume/resume.js | 108 +++++++++++++++++++++++++ src/components/Resume/styles.js | 44 ++++++++++ src/pages/ResumeDetail/resumeDetail.js | 76 +++++++++++++++++ src/pages/ResumeDetail/styles.js | 48 +++++++++++ 5 files changed, 278 insertions(+) create mode 100644 src/components/Resume/resume.js create mode 100644 src/components/Resume/styles.js create mode 100644 src/pages/ResumeDetail/resumeDetail.js create mode 100644 src/pages/ResumeDetail/styles.js diff --git a/src/App.js b/src/App.js index 1fc607d..cf8cd06 100644 --- a/src/App.js +++ b/src/App.js @@ -15,6 +15,7 @@ import ContestDetail from "./pages/ContestDetailPage/contestDetailPage"; import TeamMemberRecruitmentNotice from "./components/TeamMemberRecruitmentNotice/teamMemberRecruitmentNotice"; import RegisterMember from "./pages/RegisterMember/registerMember"; import MyTeamDetail from "./components/MyPage/MyTeamDetail/myTeamDetail"; +import ResumeDetail from "./pages/ResumeDetail/resumeDetail"; const App = () => { const [userInfo, setUserInfo] = useRecoilState(userInfoState); @@ -49,6 +50,7 @@ const App = () => { } /> + } /> } /> } /> } /> diff --git a/src/components/Resume/resume.js b/src/components/Resume/resume.js new file mode 100644 index 0000000..d00d06e --- /dev/null +++ b/src/components/Resume/resume.js @@ -0,0 +1,108 @@ +import { Explain } from "../../pages/ResumeDetail/styles"; +import { ColumnList, Gray } from "./styles"; +import { Container, Title, Tag, Data } from "./styles"; + +const Resume = () => { + return ( + + 이력서 정보 + +
+ 기본 정보 + +
+ + 이름 + 전화번호 + 생년월일 + 소속/학교 + 거주 지역 + + + 이름 + 010-1234-1234 + 2000.01.01 + 국민대학교 + 거주지역 + + + 성 + MBTI + + + 성 + ENFT + +
+ + 이력서 정보 + +
+ + 직군 + + 대분류 + + 학점 + + 학점 추가 + + + + + 소분류 + + 소분류 + + 스킬 + + 스킬 추가 + + +
+ + + + 수상/자격증 +
+ 수상자격증 이름 + 2000.01.01 - 2000.01.01 +
+ 수상 자격증 내용 + + + + 자기소개서 + 자기소개서 내용 + 첨부 파일 + 첨부파일들 이름 + +
+ + ); +}; + +export default Resume; diff --git a/src/components/Resume/styles.js b/src/components/Resume/styles.js new file mode 100644 index 0000000..c773a48 --- /dev/null +++ b/src/components/Resume/styles.js @@ -0,0 +1,44 @@ +import styled from "styled-components"; + +export const Container = styled.div` + padding: 20px 40px; + border: solid; + border-radius: 9px; + border-color: #c9c9c9; + display: flex; + flex-direction: column; + align-items: flex-start; +`; + +export const ColumnList = styled.div` + display: flex; + flex-direction: column; + align-items: flex-start; +`; + +export const Title = styled.label` + font-size: 24px; + font-weight: 700; +`; + +export const Tag = styled.label` + font-size: 18px; + font-weight: 600; +`; + +export const Data = styled.label` + padding: 8px 16px; + + border: 2px solid; + border-radius: 8px; + border-color: #c9c9c9; + + font-size: 16px; + font-weight: 400; +`; + +export const Gray = styled.label` + font-size: 18px; + font-weight: 500; + color: #6d758f; +`; diff --git a/src/pages/ResumeDetail/resumeDetail.js b/src/pages/ResumeDetail/resumeDetail.js new file mode 100644 index 0000000..47422b6 --- /dev/null +++ b/src/pages/ResumeDetail/resumeDetail.js @@ -0,0 +1,76 @@ +import Navigation from "../../components/Navigation/navigation"; +import Resume from "../../components/Resume/resume"; +import { BlueButton, ColumnGroup, Container, Gray, Tag, Title } from "./styles"; + +const ResumeDetail = () => { + return ( + <> + + +
+
+ 팀원 구하기 +
+ + 팀원정보 + +
+
+ + 이름 + 구인 분야 + 구인 유형 + 한줄 소개 + + + 이름 + 구인 분야 + 구인 유형 + 한줄 소개 + +
+
+ 1:1 채팅걸기 +
+ + +
+ + ); +}; + +export default ResumeDetail; diff --git a/src/pages/ResumeDetail/styles.js b/src/pages/ResumeDetail/styles.js new file mode 100644 index 0000000..b911965 --- /dev/null +++ b/src/pages/ResumeDetail/styles.js @@ -0,0 +1,48 @@ +import styled from "styled-components"; + +export const Container = styled.div` + padding: 20px 40px; + border: solid; + border-radius: 9px; + border-color: #c9c9c9; + display: flex; + flex-direction: column; + align-items: flex-start; +`; + +export const ColumnGroup = styled.div` + display: flex; + flex-direction: column; + align-items: flex-start; +`; + +export const Title = styled.label` + font-size: 32px; + font-weight: 700; +`; + +export const Tag = styled.label` + font-size: 18px; + font-weight: 600; +`; + +export const Gray = styled.label` + font-size: 18px; + font-weight: 500; + color: #6d758f; +`; + +export const Explain = styled.label` + font-size: 18px; + font-weight: 300; +`; + +export const BlueButton = styled.button` + padding: 7px 15px; + border: none; + border-radius: 8px; + font-size: 18px; + font-weight: 600; + color: #ffffff; + background: #377bff; +`; From 4facc9b3fdd07b220a9195b4c770aaed09fa620b Mon Sep 17 00:00:00 2001 From: sotetero11 <106152149+SPTETERO@users.noreply.github.com> Date: Tue, 4 Jun 2024 10:45:43 +0900 Subject: [PATCH 2/3] =?UTF-8?q?feat:=20#59-=ED=8B=80=20=EC=99=84=EC=84=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/App.js | 2 + src/components/Resume/resume.js | 108 +++++++++++++++++++++++++ src/components/Resume/styles.js | 44 ++++++++++ src/pages/ResumeDetail/resumeDetail.js | 76 +++++++++++++++++ src/pages/ResumeDetail/styles.js | 48 +++++++++++ 5 files changed, 278 insertions(+) create mode 100644 src/components/Resume/resume.js create mode 100644 src/components/Resume/styles.js create mode 100644 src/pages/ResumeDetail/resumeDetail.js create mode 100644 src/pages/ResumeDetail/styles.js diff --git a/src/App.js b/src/App.js index 1fc607d..cf8cd06 100644 --- a/src/App.js +++ b/src/App.js @@ -15,6 +15,7 @@ import ContestDetail from "./pages/ContestDetailPage/contestDetailPage"; import TeamMemberRecruitmentNotice from "./components/TeamMemberRecruitmentNotice/teamMemberRecruitmentNotice"; import RegisterMember from "./pages/RegisterMember/registerMember"; import MyTeamDetail from "./components/MyPage/MyTeamDetail/myTeamDetail"; +import ResumeDetail from "./pages/ResumeDetail/resumeDetail"; const App = () => { const [userInfo, setUserInfo] = useRecoilState(userInfoState); @@ -49,6 +50,7 @@ const App = () => { } /> + } /> } /> } /> } /> diff --git a/src/components/Resume/resume.js b/src/components/Resume/resume.js new file mode 100644 index 0000000..d00d06e --- /dev/null +++ b/src/components/Resume/resume.js @@ -0,0 +1,108 @@ +import { Explain } from "../../pages/ResumeDetail/styles"; +import { ColumnList, Gray } from "./styles"; +import { Container, Title, Tag, Data } from "./styles"; + +const Resume = () => { + return ( + + 이력서 정보 + +
+ 기본 정보 + +
+ + 이름 + 전화번호 + 생년월일 + 소속/학교 + 거주 지역 + + + 이름 + 010-1234-1234 + 2000.01.01 + 국민대학교 + 거주지역 + + + 성 + MBTI + + + 성 + ENFT + +
+ + 이력서 정보 + +
+ + 직군 + + 대분류 + + 학점 + + 학점 추가 + + + + + 소분류 + + 소분류 + + 스킬 + + 스킬 추가 + + +
+ + + + 수상/자격증 +
+ 수상자격증 이름 + 2000.01.01 - 2000.01.01 +
+ 수상 자격증 내용 + + + + 자기소개서 + 자기소개서 내용 + 첨부 파일 + 첨부파일들 이름 + +
+ + ); +}; + +export default Resume; diff --git a/src/components/Resume/styles.js b/src/components/Resume/styles.js new file mode 100644 index 0000000..c773a48 --- /dev/null +++ b/src/components/Resume/styles.js @@ -0,0 +1,44 @@ +import styled from "styled-components"; + +export const Container = styled.div` + padding: 20px 40px; + border: solid; + border-radius: 9px; + border-color: #c9c9c9; + display: flex; + flex-direction: column; + align-items: flex-start; +`; + +export const ColumnList = styled.div` + display: flex; + flex-direction: column; + align-items: flex-start; +`; + +export const Title = styled.label` + font-size: 24px; + font-weight: 700; +`; + +export const Tag = styled.label` + font-size: 18px; + font-weight: 600; +`; + +export const Data = styled.label` + padding: 8px 16px; + + border: 2px solid; + border-radius: 8px; + border-color: #c9c9c9; + + font-size: 16px; + font-weight: 400; +`; + +export const Gray = styled.label` + font-size: 18px; + font-weight: 500; + color: #6d758f; +`; diff --git a/src/pages/ResumeDetail/resumeDetail.js b/src/pages/ResumeDetail/resumeDetail.js new file mode 100644 index 0000000..47422b6 --- /dev/null +++ b/src/pages/ResumeDetail/resumeDetail.js @@ -0,0 +1,76 @@ +import Navigation from "../../components/Navigation/navigation"; +import Resume from "../../components/Resume/resume"; +import { BlueButton, ColumnGroup, Container, Gray, Tag, Title } from "./styles"; + +const ResumeDetail = () => { + return ( + <> + + +
+
+ 팀원 구하기 +
+ + 팀원정보 + +
+
+ + 이름 + 구인 분야 + 구인 유형 + 한줄 소개 + + + 이름 + 구인 분야 + 구인 유형 + 한줄 소개 + +
+
+ 1:1 채팅걸기 +
+ + +
+ + ); +}; + +export default ResumeDetail; diff --git a/src/pages/ResumeDetail/styles.js b/src/pages/ResumeDetail/styles.js new file mode 100644 index 0000000..b911965 --- /dev/null +++ b/src/pages/ResumeDetail/styles.js @@ -0,0 +1,48 @@ +import styled from "styled-components"; + +export const Container = styled.div` + padding: 20px 40px; + border: solid; + border-radius: 9px; + border-color: #c9c9c9; + display: flex; + flex-direction: column; + align-items: flex-start; +`; + +export const ColumnGroup = styled.div` + display: flex; + flex-direction: column; + align-items: flex-start; +`; + +export const Title = styled.label` + font-size: 32px; + font-weight: 700; +`; + +export const Tag = styled.label` + font-size: 18px; + font-weight: 600; +`; + +export const Gray = styled.label` + font-size: 18px; + font-weight: 500; + color: #6d758f; +`; + +export const Explain = styled.label` + font-size: 18px; + font-weight: 300; +`; + +export const BlueButton = styled.button` + padding: 7px 15px; + border: none; + border-radius: 8px; + font-size: 18px; + font-weight: 600; + color: #ffffff; + background: #377bff; +`; From e836d88d99d64e0b3b35a380cbdc0d0e0054fef3 Mon Sep 17 00:00:00 2001 From: sotetero11 <106152149+SPTETERO@users.noreply.github.com> Date: Thu, 6 Jun 2024 14:09:04 +0900 Subject: [PATCH 3/3] feat: 59-resume detail --- src/api/resumeAPI.js | 6 + .../MyPage/CreateResume/createResume.js | 3 +- src/components/MyPage/MyInfo/myInfo.js | 2 +- .../MyPage/MyNewResume/myNewResume.js | 362 ------------------ src/components/MyPage/MyNewResume/styled.js | 89 ----- src/components/Resume/resume.js | 148 +++++-- 6 files changed, 126 insertions(+), 484 deletions(-) delete mode 100644 src/components/MyPage/MyNewResume/myNewResume.js delete mode 100644 src/components/MyPage/MyNewResume/styled.js diff --git a/src/api/resumeAPI.js b/src/api/resumeAPI.js index 8bc09aa..c193d66 100644 --- a/src/api/resumeAPI.js +++ b/src/api/resumeAPI.js @@ -4,7 +4,13 @@ export const resumeAPI = { getResume() { return axiosWithAuth.get("/resume"); }, + getResumeId(id) { + return axiosWithAuth.get(`/resume/${id}`); + }, postResume(data) { return axiosWithAuth.post("/resume", data); }, + removeResume(id) { + return axiosWithAuth.delete(`/resume/${id}`); + }, }; diff --git a/src/components/MyPage/CreateResume/createResume.js b/src/components/MyPage/CreateResume/createResume.js index 7be6c75..f3bbf71 100644 --- a/src/components/MyPage/CreateResume/createResume.js +++ b/src/components/MyPage/CreateResume/createResume.js @@ -129,7 +129,7 @@ const CreateResume = () => { certificates.push({ title: certificateName, startDate: certificateStartDate, - endDate: "", //날짜 입력란이 한개만 있음 + endDate: "2000-01-01", //날짜 입력란이 한개만 있음 introduction: certificateIntroduction, certificate_url: certificateUrl, }); @@ -241,6 +241,7 @@ const CreateResume = () => { homepages: homepages, }; + console.log(careers); console.log(data); resumeAPI .postResume(data) diff --git a/src/components/MyPage/MyInfo/myInfo.js b/src/components/MyPage/MyInfo/myInfo.js index c3aaad2..8266950 100644 --- a/src/components/MyPage/MyInfo/myInfo.js +++ b/src/components/MyPage/MyInfo/myInfo.js @@ -355,7 +355,7 @@ const MyInfo = ({ IsWithdrawal, innerRef }) => { justifyContent: "flex-end", }} > - SaveUserData()} isVisible={visible.step11}> + SaveUserData()} $isVisible={visible.step11}> 저장 취소 diff --git a/src/components/MyPage/MyNewResume/myNewResume.js b/src/components/MyPage/MyNewResume/myNewResume.js deleted file mode 100644 index 611decc..0000000 --- a/src/components/MyPage/MyNewResume/myNewResume.js +++ /dev/null @@ -1,362 +0,0 @@ -import { - Title, - Container, - Lesson, - InformationTag, - Input, - AddButton, - SaveButton, - CannelButton, - InformationContainter, -} from "./styled"; -import { ReactComponent as Line } from "../../../assets/myPage/myInfoVector1.svg"; -import { useState } from "react"; -import { resumeAPI } from "../../../api/resumeAPI"; - -const MyNewResume = () => { - const Save = async () => { - const data = { - title: "테스트", - description: "test", - jobCategory: "test", - jobSubcategory: "test", - gpa: 0, - totalScore: 0, - isPublic: true, - - careers: [], - certificates: [], - projects: [], - homepages: [], - activities: [], - }; - - resumeAPI - .postResume(data) - .then((res) => { - console.log(res); - }) - .catch((error) => {}); - }; - - return ( - - 신규 이력서 작성 - - - 기본 정보 - - -
- 이름 - - - - 성 - - -
- -
- - 닉네임 - - - - MBTI - - -
- -
- - 전화번호 - - -
- -
- - 생년월일 - - -
- -
- - 소속/학교 - - -
- -
- - 거주 지역 - - -
- - - 이력서 정보 - - -
- 직군 -
- -
- - -
- -
- 학점 - 스킬 -
-
- - -
- - - -
- 수상/자격증 - + 정보 추가 -
- -
- 수상 자격증 이름 - 수상 자격증 내용 -
- -
- - -
- -
- 수상 취득 기간 - 수상 자격증 관련 링크 -
-
- - -
- -
- {}} - > - 저장 - - 취소 -
- - - -
- 경력 - + 정보 추가 -
- - - -
- 프로젝트 - + 정보 추가 -
- - - -
- 외부활동 - + 정보 추가 -
- - - -
- 홈페이지 - + 정보 추가 -
- - - - - 자기소개서 - - - - - 첨부파일 - - - - - -
- { - Save(); - }} - > - 저장 - - 취소 -
- - ); -}; - -export default MyNewResume; diff --git a/src/components/MyPage/MyNewResume/styled.js b/src/components/MyPage/MyNewResume/styled.js deleted file mode 100644 index 2c21cc5..0000000 --- a/src/components/MyPage/MyNewResume/styled.js +++ /dev/null @@ -1,89 +0,0 @@ -import styled from "styled-components"; - -export const Container = styled.div` - margin-top: 90px; - width: 889px; - border: 2px solid; - border-radius: 12px; - border-color: #c9c9c9; - display: flex; - flex-direction: column; - align-items: flex-start; -`; - -export const Title = styled.label` - margin-top: 35px; - margin-left: 50px; - font-size: 24px; - font-weight: 700; -`; - -export const Lesson = styled.label` - margin-top: 35px; - margin-left: 50px; - font-size: 24px; - font-weight: 700; -`; - -export const InformationContainter = styled.div` - margin-left: auto; - margin-right: auto; - margin-top: 30px; - width: 849px; - border: 2px solid; - border-radius: 12px; - border-color: #c9c9c9; - - display: flex; - flex-direction: column; -`; - -export const InformationTag = styled.label` - font-size: 20px; - font-weight: 600; -`; - -export const Input = styled.input` - height: 33px; - border: 2px solid; - border-radius: 8px; - border-color: #c9c9c9; - font-size: 16px; - font-weight: 400; - text-align: center; -`; - -export const AddButton = styled.button` - width: 106px; - height: 33px; - border: 2px solid; - border-radius: 8px; - color: #377bff; - background-color: #ffffff; - cursor: pointer; -`; - -export const SaveButton = styled.button` - width: 64px; - height: 35px; - background-color: #376fff; - border: none; - border-radius: 9px; - font-size: 18px; - font-weight: 700; - color: #ffffff; - user-select: none; - cursor: pointer; -`; -export const CannelButton = styled.button` - width: 64px; - height: 35px; - background-color: #dedede; - border: none; - border-radius: 9px; - font-size: 18px; - font-weight: 700; - color: #646464; - user-select: none; - cursor: pointer; -`; diff --git a/src/components/Resume/resume.js b/src/components/Resume/resume.js index d00d06e..8de563f 100644 --- a/src/components/Resume/resume.js +++ b/src/components/Resume/resume.js @@ -1,8 +1,46 @@ +import { useEffect, useState } from "react"; +import { resumeAPI } from "../../api/resumeAPI"; import { Explain } from "../../pages/ResumeDetail/styles"; import { ColumnList, Gray } from "./styles"; import { Container, Title, Tag, Data } from "./styles"; +import { userAPI } from "../../api/userAPI"; + +const Resume = ({ resumeId }) => { + const [name, setNickName] = useState(""); + const [recruitment, setRecruitment] = useState(""); + const [category, setCategory] = useState(""); + const [introduce, setIntroduce] = useState(""); + + const [jobCategory, setJobCategory] = useState(""); + const [subJobCategory, setSubJobCategory] = useState(""); + const [gpa, setGpa] = useState(""); + const [techStacks, setTechStacks] = useState([]); + + const [certificates, setCertificates] = useState([]); + const [careers, setCareers] = useState([]); + const [activities, setActivities] = useState([]); + const [projects, setProjects] = useState([]); + const [homepages, setHomepages] = useState([]); + + useEffect((res) => { + resumeAPI + .getResumeId(14) + .then((res) => { + console.log(res.data.data); + + setJobCategory(res.data.data.jobCategory); + setSubJobCategory(res.data.data.jobSubcategory); + setGpa(res.data.data.gpa); + + setCertificates(res.data.data.certificates); + setCareers(res.data.data.careers); + setActivities(res.data.data.activities); + setProjects(res.data.data.projects); + setHomepages(res.data.data.homepages); + }) + .catch((error) => {}); + }, []); -const Resume = () => { return ( 이력서 정보 @@ -21,51 +59,24 @@ const Resume = () => { borderColor: "#C9C9C9", }} > - 기본 정보 - -
- - 이름 - 전화번호 - 생년월일 - 소속/학교 - 거주 지역 - - - 이름 - 010-1234-1234 - 2000.01.01 - 국민대학교 - 거주지역 - - - 성 - MBTI - - - 성 - ENFT - -
- 이력서 정보
직군 - 대분류 + {jobCategory} 학점 - 학점 추가 + {gpa} 소분류 - 소분류 + {subJobCategory} 스킬 @@ -94,6 +105,81 @@ const Resume = () => { 수상 자격증 내용 + + 프로젝트 +
+ 프로젝트명 + 2000.01.01 - 2000.01.01 +
+ 맡은 역활 + + + + 외부활동 +
+ 활동이름 + 2000.01.01 - 2000.01.01 +
+ 활동 설명 + + + + 홈페이지 +
+ 홈페이지 +
+ URL + + + + 경력 +
+ 업무 이름 + 2000.01.01 - 2000.01.01 +
+ 직무 + + 자기소개서 자기소개서 내용