diff --git a/frontend/components/screen/InteractiveDataTable.tsx b/frontend/components/screen/InteractiveDataTable.tsx index 3523518a..3165bfa8 100644 --- a/frontend/components/screen/InteractiveDataTable.tsx +++ b/frontend/components/screen/InteractiveDataTable.tsx @@ -181,7 +181,6 @@ export const InteractiveDataTable: React.FC = ({ // ๐Ÿ†• ์ „์—ญ ํ…Œ์ด๋ธ” ์ƒˆ๋กœ๊ณ ์นจ ์ด๋ฒคํŠธ ๋ฆฌ์Šค๋„ˆ useEffect(() => { const handleRefreshTable = () => { - console.log("๐Ÿ”„ InteractiveDataTable: ์ „์—ญ ์ƒˆ๋กœ๊ณ ์นจ ์ด๋ฒคํŠธ ์ˆ˜์‹ "); if (component.tableName) { loadData(currentPage, searchValues); } @@ -206,15 +205,6 @@ export const InteractiveDataTable: React.FC = ({ return webType === "category"; }); - console.log(`๐Ÿ” InteractiveDataTable ์นดํ…Œ๊ณ ๋ฆฌ ์ปฌ๋Ÿผ ํ™•์ธ:`, { - tableName: component.tableName, - totalColumns: component.columns?.length, - categoryColumns: categoryColumns?.map(c => ({ - name: c.columnName, - webType: getColumnWebType(c.columnName) - })) - }); - if (!categoryColumns || categoryColumns.length === 0) return; // ๊ฐ ์นดํ…Œ๊ณ ๋ฆฌ ์ปฌ๋Ÿผ์˜ ๊ฐ’ ๋ชฉ๋ก ์กฐํšŒ @@ -239,12 +229,6 @@ export const InteractiveDataTable: React.FC = ({ } } - console.log(`โœ… InteractiveDataTable ์นดํ…Œ๊ณ ๋ฆฌ ๋งคํ•‘ ์™„๋ฃŒ:`, { - tableName: component.tableName, - mappedColumns: Object.keys(mappings), - mappings - }); - setCategoryMappings(mappings); } catch (error) { console.error("์นดํ…Œ๊ณ ๋ฆฌ ๋งคํ•‘ ๋กœ๋“œ ์‹คํŒจ:", error); @@ -403,7 +387,6 @@ export const InteractiveDataTable: React.FC = ({ // ๋Œ€์ฒด URL ์ƒ์„ฑ (์ง์ ‘ ํŒŒ์ผ ๊ฒฝ๋กœ ์‚ฌ์šฉ) if (previewImage.path) { const altUrl = getDirectFileUrl(previewImage.path); - // console.log("๋Œ€์ฒด URL ์‹œ๋„:", altUrl); setAlternativeImageUrl(altUrl); } else { toast.error("์ด๋ฏธ์ง€๋ฅผ ๋ถˆ๋Ÿฌ์˜ฌ ์ˆ˜ ์—†์Šต๋‹ˆ๋‹ค."); @@ -469,7 +452,6 @@ export const InteractiveDataTable: React.FC = ({ try { return tableColumn?.detailSettings ? JSON.parse(tableColumn.detailSettings) : {}; } catch { - // console.warn("์ƒ์„ธ ์„ค์ • ํŒŒ์‹ฑ ์‹คํŒจ:", tableColumn?.detailSettings); return {}; } }, @@ -672,15 +654,6 @@ export const InteractiveDataTable: React.FC = ({ const handleRefreshFileStatus = async (event: CustomEvent) => { const { tableName, recordId, columnName, targetObjid, fileCount } = event.detail; - // console.log("๐Ÿ”„ InteractiveDataTable ํŒŒ์ผ ์ƒํƒœ ์ƒˆ๋กœ๊ณ ์นจ ์ด๋ฒคํŠธ ์ˆ˜์‹ :", { - // tableName, - // recordId, - // columnName, - // targetObjid, - // fileCount, - // currentTableName: component.tableName - // }); - // ํ˜„์žฌ ํ…Œ์ด๋ธ”๊ณผ ์ผ์น˜ํ•˜๋Š”์ง€ ํ™•์ธ if (tableName === component.tableName) { // ํ•ด๋‹น ํ–‰์˜ ํŒŒ์ผ ์ƒํƒœ ์—…๋ฐ์ดํŠธ @@ -690,13 +663,6 @@ export const InteractiveDataTable: React.FC = ({ [recordId]: { hasFiles: fileCount > 0, fileCount }, [columnKey]: { hasFiles: fileCount > 0, fileCount }, })); - - // console.log("โœ… ํŒŒ์ผ ์ƒํƒœ ์—…๋ฐ์ดํŠธ ์™„๋ฃŒ:", { - // recordId, - // columnKey, - // hasFiles: fileCount > 0, - // fileCount - // }); } }; @@ -1104,7 +1070,6 @@ export const InteractiveDataTable: React.FC = ({ setIsAdding(true); // ์‹ค์ œ API ํ˜ธ์ถœ๋กœ ๋ฐ์ดํ„ฐ ์ถ”๊ฐ€ - // console.log("๐Ÿ”ฅ ์ถ”๊ฐ€ํ•  ๋ฐ์ดํ„ฐ:", addFormData); await tableTypeApi.addTableData(component.tableName, addFormData); // ๋ชจ๋‹ฌ ๋‹ซ๊ธฐ ๋ฐ ํผ ์ดˆ๊ธฐํ™” @@ -1127,9 +1092,6 @@ export const InteractiveDataTable: React.FC = ({ setIsEditing(true); // ์‹ค์ œ API ํ˜ธ์ถœ๋กœ ๋ฐ์ดํ„ฐ ์ˆ˜์ • - // console.log("๐Ÿ”ฅ ์ˆ˜์ •ํ•  ๋ฐ์ดํ„ฐ:", editFormData); - // console.log("๐Ÿ”ฅ ์›๋ณธ ๋ฐ์ดํ„ฐ:", editingRowData); - if (editingRowData) { await tableTypeApi.editTableData(component.tableName, editingRowData, editFormData); @@ -1200,7 +1162,6 @@ export const InteractiveDataTable: React.FC = ({ const selectedData = Array.from(selectedRows).map((index) => data[index]); // ์‹ค์ œ ์‚ญ์ œ API ํ˜ธ์ถœ - // console.log("๐Ÿ—‘๏ธ ์‚ญ์ œํ•  ๋ฐ์ดํ„ฐ:", selectedData); await tableTypeApi.deleteTableData(component.tableName, selectedData); // ์„ ํƒ ํ•ด์ œ ๋ฐ ๋‹ค์ด์–ผ๋กœ๊ทธ ๋‹ซ๊ธฐ @@ -1488,12 +1449,6 @@ export const InteractiveDataTable: React.FC = ({ case "category": { // ์นดํ…Œ๊ณ ๋ฆฌ ์…€๋ ‰ํŠธ (๋™์  import) const { CategorySelectComponent } = require("@/lib/registry/components/category-select/CategorySelectComponent"); - console.log("๐ŸŽฏ ์นดํ…Œ๊ณ ๋ฆฌ ๋ Œ๋”๋ง (ํŽธ์ง‘ ํผ):", { - tableName: component.tableName, - columnName: column.columnName, - columnLabel: column.label, - value, - }); return (
= ({ case "category": { // ์นดํ…Œ๊ณ ๋ฆฌ ์…€๋ ‰ํŠธ (๋™์  import) const { CategorySelectComponent } = require("@/lib/registry/components/category-select/CategorySelectComponent"); - console.log("๐ŸŽฏ ์นดํ…Œ๊ณ ๋ฆฌ ๋ Œ๋”๋ง (์ถ”๊ฐ€ ํผ):", { - tableName: component.tableName, - columnName: column.columnName, - columnLabel: column.label, - value, - }); return (
= ({ const handleDeleteLinkedFile = useCallback( async (fileId: string, fileName: string) => { try { - // console.log("๐Ÿ—‘๏ธ ํŒŒ์ผ ์‚ญ์ œ ์‹œ์ž‘:", { fileId, fileName }); - // ์‚ญ์ œ ํ™•์ธ ๋‹ค์ด์–ผ๋กœ๊ทธ if (!confirm(`"${fileName}" ํŒŒ์ผ์„ ์‚ญ์ œํ•˜์‹œ๊ฒ ์Šต๋‹ˆ๊นŒ?`)) { return; @@ -1884,7 +1831,6 @@ export const InteractiveDataTable: React.FC = ({ }); const result = response.data; - // console.log("๐Ÿ“ก ํŒŒ์ผ ์‚ญ์ œ API ์‘๋‹ต:", result); if (!result.success) { throw new Error(result.message || "ํŒŒ์ผ ์‚ญ์ œ ์‹คํŒจ"); @@ -1901,15 +1847,11 @@ export const InteractiveDataTable: React.FC = ({ try { const response = await getLinkedFiles(component.tableName, recordId); setLinkedFiles(response.files || []); - // console.log("๐Ÿ“ ํŒŒ์ผ ๋ชฉ๋ก ์ƒˆ๋กœ๊ณ ์นจ ์™„๋ฃŒ:", response.files?.length || 0); } catch (error) { - // console.error("ํŒŒ์ผ ๋ชฉ๋ก ์ƒˆ๋กœ๊ณ ์นจ ์‹คํŒจ:", error); + // ํŒŒ์ผ ๋ชฉ๋ก ์ƒˆ๋กœ๊ณ ์นจ ์‹คํŒจ ์‹œ ๋ฌด์‹œ } } - - // console.log("โœ… ํŒŒ์ผ ์‚ญ์ œ ์™„๋ฃŒ:", fileName); } catch (error) { - // console.error("โŒ ํŒŒ์ผ ์‚ญ์ œ ์‹คํŒจ:", error); toast.error(`"${fileName}" ํŒŒ์ผ ์‚ญ์ œ์— ์‹คํŒจํ–ˆ์Šต๋‹ˆ๋‹ค.`); } }, diff --git a/frontend/components/screen/ScreenDesigner.tsx b/frontend/components/screen/ScreenDesigner.tsx index 561d4e9d..a7c3c2cf 100644 --- a/frontend/components/screen/ScreenDesigner.tsx +++ b/frontend/components/screen/ScreenDesigner.tsx @@ -619,7 +619,8 @@ export default function ScreenDesigner({ selectedScreen, onBackToList }: ScreenD const fullColumnWidth = columnWidth + (gap || 16); // ์™ธ๋ถ€ ๊ฒฉ์ž์™€ ๋™์ผํ•œ ํฌ๊ธฐ const widthInColumns = Math.max(1, Math.round(newComp.size.width / fullColumnWidth)); const snappedWidth = widthInColumns * fullColumnWidth - (gap || 16); // gap ์ œ๊ฑฐํ•˜์—ฌ ์‹ค์ œ ์ปดํฌ๋„ŒํŠธ ํฌ๊ธฐ - const snappedHeight = Math.max(10, Math.round(newComp.size.height / 10) * 10); + // ๋†’์ด๋Š” ์‚ฌ์šฉ์ž๊ฐ€ ์ž…๋ ฅํ•œ ๊ฐ’ ๊ทธ๋Œ€๋กœ ์‚ฌ์šฉ (์Šค๋ƒ… ์ œ๊ฑฐ) + const snappedHeight = Math.max(10, newComp.size.height); newComp.position = { x: Math.max(padding, snappedX), // ํŒจ๋”ฉ๋งŒํผ ์ตœ์†Œ ์—ฌ๋ฐฑ ํ™•๋ณด @@ -3028,7 +3029,8 @@ export default function ScreenDesigner({ selectedScreen, onBackToList }: ScreenD const fullColumnWidth = columnWidth + (gap || 16); // ์™ธ๋ถ€ ๊ฒฉ์ž์™€ ๋™์ผํ•œ ํฌ๊ธฐ const widthInColumns = Math.max(1, Math.round(comp.size.width / fullColumnWidth)); const snappedWidth = widthInColumns * fullColumnWidth - (gap || 16); // gap ์ œ๊ฑฐํ•˜์—ฌ ์‹ค์ œ ์ปดํฌ๋„ŒํŠธ ํฌ๊ธฐ - const snappedHeight = Math.max(40, Math.round(comp.size.height / 20) * 20); + // ๋†’์ด๋Š” ์‚ฌ์šฉ์ž๊ฐ€ ์ž…๋ ฅํ•œ ๊ฐ’ ๊ทธ๋Œ€๋กœ ์‚ฌ์šฉ (์Šค๋ƒ… ์ œ๊ฑฐ) + const snappedHeight = Math.max(40, comp.size.height); newPosition = { x: Math.max(padding, snappedX), // ํŒจ๋”ฉ๋งŒํผ ์ตœ์†Œ ์—ฌ๋ฐฑ ํ™•๋ณด diff --git a/frontend/components/screen/panels/PropertiesPanel.tsx b/frontend/components/screen/panels/PropertiesPanel.tsx index 277c6e9c..3d429123 100644 --- a/frontend/components/screen/panels/PropertiesPanel.tsx +++ b/frontend/components/screen/panels/PropertiesPanel.tsx @@ -695,6 +695,7 @@ const PropertiesPanelComponent: React.FC = ({ { const isDragging = dragState?.isDragging && dragState.draggedComponent?.id === selectedComponent?.id; if (isDragging) { @@ -725,6 +726,7 @@ const PropertiesPanelComponent: React.FC = ({ { const isDragging = dragState?.isDragging && dragState.draggedComponent?.id === selectedComponent?.id; if (isDragging) { @@ -762,6 +764,7 @@ const PropertiesPanelComponent: React.FC = ({ type="number" min={1} max={gridSettings?.columns || 12} + step="1" value={(selectedComponent as any)?.gridColumns || 1} onChange={(e) => { const value = parseInt(e.target.value, 10); @@ -961,27 +964,27 @@ const PropertiesPanelComponent: React.FC = ({
{ - const units = Math.max(1, Math.min(100, Number(e.target.value))); - const newHeight = units * 10; + const newHeight = Math.max(10, Number(e.target.value)); setLocalInputs((prev) => ({ ...prev, height: newHeight.toString() })); onUpdateProperty("size.height", newHeight); }} className="flex-1" /> - ๋‹จ์œ„ = {localInputs.height || 10}px + {localInputs.height || 40}px

- 1๋‹จ์œ„ = 10px (ํ˜„์žฌ {Math.round((localInputs.height || 10) / 10)}๋‹จ์œ„) - ๋‚ด๋ถ€ ์ฝ˜ํ…์ธ ์— ๋งž์ถฐ ๋Š˜์–ด๋‚จ + ๋†’์ด ์ž์œ  ์กฐ์ ˆ (10px ~ 2000px, 1px ๋‹จ์œ„)

@@ -996,11 +999,12 @@ const PropertiesPanelComponent: React.FC = ({ - { const newValue = e.target.value; @@ -1266,6 +1270,7 @@ const PropertiesPanelComponent: React.FC = ({ type="number" min="1" max="12" + step="1" value={(selectedComponent as AreaComponent).layoutConfig?.gridColumns || 3} onChange={(e) => { const value = Number(e.target.value); @@ -1279,6 +1284,7 @@ const PropertiesPanelComponent: React.FC = ({ { const value = Number(e.target.value); @@ -1315,6 +1321,7 @@ const PropertiesPanelComponent: React.FC = ({ { const value = Number(e.target.value); @@ -1345,6 +1352,7 @@ const PropertiesPanelComponent: React.FC = ({ { const value = Number(e.target.value); diff --git a/frontend/components/screen/panels/ResolutionPanel.tsx b/frontend/components/screen/panels/ResolutionPanel.tsx index 90680f01..3fac225d 100644 --- a/frontend/components/screen/panels/ResolutionPanel.tsx +++ b/frontend/components/screen/panels/ResolutionPanel.tsx @@ -146,6 +146,7 @@ const ResolutionPanel: React.FC = ({ currentResolution, on onChange={(e) => setCustomWidth(e.target.value)} placeholder="1920" min="1" + step="1" className="h-6 w-full px-2 py-0 text-xs" style={{ fontSize: "12px" }} style={{ fontSize: "12px" }} /> @@ -158,6 +159,7 @@ const ResolutionPanel: React.FC = ({ currentResolution, on onChange={(e) => setCustomHeight(e.target.value)} placeholder="1080" min="1" + step="1" className="h-6 w-full px-2 py-0 text-xs" style={{ fontSize: "12px" }} style={{ fontSize: "12px" }} /> diff --git a/frontend/components/screen/panels/RowSettingsPanel.tsx b/frontend/components/screen/panels/RowSettingsPanel.tsx index 2bd48a12..1378ffe3 100644 --- a/frontend/components/screen/panels/RowSettingsPanel.tsx +++ b/frontend/components/screen/panels/RowSettingsPanel.tsx @@ -57,6 +57,7 @@ export const RowSettingsPanel: React.FC = ({ row, onUpdat placeholder="100" min={50} max={1000} + step="1" />
)} @@ -73,6 +74,7 @@ export const RowSettingsPanel: React.FC = ({ row, onUpdat placeholder="50" min={0} max={1000} + step="1" />
)} @@ -89,6 +91,7 @@ export const RowSettingsPanel: React.FC = ({ row, onUpdat placeholder="500" min={0} max={2000} + step="1" /> )} diff --git a/frontend/components/screen/panels/UnifiedPropertiesPanel.tsx b/frontend/components/screen/panels/UnifiedPropertiesPanel.tsx index cc06b555..8d7cd091 100644 --- a/frontend/components/screen/panels/UnifiedPropertiesPanel.tsx +++ b/frontend/components/screen/panels/UnifiedPropertiesPanel.tsx @@ -104,6 +104,9 @@ export const UnifiedPropertiesPanel: React.FC = ({ }) => { const { webTypes } = useWebTypes({ active: "Y" }); const [localComponentDetailType, setLocalComponentDetailType] = useState(""); + + // ๋†’์ด ์ž…๋ ฅ ๋กœ์ปฌ ์ƒํƒœ (๊ฒฉ์ž ์Šค๋ƒ… ๋ฐฉ์ง€) + const [localHeight, setLocalHeight] = useState(""); // ์ƒˆ๋กœ์šด ์ปดํฌ๋„ŒํŠธ ์‹œ์Šคํ…œ์˜ webType ๋™๊ธฐํ™” useEffect(() => { @@ -114,6 +117,13 @@ export const UnifiedPropertiesPanel: React.FC = ({ } } }, [selectedComponent?.type, selectedComponent?.componentConfig?.webType, selectedComponent?.id]); + + // ๋†’์ด ๊ฐ’ ๋™๊ธฐํ™” + useEffect(() => { + if (selectedComponent?.size?.height !== undefined) { + setLocalHeight(String(selectedComponent.size.height)); + } + }, [selectedComponent?.size?.height, selectedComponent?.id]); // ๊ฒฉ์ž ์„ค์ • ์—…๋ฐ์ดํŠธ ํ•จ์ˆ˜ (early return ์ด์ „์— ์ •์˜) const updateGridSetting = (key: string, value: any) => { @@ -180,6 +190,7 @@ export const UnifiedPropertiesPanel: React.FC = ({ id="columns" type="number" min={1} + step="1" value={gridSettings.columns} onChange={(e) => { const value = parseInt(e.target.value, 10); @@ -361,11 +372,27 @@ export const UnifiedPropertiesPanel: React.FC = ({ { + // ์ž…๋ ฅ ์ค‘์—๋Š” ๋กœ์ปฌ ์ƒํƒœ๋งŒ ์—…๋ฐ์ดํŠธ (๊ฒฉ์ž ์Šค๋ƒ… ๋ฐฉ์ง€) + setLocalHeight(e.target.value); + }} + onBlur={(e) => { + // ํฌ์ปค์Šค๋ฅผ ์žƒ์„ ๋•Œ๋งŒ ์‹ค์ œ๋กœ ์—…๋ฐ์ดํŠธ const value = parseInt(e.target.value) || 0; - // ์ตœ์†Œ๊ฐ’ ์ œํ•œ ์—†์ด, 1px ๋‹จ์œ„๋กœ ์กฐ์ ˆ ๊ฐ€๋Šฅ - handleUpdate("size.height", Math.max(1, value)); + if (value >= 1) { + handleUpdate("size.height", value); + } + }} + onKeyDown={(e) => { + // Enter ํ‚ค๋ฅผ ๋ˆ„๋ฅด๋ฉด ์ฆ‰์‹œ ์ ์šฉ + if (e.key === "Enter") { + const value = parseInt(e.currentTarget.value) || 0; + if (value >= 1) { + handleUpdate("size.height", value); + } + e.currentTarget.blur(); // ํฌ์ปค์Šค ์ œ๊ฑฐ + } }} step={1} placeholder="10" @@ -430,6 +457,7 @@ export const UnifiedPropertiesPanel: React.FC = ({ type="number" min={1} max={gridSettings?.columns || 12} + step="1" value={(selectedComponent as any).gridColumns || 1} onChange={(e) => { const value = parseInt(e.target.value, 10); @@ -455,6 +483,7 @@ export const UnifiedPropertiesPanel: React.FC = ({ handleUpdate("position.z", parseInt(e.target.value) || 1)} className="h-6 w-full px-2 py-0 text-xs" diff --git a/frontend/components/screen/panels/webtype-configs/NumberTypeConfigPanel.tsx b/frontend/components/screen/panels/webtype-configs/NumberTypeConfigPanel.tsx index aaa66688..924feeee 100644 --- a/frontend/components/screen/panels/webtype-configs/NumberTypeConfigPanel.tsx +++ b/frontend/components/screen/panels/webtype-configs/NumberTypeConfigPanel.tsx @@ -132,6 +132,7 @@ export const NumberTypeConfigPanel: React.FC = ({ co updateConfig("min", e.target.value ? Number(e.target.value) : undefined)} className="mt-1" @@ -146,6 +147,7 @@ export const NumberTypeConfigPanel: React.FC = ({ co updateConfig("max", e.target.value ? Number(e.target.value) : undefined)} className="mt-1" @@ -181,6 +183,7 @@ export const NumberTypeConfigPanel: React.FC = ({ co type="number" min="0" max="10" + step="1" value={localValues.decimalPlaces} onChange={(e) => updateConfig("decimalPlaces", e.target.value ? Number(e.target.value) : undefined)} className="mt-1" diff --git a/frontend/components/screen/panels/webtype-configs/TextTypeConfigPanel.tsx b/frontend/components/screen/panels/webtype-configs/TextTypeConfigPanel.tsx index cb46ec50..abb35347 100644 --- a/frontend/components/screen/panels/webtype-configs/TextTypeConfigPanel.tsx +++ b/frontend/components/screen/panels/webtype-configs/TextTypeConfigPanel.tsx @@ -168,6 +168,7 @@ export const TextTypeConfigPanel: React.FC = ({ config id="minLength" type="number" min="0" + step="1" value={localValues.minLength} onChange={(e) => updateConfig("minLength", e.target.value ? Number(e.target.value) : undefined)} className="mt-1" @@ -183,6 +184,7 @@ export const TextTypeConfigPanel: React.FC = ({ config id="maxLength" type="number" min="0" + step="1" value={localValues.maxLength} onChange={(e) => updateConfig("maxLength", e.target.value ? Number(e.target.value) : undefined)} className="mt-1" diff --git a/frontend/components/screen/templates/NumberingRuleTemplate.ts b/frontend/components/screen/templates/NumberingRuleTemplate.ts index ee386c4b..fbe15d8d 100644 --- a/frontend/components/screen/templates/NumberingRuleTemplate.ts +++ b/frontend/components/screen/templates/NumberingRuleTemplate.ts @@ -75,3 +75,4 @@ export const numberingRuleTemplate = { ], }; + diff --git a/frontend/components/screen/widgets/FlowWidget.tsx b/frontend/components/screen/widgets/FlowWidget.tsx index 2e174554..e5a2e541 100644 --- a/frontend/components/screen/widgets/FlowWidget.tsx +++ b/frontend/components/screen/widgets/FlowWidget.tsx @@ -66,6 +66,35 @@ export function FlowWidget({ const { isPreviewMode } = useScreenPreview(); // ํ”„๋ฆฌ๋ทฐ ๋ชจ๋“œ ํ™•์ธ const { user } = useAuth(); // ์‚ฌ์šฉ์ž ์ •๋ณด ๊ฐ€์ ธ์˜ค๊ธฐ + // ๐Ÿ†• ์ „์—ญ ์ƒํƒœ ๊ด€๋ฆฌ + const setSelectedStep = useFlowStepStore((state) => state.setSelectedStep); + const resetFlow = useFlowStepStore((state) => state.resetFlow); + + const [flowData, setFlowData] = useState(null); + const [steps, setSteps] = useState([]); + const [stepCounts, setStepCounts] = useState>({}); + const [loading, setLoading] = useState(true); + const [error, setError] = useState(null); + const [connections, setConnections] = useState([]); // ํ”Œ๋กœ์šฐ ์—ฐ๊ฒฐ ์ •๋ณด + + // ์„ ํƒ๋œ ์Šคํ…์˜ ๋ฐ์ดํ„ฐ ๋ฆฌ์ŠคํŠธ ์ƒํƒœ + const [selectedStepId, setSelectedStepId] = useState(null); + const [stepData, setStepData] = useState([]); + const [stepDataColumns, setStepDataColumns] = useState([]); + const [stepDataLoading, setStepDataLoading] = useState(false); + const [selectedRows, setSelectedRows] = useState>(new Set()); + const [columnLabels, setColumnLabels] = useState>({}); // ์ปฌ๋Ÿผ๋ช… -> ๋ผ๋ฒจ ๋งคํ•‘ + + // ๐Ÿ†• ๊ฒ€์ƒ‰ ํ•„ํ„ฐ ๊ด€๋ จ ์ƒํƒœ + const [searchFilterColumns, setSearchFilterColumns] = useState>(new Set()); // ๊ฒ€์ƒ‰ ํ•„ํ„ฐ๋กœ ์‚ฌ์šฉํ•  ์ปฌ๋Ÿผ + const [isFilterSettingOpen, setIsFilterSettingOpen] = useState(false); // ํ•„ํ„ฐ ์„ค์ • ๋‹ค์ด์–ผ๋กœ๊ทธ + const [searchValues, setSearchValues] = useState>({}); // ๊ฒ€์ƒ‰ ๊ฐ’ + const [allAvailableColumns, setAllAvailableColumns] = useState([]); // ์ „์ฒด ์ปฌ๋Ÿผ ๋ชฉ๋ก + const [filteredData, setFilteredData] = useState([]); // ํ•„ํ„ฐ๋ง๋œ ๋ฐ์ดํ„ฐ + + // ์นดํ…Œ๊ณ ๋ฆฌ ๊ฐ’ ๋งคํ•‘ ์บ์‹œ (์ปฌ๋Ÿผ๋ช… -> {์ฝ”๋“œ -> ๋ผ๋ฒจ}) + const [categoryMappings, setCategoryMappings] = useState>>({}); + // ๊ฐ’ ํฌ๋งทํŒ… ํ•จ์ˆ˜ (์ˆซ์ž, ์นดํ…Œ๊ณ ๋ฆฌ ๋“ฑ) const formatValue = useCallback((value: any, columnName?: string): string => { if (value === null || value === undefined || value === "") { @@ -97,35 +126,6 @@ export function FlowWidget({ return String(value); }, [categoryMappings]); - // ๐Ÿ†• ์ „์—ญ ์ƒํƒœ ๊ด€๋ฆฌ - const setSelectedStep = useFlowStepStore((state) => state.setSelectedStep); - const resetFlow = useFlowStepStore((state) => state.resetFlow); - - const [flowData, setFlowData] = useState(null); - const [steps, setSteps] = useState([]); - const [stepCounts, setStepCounts] = useState>({}); - const [loading, setLoading] = useState(true); - const [error, setError] = useState(null); - const [connections, setConnections] = useState([]); // ํ”Œ๋กœ์šฐ ์—ฐ๊ฒฐ ์ •๋ณด - - // ์„ ํƒ๋œ ์Šคํ…์˜ ๋ฐ์ดํ„ฐ ๋ฆฌ์ŠคํŠธ ์ƒํƒœ - const [selectedStepId, setSelectedStepId] = useState(null); - const [stepData, setStepData] = useState([]); - const [stepDataColumns, setStepDataColumns] = useState([]); - const [stepDataLoading, setStepDataLoading] = useState(false); - const [selectedRows, setSelectedRows] = useState>(new Set()); - const [columnLabels, setColumnLabels] = useState>({}); // ์ปฌ๋Ÿผ๋ช… -> ๋ผ๋ฒจ ๋งคํ•‘ - - // ๐Ÿ†• ๊ฒ€์ƒ‰ ํ•„ํ„ฐ ๊ด€๋ จ ์ƒํƒœ - const [searchFilterColumns, setSearchFilterColumns] = useState>(new Set()); // ๊ฒ€์ƒ‰ ํ•„ํ„ฐ๋กœ ์‚ฌ์šฉํ•  ์ปฌ๋Ÿผ - const [isFilterSettingOpen, setIsFilterSettingOpen] = useState(false); // ํ•„ํ„ฐ ์„ค์ • ๋‹ค์ด์–ผ๋กœ๊ทธ - const [searchValues, setSearchValues] = useState>({}); // ๊ฒ€์ƒ‰ ๊ฐ’ - const [allAvailableColumns, setAllAvailableColumns] = useState([]); // ์ „์ฒด ์ปฌ๋Ÿผ ๋ชฉ๋ก - const [filteredData, setFilteredData] = useState([]); // ํ•„ํ„ฐ๋ง๋œ ๋ฐ์ดํ„ฐ - - // ์นดํ…Œ๊ณ ๋ฆฌ ๊ฐ’ ๋งคํ•‘ ์บ์‹œ (์ปฌ๋Ÿผ๋ช… -> {์ฝ”๋“œ -> ๋ผ๋ฒจ}) - const [categoryMappings, setCategoryMappings] = useState>>({}); - // ๐Ÿ†• ๊ทธ๋ฃน ์„ค์ • ๊ด€๋ จ ์ƒํƒœ const [isGroupSettingOpen, setIsGroupSettingOpen] = useState(false); // ๊ทธ๋ฃน ์„ค์ • ๋‹ค์ด์–ผ๋กœ๊ทธ const [groupByColumns, setGroupByColumns] = useState([]); // ๊ทธ๋ฃนํ™”ํ•  ์ปฌ๋Ÿผ ๋ชฉ๋ก @@ -382,12 +382,6 @@ export function FlowWidget({ }); setFilteredData(filtered); - console.log("๐Ÿ” ๊ฒ€์ƒ‰ ์‹คํ–‰:", { - totalRows: stepData.length, - filteredRows: filtered.length, - searchValues, - hasSearchValue, - }); }, [searchValues, stepData]); // stepData์™€ searchValues๊ฐ€ ๋ณ€๊ฒฝ๋  ๋•Œ๋งˆ๋‹ค ์‹คํ–‰ // ์„ ํƒ๋œ ์Šคํ…์˜ ๋ฐ์ดํ„ฐ๋ฅผ ๋‹ค์‹œ ๋กœ๋“œํ•˜๋Š” ํ•จ์ˆ˜ @@ -471,7 +465,6 @@ export function FlowWidget({ // ํ”„๋ฆฌ๋ทฐ ๋ชจ๋“œ์—์„œ๋Š” ์ƒ˜ํ”Œ ๋ฐ์ดํ„ฐ๋งŒ ํ‘œ์‹œ if (isPreviewMode) { - console.log("๐Ÿ”’ ํ”„๋ฆฌ๋ทฐ ๋ชจ๋“œ: ํ”Œ๋กœ์šฐ ๋ฐ์ดํ„ฐ ๋กœ๋“œ ์ฐจ๋‹จ - ์ƒ˜ํ”Œ ๋ฐ์ดํ„ฐ ํ‘œ์‹œ"); setFlowData({ id: flowId || 0, flowName: flowName || "์ƒ˜ํ”Œ ํ”Œ๋กœ์šฐ", @@ -648,16 +641,9 @@ export function FlowWidget({ try { // ์ปฌ๋Ÿผ ๋ผ๋ฒจ ์กฐํšŒ const labelsResponse = await getStepColumnLabels(flowId!, stepId); - console.log("๐Ÿท๏ธ ์ปฌ๋Ÿผ ๋ผ๋ฒจ ์กฐํšŒ ๊ฒฐ๊ณผ:", { - stepId, - success: labelsResponse.success, - labelsCount: labelsResponse.data ? Object.keys(labelsResponse.data).length : 0, - labels: labelsResponse.data, - }); if (labelsResponse.success && labelsResponse.data) { setColumnLabels(labelsResponse.data); } else { - console.warn("โš ๏ธ ์ปฌ๋Ÿผ ๋ผ๋ฒจ ์กฐํšŒ ์‹คํŒจ ๋˜๋Š” ๋ฐ์ดํ„ฐ ์—†์Œ:", labelsResponse); setColumnLabels({}); } @@ -761,13 +747,6 @@ export function FlowWidget({ // ์„ ํƒ๋œ ๋ฐ์ดํ„ฐ๋ฅผ ์ƒ์œ„๋กœ ์ „๋‹ฌ const selectedData = Array.from(newSelected).map((index) => stepData[index]); - console.log("๐ŸŒŠ FlowWidget - ์ฒดํฌ๋ฐ•์Šค ํ† ๊ธ€, ์ƒ์œ„๋กœ ์ „๋‹ฌ:", { - rowIndex, - newSelectedSize: newSelected.size, - selectedData, - selectedStepId, - hasCallback: !!onSelectedDataChange, - }); onSelectedDataChange?.(selectedData, selectedStepId); }; diff --git a/frontend/components/table-category/CategoryValueManager.tsx b/frontend/components/table-category/CategoryValueManager.tsx index ceadf8b9..b03b809d 100644 --- a/frontend/components/table-category/CategoryValueManager.tsx +++ b/frontend/components/table-category/CategoryValueManager.tsx @@ -72,7 +72,8 @@ export const CategoryValueManager: React.FC = ({ const loadCategoryValues = async () => { setIsLoading(true); try { - const response = await getCategoryValues(tableName, columnName); + // includeInactive: true๋กœ ๋น„ํ™œ์„ฑ ๊ฐ’๋„ ํฌํ•จ + const response = await getCategoryValues(tableName, columnName, true); if (response.success && response.data) { setValues(response.data); setFilteredValues(response.data); diff --git a/frontend/lib/api/numberingRule.ts b/frontend/lib/api/numberingRule.ts index 294fa353..1f655790 100644 --- a/frontend/lib/api/numberingRule.ts +++ b/frontend/lib/api/numberingRule.ts @@ -133,3 +133,4 @@ export async function resetSequence(ruleId: string): Promise> } } + diff --git a/frontend/lib/registry/components/table-list/TableListComponent.tsx b/frontend/lib/registry/components/table-list/TableListComponent.tsx index ba827020..338ef0f6 100644 --- a/frontend/lib/registry/components/table-list/TableListComponent.tsx +++ b/frontend/lib/registry/components/table-list/TableListComponent.tsx @@ -186,9 +186,7 @@ export const TableListComponent: React.FC = ({ // ๊ฐ์ฒด์ธ ๊ฒฝ์šฐ tableName ์†์„ฑ ์ถ”์ถœ ์‹œ๋„ if (typeof finalSelectedTable === "object" && finalSelectedTable !== null) { - console.warn("โš ๏ธ selectedTable์ด ๊ฐ์ฒด์ž…๋‹ˆ๋‹ค:", finalSelectedTable); finalSelectedTable = (finalSelectedTable as any).tableName || (finalSelectedTable as any).name || tableName; - console.log("โœ… ๊ฐ์ฒด์—์„œ ์ถ”์ถœํ•œ ํ…Œ์ด๋ธ”๋ช…:", finalSelectedTable); } tableConfig.selectedTable = finalSelectedTable; @@ -282,13 +280,10 @@ export const TableListComponent: React.FC = ({ if (savedOrder) { try { const parsedOrder = JSON.parse(savedOrder); - console.log("๐Ÿ“‚ localStorage์—์„œ ์ปฌ๋Ÿผ ์ˆœ์„œ ๋ถˆ๋Ÿฌ์˜ค๊ธฐ:", { storageKey, columnOrder: parsedOrder }); setColumnOrder(parsedOrder); // ๋ถ€๋ชจ ์ปดํฌ๋„ŒํŠธ์— ์ดˆ๊ธฐ ์ปฌ๋Ÿผ ์ˆœ์„œ ์ „๋‹ฌ if (onSelectedRowsChange && parsedOrder.length > 0) { - console.log("โœ… ์ดˆ๊ธฐ ์ปฌ๋Ÿผ ์ˆœ์„œ ์ „๋‹ฌ:", parsedOrder); - // ์ดˆ๊ธฐ ๋ฐ์ดํ„ฐ๋„ ํ•จ๊ป˜ ์ „๋‹ฌ (์ปฌ๋Ÿผ ์ˆœ์„œ๋Œ€๋กœ ์žฌ์ •๋ ฌ) const initialData = data.map((row: any) => { const reordered: any = {}; @@ -306,8 +301,6 @@ export const TableListComponent: React.FC = ({ return reordered; }); - console.log("๐Ÿ“Š ์ดˆ๊ธฐ ํ™”๋ฉด ํ‘œ์‹œ ๋ฐ์ดํ„ฐ ์ „๋‹ฌ:", { count: initialData.length, firstRow: initialData[0] }); - // ์ „์—ญ ์ €์žฅ์†Œ์— ๋ฐ์ดํ„ฐ ์ €์žฅ if (tableConfig.selectedTable) { tableDisplayStore.setTableData( @@ -584,8 +577,6 @@ export const TableListComponent: React.FC = ({ }; const handleSort = (column: string) => { - console.log("๐Ÿ”„ ์ •๋ ฌ ํด๋ฆญ:", { column, currentSortColumn: sortColumn, currentSortDirection: sortDirection }); - let newSortColumn = column; let newSortDirection: "asc" | "desc" = "asc"; @@ -599,9 +590,6 @@ export const TableListComponent: React.FC = ({ newSortDirection = "asc"; } - console.log("๐Ÿ“Š ์ƒˆ๋กœ์šด ์ •๋ ฌ ์ •๋ณด:", { newSortColumn, newSortDirection }); - console.log("๐Ÿ” onSelectedRowsChange ์กด์žฌ ์—ฌ๋ถ€:", !!onSelectedRowsChange); - // ์ •๋ ฌ ๋ณ€๊ฒฝ ์‹œ ์„ ํƒ ์ •๋ณด์™€ ํ•จ๊ป˜ ์ •๋ ฌ ์ •๋ณด๋„ ์ „๋‹ฌ if (onSelectedRowsChange) { const selectedRowsData = data.filter((row, index) => selectedRows.has(getRowKey(row, index))); @@ -651,16 +639,6 @@ export const TableListComponent: React.FC = ({ return reordered; }); - console.log("โœ… ์ •๋ ฌ ์ •๋ณด ์ „๋‹ฌ:", { - selectedRowsCount: selectedRows.size, - selectedRowsDataCount: selectedRowsData.length, - sortBy: newSortColumn, - sortOrder: newSortDirection, - columnOrder: columnOrder.length > 0 ? columnOrder : undefined, - tableDisplayDataCount: reorderedData.length, - firstRowAfterSort: reorderedData[0]?.[newSortColumn], - lastRowAfterSort: reorderedData[reorderedData.length - 1]?.[newSortColumn] - }); onSelectedRowsChange( Array.from(selectedRows), selectedRowsData, @@ -681,8 +659,6 @@ export const TableListComponent: React.FC = ({ newSortDirection ); } - } else { - console.warn("โš ๏ธ onSelectedRowsChange ์ฝœ๋ฐฑ์ด ์—†์Šต๋‹ˆ๋‹ค!"); } }; @@ -774,8 +750,6 @@ export const TableListComponent: React.FC = ({ const isCurrentlySelected = selectedRows.has(rowKey); handleRowSelection(rowKey, !isCurrentlySelected); - - console.log("ํ–‰ ํด๋ฆญ:", { row, index, isSelected: !isCurrentlySelected }); }; // ์ปฌ๋Ÿผ ๋“œ๋ž˜๊ทธ์•ค๋“œ๋กญ ๊ธฐ๋Šฅ ์ œ๊ฑฐ๋จ (ํ…Œ์ด๋ธ” ์˜ต์…˜ ๋ชจ๋‹ฌ์—์„œ ์ปฌ๋Ÿผ ์ˆœ์„œ ๋ณ€๊ฒฝ ๊ฐ€๋Šฅ) @@ -820,12 +794,6 @@ export const TableListComponent: React.FC = ({ // columnOrder์— ์—†๋Š” ์ƒˆ๋กœ์šด ์ปฌ๋Ÿผ๋“ค ์ถ”๊ฐ€ const remainingCols = cols.filter(c => !columnOrder.includes(c.columnName)); - console.log("๐Ÿ”„ columnOrder ๊ธฐ๋ฐ˜ ์ •๋ ฌ:", { - columnOrder, - orderedColsCount: orderedCols.length, - remainingColsCount: remainingCols.length - }); - return [...orderedCols, ...remainingCols]; } @@ -836,19 +804,11 @@ export const TableListComponent: React.FC = ({ const lastColumnOrderRef = useRef(""); useEffect(() => { - console.log("๐Ÿ” [์ปฌ๋Ÿผ ์ˆœ์„œ ์ „๋‹ฌ useEffect] ์‹คํ–‰๋จ:", { - hasCallback: !!onSelectedRowsChange, - visibleColumnsLength: visibleColumns.length, - visibleColumnsNames: visibleColumns.map(c => c.columnName), - }); - if (!onSelectedRowsChange) { - console.warn("โš ๏ธ onSelectedRowsChange ์ฝœ๋ฐฑ์ด ์—†์Šต๋‹ˆ๋‹ค!"); return; } if (visibleColumns.length === 0) { - console.warn("โš ๏ธ visibleColumns๊ฐ€ ๋น„์–ด์žˆ์Šต๋‹ˆ๋‹ค!"); return; } @@ -856,23 +816,14 @@ export const TableListComponent: React.FC = ({ .map(col => col.columnName) .filter(name => name !== "__checkbox__"); // ์ฒดํฌ๋ฐ•์Šค ์ปฌ๋Ÿผ ์ œ์™ธ - console.log("๐Ÿ” [์ปฌ๋Ÿผ ์ˆœ์„œ] ์ฒดํฌ๋ฐ•์Šค ์ œ์™ธ ํ›„:", currentColumnOrder); - // ์ปฌ๋Ÿผ ์ˆœ์„œ๊ฐ€ ์‹ค์ œ๋กœ ๋ณ€๊ฒฝ๋˜์—ˆ์„ ๋•Œ๋งŒ ์ „๋‹ฌ (๋ฌดํ•œ ๋ฃจํ”„ ๋ฐฉ์ง€) const columnOrderString = currentColumnOrder.join(","); - console.log("๐Ÿ” [์ปฌ๋Ÿผ ์ˆœ์„œ] ๋น„๊ต:", { - current: columnOrderString, - last: lastColumnOrderRef.current, - isDifferent: columnOrderString !== lastColumnOrderRef.current, - }); if (columnOrderString === lastColumnOrderRef.current) { - console.log("โญ๏ธ ์ปฌ๋Ÿผ ์ˆœ์„œ ๋ณ€๊ฒฝ ์—†์Œ, ์ „๋‹ฌ ์Šคํ‚ต"); return; } lastColumnOrderRef.current = columnOrderString; - console.log("๐Ÿ“Š ํ˜„์žฌ ํ™”๋ฉด ์ปฌ๋Ÿผ ์ˆœ์„œ ์ „๋‹ฌ:", currentColumnOrder); // ์„ ํƒ๋œ ํ–‰ ๋ฐ์ดํ„ฐ ๊ฐ€์ ธ์˜ค๊ธฐ const selectedRowsData = data.filter((row, index) => selectedRows.has(getRowKey(row, index))); diff --git a/๋™์ _ํ…Œ์ด๋ธ”_์ ‘๊ทผ_์‹œ์Šคํ…œ_๊ฐœ์„ _์™„๋ฃŒ.md b/๋™์ _ํ…Œ์ด๋ธ”_์ ‘๊ทผ_์‹œ์Šคํ…œ_๊ฐœ์„ _์™„๋ฃŒ.md index 82e77416..ea214f5d 100644 --- a/๋™์ _ํ…Œ์ด๋ธ”_์ ‘๊ทผ_์‹œ์Šคํ…œ_๊ฐœ์„ _์™„๋ฃŒ.md +++ b/๋™์ _ํ…Œ์ด๋ธ”_์ ‘๊ทผ_์‹œ์Šคํ…œ_๊ฐœ์„ _์™„๋ฃŒ.md @@ -375,3 +375,4 @@ interface TablePermission { **์ด์ œ ํ…Œ์ด๋ธ”์„ ๋งŒ๋“ค ๋•Œ๋งˆ๋‹ค ์ฝ”๋“œ๋ฅผ ์ˆ˜์ •ํ•  ํ•„์š”๊ฐ€ ์—†์Šต๋‹ˆ๋‹ค!** +