Ticket-v0.0.4-1

Gosrock · Feb 25, 2023 · a634942 · a634942
2 parents 6346c1b + 3a125b0
commit a634942
Show file tree

Hide file tree

Showing 91 changed files with 2,685 additions and 296 deletions.
diff --git a/.github/workflows/admin-deploy.yml b/.github/workflows/admin-deploy.yml
@@ -18,7 +18,7 @@ jobs:
       - name: Create .env file
         run: |
           touch .env
-          echo "${{ secrets.ENV_VARS_ADMIN }}" >> .env
+          echo "${{ secrets.ENV_VARS_ADMIN }}" >> apps/admin/.env
       # 도커 메타데이터 가져오기
       - name: Get the version
         id: get_version

diff --git a/apps/admin/.gitignore b/apps/admin/.gitignore
@@ -22,3 +22,6 @@ dist-ssr
 *.njsproj
 *.sln
 *.sw?
+
+#dotenv environment
+.env
diff --git a/apps/admin/index.html b/apps/admin/index.html
@@ -18,7 +18,7 @@
     <script type="module" src="/src/main.tsx"></script>
     <script
       type="text/javascript"
-      src="//dapi.kakao.com/v2/maps/sdk.js?appkey=9c08b495df2ecbc09bd453fb53701551&libraries=services,clusterer"
+      src="//dapi.kakao.com/v2/maps/sdk.js?appkey=<{VITE_REACT_APP_KAKAO_API}>&libraries=services,clusterer"
     ></script>
   </body>
 </html>
diff --git a/apps/admin/package.json b/apps/admin/package.json
@@ -25,13 +25,15 @@
     "react-cookie": "^4.1.1",
     "react-dom": "^18.2.0",
     "react-error-boundary": "^3.1.4",
+    "react-qr-reader": "^2.2.1",
     "react-router-dom": "^6.6.1",
     "recoil": "^0.7.6",
     "vite-plugin-svgr": "^2.4.0"
   },
   "devDependencies": {
     "@types/react": "^18.0.26",
     "@types/react-dom": "^18.0.9",
+    "@types/react-qr-reader": "^2.1.4",
     "@vitejs/plugin-react": "^3.0.0",
     "typescript": "^4.9.3",
     "vite": "^4.0.0"

diff --git a/apps/admin/public/vite.svg b/apps/admin/public/vite.svg
diff --git a/apps/admin/src/App.tsx b/apps/admin/src/App.tsx
@@ -10,8 +10,26 @@ import Refresh from './components/shared/auth/Refresh';
 import NewRouter from '@pages/new';
 import AdminNoMenuLayout from '@components/shared/layout/AdminNoMenuLayout';
 import Home from '@pages/common/Home';
+import { useQueryClient } from '@tanstack/react-query';
+import useApiError from '@lib/hooks/useApiError';
 
 function App() {
+  const { handleError } = useApiError();
+  const queryClient = useQueryClient();
+
+  queryClient.setDefaultOptions({
+    queries: {
+      onError: (error: any) => {
+        handleError(error);
+      },
+    },
+    mutations: {
+      onError: (error: any) => {
+        handleError(error);
+      },
+    },
+  });
+
   return (
     <Routes>
       <Route element={<Refresh />}>

diff --git a/apps/admin/src/assets/scanner.svg b/apps/admin/src/assets/scanner.svg
diff --git a/apps/admin/src/components/events/detail/EventDetailInfo.tsx b/apps/admin/src/components/events/detail/EventDetailInfo.tsx
@@ -27,12 +27,13 @@ interface EventDetailInfoProps {
   eventId: string;
 }
 
+let isInitialized = false;
+
 const EventDetailInfo = ({
   content,
   setForm,
   eventId,
 }: EventDetailInfoProps) => {
-  const [curContent, setCurContent] = useState<string>('');
   const toolbarItems = [
     ['heading', 'bold', 'italic', 'strike'],
     ['hr', 'quote'],
@@ -44,8 +45,10 @@ const EventDetailInfo = ({
   const editorRef = useRef<Editor>(null);
 
   useEffect(() => {
-    setCurContent(content);
-    if (editorRef.current) editorRef.current!.getInstance().setHTML(content);
+    if (editorRef.current && !isInitialized && content !== '') {
+      isInitialized = true;
+      editorRef.current.getInstance().setHTML(content);
+    }
   }, [content]);
 
   // presigned 발급 api
@@ -103,7 +106,6 @@ const EventDetailInfo = ({
           onChange={onChange}
           placeholder="공연 상세 내용을 입력해주세요."
           previewStyle="vertical" // 미리보기 스타일 지정
-          initialValue={curContent}
           hideModeSwitch={true} // 모드 바꾸기 스위치 숨기기 여부
           previewHighlight={true}
           height="500px" // 에디터 창 높이

diff --git a/apps/admin/src/components/events/info/Map.tsx b/apps/admin/src/components/events/info/Map.tsx
@@ -1,11 +1,12 @@
-import { Input, ListHeader, Modal, Padding, Spacing } from '@dudoong/ui';
+import { Input, ListHeader, Search, Spacing, TagButton } from '@dudoong/ui';
 import { BasicEventRequest } from '@lib/apis/event/eventType';
 import useBottomButton from '@lib/hooks/useBottomButton';
 import useEvents from '@lib/hooks/useEvents';
 import timeFormatter from '@lib/utils/timeFormatter';
-import { SyntheticEvent, useEffect, useState } from 'react';
+import { useEffect, useState } from 'react';
 import { Map, MapMarker } from 'react-kakao-maps-sdk';
 import ModalSearch from './ModalSearch';
+import useGlobalOverlay from '@lib/hooks/useGlobalOverlay';
 
 interface place {
   content: string;
@@ -18,10 +19,12 @@ interface place {
 }
 
 const MapPage = (props: any) => {
+  const { openOverlay } = useGlobalOverlay();
   const [lat, setLat] = useState<number | null>();
   const [lng, setLng] = useState<number | null>();
-  const [placeName, setPlaceName] = useState<string | null>();
-  const [placeAddress, setPlaceAddress] = useState<string | null>();
+  const [placeName, setPlaceName] = useState<string | undefined>();
+  const [placeAddress, setPlaceAddress] = useState<string | undefined>();
+  const [detailAddress, setDetailAddress] = useState<string | undefined>();
   const [markers, setMarkers] = useState<any>();
   const [map, setMap] = useState<any>();
   const [address, setAddress] = useState<string | undefined>('');
@@ -49,6 +52,8 @@ const MapPage = (props: any) => {
           lng: Number(props.place.longitude),
         },
       });
+      setPlaceName(props.place.placeName);
+      setDetailAddress(props.place.placeAddress);
     }
   }, [props?.place]);
 
@@ -65,13 +70,19 @@ const MapPage = (props: any) => {
         name: props.name,
         startAt: timeFormatter(props.startDate, props.startTime),
         runTime: props.runtime,
-        placeName: curMarker.content,
-        placeAddress: curMarker.placeAddress,
+        placeName: placeName,
+        placeAddress: detailAddress,
         longitude: Number(curMarker.position.lng),
         latitude: Number(curMarker.position.lat),
       };
       console.log(payload);
-      changeEventMutation.mutate(payload);
+      changeEventMutation.mutate(payload, {
+        onSuccess: () => {
+          openOverlay({
+            content: 'saved',
+          });
+        },
+      });
     }
   };
 
@@ -102,10 +113,14 @@ const MapPage = (props: any) => {
     setAddress(e.target.value);
   };
 
+  const handleName = (e: any) => {
+    e.preventDefault();
+  };
+
   const handleMap = () => {
     if (!map) return;
     const ps = new kakao.maps.services.Places();
-    if (ps) {
+    if (ps && address !== '') {
       ps.keywordSearch(address, (data, status, _pagination) => {
         if (status === kakao.maps.services.Status.OK) {
           // 검색된 장소 위치를 기준으로 지도 범위를 재설정하기위해
@@ -129,8 +144,6 @@ const MapPage = (props: any) => {
             );
           }
           setMarkers(markers);
-          console.log(markers);
-          console.log(_pagination);
           setPagination(_pagination);
           //여기서 lat,lngset해주면될듯?
 
@@ -147,7 +160,6 @@ const MapPage = (props: any) => {
     setMarker(markers);
     setLat(Number(markers.position.lat));
     setLng(Number(markers.position.lng));
-    setPlaceName(markers.content);
 
     bounds.extend(
       new kakao.maps.LatLng(
@@ -167,24 +179,47 @@ const MapPage = (props: any) => {
     <>
       <div>
         <ListHeader
-          padding={[32, 24, 12, 0]}
+          padding={[32, 0, 10, 0]}
           size={'listHeader_18'}
           title={'공연 장소'}
+          rightElement={
+            <TagButton
+              size="md"
+              color="primary"
+              text="주소 찾기"
+              onClick={() => setIsOpen(true)}
+            />
+          }
         ></ListHeader>
-        <form>
+
+        <form onSubmit={handleName}>
           <Input
             width={398}
-            placeholder="검색하세요"
-            value={curMarker.content !== null ? curMarker.content : ''}
-            onClick={() => setIsOpen(true)}
-            readOnly
+            placeholder="공연장 이름을 적어주세요"
+            value={placeName ? placeName : ''}
+            onChange={(e: { target: { value: string } }) =>
+              setPlaceName(e.target.value)
+            }
+          ></Input>
+          <ListHeader
+            padding={[32, 24, 12, 0]}
+            size={'listHeader_18'}
+            title={'상세주소'}
+            description={placeAddress ? placeAddress : ''}
+          ></ListHeader>
+          <Input
+            placeholder="중요! 상세주소를 그대로 적어주세요!"
+            value={detailAddress ? detailAddress : ''}
+            onChange={(e: { target: { value: string } }) =>
+              setDetailAddress(e.target.value)
+            }
           ></Input>
         </form>
         <Spacing size={12} />
         <Map // 로드뷰를 표시할 Container
           center={{
-            lat: 37.55097092681401,
-            lng: 126.92364650757898,
+            lat: curMarker.position.lat,
+            lng: curMarker.position.lng,
           }}
           style={{ width: '398px', height: '292px', borderRadius: '8px' }}
           level={4}

diff --git a/apps/admin/src/components/events/info/Pagination.tsx b/apps/admin/src/components/events/info/Pagination.tsx
@@ -26,18 +26,16 @@ const Pagination = (pagination: any) => {
           <Left />
         </button>
         {arr.map((num) => (
-          <>
-            <Mini cur={current} num={num}>
-              <button onClick={() => setChange(num)}>
-                <Text
-                  typo={'P_Text_16_M'}
-                  color={current === num ? 'white' : 'black'}
-                >
-                  {num}
-                </Text>
-              </button>
-            </Mini>
-          </>
+          <Mini cur={current} num={num} key={num}>
+            <button onClick={() => setChange(num)}>
+              <Text
+                typo={'P_Text_16_M'}
+                color={current === num ? 'white' : 'black'}
+              >
+                {num}
+              </Text>
+            </button>
+          </Mini>
         ))}
         <button onClick={() => pagination.pagination.nextPage()}>
           <Right />

diff --git a/apps/admin/src/components/events/options/TempOButtonSet.tsx b/apps/admin/src/components/events/options/TempOButtonSet.tsx
-Original file line number
+Diff line change
@@ Expand Up / @@ -22,3 +22,6 @@ dist-ssr @@
     *.njsproj
     *.sln
     *.sw?
+    #dotenv environment
+    .env