68 lines
2.0 KiB
TypeScript
68 lines
2.0 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect, useMemo, useState } from "react";
|
|
import { api } from "@/lib/api";
|
|
import type { RawQAItem } from "@/lib/types";
|
|
import QAReviewCard from "@/components/QAReviewCard";
|
|
|
|
const riskFilters = [
|
|
"全部",
|
|
"学员隐私",
|
|
"未成年人信息",
|
|
"婚姻家庭敏感内容",
|
|
"心理 / 医疗边界",
|
|
"法律边界",
|
|
"课程效果承诺",
|
|
"团队表达风险",
|
|
"其他"
|
|
];
|
|
|
|
export default function HighRiskPage() {
|
|
const [items, setItems] = useState<RawQAItem[]>([]);
|
|
const [filter, setFilter] = useState("全部");
|
|
|
|
async function load() {
|
|
const [high, forbidden] = await Promise.all([
|
|
api.get<RawQAItem[]>("/raw-qa?risk_level=high"),
|
|
api.get<RawQAItem[]>("/raw-qa?risk_level=forbidden")
|
|
]);
|
|
setItems([...high, ...forbidden]);
|
|
}
|
|
|
|
useEffect(() => {
|
|
load();
|
|
}, []);
|
|
|
|
const visible = useMemo(() => {
|
|
if (filter === "全部") return items;
|
|
if (filter === "其他") return items.filter((item) => item.risk_types.length === 0);
|
|
return items.filter((item) => item.risk_types.includes(filter));
|
|
}, [filter, items]);
|
|
|
|
return (
|
|
<div className="space-y-6">
|
|
<div className="flex flex-wrap items-center justify-between gap-3">
|
|
<h1 className="text-2xl font-semibold text-ink">高风险问答</h1>
|
|
<select
|
|
value={filter}
|
|
onChange={(event) => setFilter(event.target.value)}
|
|
className="h-10 rounded-md border border-line bg-white px-3 text-sm outline-none focus:border-jade"
|
|
>
|
|
{riskFilters.map((item) => (
|
|
<option key={item}>{item}</option>
|
|
))}
|
|
</select>
|
|
</div>
|
|
<div className="space-y-4">
|
|
{visible.map((item) => (
|
|
<QAReviewCard key={item.id} item={item} onChanged={load} />
|
|
))}
|
|
{visible.length === 0 ? (
|
|
<div className="rounded-md border border-line bg-white p-8 text-center text-sm text-slate-500">暂无高风险问答</div>
|
|
) : null}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|