From 79412ebb6885a1a581fb4edb72692ccb7ddc5c13 Mon Sep 17 00:00:00 2001 From: gygy7151 Date: Tue, 22 Nov 2022 23:16:01 +0900 Subject: [PATCH] =?UTF-8?q?Feature/#189:=20=EC=98=81=EC=88=98=EC=A6=9D=20?= =?UTF-8?q?=EC=B6=9C=EB=A0=A5=ED=99=94=EB=A9=B4=20=EC=9D=B4=EB=8F=99?= =?UTF-8?q?=EA=B8=B0=EB=8A=A5=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/App.js | 10 +-- .../ReceiptPaperContents.jsx | 74 +++++++++---------- .../molecules/ReceiptTodo/ReceiptTodo.jsx | 30 ++++---- .../organisms/MySection/MySection.jsx | 2 +- src/controllers/dummy.js | 17 ++++- 5 files changed, 66 insertions(+), 67 deletions(-) diff --git a/src/App.js b/src/App.js index eb525ea..73a4e7a 100644 --- a/src/App.js +++ b/src/App.js @@ -1,19 +1,13 @@ import { useContext } from "react"; import { Routes, Route } from "react-router-dom"; import BaseContext from "store/baseContext"; -import { - AuthPage, - TodoPage, - LoginPage, - ReceiptPage, - UserPage, - RedirectionPage, -} from "components"; +import { AuthPage, TodoPage, LoginPage, ReceiptPage, UserPage, RedirectionPage } from "components"; import { useCurrentToken } from "hooks/useCurrentToken"; function App() { const BaseCtx = useContext(BaseContext); const { user } = useCurrentToken(); + // const { isLoggedIn } = user; const isLoggedIn = true; const isBase = BaseCtx.isBase; diff --git a/src/components/molecules/ReceiptPaperContents/ReceiptPaperContents.jsx b/src/components/molecules/ReceiptPaperContents/ReceiptPaperContents.jsx index 68542ab..f839a5c 100644 --- a/src/components/molecules/ReceiptPaperContents/ReceiptPaperContents.jsx +++ b/src/components/molecules/ReceiptPaperContents/ReceiptPaperContents.jsx @@ -1,9 +1,4 @@ -import { - ReceiptTodo, - ReceiptPaperInfo, - ReceiptBarcode, - ReceiptQuotes, -} from "components"; +import { ReceiptTodo, ReceiptPaperInfo, ReceiptBarcode, ReceiptQuotes } from "components"; import * as S from "./ReceiptPaperContents.styles"; /** @@ -15,38 +10,37 @@ import * as S from "./ReceiptPaperContents.styles"; * @returns */ export function ReceiptPaperContents({ todos }) { - const line = "-----------------------------------"; - let timerTotal = 0; - return ( - - RECEIPT - -
{line}
- - {todos.map((todo, index) => { - timerTotal += todo.timer; - return {todo}; - })} - -
{line}
- -
- ITEM COUNT : - {todos.length} -
-
- TOTAL : - - {Math.floor(timerTotal / 60)}: - {(timerTotal % 60).toString().padStart(2, "0")} - -
-
-
{line}
- -
{line}
- -
{line}
-
- ); + const line = "-----------------------------------"; + let timerTotal = 0; + return ( + + RECEIPT + +
{line}
+ + {todos.map((todo) => { + timerTotal += todo.timer; + return {todo}; + })} + +
{line}
+ +
+ ITEM COUNT : + {todos.length} +
+
+ TOTAL : + + {Math.floor(timerTotal / 60)}:{(timerTotal % 60).toString().padStart(2, "0")} + +
+
+
{line}
+ +
{line}
+ +
{line}
+
+ ); } diff --git a/src/components/molecules/ReceiptTodo/ReceiptTodo.jsx b/src/components/molecules/ReceiptTodo/ReceiptTodo.jsx index 28a04bb..25fe3f7 100644 --- a/src/components/molecules/ReceiptTodo/ReceiptTodo.jsx +++ b/src/components/molecules/ReceiptTodo/ReceiptTodo.jsx @@ -13,22 +13,22 @@ import * as S from "./ReceiptTodo.styles"; */ const makeEllipsis = (str, len) => { - if (str.length > len) { - return str.slice(0, len) + "..."; - } - return str; + if (str.length > len) { + return str.slice(0, len) + "..."; + } + return str; }; export function ReceiptTodo({ children: { task, timer } }) { - return ( - - - - {makeEllipsis(task, ELLIPSISLENGTH)} - - {Math.floor(timer / 60)}:{String(timer % 60).padStart(2, "0")} - - - - ); + return ( + + + + {makeEllipsis(task, ELLIPSISLENGTH)} + + {Math.floor(timer / 60)}:{String(timer % 60).padStart(2, "0")} + + + + ); } diff --git a/src/components/organisms/MySection/MySection.jsx b/src/components/organisms/MySection/MySection.jsx index 0317e47..8938e86 100644 --- a/src/components/organisms/MySection/MySection.jsx +++ b/src/components/organisms/MySection/MySection.jsx @@ -33,7 +33,7 @@ export const MySection = () => { {receipt.date && formatReceiptDate(receipt.date)} { - navigate(`/receipt`, { state: receipt.todos }); + navigate(`/receipt`, { state: { todos: receipt.todos } }); }} todos={Array.from(receipt.todos)} key={receipt.id} diff --git a/src/controllers/dummy.js b/src/controllers/dummy.js index 9f7373a..80068d8 100644 --- a/src/controllers/dummy.js +++ b/src/controllers/dummy.js @@ -123,6 +123,7 @@ export const dummyPinnedReceipts = [ id: 2, todos: [ { + id: 1, task: "create a meeting agenda", date: "2022-08-29", isDone: true, @@ -138,12 +139,14 @@ export const dummyPinnedReceipts = [ id: 16, todos: [ { + id: 2, task: "create a meeting agenda", date: "2022-08-29", isDone: true, timer: 0, }, { + id: 3, task: "Update project plan ", date: "2022-08-29", isDone: false, @@ -151,8 +154,7 @@ export const dummyPinnedReceipts = [ }, ], pinned: true, - famous_saying: - "Good advice is something a man gives when he is too old to set a bad example.", + famous_saying: "Good advice is something a man gives when he is too old to set a bad example.", createdAt: "2022-08-01", updatedAt: "", }, @@ -160,24 +162,28 @@ export const dummyPinnedReceipts = [ id: 17, todos: [ { + id: 4, task: "create a meeting agenda", date: "2022-08-30", isDone: true, timer: 0, }, { + id: 5, task: "Update project plan ", date: "2022-08-30", isDone: false, timer: 172, }, { + id: 6, task: "60 mins plank", date: "2022-08-30", isDone: false, timer: 60, }, { + id: 7, task: "Take vitamins", date: "2022-08-30", isDone: true, @@ -191,6 +197,8 @@ export const dummyPinnedReceipts = [ timer: 200, }, { + id: 11, + task: "Learn Angular", date: "2022-08-30", isDone: true, @@ -206,25 +214,28 @@ export const dummyPinnedReceipts = [ id: 1, todos: [ { + id: 12, task: "60 mins plank", date: "2022-10-30", isDone: false, timer: 60, }, { + id: 13, task: "Take vitamins", date: "2022-10-30", isDone: true, timer: 0, }, { - id: 10, + id: 14, task: "Study Typescript", date: "2022-10-30", isDone: true, timer: 200, }, { + id: 15, task: "Learn Angular", date: "2022-10-30", isDone: true,