'use client';

import { useState } from 'react';
import Link from 'next/link';
import { TaskTable } from '@/components/admin/tasks/TaskTable';
import {
  PageContainer,
  PageHeader,
  PageCard,
} from '@/components/admin/common';
import { Button } from '@/components/ui/button';
import {
  Select,
  SelectContent,
  SelectItem,
  SelectTrigger,
  SelectValue,
} from '@/components/ui/select';
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
import {
  LayoutGrid,
  Activity,
  Clock,
  CheckCircle2,
  XCircle,
  Loader2,
  BarChart3,
} from 'lucide-react';
import { AdminTaskFilters, TaskStatus, TaskType } from '@/lib/hooks/admin/useAdminTasks';

export default function AdminTasksPage() {
  const [filters, setFilters] = useState<AdminTaskFilters>({});

  const handleStatusChange = (status: string) => {
    setFilters((prev) => ({
      ...prev,
      status: status === 'all' ? undefined : (status as TaskStatus),
    }));
  };

  const handleTypeChange = (type: string) => {
    setFilters((prev) => ({
      ...prev,
      type: type === 'all' ? undefined : (type as TaskType),
    }));
  };

  return (
    <PageContainer>
      <PageHeader
        title="任务管理"
        description="管理系统中的生成任务"
        actions={
          <div className="flex items-center gap-2">
            <Button variant="outline" size="icon" asChild>
              <Link href="/admin/tasks/stats">
                <BarChart3 className="h-4 w-4" />
              </Link>
            </Button>
            <Button variant="outline" size="icon" asChild>
              <Link href="/admin/dashboard">
                <LayoutGrid className="h-4 w-4" />
              </Link>
            </Button>
          </div>
        }
      />

      {/* Task List */}
      <PageCard
        title="任务列表"
        icon={<Activity className="h-5 w-5" />}
        headerActions={
          <Select onValueChange={handleTypeChange} defaultValue="all">
            <SelectTrigger className="w-32">
              <SelectValue placeholder="任务类型" />
            </SelectTrigger>
            <SelectContent>
              <SelectItem value="all">全部类型</SelectItem>
              <SelectItem value="image">图片生成</SelectItem>
              <SelectItem value="video">视频生成</SelectItem>
              <SelectItem value="audio">音频生成</SelectItem>
              <SelectItem value="script">剧本处理</SelectItem>
            </SelectContent>
          </Select>
        }
      >
        <Tabs
          defaultValue="all"
          className="space-y-4"
          onValueChange={handleStatusChange}
        >
          <TabsList>
            <TabsTrigger value="all">
              <Activity className="h-4 w-4 mr-1" />
              全部
            </TabsTrigger>
            <TabsTrigger value="pending">
              <Clock className="h-4 w-4 mr-1" />
              等待中
            </TabsTrigger>
            <TabsTrigger value="processing">
              <Loader2 className="h-4 w-4 mr-1" />
              处理中
            </TabsTrigger>
            <TabsTrigger value="completed">
              <CheckCircle2 className="h-4 w-4 mr-1" />
              已完成
            </TabsTrigger>
            <TabsTrigger value="failed">
              <XCircle className="h-4 w-4 mr-1" />
              失败
            </TabsTrigger>
          </TabsList>

          <TabsContent value="all" className="space-y-4">
            <TaskTable filters={filters} />
          </TabsContent>

          <TabsContent value="pending" className="space-y-4">
            <TaskTable filters={filters} />
          </TabsContent>

          <TabsContent value="processing" className="space-y-4">
            <TaskTable filters={filters} />
          </TabsContent>

          <TabsContent value="completed" className="space-y-4">
            <TaskTable filters={filters} />
          </TabsContent>

          <TabsContent value="failed" className="space-y-4">
            <TaskTable filters={filters} />
          </TabsContent>
        </Tabs>
      </PageCard>
    </PageContainer>
  );
}
