kjs
/
ERP-node
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

관계 수정 레이아웃 수정

This commit is contained in:
hyeonsu 2025-09-10 17:58:23 +09:00
parent 72b0d2ee98
commit 16bc77797a
1 changed files with 41 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

82
frontend/components/dataflow/ConnectionSetupModal.tsx
View File

@ -535,38 +535,26 @@ export const ConnectionSetupModal: React.FC<ConnectionSetupModalProps> = ({
<div className="rounded-lg border bg-gray-50 p-4">
<div className="mb-4 text-sm font-medium">테이블 및 컬럼 선택</div>
{/* 테이블 선택 */}
{/* 현재 선택된 테이블 표시 */}
<div className="mb-4 grid grid-cols-2 gap-4">
<div>
<Label className="text-xs font-medium text-gray-600">From 테이블</Label>
<Select value={selectedFromTable} onValueChange={setSelectedFromTable}>
<SelectTrigger className="mt-1">
<SelectValue placeholder="테이블 선택" />
</SelectTrigger>
<SelectContent>
{availableTables.map((table) => (
<SelectItem key={table.tableName} value={table.tableName}>
{table.displayName} ({table.tableName})
</SelectItem>
))}
</SelectContent>
</Select>
<div className="mt-1">
<span className="text-sm font-medium text-gray-800">
{availableTables.find((t) => t.tableName === selectedFromTable)?.displayName || selectedFromTable}
</span>
<span className="ml-2 text-xs text-gray-500">({selectedFromTable})</span>
</div>
</div>
<div>
<Label className="text-xs font-medium text-gray-600">To 테이블</Label>
<Select value={selectedToTable} onValueChange={setSelectedToTable}>
<SelectTrigger className="mt-1">
<SelectValue placeholder="테이블 선택" />
</SelectTrigger>
<SelectContent>
{availableTables.map((table) => (
<SelectItem key={table.tableName} value={table.tableName}>
{table.displayName} ({table.tableName})
</SelectItem>
))}
</SelectContent>
</Select>
<div className="mt-1">
<span className="text-sm font-medium text-gray-800">
{availableTables.find((t) => t.tableName === selectedToTable)?.displayName || selectedToTable}
</span>
<span className="ml-2 text-xs text-gray-500">({selectedToTable})</span>
</div>
</div>
</div>
@ -633,23 +621,35 @@ export const ConnectionSetupModal: React.FC<ConnectionSetupModalProps> = ({
{/* 선택된 컬럼 미리보기 */}
{(selectedFromColumns.length > 0 || selectedToColumns.length > 0) && (
<div className="mt-4 flex items-center gap-2 text-sm">
<span className="font-medium">{selectedFromTable}</span>
<div className="flex flex-wrap gap-1">
{selectedFromColumns.map((column) => (
<Badge key={column} variant="outline" className="text-xs">
{column}
</Badge>
))}
<div className="mt-4 grid grid-cols-2 gap-4">
<div>
<Label className="text-xs font-medium text-gray-600">선택된 From 컬럼</Label>
<div className="mt-1 flex flex-wrap gap-1">
{selectedFromColumns.length > 0 ? (
selectedFromColumns.map((column) => (
<Badge key={column} variant="outline" className="text-xs">
{column}
</Badge>
))
) : (
<span className="text-xs text-gray-400">선택된 컬럼 없음</span>
)}
</div>
</div>
<ArrowRight className="h-4 w-4 text-gray-400" />
<span className="font-medium">{selectedToTable}</span>
<div className="flex flex-wrap gap-1">
{selectedToColumns.map((column) => (
<Badge key={column} variant="secondary" className="text-xs">
{column}
</Badge>
))}
<div>
<Label className="text-xs font-medium text-gray-600">선택된 To 컬럼</Label>
<div className="mt-1 flex flex-wrap gap-1">
{selectedToColumns.length > 0 ? (
selectedToColumns.map((column) => (
<Badge key={column} variant="secondary" className="text-xs">
{column}
</Badge>
))
) : (
<span className="text-xs text-gray-400">선택된 컬럼 없음</span>
)}
</div>
</div>
</div>
)}