Merge pull request #317 from readyvery/test

축제용 배포
readyvery · May 19, 2024 · 0364279 · 0364279
2 parents f97e672 + 6e0cd5b
commit 0364279
Show file tree

Hide file tree

Showing 25 changed files with 11,275 additions and 119 deletions.
diff --git a/public/images/test/test.png b/public/images/test/test.png
diff --git a/public/images/test2/test.png b/public/images/test2/test.png
diff --git a/public/images/test3/test.png b/public/images/test3/test.png
diff --git a/src/App.js b/src/App.js
@@ -30,6 +30,7 @@ import PaymentPage from "./pages/PaymentPage/PaymentPage";
 import PaymentFailPage from "./pages/PaymentPage/Redirect/PaymentFailPage";
 import PaymentLoadingPage from "./pages/PaymentPage/Redirect/PaymentLoadingPage";
 import Splash from "./pages/Splash/Splash";
+import FestivalBoothSearch from "./pages/StoreSearch/FestivalBoothSearch";
 import StoreSearchPage from "./pages/StoreSearch/StoreSearch";
 function App() {
   // const [cookies, , removeCookies] = useCookies();
@@ -56,52 +57,9 @@ function App() {
   const NewPaymentPage = Auth(PaymentPage, true, 2);
   const NewPaymentLoadingPage = Auth(PaymentLoadingPage, true, 2);
   const NewPaymentFailPage = Auth(PaymentFailPage, true, 2);
+  const NewFestivalBoothSearch = Auth(FestivalBoothSearch, true, 2);
   // const NewPackagingStatusPage = Auth(PackagingStatusPage, true);
 
-  // const minute = 1000 * 60 * 60 * 24; // 24시간
-  //const minute = 1000 * 60 * 10; // 10분
-  // const minute = 1000 * 10; // 10초
-  // // 주기적으로 실행되는 함수
-  // useInterval(() => {
-  //   const token = localStorage.getItem("accessToken");
-  //   console.log('local token: ', token);
-  //   console.log('isAuth: ', isAuth);
-  //   // 리프레시 토큰이 존재하고, 비어 있지 않은 경우
-  //   if (token) {
-  //     // http 요청에 사용될 헤더 설정과 함께 서버에 토큰 갱신 요청
-  //     let config = {
-  //       withCredentials: true,
-  //       headers: {
-  //         Authorization: `Bearer ${token ? token : cookies?.accessToken}`
-  //       }
-  //     };
-  //     console.log('AT 재발급');
-  //     axios
-  //       .get(apiUrl, config)
-  //       .then((response) => {
-  //         console.log(response);
-  //         // 현재 쿠키 삭제
-  //         if (response.status !== 200 ) {
-  //           message.info("다시 로그인해주세요.");
-  //           removeCookies();
-  //           localStorage.clear();
-  //           setIsAuth(false);
-  //           navigate("/login");
-  //         } else {
-  //           console.log("AT 재발급 성공! ");
-  //           console.log(cookies);
-  //           debugger;
-  //           cookies?.accessToken && localStorage.setItem("accessToken", cookies?.accessToken); // 로컬 스토리지에 AT 저장
-  //           removeCookies("accessToken"); // AT 쿠키 삭제
-  //         }
-  //       })
-  //       .catch((error) => {
-  //         console.error(error);
-  //         message.info("다시 로그인해주세요.");
-  //         navigate("/login");
-  //       });
-  //   }
-  // }, minute - 1000); // 24시간 주기에서 1분을 뺀 주기로 주기적 실행
 
   return (
     <div className="App">
@@ -163,6 +121,9 @@ function App() {
             />
             {/* 결제 실패 리다이렉트 페이지 */}
             <Route path="/payment/fail" element={<NewPaymentFailPage />} />
+
+            {/* 축제 부스 검색 페이지 */}
+            <Route path="/booth" element={<NewFestivalBoothSearch />} />
           </Routes>
         </Suspense>
       </RecoilRoot>

diff --git a/src/assets/images/banner2_readybarry.png b/src/assets/images/banner2_readybarry.png
diff --git a/src/assets/images/banner_readybarry.png b/src/assets/images/banner_readybarry.png
diff --git a/src/components/views/Header/Header.css b/src/components/views/Header/Header.css
@@ -103,6 +103,7 @@
 }
 
 .header_cart_home {
+  position: relative;
   margin-left: auto;
   width: 2rem;
   height: 2rem;

diff --git a/src/components/views/Header/Header.jsx b/src/components/views/Header/Header.jsx
@@ -25,11 +25,12 @@ const Header = ({ headerProps }) => {
     }
   }, [isOpen, isAuth]);
 
-  const handleCartClick = () => {
+  const handleCartClick = (path) => {
     if (!isAuth) {
       setIsOpen(!isOpen);
     } else {
-      navigate(`/cart`);
+      // navigate(`/cart`);
+      navigate(path, { replace: true }); // 조건에 따른 경로로 이동
     }
   };
 
@@ -47,7 +48,7 @@ const Header = ({ headerProps }) => {
             src={IMAGES.headerBack}
             alt="back"
             className="header_back"
-            style={{marginLeft:"1.56rem"}}
+            style={{ marginLeft: "1.56rem" }}
             // onClick={() => handleGoBack()}
             // onClick={() => navigate(headerProps.linkTo, { replace: true })}
             onClick={() => {
@@ -59,7 +60,7 @@ const Header = ({ headerProps }) => {
             }}
           />
           <span>{headerProps.pageName}</span>
-          <div className="homeAndCart" style={{marginRight:"1.56rem"}}>
+          <div className="homeAndCart" style={{ marginRight: "1.56rem" }}>
             {/* 현재 페이지가 홈이 아니고 장바구니 페이지가 아닌 경우에만 장바구니 아이콘 표시 */}
             {!isCartPage ? (
               <div className="homeAndCart">
@@ -113,12 +114,26 @@ const Header = ({ headerProps }) => {
               onClick={() => navigate(`/`, { replace: true })}
             />
             {/* 장바구니 (흰) */}
-            <img
-              src={IMAGES.homeCart}
-              alt="cart"
-              className="header_cart_home"
-              onClick={handleCartClick}
-            />
+            <div className="header_cart_home">
+              <img
+                src={IMAGES.homeCart}
+                alt="cart"
+                className="header_cart_home"
+                onClick={() => {
+                  let path = `/cart`; // 기본 경로 설정
+                  if (storeId && !isNaN(parseInt(storeId, 10))) {
+                    // storeId가 유효한 경우
+                    path += `?storeId=${storeId}`; // 기본적으로 storeId만 사용하여 경로 설정
+                    if (inout && !isNaN(parseInt(inout, 10))) {
+                      // inout도 유효한 경우
+                      path += `&inout=${inout}`; // inout 값을 경로에 추가
+                    }
+                  }
+                  handleCartClick(path);
+                }}
+              />
+              <CartItemCount />
+            </div>
           </div>
         </header>
       )}

diff --git a/src/components/views/Home/Banner/Banner.css b/src/components/views/Home/Banner/Banner.css
@@ -7,6 +7,12 @@
   height: 6.25rem;
   margin-top: 2.81rem;
 }
+/* 축제용 */
+.home_event_slider_benner_wrapper {
+  width: 100%;
+  display: flex;
+  justify-content: center;
+}
 
 /* 슬라이드 구성 요소 조정 */
 .home_event_slider {
@@ -28,7 +34,7 @@
 }
 /* 클릭시 테두리 제거 */
 .home_event_slider_benner:focus {
-  outline: none; 
+  outline: none;
 }
 /* 여기가 배너요소 크기 수정하는 곳입니다 */
 .home_event_slider_benner_wrapper .slick-slide {
@@ -46,7 +52,6 @@
   height: 6.25rem;
 }
 
-
 /* 배너 카운팅 */
 .home_event_slide_index {
   display: flex;
@@ -56,7 +61,7 @@
   top: 15%;
   right: 7%;
   transform: translate(-50%, -50%);
-/* 배너 크기 수정없으면 위 그대로  */
+  /* 배너 크기 수정없으면 위 그대로  */
 
   width: 1.8125rem;
   height: 0.6875rem;

diff --git a/src/components/views/Home/Banner/Banner.jsx b/src/components/views/Home/Banner/Banner.jsx
@@ -1,16 +1,21 @@
 import React, { useState } from "react";
+import { useNavigate } from "react-router-dom";
 import Slider from "react-slick";
 import "slick-carousel/slick/slick-theme.css";
 import "slick-carousel/slick/slick.css";
+import { IMAGES } from "../../../../constants/images";
 import "./Banner.css";
 
 const Banner = () => {
+  const navigate = useNavigate();
   const eventBanners = [
-    { bannerImg: "https://readyvery.com/statics/images/event/ic_home_event1.png" },
-    { bannerImg: "https://readyvery.com/statics/images/event/ic_home_event2.png" },
-    { bannerImg: "https://readyvery.com/statics/images/event/ic_home_event3.png" },
+    // { bannerImg: "https://readyvery.com/statics/images/event/ic_home_event1.png" },
+    // { bannerImg: "https://readyvery.com/statics/images/event/ic_home_event2.png" },
+    // { bannerImg: "https://readyvery.com/statics/images/event/ic_home_event3.png" },
+    { bannerImg: IMAGES.banner_img },
+    { bannerImg: IMAGES.banner2_img },
   ];
-  
+
   const [currentIndex, setCurrentIndex] = useState(0);
 
   const settings = {
@@ -26,12 +31,14 @@ const Banner = () => {
   return (
     <div className="home_event">
       <div className="home_event_slider_benner_wrapper">
-        <Slider {...settings} >
+         <Slider {...settings} >
           {eventBanners.map((item) => {
             return (
               <div
                 className="home_event_slider_benner"
                 key={item}
+                // onClick={() => navigate(`/search`)}
+                onClick={() => navigate(`/booth`)}
               >
                 <img src={item.bannerImg} alt={`Banner ${item}`} />
               </div>

diff --git a/src/components/views/PageComponent/OrderProgress.jsx b/src/components/views/PageComponent/OrderProgress.jsx
@@ -16,8 +16,8 @@ const OrderProgress = () => {
   const [degree, setDegree] = useState(-1);
   const [isOpen, setIsOpen] = useState(false);
   const [refreshKey, setRefreshKey] = useState(0);
-  const { estimatedTime, orderNum, progress, expectPoint } =
-    useFetchCurrentOrder(orderId, refreshKey);
+  const { estimatedTime, orderNum, progress } = 
+    useFetchCurrentOrder(orderId, refreshKey); // expectPoint 일시 삭제
   const cancelOrder = useCancelOrder();
   const [rotate, setRotate] = useState(false); //새로고침 클릭시 회전용
   const [debounceTimeout, setDebounceTimeout] = useState(null); // 디바운싱 상태
@@ -234,13 +234,13 @@ const OrderProgress = () => {
               </div>
             )}
 
-            {degree === 3 ? (
+            {/* {degree === 3 ? (
               <div className="order_progress__point">
                 <span className="order_progress__point_text">
                   <span>{expectPoint}</span>원 적립되었습니다
                 </span>
               </div>
-            ) : null}
+            ) : null} */}
           </div>
 
           {isOpen && (

diff --git a/src/components/views/StoreList/StoreList.jsx b/src/components/views/StoreList/StoreList.jsx
@@ -1,28 +1,43 @@
 import React from "react";
-import "./StoreList.css";
-import { IMAGES } from "../../../constants/images";
 import { useNavigate } from "react-router-dom";
+import { IMAGES } from "../../../constants/images";
 import useFetchSearch from "../../../hooks/useFetchSearch";
+import "./StoreList.css";
 
-const StoreList = ({ searchTerm = "" }) => {
+const StoreList = ({ searchTerm = "", cafe = false, booth = false }) => {
   const navigate = useNavigate();
   const stores = useFetchSearch();
+  let displayStores = [];
+
+  if (cafe && booth) {
+    displayStores = stores;
+  } else if (cafe) {
+    displayStores = stores.filter((item) => item.idx < 10);
+  } else if (booth) {
+    displayStores = stores.filter((item) => item.idx >= 10);
+  }
 
   // 검색어에 따라 필터링된 목록을 반환하는 로직
   const filteredStores = stores.filter((item) => {
     return item.name.toLowerCase().includes(searchTerm.toLowerCase());
   });
 
   // 검색어가 있을 경우 filteredStores를 사용하고, 없을 경우 기존 stores를 사용
-  const displayStores = searchTerm ? filteredStores : stores;
+  displayStores = searchTerm ? filteredStores : displayStores;
 
   return (
     <div className="store_list">
       {displayStores.map((item) => (
         <div
           key={item.idx}
           className="store_list_item"
-          onClick={() => navigate(`/packagingStatus?storeId=${item.idx}`)}
+          onClick={() => {
+            if (item.idx >= 10) {
+              navigate(`/store?storeId=${item.idx}&inout=2`);
+            } else {
+              navigate(`/packagingStatus?storeId=${item.idx}`);
+            }
+          }}
         >
           <img
             src={item.imgUrl}

diff --git a/src/constants/images.js b/src/constants/images.js
@@ -69,4 +69,8 @@ export const IMAGES = {
   check_red: require("../assets/images/check_red.png"),
   check_x_red: require("../assets/images/check_x_red.png"),
   find_logo: require("../assets/images/ic_find_logo.png"),
+
+  // 축제 배너 이미지 하드
+  banner_img: require("../assets/images/banner_readybarry.png"),
+  banner2_img: require("../assets/images/banner2_readybarry.png"),
 };
diff --git a/src/hoc/auth.jsx b/src/hoc/auth.jsx
@@ -22,26 +22,21 @@ function Auth(SpecificComponent, option, adminRoute = null) {
               Authorization: `Bearer ${token ? token : cookies?.accessToken}`
           }
         }).then((response) => {
-            console.log(response);
             // debugger;
             const { auth } = response.data; // 로그인 여부
             const { role } = response.data; // GUEST, USER, CEO
             console.log(auth, role, option);
-          console.log(cookies);
           if (cookies.accessToken) {
             if(!token && auth) {
               // 로그인 후 첫 접속
-              console.log('auth에서 첫 접속: ', cookies.accessToken);
               localStorage.setItem("accessToken", cookies.accessToken); // 로컬 스토리지에 AT 저장
-              // localStorage.setItem("expiredTime", moment().add(1, "days").format("yyyy-MM-DD HH:mm:ss")); // 만료시간 저장
               setIsAuth(true); // 로그인 여부 변경
               message.success("로그인에 성공하셨습니다.");
               removeCookie("accessToken"); // AT 쿠키 삭제
               return;
             } else if(token) {
               localStorage.clear();
               localStorage.setItem("accessToken", cookies.accessToken); // 로컬 스토리지에 AT 저장
-              // localStorage.setItem("expiredTime", moment().add(1, "days").format("yyyy-MM-DD HH:mm:ss")); // 만료시간 저장
               setIsAuth(true); // 로그인 여부 변경
               removeCookie("accessToken"); // AT 쿠키 삭제
               return;
@@ -57,7 +52,7 @@ function Auth(SpecificComponent, option, adminRoute = null) {
               localStorage.setItem("accessToken", cookies.accessToken);
               removeCookie("accessToken");
             }
-            if(option && location.pathname !== '/'){
+            if(option && location.pathname !== '/' && location.pathname !== '/booth' && location.pathname.split("?")[0] !== '/store'){
               navigate('/login');
               return;
             }

diff --git a/src/hooks/useFetchFoodOptionInfo.jsx b/src/hooks/useFetchFoodOptionInfo.jsx
@@ -17,7 +17,6 @@ const useFetchFoodOptionInfo = (storeId, foodieId, inout) => {
         setImgUrl(response.data?.imgUrl);
         setName(response.data?.name);
         setPrice(response.data?.price);
-        console.log("메뉴 데이터: ", response.data);
       } catch (error) {
         console.error("Error fetching food option info:", error);
       }

diff --git a/src/hooks/useFetchOrderDetails.jsx b/src/hooks/useFetchOrderDetails.jsx
@@ -37,7 +37,6 @@ const useFetchOrderDetails = (orderId) => {
         setSalePrice(response.data.salePrice);
         setStoreName(response.data.storeName);
         setStorePhone(response.data.storePhone);
-        console.log('order detail: ', response.data);
       } catch (error) {
         console.error("Error fetching order details:", error);
       }

diff --git a/src/hooks/useFetchQuickOrder.jsx b/src/hooks/useFetchQuickOrder.jsx
@@ -24,7 +24,6 @@ const useFetchQuickOrder = () => {
         }
       } else {
         // isAuth가 false일 때 quickOrder 상태를 초기화합니다.
-        console.log('fetching quick order is diabled');
         setQuickOrder([]);
       }
     };

diff --git a/src/hooks/useLogout.jsx b/src/hooks/useLogout.jsx
@@ -15,7 +15,6 @@ const useLogout = (removeCookie, setIsAuth) => {
           }
         });
         if(response.status === 200){
-          console.log(response);
           localStorage.clear();
           setIsAuth(false);
           message.success("로그아웃에 성공하셨습니다.");

diff --git a/src/pages/HomePage/Homepage.jsx b/src/pages/HomePage/Homepage.jsx
@@ -148,7 +148,7 @@ const HomePage = () => {
       <Banner />
 
       <div className="home_berry_pick">베리 PICK</div>
-      <StoreList />
+      <StoreList cafe={true} />
 
       <div className="home_business_info">
         <div className="home_business_info_name">ReadyVery</div>