-chart yFieldText2 추가(라인바는 2개)

-대시보드 수정

packages/common/business_components/src/ui/chart/LineBarChart.tsx

@@ -5,6 +5,7 @@ import {
   ChartContainer,
   type ChartConfig
 } from "./lib/chart";
+import type { ContentType } from "recharts/types/component/DefaultLegendContent";
 
 // 툴팁 커스텀 css
 /** 차트 기본 스타일 */
@@ -25,7 +26,8 @@ type LineBarChartProps = {
   chartTitle: string;
   chartClassName?: string;
   graphSize?: number;
-  yFieldText?: string;
+  yFieldText?: string | undefined;
+  yFieldText2?: string | undefined;
   showLegend?: boolean;
 }
 
@@ -83,6 +85,7 @@ export default function LineBarchart({
   chartClassName = 'w-full h-full',
   graphSize = 40,
   yFieldText,
+  yFieldText2,
   showLegend = true
 }: LineBarChartProps) {
   if (!chartData || chartData.length === 0) {
@@ -110,11 +113,11 @@ export default function LineBarchart({
             <CartesianGrid strokeDasharray="3 3" />
             <XAxis dataKey="label" fontSize="8px" fontWeight="bold"/>
             {/* 왼쪽 Y축: lineVal */}
-            <YAxis yAxisId="left" fontSize="8px" fontWeight="bold" orientation="left" label={{ value: yFieldText, angle: -90, position: 'insideLeft' }} />
+            {yFieldText && <YAxis yAxisId="left" className="text-[12px] font-bold" orientation="left" label={{ value: yFieldText, angle: -90, position: 'insideLeft' }} />}
             {/* 오른쪽 Y축: barVal */}
-            <YAxis yAxisId="right" fontSize="8px" fontWeight="bold" orientation="right" reversed />
+            {yFieldText2 && <YAxis yAxisId="right" className="text-[12px] font-bold" fontWeight="bold" orientation="right" label={{ value: yFieldText2, angle: -90, position: 'insideRight' }} />}
             <Tooltip content={<CustomTooltip active={undefined} payload={undefined} label={undefined} />} />
-            {showLegend && <Legend content={CustomLegend}/>}
+            {showLegend && <Legend content={CustomLegend as ContentType}/>}
             {/* 바 차트 (오른쪽 Y축 사용) */}
             <Bar 
               yAxisId="right" 

packages/common/business_components/src/ui/chart/LineChart.tsx

@@ -123,7 +123,7 @@ export default function Linechart({
           >
             <CartesianGrid vertical={false} />
             <XAxis dataKey="label" fontSize="8px" fontWeight="bold"/>
-            <YAxis yAxisId="left" fontSize="8px" fontWeight="bold" orientation="left" label={{ value: yFieldText, angle: -90, position: 'insideLeft' }} />
+            <YAxis yAxisId="left" className="text-[12px] font-bold" orientation="left" label={{ value: yFieldText, className:"text-[12px] foont-bold", angle: -90, position: 'insideLeft' }} />
             <Tooltip content={<CustomTooltip />} />
             {showLegend && <Legend content={CustomLegend as ContentType}/>}
             {Object.keys(chartData).map((key) => {

packages/common/business_components/src/ui/chart/index.tsx

@@ -18,6 +18,20 @@ const CHART_FORM = {
   LINEBAR : 'linebar'
 };
 
+/**
+ * 차트 컴포넌트
+ * @param chartForm 차트 형태
+ * @param chartConfig 차트 설정
+ * @param chartData 차트 데이터
+ * @param chartTitle 차트 제목
+ * @param chartClassName 차트 클래스명
+ * @param graphSize 차트 크기
+ * @param yFieldText 차트 Y축 텍스트
+ * @param yFieldText2 차트 Y축 텍스트2(라인바 차트때 사용)
+ * @param showLegend 차트 범례 표시 여부
+ * @returns 
+ */
+
 type MainChartProps = {
   chartForm: string;
   chartConfig: any;
@@ -25,7 +39,8 @@ type MainChartProps = {
   chartTitle: string;
   chartClassName?: string;
   graphSize?: number;
-  yFieldText? : string;
+  yFieldText? : string | undefined;
+  yFieldText2? : string | undefined;
   showLegend? : boolean;
 }
 
@@ -47,7 +62,7 @@ function MainChart(props: MainChartProps) {
     );
   } else if (props.chartForm == CHART_FORM.LINEBAR){
     return (
-      <LineBarchart chartConfig={props.chartConfig} chartData={props.chartData} chartTitle={props.chartTitle} chartClassName={props.chartClassName} graphSize={props.graphSize} yFieldText={props.yFieldText} showLegend={props.showLegend}>
+      <LineBarchart chartConfig={props.chartConfig} chartData={props.chartData} chartTitle={props.chartTitle} chartClassName={props.chartClassName} graphSize={props.graphSize} yFieldText={props.yFieldText} yFieldText2={props.yFieldText2} showLegend={props.showLegend}>
       </LineBarchart>
     );
   }