feat(agent): 新增智能体应用功能
- 添加智能体列表页面和相关API - 实现聊天功能,包括历史对话和当前对话 - 新增工作流功能,包括表单提交和结果展示- 优化路由配置,增加智能体相关路由 - 添加全局常量和枚举,用于智能体类型区分
This commit is contained in:
@ -1,5 +1,105 @@
|
||||
<template>
|
||||
<div>测试2</div>
|
||||
<div class="chat-wrap">
|
||||
<span class="span-back"> <icon-left /> 返回空间 </span>
|
||||
<div class="chat-contain">
|
||||
<a-layout>
|
||||
<HistoryChat :cozeInfo="cozeInfo" :botId="cozeWebSDKConfig?.config?.bot_id" />
|
||||
<a-layout>
|
||||
<a-layout-content style="padding: 24px; background: #fff; min-height: 280px">
|
||||
<a-card :bordered="false">
|
||||
<div id="coze-chat-container" style="width: 100%; margin-left: 100px"></div>
|
||||
</a-card>
|
||||
</a-layout-content>
|
||||
</a-layout>
|
||||
</a-layout>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts"></script>
|
||||
<style scoped lang="scss"></style>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue';
|
||||
import { getChatAgent } from '@/api/all/agent';
|
||||
import HistoryChat from './components/HistoryChat.vue';
|
||||
import ChatBox from './components/ChatBox.vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
// 存储认证令牌
|
||||
const authToken = ref('pat_tuIM7jubM1hLXaIWzbWg1U15lBe66AlYwu9BkXMQXInh8VdPszRFTwlTPmdziHwg');
|
||||
|
||||
// 模拟从API获取token
|
||||
const fetchToken = async () => {
|
||||
// 实际开发中应替换为真实的 API 请求
|
||||
return new Promise((resolve) => {
|
||||
setTimeout(() => {
|
||||
resolve('pat_' + Math.random().toString(36).substring(2, 15));
|
||||
}, 500);
|
||||
});
|
||||
};
|
||||
|
||||
// 刷新token
|
||||
const refreshToken = async () => {
|
||||
authToken.value = await fetchToken();
|
||||
};
|
||||
|
||||
// 动态加载脚本函数
|
||||
const loadScript = (src) =>
|
||||
new Promise((resolve, reject) => {
|
||||
const script = document.createElement('script');
|
||||
script.src = src;
|
||||
script.onload = resolve;
|
||||
script.onerror = reject;
|
||||
document.head.appendChild(script);
|
||||
});
|
||||
|
||||
const route = useRoute();
|
||||
const id = route.params.id;
|
||||
const query = reactive({
|
||||
id: id,
|
||||
});
|
||||
|
||||
const cozeWebSDKConfig = reactive({
|
||||
config: {},
|
||||
auth: {},
|
||||
userInfo: {},
|
||||
ui: {},
|
||||
});
|
||||
|
||||
const cozeInfo = reactive({
|
||||
title: '',
|
||||
description: '',
|
||||
icon_url: '',
|
||||
});
|
||||
|
||||
let cozeWebSDK = null;
|
||||
const initChat = async () => {
|
||||
console.log(2323);
|
||||
const { code, data } = await getChatAgent(query.id);
|
||||
if (code != 200) {
|
||||
return false;
|
||||
}
|
||||
Object.assign(cozeWebSDKConfig, data.cozeConfig);
|
||||
Object.assign(cozeInfo, data.info);
|
||||
await loadScript('https://lf-cdn.coze.cn/obj/unpkg/flow-platform/chat-app-sdk/1.2.0-beta.10/libs/cn/index.js');
|
||||
let config = data.cozeConfig;
|
||||
config.ui.chatBot.el = document.getElementById('coze-chat-container');
|
||||
config.ui.width = '900px';
|
||||
config.auth.onRefreshToken = function () {
|
||||
return 'pat_tuIM7jubM1hLXaIWzbWg1U15lBe66AlYwu9BkXMQXInh8VdPszRFTwlTPmdziHwg';
|
||||
};
|
||||
cozeWebSDK = cozeWebSDK = new CozeWebSDK.WebChatClient(config);
|
||||
showChatPage();
|
||||
};
|
||||
|
||||
const showChatPage = () => {
|
||||
// 显示聊天页面
|
||||
console.log(cozeWebSDK, 'chatClient');
|
||||
cozeWebSDK.showChatBot();
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
initChat();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import './style.scss';
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user