모달창 올리기

This commit is contained in:
kjs
2025-10-29 11:26:00 +09:00
parent eeae338cd4
commit efdef36cda
21 changed files with 727 additions and 728 deletions

View File

@@ -51,19 +51,6 @@ export const TextInputComponent: React.FC<TextInputComponentProps> = ({
// 숨김 상태 (props에서 전달받은 값 우선 사용)
const isHidden = props.hidden !== undefined ? props.hidden : component.hidden || componentConfig.hidden || false;
// 디버깅: 컴포넌트 설정 확인
console.log("👻 텍스트 입력 컴포넌트 상태:", {
componentId: component.id,
label: component.label,
isHidden,
componentConfig: componentConfig,
readonly: componentConfig.readonly,
disabled: componentConfig.disabled,
required: componentConfig.required,
isDesignMode,
willRender: !(isHidden && !isDesignMode),
});
// 자동생성된 값 상태
const [autoGeneratedValue, setAutoGeneratedValue] = useState<string>("");
@@ -94,55 +81,27 @@ export const TextInputComponent: React.FC<TextInputComponentProps> = ({
// 자동생성 값 생성 (컴포넌트 마운트 시 또는 폼 데이터 변경 시)
useEffect(() => {
console.log("🔄 자동생성 useEffect 실행:", {
enabled: testAutoGeneration.enabled,
type: testAutoGeneration.type,
isInteractive,
columnName: component.columnName,
hasFormData: !!formData,
hasOnFormDataChange: !!onFormDataChange,
});
if (testAutoGeneration.enabled && testAutoGeneration.type !== "none") {
// 폼 데이터에 이미 값이 있으면 자동생성하지 않음
const currentFormValue = formData?.[component.columnName];
const currentComponentValue = component.value;
console.log("🔍 자동생성 조건 확인:", {
currentFormValue,
currentComponentValue,
hasCurrentValue: !!(currentFormValue || currentComponentValue),
autoGeneratedValue,
});
// 자동생성된 값이 없고, 현재 값도 없을 때만 생성
if (!autoGeneratedValue && !currentFormValue && !currentComponentValue) {
const generatedValue = AutoGenerationUtils.generateValue(testAutoGeneration, component.columnName);
console.log("✨ 자동생성된 값:", generatedValue);
if (generatedValue) {
setAutoGeneratedValue(generatedValue);
// 폼 데이터에 자동생성된 값 설정 (인터랙티브 모드에서만)
if (isInteractive && onFormDataChange && component.columnName) {
console.log("📝 폼 데이터에 자동생성 값 설정:", {
columnName: component.columnName,
value: generatedValue,
});
onFormDataChange(component.columnName, generatedValue);
}
}
} else if (!autoGeneratedValue && testAutoGeneration.type !== "none") {
// 디자인 모드에서도 미리보기용 자동생성 값 표시
const previewValue = AutoGenerationUtils.generatePreviewValue(testAutoGeneration);
console.log("🎨 디자인 모드 미리보기 값:", previewValue);
setAutoGeneratedValue(previewValue);
} else {
console.log("⏭️ 이미 값이 있어서 자동생성 건너뜀:", {
hasAutoGenerated: !!autoGeneratedValue,
hasFormValue: !!currentFormValue,
hasComponentValue: !!currentComponentValue,
});
}
}
}, [testAutoGeneration, isInteractive, component.columnName, component.value, formData, onFormDataChange]);
@@ -159,11 +118,12 @@ export const TextInputComponent: React.FC<TextInputComponentProps> = ({
...component.style,
...style,
// 숨김 기능: 편집 모드에서만 연하게 표시
...(isHidden && isDesignMode && {
opacity: 0.4,
backgroundColor: "#f3f4f6",
pointerEvents: "auto",
}),
...(isHidden &&
isDesignMode && {
opacity: 0.4,
backgroundColor: "#f3f4f6",
pointerEvents: "auto",
}),
};
// 디자인 모드 스타일
@@ -636,18 +596,6 @@ export const TextInputComponent: React.FC<TextInputComponentProps> = ({
displayValue = typeof rawValue === "object" ? "" : String(rawValue);
}
console.log("📄 Input 값 계산:", {
isInteractive,
hasFormData: !!formData,
columnName: component.columnName,
formDataValue: formData?.[component.columnName],
formDataValueType: typeof formData?.[component.columnName],
componentValue: component.value,
autoGeneratedValue,
finalDisplayValue: displayValue,
isObject: typeof displayValue === "object",
});
return displayValue;
})()}
placeholder={