jskim/vexplor_dev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

console.log 주석 처리 - 개발환경 정리

Browse Source 
- menu, company, screenMng, i18n, tableMng 모듈 console 주석 처리
- 총 55개 파일 수정
- 빌드 에러 수정 완료
- 백엔드 서버 정상 작동 확인

관련 파일:
- frontend/components/admin/MenuManagement.tsx
- frontend/components/admin/MenuFormModal.tsx
- frontend/components/admin/ScreenAssignmentTab.tsx
- frontend/components/admin/CompanyTable.tsx
- frontend/components/admin/MultiLang.tsx
- frontend/app/(main)/admin/tableMng/page.tsx
- 기타 screen 관련 컴포넌트 49개 파일
This commit is contained in:
leeheejin
2025-10-01 18:17:30 +09:00
parent 4202a5b310
commit 2c0dca08b4
55 changed files with 1757 additions and 1464 deletions
Download Patch File Download Diff File Expand all files Collapse all files

460
frontend/components/screen/panels/FileComponentConfigPanel.tsx
View File

@@ -28,13 +28,13 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
currentTable,
currentTableName,
}) => {
console.log("🎨🎨🎨 FileComponentConfigPanel 렌더링:", {
componentId: component?.id,
componentType: component?.type,
hasOnUpdateProperty: !!onUpdateProperty,
currentTable,
currentTableName
});
// console.log("🎨🎨🎨 FileComponentConfigPanel 렌더링:", {
// componentId: component?.id,
// componentType: component?.type,
// hasOnUpdateProperty: !!onUpdateProperty,
// currentTable,
// currentTableName
// });
// fileConfig가 없는 경우 초기화
React.useEffect(() => {
if (!component.fileConfig) {
@@ -90,11 +90,11 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
const currentState = getGlobalFileState();
const newState = updater(currentState);
(window as any).globalFileState = newState;
console.log("🌐 전역 파일 상태 업데이트:", {
componentId: component.id,
newFileCount: newState[component.id]?.length || 0,
totalComponents: Object.keys(newState).length
});
// console.log("🌐 전역 파일 상태 업데이트:", {
// componentId: component.id,
// newFileCount: newState[component.id]?.length || 0,
// totalComponents: Object.keys(newState).length
// });
// 강제 리렌더링을 위한 이벤트 발생
window.dispatchEvent(new CustomEvent('globalFileStateChanged', {
@@ -103,13 +103,13 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
// 디버깅용 전역 함수 등록
(window as any).debugFileState = () => {
console.log("🔍 전역 파일 상태 디버깅:", {
globalState: (window as any).globalFileState,
localStorage: Object.keys(localStorage).filter(key => key.startsWith('fileComponent_')).map(key => ({
key,
data: JSON.parse(localStorage.getItem(key) || '[]')
}))
});
// console.log("🔍 전역 파일 상태 디버깅:", {
// globalState: (window as any).globalFileState,
// localStorage: Object.keys(localStorage).filter(key => key.startsWith('fileComponent_')).map(key => ({
// key,
// data: JSON.parse(localStorage.getItem(key) || '[]')
// }))
// });
};
}
};
@@ -136,7 +136,7 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
try {
parsedBackupFiles = JSON.parse(backupFiles);
} catch (error) {
console.error("백업 파일 파싱 실패:", error);
// console.error("백업 파일 파싱 실패:", error);
}
}
@@ -144,7 +144,7 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
try {
parsedTempFiles = JSON.parse(tempBackupFiles);
} catch (error) {
console.error("임시 파일 파싱 실패:", error);
// console.error("임시 파일 파싱 실패:", error);
}
}
@@ -153,7 +153,7 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
try {
parsedFileUploadFiles = JSON.parse(fileUploadBackupFiles);
} catch (error) {
console.error("FileUploadComponent 백업 파일 파싱 실패:", error);
// console.error("FileUploadComponent 백업 파일 파싱 실패:", error);
}
}
@@ -164,19 +164,19 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
parsedTempFiles.length > 0 ? parsedTempFiles :
componentFiles;
console.log("🚀 FileComponentConfigPanel 초기화:", {
componentId: component.id,
componentFiles: componentFiles.length,
globalFiles: globalFiles.length,
backupFiles: parsedBackupFiles.length,
tempFiles: parsedTempFiles.length,
fileUploadFiles: parsedFileUploadFiles.length, // 🎯 실제 화면 파일 수
finalFiles: finalFiles.length,
source: globalFiles.length > 0 ? 'global' :
parsedFileUploadFiles.length > 0 ? 'fileUploadComponent' : // 🎯 실제 화면 소스
parsedBackupFiles.length > 0 ? 'localStorage' :
parsedTempFiles.length > 0 ? 'temp' : 'component'
});
// console.log("🚀 FileComponentConfigPanel 초기화:", {
// componentId: component.id,
// componentFiles: componentFiles.length,
// globalFiles: globalFiles.length,
// backupFiles: parsedBackupFiles.length,
// tempFiles: parsedTempFiles.length,
// fileUploadFiles: parsedFileUploadFiles.length, // 🎯 실제 화면 파일 수
// finalFiles: finalFiles.length,
// source: globalFiles.length > 0 ? 'global' :
// parsedFileUploadFiles.length > 0 ? 'fileUploadComponent' : // 🎯 실제 화면 소스
// parsedBackupFiles.length > 0 ? 'localStorage' :
// parsedTempFiles.length > 0 ? 'temp' : 'component'
// });
return finalFiles;
};
@@ -188,10 +188,10 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
setTimeout(() => {
onUpdateProperty(component.id, "uploadedFiles", initialFiles);
onUpdateProperty(component.id, "lastFileUpdate", Date.now());
console.log("🔄 초기화 시 컴포넌트 속성 동기화:", {
componentId: component.id,
fileCount: initialFiles.length
});
// console.log("🔄 초기화 시 컴포넌트 속성 동기화:", {
// componentId: component.id,
// fileCount: initialFiles.length
// });
}, 0);
}
return initialFiles;
@@ -216,15 +216,15 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
// 파일 업로드 처리
const handleFileUpload = useCallback(async (files: FileList | File[]) => {
console.log("🚀🚀🚀 FileComponentConfigPanel 파일 업로드 시작:", {
filesCount: files?.length || 0,
componentId: component?.id,
componentType: component?.type,
hasOnUpdateProperty: !!onUpdateProperty
});
// console.log("🚀🚀🚀 FileComponentConfigPanel 파일 업로드 시작:", {
// filesCount: files?.length || 0,
// componentId: component?.id,
// componentType: component?.type,
// hasOnUpdateProperty: !!onUpdateProperty
// });
if (!files || files.length === 0) {
console.log("❌ 파일이 없음");
// console.log("❌ 파일이 없음");
return;
}
@@ -251,23 +251,23 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
if (!isAllowed) {
toast.error(`${file.name}: 허용되지 않는 파일 형식입니다. (허용: ${acceptTypes.join(', ')})`);
console.log(`파일 검증 실패:`, {
fileName: file.name,
fileType: file.type,
fileExt,
acceptTypes,
isAllowed
});
// console.log(`파일 검증 실패:`, {
// fileName: file.name,
// fileType: file.type,
// fileExt,
// acceptTypes,
// isAllowed
// });
continue;
}
}
console.log(`파일 검증 성공:`, {
fileName: file.name,
fileType: file.type,
fileSize: file.size,
acceptTypesCount: acceptTypes.length
});
// console.log(`파일 검증 성공:`, {
// fileName: file.name,
// fileType: file.type,
// fileSize: file.size,
// acceptTypesCount: acceptTypes.length
// });
validFiles.push(file);
}
@@ -280,27 +280,27 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
const duplicates: string[] = [];
const uniqueFiles: File[] = [];
console.log("🔍 중복 파일 체크:", {
uploadedFiles: existingFiles.length,
existingFileNames: existingFileNames,
newFiles: validFiles.map(f => f.name.toLowerCase())
});
// console.log("🔍 중복 파일 체크:", {
// uploadedFiles: existingFiles.length,
// existingFileNames: existingFileNames,
// newFiles: validFiles.map(f => f.name.toLowerCase())
// });
validFiles.forEach(file => {
const fileName = file.name.toLowerCase();
if (existingFileNames.includes(fileName)) {
duplicates.push(file.name);
console.log("❌ 중복 파일 발견:", file.name);
// console.log("❌ 중복 파일 발견:", file.name);
} else {
uniqueFiles.push(file);
console.log("✅ 새로운 파일:", file.name);
// console.log("✅ 새로운 파일:", file.name);
}
});
console.log("🔍 중복 체크 결과:", {
duplicates: duplicates,
uniqueFiles: uniqueFiles.map(f => f.name)
});
// console.log("🔍 중복 체크 결과:", {
// duplicates: duplicates,
// uniqueFiles: uniqueFiles.map(f => f.name)
// });
if (duplicates.length > 0) {
toast.error(`중복된 파일이 있습니다: ${duplicates.join(', ')}`, {
@@ -319,11 +319,11 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
const filesToUpload = uniqueFiles.length > 0 ? uniqueFiles : validFiles;
try {
console.log("🔄 파일 업로드 시작:", {
originalFiles: validFiles.length,
filesToUpload: filesToUpload.length,
uploading
});
// console.log("🔄 파일 업로드 시작:", {
// originalFiles: validFiles.length,
// filesToUpload: filesToUpload.length,
// uploading
// });
setUploading(true);
toast.loading(`${filesToUpload.length}개 파일 업로드 중...`);
@@ -344,21 +344,21 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
// 3차: 기본값 설정
if (!screenId) {
screenId = 40; // 기본 화면 ID (디자인 모드용)
console.warn("⚠️ screenId를 찾을 수 없어 기본값(40) 사용");
// console.warn("⚠️ screenId를 찾을 수 없어 기본값(40) 사용");
}
const componentId = component.id;
const fieldName = component.columnName || component.id || 'file_attachment';
console.log("📋 파일 업로드 기본 정보:", {
screenId,
screenIdSource: (window as any).__CURRENT_SCREEN_ID__ ? 'global' : 'url_or_default',
componentId,
fieldName,
docType: localInputs.docType,
docTypeName: localInputs.docTypeName,
currentPath: typeof window !== 'undefined' ? window.location.pathname : 'unknown'
});
// console.log("📋 파일 업로드 기본 정보:", {
// screenId,
// screenIdSource: (window as any).__CURRENT_SCREEN_ID__ ? 'global' : 'url_or_default',
// componentId,
// fieldName,
// docType: localInputs.docType,
// docTypeName: localInputs.docTypeName,
// currentPath: typeof window !== 'undefined' ? window.location.pathname : 'unknown'
// });
const response = await uploadFiles({
files: filesToUpload,
@@ -372,11 +372,11 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
docTypeName: localInputs.docTypeName,
});
console.log("📤 파일 업로드 응답:", response);
// console.log("📤 파일 업로드 응답:", response);
if (response.success && (response.data || response.files)) {
const filesData = response.data || response.files;
console.log("📁 업로드된 파일 데이터:", filesData);
// console.log("📁 업로드된 파일 데이터:", filesData);
const newFiles: FileInfo[] = filesData.map((file: any) => ({
objid: file.objid || `temp_${Date.now()}_${Math.random()}`,
savedFileName: file.saved_file_name || file.savedFileName,
@@ -431,10 +431,10 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
source: 'designMode' // 🎯 화면설계 모드에서 온 이벤트임을 표시
};
console.log("🚀🚀🚀 FileComponentConfigPanel 이벤트 발생:", eventDetail);
console.log("🔍 현재 컴포넌트 ID:", component.id);
console.log("🔍 업로드된 파일 수:", updatedFiles.length);
console.log("🔍 파일 목록:", updatedFiles.map(f => f.name));
// console.log("🚀🚀🚀 FileComponentConfigPanel 이벤트 발생:", eventDetail);
// console.log("🔍 현재 컴포넌트 ID:", component.id);
// console.log("🔍 업로드된 파일 수:", updatedFiles.length);
// console.log("🔍 파일 목록:", updatedFiles.map(f => f.name));
const event = new CustomEvent('globalFileStateChanged', {
detail: eventDetail
@@ -444,49 +444,49 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
const listenerCount = window.getEventListeners ?
window.getEventListeners(window)?.globalFileStateChanged?.length || 0 :
'unknown';
console.log("🔍 globalFileStateChanged 리스너 수:", listenerCount);
// console.log("🔍 globalFileStateChanged 리스너 수:", listenerCount);
window.dispatchEvent(event);
console.log("✅✅✅ globalFileStateChanged 이벤트 발생 완료");
// console.log("✅✅✅ globalFileStateChanged 이벤트 발생 완료");
// 강제로 모든 RealtimePreview 컴포넌트에게 알림 (여러 번)
setTimeout(() => {
console.log("🔄 추가 이벤트 발생 (지연 100ms)");
// console.log("🔄 추가 이벤트 발생 (지연 100ms)");
window.dispatchEvent(new CustomEvent('globalFileStateChanged', {
detail: { ...eventDetail, delayed: true }
}));
}, 100);
setTimeout(() => {
console.log("🔄 추가 이벤트 발생 (지연 300ms)");
// console.log("🔄 추가 이벤트 발생 (지연 300ms)");
window.dispatchEvent(new CustomEvent('globalFileStateChanged', {
detail: { ...eventDetail, delayed: true, attempt: 2 }
}));
}, 300);
setTimeout(() => {
console.log("🔄 추가 이벤트 발생 (지연 500ms)");
// console.log("🔄 추가 이벤트 발생 (지연 500ms)");
window.dispatchEvent(new CustomEvent('globalFileStateChanged', {
detail: { ...eventDetail, delayed: true, attempt: 3 }
}));
}, 500);
// 직접 전역 상태 강제 업데이트
console.log("🔄 전역 상태 강제 업데이트 시도");
// console.log("🔄 전역 상태 강제 업데이트 시도");
if ((window as any).forceRealtimePreviewUpdate) {
(window as any).forceRealtimePreviewUpdate(component.id, updatedFiles);
}
}
console.log("🔄 FileComponentConfigPanel 자동 저장:", {
componentId: component.id,
uploadedFiles: updatedFiles.length,
status: "자동 영구 저장됨",
onUpdatePropertyExists: typeof onUpdateProperty === 'function',
globalFileStateUpdated: getGlobalFileState()[component.id]?.length || 0,
localStorageBackup: localStorage.getItem(`fileComponent_${component.id}_files`) ? 'saved' : 'not saved'
});
// console.log("🔄 FileComponentConfigPanel 자동 저장:", {
// componentId: component.id,
// uploadedFiles: updatedFiles.length,
// status: "자동 영구 저장됨",
// onUpdatePropertyExists: typeof onUpdateProperty === 'function',
// globalFileStateUpdated: getGlobalFileState()[component.id]?.length || 0,
// localStorageBackup: localStorage.getItem(`fileComponent_${component.id}_files`) ? 'saved' : 'not saved'
// });
// 그리드 파일 상태 새로고침 이벤트 발생
if (typeof window !== 'undefined') {
@@ -505,40 +505,40 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
}
});
window.dispatchEvent(refreshEvent);
console.log("🔄 FileComponentConfigPanel 그리드 새로고침 이벤트 발생:", {
tableName,
recordId,
columnName,
targetObjid,
fileCount: updatedFiles.length
});
// console.log("🔄 FileComponentConfigPanel 그리드 새로고침 이벤트 발생:", {
// tableName,
// recordId,
// columnName,
// targetObjid,
// fileCount: updatedFiles.length
// });
}
toast.dismiss();
toast.success(`${validFiles.length}개 파일이 성공적으로 업로드되었습니다.`);
console.log("✅ 파일 업로드 성공:", {
newFilesCount: newFiles.length,
totalFiles: updatedFiles.length,
componentId: component.id,
updatedFiles: updatedFiles.map(f => ({ objid: f.objid, name: f.realFileName }))
});
// console.log("✅ 파일 업로드 성공:", {
// newFilesCount: newFiles.length,
// totalFiles: updatedFiles.length,
// componentId: component.id,
// updatedFiles: updatedFiles.map(f => ({ objid: f.objid, name: f.realFileName }))
// });
} else {
throw new Error(response.message || '파일 업로드에 실패했습니다.');
}
} catch (error: any) {
console.error('❌ 파일 업로드 오류:', {
error,
errorMessage: error?.message,
errorResponse: error?.response?.data,
errorStatus: error?.response?.status,
componentId: component?.id,
screenId,
fieldName
});
// console.error('❌ 파일 업로드 오류:', {
// error,
// errorMessage: error?.message,
// errorResponse: error?.response?.data,
// errorStatus: error?.response?.status,
// componentId: component?.id,
// screenId,
// fieldName
// });
toast.dismiss();
toast.error(`파일 업로드에 실패했습니다: ${error?.message || '알 수 없는 오류'}`);
} finally {
console.log("🏁 파일 업로드 완료, 로딩 상태 해제");
// console.log("🏁 파일 업로드 완료, 로딩 상태 해제");
setUploading(false);
}
}, [localInputs, localValues, uploadedFiles, onUpdateProperty, currentTableName, component, acceptTypes]);
@@ -553,24 +553,24 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
});
toast.success(`${file.realFileName || file.name} 다운로드가 완료되었습니다.`);
} catch (error) {
console.error('파일 다운로드 오류:', error);
// console.error('파일 다운로드 오류:', error);
toast.error('파일 다운로드에 실패했습니다.');
}
}, []);
// 파일 삭제 처리
const handleFileDelete = useCallback(async (fileId: string) => {
console.log("🗑️🗑️🗑️ FileComponentConfigPanel 파일 삭제 시작:", {
fileId,
componentId: component?.id,
currentFilesCount: uploadedFiles.length,
hasOnUpdateProperty: !!onUpdateProperty
});
// console.log("🗑️🗑️🗑️ FileComponentConfigPanel 파일 삭제 시작:", {
// fileId,
// componentId: component?.id,
// currentFilesCount: uploadedFiles.length,
// hasOnUpdateProperty: !!onUpdateProperty
// });
try {
console.log("📡 deleteFile API 호출 시작...");
// console.log("📡 deleteFile API 호출 시작...");
await deleteFile(fileId, 'temp_record');
console.log("✅ deleteFile API 호출 성공");
// console.log("✅ deleteFile API 호출 성공");
const updatedFiles = uploadedFiles.filter(file => file.objid !== fileId && file.id !== fileId);
setUploadedFiles(updatedFiles);
@@ -591,12 +591,12 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
localStorage.setItem(backupKey, JSON.stringify(updatedFiles));
localStorage.setItem(tempBackupKey, JSON.stringify(updatedFiles));
console.log("🗑️ FileComponentConfigPanel 파일 삭제:", {
componentId: component.id,
deletedFileId: fileId,
remainingFiles: updatedFiles.length,
timestamp: timestamp
});
// console.log("🗑️ FileComponentConfigPanel 파일 삭제:", {
// componentId: component.id,
// deletedFileId: fileId,
// remainingFiles: updatedFiles.length,
// timestamp: timestamp
// });
// 🎯 RealtimePreview 동기화를 위한 전역 이벤트 발생
if (typeof window !== 'undefined') {
@@ -610,39 +610,39 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
source: 'designMode' // 🎯 화면설계 모드에서 온 이벤트임을 표시
};
console.log("🚀🚀🚀 FileComponentConfigPanel 삭제 이벤트 발생:", eventDetail);
// console.log("🚀🚀🚀 FileComponentConfigPanel 삭제 이벤트 발생:", eventDetail);
const event = new CustomEvent('globalFileStateChanged', {
detail: eventDetail
});
window.dispatchEvent(event);
console.log("✅✅✅ globalFileStateChanged 삭제 이벤트 발생 완료");
// console.log("✅✅✅ globalFileStateChanged 삭제 이벤트 발생 완료");
// 추가 지연 이벤트들
setTimeout(() => {
try {
console.log("🔄 추가 삭제 이벤트 발생 (지연 100ms)");
// console.log("🔄 추가 삭제 이벤트 발생 (지연 100ms)");
window.dispatchEvent(new CustomEvent('globalFileStateChanged', {
detail: { ...eventDetail, delayed: true }
}));
} catch (error) {
console.warn("FileComponentConfigPanel 지연 이벤트 발생 실패:", error);
// console.warn("FileComponentConfigPanel 지연 이벤트 발생 실패:", error);
}
}, 100);
setTimeout(() => {
try {
console.log("🔄 추가 삭제 이벤트 발생 (지연 300ms)");
// console.log("🔄 추가 삭제 이벤트 발생 (지연 300ms)");
window.dispatchEvent(new CustomEvent('globalFileStateChanged', {
detail: { ...eventDetail, delayed: true, attempt: 2 }
}));
} catch (error) {
console.warn("FileComponentConfigPanel 지연 이벤트 발생 실패:", error);
// console.warn("FileComponentConfigPanel 지연 이벤트 발생 실패:", error);
}
}, 300);
} catch (error) {
console.warn("FileComponentConfigPanel 이벤트 발생 실패:", error);
// console.warn("FileComponentConfigPanel 이벤트 발생 실패:", error);
}
// 그리드 파일 상태 새로고침 이벤트도 유지
@@ -663,20 +663,20 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
});
window.dispatchEvent(refreshEvent);
} catch (error) {
console.warn("FileComponentConfigPanel refreshFileStatus 이벤트 발생 실패:", error);
// console.warn("FileComponentConfigPanel refreshFileStatus 이벤트 발생 실패:", error);
}
console.log("🔄 FileComponentConfigPanel 파일 삭제 후 그리드 새로고침:", {
tableName,
recordId,
columnName,
targetObjid,
fileCount: updatedFiles.length
});
// console.log("🔄 FileComponentConfigPanel 파일 삭제 후 그리드 새로고침:", {
// tableName,
// recordId,
// columnName,
// targetObjid,
// fileCount: updatedFiles.length
// });
}
toast.success('파일이 삭제되었습니다.');
} catch (error) {
console.error('파일 삭제 오류:', error);
// console.error('파일 삭제 오류:', error);
toast.error('파일 삭제에 실패했습니다.');
}
}, [uploadedFiles, onUpdateProperty, component.id]);
@@ -703,16 +703,16 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
const tempBackupKey = `fileComponent_${component.id}_files_temp`;
localStorage.removeItem(tempBackupKey);
console.log("💾 파일 저장 완료:", {
componentId: component.id,
fileCount: uploadedFiles.length,
timestamp: timestamp,
files: uploadedFiles.map(f => ({ objid: f.objid, name: f.realFileName }))
});
// console.log("💾 파일 저장 완료:", {
// componentId: component.id,
// fileCount: uploadedFiles.length,
// timestamp: timestamp,
// files: uploadedFiles.map(f => ({ objid: f.objid, name: f.realFileName }))
// });
toast.success(`${uploadedFiles.length}개 파일이 영구 저장되었습니다.`);
} catch (error) {
console.error('파일 저장 오류:', error);
// console.error('파일 저장 오류:', error);
toast.error('파일 저장에 실패했습니다.');
}
}, [uploadedFiles, onUpdateProperty, component.id, setGlobalFileState]);
@@ -732,21 +732,21 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
e.preventDefault();
setDragOver(false);
const files = e.dataTransfer.files;
console.log("📂 드래그앤드롭 이벤트:", {
filesCount: files.length,
files: files.length > 0 ? Array.from(files).map(f => f.name) : [],
componentId: component?.id
});
// console.log("📂 드래그앤드롭 이벤트:", {
// filesCount: files.length,
// files: files.length > 0 ? Array.from(files).map(f => f.name) : [],
// componentId: component?.id
// });
if (files.length > 0) {
handleFileUpload(files);
}
}, [handleFileUpload, component?.id]);
const handleFileSelect = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {
console.log("📁 파일 선택 이벤트:", {
filesCount: e.target.files?.length || 0,
files: e.target.files ? Array.from(e.target.files).map(f => f.name) : []
});
// console.log("📁 파일 선택 이벤트:", {
// filesCount: e.target.files?.length || 0,
// files: e.target.files ? Array.from(e.target.files).map(f => f.name) : []
// });
const files = e.target.files;
if (files && files.length > 0) {
@@ -782,27 +782,27 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
if (prevComponentIdRef.current !== component.id) {
// 새로운 컴포넌트로 변경된 경우
console.log("🔄 FileComponentConfigPanel 새 컴포넌트 선택:", {
prevComponentId: prevComponentIdRef.current,
newComponentId: component.id,
componentFiles: componentFiles.length,
action: "새 컴포넌트 → 상태 초기화",
globalFileStateExists: !!getGlobalFileState()[component.id],
globalFileStateLength: getGlobalFileState()[component.id]?.length || 0,
localStorageExists: !!localStorage.getItem(`fileComponent_${component.id}_files`),
onUpdatePropertyExists: typeof onUpdateProperty === 'function'
});
// console.log("🔄 FileComponentConfigPanel 새 컴포넌트 선택:", {
// prevComponentId: prevComponentIdRef.current,
// newComponentId: component.id,
// componentFiles: componentFiles.length,
// action: "새 컴포넌트 → 상태 초기화",
// globalFileStateExists: !!getGlobalFileState()[component.id],
// globalFileStateLength: getGlobalFileState()[component.id]?.length || 0,
// localStorageExists: !!localStorage.getItem(`fileComponent_${component.id}_files`),
// onUpdatePropertyExists: typeof onUpdateProperty === 'function'
// });
// 1순위: 전역 상태에서 파일 복원
const globalFileState = getGlobalFileState();
const globalFiles = globalFileState[component.id];
if (globalFiles && globalFiles.length > 0) {
console.log("🌐 전역 상태에서 파일 복원:", {
componentId: component.id,
globalFiles: globalFiles.length,
action: "전역 상태 → 상태 복원"
});
// console.log("🌐 전역 상태에서 파일 복원:", {
// componentId: component.id,
// globalFiles: globalFiles.length,
// action: "전역 상태 → 상태 복원"
// });
setUploadedFiles(globalFiles);
onUpdateProperty(component.id, "uploadedFiles", globalFiles);
}
@@ -814,11 +814,11 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
if (backupFiles && componentFiles.length === 0) {
try {
const parsedBackupFiles = JSON.parse(backupFiles);
console.log("📂 localStorage에서 파일 복원:", {
componentId: component.id,
backupFiles: parsedBackupFiles.length,
action: "백업 → 상태 복원"
});
// console.log("📂 localStorage에서 파일 복원:", {
// componentId: component.id,
// backupFiles: parsedBackupFiles.length,
// action: "백업 → 상태 복원"
// });
setUploadedFiles(parsedBackupFiles);
// 전역 상태에도 저장
setGlobalFileState(prev => ({
@@ -828,7 +828,7 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
// 컴포넌트 속성에도 복원
onUpdateProperty(component.id, "uploadedFiles", parsedBackupFiles);
} catch (error) {
console.error("백업 파일 복원 실패:", error);
// console.error("백업 파일 복원 실패:", error);
setUploadedFiles(componentFiles);
}
} else {
@@ -839,12 +839,12 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
prevComponentIdRef.current = component.id;
} else if (componentFiles.length > 0 && JSON.stringify(componentFiles) !== JSON.stringify(uploadedFiles)) {
// 같은 컴포넌트에서 파일이 업데이트된 경우
console.log("🔄 FileComponentConfigPanel 파일 동기화:", {
componentId: component.id,
componentFiles: componentFiles.length,
currentFiles: uploadedFiles.length,
action: "컴포넌트 → 상태 동기화"
});
// console.log("🔄 FileComponentConfigPanel 파일 동기화:", {
// componentId: component.id,
// componentFiles: componentFiles.length,
// currentFiles: uploadedFiles.length,
// action: "컴포넌트 → 상태 동기화"
// });
setUploadedFiles(componentFiles);
}
}, [component.id]); // 컴포넌트 ID가 변경될 때만 초기화
@@ -855,24 +855,24 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
const { componentId, files, fileCount, isRestore, source } = event.detail;
if (componentId === component.id) {
console.log("🌐 FileComponentConfigPanel 전역 상태 변경 감지:", {
componentId,
fileCount,
isRestore: !!isRestore,
source: source || 'unknown',
files: files?.map((f: any) => ({ objid: f.objid, name: f.realFileName }))
});
// console.log("🌐 FileComponentConfigPanel 전역 상태 변경 감지:", {
// componentId,
// fileCount,
// isRestore: !!isRestore,
// source: source || 'unknown',
// files: files?.map((f: any) => ({ objid: f.objid, name: f.realFileName }))
// });
if (files && Array.isArray(files)) {
setUploadedFiles(files);
// 🎯 실제 화면에서 온 이벤트이거나 화면 복원인 경우 컴포넌트 속성도 업데이트
if (isRestore || source === 'realScreen') {
console.log("✅✅✅ 실제 화면 → 화면설계 모드 동기화 적용:", {
componentId,
fileCount: files.length,
source: source || 'restore'
});
// console.log("✅✅✅ 실제 화면 → 화면설계 모드 동기화 적용:", {
// componentId,
// fileCount: files.length,
// source: source || 'restore'
// });
onUpdateProperty(component.id, "uploadedFiles", files);
onUpdateProperty(component.id, "lastFileUpdate", Date.now());
@@ -881,12 +881,12 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
try {
const backupKey = `fileComponent_${component.id}_files`;
localStorage.setItem(backupKey, JSON.stringify(files));
console.log("💾 실제 화면 동기화 후 localStorage 백업 업데이트:", {
componentId: component.id,
fileCount: files.length
});
// console.log("💾 실제 화면 동기화 후 localStorage 백업 업데이트:", {
// componentId: component.id,
// fileCount: files.length
// });
} catch (e) {
console.warn("localStorage 백업 업데이트 실패:", e);
// console.warn("localStorage 백업 업데이트 실패:", e);
}
// 전역 상태 업데이트
@@ -895,10 +895,10 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
[component.id]: files
}));
} else if (isRestore) {
console.log("✅ 파일 컴포넌트 설정 패널 데이터 복원 완료:", {
componentId,
restoredFileCount: files.length
});
// console.log("✅ 파일 컴포넌트 설정 패널 데이터 복원 완료:", {
// componentId,
// restoredFileCount: files.length
// });
}
}
}
@@ -1119,18 +1119,18 @@ export const FileComponentConfigPanel: React.FC<FileComponentConfigPanelProps> =
onDragLeave={handleDragLeave}
onDrop={handleDrop}
onClick={() => {
console.log("🖱️ 파일 업로드 영역 클릭:", {
uploading,
inputElement: document.getElementById('file-input-config'),
componentId: component?.id
});
// console.log("🖱️ 파일 업로드 영역 클릭:", {
// uploading,
// inputElement: document.getElementById('file-input-config'),
// componentId: component?.id
// });
if (!uploading) {
const input = document.getElementById('file-input-config');
if (input) {
console.log("✅ 파일 input 클릭 실행");
// console.log("✅ 파일 input 클릭 실행");
input.click();
} else {
console.log("❌ 파일 input 요소를 찾을 수 없음");
// console.log("❌ 파일 input 요소를 찾을 수 없음");
}
}
}}