diff --git a/src/components/commons/Nav.tsx b/src/components/commons/Nav.tsx
index fde536c1..53826968 100644
--- a/src/components/commons/Nav.tsx
+++ b/src/components/commons/Nav.tsx
@@ -3,6 +3,8 @@ import { useState, useEffect } from 'react';
import { useNavigate, useLocation } from 'react-router-dom';
import { NaviLookBlackIc, NaviPromiseBlackIc, NaviMyBlackIc } from '../../assets/svgs';
import { getRole } from '@utils/storage';
+import { AutoCloseModal } from './modal/AutoCloseModal';
+import { ComingSoonImg } from '@assets/images';
const Nav = () => {
const navigate = useNavigate();
@@ -10,6 +12,7 @@ const Nav = () => {
const userRole = getRole();
const [currNav, setCurrNav] = useState(location.pathname);
+ const [showModal, setShowModal] = useState(false);
useEffect(() => {
if (currNav !== location.pathname) {
@@ -21,36 +24,43 @@ const Nav = () => {
// 유저가 후배일 경우 접근 가능한 곳 : 둘러보기, 나의 약속
// 접근 불가능한 곳은 클릭 안되고, 라우팅 처리 안됨
const handleOnClickNav = (nav: string) => {
- if (userRole === 'JUNIOR') {
- if (nav === '둘러보기') {
- setCurrNav('/juniorPromise');
- } else if (nav === '나의 약속') {
+ switch (nav) {
+ case '둘러보기':
+ userRole === 'JUNIOR' ? setCurrNav('/juniorPromise') : setShowModal(true);
+ break;
+ case '나의 약속':
setCurrNav('/promiseList');
- }
- } else if (userRole === 'SENIOR') {
- if (nav === '나의 약속') {
- setCurrNav('/promiseList');
- }
+ break;
+ case '마이페이지':
+ setShowModal(true);
+ break;
}
};
return (
-
- userRole === 'JUNIOR' && handleOnClickNav('둘러보기')}
- disabled={userRole === 'SENIOR'}>
-
- 둘러보기
-
- handleOnClickNav('나의 약속')}>
-
- 나의 약속
-
- userRole === 'JUNIOR' && handleOnClickNav('마이페이지')} disabled={true}>
-
- 마이페이지
-
-
+ <>
+
+ handleOnClickNav('둘러보기')} $disabled={userRole === 'SENIOR'}>
+
+ 둘러보기
+
+ handleOnClickNav('나의 약속')}>
+
+ 나의 약속
+
+ handleOnClickNav('마이페이지')} $disabled={true}>
+
+ 마이페이지
+
+
+
+ setShowModal(show)}>
+
+
+ >
);
};
@@ -70,14 +80,14 @@ const Wrapper = styled.nav`
background-color: ${({ theme }) => theme.colors.grayScaleWhite};
`;
-const TapContainer = styled.div<{ disabled?: boolean }>`
+const TapContainer = styled.div<{ $disabled?: boolean }>`
display: flex;
flex-direction: column;
gap: 0.5rem;
justify-content: center;
align-items: center;
- cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};
+ cursor: ${({ $disabled }) => ($disabled ? 'not-allowed' : 'pointer')};
`;
const TapContent = styled.span<{ $isActive: boolean }>`
diff --git a/src/components/commons/modal/AutoCloseModal.tsx b/src/components/commons/modal/AutoCloseModal.tsx
index b0f47537..d6a3f0c2 100644
--- a/src/components/commons/modal/AutoCloseModal.tsx
+++ b/src/components/commons/modal/AutoCloseModal.tsx
@@ -5,7 +5,7 @@ import { useNavigate } from 'react-router-dom';
interface AutoCloseModalPropType {
text: string;
showModal: boolean;
- handleShowModal: (type: boolean) => void;
+ handleShowModal: (show: boolean) => void;
children: React.ReactNode;
path?: string;
}
diff --git a/src/pages/juniorPromise/apis/getSeniorProfile.ts b/src/pages/juniorPromise/apis/getSeniorProfile.ts
index b6c563ad..f0132388 100644
--- a/src/pages/juniorPromise/apis/getSeniorProfile.ts
+++ b/src/pages/juniorPromise/apis/getSeniorProfile.ts
@@ -25,7 +25,7 @@ export const getSeniorProfile = async (fields: string[], positions: string[]): P
const positionQuery = positions.map((position) => `position=${position}`).join('&');
const queryString = fieldQuery && positionQuery ? `${fieldQuery}&${positionQuery}` : `${fieldQuery}${positionQuery}`;
try {
- const response = await authAxios.get(`/v1/senior/search?${queryString}`);
+ const response = await authAxios.get(`/api/v1/senior/search?${queryString}`);
return response.data;
} catch (error) {
diff --git a/src/pages/juniorPromiseRequest/apis/getSeniorTimeAxios.ts b/src/pages/juniorPromiseRequest/apis/getSeniorTimeAxios.ts
index 3b6d7d45..f104f900 100644
--- a/src/pages/juniorPromiseRequest/apis/getSeniorTimeAxios.ts
+++ b/src/pages/juniorPromiseRequest/apis/getSeniorTimeAxios.ts
@@ -3,8 +3,8 @@ import { authAxios } from '@utils/apis';
export const getSeniorTimeAxios = async (seniorId: number) => {
try {
- const response = await authAxios.get(`/v1/senior/time/${seniorId}`);
- // console.log(response.data.data.preferredTimeList);
+ const response = await authAxios.get(`/api/v1/senior/time/${seniorId}`);
+
return response.data.data.preferredTimeList;
} catch (error) {
console.log(error);
diff --git a/src/pages/juniorPromiseRequest/apis/postAppointment.ts b/src/pages/juniorPromiseRequest/apis/postAppointment.ts
index c052cb64..251e75fd 100644
--- a/src/pages/juniorPromiseRequest/apis/postAppointment.ts
+++ b/src/pages/juniorPromiseRequest/apis/postAppointment.ts
@@ -16,9 +16,8 @@ export interface postAppointmentType {
export const postAppointment = async ({ seniorId, topic, personalTopic, timeList }: postAppointmentType) => {
try {
- const response = await authAxios.post('/v1/appointment', { seniorId, topic, personalTopic, timeList });
+ const response = await authAxios.post('/api/v1/appointment', { seniorId, topic, personalTopic, timeList });
- // console.log(response.data);
return response.data;
} catch (error) {
console.log(error);
diff --git a/src/pages/login/apis/loginAxios.ts b/src/pages/login/apis/loginAxios.ts
index e42631f3..1d45f605 100644
--- a/src/pages/login/apis/loginAxios.ts
+++ b/src/pages/login/apis/loginAxios.ts
@@ -2,7 +2,7 @@ import { axios } from '@utils/apis';
export const loginAxios = (authorizationCode: string) => {
return axios.post(
- '/v1/auth/login',
+ '/api/v1/auth/login',
{
redirectUri: import.meta.env.VITE_APP_GOOGLE_AUTH_REDIRECT_URI,
socialType: 'GOOGLE',
diff --git a/src/pages/onboarding/apis/businesscardAxios.ts b/src/pages/onboarding/apis/businesscardAxios.ts
index c3164771..234a810c 100644
--- a/src/pages/onboarding/apis/businesscardAxios.ts
+++ b/src/pages/onboarding/apis/businesscardAxios.ts
@@ -5,7 +5,7 @@ export const businessCardAxios = async (file: File) => {
const formData = new FormData();
formData.append('businessCardImage', file);
- const response = await authAxios.patch('/v1/businesscard-image', formData, {
+ const response = await authAxios.patch('/api/v1/businesscard-image', formData, {
headers: {
'Content-Type': 'multipart/form-data',
},
diff --git a/src/pages/onboarding/apis/joinAxios.ts b/src/pages/onboarding/apis/joinAxios.ts
index 07dbaf74..a92c3bdf 100644
--- a/src/pages/onboarding/apis/joinAxios.ts
+++ b/src/pages/onboarding/apis/joinAxios.ts
@@ -5,5 +5,5 @@ export const joinAxios = (requestBody: JoinPropType) => {
// 불필요한 데이터 필터링
const { imageFile, ...request } = requestBody;
- return authAxios.patch('/v1/auth/join', { ...request, isSubscribed: requestBody.isSubscribed[4] });
+ return authAxios.patch('/api/v1/auth/join', { ...request, isSubscribed: requestBody.isSubscribed[4] });
};
diff --git a/src/pages/onboarding/apis/nicknameAxios.ts b/src/pages/onboarding/apis/nicknameAxios.ts
index bf7915e3..fb048053 100644
--- a/src/pages/onboarding/apis/nicknameAxios.ts
+++ b/src/pages/onboarding/apis/nicknameAxios.ts
@@ -2,7 +2,7 @@ import { axios } from "@utils/apis"
export const nicknameAxios = (nickname: string) => {
return axios.post(
- '/v1/nickname',
+ '/api/v1/nickname',
{
nickname
},
diff --git a/src/pages/onboarding/apis/ocrAxios.ts b/src/pages/onboarding/apis/ocrAxios.ts
index 19bf8990..2b29d8bd 100644
--- a/src/pages/onboarding/apis/ocrAxios.ts
+++ b/src/pages/onboarding/apis/ocrAxios.ts
@@ -2,7 +2,7 @@ import { axios } from '@utils/apis';
export const ocrUnivAxios = (imageFile: File) => {
return axios.post(
- '/v1/ocr/univ',
+ '/api/v1/ocr/univ',
{
imageFile,
},
@@ -16,7 +16,7 @@ export const ocrUnivAxios = (imageFile: File) => {
export const ocrNameCardAxios = (imageFile: File) => {
return axios.post(
- '/v1/ocr/business-card',
+ '/api/v1/ocr/business-card',
{
imageFile,
},
diff --git a/src/pages/onboarding/apis/phoneAxios.ts b/src/pages/onboarding/apis/phoneAxios.ts
index 548393d0..3162955e 100644
--- a/src/pages/onboarding/apis/phoneAxios.ts
+++ b/src/pages/onboarding/apis/phoneAxios.ts
@@ -2,7 +2,7 @@ import { axios } from "@utils/apis"
export const phoneVerifyAxios = (phoneNumber: string) => {
return axios.post(
- '/v1/phone/verify',
+ '/api/v1/phone/verify',
{
phoneNumber,
}
@@ -16,7 +16,7 @@ export interface phoneVerifycodePropType {
export const phoneVerifycodeAxios = ({ phoneNumber, verificationCode }: phoneVerifycodePropType) => {
return axios.post(
- '/v1/phone/verifycode',
+ '/api/v1/phone/verifycode',
{
phoneNumber,
verificationCode,
diff --git a/src/pages/onboarding/apis/profileImageAxios.ts b/src/pages/onboarding/apis/profileImageAxios.ts
index 660d86ec..3442c665 100644
--- a/src/pages/onboarding/apis/profileImageAxios.ts
+++ b/src/pages/onboarding/apis/profileImageAxios.ts
@@ -1,7 +1,7 @@
import { authAxios, axios } from '@utils/apis';
export const presignedUrlAxios = () => {
- return authAxios.get('/v1/image');
+ return authAxios.get('/api/v1/image');
};
export const uploadProfileImageAxios = async (url: string, file: File) => {
diff --git a/src/pages/onboarding/apis/searchAxios.ts b/src/pages/onboarding/apis/searchAxios.ts
index cf3e83d8..4f48c8d5 100644
--- a/src/pages/onboarding/apis/searchAxios.ts
+++ b/src/pages/onboarding/apis/searchAxios.ts
@@ -1,7 +1,7 @@
import { axios } from '@utils/apis';
export const univNameAxios = (univName: string) => {
- return axios.get('/v1/search/univ', {
+ return axios.get('/api/v1/search/univ', {
params: {
univName,
},
@@ -9,7 +9,7 @@ export const univNameAxios = (univName: string) => {
};
export const departmentAxios = (univName: string, deptName: string) => {
- return axios.get('/v1/search/dept', {
+ return axios.get('/api/v1/search/dept', {
params: {
univName,
deptName,
diff --git a/src/pages/onboarding/apis/univAxios.ts b/src/pages/onboarding/apis/univAxios.ts
index f442843b..bb81bab7 100644
--- a/src/pages/onboarding/apis/univAxios.ts
+++ b/src/pages/onboarding/apis/univAxios.ts
@@ -8,7 +8,7 @@ export interface univVerifyPropType {
export const univVerifyAxios = ({ email, univName }: univVerifyPropType) => {
return axios.post(
- '/v1/univ/verify',
+ '/api/v1/univ/verify',
{
email,
univName,
@@ -19,7 +19,7 @@ export const univVerifyAxios = ({ email, univName }: univVerifyPropType) => {
export const univVerifycodeAxios = ({ email, univName, code }: univVerifyPropType) => {
return axios.post(
- '/v1/univ/verifycode',
+ '/api/v1/univ/verifycode',
{
email,
univName,
diff --git a/src/pages/promiseDetail/apis/getPromiseDetail.ts b/src/pages/promiseDetail/apis/getPromiseDetail.ts
index 342e6ad8..3f56ccb9 100644
--- a/src/pages/promiseDetail/apis/getPromiseDetail.ts
+++ b/src/pages/promiseDetail/apis/getPromiseDetail.ts
@@ -3,7 +3,7 @@ import { authAxios } from '@utils/apis';
export const getPromiseDetail = async (appointmentId: number) => {
try {
- const response = await authAxios.get(`/v1/appointment/${appointmentId}`);
+ const response = await authAxios.get(`/api/v1/appointment/${appointmentId}`);
// console.log(response.data.data);
return response.data.data;
} catch (error) {
diff --git a/src/pages/promiseDetail/apis/patchSeniorPromiseAccept.ts b/src/pages/promiseDetail/apis/patchSeniorPromiseAccept.ts
index 85f08178..c75b6d36 100644
--- a/src/pages/promiseDetail/apis/patchSeniorPromiseAccept.ts
+++ b/src/pages/promiseDetail/apis/patchSeniorPromiseAccept.ts
@@ -15,7 +15,7 @@ export interface patchSeniorAcceptRequestType {
export const patchSeniorAccept = async ({ appointmentId, googleMeetLink, timeList }: patchSeniorAcceptRequestType) => {
try {
- const response = await authAxios.patch('/v1/appointment/accept', {
+ const response = await authAxios.patch('/api/v1/appointment/accept', {
appointmentId,
googleMeetLink,
timeList,
diff --git a/src/pages/promiseDetail/apis/patchSeniorReject.ts b/src/pages/promiseDetail/apis/patchSeniorReject.ts
index 8d79e781..3d1d095a 100644
--- a/src/pages/promiseDetail/apis/patchSeniorReject.ts
+++ b/src/pages/promiseDetail/apis/patchSeniorReject.ts
@@ -13,7 +13,7 @@ export const patchSeniorReject = async ({
rejectDetail,
}: patchSeniorRejectRequestType) => {
try {
- const response = await authAxios.patch('/v1/appointment/reject', {
+ const response = await authAxios.patch('/api/v1/appointment/reject', {
appointmentId,
rejectReason,
rejectDetail,
diff --git a/src/pages/promiseDetail/apis/postGoogleMeetLink.ts b/src/pages/promiseDetail/apis/postGoogleMeetLink.ts
index 8042a5ed..5e0d42a3 100644
--- a/src/pages/promiseDetail/apis/postGoogleMeetLink.ts
+++ b/src/pages/promiseDetail/apis/postGoogleMeetLink.ts
@@ -3,7 +3,7 @@ import { authAxios } from '@utils/apis';
export const postGoogleMeetLink = async () => {
try {
- const response = await authAxios.post('/v1/google-meet');
+ const response = await authAxios.post('/api/v1/google-meet');
// console.log(response.data.data.googleMeet);
return response.data.data.googleMeet;
} catch (err) {
diff --git a/src/pages/promiseList/PromiseListPage.tsx b/src/pages/promiseList/PromiseListPage.tsx
index 86736879..61246a19 100644
--- a/src/pages/promiseList/PromiseListPage.tsx
+++ b/src/pages/promiseList/PromiseListPage.tsx
@@ -9,8 +9,12 @@ import { useGetPromiseList } from './hooks/queries';
import Loading from '@components/commons/Loading';
import { getRole } from '@utils/storage';
import ErrorPage from '@pages/errorPage/ErrorPage';
+import { AutoCloseModal } from '@components/commons/modal/AutoCloseModal';
+import { useState } from 'react';
+import img_modal_accept from '@assets/images/img_modal_accept.png';
const PromiseListPage = () => {
+ const [showModal, setShowModal] = useState(false);
const userRole = getRole() + '';
const { myNickname, pending, scheduled, past, isLoading, isError } = useGetPromiseList();
@@ -20,7 +24,7 @@ const PromiseListPage = () => {
return (
<>
-
+ setShowModal(true)} bgColor="gray" />
@@ -34,6 +38,13 @@ const PromiseListPage = () => {
+
+ setShowModal(show)}>
+
+
>
);
};
@@ -56,3 +67,8 @@ const RecentLayout = styled.div`
width: 100vw;
padding: 1.5rem 2rem 0;
`;
+
+const ModalImg = styled.img`
+ width: 27rem;
+ height: 17.2rem;
+`;
diff --git a/src/pages/promiseList/apis/getGoogleMeetLink.ts b/src/pages/promiseList/apis/getGoogleMeetLink.ts
index b4d3022b..64970e99 100644
--- a/src/pages/promiseList/apis/getGoogleMeetLink.ts
+++ b/src/pages/promiseList/apis/getGoogleMeetLink.ts
@@ -3,7 +3,7 @@ import { authAxios } from '@utils/apis';
export const getGoogleMeetLink = async (appointmentId: number) => {
try {
- const response = await authAxios.get(`/v1/google-meet/${appointmentId}`);
+ const response = await authAxios.get(`/api/v1/google-meet/${appointmentId}`);
// console.log(response.data.data.googleMeetLink);
return response.data.data.googleMeetLink;
} catch (error) {
diff --git a/src/pages/promiseList/apis/getPromiseList.ts b/src/pages/promiseList/apis/getPromiseList.ts
index 7ea5219f..ce4d762b 100644
--- a/src/pages/promiseList/apis/getPromiseList.ts
+++ b/src/pages/promiseList/apis/getPromiseList.ts
@@ -3,7 +3,7 @@ import { authAxios } from '@utils/apis';
export const getPromiseList = async () => {
try {
- const response = await authAxios.get(`/v1/appointment`);
+ const response = await authAxios.get(`/api/v1/appointment`);
// console.log(response.data);
return response.data.data;
} catch (error) {
diff --git a/src/pages/seniorProfile/apis/getSeniorProfileAxios.ts b/src/pages/seniorProfile/apis/getSeniorProfileAxios.ts
index 826dcf3c..5590da05 100644
--- a/src/pages/seniorProfile/apis/getSeniorProfileAxios.ts
+++ b/src/pages/seniorProfile/apis/getSeniorProfileAxios.ts
@@ -2,6 +2,6 @@ import { authAxios } from "@utils/apis"
export const getSeniorProfileAxios = (seniorId: string) => {
return authAxios.get(
- `/v1/senior/${seniorId}`
+ `/api/v1/senior/${seniorId}`
)
}
\ No newline at end of file
diff --git a/src/pages/seniorProfile/apis/seniorCardAxios.ts b/src/pages/seniorProfile/apis/seniorCardAxios.ts
index 203cb9bb..607ed31e 100644
--- a/src/pages/seniorProfile/apis/seniorCardAxios.ts
+++ b/src/pages/seniorProfile/apis/seniorCardAxios.ts
@@ -2,6 +2,6 @@ import { authAxios } from "@utils/apis"
export const seniorCardAxios = (seniorId: string) => {
return authAxios.get(
- `/v1/senior/card/${seniorId}`
+ `/api/v1/senior/card/${seniorId}`
)
}
\ No newline at end of file
diff --git a/src/pages/seniorProfile/apis/seniorProfileAxios.ts b/src/pages/seniorProfile/apis/seniorProfileAxios.ts
index d1d7c1c5..b39d3473 100644
--- a/src/pages/seniorProfile/apis/seniorProfileAxios.ts
+++ b/src/pages/seniorProfile/apis/seniorProfileAxios.ts
@@ -2,7 +2,7 @@ import { seniorProfileAPIType } from '@pages/seniorProfile/types';
import { authAxios } from '@utils/apis';
export const seniorProfileAxios = ({ catchphrase, career, award, story, preferredTimeList }: seniorProfileAPIType) => {
- return authAxios.patch('/v1/senior/profile', {
+ return authAxios.patch('/api/v1/senior/profile', {
catchphrase,
career,
award,
diff --git a/src/utils/apis/index.ts b/src/utils/apis/index.ts
index 05884a51..35862b49 100644
--- a/src/utils/apis/index.ts
+++ b/src/utils/apis/index.ts
@@ -1,15 +1,17 @@
import { getToken } from '@utils/storage';
import * as _axios from 'axios';
+const baseUrl = import.meta.env.VITE_APP_API_BASE_URL;
+
export const axios = _axios.default.create({
- baseURL: '/api',
+ baseURL: `${baseUrl}`,
headers: {
'Content-Type': 'application/json',
},
});
export const authAxios = _axios.default.create({
- baseURL: '/api',
+ baseURL: `${baseUrl}`,
headers: {
'Content-Type': 'application/json',
},