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

ui 수정 및 시현할 기능 업데이트

Browse Source
This commit is contained in:
leeheejin
2025-10-02 14:34:15 +09:00
parent 2c0dca08b4
commit 3fa410cbe4
168 changed files with 1545 additions and 1066 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
frontend/components/dataflow/connection/redesigned/RightPanel/TableStep.tsx
View File

@@ -90,7 +90,7 @@ export const TableStep: React.FC<TableStepProps> = ({
<h2 className="text-2xl font-bold text-gray-900 mb-2">
테이블 선택
</h2>
<p className="text-gray-600">
<p className="text-muted-foreground">
소스 테이블과 대상 테이블을 선택하세요
</p>
</div>
@@ -99,7 +99,7 @@ export const TableStep: React.FC<TableStepProps> = ({
<div className="bg-gray-50 rounded-lg p-4">
<div className="flex items-center justify-between">
<div className="flex items-center gap-3">
<Database className="w-5 h-5 text-blue-600" />
<Database className="w-5 h-5 text-primary" />
<span className="font-medium text-gray-900">{fromConnection?.name}</span>
<span className="text-sm text-gray-500">→</span>
<Database className="w-5 h-5 text-green-600" />
@@ -112,8 +112,8 @@ export const TableStep: React.FC<TableStepProps> = ({
{/* FROM 테이블 */}
<div className="space-y-4">
<div className="flex items-center gap-2">
<div className="w-8 h-8 bg-blue-100 rounded-full flex items-center justify-center">
<span className="text-blue-600 font-bold">1</span>
<div className="w-8 h-8 bg-primary/20 rounded-full flex items-center justify-center">
<span className="text-primary font-bold">1</span>
</div>
<h3 className="text-lg font-semibold text-gray-900">소스 테이블</h3>
<span className="text-sm text-gray-500">(FROM)</span>
@@ -125,20 +125,20 @@ export const TableStep: React.FC<TableStepProps> = ({
key={table.name}
className={`p-4 rounded-lg border-2 cursor-pointer transition-all duration-200 ${
selectedFromTable === table.name
? "border-blue-500 bg-blue-50 shadow-md"
? "border-primary bg-accent shadow-md"
: "border-gray-200 bg-white hover:border-blue-300 hover:bg-blue-25"
}`}
onClick={() => handleFromTableSelect(table.name)}
>
<div className="flex items-center gap-3">
<Table className="w-6 h-6 text-blue-600" />
<Table className="w-6 h-6 text-primary" />
<div className="flex-1">
<h4 className="font-medium text-gray-900">{table.name}</h4>
<p className="text-sm text-gray-600">{table.columns.length}개 컬럼</p>
<p className="text-sm text-muted-foreground">{table.columns.length}개 컬럼</p>
<p className="text-xs text-gray-500">{table.rowCount?.toLocaleString()}개 행</p>
</div>
{selectedFromTable === table.name && (
<CheckCircle className="w-5 h-5 text-blue-600" />
<CheckCircle className="w-5 h-5 text-primary" />
)}
</div>
</div>
@@ -171,7 +171,7 @@ export const TableStep: React.FC<TableStepProps> = ({
<Table className="w-6 h-6 text-green-600" />
<div className="flex-1">
<h4 className="font-medium text-gray-900">{table.name}</h4>
<p className="text-sm text-gray-600">{table.columns.length}개 컬럼</p>
<p className="text-sm text-muted-foreground">{table.columns.length}개 컬럼</p>
<p className="text-xs text-gray-500">{table.rowCount?.toLocaleString()}개 행</p>
</div>
{selectedToTable === table.name && (
@@ -188,7 +188,7 @@ export const TableStep: React.FC<TableStepProps> = ({
<div className="flex justify-between">
<button
onClick={onBack}
className="flex items-center gap-2 px-6 py-3 rounded-lg font-medium text-gray-600 bg-gray-100 hover:bg-gray-200 transition-all duration-200"
className="flex items-center gap-2 px-6 py-3 rounded-lg font-medium text-muted-foreground bg-gray-100 hover:bg-gray-200 transition-all duration-200"
>
<ArrowLeft className="w-4 h-4" />
이전 단계