Merge pull request #2 from FastCampusGroupFE9/ChoiYongJun/mypage-list

Choi yong jun/mypage list
KDT1-FE · Jul 26, 2023 · 21a4f37 · 21a4f37
2 parents 081fab8 + 03f5730
commit 21a4f37
Show file tree

Hide file tree

Showing 17 changed files with 408 additions and 27 deletions.
diff --git a/index2.html → index.html b/index2.html → index.html
@@ -1,6 +1,5 @@
 <!DOCTYPE html>
 <html lang="en">
-<<<<<<< HEAD
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -12,16 +12,20 @@
   "dependencies": {
     "@tanstack/react-query": "^4.32.0",
     "axios": "^1.4.0",
+    "jwt-decode": "^3.1.2",
     "react": "^18.2.0",
+    "react-date-range": "^1.4.0",
     "react-dom": "^18.2.0",
     "react-icons": "^4.10.1",
+    "react-router-dom": "^6.14.2",
     "scss": "^0.2.4",
     "vite-plugin-mkcert": "^1.16.0",
     "vite-plugin-sass-dts": "^1.3.8"
   },
   "devDependencies": {
     "@types/node": "^20.4.4",
     "@types/react": "^18.0.37",
+    "@types/react-date-range": "^1.4.4",
     "@types/react-dom": "^18.0.11",
     "@typescript-eslint/eslint-plugin": "^5.59.0",
     "@typescript-eslint/parser": "^5.59.0",

diff --git a/src/@types/common.ts b/src/@types/common.ts
@@ -1,7 +1,20 @@
-
-declare interface Sample {
+declare interface JoinUserInputType {
+  id: string;
   name: string;
+  joinDate: string;
+}
+
+declare interface LoginOutputType {
   id: string;
+  name: string;
   joinDate: string;
+  accessToken: string;
+  refreshToken?: string;
+}
+
+declare interface UserLoginType {
+  accessToken: string;
+  refreshToken?: string;
 }
+
 // declare 사용하여 전역화 시킨다.
diff --git a/src/App.tsx b/src/App.tsx
@@ -1,11 +1,16 @@
+import Main from "./pages/Main/main.tsx";
+import { Route, Routes } from "react-router-dom";
+// import ProtectedRoute from "./Components/ProtectedRoute.tsx";
+// import Admin from "./pages/Admin/admin.tsx";
 
 
 function App() {
-
   return (
-    <>
-     <h1>라우터 필요시 생성</h1>
-    </>
+  <Routes>
+    <Route path="/" element={<Main />} />
+    {/*<Route path="/admin" */}
+    {/*       element={<ProtectedRoute adminRequired={true} element={<Admin />}*/}
+  </Routes>
   )
 }
 

diff --git a/src/Components/Calendar-input/Calendar.tsx b/src/Components/Calendar-input/Calendar.tsx
@@ -0,0 +1,33 @@
+import  { useState } from 'react';
+import { DateRange, Range } from 'react-date-range';
+import 'react-date-range/dist/styles.css';
+import 'react-date-range/dist/theme/default.css';
+
+export default function MyDateRangePicker() {
+  const [state, setState] = useState<Range[]>([
+    {
+      startDate: new Date(),
+      endDate: undefined,
+      key: 'selection'
+    }
+  ]);
+
+  // 선택한 날짜 범위를 받아 옵니다. 확인용 콘솔입니다.
+  console.log(state[0].startDate);
+  console.log(state[0].endDate);
+
+  const handleSelect = (ranges: { [key: string]: Range }) => {
+    setState([ranges['selection']]);
+  }
+
+  return (
+    <DateRange
+      editableDateInputs={true}
+      onChange={handleSelect}
+      moveRangeOnFirstSelection={false}
+      months={2}
+      ranges={state}
+    />
+  );
+}
+