Merge pull request #50 from HanaPiece/dev

Merge branch 'dev' into 'main'
HanaPiece · Jun 10, 2024 · a1eb5a6 · a1eb5a6
2 parents 3e74e76 + 0e8baa5
commit a1eb5a6
Show file tree

Hide file tree

Showing 106 changed files with 7,179 additions and 446 deletions.
diff --git a/.env.example b/.env.example
@@ -0,0 +1,2 @@
+# .env.example
+VITE_API_URI=https://api.example.com
diff --git a/index.html b/index.html
@@ -4,10 +4,12 @@
     <meta charset="UTF-8" />
     <link rel="icon" type="image/svg+xml" href="/vite.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Vite + React + TS</title>
+    <title>Hana-Piece</title>
+    <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;700&display=swap" rel="stylesheet">
+
   </head>
   <body>
-    <div id="root"></div>
+    <div id="root" class="font-noto-sans-kr"></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
@@ -10,7 +10,11 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "chart.js": "^4.4.3",
+    "chartjs-plugin-datalabels": "^2.2.0",
+    "clsx": "^2.1.1",
     "react": "^18.2.0",
+    "react-chartjs-2": "^5.2.0",
     "react-dom": "^18.2.0",
     "react-icons": "^5.2.1",
     "react-router-dom": "^6.23.1"

diff --git a/public/byul2.png b/public/byul2.png
diff --git a/public/byul3.png b/public/byul3.png
diff --git a/public/fonts/Hana2-B.woff b/public/fonts/Hana2-B.woff
diff --git a/public/fonts/Hana2-B.woff2 b/public/fonts/Hana2-B.woff2
diff --git a/public/fonts/Hana2-CM.woff b/public/fonts/Hana2-CM.woff
diff --git a/public/fonts/Hana2-CM.woff2 b/public/fonts/Hana2-CM.woff2
diff --git a/public/fonts/Hana2-H.woff b/public/fonts/Hana2-H.woff
diff --git a/public/fonts/Hana2-H.woff2 b/public/fonts/Hana2-H.woff2
diff --git a/public/fonts/Hana2-L.woff b/public/fonts/Hana2-L.woff
diff --git a/public/fonts/Hana2-L.woff2 b/public/fonts/Hana2-L.woff2
diff --git a/public/fonts/Hana2-M.woff b/public/fonts/Hana2-M.woff
diff --git a/public/fonts/Hana2-M.woff2 b/public/fonts/Hana2-M.woff2
diff --git a/public/fonts/Hana2-R.woff b/public/fonts/Hana2-R.woff
diff --git a/public/fonts/Hana2-R.woff2 b/public/fonts/Hana2-R.woff2
diff --git a/public/hana.png b/public/hana.png
diff --git a/public/img-hana-symbol-m.png b/public/img-hana-symbol-m.png
diff --git a/public/life_start.png b/public/life_start.png
diff --git a/public/logo-8.png b/public/logo-8.png
diff --git a/public/logo-eng.png b/public/logo-eng.png
diff --git a/public/logo.png b/public/logo.png
diff --git a/public/split-start.png b/public/split-start.png
diff --git a/public/tutorial1.png b/public/tutorial1.png
diff --git a/public/tutorial2.png b/public/tutorial2.png
diff --git a/public/tutorial3.png b/public/tutorial3.png
diff --git a/public/tutorial4.png b/public/tutorial4.png
diff --git a/src/App.tsx b/src/App.tsx
@@ -1,8 +1,48 @@
 import { BrowserRouter, Route, Routes } from "react-router-dom";
 import { Layout } from "./pages/Layout";
-import Splash from "./pages/start/Splash";
-import { TutorialPage1 } from "./pages/start/TutorialPage1";
+import { Splash } from "./pages/start/Splash";
+import { Tutorial1Page } from "./pages/start/Tutorial1Page";
+import { Tutorial2Page } from "./pages/start/Tutorial2Page";
+import { Tutorial3Page } from "./pages/start/Tutorial3Page";
+import { Tutorial4Page } from "./pages/start/Tutorial4Page";
+import { LoginPage } from "./pages/start/LoginPage";
 import { HomePage } from "./pages/home/HomePage";
+import { GoalProductDetailPage } from "./pages/home/GoalProductDetailPage";
+import { SplitMainPage } from "./pages/split/SplitMainPage";
+import { SplitManualPage } from "./pages/split/SplitManualPage";
+import { SplitAutoPage } from "./pages/split/SplitAutoPage";
+import { ProductListPage } from "./pages/product/ProductListPage";
+import { ProductStartPage } from "./pages/product/ProductStartPage";
+import { ProductDetailPage } from "./pages/product/ProductDetailPage";
+import { ProductTermPage } from "./pages/product/ProductTermPage";
+import { ProductTermDetailPage } from "./pages/product/ProductTermDetailPage";
+import { ProductSignupPage } from "./pages/product/ProductSignupPage";
+import { ProductCompletePage } from "./pages/product/ProductCompletePage";
+import { MypagePage } from "./pages/mypage/MypagePage";
+import { SalaryPage } from "./pages/mypage/salary/SalaryPage";
+import { AccountPage } from "./pages/mypage/account/AccountPage";
+import { AccountAddPage } from "./pages/mypage/account/create/AccountAddPage";
+import { AccountTermPage } from "./pages/mypage/account/create/AccountTermPage";
+import { AccountCompletePage } from "./pages/mypage/account/create/AccountCompletePage";
+import { GoalListPage } from "./pages/mypage/goal/GoalListPage";
+import { GoalCreatePage } from "./pages/mypage/goal/GoalCreatePage";
+import { GoalDetailPage } from "./pages/mypage/goal/GoalDetailPage";
+import { AccountSettingPage } from "./pages/mypage/account/AccountSettingPage";
+import { AccountOpenListPage } from "./pages/mypage/account/AccountOpenListPage";
+import { AccountSavingListPage } from "./pages/mypage/account/AccountSavingListPage";
+import { AccountOpenUpdatePage } from "./pages/mypage/account/AccountOpenUpdatePage";
+import { LifePage } from "./pages/life/LifePage";
+import { ProductGoalPage } from "./pages/product/ProductGoalPage";
+import { SplitStartPage } from "./pages/split/SplitStartPage";
+import { SplitStartSettingPage } from "./pages/split/SplitStartSettingPage";
+import { SplitStartSplitPage } from "./pages/split/SplitStartSplitPage";
+import { SplitStartCompletePage } from "./pages/split/SplitStartCompletePage";
+import { TutorialPage } from "./pages/start/TutorialPage";
+import { LifeStartPage } from "./pages/life/LifeStartPage";
+import { AccountCreatePage } from "./pages/mypage/account/create/AccountCreatePage";
+import { AccountTermDetailPage } from "./pages/mypage/account/create/AccountTermDetailPage";
+import { GoalProductSelectPage } from "./pages/home/GoalProductSelectPage";
+
 function App() {
   return (
     <BrowserRouter>
@@ -11,15 +51,88 @@ function App() {
           {/* NavBar 있는 화면 */}
           <Route path="home">
             <Route index element={<HomePage />} />
+            <Route path=":goalId" element={<GoalProductSelectPage />} />
+            <Route
+              path=":goalId/:accountId"
+              element={<GoalProductDetailPage />}
+            />
+          </Route>
+          <Route path="product">
+            <Route index element={<ProductGoalPage />} />
+            <Route path="start" element={<ProductStartPage />} />
+          </Route>
+          <Route path="mypage">
+            <Route index element={<MypagePage />} />
+            <Route path="goal" element={<GoalListPage />} />
+            <Route path="account">
+              <Route index element={<AccountPage />} />
+              <Route path="setting">
+                <Route index element={<AccountSettingPage />} />
+                <Route path="open">
+                  <Route index element={<AccountOpenListPage />} />
+                  <Route path="update" element={<AccountOpenUpdatePage />} />
+                </Route>
+                <Route path="saving" element={<AccountSavingListPage />} />
+              </Route>
+            </Route>
+          </Route>
+          <Route path="split">
+            <Route index element={<SplitMainPage />} />
+            <Route path="manual" element={<SplitManualPage />} />
+            <Route path="auto" element={<SplitAutoPage />} />
+            <Route path="start" element={<SplitStartPage />} />
+          </Route>
+          <Route path="life">
+            <Route index element={<LifePage />} />
+            <Route path="start" element={<LifeStartPage />} />
           </Route>
         </Route>
 
         {/* NavBar 없는 화면 */}
-        <Route path="/splash">
-          <Route index element={<Splash />} />
+        <Route path="splash" element={<Splash />} />
+        <Route path="tutorial" element={<TutorialPage />} />
+        <Route path="tutorial1" element={<Tutorial1Page />} />
+        <Route path="tutorial2" element={<Tutorial2Page />} />
+        <Route path="tutorial3" element={<Tutorial3Page />} />
+        <Route path="tutorial4" element={<Tutorial4Page />} />
+        <Route path="login" element={<LoginPage />} />
+
+        <Route path="product">
+          <Route path=":goalId" element={<ProductListPage />} />
+          <Route path=":goalId/:productId" element={<ProductDetailPage />} />
+          <Route path=":goalId/:productId/term" element={<ProductTermPage />} />
+          <Route
+            path=":goalId/:productId/term/detail"
+            element={<ProductTermDetailPage />}
+          />
+          <Route
+            path=":goalId/:productId/signup"
+            element={<ProductSignupPage />}
+          />
+          <Route
+            path=":goalId/:productId/complete"
+            element={<ProductCompletePage />}
+          />
         </Route>
-        <Route path="/tutorial">
-          <Route index element={<TutorialPage1 />} />
+        <Route path="mypage">
+          <Route path="salary" element={<SalaryPage />} />
+          <Route path="goal">
+            <Route path=":goalId" element={<GoalDetailPage />} />
+            <Route path=":goalId/create" element={<GoalCreatePage />} />
+          </Route>
+          <Route path="account">
+            <Route path="create" element={<AccountCreatePage />} />
+            <Route path="term" element={<AccountTermPage />} />
+            <Route path="term/detail" element={<AccountTermDetailPage />} />
+            <Route path="add" element={<AccountAddPage />} />
+            <Route path="complete" element={<AccountCompletePage />} />
+          </Route>
+        </Route>
+
+        <Route path="split">
+          <Route path="start/setting" element={<SplitStartSettingPage />} />
+          <Route path="start/split" element={<SplitStartSplitPage />} />
+          <Route path="start/complete" element={<SplitStartCompletePage />} />
         </Route>
       </Routes>
     </BrowserRouter>

diff --git a/src/assets/byul1.png b/src/assets/byul1.png
diff --git a/src/assets/byul5.png b/src/assets/byul5.png
diff --git a/src/assets/img-hana-symbol-m.png b/src/assets/img-hana-symbol-m.png
diff --git a/src/components/ui/Checkbox.tsx b/src/components/ui/Checkbox.tsx
@@ -0,0 +1,23 @@
+
+interface CheckboxProps {
+  checked: boolean;
+  onChange: (checked: boolean) => void;
+  name: string;
+}
+
+export const Checkbox = ({ checked, onChange, name } : CheckboxProps) => {
+  return (
+    <label className="flex items-center cursor-pointer">
+      <input
+        type="checkbox"
+        checked={checked}
+        onChange={(e) => onChange(e.target.checked)}
+        className="hidden peer"
+      />
+      <div className="w-5 h-5 border border-gray-500 rounded-full flex justify-center items-center">
+        <div className={`w-2 h-2 inline-block border rounded-full border-none ${checked ? 'bg-customGreen rounded-full' : ''}`}></div>
+      </div>
+      <span className="ml-2 text-gray-700">{name}</span>
+    </label>
+  );
+}
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		# .env.example
		VITE_API_URI=https://api.example.com