Files
OCS_service/app/components/home/OcsConfigCard.vue
T

77 lines
2.0 KiB
Vue

<!-- app/components/home/OcsConfigCard.vue - OCS AnswererWrapper 配置片段 -->
<script lang="ts" setup>
import { Check, Copy } from "lucide-vue-next";
import { Button } from "@/components/ui/button";
import {
Card,
CardAction,
CardContent,
CardHeader,
CardTitle
} from "@/components/ui/card";
const origin = ref("http://localhost:3000");
const copied = ref(false);
/** 浏览器端读取当前站点地址,避免文档里写死 localhost 或生产域名 */
onMounted(() => {
origin.value = window.location.origin;
});
/** 与旧 Python 项目的 ocs_config_example.json 保持同样字段 */
const configText = computed(() => {
return JSON.stringify(
[
{
name: "AI智能题库",
homepage: origin.value,
url: `${origin.value}/api/search`,
method: "get",
contentType: "json",
data: {
title: "${title}",
type: "${type}",
options: "${options}"
},
handler:
"return (res)=> res.code === 1 ? [res.question, res.answer] : [res.msg, undefined]"
}
],
null,
2
);
});
/** 复制配置片段,失败时不打断主流程 */
const copyConfig = async () => {
await navigator.clipboard.writeText(configText.value).catch(() => undefined);
copied.value = true;
window.setTimeout(() => {
copied.value = false;
}, 1200);
};
</script>
<template>
<Card>
<CardHeader>
<CardTitle>OCS 配置</CardTitle>
<CardAction>
<Button type="button" variant="outline" size="sm" @click="copyConfig">
<Check v-if="copied" class="size-3.5" />
<Copy v-else class="size-3.5" />
<span>{{ copied ? "已复制" : "复制" }}</span>
</Button>
</CardAction>
</CardHeader>
<CardContent>
<pre
class="max-h-120 overflow-auto rounded-2xl bg-muted p-4 text-xs leading-5 text-muted-foreground"
><code>{{ configText }}</code>
</pre>
</CardContent>
</Card>
</template>