From 0766760013e6a6befb87edb595f2f02167615a90 Mon Sep 17 00:00:00 2001 From: Moon Dahyun Date: Mon, 23 Oct 2023 19:00:35 +0900 Subject: [PATCH 01/13] =?UTF-8?q?Feat:=20=EC=B5=9C=EC=B4=88=EB=8D=B0?= =?UTF-8?q?=EC=9D=B4=ED=84=B0,=20=EC=B4=9D=EC=88=98=EC=9E=85/=EC=B4=9D?= =?UTF-8?q?=EC=A7=80=EC=B6=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../index.html" | 87 +++++-------------- .../script.js" | 69 ++++++++++----- .../style.css" | 10 ++- 3 files changed, 79 insertions(+), 87 deletions(-) diff --git "a/1\354\243\274\354\260\250/4.\352\260\200\352\263\204\353\266\200/index.html" "b/1\354\243\274\354\260\250/4.\352\260\200\352\263\204\353\266\200/index.html" index 10d2185..74ce38c 100644 --- "a/1\354\243\274\354\260\250/4.\352\260\200\352\263\204\353\266\200/index.html" +++ "b/1\354\243\274\354\260\250/4.\352\260\200\352\263\204\353\266\200/index.html" @@ -1,75 +1,36 @@ - - - - + + + + 가계부 - - + +
다현이의 가계부
-
-
나의 자산
-
2000723
-
-
+30000
-
-500000
-
+
+
나의 자산
+
+
+
+
+
-
< 10월 1일 >
+
< 10월 1일 >
-
내역 리스트
-
- 수입 -
-
- 지출 -
+
내역 리스트
+
+ 수입 + +
+
지출
-
- -
    -
  • 식비
    • -
  • 버거킹 문정역
    • -
  • -10800
    • -
  • x
    • -
- -
    -
  • 취미
    • -
  • 포토그레이강남2호첨
    • -
  • -5000
    • -
  • x
    • -
- -
    -
  • 식비
    • -
  • 내가찜한닭
    • -
  • -18000
    • -
  • x
    • -
- - -
    -
  • 월급
    • -
  • 꼰떼넨떼
    • -
  • +7000000
    • -
  • x
    • -
- -
    -
  • 취미
    • -
  • 인터파크
    • -
  • -110000
    • -
  • x
    • -
- -
+
-
+
+
+
- - \ No newline at end of file + + diff --git "a/1\354\243\274\354\260\250/4.\352\260\200\352\263\204\353\266\200/script.js" "b/1\354\243\274\354\260\250/4.\352\260\200\352\263\204\353\266\200/script.js" index a16ec7e..4811bb5 100644 --- "a/1\354\243\274\354\260\250/4.\352\260\200\352\263\204\353\266\200/script.js" +++ "b/1\354\243\274\354\260\250/4.\352\260\200\352\263\204\353\266\200/script.js" @@ -1,25 +1,48 @@ const INIT_BALANCE = 0; -const HISTORY_LIST = { - 0: { - category : "식비", - main : '버거킹', - price : 10800 - }, - 1: { - category : "식비2", - main : '버거킹', - price : 10800 - }, - 2: { - category : "식비3", - main : '버거킹', - price : 10800 - }, - 3: { - category : "식비4", - main : '버거킹', - price : 10800 - }, -} +const HISTORY_LIST = [ + { category: "보험", content: "농협손보지급", price: 103400 }, + { category: "교통", content: "신한체크쿄통", price: -29300 }, + { category: "출금", content: "산하 후드티", price: -77000 }, + { category: "입금", content: "꼰떼넨떼더광교", price: 277056 }, +]; -let balance = document.querySelectorAll('category'); \ No newline at end of file +const list_real = document.querySelector(".list-real"); +const income = document.querySelector(".income"); +const outcome = document.querySelector(".outcome"); +const total = document.querySelector(".total"); + +let total_income = 0; +let total_outcome = 0; + +HISTORY_LIST.forEach((item) => { + const ul = document.createElement("ul"); + ul.classList.add("list-indiv"); + + const category_li = document.createElement("li"); + category_li.classList.add("category"); + category_li.textContent = item.category; + + const content_li = document.createElement("li"); + content_li.classList.add("content"); + content_li.textContent = item.content; + + const price_li = document.createElement("li"); + price_li.classList.add("price"); + price_li.textContent = + item.price < 0 ? `${item.price}원` : `+${item.price}원`; + if (item.price < 0) { + price_li.style.color = "blue"; + total_outcome += item.price; + } else { + price_li.style.color = "red"; + total_income += item.price; + } + + list_real.appendChild(ul); + ul.appendChild(category_li); + ul.appendChild(content_li); + ul.appendChild(price_li); +}); +total.textContent = `${total_income - total_outcome}원`; +income.textContent = `+${total_income}`; +outcome.textContent = `${total_outcome}`; diff --git "a/1\354\243\274\354\260\250/4.\352\260\200\352\263\204\353\266\200/style.css" "b/1\354\243\274\354\260\250/4.\352\260\200\352\263\204\353\266\200/style.css" index 4243013..7bbc617 100644 --- "a/1\354\243\274\354\260\250/4.\352\260\200\352\263\204\353\266\200/style.css" +++ "b/1\354\243\274\354\260\250/4.\352\260\200\352\263\204\353\266\200/style.css" @@ -36,7 +36,7 @@ header { font-weight: bold; } -.inner-2 { +.total { line-height: 60px; font-size: 30px; font-weight: bold; @@ -47,6 +47,14 @@ header { justify-content: space-around; } +.income { + color: red; +} + +.outcome { + color: blue; +} + .list-header-1 { height: 35px; line-height: 35px; From 225ffe71d25a92b498e78d6e882cdc78fd5661e2 Mon Sep 17 00:00:00 2001 From: Moon Dahyun Date: Tue, 24 Oct 2023 02:12:05 +0900 Subject: [PATCH 02/13] =?UTF-8?q?Feat:=20=EC=88=98=EC=9E=85/=EC=A7=80?= =?UTF-8?q?=EC=B6=9C=20=ED=95=84=ED=84=B0=EB=A7=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../index.html" | 6 +- .../script.js" | 117 ++++++++++++------ 2 files changed, 81 insertions(+), 42 deletions(-) diff --git "a/1\354\243\274\354\260\250/4.\352\260\200\352\263\204\353\266\200/index.html" "b/1\354\243\274\354\260\250/4.\352\260\200\352\263\204\353\266\200/index.html" index 74ce38c..76f7915 100644 --- "a/1\354\243\274\354\260\250/4.\352\260\200\352\263\204\353\266\200/index.html" +++ "b/1\354\243\274\354\260\250/4.\352\260\200\352\263\204\353\266\200/index.html" @@ -22,10 +22,12 @@
내역 리스트
- 수입 + 수입
-
지출
+
+ 지출 +