ERP-node/frontend/lib/utils/getConfigPanelComponent.tsx

136 lines
5.7 KiB
TypeScript
Raw Normal View History

2025-09-09 15:42:04 +09:00
// 설정 패널 컴포넌트 동적 매핑
import React from "react";
import { DateTypeConfigPanel } from "@/components/screen/panels/webtype-configs/DateTypeConfigPanel";
import { NumberTypeConfigPanel } from "@/components/screen/panels/webtype-configs/NumberTypeConfigPanel";
import { SelectTypeConfigPanel } from "@/components/screen/panels/webtype-configs/SelectTypeConfigPanel";
import { TextTypeConfigPanel } from "@/components/screen/panels/webtype-configs/TextTypeConfigPanel";
import { TextareaTypeConfigPanel } from "@/components/screen/panels/webtype-configs/TextareaTypeConfigPanel";
import { CheckboxTypeConfigPanel } from "@/components/screen/panels/webtype-configs/CheckboxTypeConfigPanel";
import { RadioTypeConfigPanel } from "@/components/screen/panels/webtype-configs/RadioTypeConfigPanel";
import { FileTypeConfigPanel } from "@/components/screen/panels/webtype-configs/FileTypeConfigPanel";
import { CodeTypeConfigPanel } from "@/components/screen/panels/webtype-configs/CodeTypeConfigPanel";
import { EntityTypeConfigPanel } from "@/components/screen/panels/webtype-configs/EntityTypeConfigPanel";
import { RatingTypeConfigPanel } from "@/components/screen/panels/webtype-configs/RatingTypeConfigPanel";
2025-09-10 14:09:32 +09:00
import { ButtonConfigPanel as OriginalButtonConfigPanel } from "@/components/screen/config-panels/ButtonConfigPanel";
import { CardConfigPanel } from "@/components/screen/config-panels/CardConfigPanel";
import { DashboardConfigPanel } from "@/components/screen/config-panels/DashboardConfigPanel";
2025-09-09 15:42:04 +09:00
// 설정 패널 컴포넌트 타입
export type ConfigPanelComponent = React.ComponentType<{
config: any;
onConfigChange: (config: any) => void;
tableName?: string; // 화면 테이블명 (선택)
menuObjid?: number; // 메뉴 objid (선택)
2025-09-09 15:42:04 +09:00
}>;
2025-09-10 14:09:32 +09:00
// ButtonConfigPanel 래퍼 (config/onConfigChange → component/onUpdateProperty 변환)
const ButtonConfigPanelWrapper: ConfigPanelComponent = ({ config, onConfigChange }) => {
// config를 component 형태로 변환
const mockComponent = {
id: "temp",
type: "widget" as const,
componentConfig: { type: "button" },
webTypeConfig: config,
style: {},
};
// onConfigChange를 onUpdateProperty 형태로 변환
const handleUpdateProperty = (path: string, value: any) => {
if (path.startsWith("webTypeConfig.")) {
const configKey = path.replace("webTypeConfig.", "");
onConfigChange({ ...config, [configKey]: value });
}
};
return <OriginalButtonConfigPanel component={mockComponent as any} onUpdateProperty={handleUpdateProperty} />;
};
// CardConfigPanel 래퍼
const CardConfigPanelWrapper: ConfigPanelComponent = ({ config, onConfigChange }) => {
const mockComponent = {
id: "temp",
type: "card" as const,
componentConfig: config,
style: {},
};
const handleUpdateProperty = (path: string, value: any) => {
if (path.startsWith("componentConfig.")) {
const configKey = path.replace("componentConfig.", "");
onConfigChange({ ...config, [configKey]: value });
}
};
return <CardConfigPanel component={mockComponent as any} onUpdateProperty={handleUpdateProperty} />;
};
// DashboardConfigPanel 래퍼
const DashboardConfigPanelWrapper: ConfigPanelComponent = ({ config, onConfigChange }) => {
const mockComponent = {
id: "temp",
type: "dashboard" as const,
componentConfig: config,
style: {},
};
const handleUpdateProperty = (path: string, value: any) => {
if (path.startsWith("componentConfig.")) {
const configKey = path.replace("componentConfig.", "");
onConfigChange({ ...config, [configKey]: value });
}
};
return <DashboardConfigPanel component={mockComponent as any} onUpdateProperty={handleUpdateProperty} />;
};
2025-09-09 15:42:04 +09:00
// 설정 패널 이름으로 직접 매핑하는 함수 (DB의 config_panel 필드용)
export const getConfigPanelComponent = (panelName: string): ConfigPanelComponent | null => {
console.log(`🔧 getConfigPanelComponent 호출: panelName="${panelName}"`);
// "none"이나 빈 값은 null 반환 (기본 설정)
if (!panelName || panelName === "none") {
console.log(`🔧 빈 값 또는 "none" → null 반환`);
return null;
}
switch (panelName) {
case "DateTypeConfigPanel":
return DateTypeConfigPanel;
case "NumberTypeConfigPanel":
return NumberTypeConfigPanel;
case "SelectTypeConfigPanel":
return SelectTypeConfigPanel;
case "TextTypeConfigPanel":
return TextTypeConfigPanel;
case "TextareaTypeConfigPanel":
return TextareaTypeConfigPanel;
case "CheckboxTypeConfigPanel":
return CheckboxTypeConfigPanel;
case "RadioTypeConfigPanel":
return RadioTypeConfigPanel;
case "FileTypeConfigPanel":
return FileTypeConfigPanel;
case "CodeTypeConfigPanel":
return CodeTypeConfigPanel;
case "EntityTypeConfigPanel":
return EntityTypeConfigPanel;
case "RatingTypeConfigPanel":
console.log(`🔧 RatingTypeConfigPanel 컴포넌트 반환`);
console.log(`🔧 RatingTypeConfigPanel 타입:`, typeof RatingTypeConfigPanel);
console.log(`🔧 RatingTypeConfigPanel 내용:`, RatingTypeConfigPanel);
return RatingTypeConfigPanel;
2025-09-09 17:42:23 +09:00
case "ButtonConfigPanel":
2025-09-10 14:09:32 +09:00
console.log(`🔧 ButtonConfigPanel 래퍼 컴포넌트 반환`);
return ButtonConfigPanelWrapper;
case "CardConfigPanel":
console.log(`🔧 CardConfigPanel 래퍼 컴포넌트 반환`);
return CardConfigPanelWrapper;
case "DashboardConfigPanel":
console.log(`🔧 DashboardConfigPanel 래퍼 컴포넌트 반환`);
return DashboardConfigPanelWrapper;
2025-09-09 15:42:04 +09:00
default:
console.warn(`🔧 알 수 없는 설정 패널: ${panelName}, 기본 설정 사용`);
return null; // 기본 설정 (패널 없음)
}
};