Merge branch 'iipbs/common/main' into iipbs/sn/dev

This commit is contained in:
2025-07-24 22:04:25 +09:00
6 changed files with 32 additions and 52 deletions
@@ -6,6 +6,7 @@ import {
type ChartConfig type ChartConfig
} from "./lib/chart"; } from "./lib/chart";
import type { CSSProperties } from "react"; import type { CSSProperties } from "react";
import { formatCommaNumber } from "./lib/function";
const customStyles = { const customStyles = {
legendContainer: { legendContainer: {
@@ -119,6 +120,7 @@ export default function Chart({chartConfig=undefined, chartData=[], chartTitle='
fontWeight={500} fontWeight={500}
domain={[0, globalMax]} domain={[0, globalMax]}
ticks={ticks} ticks={ticks}
tickFormatter={(value) => formatCommaNumber(value)}
label={yFieldText ? { value: yFieldText, className:"text-[15px] font-bold", position: 'insideLeft', angle: -90, offset: -30 } : undefined} label={yFieldText ? { value: yFieldText, className:"text-[15px] font-bold", position: 'insideLeft', angle: -90, offset: -30 } : undefined}
/> />
<ChartTooltip cursor={false} content={<CustomTooltip active={undefined} payload={undefined} label={undefined} />}/> <ChartTooltip cursor={false} content={<CustomTooltip active={undefined} payload={undefined} label={undefined} />}/>
@@ -94,6 +94,7 @@ export default function LineBarchart({
// 데이터의 최대값 계산 // 데이터의 최대값 계산
const getMaxValue = (data: any[], keyPrefix: string) => { const getMaxValue = (data: any[], keyPrefix: string) => {
if (!data || data.length === 0) return 0;
return Math.max(...data.map(item => return Math.max(...data.map(item =>
Object.keys(item) Object.keys(item)
.filter(key => key.includes(keyPrefix)) .filter(key => key.includes(keyPrefix))
@@ -0,0 +1,12 @@
// 숫자입력시 , 삽입
export const formatCommaNumber = (
value: number | string | undefined | null
): string => {
if (value === undefined || value === null || value === "") return "";
const num = Number(value);
// 숫자로 변환할 수 없는 값이 들어올 경우 빈 문자열을 반환하여 예상치 못한 "NaN" 출력을 방지합니다.
if (isNaN(num)) {
return "";
}
return num.toLocaleString();
};
@@ -86,20 +86,28 @@ function Gis({
foundFeature = data; foundFeature = data;
} else { } else {
// 아니면 featureId로 맵에서 Feature 인스턴스를 찾아서 사용 // 아니면 featureId로 맵에서 Feature 인스턴스를 찾아서 사용
let featureId let featureId = data.fid;
const layerName = layerNmRef.current const layerName = layerNmRef.current
if (layerName === '하수재이용시설') { if (layerName === '하수재이용시설') {
featureId = data.searchPk; featureId = data.searchPk;
} else if (layerName === '빗물이용시설'|| layerName == '중수도시설') { } else if (layerName === '빗물이용시설' || layerName == '중수도시설') {
featureId = data.bdstInfoSn; featureId = data.bdstInfoSn;
} else if (layerName === '하수처리시설') { } else if (layerName === '하수처리시설') {
featureId = data.bscFctCd; featureId = data.bscFctCd;
} else if (layerName === '온배수시설' ) { } else if (layerName === '온배수시설') {
featureId = data.bdstRuseFcltSn; featureId = data.bdstRuseFcltSn;
} else { } else {
console.warn('해당 레이어에 대한 featureId 매핑 없음', layerNm); console.warn('해당 레이어에 대한 featureId 매핑 없음', layerNm);
featureId = data.fid || data.id || data.ftrIdn; featureId = data.fid || data.id || data.ftrIdn;
} }
// gisMap.getLayers().getArray().forEach(layer => {
// const source = layer.getSource?.();
// if (source?.getFeatureById) {
// const feature = source.getFeatureById(String(featureId).trim());
// if (feature) foundFeature = feature;
// }
// });
// const [layerType, id] = String(featureId).split('.');
gisMap.getLayers().getArray().forEach(layer => { gisMap.getLayers().getArray().forEach(layer => {
const source = layer.getSource?.(); const source = layer.getSource?.();
if (source?.getFeatures) { if (source?.getFeatures) {
@@ -1,45 +0,0 @@
/**
* @remarks
* 이 버전은 SearchModal에서 사용하기 위해 `SelectContent`의 z-index를 `z-[101]`로 수정하였습니다.
*/
import { Label } from "@common/components";
import React from "react";
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "./lib/selectBox";
/** 차트 기본 스타일 */
interface SelectBox1 {
text:string,
val:string|number
}
const SelectBox2 = React.forwardRef<
HTMLDivElement,
React.HTMLAttributes<HTMLDivElement> & {
label:string,
selectClass:string|undefined,
className:string,
selectArray:SelectBox1[],
onSelectValue:(val:string|number)=>void,
value?: string|number
}
>(({ label, className, selectClass, selectArray, onSelectValue, value }, ref)=>{
const placeHolder = selectArray?.[0]?.text ?? "";
return (
<div className={className+" flex items-center flex-nowrap"} ref={ref}>
{label && <Label className="inline-block w-auto whitespace-nowrap text-xl text-gray-600 mr-2">{label}</Label>}
<Select onValueChange={onSelectValue} value={value !== undefined ? String(value) : undefined}>
<SelectTrigger className={selectClass?selectClass:"flex-1 p-2 border rounded"}>
<SelectValue placeholder={placeHolder} />
</SelectTrigger>
<SelectContent className="z-[101]">
{selectArray.map((selectArray) => (
<SelectItem key={selectArray.val} value={String(selectArray.val)}>{selectArray.text}</SelectItem>
))}
</SelectContent>
</Select>
</div>
)
})
export { SelectBox2 };
@@ -27,6 +27,7 @@ const SelectBox = React.forwardRef<
onSelectValue: (val: string | number) => void; onSelectValue: (val: string | number) => void;
value?: string | number; value?: string | number;
readOnly?: boolean; // readOnly 속성 추가 readOnly?: boolean; // readOnly 속성 추가
selectContentClass?: string;
} }
>( >(
( (
@@ -38,6 +39,7 @@ const SelectBox = React.forwardRef<
onSelectValue, onSelectValue,
value, value,
readOnly = false, readOnly = false,
selectContentClass,
}, },
ref, ref,
) => { ) => {
@@ -87,7 +89,7 @@ const SelectBox = React.forwardRef<
> >
<SelectValue placeholder={placeHolder} /> <SelectValue placeholder={placeHolder} />
</SelectTrigger> </SelectTrigger>
<SelectContent> <SelectContent className={selectContentClass}>
{visibleItems.map((selectArray) => ( {visibleItems.map((selectArray) => (
<SelectItem key={selectArray.val} value={String(selectArray.val)}> <SelectItem key={selectArray.val} value={String(selectArray.val)}>
{selectArray.text} {selectArray.text}