110 lines
2.4 KiB
Vue
110 lines
2.4 KiB
Vue
<script lang="ts" setup>
|
|
import { toTypedSchema } from '@vee-validate/zod'
|
|
import { useForm } from 'vee-validate'
|
|
import { toast } from 'vue-sonner'
|
|
import { z } from 'zod'
|
|
|
|
const route = useRoute()
|
|
const router = useRouter()
|
|
|
|
const historyStore = useLlmHistories('course-std-design')
|
|
const { conversations } = storeToRefs(historyStore)
|
|
const {
|
|
updateConversation,
|
|
appendChunkToLast,
|
|
isConversationExist
|
|
} = historyStore
|
|
|
|
const activeConversationId = ref<string | null>(null)
|
|
|
|
watch(activeConversationId, (val) => {
|
|
if (val) {
|
|
router.replace({
|
|
query: {
|
|
fn: route.query.fn,
|
|
conversationId: val,
|
|
},
|
|
})
|
|
} else {
|
|
router.replace({
|
|
query: {
|
|
fn: route.query.fn,
|
|
},
|
|
})
|
|
}
|
|
})
|
|
|
|
onMounted(() => {
|
|
if (route.query.conversationId) {
|
|
if (isConversationExist(route.query.conversationId as string)) {
|
|
activeConversationId.value = route.query.conversationId as string
|
|
} else {
|
|
activeConversationId.value = null
|
|
toast.error('会话不存在')
|
|
}
|
|
}
|
|
})
|
|
|
|
const schema = z.object({
|
|
query: z.string().describe('课程名称'),
|
|
})
|
|
|
|
const form = useForm({
|
|
validationSchema: toTypedSchema(schema),
|
|
})
|
|
|
|
const onSubmit = (values: z.infer<typeof schema>) => {
|
|
http_stream(
|
|
'/ai/course-standard/stream',
|
|
{
|
|
query: values.query,
|
|
},
|
|
{
|
|
onStart(id, created_at) {
|
|
activeConversationId.value = id
|
|
updateConversation(id, {
|
|
id,
|
|
created_at,
|
|
title: values.query,
|
|
messages: [
|
|
{
|
|
role: 'user',
|
|
content: `*生成一份 ${values.query} 的课程标准*`,
|
|
},
|
|
{
|
|
role: 'assistant',
|
|
content: '',
|
|
},
|
|
],
|
|
})
|
|
},
|
|
onTextChunk: (chunk) => {
|
|
appendChunkToLast(activeConversationId.value!, chunk)
|
|
},
|
|
onComplete: (id, finished_at) => {
|
|
updateConversation(id!, {
|
|
finished_at,
|
|
})
|
|
},
|
|
},
|
|
)
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div>
|
|
<AiConversation
|
|
:form
|
|
:form-schema="schema"
|
|
:conversations
|
|
:active-conversation-id="activeConversationId"
|
|
disable-user-input
|
|
@submit="onSubmit"
|
|
@update:conversation-id="activeConversationId = $event"
|
|
@delete-conversation="historyStore.removeConversation($event)"
|
|
/>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped></style>
|