1
This commit is contained in:
parent
d1bbd97d7f
commit
b807f856a5
@ -328,38 +328,108 @@ const ProjectGroupList: React.FC = () => {
|
||||
<CardHeader className="flex flex-row items-center justify-between">
|
||||
<CardTitle>项目组列表</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="rounded-md border">
|
||||
<CardContent className="p-0">
|
||||
<div className="relative rounded-md border">
|
||||
<div className="overflow-auto">
|
||||
<Table>
|
||||
<TableHeader>
|
||||
<TableRow>
|
||||
{columns.map((column) => (
|
||||
<TableHead className="min-w-[140px]">项目组编码</TableHead>
|
||||
<TableHead className="min-w-[140px]">项目组名称</TableHead>
|
||||
<TableHead className="min-w-[200px]">项目组描述</TableHead>
|
||||
<TableHead className="min-w-[120px]">项目组类型</TableHead>
|
||||
<TableHead className="min-w-[100px]">环境数量</TableHead>
|
||||
<TableHead className="min-w-[100px]">项目数量</TableHead>
|
||||
<TableHead className="min-w-[80px]">状态</TableHead>
|
||||
<TableHead className="min-w-[80px]">排序</TableHead>
|
||||
<TableHead
|
||||
key={column.accessorKey || column.id}
|
||||
style={{width: column.size}}
|
||||
className="sticky right-0 bg-white shadow-[-4px_0_8px_-6px_rgba(0,0,0,0.2)] min-w-[160px]"
|
||||
>
|
||||
{column.header}
|
||||
操作
|
||||
</TableHead>
|
||||
))}
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
{list.map((item) => (
|
||||
<TableRow key={item.id}>
|
||||
{columns.map((column) => (
|
||||
<TableCell
|
||||
key={column.accessorKey || column.id}
|
||||
>
|
||||
{column.cell
|
||||
? column.cell({row: {original: item}})
|
||||
: item[column.accessorKey!]}
|
||||
<TableCell>{item.projectGroupCode}</TableCell>
|
||||
<TableCell>{item.projectGroupName}</TableCell>
|
||||
<TableCell>{item.projectGroupDesc}</TableCell>
|
||||
<TableCell>
|
||||
{(() => {
|
||||
const typeInfo = getProjectTypeInfo(item.type);
|
||||
return (
|
||||
<Badge variant="outline" className="flex items-center gap-1">
|
||||
{typeInfo.icon}
|
||||
{typeInfo.label}
|
||||
</Badge>
|
||||
);
|
||||
})()}
|
||||
</TableCell>
|
||||
<TableCell>
|
||||
<div className="flex items-center gap-1">
|
||||
<EnvironmentOutlined/>
|
||||
<span>{item.totalEnvironments}</span>
|
||||
</div>
|
||||
</TableCell>
|
||||
<TableCell>
|
||||
<div className="flex items-center gap-1">
|
||||
<TeamOutlined/>
|
||||
<span>{item.totalApplications}</span>
|
||||
</div>
|
||||
</TableCell>
|
||||
<TableCell>
|
||||
<Badge variant={item.enabled ? "outline" : "secondary"}>
|
||||
{item.enabled ? '启用' : '禁用'}
|
||||
</Badge>
|
||||
</TableCell>
|
||||
<TableCell>{item.sort}</TableCell>
|
||||
<TableCell className="sticky right-0 bg-white shadow-[-4px_0_8px_-6px_rgba(0,0,0,0.2)]">
|
||||
<div className="flex items-center gap-2">
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
onClick={() => handleEdit(item)}
|
||||
>
|
||||
<EditOutlined className="mr-1"/>
|
||||
编辑
|
||||
</Button>
|
||||
<AlertDialog>
|
||||
<AlertDialogTrigger asChild>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
className="text-destructive"
|
||||
>
|
||||
<DeleteOutlined className="mr-1"/>
|
||||
删除
|
||||
</Button>
|
||||
</AlertDialogTrigger>
|
||||
<AlertDialogContent>
|
||||
<AlertDialogHeader>
|
||||
<AlertDialogTitle>确定要删除该项目组吗?</AlertDialogTitle>
|
||||
<AlertDialogDescription>
|
||||
删除后将无法恢复,请谨慎操作
|
||||
</AlertDialogDescription>
|
||||
</AlertDialogHeader>
|
||||
<AlertDialogFooter>
|
||||
<AlertDialogCancel>取消</AlertDialogCancel>
|
||||
<AlertDialogAction
|
||||
onClick={() => handleDelete(item.id)}
|
||||
>
|
||||
确定
|
||||
</AlertDialogAction>
|
||||
</AlertDialogFooter>
|
||||
</AlertDialogContent>
|
||||
</AlertDialog>
|
||||
</div>
|
||||
</TableCell>
|
||||
))}
|
||||
</TableRow>
|
||||
))}
|
||||
</TableBody>
|
||||
</Table>
|
||||
</div>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user