zetaloop
126 lines
4.5 KiB
TypeScript
126 lines
4.5 KiB
TypeScript
import { MoreHorizontal, Star, UserPlus } from "lucide-react"
|
|
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"
|
|
import { Badge } from "@/components/ui/badge"
|
|
import { Button } from "@/components/ui/button"
|
|
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
|
|
import {
|
|
DropdownMenu,
|
|
DropdownMenuContent,
|
|
DropdownMenuItem,
|
|
DropdownMenuTrigger,
|
|
} from "@/components/ui/dropdown-menu"
|
|
import { Input } from "@/components/ui/input"
|
|
import {
|
|
Table,
|
|
TableBody,
|
|
TableCell,
|
|
TableHead,
|
|
TableHeader,
|
|
TableRow,
|
|
} from "@/components/ui/table"
|
|
import { mockPlayers } from "@/lib/mock-data"
|
|
|
|
const shopPlayers = mockPlayers.filter((p) => p.shopId === "shop1")
|
|
|
|
const statusLabels: Record<string, string> = {
|
|
available: "在线",
|
|
busy: "忙碌",
|
|
offline: "离线",
|
|
}
|
|
|
|
const statusVariants: Record<string, "default" | "secondary" | "outline"> = {
|
|
available: "default",
|
|
busy: "secondary",
|
|
offline: "outline",
|
|
}
|
|
|
|
export default function EmployeesPage() {
|
|
return (
|
|
<div className="space-y-6">
|
|
<div className="flex items-center justify-between">
|
|
<h1 className="text-2xl font-bold">员工管理</h1>
|
|
<Button>
|
|
<UserPlus className="mr-1 h-4 w-4" />
|
|
邀请打手
|
|
</Button>
|
|
</div>
|
|
|
|
<Card>
|
|
<CardHeader>
|
|
<div className="flex items-center justify-between">
|
|
<CardTitle className="text-base">签约打手 ({shopPlayers.length})</CardTitle>
|
|
<Input placeholder="搜索打手..." className="max-w-xs" />
|
|
</div>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<Table>
|
|
<TableHeader>
|
|
<TableRow>
|
|
<TableHead>打手</TableHead>
|
|
<TableHead>擅长游戏</TableHead>
|
|
<TableHead>评分</TableHead>
|
|
<TableHead>完成率</TableHead>
|
|
<TableHead>状态</TableHead>
|
|
<TableHead className="text-right">操作</TableHead>
|
|
</TableRow>
|
|
</TableHeader>
|
|
<TableBody>
|
|
{shopPlayers.map((player) => (
|
|
<TableRow key={player.id}>
|
|
<TableCell>
|
|
<div className="flex items-center gap-2">
|
|
<Avatar className="h-8 w-8">
|
|
<AvatarImage src={player.user.avatar} />
|
|
<AvatarFallback>{player.user.nickname[0]}</AvatarFallback>
|
|
</Avatar>
|
|
<div>
|
|
<p className="text-sm font-medium">{player.user.nickname}</p>
|
|
<p className="text-xs text-muted-foreground">{player.totalOrders} 单</p>
|
|
</div>
|
|
</div>
|
|
</TableCell>
|
|
<TableCell>
|
|
<div className="flex gap-1 flex-wrap">
|
|
{player.games.map((game) => (
|
|
<Badge key={game} variant="secondary" className="text-xs">
|
|
{game}
|
|
</Badge>
|
|
))}
|
|
</div>
|
|
</TableCell>
|
|
<TableCell>
|
|
<div className="flex items-center gap-1">
|
|
<Star className="h-3.5 w-3.5 fill-yellow-400 text-yellow-400" />
|
|
{player.rating}
|
|
</div>
|
|
</TableCell>
|
|
<TableCell>{(player.completionRate * 100).toFixed(0)}%</TableCell>
|
|
<TableCell>
|
|
<Badge variant={statusVariants[player.status]}>
|
|
{statusLabels[player.status]}
|
|
</Badge>
|
|
</TableCell>
|
|
<TableCell className="text-right">
|
|
<DropdownMenu>
|
|
<DropdownMenuTrigger asChild>
|
|
<Button variant="ghost" size="icon">
|
|
<MoreHorizontal className="h-4 w-4" />
|
|
</Button>
|
|
</DropdownMenuTrigger>
|
|
<DropdownMenuContent align="end">
|
|
<DropdownMenuItem>查看详情</DropdownMenuItem>
|
|
<DropdownMenuItem>调整抽成</DropdownMenuItem>
|
|
<DropdownMenuItem className="text-destructive">移除打手</DropdownMenuItem>
|
|
</DropdownMenuContent>
|
|
</DropdownMenu>
|
|
</TableCell>
|
|
</TableRow>
|
|
))}
|
|
</TableBody>
|
|
</Table>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
)
|
|
}
|