125f7ec54c
Some checks failed
CI / build-deploy (push) Has been cancelled
- RBAC: 新增30个权限点、DataScope行级权限、requirePermission守卫，所有57+ Server Action接入权限校验 - UI拆分: exam-form(1623行→11文件)、textbook-reader(744行→7文件)，均降至300行以内 - 测试: 新增5个单元测试文件(19用例)，修复4个集成测试文件(38用例全部通过) - 架构文档: 新增架构影响地图(004/005)、标准功能清单(006)、差距审计报告(007) - 项目规则: 架构图优先规则，改码必同步图 - 安全: rehype-sanitize净化、AES加密API Key、权限路由守卫 - 无障碍: skip-link、aria-label、prefers-reduced-motion - 性能: next/font优化、next/image、代码分割
108 lines
3.7 KiB
TypeScript
108 lines
3.7 KiB
TypeScript
"use client"
|
|
|
|
import { PlusCircle, Pencil, Trash2 } from "lucide-react"
|
|
|
|
import type { KnowledgePoint } from "../types"
|
|
import { cn } from "@/shared/lib/utils"
|
|
import { ScrollArea } from "@/shared/components/ui/scroll-area"
|
|
import { Badge } from "@/shared/components/ui/badge"
|
|
import { Button } from "@/shared/components/ui/button"
|
|
|
|
interface KnowledgePointListProps {
|
|
knowledgePoints: KnowledgePoint[]
|
|
canEdit: boolean
|
|
highlightedKpId: string | null
|
|
onHighlight: (id: string) => void
|
|
onEdit: (kp: KnowledgePoint) => void
|
|
onDelete: (kpId: string, e: React.MouseEvent) => void
|
|
onCreateQuestion: (kp: KnowledgePoint) => void
|
|
}
|
|
|
|
export function KnowledgePointList({
|
|
knowledgePoints,
|
|
canEdit,
|
|
highlightedKpId,
|
|
onHighlight,
|
|
onEdit,
|
|
onDelete,
|
|
onCreateQuestion,
|
|
}: KnowledgePointListProps) {
|
|
if (knowledgePoints.length === 0) {
|
|
return (
|
|
<div className="flex h-full items-center justify-center text-muted-foreground p-4 text-center text-sm">
|
|
该章节暂无知识点。
|
|
</div>
|
|
)
|
|
}
|
|
|
|
return (
|
|
<ScrollArea className="flex-1 h-full px-2">
|
|
<div className="space-y-2 pb-4">
|
|
{knowledgePoints.map((kp) => (
|
|
<button
|
|
key={kp.id}
|
|
type="button"
|
|
className={cn(
|
|
"w-full text-left p-3 rounded-lg border bg-card hover:bg-accent/50 transition-colors cursor-pointer",
|
|
highlightedKpId === kp.id && "border-primary bg-primary/5"
|
|
)}
|
|
onClick={() => onHighlight(kp.id)}
|
|
>
|
|
<div className="flex items-start justify-between gap-2">
|
|
<h4 className="text-sm font-medium leading-none">{kp.name}</h4>
|
|
<div className="flex items-center gap-1">
|
|
<Badge variant="outline" className="text-[10px] h-5 px-1">Lv.{kp.level}</Badge>
|
|
{canEdit && (
|
|
<div className="flex items-center gap-1 ml-1">
|
|
<Button
|
|
variant="ghost"
|
|
size="icon"
|
|
className="h-5 w-5 text-muted-foreground hover:text-foreground"
|
|
onClick={(e) => {
|
|
e.stopPropagation()
|
|
onCreateQuestion(kp)
|
|
}}
|
|
title="创建相关题目"
|
|
aria-label="创建相关题目"
|
|
>
|
|
<PlusCircle className="h-3 w-3" />
|
|
</Button>
|
|
<Button
|
|
variant="ghost"
|
|
size="icon"
|
|
className="h-5 w-5 text-muted-foreground hover:text-foreground"
|
|
onClick={(e) => {
|
|
e.stopPropagation()
|
|
onEdit(kp)
|
|
}}
|
|
title="编辑知识点"
|
|
aria-label="编辑知识点"
|
|
>
|
|
<Pencil className="h-3 w-3" />
|
|
</Button>
|
|
<Button
|
|
variant="ghost"
|
|
size="icon"
|
|
className="h-5 w-5 text-muted-foreground hover:text-destructive"
|
|
onClick={(e) => onDelete(kp.id, e)}
|
|
title="删除知识点"
|
|
aria-label="删除知识点"
|
|
>
|
|
<Trash2 className="h-3 w-3" />
|
|
</Button>
|
|
</div>
|
|
)}
|
|
</div>
|
|
</div>
|
|
{kp.description && (
|
|
<p className="mt-2 text-xs text-muted-foreground line-clamp-2">
|
|
{kp.description}
|
|
</p>
|
|
)}
|
|
</button>
|
|
))}
|
|
</div>
|
|
</ScrollArea>
|
|
)
|
|
}
|