Files
OCS_service/app/components/docs/ApiDocsContent.vue
T
2026-05-22 16:27:35 +08:00

133 lines
3.5 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!-- 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>