feat: enhance V2ButtonConfigPanel to support dynamic column mapping

- Implemented logic to load reference table columns based on selected target table, improving the configurability of button mappings.
- Added error handling for API calls to ensure robustness when fetching column data.
- Updated dependencies in the useEffect hook to ensure proper reactivity when available tables change.

These enhancements aim to provide users with a more flexible and dynamic configuration experience in the V2ButtonConfigPanel, allowing for better management of button mappings based on table relationships.
This commit is contained in:
kjs 2026-03-17 21:05:59 +09:00
parent 5e6261f51a
commit a3e6afa93e
1 changed files with 39 additions and 1 deletions

View File

@ -387,13 +387,51 @@ export const V2ButtonConfigPanel: React.FC<V2ButtonConfigPanelProps> = ({
if (targetTable) { if (targetTable) {
const cols = await loadTableColumns(targetTable); const cols = await loadTableColumns(targetTable);
try {
const fullResponse = await apiClient.get(`/table-management/tables/${targetTable}/columns`);
let fullColumnData = fullResponse.data?.data;
if (!Array.isArray(fullColumnData) && fullColumnData?.columns) fullColumnData = fullColumnData.columns;
if (!Array.isArray(fullColumnData) && fullColumnData?.data) fullColumnData = fullColumnData.data;
if (Array.isArray(fullColumnData)) {
const refTableSet = new Set<string>();
fullColumnData.forEach((col: any) => {
const inputType = col.inputType || col.input_type;
if (inputType !== "entity") return;
let refTable = col.referenceTable || col.reference_table;
if (!refTable && col.detailSettings) {
try {
const ds = typeof col.detailSettings === "string" ? JSON.parse(col.detailSettings) : col.detailSettings;
refTable = ds?.referenceTable;
} catch { /* ignore */ }
}
if (refTable) refTableSet.add(refTable);
});
const targetColumnNames = new Set(cols.map((c) => c.name));
for (const refTable of refTableSet) {
const refCols = await loadTableColumns(refTable);
const refTableLabel = availableTables.find((t) => t.name === refTable)?.label || refTable;
refCols.forEach((rc) => {
if (!targetColumnNames.has(rc.name)) {
cols.push({
name: rc.name,
label: `${rc.label} [${refTableLabel}]`,
});
}
});
}
}
} catch { /* ignore */ }
setMappingTargetColumns(cols); setMappingTargetColumns(cols);
} else { } else {
setMappingTargetColumns([]); setMappingTargetColumns([]);
} }
}; };
loadAll(); loadAll();
}, [actionType, config.action?.dataTransfer?.multiTableMappings, config.action?.dataTransfer?.targetTable, loadTableColumns]); }, [actionType, config.action?.dataTransfer?.multiTableMappings, config.action?.dataTransfer?.targetTable, availableTables, loadTableColumns]);
// 화면 목록 로드 (모달 액션용) // 화면 목록 로드 (모달 액션용)
useEffect(() => { useEffect(() => {