From a4092de4f6f5fc05015013ff0cb7cc6add5379b3 Mon Sep 17 00:00:00 2001 From: chacha Date: Sat, 6 Apr 2024 02:23:32 +0900 Subject: [PATCH 1/8] ex2 done --- client/src/pages/account.tsx | 11 +++++++---- seminar/.env.example | 4 +++- seminar/src/middleware/auth.js | 2 +- 3 files changed, 11 insertions(+), 6 deletions(-) diff --git a/client/src/pages/account.tsx b/client/src/pages/account.tsx index 37341f5..0e84224 100644 --- a/client/src/pages/account.tsx +++ b/client/src/pages/account.tsx @@ -5,14 +5,15 @@ import {SAPIBase} from "../tools/api"; import "./css/account.css"; const AccountPage = () => { - const [ SAPIKEY, setSAPIKEY ] = React.useState(""); + const [ password, setPASSWORD ] = React.useState(""); + const [ username, setUSERNAME ] = React.useState(""); const [ NBalance, setNBalance ] = React.useState("Not Authorized"); const [ NTransaction, setNTransaction ] = React.useState(0); const getAccountInformation = () => { const asyncFun = async() => { interface IAPIResponse { balance: number }; - const { data } = await axios.post(SAPIBase + '/account/getInfo', { credential: SAPIKEY }); + const { data } = await axios.post(SAPIBase + '/account/getInfo', { credentialID: username, credentialPW: password }); setNBalance(data.balance); } asyncFun().catch((e) => window.alert(`AN ERROR OCCURED: ${e}`)); @@ -22,7 +23,7 @@ const AccountPage = () => { const asyncFun = async() => { if (amount === '') return; interface IAPIResponse { success: boolean, balance: number, msg: string }; - const { data } = await axios.post(SAPIBase + '/account/transaction', { credential: SAPIKEY, amount: amount }); + const { data } = await axios.post(SAPIBase + '/account/transaction', { credentialID: username, credentialPW: password, amount: amount }); setNTransaction(0); if (!data.success) { window.alert('Transaction Failed:' + data.msg); @@ -40,7 +41,9 @@ const AccountPage = () => {

Account

- Enter API Key: setSAPIKEY(e.target.value)}/> + Enter Username: setUSERNAME(e.target.value)}/> +
+ Enter Password: setPASSWORD(e.target.value)}/>
diff --git a/seminar/.env.example b/seminar/.env.example index f84e5b2..64a2dfe 100644 --- a/seminar/.env.example +++ b/seminar/.env.example @@ -1,3 +1,5 @@ PORT=8080 NODE_ENV=DEVELOPMENT -API_KEY= \ No newline at end of file +USERNAME="chacha" +PASSWORD="chacha" +MONGO_URI="mongodb://localhost:27017/todos" \ No newline at end of file diff --git a/seminar/src/middleware/auth.js b/seminar/src/middleware/auth.js index 480f41d..490c385 100644 --- a/seminar/src/middleware/auth.js +++ b/seminar/src/middleware/auth.js @@ -1,5 +1,5 @@ const authMiddleware = (req, res, next) => { - if (req.body.credential === process.env.API_KEY) { + if ((req.body.credentialID == process.env.USERNAME) && (req.body.credentialPW == process.env.PASSWORD)) { console.log("[AUTH-MIDDLEWARE] Authorized User"); next(); } From 419242aae82f5ffbf7d670c375b6618407c6b092 Mon Sep 17 00:00:00 2001 From: chacha Date: Sat, 6 Apr 2024 03:11:00 +0900 Subject: [PATCH 2/8] modify working... --- client/src/pages/feed.tsx | 10 ++++++++++ seminar/src/routes/feed.js | 35 ++++++++++++++++++++++++++++++++--- 2 files changed, 42 insertions(+), 3 deletions(-) diff --git a/client/src/pages/feed.tsx b/client/src/pages/feed.tsx index b64c53b..1eb64e5 100644 --- a/client/src/pages/feed.tsx +++ b/client/src/pages/feed.tsx @@ -44,6 +44,15 @@ const FeedPage = (props: {}) => { asyncFun().catch(e => window.alert(`AN ERROR OCCURED! ${e}`)); } + const modifyPost = (id: string) => { + const asyncFun = async () => { + await axios.post( SAPIBase + '/feed/modifyFeed', { id: id, title: SNewPostTitle, content: SNewPostContent } ); + setSNewPostTitle(""); + setSNewPostContent(""); + } + asyncFun().catch(e => window.alert(`AN ERROR OCCURED! ${e}`)); + } + return (
@@ -58,6 +67,7 @@ const FeedPage = (props: {}) => { { LAPIResponse.map( (val, i) =>
deletePost(`${val.id}`)}>ⓧ
+
modifyPost(`${val.id}`)}>ⓧ

{ val.title }

{ val.content }

diff --git a/seminar/src/routes/feed.js b/seminar/src/routes/feed.js index f9c19d9..1506af0 100644 --- a/seminar/src/routes/feed.js +++ b/seminar/src/routes/feed.js @@ -36,6 +36,24 @@ class FeedDB { if (BItemDeleted) id--; return BItemDeleted; } + + modifyItem = ( item ) => { + let BItemModified = false; + + const { id, title, content } = item; + const num_id = parseInt(id); + + this.#LDataDB = this.#LDataDB.forEach((value) => { + const match = (value.id == num_id); + if (match) { + value.title = title; + value.content = content; + BItemModified = true; + } + }); + + return BItemModified; + } } const feedDBInst = FeedDB.getInst(); @@ -55,7 +73,7 @@ router.post('/addFeed', (req, res) => { try { const { title, content } = req.body; const addResult = feedDBInst.insertItem({ title, content }); - if (!addResult) return res.status(500).json({ error: dbRes.data }) + if (!addResult) return res.status(500).json({ error: addResult.data }) else return res.status(200).json({ isOK: true }); } catch (e) { return res.status(500).json({ error: e }); @@ -67,10 +85,21 @@ router.post('/deleteFeed', (req, res) => { const { id } = req.body; const deleteResult = feedDBInst.deleteItem(parseInt(id)); if (!deleteResult) return res.status(500).json({ error: "No item deleted" }) - else return res.status(200).json({ isOK: true }); + else return res.status(200).json({ isDeleteOK: true }); } catch (e) { return res.status(500).json({ error: e }); } -}) +}); + +router.post('/modifyFeed', (req, res) => { + try { + const { id, title, content } = req.body; + const modifyResult = feedDBInst.modifyItem({ id, title, content }); + if (!modifyResult) return res.status(500).json({ error: "No item modified" }) + else return res.status(200).json({ isModifyOK: true }); + } catch (e) { + return res.status(500).json({ error: e }); + } +}); module.exports = router; \ No newline at end of file From ff2b467de6799edf5bff243ed1d1c43a891ad096 Mon Sep 17 00:00:00 2001 From: chacha Date: Sat, 6 Apr 2024 03:36:41 +0900 Subject: [PATCH 3/8] modify... --- seminar/src/routes/feed.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/seminar/src/routes/feed.js b/seminar/src/routes/feed.js index 1506af0..d686e01 100644 --- a/seminar/src/routes/feed.js +++ b/seminar/src/routes/feed.js @@ -43,11 +43,11 @@ class FeedDB { const { id, title, content } = item; const num_id = parseInt(id); - this.#LDataDB = this.#LDataDB.forEach((value) => { + this.#LDataDB.forEach((value) => { const match = (value.id == num_id); if (match) { - value.title = title; - value.content = content; + this.#LDataDB[value.id].title = title; + this.#LDataDB[value.id].content = content; BItemModified = true; } }); From fca8dd9e6a0100669d7fa87da8a893252a7ea981 Mon Sep 17 00:00:00 2001 From: chacha Date: Sat, 6 Apr 2024 18:18:21 +0900 Subject: [PATCH 4/8] new crud: account book --- client/src/pages/account.tsx | 77 ++++++++++++++++++++++++- client/src/pages/css/account.css | 95 ++++++++++++++++++++++++++++++- client/src/pages/css/feed.css | 10 +++- client/src/pages/feed.tsx | 2 +- seminar/src/routes/account.js | 98 ++++++++++++++++++++++++++++++++ 5 files changed, 278 insertions(+), 4 deletions(-) diff --git a/client/src/pages/account.tsx b/client/src/pages/account.tsx index 0e84224..18f2727 100644 --- a/client/src/pages/account.tsx +++ b/client/src/pages/account.tsx @@ -4,11 +4,32 @@ import axios from "axios"; import {SAPIBase} from "../tools/api"; import "./css/account.css"; +interface IAPIResponse { id: number, spend: string, purpose: string } + const AccountPage = () => { const [ password, setPASSWORD ] = React.useState(""); const [ username, setUSERNAME ] = React.useState(""); const [ NBalance, setNBalance ] = React.useState("Not Authorized"); const [ NTransaction, setNTransaction ] = React.useState(0); + const [ LAPIResponse, setLAPIResponse ] = React.useState([]); + const [ NPostCount, setNPostCount ] = React.useState(0); + const [ spend, setSPEND ] = React.useState(""); + const [ purpose, setPURPOSE ] = React.useState(""); + + React.useEffect( () => { + let BComponentExited = false; + const asyncFun = async () => { + const { data } = await axios.get( SAPIBase + '/account/getBook'); + console.log(data); + // const data = [ { id: 0, title: "test1", content: "Example body" }, { id: 1, title: "test2", content: "Example body" }, { id: 2, title: "test3", content: "Example body" } ].slice(0, NPostCount); + if (BComponentExited) return; + setLAPIResponse(data); + }; + asyncFun().catch((e) => window.alert(`Error while running API Call: ${e}`)); + return () => { BComponentExited = true; } + }, [ NPostCount ]); + + const getAccountInformation = () => { const asyncFun = async() => { @@ -24,6 +45,9 @@ const AccountPage = () => { if (amount === '') return; interface IAPIResponse { success: boolean, balance: number, msg: string }; const { data } = await axios.post(SAPIBase + '/account/transaction', { credentialID: username, credentialPW: password, amount: amount }); + + if (amount < 0) setSPEND("" + (-1) * amount); + setNTransaction(0); if (!data.success) { window.alert('Transaction Failed:' + data.msg); @@ -36,10 +60,38 @@ const AccountPage = () => { asyncFun().catch((e) => window.alert(`AN ERROR OCCURED: ${e}`)); } + const createNewPost = () => { + const asyncFun = async () => { + await axios.post( SAPIBase + '/account/addBook', { spend: spend, purpose: purpose } ); + setNPostCount(NPostCount + 1); + setSPEND(""); + setPURPOSE(""); + } + asyncFun().catch(e => window.alert(`AN ERROR OCCURED! ${e}`)); + } + + const deletePost = (id: string) => { + const asyncFun = async () => { + // One can set X-HTTP-Method header to DELETE to specify deletion as well + await axios.post( SAPIBase + '/account/deleteBook', { id: id } ); + setNPostCount(Math.max(NPostCount - 1, 0)); + } + asyncFun().catch(e => window.alert(`AN ERROR OCCURED! ${e}`)); + } + + const modifyPost = (id: string) => { + const asyncFun = async () => { + await axios.post( SAPIBase + '/account/modifyBook', { id: id, spend: spend, purpose: purpose } ); + setSPEND(""); + setPURPOSE(""); + } + asyncFun().catch(e => window.alert(`AN ERROR OCCURED! ${e}`)); + } + return (
-

Account

+

Account

Enter Username: setUSERNAME(e.target.value)}/>
@@ -58,6 +110,29 @@ const AccountPage = () => {
+ +

가계부

+
+ 지출 금액 setSPEND(e.target.value)} className={"input-spend"}/> 원 +
+ 지출 내역 setPURPOSE(e.target.value)} className={"input-purpose"}/> + +
+ +
+ { LAPIResponse.map( (val, i) => +
+
modifyPost(`${val.id}`)}>✎
+
deletePost(`${val.id}`)}>ⓧ
+ +

{ val.spend }

+

{ val.purpose }

+
+ ) + } +
+ +
); } diff --git a/client/src/pages/css/account.css b/client/src/pages/css/account.css index a0f123d..2a9b585 100644 --- a/client/src/pages/css/account.css +++ b/client/src/pages/css/account.css @@ -1,3 +1,5 @@ + + .account-bank { margin: 20px auto; border: solid 1px rgba(0,0,0,0.3); @@ -30,4 +32,95 @@ .transaction { margin: 30px 0 10px 0; -} \ No newline at end of file +} + +.account-book-input { + + border: 1px solid black; + border-radius: 8px; + width: 40%; + justify-content: space-between; + align-items: center; + margin-left: 30%; + margin-right: 30%; + + +} + +.input-spend { + border: 1pt solid #ccc; + border-radius: 5px; + height: 25px; + width: 150px; + margin: 10px; + + +} + +.input-purpose { + border: 1pt solid #ccc; + border-radius: 5px; + height: 25px; + width: 300px; + margin: 10px; +} + +.book-add-button { + border: 1px solid #ccc; + background-color: #ccc; + border-radius: 5px; + height: 30px; + width: 40px; +} + + +.book-item { + position: relative; + border: 1px solid black; + border-radius: 5px; + width: 40%; + margin-left: 30%; + margin-right: 30%; + height: 100px; + +} + +.book-title { + + position: absolute; + left: 40px; + top: 12px; + margin: 10px; +} + +.book-body { + position: absolute; + left: 40px; + top: 50px; + margin: 10px; +} + +.delete-book-item { + position: absolute; + right: 15px; + top: 12px; + color: red; + font-size: 18px; + font-weight: 300; +} + +.modify-book-item { + color: blue; + position: absolute; + right: 45px; + top: 12px; + font-size: 18px; +} + +.delete-book-item:hover, .modify-book-item:hover { + cursor: pointer; + font-weight: bolder; + font-size:larger +} + + diff --git a/client/src/pages/css/feed.css b/client/src/pages/css/feed.css index 53580df..af6ac53 100644 --- a/client/src/pages/css/feed.css +++ b/client/src/pages/css/feed.css @@ -38,7 +38,15 @@ font-size: 18px; } -.delete-item:hover { +.modify-item { + position: absolute; + right: 45px; + top: 12px; + color: blue; + font-size: 18px; +} + +.delete-item, .modify-item:hover { font-weight: bold; cursor: pointer; } \ No newline at end of file diff --git a/client/src/pages/feed.tsx b/client/src/pages/feed.tsx index 1eb64e5..feff6c3 100644 --- a/client/src/pages/feed.tsx +++ b/client/src/pages/feed.tsx @@ -67,7 +67,7 @@ const FeedPage = (props: {}) => { { LAPIResponse.map( (val, i) =>
deletePost(`${val.id}`)}>ⓧ
-
modifyPost(`${val.id}`)}>ⓧ
+
modifyPost(`${val.id}`)}>✎

{ val.title }

{ val.content }

diff --git a/seminar/src/routes/account.js b/seminar/src/routes/account.js index 51572f8..f379e62 100644 --- a/seminar/src/routes/account.js +++ b/seminar/src/routes/account.js @@ -12,6 +12,7 @@ class BankDB { #total = 10000; + constructor() { console.log("[Bank-DB] DB Init Completed"); } getBalance = () => { @@ -24,7 +25,62 @@ class BankDB { } } +class BookDB { + static _inst_; + static getInst = () => { + if ( !BookDB._inst_ ) BookDB._inst_ = new BookDB(); + return BookDB._inst_; + } + + #id = 1; #itemCount = 1; #LDataDB = [{ id: 0, title: "test1", content: "Example body" }]; + + selectItems = () => { + return { success: true, data: this.#LDataDB } + } + + insertItem = ( item ) => { + const { spend, purpose } = item; + this.#LDataDB.push({ id: this.#id, spend, purpose }); + this.#id++; this.#itemCount++; + return true; + } + + deleteItem = ( id ) => { + let BItemDeleted = false; + this.#LDataDB = this.#LDataDB.filter((value) => { + const match = (value.id === id); + if (match) BItemDeleted = true; + return !match; + }); + if (BItemDeleted) { + id--; + this.#id--; + } + return BItemDeleted; + } + + modifyItem = ( item ) => { + let BItemModified = false; + + const { id, title, content } = item; + const num_id = parseInt(id); + + this.#LDataDB.forEach((value) => { + const match = (value.id == num_id); + if (match) { + this.#LDataDB[value.id].title = title; + this.#LDataDB[value.id].content = content; + BItemModified = true; + } + }); + + return BItemModified; + } +} + + const bankDBInst = BankDB.getInst(); +const bookDBInst = BookDB.getInst(); router.post('/getInfo', authMiddleware, (req, res) => { try { @@ -47,4 +103,46 @@ router.post('/transaction', authMiddleware, (req, res) => { } }) +router.get('/getBook', (req, res) => { + try { + const dbRes = bookDBInst.selectItems(); + if (dbRes.success) return res.status(200).json(dbRes.data); + else return res.status(500).json({ error: dbRes.data }) + } catch (e) { + return res.status(500).json({ error: e }); + } +}); + +router.post('/addBook', (req, res) => { + try { + const { spend, purpose } = req.body; + const addResult = bookDBInst.insertItem({ spend, purpose }); + if (!addResult) return res.status(500).json({ error: addResult.data }) + else return res.status(200).json({ isOK: true }); + } catch (e) { + return res.status(500).json({ error: e }); + } + }); + +router.post('/deleteBook', (req, res) => { + try { + const { id } = req.body; + const deleteResult = bookDBInst.deleteItem(parseInt(id)); + if (!deleteResult) return res.status(500).json({ error: "No item deleted" }) + else return res.status(200).json({ isDeleteOK: true }); + } catch (e) { + return res.status(500).json({ error: e }); + } +}); + +router.post('/modifyBook', (req, res) => { + try { + const { id, title, content } = req.body; + const modifyResult = bookDBInst.modifyItem({ id, title, content }); + if (!modifyResult) return res.status(500).json({ error: "No item modified" }) + else return res.status(200).json({ isModifyOK: true }); + } catch (e) { + return res.status(500).json({ error: e }); + } +}); module.exports = router; \ No newline at end of file From 0136699594ab8e4a680c8de2b5804dc92c9fc6ba Mon Sep 17 00:00:00 2001 From: chacha Date: Sat, 6 Apr 2024 18:27:44 +0900 Subject: [PATCH 5/8] update left... --- client/src/pages/account.tsx | 4 ++-- client/src/pages/css/account.css | 1 + seminar/src/routes/account.js | 2 +- 3 files changed, 4 insertions(+), 3 deletions(-) diff --git a/client/src/pages/account.tsx b/client/src/pages/account.tsx index 18f2727..cfa022d 100644 --- a/client/src/pages/account.tsx +++ b/client/src/pages/account.tsx @@ -46,7 +46,7 @@ const AccountPage = () => { interface IAPIResponse { success: boolean, balance: number, msg: string }; const { data } = await axios.post(SAPIBase + '/account/transaction', { credentialID: username, credentialPW: password, amount: amount }); - if (amount < 0) setSPEND("" + (-1) * amount); + if (amount < 0) setSPEND("" + amount); setNTransaction(0); if (!data.success) { @@ -125,7 +125,7 @@ const AccountPage = () => {
modifyPost(`${val.id}`)}>✎
deletePost(`${val.id}`)}>ⓧ
-

{ val.spend }

+

{ val.spend } 원

{ val.purpose }

) diff --git a/client/src/pages/css/account.css b/client/src/pages/css/account.css index 2a9b585..5e265f9 100644 --- a/client/src/pages/css/account.css +++ b/client/src/pages/css/account.css @@ -82,6 +82,7 @@ margin-left: 30%; margin-right: 30%; height: 100px; + margin-top: 10px; } diff --git a/seminar/src/routes/account.js b/seminar/src/routes/account.js index f379e62..323e1e5 100644 --- a/seminar/src/routes/account.js +++ b/seminar/src/routes/account.js @@ -32,7 +32,7 @@ class BookDB { return BookDB._inst_; } - #id = 1; #itemCount = 1; #LDataDB = [{ id: 0, title: "test1", content: "Example body" }]; + #id = 0; #itemCount = 0; #LDataDB = []; selectItems = () => { return { success: true, data: this.#LDataDB } From c6961c042ae614b71a7027d479eb38bb85adc815 Mon Sep 17 00:00:00 2001 From: chacha Date: Sat, 6 Apr 2024 22:39:26 +0900 Subject: [PATCH 6/8] task done? --- client/src/pages/account.tsx | 9 ++++++--- client/src/pages/feed.tsx | 4 +++- seminar/src/routes/account.js | 10 +++++----- 3 files changed, 14 insertions(+), 9 deletions(-) diff --git a/client/src/pages/account.tsx b/client/src/pages/account.tsx index cfa022d..e340ed4 100644 --- a/client/src/pages/account.tsx +++ b/client/src/pages/account.tsx @@ -9,12 +9,14 @@ interface IAPIResponse { id: number, spend: string, purpose: string } const AccountPage = () => { const [ password, setPASSWORD ] = React.useState(""); const [ username, setUSERNAME ] = React.useState(""); + const [ spend, setSPEND ] = React.useState(""); + const [ purpose, setPURPOSE ] = React.useState(""); const [ NBalance, setNBalance ] = React.useState("Not Authorized"); const [ NTransaction, setNTransaction ] = React.useState(0); const [ LAPIResponse, setLAPIResponse ] = React.useState([]); const [ NPostCount, setNPostCount ] = React.useState(0); - const [ spend, setSPEND ] = React.useState(""); - const [ purpose, setPURPOSE ] = React.useState(""); + const [ NModifyCount, setNModifyCount ] = React.useState(0); + React.useEffect( () => { let BComponentExited = false; @@ -27,7 +29,7 @@ const AccountPage = () => { }; asyncFun().catch((e) => window.alert(`Error while running API Call: ${e}`)); return () => { BComponentExited = true; } - }, [ NPostCount ]); + }, [ NPostCount, NModifyCount ]); @@ -84,6 +86,7 @@ const AccountPage = () => { await axios.post( SAPIBase + '/account/modifyBook', { id: id, spend: spend, purpose: purpose } ); setSPEND(""); setPURPOSE(""); + setNModifyCount(NModifyCount + 1); } asyncFun().catch(e => window.alert(`AN ERROR OCCURED! ${e}`)); } diff --git a/client/src/pages/feed.tsx b/client/src/pages/feed.tsx index feff6c3..48d48a7 100644 --- a/client/src/pages/feed.tsx +++ b/client/src/pages/feed.tsx @@ -9,6 +9,7 @@ interface IAPIResponse { id: number, title: string, content: string } const FeedPage = (props: {}) => { const [ LAPIResponse, setLAPIResponse ] = React.useState([]); const [ NPostCount, setNPostCount ] = React.useState(0); + const [ NModifyCount, setNModifyCount ] = React.useState(0); const [ SNewPostTitle, setSNewPostTitle ] = React.useState(""); const [ SNewPostContent, setSNewPostContent ] = React.useState(""); @@ -23,7 +24,7 @@ const FeedPage = (props: {}) => { }; asyncFun().catch((e) => window.alert(`Error while running API Call: ${e}`)); return () => { BComponentExited = true; } - }, [ NPostCount ]); + }, [ NPostCount, NModifyCount ]); const createNewPost = () => { const asyncFun = async () => { @@ -49,6 +50,7 @@ const FeedPage = (props: {}) => { await axios.post( SAPIBase + '/feed/modifyFeed', { id: id, title: SNewPostTitle, content: SNewPostContent } ); setSNewPostTitle(""); setSNewPostContent(""); + setNModifyCount(NModifyCount + 1); } asyncFun().catch(e => window.alert(`AN ERROR OCCURED! ${e}`)); } diff --git a/seminar/src/routes/account.js b/seminar/src/routes/account.js index 323e1e5..1b48cb4 100644 --- a/seminar/src/routes/account.js +++ b/seminar/src/routes/account.js @@ -62,14 +62,14 @@ class BookDB { modifyItem = ( item ) => { let BItemModified = false; - const { id, title, content } = item; + const { id, spend, purpose } = item; const num_id = parseInt(id); this.#LDataDB.forEach((value) => { const match = (value.id == num_id); if (match) { - this.#LDataDB[value.id].title = title; - this.#LDataDB[value.id].content = content; + this.#LDataDB[value.id].spend = spend; + this.#LDataDB[value.id].purpose = purpose; BItemModified = true; } }); @@ -137,8 +137,8 @@ router.post('/deleteBook', (req, res) => { router.post('/modifyBook', (req, res) => { try { - const { id, title, content } = req.body; - const modifyResult = bookDBInst.modifyItem({ id, title, content }); + const { id, spend, purpose } = req.body; + const modifyResult = bookDBInst.modifyItem({ id, spend, purpose }); if (!modifyResult) return res.status(500).json({ error: "No item modified" }) else return res.status(200).json({ isModifyOK: true }); } catch (e) { From 723279e360971207c9c24088fee9ee183104d4ca Mon Sep 17 00:00:00 2001 From: chacha Date: Sat, 6 Apr 2024 22:44:01 +0900 Subject: [PATCH 7/8] task done --- client/src/pages/account.tsx | 9 ++++++--- client/src/pages/css/account.css | 5 +++++ 2 files changed, 11 insertions(+), 3 deletions(-) diff --git a/client/src/pages/account.tsx b/client/src/pages/account.tsx index e340ed4..02f69d7 100644 --- a/client/src/pages/account.tsx +++ b/client/src/pages/account.tsx @@ -114,11 +114,14 @@ const AccountPage = () => { -

가계부

+
+

가계부

+

수입 / 지출을 기록해 보세요.

+
- 지출 금액 setSPEND(e.target.value)} className={"input-spend"}/> 원 + 금액 setSPEND(e.target.value)} className={"input-spend"}/> 원
- 지출 내역 setPURPOSE(e.target.value)} className={"input-purpose"}/> + 내역 setPURPOSE(e.target.value)} className={"input-purpose"}/>
diff --git a/client/src/pages/css/account.css b/client/src/pages/css/account.css index 5e265f9..a8b96aa 100644 --- a/client/src/pages/css/account.css +++ b/client/src/pages/css/account.css @@ -34,6 +34,10 @@ margin: 30px 0 10px 0; } +.account-book-title p { + color: gray; +} + .account-book-input { border: 1px solid black; @@ -43,6 +47,7 @@ align-items: center; margin-left: 30%; margin-right: 30%; + margin-bottom: 40px; } From 71be3f2076694d89cdf87156af7780b870819b1a Mon Sep 17 00:00:00 2001 From: chacha Date: Sat, 6 Apr 2024 22:53:06 +0900 Subject: [PATCH 8/8] finally done? --- client/src/pages/account.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/src/pages/account.tsx b/client/src/pages/account.tsx index 02f69d7..33892d1 100644 --- a/client/src/pages/account.tsx +++ b/client/src/pages/account.tsx @@ -48,7 +48,7 @@ const AccountPage = () => { interface IAPIResponse { success: boolean, balance: number, msg: string }; const { data } = await axios.post(SAPIBase + '/account/transaction', { credentialID: username, credentialPW: password, amount: amount }); - if (amount < 0) setSPEND("" + amount); + setSPEND("" + amount); setNTransaction(0); if (!data.success) {