Skip to content

Commit

Permalink
Merge branch 'develop' of https://github.com/URECA-PODONG/FrontEnd in…
Browse files Browse the repository at this point in the history
…to feat/#5
  • Loading branch information
EunSeok-222 committed Nov 6, 2024
2 parents 9e26997 + abfffaf commit 6a849ad
Show file tree
Hide file tree
Showing 30 changed files with 1,050 additions and 840 deletions.
4 changes: 0 additions & 4 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -43,10 +43,6 @@
"target": "https://openapi.naver.com/",
"changeOrigin": true,
"secure": false
},
"/proxy": {
"target": "http://localhost:8080/",
"changeOrigin": true
}
}
}
11 changes: 0 additions & 11 deletions setupProxy.js

This file was deleted.

138 changes: 61 additions & 77 deletions src/Router.jsx
Original file line number Diff line number Diff line change
@@ -1,70 +1,58 @@
import {
BrowserRouter,
Routes,
Route,
Outlet,
useLocation,
} from "react-router-dom";
import MainPage from "./pages/MainPage/MainPage.jsx";
import MainNav from "./components/common/MainNav.jsx";
import Footer from "./components/common/Footer";
import ScrollTop from "./components/common/ScrollTop.jsx";
import LoginPage from "./pages/LoginPage/LoginPage.jsx";
import NanumWrite from "./pages/NanumPage/NanumWrite.jsx";
import NanumList from "./pages/NanumPage/NanumList.jsx";
import NanumDetail from "./pages/NanumPage/NanumDetail.jsx";
import UserRegisterPage from "./pages/RegisterPage/UserRegisterPage.jsx";
import UserEditPage from "./pages/MyPage/UserEditPage.jsx";
import MyPage from "./pages/MyPage/MyPage.jsx";
import RegisterMissingSavePage from "./pages/MyPage/RegisterMissingSavePage.jsx";
import RegisterMissing from "./pages/MyPage/RegisterMissing.jsx";
import PetRegisterPage from "./pages/RegisterPage/PetRegisterPage.jsx";
import ShoppingDetail from "./pages/MainPage/ShoppingDetail.jsx";
import SideNav from "./components/common/SideNav.jsx";
import WalkPage from "./pages/WalkPage/WalkPage.jsx";
import WalkMapPage from "./pages/WalkPage/WalkMapPage.jsx";
import WalkJournalPage from "./pages/WalkPage/WalkJournalPage.jsx";
import Payment from "./pages/PaymentPage/Payment.jsx";
import PaymentEnd from "./pages/PaymentPage/PaymentEnd.jsx";
import PetEditPage from "./pages/MyPage/PetEditPage.jsx";
import PaymentHistory from "./pages/PaymentPage/PaymentHistory.jsx";
import ComunityWrite from "./pages/CommunityPage/CommunityWrite.jsx";
import CommunityList from "./pages/CommunityPage/CommunityList.jsx";
import CommunityDetail from "./pages/CommunityPage/CommunityDetail.jsx";
import HealthCare from "./pages/HealthCare/HealthCare.jsx";
import ShoppingCart from "./pages/ShoppingCart/ShoppingCart.jsx";
import { CartProvider } from "./pages/ShoppingCart/CartContext";
import PayCancelReq from "./pages/PaymentPage/PayCancelReq.jsx";
import PaymentCancelDone from "./pages/PaymentPage/PaymentCancelDone.jsx";
import RecommendedRoutesPage from "./pages/WalkPage/RecommendedRoutesPage.jsx";
import { BrowserRouter, Routes, Route, Outlet, useLocation } from 'react-router-dom';
import MainPage from './pages/MainPage/MainPage.jsx';
import MainNav from './components/common/MainNav.jsx';
import Footer from './components/common/Footer';
import ScrollTop from './components/common/ScrollTop.jsx';
import LoginPage from './pages/LoginPage/LoginPage.jsx';
import NanumWrite from './pages/NanumPage/NanumWrite.jsx';
import NanumList from './pages/NanumPage/NanumList.jsx';
import NanumDetail from './pages/NanumPage/NanumDetail.jsx';
import UserRegisterPage from './pages/RegisterPage/UserRegisterPage.jsx';
import UserEditPage from './pages/MyPage/UserEditPage.jsx';
import MyPage from './pages/MyPage/MyPage.jsx';
import RegisterMissingSavePage from './pages/MyPage/RegisterMissingSavePage.jsx';
import RegisterMissing from './pages/MyPage/RegisterMissing.jsx';
import PetRegisterPage from './pages/RegisterPage/PetRegisterPage.jsx';
import ShoppingDetail from './pages/MainPage/ShoppingDetail.jsx';
import SideNav from './components/common/SideNav.jsx';
import WalkPage from './pages/WalkPage/WalkPage.jsx';
import WalkMapPage from './pages/WalkPage/WalkMapPage.jsx';
import WalkJournalPage from './pages/WalkPage/WalkJournalPage.jsx';
import Payment from './pages/PaymentPage/Payment.jsx';
import PaymentEnd from './pages/PaymentPage/PaymentEnd.jsx';
import PetEditPage from './pages/MyPage/PetEditPage.jsx';
import PaymentHistory from './pages/PaymentPage/PaymentHistory.jsx';
import ComunityWrite from './pages/CommunityPage/CommunityWrite.jsx';
import CommunityList from './pages/CommunityPage/CommunityList.jsx';
import CommunityDetail from './pages/CommunityPage/CommunityDetail.jsx';
import HealthCare from './pages/HealthCare/HealthCare.jsx';
import ShoppingCart from './pages/ShoppingCart/ShoppingCart.jsx';
import { CartProvider } from './pages/ShoppingCart/CartContext';
import PayCancelReq from './pages/PaymentPage/PayCancelReq.jsx';
import PaymentCancelDone from './pages/PaymentPage/PaymentCancelDone.jsx';
import RecommendedRoutesPage from './pages/WalkPage/RecommendedRoutesPage.jsx';
import OrderList from './pages/OrderPage/OrderList.jsx';
import OrderDetail from './pages/OrderPage/OrderDetail.jsx';
import OrderCancel from './pages/OrderPage/OrderCancel.jsx';

function Router() {
return (
<BrowserRouter>

<CartProvider>
<ScrollTop />
<NavSelector />
<Routes>
<Route path="/" element={<Outlet />}>
<Route index element={<MainPage />} />
<Route path="login" element={<LoginPage />} />
<Route
path="shoppingDetail/:productId"
element={<ShoppingDetail />}
/>
<Route path="shoppingDetail/:productId" element={<ShoppingDetail />} />
<Route path="shoppingCart" element={<ShoppingCart />} />
<Route path="healthCare" element={<HealthCare />} />

<Route path="payment" element={<Payment />} />
<Route path="payCancelReq" element={<PayCancelReq />} />
<Route path="payCancelReq/:orderId" element={<PayCancelReq />} />
<Route path="paymentEnd" element={<PaymentEnd />} />
<Route path="paymentHistory" element={<PaymentHistory />} />
<Route path="paymentlist" element={<PaymentHistory />} />
<Route path="paymentCancelDone" element={<PaymentCancelDone />} />
<Route path="paymentCancelDone/:orderId" element={<PaymentCancelDone />} />

<Route path="mainpage/:userId" element={<MainPage />} />
<Route path="nanumList" element={<Outlet />}>
Expand All @@ -86,10 +74,7 @@ function Router() {
<Route path="map" element={<WalkMapPage />} />
<Route path="journal" element={<WalkJournalPage />} />
</Route>
<Route
path="walking/recommend"
element={<RecommendedRoutesPage />}
/>
<Route path="walking/recommend" element={<RecommendedRoutesPage />} />

<Route path="myPage/:userId" element={<Outlet />}>
<Route index element={<MyPage />} />
Expand All @@ -102,8 +87,7 @@ function Router() {

<Route path="orderList" element={<Outlet />}>
<Route index element={<OrderList />} />
<Route path="orderDetail" element={<OrderDetail />} />
<Route path="orderCancel" element={<OrderCancel />} />
<Route path="orderDetail/:orderId" element={<OrderDetail />} />
</Route>
</Route>
</Routes>
Expand All @@ -116,34 +100,34 @@ function NavSelector() {
const location = useLocation();
const path = location.pathname;

if (path === "/") {
if (path === '/') {
return <MainNav />;
}

const navPaths = [
"/shoppingDetail",
"/shoppingCart",
"/payment",
"/nanumList/write",
"/nanumList",
"/nanumDetail",
"/healthCare",
"/walking",
"/walkingRecord",
"/community",
"/communityDetail",
"/communityWrite",
"/myPage/editUserRegister",
"/myPage/editPetRegister",
"/myPage/missingRegister",
"/myPage/missingSave",
"/myPage",
"/orderList/orderDetail/orderCancel",
"/orderList/orderDetail",
"/orderList",
"/alert",
'/shoppingDetail',
'/shoppingCart',
'/payment',
'/nanumList/write',
'/nanumList',
'/nanumDetail',
'/healthCare',
'/walking',
'/walkingRecord',
'/community',
'/communityDetail',
'/communityWrite',
'/myPage/editUserRegister',
'/myPage/editPetRegister',
'/myPage/missingRegister',
'/myPage/missingSave',
'/myPage',
'/orderList/orderDetail/orderCancel',
'/orderList/orderDetail',
'/orderList',
'/alert',
];
const isNavPath = navPaths.some((navPath) => path.startsWith(navPath));
const isNavPath = navPaths.some(navPath => path.startsWith(navPath));

return isNavPath ? <SideNav /> : <MainNav />;
}
Expand Down
3 changes: 1 addition & 2 deletions src/apis/AxiosInstance.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,7 @@ const token = tokenString ? JSON.parse(tokenString) : null;
const Axios = axios.create({
// eslint-disable-next-line no-undef
baseURL: import.meta.env.VITE_BASE_URL,
// baseURL: "http://localhost:8080/api", // Replace with your actual API URL
// eslint-disable-next-line no-undef
withCredentials: true,
headers: {
Authorization: `Bearer ${token?.loginState?.data?.accessToken}`,
"Content-Type": "application/json",
Expand Down
2 changes: 1 addition & 1 deletion src/components/Register/UploadImg.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -99,4 +99,4 @@ const UploadImg = ({ imgPath, setImgPath }) => {
);
};

export default UploadImg;
export default UploadImg;
38 changes: 29 additions & 9 deletions src/components/common/MainNav.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,18 +3,26 @@ import styled from 'styled-components';
import { HiOutlineShoppingCart } from 'react-icons/hi';
import { FaRegUserCircle, FaRegBell } from 'react-icons/fa';
import { PiDogBold } from 'react-icons/pi';
import { Link } from 'react-router-dom';
import { Link,useNavigate,useParams } from 'react-router-dom';

const MainNav = () => {
const [isScrolled, setIsScrolled] = useState(false);
const navigate = useNavigate();

// localStorage에서 userId 가져오기
const [userId, setUserId] = useState(localStorage.getItem('userId'));

useEffect(() => {
const storedUserId = localStorage.getItem('userId');
if (storedUserId) {
setUserId(storedUserId);
}
}, [location.pathname]);


useEffect(() => {
const handleScroll = () => {
if (window.scrollY > 0) {
setIsScrolled(true);
} else {
setIsScrolled(false);
}
setIsScrolled(window.scrollY > 0);
};

window.addEventListener('scroll', handleScroll);
Expand All @@ -23,25 +31,37 @@ const MainNav = () => {
};
}, []);

const handleUserIconClick = () => {
if (userId) {
navigate(`/myPage/${userId}`); // userId가 있으면 마이페이지로 이동
} else {
navigate('/login'); // userId가 없으면 로그인 페이지로 이동
}
};

const icons = [
{ icon: <FaRegBell />, link: '/notifications' },
{ icon: <HiOutlineShoppingCart size={17} />, link: '/shoppingCart' },
{ icon: <FaRegUserCircle />, link: '/Login' },
];



return (
<>
<Navbar $isScrolled={isScrolled}>
<AnimalWrap>
<PiDogBold color="#FF6E00" />
<AnimalName>반려동물 이름</AnimalName>
<AnimalName>발바닥천국</AnimalName>
</AnimalWrap>
<NavIconWrap>
{icons.map((item, index) => (
<Link to={item.link} key={index}>
{item.icon}
</Link>
))}
{/* userId 존재 여부에 따라 동작하는 FaRegUserCircle 아이콘 */}
<span onClick={handleUserIconClick} style={{ cursor: 'pointer' }}>
<FaRegUserCircle />
</span>
</NavIconWrap>
</Navbar>
</>
Expand Down
Loading

0 comments on commit 6a849ad

Please sign in to comment.