[agent-pipeline] pipe-20260315080636-1tpd round-1
This commit is contained in:
parent
24b53b5b33
commit
f711506671
|
|
@ -1,10 +1,10 @@
|
|||
"use client";
|
||||
|
||||
import { useState, useEffect, useCallback } from "react";
|
||||
import { useState, useEffect, useCallback, useMemo } from "react";
|
||||
import { useSearchParams } from "next/navigation";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { Input } from "@/components/ui/input";
|
||||
import { ArrowLeft, Plus, RefreshCw, Search, LayoutGrid, LayoutList, TestTube2 } from "lucide-react";
|
||||
import { ArrowLeft, Plus, RefreshCw, Search, LayoutGrid, LayoutList, TestTube2, ChevronRight, Monitor, Database, FolderOpen } from "lucide-react";
|
||||
import ScreenList from "@/components/screen/ScreenList";
|
||||
import ScreenDesigner from "@/components/screen/ScreenDesigner";
|
||||
import TemplateManager from "@/components/screen/TemplateManager";
|
||||
|
|
@ -15,6 +15,7 @@ import { ScrollToTop } from "@/components/common/ScrollToTop";
|
|||
import { ScreenDefinition } from "@/types/screen";
|
||||
import { screenApi } from "@/lib/api/screen";
|
||||
import { Tabs, TabsList, TabsTrigger } from "@/components/ui/tabs";
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import CreateScreenModal from "@/components/screen/CreateScreenModal";
|
||||
|
||||
// 단계별 진행을 위한 타입 정의
|
||||
|
|
@ -34,6 +35,8 @@ export default function ScreenManagementPage() {
|
|||
const [searchTerm, setSearchTerm] = useState("");
|
||||
const [isCreateOpen, setIsCreateOpen] = useState(false);
|
||||
|
||||
const tableCount = useMemo(() => new Set(screens.map((s) => s.tableName).filter(Boolean)).size, [screens]);
|
||||
|
||||
// 화면 목록 로드
|
||||
const loadScreens = useCallback(async () => {
|
||||
try {
|
||||
|
|
@ -200,6 +203,33 @@ export default function ScreenManagementPage() {
|
|||
<div className="absolute bottom-0 left-0 right-0 h-[2px] bg-gradient-to-r from-transparent via-primary/50 to-transparent" />
|
||||
</div>
|
||||
|
||||
{/* 통계 요약 바 */}
|
||||
<div className="flex-shrink-0 flex items-center gap-6 border-b border-border/50 bg-muted/5 px-6 py-2.5">
|
||||
<div className="flex items-center gap-2">
|
||||
<Monitor className="h-4 w-4 text-primary" />
|
||||
<span className="text-xs text-muted-foreground">화면</span>
|
||||
<span className="text-sm font-bold">{screens.length}</span>
|
||||
</div>
|
||||
<div className="h-4 w-px bg-border" />
|
||||
<div className="flex items-center gap-2">
|
||||
<Database className="h-4 w-4 text-info" />
|
||||
<span className="text-xs text-muted-foreground">테이블</span>
|
||||
<span className="text-sm font-bold">{tableCount}</span>
|
||||
</div>
|
||||
{(selectedGroup || selectedScreen) && (
|
||||
<div className="ml-auto flex items-center gap-1.5 text-xs text-muted-foreground">
|
||||
<span>현재:</span>
|
||||
{selectedGroup && <Badge variant="outline" className="text-[10px]">{selectedGroup.name}</Badge>}
|
||||
{selectedScreen && (
|
||||
<>
|
||||
<ChevronRight className="h-3 w-3" />
|
||||
<Badge variant="secondary" className="text-[10px]">{selectedScreen.screenName}</Badge>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* 메인 콘텐츠 */}
|
||||
{viewMode === "tree" ? (
|
||||
<div className="flex-1 overflow-hidden flex">
|
||||
|
|
@ -246,6 +276,24 @@ export default function ScreenManagementPage() {
|
|||
}}
|
||||
/>
|
||||
</div>
|
||||
{/* 선택 미리보기 */}
|
||||
{selectedScreen && (
|
||||
<div className="flex-shrink-0 border-t border-border/50 p-3 bg-muted/5">
|
||||
<div className="flex items-center gap-2 mb-2">
|
||||
<Monitor className="h-4 w-4 text-primary" />
|
||||
<span className="text-sm font-medium truncate">{selectedScreen.screenName}</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-3 text-xs text-muted-foreground">
|
||||
<span className="font-mono">{selectedScreen.screenCode}</span>
|
||||
<span>{selectedScreen.tableName || "테이블 없음"}</span>
|
||||
</div>
|
||||
<div className="flex gap-2 mt-2">
|
||||
<Button size="sm" variant="outline" className="h-7 text-xs flex-1" onClick={() => handleDesignScreen(selectedScreen)}>
|
||||
편집
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* 오른쪽: 관계 시각화 (React Flow) */}
|
||||
|
|
|
|||
Loading…
Reference in New Issue