2408d50cb0
Redesign navigation, home overview, user portrait, and valuation pages with improved functionality and responsive design. Co-authored-by: null <4804959+fnvtk@users.noreply.github.com>
274 lines
13 KiB
TypeScript
274 lines
13 KiB
TypeScript
"use client"
|
|
|
|
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
|
|
import { Button } from "@/components/ui/button"
|
|
import { Badge } from "@/components/ui/badge"
|
|
import { Progress } from "@/components/ui/progress"
|
|
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"
|
|
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table"
|
|
import { Pause, AlertCircle, CheckCircle, RefreshCw, Tag, User } from "lucide-react"
|
|
|
|
export function TaskExecution() {
|
|
return (
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle>任务执行状态</CardTitle>
|
|
</CardHeader>
|
|
<CardContent className="space-y-6">
|
|
<div className="flex justify-between items-center">
|
|
<div>
|
|
<h3 className="text-lg font-medium">京东活跃用户标记</h3>
|
|
<p className="text-sm text-muted-foreground">识别在京东平台活跃的用户并打上相应标签</p>
|
|
</div>
|
|
<div className="flex space-x-2">
|
|
<Button variant="outline" size="sm">
|
|
<Pause className="mr-2 h-4 w-4" />
|
|
暂停
|
|
</Button>
|
|
<Button size="sm">
|
|
<RefreshCw className="mr-2 h-4 w-4" />
|
|
刷新状态
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="space-y-2">
|
|
<div className="flex justify-between items-center">
|
|
<div className="flex items-center">
|
|
<Badge className="bg-blue-100 text-blue-800 mr-2">运行中</Badge>
|
|
<span className="text-sm text-muted-foreground">预计剩余时间: 45分钟</span>
|
|
</div>
|
|
<span className="text-sm font-medium">65%</span>
|
|
</div>
|
|
<Progress value={65} className="h-2" />
|
|
</div>
|
|
|
|
<div className="grid grid-cols-1 md:grid-cols-4 gap-4">
|
|
<div className="bg-gray-50 p-4 rounded-lg">
|
|
<div className="flex items-center space-x-2">
|
|
<User className="h-5 w-5 text-blue-500" />
|
|
<span className="text-sm font-medium">目标用户</span>
|
|
</div>
|
|
<div className="mt-2">
|
|
<span className="text-2xl font-bold">12,500</span>
|
|
</div>
|
|
</div>
|
|
<div className="bg-gray-50 p-4 rounded-lg">
|
|
<div className="flex items-center space-x-2">
|
|
<CheckCircle className="h-5 w-5 text-green-500" />
|
|
<span className="text-sm font-medium">已处理</span>
|
|
</div>
|
|
<div className="mt-2">
|
|
<span className="text-2xl font-bold">8,125</span>
|
|
</div>
|
|
</div>
|
|
<div className="bg-gray-50 p-4 rounded-lg">
|
|
<div className="flex items-center space-x-2">
|
|
<Tag className="h-5 w-5 text-purple-500" />
|
|
<span className="text-sm font-medium">已打标签</span>
|
|
</div>
|
|
<div className="mt-2">
|
|
<span className="text-2xl font-bold">5,840</span>
|
|
</div>
|
|
</div>
|
|
<div className="bg-gray-50 p-4 rounded-lg">
|
|
<div className="flex items-center space-x-2">
|
|
<AlertCircle className="h-5 w-5 text-red-500" />
|
|
<span className="text-sm font-medium">失败数</span>
|
|
</div>
|
|
<div className="mt-2">
|
|
<span className="text-2xl font-bold">120</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<Tabs defaultValue="logs" className="space-y-4">
|
|
<TabsList>
|
|
<TabsTrigger value="logs">执行日志</TabsTrigger>
|
|
<TabsTrigger value="users">用户处理</TabsTrigger>
|
|
<TabsTrigger value="errors">错误记录</TabsTrigger>
|
|
</TabsList>
|
|
|
|
<TabsContent value="logs" className="space-y-4">
|
|
<div className="bg-black text-green-400 p-4 rounded-md font-mono text-sm h-60 overflow-y-auto">
|
|
<div>[2023-07-15 14:30:15] 任务开始执行</div>
|
|
<div>[2023-07-15 14:30:16] 正在加载目标用户列表...</div>
|
|
<div>[2023-07-15 14:30:20] 已加载 12,500 个目标用户</div>
|
|
<div>[2023-07-15 14:30:25] 开始处理用户批次 #1 (1000 users)</div>
|
|
<div>[2023-07-15 14:35:10] 批次 #1 处理完成: 成功 950, 失败 50</div>
|
|
<div>[2023-07-15 14:35:15] 开始处理用户批次 #2 (1000 users)</div>
|
|
<div>[2023-07-15 14:40:05] 批次 #2 处理完成: 成功 980, 失败 20</div>
|
|
<div>[2023-07-15 14:40:10] 开始处理用户批次 #3 (1000 users)</div>
|
|
<div>[2023-07-15 14:45:00] 批次 #3 处理完成: 成功 990, 失败 10</div>
|
|
<div>[2023-07-15 14:45:05] 开始处理用户批次 #4 (1000 users)</div>
|
|
<div>[2023-07-15 14:50:00] 批次 #4 处理完成: 成功 995, 失败 5</div>
|
|
<div>[2023-07-15 14:50:05] 开始处理用户批次 #5 (1000 users)</div>
|
|
<div>[2023-07-15 14:55:00] 批次 #5 处理完成: 成功 985, 失败 15</div>
|
|
<div>[2023-07-15 14:55:05] 开始处理用户批次 #6 (1000 users)</div>
|
|
<div>[2023-07-15 15:00:00] 批次 #6 处理完成: 成功 975, 失败 25</div>
|
|
<div>[2023-07-15 15:00:05] 开始处理用户批次 #7 (1000 users)</div>
|
|
<div>[2023-07-15 15:05:00] 批次 #7 处理完成: 成功 990, 失败 10</div>
|
|
<div>[2023-07-15 15:05:05] 开始处理用户批次 #8 (1000 users)</div>
|
|
<div>[2023-07-15 15:10:00] 批次 #8 处理完成: 成功 975, 失败 25</div>
|
|
<div>[2023-07-15 15:10:05] 已处理 8000 个用户, 剩余 4500 个用户</div>
|
|
<div>[2023-07-15 15:10:10] 开始处理用户批次 #9 (1000 users)</div>
|
|
</div>
|
|
</TabsContent>
|
|
|
|
<TabsContent value="users" className="space-y-4">
|
|
<div className="rounded-md border">
|
|
<Table>
|
|
<TableHeader>
|
|
<TableRow>
|
|
<TableHead>用户ID</TableHead>
|
|
<TableHead>处理时间</TableHead>
|
|
<TableHead>状态</TableHead>
|
|
<TableHead>添加标签</TableHead>
|
|
<TableHead>详情</TableHead>
|
|
</TableRow>
|
|
</TableHeader>
|
|
<TableBody>
|
|
<TableRow>
|
|
<TableCell>user_12345</TableCell>
|
|
<TableCell>2023-07-15 14:32:15</TableCell>
|
|
<TableCell>
|
|
<Badge className="bg-green-100 text-green-800">成功</Badge>
|
|
</TableCell>
|
|
<TableCell>
|
|
<div className="flex flex-wrap gap-1">
|
|
<Badge variant="outline" className="flex items-center gap-1">
|
|
<Tag className="h-3 w-3" />
|
|
京东活跃用户
|
|
</Badge>
|
|
</div>
|
|
</TableCell>
|
|
<TableCell>登录成功, 近30天活跃度高</TableCell>
|
|
</TableRow>
|
|
<TableRow>
|
|
<TableCell>user_12346</TableCell>
|
|
<TableCell>2023-07-15 14:32:18</TableCell>
|
|
<TableCell>
|
|
<Badge className="bg-green-100 text-green-800">成功</Badge>
|
|
</TableCell>
|
|
<TableCell>
|
|
<div className="flex flex-wrap gap-1">
|
|
<Badge variant="outline" className="flex items-center gap-1">
|
|
<Tag className="h-3 w-3" />
|
|
京东活跃用户
|
|
</Badge>
|
|
<Badge variant="outline" className="flex items-center gap-1">
|
|
<Tag className="h-3 w-3" />
|
|
电商偏好
|
|
</Badge>
|
|
</div>
|
|
</TableCell>
|
|
<TableCell>登录成功, 购买频率高</TableCell>
|
|
</TableRow>
|
|
<TableRow>
|
|
<TableCell>user_12347</TableCell>
|
|
<TableCell>2023-07-15 14:32:20</TableCell>
|
|
<TableCell>
|
|
<Badge className="bg-red-100 text-red-800">失败</Badge>
|
|
</TableCell>
|
|
<TableCell>-</TableCell>
|
|
<TableCell>登录失败, 账号异常</TableCell>
|
|
</TableRow>
|
|
<TableRow>
|
|
<TableCell>user_12348</TableCell>
|
|
<TableCell>2023-07-15 14:32:25</TableCell>
|
|
<TableCell>
|
|
<Badge className="bg-green-100 text-green-800">成功</Badge>
|
|
</TableCell>
|
|
<TableCell>
|
|
<div className="flex flex-wrap gap-1">
|
|
<Badge variant="outline" className="flex items-center gap-1">
|
|
<Tag className="h-3 w-3" />
|
|
京东活跃用户
|
|
</Badge>
|
|
</div>
|
|
</TableCell>
|
|
<TableCell>登录成功, 浏览时间长</TableCell>
|
|
</TableRow>
|
|
<TableRow>
|
|
<TableCell>user_12349</TableCell>
|
|
<TableCell>2023-07-15 14:32:30</TableCell>
|
|
<TableCell>
|
|
<Badge className="bg-green-100 text-green-800">成功</Badge>
|
|
</TableCell>
|
|
<TableCell>
|
|
<div className="flex flex-wrap gap-1">
|
|
<Badge variant="outline" className="flex items-center gap-1">
|
|
<Tag className="h-3 w-3" />
|
|
京东活跃用户
|
|
</Badge>
|
|
<Badge variant="outline" className="flex items-center gap-1">
|
|
<Tag className="h-3 w-3" />
|
|
高消费用户
|
|
</Badge>
|
|
</div>
|
|
</TableCell>
|
|
<TableCell>登录成功, 消费金额高</TableCell>
|
|
</TableRow>
|
|
</TableBody>
|
|
</Table>
|
|
</div>
|
|
</TabsContent>
|
|
|
|
<TabsContent value="errors" className="space-y-4">
|
|
<div className="rounded-md border">
|
|
<Table>
|
|
<TableHeader>
|
|
<TableRow>
|
|
<TableHead>错误ID</TableHead>
|
|
<TableHead>时间</TableHead>
|
|
<TableHead>用户ID</TableHead>
|
|
<TableHead>错误类型</TableHead>
|
|
<TableHead>错误详情</TableHead>
|
|
</TableRow>
|
|
</TableHeader>
|
|
<TableBody>
|
|
<TableRow>
|
|
<TableCell>err_001</TableCell>
|
|
<TableCell>2023-07-15 14:32:20</TableCell>
|
|
<TableCell>user_12347</TableCell>
|
|
<TableCell>登录失败</TableCell>
|
|
<TableCell>账号异常, 可能被锁定</TableCell>
|
|
</TableRow>
|
|
<TableRow>
|
|
<TableCell>err_002</TableCell>
|
|
<TableCell>2023-07-15 14:33:15</TableCell>
|
|
<TableCell>user_12356</TableCell>
|
|
<TableCell>网络错误</TableCell>
|
|
<TableCell>连接超时, 请求失败</TableCell>
|
|
</TableRow>
|
|
<TableRow>
|
|
<TableCell>err_003</TableCell>
|
|
<TableCell>2023-07-15 14:35:05</TableCell>
|
|
<TableCell>user_12378</TableCell>
|
|
<TableCell>数据错误</TableCell>
|
|
<TableCell>用户数据格式不正确</TableCell>
|
|
</TableRow>
|
|
<TableRow>
|
|
<TableCell>err_004</TableCell>
|
|
<TableCell>2023-07-15 14:38:30</TableCell>
|
|
<TableCell>user_12390</TableCell>
|
|
<TableCell>权限错误</TableCell>
|
|
<TableCell>无权访问用户数据</TableCell>
|
|
</TableRow>
|
|
<TableRow>
|
|
<TableCell>err_005</TableCell>
|
|
<TableCell>2023-07-15 14:42:10</TableCell>
|
|
<TableCell>user_12405</TableCell>
|
|
<TableCell>API限流</TableCell>
|
|
<TableCell>请求频率超过限制</TableCell>
|
|
</TableRow>
|
|
</TableBody>
|
|
</Table>
|
|
</div>
|
|
</TabsContent>
|
|
</Tabs>
|
|
</CardContent>
|
|
</Card>
|
|
)
|
|
}
|