From a13ea63b1ab13a3964427e80a547f305736cf0e2 Mon Sep 17 00:00:00 2001 From: cindyCho Date: Mon, 16 Dec 2024 20:23:44 +0900 Subject: [PATCH 1/8] =?UTF-8?q?feat:=20ui=20=EB=BC=88=EB=8C=80=20=EC=9E=A1?= =?UTF-8?q?=EA=B8=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../detail-info/company-overview/index.tsx | 9 ++++++ src/app/search/[id]/detail-info/index.tsx | 31 +++++++++++++++++++ .../[id]/detail-info/relative-news/index.tsx | 9 ++++++ src/app/search/[id]/page.tsx | 2 ++ 4 files changed, 51 insertions(+) create mode 100644 src/app/search/[id]/detail-info/company-overview/index.tsx create mode 100644 src/app/search/[id]/detail-info/index.tsx create mode 100644 src/app/search/[id]/detail-info/relative-news/index.tsx diff --git a/src/app/search/[id]/detail-info/company-overview/index.tsx b/src/app/search/[id]/detail-info/company-overview/index.tsx new file mode 100644 index 0000000..a69c968 --- /dev/null +++ b/src/app/search/[id]/detail-info/company-overview/index.tsx @@ -0,0 +1,9 @@ +"use client"; + +export default function CompanyOverview() { + return ( +
+
기업개요
+
+ ); +} diff --git a/src/app/search/[id]/detail-info/index.tsx b/src/app/search/[id]/detail-info/index.tsx new file mode 100644 index 0000000..43ab2a8 --- /dev/null +++ b/src/app/search/[id]/detail-info/index.tsx @@ -0,0 +1,31 @@ +"use client"; + +import { + Tabs, + TabsContent, + TabsList, + TabsTrigger, +} from "@/components/common/tabs"; + +import CompanyOverview from "./company-overview"; +import RelativeNews from "./relative-news"; + +export default function DetailInfo() { + return ( +
+

상세 정보

+ + + 기업 개요 + 관련 뉴스 + + + + + + + + +
+ ); +} diff --git a/src/app/search/[id]/detail-info/relative-news/index.tsx b/src/app/search/[id]/detail-info/relative-news/index.tsx new file mode 100644 index 0000000..42736ef --- /dev/null +++ b/src/app/search/[id]/detail-info/relative-news/index.tsx @@ -0,0 +1,9 @@ +"use client"; + +export default function RelativeNews() { + return ( +
+
관련뉴스
+
+ ); +} diff --git a/src/app/search/[id]/page.tsx b/src/app/search/[id]/page.tsx index ea14aa3..3411c9f 100644 --- a/src/app/search/[id]/page.tsx +++ b/src/app/search/[id]/page.tsx @@ -4,6 +4,7 @@ import CandlestickChartContainer from "./_components/candle-chart-container"; import OrderStock from "./_components/order-stock"; import StockHeader from "./_components/stock-header"; import TutorialContainer from "./_components/tutorial/tutorial-container"; +import DetailInfo from "./detail-info"; import { ChartResponse, StockInfo, VolumeResponse } from "./types"; async function getInitialData(id: string) { @@ -74,6 +75,7 @@ export default async function StockPage({ + ); } catch (error) { From f7ee272788584a49e5562a52fc6f553e6b5805e9 Mon Sep 17 00:00:00 2001 From: cindyCho Date: Fri, 20 Dec 2024 20:25:06 +0900 Subject: [PATCH 2/8] =?UTF-8?q?refactor:=20h-screen=EC=97=90=EC=84=9C=20h-?= =?UTF-8?q?full=EB=A1=9C=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/globals.css | 12 ++++++++++++ src/app/login/layout.tsx | 2 +- src/app/main/layout.tsx | 2 +- src/app/members/layout.tsx | 2 +- src/app/my-account/layout.tsx | 6 +----- src/app/portfolio/layout.tsx | 6 +----- src/app/search/[id]/layout.tsx | 6 +----- src/app/search/layout.tsx | 2 +- src/components/nav-bar/_components/nav-menu.tsx | 2 +- tailwind.config.ts | 1 + 10 files changed, 21 insertions(+), 20 deletions(-) diff --git a/src/app/globals.css b/src/app/globals.css index 31afb53..1a2c522 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -2,6 +2,11 @@ @tailwind components; @tailwind utilities; +html, +body { + width: 100%; + height: 100%; +} .loadingSpinner { width: 40px; height: 40px; @@ -42,3 +47,10 @@ src: url("https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff") format("woff"); } + +.list-style { + list-style-type: square; + padding-inline-start: 1.5em; + list-style-position: inside; + line-height: 24px; +} diff --git a/src/app/login/layout.tsx b/src/app/login/layout.tsx index f6d04f4..de9f8b3 100644 --- a/src/app/login/layout.tsx +++ b/src/app/login/layout.tsx @@ -11,7 +11,7 @@ export default function Layout({ children: React.ReactNode; }>) { return ( -
+
{children}
); diff --git a/src/app/main/layout.tsx b/src/app/main/layout.tsx index 22733aa..cd44eaa 100644 --- a/src/app/main/layout.tsx +++ b/src/app/main/layout.tsx @@ -11,7 +11,7 @@ export default function Layout({ children: React.ReactNode; }>) { return ( -
+
{children}
); diff --git a/src/app/members/layout.tsx b/src/app/members/layout.tsx index ea32f90..9d85e69 100644 --- a/src/app/members/layout.tsx +++ b/src/app/members/layout.tsx @@ -11,7 +11,7 @@ export default function Layout({ children: React.ReactNode; }>) { return ( -
+
{children}
); diff --git a/src/app/my-account/layout.tsx b/src/app/my-account/layout.tsx index bc71184..7170077 100644 --- a/src/app/my-account/layout.tsx +++ b/src/app/my-account/layout.tsx @@ -10,9 +10,5 @@ export default function Layout({ }: Readonly<{ children: React.ReactNode; }>) { - return ( -
- {children} -
- ); + return
{children}
; } diff --git a/src/app/portfolio/layout.tsx b/src/app/portfolio/layout.tsx index d131995..d6104e4 100644 --- a/src/app/portfolio/layout.tsx +++ b/src/app/portfolio/layout.tsx @@ -10,9 +10,5 @@ export default function Layout({ }: Readonly<{ children: React.ReactNode; }>) { - return ( -
- {children} -
- ); + return
{children}
; } diff --git a/src/app/search/[id]/layout.tsx b/src/app/search/[id]/layout.tsx index a3df806..13ac983 100644 --- a/src/app/search/[id]/layout.tsx +++ b/src/app/search/[id]/layout.tsx @@ -10,9 +10,5 @@ export default function Layout({ }: Readonly<{ children: React.ReactNode; }>) { - return ( -
- {children} -
- ); + return
{children}
; } diff --git a/src/app/search/layout.tsx b/src/app/search/layout.tsx index 71daa12..76d7443 100644 --- a/src/app/search/layout.tsx +++ b/src/app/search/layout.tsx @@ -10,5 +10,5 @@ export default function Layout({ }: Readonly<{ children: React.ReactNode; }>) { - return
{children}
; + return
{children}
; } diff --git a/src/components/nav-bar/_components/nav-menu.tsx b/src/components/nav-bar/_components/nav-menu.tsx index 282703a..ccb85fe 100644 --- a/src/components/nav-bar/_components/nav-menu.tsx +++ b/src/components/nav-bar/_components/nav-menu.tsx @@ -105,7 +105,7 @@ export default function NavMenu() { }; return ( - +
{NAV_ITEMS.map((item) => ( diff --git a/tailwind.config.ts b/tailwind.config.ts index b3c4e7d..8c44c7d 100644 --- a/tailwind.config.ts +++ b/tailwind.config.ts @@ -50,6 +50,7 @@ const config: Config = { 900: "#1A00DF", }, gray: { + 80: "#D9D9D9", 100: "#B6B6B6", 200: "#B7B7B7", 300: "#A1A1A1", From bce05e4b0ba924df89074981fa11162b3b05060e Mon Sep 17 00:00:00 2001 From: cindyCho Date: Fri, 20 Dec 2024 20:25:59 +0900 Subject: [PATCH 3/8] =?UTF-8?q?feat:=20=EA=B8=B0=EC=97=85=EA=B0=9C?= =?UTF-8?q?=EC=9A=94=20-=20=EA=B8=B0=EC=97=85=EC=A0=95=EB=B3=B4=20ui?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../detail-info/company-overview/index.tsx | 27 +++++++++++++++++++ .../company-overview/target-price.tsx | 7 +++++ .../{ => _components}/detail-info/index.tsx | 0 .../detail-info/relative-news/index.tsx | 0 .../detail-info/company-overview/index.tsx | 9 ------- src/app/search/[id]/page.tsx | 2 +- 6 files changed, 35 insertions(+), 10 deletions(-) create mode 100644 src/app/search/[id]/_components/detail-info/company-overview/index.tsx create mode 100644 src/app/search/[id]/_components/detail-info/company-overview/target-price.tsx rename src/app/search/[id]/{ => _components}/detail-info/index.tsx (100%) rename src/app/search/[id]/{ => _components}/detail-info/relative-news/index.tsx (100%) delete mode 100644 src/app/search/[id]/detail-info/company-overview/index.tsx diff --git a/src/app/search/[id]/_components/detail-info/company-overview/index.tsx b/src/app/search/[id]/_components/detail-info/company-overview/index.tsx new file mode 100644 index 0000000..7612204 --- /dev/null +++ b/src/app/search/[id]/_components/detail-info/company-overview/index.tsx @@ -0,0 +1,27 @@ +"use client"; + +import FinancialStatements from "./financial-statements"; +import TargetPrice from "./target-price"; + +export default function CompanyOverview() { + return ( +
+
+
기업정보
+ [기준: 2024. 08. 16] +
+
    +
  • 한국 및 DX 부문 해외 9개
    • +
  • 한국 및 DX 부문 해외 9개
    • +
  • 한국 및 DX 부문 해외 9개
    • +
+ + + +
+ 전 세계 1200개 리서치 회사의 정보를 종합적으로 분석합니다.
+ 기준 2024.08.29 . 레피니티브 제공 +
+
+ ); +} diff --git a/src/app/search/[id]/_components/detail-info/company-overview/target-price.tsx b/src/app/search/[id]/_components/detail-info/company-overview/target-price.tsx new file mode 100644 index 0000000..7776455 --- /dev/null +++ b/src/app/search/[id]/_components/detail-info/company-overview/target-price.tsx @@ -0,0 +1,7 @@ +export default function TargetPrice() { + return ( +
+
목표주가
+
+ ); +} diff --git a/src/app/search/[id]/detail-info/index.tsx b/src/app/search/[id]/_components/detail-info/index.tsx similarity index 100% rename from src/app/search/[id]/detail-info/index.tsx rename to src/app/search/[id]/_components/detail-info/index.tsx diff --git a/src/app/search/[id]/detail-info/relative-news/index.tsx b/src/app/search/[id]/_components/detail-info/relative-news/index.tsx similarity index 100% rename from src/app/search/[id]/detail-info/relative-news/index.tsx rename to src/app/search/[id]/_components/detail-info/relative-news/index.tsx diff --git a/src/app/search/[id]/detail-info/company-overview/index.tsx b/src/app/search/[id]/detail-info/company-overview/index.tsx deleted file mode 100644 index a69c968..0000000 --- a/src/app/search/[id]/detail-info/company-overview/index.tsx +++ /dev/null @@ -1,9 +0,0 @@ -"use client"; - -export default function CompanyOverview() { - return ( -
-
기업개요
-
- ); -} diff --git a/src/app/search/[id]/page.tsx b/src/app/search/[id]/page.tsx index 3411c9f..a0c79f6 100644 --- a/src/app/search/[id]/page.tsx +++ b/src/app/search/[id]/page.tsx @@ -1,10 +1,10 @@ import Link from "next/link"; import CandlestickChartContainer from "./_components/candle-chart-container"; +import DetailInfo from "./_components/detail-info"; import OrderStock from "./_components/order-stock"; import StockHeader from "./_components/stock-header"; import TutorialContainer from "./_components/tutorial/tutorial-container"; -import DetailInfo from "./detail-info"; import { ChartResponse, StockInfo, VolumeResponse } from "./types"; async function getInitialData(id: string) { From bc781ec85c7abdce283fcd8d546ddd2040348ee5 Mon Sep 17 00:00:00 2001 From: cindyCho Date: Fri, 20 Dec 2024 20:26:10 +0900 Subject: [PATCH 4/8] =?UTF-8?q?feat:=20=EA=B8=B0=EC=97=85=EA=B0=9C?= =?UTF-8?q?=EC=9A=94=20-=20=EC=9E=AC=EB=AC=B4=EC=9E=AC=ED=91=9C=20ui?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../company-overview/financial-statements.tsx | 99 +++++++++++++++++++ 1 file changed, 99 insertions(+) create mode 100644 src/app/search/[id]/_components/detail-info/company-overview/financial-statements.tsx diff --git a/src/app/search/[id]/_components/detail-info/company-overview/financial-statements.tsx b/src/app/search/[id]/_components/detail-info/company-overview/financial-statements.tsx new file mode 100644 index 0000000..14811c7 --- /dev/null +++ b/src/app/search/[id]/_components/detail-info/company-overview/financial-statements.tsx @@ -0,0 +1,99 @@ +"use client"; + +export default function FinancialStatements() { + return ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
재무재표
+ 주요재무정보 + + 연간 +
+ 2020/12 + + 2021/12 + + 2022/12 + 2023/12
+ 매출액 + 100000000100000000100000000100000000
+ 자산 총계 + 100000000100000000100000000100000000
+ ROA + 100000000100000000100000000100000000
+ ROE + 100000000100000000100000000100000000
+ EPS + 100000000100000000100000000100000000
+ PER + 100000000100000000100000000100000000
+ 영업 이익율 + 100000000100000000100000000100000000
+ ); +} From 499a35a90edd95a4463f689df97c67ebeec1497e Mon Sep 17 00:00:00 2001 From: cindyCho Date: Fri, 20 Dec 2024 20:41:39 +0900 Subject: [PATCH 5/8] =?UTF-8?q?refactor:=20api=20=EC=9D=91=EB=8B=B5=20?= =?UTF-8?q?=EB=8D=B0=EC=9D=B4=ED=84=B0=EC=97=90=20=EB=A7=9E=EA=B2=8C=20?= =?UTF-8?q?=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../company-overview/financial-statements.tsx | 215 +++++++++++------- 1 file changed, 127 insertions(+), 88 deletions(-) diff --git a/src/app/search/[id]/_components/detail-info/company-overview/financial-statements.tsx b/src/app/search/[id]/_components/detail-info/company-overview/financial-statements.tsx index 14811c7..430a0ba 100644 --- a/src/app/search/[id]/_components/detail-info/company-overview/financial-statements.tsx +++ b/src/app/search/[id]/_components/detail-info/company-overview/financial-statements.tsx @@ -1,98 +1,137 @@ "use client"; -export default function FinancialStatements() { +type FinancialRatio = { + stockAccountingYearMonth: string; + grossMarginRatio: number; + businessProfitRate: number; + netInterestRate: number; + roeValue: number; + earningsPerShare: number; + salesPerShare: number; + bookValuePerShare: number; + reserveRate: number; + liabilityRate: number; +}; + +type NumberKeys = { + [K in keyof FinancialRatio]: FinancialRatio[K] extends number ? K : never; +}[keyof FinancialRatio]; + +type FinancialMetric = { + label: string; + key: NumberKeys; + isPercentage?: boolean; +}; + +const FINANCIAL_METRICS: FinancialMetric[] = [ + { label: "총마진율", key: "grossMarginRatio", isPercentage: true }, + { label: "사업 수익률", key: "businessProfitRate", isPercentage: true }, + { label: "순이자율", key: "netInterestRate", isPercentage: true }, + { label: "ROE", key: "roeValue", isPercentage: true }, + { label: "EPS(주당순이익)", key: "earningsPerShare" }, + { label: "SPS(주당매출액)", key: "salesPerShare" }, + { label: "BPS(주당순자산)", key: "bookValuePerShare" }, + { label: "주식유보율", key: "reserveRate", isPercentage: true }, + { label: "부채율", key: "liabilityRate", isPercentage: true }, +]; + +const formatValue = (value: number | null, isPercentage?: boolean) => { + if (value === null) return "-"; + const formattedNumber = value.toLocaleString(); + return isPercentage ? `${formattedNumber}%` : formattedNumber; +}; + +function TableHeader({ years }: { years: string[] }) { return ( - - - - + + + + + + + {years.map((year) => ( - - - - - - - - - + ))} + + + ); +} + +function TableRow({ + label, + values, + isPercentage, +}: { + label: string; + values: (number | null)[]; + isPercentage?: boolean; +}) { + return ( + + + {values.map((value, index) => ( + + ))} + + ); +} + +function NoDataMessage() { + return ( +
+ 데이터가 없습니다. +
+ ); +} + +interface FinancialStatementsProps { + data?: FinancialRatio[]; +} + +export default function FinancialStatements({ + data, +}: FinancialStatementsProps) { + if (!data || data.length === 0) { + return ; + } + + const years = data.map((item) => item.stockAccountingYearMonth); + + return ( +
재무재표
+ 주요재무정보 + + 연간 +
- 주요재무정보 - - 연간 -
- 2020/12 - - 2021/12 + {year} - 2022/12 - 2023/12
+ {label} + + {formatValue(value, isPercentage)} +
+ + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + {FINANCIAL_METRICS.map((metric) => ( + + item[metric.key] !== undefined ? Number(item[metric.key]) : null, + )} + isPercentage={metric.isPercentage} + /> + ))}
재무비율
- 매출액 - 100000000100000000100000000100000000
- 자산 총계 - 100000000100000000100000000100000000
- ROA - 100000000100000000100000000100000000
- ROE - 100000000100000000100000000100000000
- EPS - 100000000100000000100000000100000000
- PER - 100000000100000000100000000100000000
- 영업 이익율 - 100000000100000000100000000100000000
); From caac7efda62537c682dbbdc4cbba5587b34cc168 Mon Sep 17 00:00:00 2001 From: cindyCho Date: Fri, 20 Dec 2024 20:58:17 +0900 Subject: [PATCH 6/8] =?UTF-8?q?feat:=20consensus=20ui=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../company-overview/consensus.tsx | 29 +++++++++++++++++++ .../detail-info/company-overview/index.tsx | 2 ++ tailwind.config.ts | 1 + 3 files changed, 32 insertions(+) create mode 100644 src/app/search/[id]/_components/detail-info/company-overview/consensus.tsx diff --git a/src/app/search/[id]/_components/detail-info/company-overview/consensus.tsx b/src/app/search/[id]/_components/detail-info/company-overview/consensus.tsx new file mode 100644 index 0000000..a9a7fb0 --- /dev/null +++ b/src/app/search/[id]/_components/detail-info/company-overview/consensus.tsx @@ -0,0 +1,29 @@ +export default function Consensus() { + return ( +
+
컨센서스
+
+
+
+ 적극 매도 +
+
+
+ 매도 +
+
+
+ 중립 +
+
+
+ 매수 +
+
+
+ 적극 매수 +
+
+
+ ); +} diff --git a/src/app/search/[id]/_components/detail-info/company-overview/index.tsx b/src/app/search/[id]/_components/detail-info/company-overview/index.tsx index 7612204..99dac62 100644 --- a/src/app/search/[id]/_components/detail-info/company-overview/index.tsx +++ b/src/app/search/[id]/_components/detail-info/company-overview/index.tsx @@ -1,5 +1,6 @@ "use client"; +import Consensus from "./consensus"; import FinancialStatements from "./financial-statements"; import TargetPrice from "./target-price"; @@ -17,6 +18,7 @@ export default function CompanyOverview() { +
전 세계 1200개 리서치 회사의 정보를 종합적으로 분석합니다.
diff --git a/tailwind.config.ts b/tailwind.config.ts index 8c44c7d..53a3678 100644 --- a/tailwind.config.ts +++ b/tailwind.config.ts @@ -40,6 +40,7 @@ const config: Config = { 100: "#E9FFF0", 200: "#E8F5E9", 500: "#1DA65A", + 900: "#324950", }, blue: { 100: "#EDF1FC", From 75ed36a7e96e930b352a3dd1b2767c4869722a05 Mon Sep 17 00:00:00 2001 From: cindyCho Date: Fri, 20 Dec 2024 21:07:44 +0900 Subject: [PATCH 7/8] =?UTF-8?q?feat:=20=EB=AA=A9=ED=91=9C=EC=A3=BC?= =?UTF-8?q?=EA=B0=80=20ui=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../detail-info/company-overview/target-price.tsx | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/src/app/search/[id]/_components/detail-info/company-overview/target-price.tsx b/src/app/search/[id]/_components/detail-info/company-overview/target-price.tsx index 7776455..1c51564 100644 --- a/src/app/search/[id]/_components/detail-info/company-overview/target-price.tsx +++ b/src/app/search/[id]/_components/detail-info/company-overview/target-price.tsx @@ -1,7 +1,17 @@ export default function TargetPrice() { return (
-
목표주가
+
목표주가
+
+
43.90
+
+
목표가범위
+
26.00~60.00
+
+ +
+
+
); } From 47eb23761e9e37c5964347e47841f73c893e5fb3 Mon Sep 17 00:00:00 2001 From: cindyCho Date: Sun, 22 Dec 2024 09:36:09 +0900 Subject: [PATCH 8/8] =?UTF-8?q?feat:=20=EA=B4=80=EB=A0=A8=EB=89=B4?= =?UTF-8?q?=EC=8A=A4=20ui=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../detail-info/relative-news/index.tsx | 23 ++++++++++++++++--- 1 file changed, 20 insertions(+), 3 deletions(-) diff --git a/src/app/search/[id]/_components/detail-info/relative-news/index.tsx b/src/app/search/[id]/_components/detail-info/relative-news/index.tsx index 42736ef..9fd8132 100644 --- a/src/app/search/[id]/_components/detail-info/relative-news/index.tsx +++ b/src/app/search/[id]/_components/detail-info/relative-news/index.tsx @@ -2,8 +2,25 @@ export default function RelativeNews() { return ( -
-
관련뉴스
-
+ + + + + + + + + + + + + + + + +
관련뉴스
제목정보 제공날짜
+ 코스피, 외국인 "바이 코리아"에 2680 선 마감.. LG 에너지 + 솔루 + 머니 투데이2024.09.02
); }