feat(agent): 新增智能体应用功能

- 添加智能体列表页面和相关API
- 实现聊天功能，包括历史对话和当前对话
- 新增工作流功能，包括表单提交和结果展示- 优化路由配置，增加智能体相关路由
- 添加全局常量和枚举，用于智能体类型区分

src/views/Agent/Chat/components/CozeChat.vue

@@ -116,7 +116,6 @@ export default {
       }
     };
 
-    // 重试机制
     const retry = async () => {
       error.value = false;
       loading.value = true;
@@ -130,7 +129,6 @@ export default {
       }
     };
 
-    // 组件挂载时初始化
     onMounted(async () => {
       try {
         await loadSDK();
@@ -142,13 +140,11 @@ export default {
       }
     });
 
-    // 组件卸载时清理
     onBeforeUnmount(() => {
       if (chatClient && typeof chatClient.destroy === 'function') {
         chatClient.destroy();
       }
 
-      // 移除我们添加的脚本
       if (scriptLoaded) {
         const scripts = document.querySelectorAll('script[src*="coze.cn"]');
         scripts.forEach((script) => script.remove());

src/views/Agent/Chat/components/HistoryChat.vue

@@ -1,12 +1,13 @@
 <template>
   <a-layout-sider width="250" style="background: #fff">
-    <div class="logo" style="text-align: center; padding: 20px">
-      <img :src="props?.icon_url" alt="Logo" style="width: 100px" />
+    <div class="logo">
+      <img :src="cozeInfo?.icon_url" style="width: 100%; height: 70%" />
     </div>
     <a-menu mode="inline" theme="light">
       <a-menu-item key="1">
-        <span>舆情脉络整理</span>
-        <span style="color: #8492ff; font-size: 12px">（对话式）</span>
+        <span>{{ cozeInfo.title }}</span>
+        <span style="color: #8492ff; font-size: 12px">{{ cozeInfo.type == 1 ? '智能体' : '对话式' }}</span>
+        <span style="float: right">{{ cozeInfo.views }}次使用</span>
       </a-menu-item>
       <a-menu-item key="2">历史对话</a-menu-item>
       <a-menu-item key="3">梳理这次舆情的时间线和关键节点</a-menu-item>
@@ -20,17 +21,27 @@
 </template>
 
 <script lang="ts" setup>
-import { defineComponent } from 'vue';
+import { defineProps } from 'vue';
 
-const props = defineComponent({
-  props: {
-    info: {
-      type: Object,
-      default: {},
-    },
+const props = defineProps({
+  cozeInfo: {
+    type: Object as () => any,
+    default: () => ({}),
+  },
+  botId: {
+    type: String,
+    default: '',
   },
 });
-console.log(props.info, 'props.info');
+const getHistoryChat = async () => {
+  const { code, data } = await getHistoryChat({ botId: props.botId });
+  console.log(data, 'data');
+  // 获取历史对话
+};
+
+onMounted(() => {
+  getHistoryChat();
+});
 </script>
 
 <style scoped>

src/views/Agent/Chat/index.vue

@@ -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>

src/views/Agent/Chat/style.scss

@@ -0,0 +1,27 @@
+.chat-wrap {
+  .chat-contain {
+    font-family: Avenir, Helvetica, Arial, sans-serif;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+    color: #2c3e50;
+    margin-top: 24px;
+
+    .span-back {
+      color: var(--Text-2, #3C4043);
+      font-size: 14px;
+      font-family: Alibaba PuHuiTi;
+      font-weight: 400;
+      line-height: 62px;
+      word-wrap: break-word
+    }
+  }
+
+  .span-back {
+    color: var(--Text-2, #3C4043);
+    font-size: 14px;
+    font-family: Alibaba PuHuiTi;
+    font-weight: 400;
+    line-height: 22px;
+    word-wrap: break-word
+  }
+}