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

배치목록 카드형으로 변경

Browse Source
This commit is contained in:
hjjeong
2025-09-30 10:30:26 +09:00
parent 0b787b4c4c
commit 7fc3111c4d
2 changed files with 203 additions and 104 deletions
Download Patch File Download Diff File Expand all files Collapse all files

122
frontend/app/(main)/admin/batchmng/page.tsx
View File

@@ -4,7 +4,6 @@ import React, { useState, useEffect } from "react";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Badge } from "@/components/ui/badge";
import {
Table,
TableBody,
@@ -16,15 +15,8 @@ import {
import {
Plus,
Search,
Play,
Pause,
Edit,
Trash2,
RefreshCw,
Clock,
Database,
ArrowRight,
Globe
Database
} from "lucide-react";
import { toast } from "sonner";
import { useRouter } from "next/navigation";
@@ -33,6 +25,7 @@ import {
BatchConfig,
BatchMapping,
} from "@/lib/api/batch";
import BatchCard from "@/components/admin/BatchCard";
export default function BatchManagementPage() {
const router = useRouter();
@@ -185,7 +178,7 @@ export default function BatchManagementPage() {
};
return (
<div className="container mx-auto p-6 space-y-6">
<div className="container mx-auto p-4 space-y-2">
{/* 헤더 */}
<div className="flex items-center justify-between">
<div>
@@ -203,7 +196,7 @@ export default function BatchManagementPage() {
{/* 검색 및 필터 */}
<Card>
<CardContent className="pt-6">
<CardContent className="py-2">
<div className="flex items-center space-x-4">
<div className="flex-1 relative">
<Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-muted-foreground h-4 w-4" />
@@ -254,100 +247,21 @@ export default function BatchManagementPage() {
)}
</div>
) : (
<div className="space-y-4">
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 gap-3">
{batchConfigs.map((batch) => (
<div key={batch.id} className="border rounded-lg p-6 space-y-4">
{/* 배치 기본 정보 */}
<div className="flex items-start justify-between">
<div className="space-y-2">
<div className="flex items-center space-x-3">
<h3 className="text-lg font-semibold">{batch.batch_name}</h3>
<Badge variant={batch.is_active === 'Y' ? 'default' : 'secondary'}>
{batch.is_active === 'Y' ? '활성' : '비활성'}
</Badge>
</div>
{batch.description && (
<p className="text-muted-foreground">{batch.description}</p>
)}
<div className="flex items-center space-x-4 text-sm text-muted-foreground">
<div className="flex items-center space-x-1">
<Clock className="h-4 w-4" />
<span>{batch.cron_schedule}</span>
</div>
<div>
생성일: {new Date(batch.created_date).toLocaleDateString()}
</div>
</div>
</div>
{/* 액션 버튼들 */}
<div className="flex items-center space-x-2">
<Button
variant="outline"
size="sm"
onClick={() => executeBatch(batch.id)}
disabled={executingBatch === batch.id}
className="flex items-center space-x-1"
>
{executingBatch === batch.id ? (
<RefreshCw className="h-4 w-4 animate-spin" />
) : (
<Play className="h-4 w-4" />
)}
<span>실행</span>
</Button>
<Button
variant="outline"
size="sm"
onClick={() => {
console.log("🖱️ 비활성화/활성화 버튼 클릭:", { batchId: batch.id, currentStatus: batch.is_active });
toggleBatchStatus(batch.id, batch.is_active);
}}
className="flex items-center space-x-1"
>
{batch.is_active === 'Y' ? (
<Pause className="h-4 w-4" />
) : (
<Play className="h-4 w-4" />
)}
<span>{batch.is_active === 'Y' ? '비활성화' : '활성화'}</span>
</Button>
<Button
variant="outline"
size="sm"
onClick={() => router.push(`/admin/batchmng/edit/${batch.id}`)}
className="flex items-center space-x-1"
>
<Edit className="h-4 w-4" />
<span>수정</span>
</Button>
<Button
variant="outline"
size="sm"
onClick={() => deleteBatch(batch.id, batch.batch_name)}
className="flex items-center space-x-1 text-red-600 hover:text-red-700"
>
<Trash2 className="h-4 w-4" />
<span>삭제</span>
</Button>
</div>
</div>
{/* 매핑 정보 */}
{batch.batch_mappings && batch.batch_mappings.length > 0 && (
<div className="space-y-2">
<h4 className="text-sm font-medium text-muted-foreground">
매핑 정보 ({batch.batch_mappings.length}개)
</h4>
<div className="text-sm">
{getMappingSummary(batch.batch_mappings)}
</div>
</div>
)}
</div>
<BatchCard
key={batch.id}
batch={batch}
executingBatch={executingBatch}
onExecute={executeBatch}
onToggleStatus={(batchId, currentStatus) => {
console.log("🖱️ 비활성화/활성화 버튼 클릭:", { batchId, currentStatus });
toggleBatchStatus(batchId, currentStatus);
}}
onEdit={(batchId) => router.push(`/admin/batchmng/edit/${batchId}`)}
onDelete={deleteBatch}
getMappingSummary={getMappingSummary}
/>
))}
</div>
)}