ONAANDALL/frontend
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

차트 chartTitle properties 추가(빈칸이 아니면 차트제목 영역나오도록 추가)

Browse Source
This commit is contained in:
YangJinSoo94
2025-03-12 11:36:49 +09:00
parent 104a7b0079
commit afd8925792
5 changed files with 21 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/common/business_components/src/ui/chart/BarChart.tsx
+4 -1
View File
@@ -12,9 +12,12 @@ import {
} from "./lib/chart";
import { Bar, BarChart, CartesianGrid, XAxis } from "recharts";
export default function Chart(props: { chartConfig: ChartConfig; chartData: any[] | undefined; }) {
export default function Chart(props: { chartConfig: ChartConfig; chartData: any[] | undefined; chartTitle: string}) {
return (
<Card>
{props.chartTitle && props.chartTitle !== "" && props.chartTitle !== "undefined" ? (
<div style={{ textAlign: "left", fontSize: "13px", fontWeight: "bold", marginTop:"13px", marginBottom: "10px" }}>
</div>): null}
<CardContent>
<ChartContainer config={props.chartConfig}>
<BarChart accessibilityLayer data={props.chartData}>
packages/common/business_components/src/ui/chart/DoughnutChart.tsx
+4 -1
View File
@@ -15,9 +15,12 @@ import {
import type { CSSProperties } from "react";
// eslint-disable-next-line react-refresh/only-export-components
export default (props: { chartConfig: ChartConfig; chartData: never[] | undefined; }) =>{
export default (props: { chartConfig: ChartConfig; chartData: never[] | undefined; chartTitle:string}) =>{
return (
<Card className="flex flex-col">
{props.chartTitle && props.chartTitle !== "" && props.chartTitle !== "undefined" ? (
<div style={{ textAlign: "left", fontSize: "13px", fontWeight: "bold", marginTop:"13px", marginBottom: "10px" }}>
</div>): null}
<CardContent className="flex-1 pb-0">
<ChartContainer
config={props.chartConfig}
packages/common/business_components/src/ui/chart/LineBarChart.tsx
+4 -1
View File
@@ -75,10 +75,13 @@ const CustomLegend = (props: any) => {
);
};
export default function LineBarchart(props: { chartConfig: ChartConfig; chartData: any[] | undefined; }) {
export default function LineBarchart(props: { chartConfig: ChartConfig; chartData: any[] | undefined; chartTitle:string }) {
return (
<Card>
<CardContent>
{props.chartTitle && props.chartTitle !== "" && props.chartTitle !== "undefined" ? (
<div style={{ textAlign: "left", fontSize: "13px", fontWeight: "bold", marginTop:"13px", marginBottom: "10px" }}>
</div>): null}
<ChartContainer config={props.chartConfig}>
<ComposedChart data={props.chartData}>
<CartesianGrid strokeDasharray="3 3" />
packages/common/business_components/src/ui/chart/LineChart.tsx
+4 -1
View File
@@ -12,9 +12,12 @@ import {
} from "./lib/chart";
import { CartesianGrid, Line, LineChart, XAxis } from "recharts";
export default function Linechart(props: { chartConfig: ChartConfig; chartData: any[] | undefined; }) {
export default function Linechart(props: { chartConfig: ChartConfig; chartData: any[] | undefined; chartTitle:string}) {
return (
<Card>
{props.chartTitle && props.chartTitle !== "" && props.chartTitle !== "undefined" ? (
<div style={{ textAlign: "left", fontSize: "13px", fontWeight: "bold", marginTop:"13px", marginBottom: "10px" }}>
</div>): null}
<CardContent>
<ChartContainer config={props.chartConfig}>
<LineChart
packages/common/business_components/src/ui/chart/index.tsx
+5 -5
View File
@@ -18,32 +18,32 @@ const CHART_FORM = {
LINEBAR : 'linebar'
};
function MainChart(props: { chartForm: string; chartConfig: any; chartData: any; }) {
function MainChart(props: { chartForm: string; chartConfig: any; chartData: any; chartTitle:string; }) {
if( props.chartForm == CHART_FORM.BAR ){
return (
<div>
<BarChart chartConfig={props.chartConfig} chartStyle={styles.divHeight} chartData={props.chartData}>
<BarChart chartConfig={props.chartConfig} chartData={props.chartData} chartTitle={props.chartTitle}>
</BarChart>
</div>
);
} else if( props.chartForm == CHART_FORM.LINE ){
return (
<div>
<LineChart chartConfig={props.chartConfig} chartData={props.chartData}>
<LineChart chartConfig={props.chartConfig} chartData={props.chartData} chartTitle={props.chartTitle}>
</LineChart>
</div>
);
} else if( props.chartForm == CHART_FORM.DN ){
return (
<div>
<DoughnutChart chartConfig={props.chartConfig} chartData={props.chartData}>
<DoughnutChart chartConfig={props.chartConfig} chartData={props.chartData} chartTitle={props.chartTitle}>
</DoughnutChart>
</div>
);
} else if (props.chartForm == CHART_FORM.LINEBAR){
return (
<div className='w-100'>
<LineBarchart chartConfig={props.chartConfig} chartData={props.chartData}>
<LineBarchart chartConfig={props.chartConfig} chartData={props.chartData} chartTitle={props.chartTitle}>
</LineBarchart>
</div>
);