UPbrella · ShinChanU · Sep 25, 2023 · Sep 13, 2023 · Sep 13, 2023 · Sep 13, 2023
diff --git a/.github/workflows/release-dev.yml b/.github/workflows/release-dev.yml
@@ -37,11 +37,17 @@ jobs:
           VITE_NAVER_MAP_API_KEY: ${{ secrets.VITE_NAVER_MAP_API_KEY }}
           VITE_KAKAO_MAP_API_KEY: ${{ secrets.VITE_KAKAO_MAP_API_KEY }}
           VITE_KAKAO_LOGIN_REST_API_KEY: ${{ secrets.VITE_KAKAO_LOGIN_REST_API_KEY }}
+          VITE_EMAIL_SERVICE_ID: ${{ secrets.VITE_EMAIL_SERVICE_ID }}
+          VITE_EMAIL_TEMPLATE_ID: ${{ secrets.VITE_EMAIL_TEMPLATE_ID}}
+          VITE_EMAIL_PUB_KEY: ${{ secrets.VITE_EMAIL_PUB_KEY}}
         run: |
           echo "VITE_UPBRELLA_API_BASE_URL=${VITE_UPBRELLA_API_BASE_URL}" >> .env
           echo "VITE_NAVER_MAP_API_KEY=${VITE_NAVER_MAP_API_KEY}" >> .env
           echo "VITE_KAKAO_MAP_API_KEY=${VITE_KAKAO_MAP_API_KEY}" >> .env
           echo "VITE_KAKAO_LOGIN_REST_API_KEY=${VITE_KAKAO_LOGIN_REST_API_KEY}" >> .env
+          echo "VITE_EMAIL_SERVICE_ID"=${VITE_EMAIL_SERVICE_ID} >> .env
+          echo "VITE_EMAIL_TEMPLATE_ID"=${VITE_EMAIL_TEMPLATE_ID} >> .env
+          echo "VITE_EMAIL_PUB_KEY"=${VITE_EMAIL_PUB_KEY} >> .env
 
       - name: Set node@v1
         uses: actions/setup-node@v3

diff --git a/.github/workflows/release-production.yml b/.github/workflows/release-production.yml
@@ -55,11 +55,17 @@ jobs:
           VITE_NAVER_MAP_API_KEY: ${{ secrets.VITE_NAVER_MAP_API_KEY }}
           VITE_KAKAO_MAP_API_KEY: ${{ secrets.VITE_KAKAO_MAP_API_KEY }}
           VITE_KAKAO_LOGIN_REST_API_KEY: ${{ secrets.VITE_KAKAO_LOGIN_REST_API_KEY }}
+          VITE_EMAIL_SERVICE_ID: ${{ secrets.VITE_EMAIL_SERVICE_ID }}
+          VITE_EMAIL_TEMPLATE_ID: ${{ secrets.VITE_EMAIL_TEMPLATE_ID}}
+          VITE_EMAIL_PUB_KEY: ${{ secrets.VITE_EMAIL_PUB_KEY}}
         run: |
           echo "VITE_UPBRELLA_API_BASE_URL=${VITE_UPBRELLA_API_BASE_URL}" >> .env
           echo "VITE_NAVER_MAP_API_KEY=${VITE_NAVER_MAP_API_KEY}" >> .env
           echo "VITE_KAKAO_MAP_API_KEY=${VITE_KAKAO_MAP_API_KEY}" >> .env
           echo "VITE_KAKAO_LOGIN_REST_API_KEY=${VITE_KAKAO_LOGIN_REST_API_KEY}" >> .env
+          echo "VITE_EMAIL_SERVICE_ID"=${VITE_EMAIL_SERVICE_ID} >> .env
+          echo "VITE_EMAIL_TEMPLATE_ID"=${VITE_EMAIL_TEMPLATE_ID} >> .env
+          echo "VITE_EMAIL_PUB_KEY"=${VITE_EMAIL_PUB_KEY} >> .env
 
       - name: Set up Node.js
         uses: actions/setup-node@v3

diff --git a/index.html b/index.html
@@ -1,21 +1,49 @@
 <!DOCTYPE html>
 <html lang="ko">
+  <head>
+    <!-- Google Tag Manager -->
+    <script>
+      (function (w, d, s, l, i) {
+        w[l] = w[l] || [];
+        w[l].push({ "gtm.start": new Date().getTime(), event: "gtm.js" });
+        var f = d.getElementsByTagName(s)[0],
+          j = d.createElement(s),
+          dl = l != "dataLayer" ? "&l=" + l : "";
+        j.async = true;
+        j.src = "https://www.googletagmanager.com/gtm.js?id=" + i + dl;
+        f.parentNode.insertBefore(j, f);
+      })(window, document, "script", "dataLayer", "GTM-5PKB9KPL");
+    </script>
+    <!-- End Google Tag Manager -->
 
-<head>
-  <meta charset="UTF-8" />
-  <link rel="icon" type="image/svg+xml" href="/src/assets/main_logo.svg" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>UPbrella | 공유 우산 플랫폼</title>
-  <script type="text/javascript"
-    src="//dapi.kakao.com/v2/maps/sdk.js?appkey=<%= kakaoKey %>&libraries=services"></script>
-  <!-- Naver Map  -->
-  <script type="text/javascript"
-    src="https://openapi.map.naver.com/openapi/v3/maps.js?ncpClientId=<%= naverKey %>"></script>
-</head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/src/assets/main_logo.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>UPbrella | 공유 우산 플랫폼</title>
+    <script
+      type="text/javascript"
+      src="//dapi.kakao.com/v2/maps/sdk.js?appkey=<%= kakaoKey %>&libraries=services"
+    ></script>
+    <!-- Naver Map  -->
+    <script
+      type="text/javascript"
+      src="https://openapi.map.naver.com/openapi/v3/maps.js?ncpClientId=<%= naverKey %>"
+    ></script>
+  </head>
 
-<body>
-  <div id="root"></div>
-  <script type="module" src="/src/main.tsx"></script>
-</body>
+  <body>
+    <!-- Google Tag Manager (noscript) -->
+    <noscript
+      ><iframe
+        src="https://www.googletagmanager.com/ns.html?id=GTM-5PKB9KPL"
+        height="0"
+        width="0"
+        style="display: none; visibility: hidden"
+      ></iframe
+    ></noscript>
+    <!-- End Google Tag Manager (noscript) -->
 
-</html>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -5,6 +5,7 @@
   "type": "module",
   "scripts": {
     "start": "vite --open --host 0.0.0.0 --port 3000",
+    "dev": "vite --force",
     "build": "tsc && vite build",
     "lint": "eslint src --ext ts,tsx --cache --max-warnings 0",
     "preview": "vite preview",
@@ -17,6 +18,7 @@
     "lint-staged": "lint-staged"
   },
   "dependencies": {
+    "@emailjs/browser": "^3.11.0",
     "@emotion/react": "^11.11.1",
     "@emotion/styled": "^11.11.0",
     "@mui/icons-material": "^5.11.16",
@@ -27,6 +29,7 @@
     "file-saver": "^2.0.5",
     "primeicons": "^6.0.1",
     "primereact": "^9.6.2",
+    "qrcode.react": "^3.1.0",
     "react": "^18.2.0",
     "react-daum-postcode": "^3.1.3",
     "react-dom": "^18.2.0",
@@ -35,6 +38,7 @@
     "react-query": "^3.39.3",
     "react-router-dom": "^6.14.1",
     "recoil": "^0.7.7",
+    "recoil-persist": "^5.1.0",
     "swiper": "^10.0.4",
     "vite-plugin-html": "^3.2.0",
     "xlsx": "^0.18.5"

diff --git a/src/App.tsx b/src/App.tsx
@@ -11,7 +11,11 @@ import NotFound from "@/components/pages/not-found/NotFound";
 import "primereact/resources/themes/lara-light-indigo/theme.css"; //theme
 import "primereact/resources/primereact.min.css"; //core css
 import "primeicons/primeicons.css";
-import React from "react";
+import PrivateRoutes from "./utils/PrivateRoutes";
+import { Suspense } from "react";
+import UpbrellaStoryPage from "@/components/pages/story/UpbrellaStoryPage";
+import AdminRoutes from "@/utils/AdminRoutes";
+import InfoPage from "@/components/pages/Info/InfoPage";
 
 const queryClient = new QueryClient({
   defaultOptions: {
@@ -27,7 +31,7 @@ const queryClient = new QueryClient({
 function App() {
   return (
     <RecoilRoot>
-      <React.Suspense fallback={<div>Loading...</div>}>
+      <Suspense>
         <QueryClientProvider client={queryClient}>
           <Toaster
             position="top-center"
@@ -41,20 +45,29 @@ function App() {
               },
             }}
           />
-          <div className="bg-cover bg-basic">
-            <div className="max-w-[1440px] min-h-[100vh] px-40 mx-auto flex flex-col sm:px-0">
-              <Routes>
-                {/* Not Found Page */}
-                <Route path="/*" element={<NotFound />} />
-                {/* Route */}
-                <Route element={<MainLayout />}>
+
+          <div className="bg-cover">
+            <Routes>
+              {/* width full */}
+              <Route path={"/about"} element={<UpbrellaStoryPage />} />
+              <Route path="/" element={<UpbrellaStoryPage />} />
+              <Route path="/information" element={<InfoPage />} />
+
+              {/* width fix */}
+              <Route element={<MainLayout />}>
+                <>
                   {LAYOUT_ROUTES.map((route) => {
                     return (
                       <Route key={route.name} path={route.path} element={<route.component />} />
                     );
                   })}
-                </Route>
-                <Route element={<MainLayout />}>
+                  <Route path="/*" element={<NotFound />} />
+                </>
+              </Route>
+
+              {/* admin */}
+              <Route element={<MainLayout />}>
+                <Route element={<AdminRoutes />}>
                   {ADMIN_ROUTES.map((route) => {
                     return (
                       <Route
@@ -69,14 +82,18 @@ function App() {
                     );
                   })}
                 </Route>
+              </Route>
+
+              {/* login */}
+              <Route element={<PrivateRoutes />}>
                 {NOT_LAYOUT_ROUTES.map((route) => {
                   return <Route key={route.name} path={route.path} element={<route.component />} />;
                 })}
-              </Routes>
-            </div>
+              </Route>
+            </Routes>
           </div>
         </QueryClientProvider>
-      </React.Suspense>
+      </Suspense>
     </RecoilRoot>
   );
 }

diff --git a/src/api/feedBackApi.ts b/src/api/feedBackApi.ts
@@ -0,0 +1,24 @@
+import { $axios } from "@/lib/axios";
+import { TApiResponse } from "@/types/commonTypes";
+import { TConditionRes, TImprovementRes } from "@/types/admin/FeedBackTypes";
+
+const API = {
+  HISTORIES_STATUS: () => `/admin/rent/histories/status`,
+  HISTORIES_IMPROVEMENTS: () => `/admin/rent/histories/improvements`,
+} as const;
+
+// 신고 내역 조회
+export const getHistoriesStatus = async () => {
+  const res = await $axios.get<TApiResponse<TConditionRes>>(API.HISTORIES_STATUS(), {
+    withCredentials: true,
+  });
+  return res.data;
+};
+
+// 개선 요청 내역 조회
+export const getHistoriesImprovements = async () => {
+  const res = await $axios.get<TApiResponse<TImprovementRes>>(API.HISTORIES_IMPROVEMENTS(), {
+    withCredentials: true,
+  });
+  return res.data;
+};
diff --git a/src/api/storeApi.ts b/src/api/storeApi.ts
@@ -9,39 +9,43 @@ import {
   TStoreParams,
   TStoreImageParams,
   TClassificationAllStore,
+  TStoreListDetail,
+  TStoreListRes,
 } from "@/types/admin/StoreTypes";
 
 const API = {
   ADMIN_STORES: (id?: number) => (id ? `/admin/stores/${id}` : `/admin/stores`),
   ADMIN_IMAGE_UPLOAD: (id: number) => `/admin/stores/${id}/images`,
   ADMIN_IMAGE_DELETE: (id: number) => `/admin/stores/images/${id}`,
   ADMIN_CLASSIFICATIONS: (id?: number) =>
-    id ? `/admin/stores/classifications/${id}` : "/admin/stores/classifications",
+    id ? `/stores/classifications/${id}` : "/stores/classifications/",
   CLASSIFICATIONS: () => "/stores/classifications",
   ADMIN_SUBCLASSIFICATIONS: (id?: number) =>
-    id ? `/admin/stores/subClassifications/${id}` : "/admin/stores/subClassifications",
+    id ? `/stores/subClassifications/${id}` : "/stores/subClassifications",
   STORE_CLASSIFICATIONS: (id: number) => `/stores/classification/${id}`,
   STORE_LIST: () => "/stores/introductions",
   STORE_DETAIL: (id: number) => `/stores/${id}`,
+  ADMIN_STORES_PATCH_ACTIVE: (storeId: number) => `/admin/stores/${storeId}/activate`,
+  ADMIN_STORES_PATCH_INACTIVE: (storeId: number) => `/admin/stores/${storeId}/inactivate`,
 } as const;
 
-// // 협업지점 소개 페이지에서의 협업지점 목록 조회
-// export const getStoreList = async () => {
-//   const res = await $axios.get<TApiResponse<TStoreListRes>>(API.STORE_LIST());
-//   return res.data;
-// };
+// 협업지점 소개 페이지에서의 협업지점 목록 조회
+export const getStoreList = async () => {
+  const res = await $axios.get<TApiResponse<TStoreListRes>>(API.STORE_LIST());
+  return res.data;
+};
 
 // 협업지점 전체 조회
 export const getStores = async () => {
   const res = await $axios.get<TApiResponse<TStoreAllRes>>(API.ADMIN_STORES());
   return res.data;
 };
 
-// // 협업지점 상세 조회
-// export const getStoreDetail = async (id: number) => {
-//   const res = await $axios.get<TApiResponse<TStoreListDetail>>(API.STORE_DETAIL(id));
-//   return res.data;
-// };
+// 협업지점 상세 조회
+export const getStoreDetail = async (id: number) => {
+  const res = await $axios.get<TApiResponse<TStoreListDetail>>(API.STORE_DETAIL(id));
+  return res.data;
+};
 
 // 협업지점 이미지 업로드
 
@@ -78,7 +82,7 @@ export const deleteStoreImage = async (storeId: number) => {
 
 // 대분류 태그
 export const getClassifications = async () => {
-  const res = await $axios.get<TApiResponse<TClassificationAllRes>>(API.CLASSIFICATIONS());
+  const res = await $axios.get<TApiResponse<TClassificationAllRes>>(API.ADMIN_CLASSIFICATIONS());
   return res.data;
 };
 
@@ -113,3 +117,12 @@ export const postSubClassification = async (params: TSubClassificationParams) =>
 export const deleteSubClassification = async (deleteId: number) => {
   await $axios.delete(API.ADMIN_SUBCLASSIFICATIONS(deleteId));
 };
+
+// 협업지점 활성화, 비활성화
+export const patchStoreActive = async (storeId: number) => {
+  await $axios.patch(API.ADMIN_STORES_PATCH_ACTIVE(storeId));
+};
+
+export const patchStoreInactive = async (storeId: number) => {
+  await $axios.patch(API.ADMIN_STORES_PATCH_INACTIVE(storeId));
+};