133 lines
3.5 KiB
Vue
133 lines
3.5 KiB
Vue
<!-- app/components/docs/ApiDocsContent.vue - 前端文档页内容,覆盖旧 Flask /docs 页面 -->
|
||
<script lang="ts" setup>
|
||
import { Badge } from "@/components/ui/badge";
|
||
import {
|
||
Card,
|
||
CardContent,
|
||
CardDescription,
|
||
CardHeader,
|
||
CardTitle
|
||
} from "@/components/ui/card";
|
||
import {
|
||
Table,
|
||
TableBody,
|
||
TableCell,
|
||
TableHead,
|
||
TableHeader,
|
||
TableRow
|
||
} from "@/components/ui/table";
|
||
|
||
/** 文档示例保持本地接口字段名,避免把真实 token 或 key 写进前端 */
|
||
const searchExample = `GET /api/search?title=中国的首都是哪个城市?&type=single&options=A. 北京\\nB. 上海`;
|
||
|
||
const successExample = `{
|
||
"code": 1,
|
||
"question": "中国的首都是哪个城市?",
|
||
"answer": "A"
|
||
}`;
|
||
|
||
const endpoints = [
|
||
{
|
||
method: "GET/POST",
|
||
path: "/api/search",
|
||
auth: "可选",
|
||
description: "OCS AnswererWrapper 查询入口"
|
||
},
|
||
{
|
||
method: "GET",
|
||
path: "/api/health",
|
||
auth: "否",
|
||
description: "服务健康检查"
|
||
},
|
||
{
|
||
method: "GET",
|
||
path: "/api/stats",
|
||
auth: "可选",
|
||
description: "运行统计和缓存数量"
|
||
},
|
||
{
|
||
method: "GET",
|
||
path: "/api/records",
|
||
auth: "可选",
|
||
description: "最近问答记录"
|
||
},
|
||
{
|
||
method: "POST",
|
||
path: "/api/cache/clear",
|
||
auth: "可选",
|
||
description: "清空当前进程内缓存"
|
||
}
|
||
];
|
||
</script>
|
||
|
||
<template>
|
||
<article class="grid gap-5">
|
||
<Card>
|
||
<CardHeader>
|
||
<CardTitle class="text-xl">API 文档</CardTitle>
|
||
<CardDescription class="leading-6">
|
||
响应保持 OCS AnswererWrapper 兼容:成功返回
|
||
<Badge variant="secondary">code: 1</Badge>
|
||
,失败返回
|
||
<Badge variant="secondary">code: 0</Badge>
|
||
。
|
||
</CardDescription>
|
||
</CardHeader>
|
||
</Card>
|
||
|
||
<Card>
|
||
<CardHeader>
|
||
<CardTitle>接口列表</CardTitle>
|
||
</CardHeader>
|
||
<CardContent>
|
||
<div class="overflow-auto">
|
||
<Table class="min-w-[720px]">
|
||
<TableHeader>
|
||
<TableRow>
|
||
<TableHead>方法</TableHead>
|
||
<TableHead>路径</TableHead>
|
||
<TableHead>Token</TableHead>
|
||
<TableHead>说明</TableHead>
|
||
</TableRow>
|
||
</TableHeader>
|
||
<TableBody>
|
||
<TableRow v-for="item in endpoints" :key="item.path">
|
||
<TableCell>{{ item.method }}</TableCell>
|
||
<TableCell class="font-mono text-xs text-foreground">
|
||
{{ item.path }}
|
||
</TableCell>
|
||
<TableCell>{{ item.auth }}</TableCell>
|
||
<TableCell>{{ item.description }}</TableCell>
|
||
</TableRow>
|
||
</TableBody>
|
||
</Table>
|
||
</div>
|
||
</CardContent>
|
||
</Card>
|
||
|
||
<section class="grid gap-4 lg:grid-cols-2">
|
||
<Card>
|
||
<CardHeader>
|
||
<CardTitle>请求示例</CardTitle>
|
||
</CardHeader>
|
||
<CardContent>
|
||
<pre
|
||
class="overflow-auto rounded-2xl bg-muted p-4 text-xs leading-5 text-muted-foreground"
|
||
><code>{{ searchExample }}</code></pre>
|
||
</CardContent>
|
||
</Card>
|
||
|
||
<Card>
|
||
<CardHeader>
|
||
<CardTitle>成功响应</CardTitle>
|
||
</CardHeader>
|
||
<CardContent>
|
||
<pre
|
||
class="overflow-auto rounded-2xl bg-muted p-4 text-xs leading-5 text-muted-foreground"
|
||
><code>{{ successExample }}</code></pre>
|
||
</CardContent>
|
||
</Card>
|
||
</section>
|
||
</article>
|
||
</template>
|