chpark/vexplor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

기타 수정

Browse Source
This commit is contained in:
hyeonsu
2025-09-08 10:33:00 +09:00
parent b02e9610ea
commit 37fac630b9
4 changed files with 25 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
frontend/components/dataflow/DataFlowDesigner.tsx
View File

@@ -8,10 +8,10 @@ import {
Edge,
Controls,
Background,
MiniMap,
useNodesState,
useEdgesState,
BackgroundVariant,
SelectionMode,
} from "@xyflow/react";
import "@xyflow/react/dist/style.css";
import { TableNode } from "./TableNode";
@@ -435,10 +435,9 @@ export const DataFlowDesigner: React.FC<DataFlowDesignerProps> = ({ companyCode,
<div key={`selected-${tableName}-${index}`}>
<div className="w-full min-w-0 rounded-lg border border-blue-300 bg-white p-3">
<div className="mb-2 flex flex-wrap items-center gap-2">
<div className="flex-shrink-0 rounded bg-blue-600 px-2 py-1 text-xs font-medium text-white">
<div className="flex-shrink-0 rounded px-2 py-1 text-xs font-medium text-blue-600">
{displayName}
</div>
<div className="flex-shrink-0 text-xs text-gray-500">{tableName}</div>
</div>
<div className="flex w-full min-w-0 flex-wrap gap-1">
{columns.map((column, columnIndex) => (
@@ -466,9 +465,9 @@ export const DataFlowDesigner: React.FC<DataFlowDesignerProps> = ({ companyCode,
<button
onClick={openConnectionModal}
disabled={!canCreateConnection()}
className={`rounded px-3 py-1 text-xs font-medium transition-colors ${
className={`w-full rounded px-3 py-1 text-xs font-medium transition-colors ${
canCreateConnection()
? "bg-blue-600 text-white hover:bg-blue-700"
? "cursor-pointer bg-blue-600 text-white hover:bg-blue-700"
: "cursor-not-allowed bg-gray-300 text-gray-500"
}`}
>
@@ -479,7 +478,7 @@ export const DataFlowDesigner: React.FC<DataFlowDesignerProps> = ({ companyCode,
setSelectedColumns({});
setSelectionOrder([]);
}}
className="rounded bg-gray-200 px-3 py-1 text-xs font-medium text-gray-600 hover:bg-gray-300"
className="w-full cursor-pointer rounded bg-gray-200 px-3 py-1 text-xs font-medium text-gray-600 hover:bg-gray-300"
>
선택 초기화
</button>
@@ -506,19 +505,14 @@ export const DataFlowDesigner: React.FC<DataFlowDesignerProps> = ({ companyCode,
panOnScroll={false}
zoomOnScroll={true}
zoomOnPinch={true}
panOnDrag={true}
panOnDrag={[1, 2]}
selectionOnDrag={true}
multiSelectionKeyCode={null}
selectNodesOnDrag={false}
selectionMode={SelectionMode.Partial}
>
<Controls />
<MiniMap
nodeColor={(node) => {
switch (node.type) {
case "tableNode":
return "#3B82F6";
default:
return "#6B7280";
}
}}
/>
<Background variant={BackgroundVariant.Dots} gap={20} size={1} color="#E5E7EB" />
</ReactFlow>