Merge branch 'master' of http://gitlab.smartai.com/zhupei/smartai2dian0

public/i18n/lang-en.json

@@ -87,6 +87,7 @@
     "history_month": "This month",
     "history_earlier": "Earlier",
     "history_loadmore": "Load more",
+    "history_nomore": "No more",
     "history_empty": "Empty"
   }
 }

public/i18n/lang-zh.json

@@ -87,6 +87,7 @@
     "history_month": "本月",
     "history_earlier": "更早以前",
     "history_loadmore": "加载更多",
+    "history_nomore": "没有更多了",
     "history_empty": "暂无数据"
   }
 }

src/base/store/use-all-agents.js

@@ -0,0 +1,27 @@
+import { defineStore } from 'pinia';
+import { jsonStringify, jsonParse } from '../../utils/utils';
+
+/**
+ * 系统所有可用的agents列表
+ */
+export const useAllAgentStore = defineStore('all_agents', {
+  state: () => {
+    return {
+      agents: []
+    };
+  },
+  actions: {
+    /**
+     * 获取所有的记录
+     * @returns
+     */
+    getList() {
+      return this.agents;
+    },
+    setList(arr) {
+      const list = jsonParse(jsonStringify(arr));
+
+      this.agents = list;
+    }
+  }
+});

src/modules/conversation-board/BoardAgentItem.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="conversation-agent-item">
-    <div class="agent-item-icon"></div>
+    <div class="agent-item-icon" @click="handleClick"></div>
 
-    <div class="agent-item-intro">
+    <div class="agent-item-intro" @click="handleClick">
       <div class="agent-item-intro-title">{{ title }}</div>
       <div class="agent-item-intro-desc">{{ desc }}</div>
     </div>
@@ -12,8 +12,15 @@
 <script setup>
 const props = defineProps({
   title: String,
-  desc: String
+  desc: String,
+  id: String
 });
+
+const emit = defineEmits(['active']);
+
+const handleClick = () => {
+  emit('active', props.id);
+};
 </script>
 
 <style lang="css" scoped>
@@ -35,9 +42,12 @@ const props = defineProps({
   border-radius: 18px;
 
   margin-right: 5px;
+
+  cursor: pointer;
 }
 
 .agent-item-intro {
+  cursor: pointer;
 }
 
 .agent-item-intro-title {

src/modules/conversation-board/BoardAgentList.vue

@@ -1,62 +1,79 @@
 <template>
   <div class="conversation-agent-list">
-    <BoardAgentItem v-for="(item, index) of list" :key="index" :title="item.title" :desc="item.desc" />
+    <BoardAgentItem
+      v-for="(item, index) of list"
+      :key="index"
+      :title="item.name"
+      :desc="item.type"
+      :id="item.id"
+      @active="handleActive"
+    />
   </div>
 </template>
 
 <script setup>
 import BoardAgentItem from './BoardAgentItem.vue';
 
-const list = [
-  {
-    title: '智能问答',
-    desc: '你说一句话，我写万字长文'
-  },
-  {
-    title: '智能客服',
-    desc: '你说一句话，我写万字长文'
-  },
-  {
-    title: '出题组卷',
-    desc: '你说一句话，我写万字长文'
-  },
-  {
-    title: '以文生图',
-    desc: '你说一句话，我写万字长文'
-  },
-  {
-    title: '数据分析',
-    desc: '你说一句话，我写万字长文'
-  },
-  {
-    title: '报告自动生成',
-    desc: '你说一句话，我写万字长文'
-  },
-  {
-    title: '智能问答',
-    desc: '你说一句话，我写万字长文'
-  },
-  {
-    title: '文档创作',
-    desc: '你说一句话，我写万字长文'
-  },
-  {
-    title: '设备检测',
-    desc: '你说一句话，我写万字长文'
-  },
-  {
-    title: '智能客服',
-    desc: '你说一句话，我写万字长文'
-  },
-  {
-    title: '以文生图',
-    desc: '你说一句话，我写万字长文'
-  },
-  {
-    title: '出题组卷',
-    desc: '你说一句话，我写万字长文'
-  }
-];
+const props = defineProps({
+  list: Array
+});
+
+const emit = defineEmits(['itemActive']);
+
+// const list = [
+//   {
+//     title: '智能问答',
+//     desc: '你说一句话，我写万字长文'
+//   },
+//   {
+//     title: '智能客服',
+//     desc: '你说一句话，我写万字长文'
+//   },
+//   {
+//     title: '出题组卷',
+//     desc: '你说一句话，我写万字长文'
+//   },
+//   {
+//     title: '以文生图',
+//     desc: '你说一句话，我写万字长文'
+//   },
+//   {
+//     title: '数据分析',
+//     desc: '你说一句话，我写万字长文'
+//   },
+//   {
+//     title: '报告自动生成',
+//     desc: '你说一句话，我写万字长文'
+//   },
+//   {
+//     title: '智能问答',
+//     desc: '你说一句话，我写万字长文'
+//   },
+//   {
+//     title: '文档创作',
+//     desc: '你说一句话，我写万字长文'
+//   },
+//   {
+//     title: '设备检测',
+//     desc: '你说一句话，我写万字长文'
+//   },
+//   {
+//     title: '智能客服',
+//     desc: '你说一句话，我写万字长文'
+//   },
+//   {
+//     title: '以文生图',
+//     desc: '你说一句话，我写万字长文'
+//   },
+//   {
+//     title: '出题组卷',
+//     desc: '你说一句话，我写万字长文'
+//   }
+// ];
+
+const handleActive = (target_id) => {
+  emit('itemActive', target_id);
+};
 </script>
 
 <style lang="css" scoped>

src/modules/conversation-board/BoardTags.vue

@@ -4,12 +4,6 @@
     <div class="board-tag" @click="handleClick"><span>会话</span></div>
     <div class="board-tag" @click="handleClick"><span>知识库管理</span></div>
     <div class="board-tag" @click="handleClick"><span>AI会话</span></div>
-
-    <!-- <a-space>
-      <a-tag>Default</a-tag>
-      <a-tag>Tag 1</a-tag>
-      <a-tag>Tag 2</a-tag>
-    </a-space> -->
   </div>
 </template>
 
@@ -30,5 +24,18 @@ const handleClick = (type) => {
 }
 
 .conversation-board-tags .board-tag {
+  margin-left: 5px;
+  margin-right: 5px;
+
+  cursor: pointer;
+
+  padding: 10px;
+  padding-left: 16px;
+  padding-right: 16px;
+
+  border-radius: 8px;
+
+  background-color: var(--color-bg-1);
+  color: var(--color-text-1);
 }
 </style>

src/modules/conversation-board/api-conversation-board.js

@@ -1,6 +1,81 @@
 import { jsonStringify } from '../../utils/utils';
 
+const res_list_example = {
+  code: 200,
+  msg: '',
+  data: [
+    {
+      id: '94873c72-d194-4306-a965-286affe426bf',
+      name: '报告生成',
+      agent_type: 2,
+      type: 'report'
+    },
+    {
+      id: 'basic_excel_merge',
+      name: '报表合并',
+      agent_type: 3,
+      type: 'excelMerge'
+    },
+    {
+      id: '42e4fcdc9bea11efac300242ac160006',
+      name: '知识问答',
+      agent_type: 1,
+      type: 'knowledgeQA'
+    },
+    {
+      id: 'c684bab4-f05b-423e-8727-f50497e73ebf',
+      name: '文档智能',
+      agent_type: 2,
+      type: 'report'
+    },
+    {
+      id: '90d533729c0211efbf6b0242ac160006',
+      name: '智能问答',
+      agent_type: 1,
+      type: 'chat'
+    },
+    {
+      id: 'basic_excel_talk',
+      name: '智能数据',
+      agent_type: 3,
+      type: 'excelTalk'
+    },
+    {
+      id: 'basic_question_talk',
+      name: '出题组卷',
+      agent_type: 3,
+      type: 'questionTalk'
+    },
+    {
+      id: '9d75142a-66eb-4e23-b7d4-03efe4584915',
+      name: '小数绘图',
+      agent_type: 4,
+      type: 'imageTalk'
+    },
+    {
+      id: 'basic_paper_talk',
+      name: '文档出卷',
+      agent_type: 3,
+      type: 'paperTalk'
+    },
+    {
+      id: 'basic_report_clean',
+      name: '文档报告',
+      agent_type: 4,
+      type: 'reportWorkflow'
+    }
+  ]
+};
+
 /**
  * 获取所有对话可用的智能体
  */
-export const conversationBoardList = () => {};
+export const conversationBoardList = () => {
+  // http://192.168.20.119:9301/api/agent/list
+
+  return new Promise((resolve, reject) => {
+    setTimeout(() => {
+      resolve(res_list_example);
+    }, 1000);
+  });
+};

src/modules/conversation-chat/ChatName.vue

@@ -1,21 +0,0 @@
-<template>
-  <div class="conversation-history-title">
-    <div>{{ $t('conversation.chat_history') }}</div>
-  </div>
-</template>
-
-<script setup></script>
-
-<style lang="css" scoped>
-.conversation-history-title {
-  margin-top: 30px;
-  margin-bottom: 30px;
-
-  text-align: center;
-
-  font-size: 32px;
-  font-weight: bold;
-
-  color: var(--color-text-1);
-}
-</style>

src/modules/conversation-chat/DialogAsideLeft.vue

@@ -0,0 +1,21 @@
+<template>
+  <div class="dialog-aside-left">
+    <div>对话左侧边栏</div>
+  </div>
+</template>
+
+<script setup></script>
+
+<style lang="css" scoped>
+.dialog-aside-left {
+  /* margin-top: 30px;
+  margin-bottom: 30px; */
+
+  /* text-align: center; */
+
+  /* font-size: 32px;
+  font-weight: bold; */
+
+  color: var(--color-text-1);
+}
+</style>

src/modules/conversation-chat/DialogAsideRight.vue

@@ -0,0 +1,21 @@
+<template>
+  <div class="dialog-aside-right">
+    <div>对话右侧边栏</div>
+  </div>
+</template>
+
+<script setup></script>
+
+<style lang="css" scoped>
+.dialog-aside-right {
+  /* margin-top: 30px;
+  margin-bottom: 30px;
+
+  text-align: center; */
+
+  /* font-size: 32px;
+  font-weight: bold; */
+
+  color: var(--color-text-1);
+}
+</style>

src/modules/conversation-chat/DialogFooter.vue

@@ -0,0 +1,21 @@
+<template>
+  <div class="dialog-footer">
+    <div>对话底部</div>
+  </div>
+</template>
+
+<script setup></script>
+
+<style lang="css" scoped>
+.dialog-footer {
+  /* margin-top: 30px;
+  margin-bottom: 30px; */
+
+  text-align: center;
+
+  /* font-size: 32px;
+  font-weight: bold; */
+
+  color: var(--color-text-1);
+}
+</style>

src/modules/conversation-chat/DialogHeader.vue

@@ -0,0 +1,18 @@
+<template>
+  <div class="dialog-header">
+    <div>对话顶部</div>
+  </div>
+</template>
+
+<script setup></script>
+
+<style lang="css" scoped>
+.dialog-header {
+  /* margin-top: 30px;
+  margin-bottom: 30px; */
+
+  text-align: center;
+
+  color: var(--color-text-1);
+}
+</style>

src/modules/conversation-chat/DialogInput.vue

@@ -0,0 +1,21 @@
+<template>
+  <div class="dialog-input">
+    <div>会话输入组件</div>
+  </div>
+</template>
+
+<script setup></script>
+
+<style lang="css" scoped>
+.dialog-input {
+  /* margin-top: 30px;
+  margin-bottom: 30px; */
+
+  /* text-align: center; */
+
+  /* font-size: 32px;
+  font-weight: bold; */
+
+  color: var(--color-text-1);
+}
+</style>

src/modules/conversation-chat/DialogItem.vue

@@ -0,0 +1,18 @@
+<template>
+  <div class="dialog-item">
+    <div>对话的每一项</div>
+  </div>
+</template>
+
+<script setup></script>
+
+<style lang="css" scoped>
+.dialog-item {
+  margin-top: 30px;
+  margin-bottom: 30px;
+
+  /* text-align: center; */
+
+  color: var(--color-text-1);
+}
+</style>

src/modules/conversation-chat/DialogList.vue

@@ -0,0 +1,41 @@
+<template>
+  <div class="dialog-list">
+    <DialogItem />
+
+    <DialogItem />
+
+    <DialogItem />
+
+    <DialogItem />
+    <DialogItem />
+    <DialogItem />
+    <DialogItem />
+    <DialogItem />
+    <DialogItem />
+    <DialogItem />
+    <DialogItem />
+    <DialogItem />
+    <DialogItem />
+    <DialogItem />
+    <DialogItem />
+    <DialogItem />
+    <DialogItem />
+    <DialogItem />
+    <DialogItem />
+  </div>
+</template>
+
+<script setup>
+import DialogItem from './DialogItem.vue';
+</script>
+
+<style lang="css" scoped>
+.dialog-list {
+  /* margin-top: 30px;
+  margin-bottom: 30px; */
+
+  /* text-align: center; */
+
+  color: var(--color-text-1);
+}
+</style>

src/modules/conversation-dialog/api-dialog.js

@@ -0,0 +1,4 @@
+/**
+ * 获取会话历史记录，来自于小数系统
+ * http://192.168.20.119:9301/api/agent/90d533729c0211efbf6b0242ac160006/sessions
+ */

src/modules/conversation-dialog/example-api-agent-sessions.json

@@ -0,0 +1,18 @@
+{
+  "code": 200,
+  "msg": "",
+  "data": [
+    {
+      "id": "a7d63ccf38fe4d3d958aa202482d54c3",
+      "updated_time": 1732857994295,
+      "update_date": "2024-11-29 13:26:34",
+      "name": "什么情况啊"
+    },
+    {
+      "id": "5b50f408cbe5449da3ec8b3bff226442",
+      "updated_time": 1732176887294,
+      "update_date": "2024-11-21 16:14:47",
+      "name": "你好"
+    }
+  ]
+}

src/modules/conversation-history/HistoryItem.vue

@@ -7,11 +7,11 @@
     }}</template>
   </div>
 
-  <div v-if="show_current_item" :class="item_klass" @click="handleClick">
-    <div class="history-item-icon"></div>
+  <div v-if="show_current_item" :class="item_klass">
+    <div class="history-item-icon" @click="handleClick"></div>
 
     <div class="history-item-intro">
-      <div class="history-item-intro-title">{{ history.name }}</div>
+      <div class="history-item-intro-title" @click="handleClick">{{ history.name }}</div>
     </div>
 
     <div class="history-item-actions">
@@ -125,6 +125,7 @@ const time_display = computed(() => {
  * 分发ID值
  */
 const handleClick = () => {
+  console.log('点击一下');
   emit('active', props.history.id);
 };
 
@@ -170,6 +171,9 @@ const handleDeleteSuccess = () => {
   border-radius: 18px;
 
   margin-right: 5px;
+  cursor: pointer;
+
+  flex-shrink: 0;
 }
 
 .history-item-intro {
@@ -182,6 +186,8 @@ const handleDeleteSuccess = () => {
   font-size: 18px;
   font-weight: bold;
 
+  cursor: pointer;
+
   /* margin-bottom: 8px; */
 }
 
@@ -199,6 +205,9 @@ const handleDeleteSuccess = () => {
 }
 
 .history-item-actions {
+  min-width: 60px;
+  flex-shrink: 0;
+  text-align: center;
 }
 .history-item-time {
 }

src/modules/conversation-history/HistoryList.vue

@@ -10,7 +10,7 @@
         @delete="handleItemDelete"
       />
 
-      <HistoryLoadMore @loadmore="handleLoadMore" />
+      <HistoryLoadMore :can_loadmore="can_loadmore" @loadmore="handleLoadMore" />
     </div>
   </div>
 </template>

src/modules/conversation-history/HistoryLoadMore.vue

@@ -1,6 +1,7 @@
 <template>
   <div :class="item_klass" @click="handleClick">
-    <div class="history-item-icon">{{ $t('conversation.history_loadmore') }}</div>
+    <div class="history-item-icon can-loadmore" v-if="can_loadmore">{{ $t('conversation.history_loadmore') }}</div>
+    <div class="history-item-icon" v-if="!can_loadmore">{{ $t('conversation.history_nomore') }}</div>
   </div>
 </template>
 
@@ -8,8 +9,7 @@
 import { computed } from 'vue';
 
 const props = defineProps({
-  history: Object,
-  index: Number
+  can_loadmore: Boolean
 });
 
 const emit = defineEmits(['loadmore']);
@@ -29,6 +29,10 @@ const item_klass = computed(() => {
  * 分发ID值
  */
 const handleClick = () => {
+  if (!props.can_loadmore) {
+    return;
+  }
+
   emit('loadmore');
 };
 </script>
@@ -46,7 +50,9 @@ const handleClick = () => {
   display: flex;
   justify-content: center;
   align-items: center;
+}
 
+.history-item-icon.can-loadmore {
   cursor: pointer;
 }
 </style>

src/modules/conversation-history/HistorySearchInput.vue

@@ -1,7 +1,9 @@
 <template>
   <div class="conversation-search-input">
     <div class="search-input-content">
-      <div class="search-input-icon">
+      <slot></slot>
+
+      <div class="search-input-icon icon-search">
         <icon-search />
       </div>
 
@@ -101,6 +103,9 @@ const handleInputClear = () => {
   width: 26px;
   height: 26px;
 }
+.search-input-icon.icon-search {
+  margin-left: 5px;
+}
 
 .search-input-container {
   flex-grow: 1;
@@ -118,6 +123,7 @@ const handleInputClear = () => {
 
   caret-color: var(--color-text-1);
   background-color: var(--color-bg-1);
+  color: var(--color-text-1);
 }
 
 .search-input-icon.icon-clear {

src/modules/conversation-history/HistoryTypeDropdown.vue

@@ -0,0 +1,129 @@
+<template>
+  <a-dropdown trigger="hover">
+    <a-button v-if="api_status === 1" type="text">{{ btn_label }}</a-button>
+    <a-button v-if="api_status === 2" type="text"><a-spin :size="16" /></a-button>
+    <a-button v-if="api_status === 3" type="text">{{ btn_label }}</a-button>
+
+    <template #content>
+      <a-doption
+        v-for="(item, index) of list_agents"
+        :key="item.id"
+        :disabled="disabled_options"
+        @click="handleOptionClick(item)"
+        >{{ item.name }}</a-doption
+      >
+    </template>
+  </a-dropdown>
+</template>
+
+<script setup>
+import { ref, computed, onMounted } from 'vue';
+import { conversationBoardList } from '../conversation-board/api-conversation-board';
+
+import { useAllAgentStore } from '../../base/store/use-all-agents';
+
+const props = defineProps({
+  /**
+   * api状态
+   * 如果状态值为2，则不允许切换
+   */
+  api_status: Number
+});
+
+const btn_label = ref('');
+
+// api请求的状态
+const api_status = ref(1); // api状态 1 请求未启动 2 请求进心中 3 请求已成功 4 请求失败（网络成功，但是code不等于200） 5 请求出错
+const api_message = ref(''); // 请求消息 与 api_status 对应的 message 消息内容
+
+// 历史记录列表数据
+const list_agents = ref([]); // 历史记录的列表数据
+
+const emit = defineEmits(['typeSelected']);
+
+const allAgents = useAllAgentStore();
+
+/**
+ * 是否禁用下拉菜单
+ * 当列表正在加载时，应该禁用下拉菜单
+ */
+const disabled_options = computed(() => {
+  return props.api_status === 2;
+});
+
+const handleOptionClick = (item) => {
+  handleChatTypeConfirm(item);
+};
+
+/**
+ * 已经确定类型
+ */
+const handleChatTypeConfirm = (item) => {
+  btn_label.value = item.name;
+
+  emit('typeSelected', item);
+};
+
+/**
+ * 处理请求参数
+ */
+const formatListOptions = () => {
+  return {};
+};
+
+/**
+ * 调用api请求
+ */
+const handleApiRequest = () => {
+  // TODO: 从本地store中获取，而非api
+  // 否则每次进入此页面，都需要调用接口
+  const cache_agents = allAgents.agents;
+  if (cache_agents.length !== 0) {
+    handleChatTypeConfirm(cache_agents[0]);
+    list_agents.value = cache_agents;
+    return;
+  }
+
+  // 处理查询参数
+  const opts = formatListOptions();
+
+  // 进入加载状态
+  api_status.value = 2;
+  api_message.value = '';
+  conversationBoardList(opts)
+    .then((res) => {
+      if (res.code / 1 === 200) {
+        // 成功
+        const res_list = res.data; // 历史记录列表
+        if (res_list.length !== 0) {
+          handleChatTypeConfirm(res_list[0]);
+        }
+
+        list_agents.value = res_list;
+        // 在store中缓存数据
+        allAgents.setList(res_list);
+
+        // api请求成功
+        api_status.value = 3;
+        api_message.value = 'success';
+      } else {
+        // api请求成功，但是业务失败
+        api_status.value = 4;
+        api_message.value = err.message;
+      }
+    })
+    .catch((err) => {
+      console.log(err);
+      // api请求出错
+      api_status.value = 5;
+      api_message.value = err.msg;
+    });
+};
+
+onMounted(() => {
+  // 调用api
+  handleApiRequest();
+});
+</script>
+
+<style lang="css" scoped></style>

src/modules/conversation-history/api-conversation-history.js

@@ -1,3 +1,4 @@
+import ajax from '../../base/ajax';
 import { jsonStringify } from '../../utils/utils';
 
 /**
@@ -5,473 +6,43 @@ import { jsonStringify } from '../../utils/utils';
  * 可以进入 http://192.168.20.116:8103/#/sessionManager 项目（以 admin/000000 登录），查看相关请求
  * 示例链接1（普通列表）：http://192.168.20.116:8103/api/conversation/list?modeltype=localragflow&dialogid=&page=1&per_page=50
  * 示例链接2（搜索）: http://192.168.20.116:8103/api/conversation/list?modeltype=localragflow&search=%E5%A6%82%E4%BD%95&dialogid=&page=1&per_page=50
+ * 注意：示例链接已经废弃
+ * 改为 同 小数 会话历史记录同接口
  * @param {object} params
  * @param {string} params.modeltype - 模型ID，例如：localragflow
  * @param {string} params.dailogid - 会话ID
+ * @param {string} params.agent_id - 智能体的ID
  * @param {string} params.search - 搜索字符串
  * @param {number} params.page - 当前页码，从1开始
  * @param {number} params.per_page - 每页返回的数量
  */
 export const apiConversationHistoryList = (params) => {
-  const url = '/api/conversation/list';
+  // http://192.168.20.119:9301/api/agent/90d533729c0211efbf6b0242ac160006/sessions
 
-  return new Promise((resolve, reject) => {
-    setTimeout(() => {
-      const example_data = {
-        code: 200,
-        data: [
-          {
-            app_type: 1,
-            base: null,
-            create_date: 'Mon, 09 Dec 2024 06:09:32 GMT',
-            create_time: 1733724572892,
-            dialog_id: '7f0e55765afb11ef8d760242ac120006',
-            icon: '',
-            id: '288f9882b5f411efa2ac0242ac120005',
-            name: '\u5982\u4f55\u521b\u5efa\u65b0\u4f1a\u8bdd\u554a',
-            update_date: 'Mon, 09 Dec 2024 06:10:23 GMT',
-            update_time: 1733724623307,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            app_type: 1,
-            base: null,
-            create_date: 'Mon, 09 Dec 2024 06:02:03 GMT',
-            create_time: 1733724123753,
-            dialog_id: '7f0e55765afb11ef8d760242ac120006',
-            icon: '',
-            id: '1cda5a14b5f311efa2640242ac120005',
-            name: 'helloworld',
-            update_date: 'Mon, 09 Dec 2024 06:02:16 GMT',
-            update_time: 1733724136628,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            app_type: 1,
-            base: null,
-            create_date: 'Mon, 09 Dec 2024 02:24:26 GMT',
-            create_time: 1733711066468,
-            dialog_id: '7f0e55765afb11ef8d760242ac120006',
-            icon: '',
-            id: 'b61ad1c8b5d411efb9110242ac120005',
-            name: '\u672a\u547d\u540d\u4f1a\u8bdd',
-            update_date: 'Mon, 09 Dec 2024 02:24:26 GMT',
-            update_time: 1733711066468,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            app_type: 1,
-            base: null,
-            create_date: 'Fri, 06 Dec 2024 03:03:10 GMT',
-            create_time: 1733454190054,
-            dialog_id: '7f0e55765afb11ef8d760242ac120006',
-            icon: '',
-            id: '9fd4a978b37e11ef8ed30242ac120005',
-            name: '\u8fd9\u4e2a\u662f\u4ec0\u4e48\u5462\uff1f',
-            update_date: 'Fri, 06 Dec 2024 03:03:15 GMT',
-            update_time: 1733454195834,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            app_type: 1,
-            base: null,
-            create_date: 'Fri, 06 Dec 2024 02:30:38 GMT',
-            create_time: 1733452238535,
-            dialog_id: 'c6ba4a9e6e9011efae8d0242ac120006',
-            icon: '',
-            id: '14a27690b37a11efa1f90242ac120005',
-            name: '\u548c222211\u7684\u4f1a\u8bdd',
-            update_date: 'Fri, 06 Dec 2024 02:30:38 GMT',
-            update_time: 1733452238535,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            app_type: 2,
-            base: 'agent',
-            create_date: 'Fri, 22 Nov 2024 10:15:45 GMT',
-            create_time: 1732270545507,
-            dialog_id: 'c2d412e6593f11ef8e8f0242ac120006',
-            icon: null,
-            id: 'bcb3584ca8ba11ef8a3f0242ac110003',
-            name: '\u51fa\u9898\u52a9\u624b',
-            update_date: 'Mon, 09 Dec 2024 06:11:29 GMT',
-            update_time: 1732270545507,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            app_type: 2,
-            base: 'agent',
-            create_date: 'Fri, 22 Nov 2024 10:15:44 GMT',
-            create_time: 1732270544079,
-            dialog_id: '156a7c7c5a1011efa5e20242ac120006',
-            icon: null,
-            id: 'bbd96416a8ba11ef8b630242ac110003',
-            name: '\u6570\u636e\u5206\u6790\u52a9\u624b',
-            update_date: 'Fri, 22 Nov 2024 10:15:44 GMT',
-            update_time: 1732270544079,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            app_type: 2,
-            base: 'agent',
-            create_date: 'Fri, 22 Nov 2024 10:15:43 GMT',
-            create_time: 1732270543168,
-            dialog_id: 'ecbce4145aac11ef81400242ac120006',
-            icon: null,
-            id: 'bb4e7e5aa8ba11efa1350242ac110003',
-            name: '\u5ba1\u8ba1\u6570\u636e',
-            update_date: 'Fri, 22 Nov 2024 10:15:43 GMT',
-            update_time: 1732270543168,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            base: 'advanced-agent',
-            create_date: 'Fri, 22 Nov 2024 09:49:07 GMT',
-            create_time: 1732268947130,
-            dialog_id: 'excel_talk',
-            id: '03ffc4c8a8b711ef8d4d0242ac110003',
-            name: '\u53d1\u7535\u6237\u57fa\u672c\u4fe1\u606f\u8868_dwd_cst_yhjbxxb_hbsj',
-            update_date: 'Fri, 22 Nov 2024 09:49:07 GMT',
-            update_time: 1732268947135,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            app_type: 1,
-            base: null,
-            create_date: 'Fri, 22 Nov 2024 09:48:55 GMT',
-            create_time: 1732268935828,
-            dialog_id: '7f0e55765afb11ef8d760242ac120006',
-            icon: '',
-            id: 'fd4268d4a8b611efb6070242ac120005',
-            name: 'nihao',
-            update_date: 'Fri, 22 Nov 2024 09:48:57 GMT',
-            update_time: 1732268937177,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            app_type: 1,
-            base: null,
-            create_date: 'Fri, 22 Nov 2024 09:43:06 GMT',
-            create_time: 1732268586505,
-            dialog_id: '7f0e55765afb11ef8d760242ac120006',
-            icon: '',
-            id: '2d0c1318a8b611efb8820242ac120005',
-            name: 'New conversation',
-            update_date: 'Fri, 22 Nov 2024 09:43:06 GMT',
-            update_time: 1732268586505,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            base: 'advanced-agent',
-            create_date: 'Fri, 22 Nov 2024 09:42:54 GMT',
-            create_time: 1732268574367,
-            dialog_id: 'adaf49d0a61e11ef9b9a0242ac110002',
-            id: '25d0ba04a8b611ef9a040242ac110003',
-            name: 'DLX\u516c\u53f8\u73b0\u91d1\u6d41\u91cf\u8868',
-            update_date: 'Fri, 22 Nov 2024 09:43:06 GMT',
-            update_time: 1732268574372,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            app_type: 2,
-            base: 'agent',
-            create_date: 'Fri, 22 Nov 2024 09:02:22 GMT',
-            create_time: 1732266142925,
-            dialog_id: 'ecbce4145aac11ef81400242ac120006',
-            icon: null,
-            id: '7c8ebd60a8b011efb0370242ac110003',
-            name: '\u5ba1\u8ba1\u6570\u636e',
-            update_date: 'Fri, 22 Nov 2024 09:02:22 GMT',
-            update_time: 1732266142925,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            base: 'advanced-agent',
-            create_date: 'Fri, 22 Nov 2024 04:17:30 GMT',
-            create_time: 1732249050941,
-            dialog_id: 'excel_talk',
-            id: 'b0f281f4a88811efa0b00242ac110003',
-            name: '\u7528\u6237\u4f4e\u7535\u538b\u660e\u7ec6_dwd_grid_yx_llxs_rvm_userlowerdetail_aly',
-            update_date: 'Fri, 22 Nov 2024 04:17:30 GMT',
-            update_time: 1732249050947,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            base: 'advanced-agent',
-            create_date: 'Fri, 22 Nov 2024 03:48:40 GMT',
-            create_time: 1732247320377,
-            dialog_id: 'excel_talk',
-            id: 'a973376aa88411efa3700242ac110003',
-            name: '\u7528\u6237\u4f4e\u7535\u538b\u660e\u7ec6_dwd_grid_yx_llxs_rvm_userlowerdetail_aly',
-            update_date: 'Fri, 22 Nov 2024 03:48:40 GMT',
-            update_time: 1732247320382,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            base: 'advanced-agent',
-            create_date: 'Fri, 22 Nov 2024 03:45:36 GMT',
-            create_time: 1732247136573,
-            dialog_id: 'excel_talk',
-            id: '3be4f134a88411efb4930242ac110003',
-            name: '\u7528\u6237\u4f4e\u7535\u538b\u660e\u7ec6_dwd_grid_yx_llxs_rvm_userlowerdetail_aly',
-            update_date: 'Fri, 22 Nov 2024 03:45:36 GMT',
-            update_time: 1732247136578,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            app_type: 1,
-            base: null,
-            create_date: 'Thu, 21 Nov 2024 06:50:34 GMT',
-            create_time: 1732171834116,
-            dialog_id: '7f0e55765afb11ef8d760242ac120006',
-            icon: '',
-            id: 'e82101c8a7d411ef85190242ac120006',
-            name: 'nihao',
-            update_date: 'Thu, 21 Nov 2024 06:50:36 GMT',
-            update_time: 1732171836228,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            app_type: 2,
-            base: 'agent',
-            create_date: 'Wed, 20 Nov 2024 09:28:52 GMT',
-            create_time: 1732094932163,
-            dialog_id: 'ecbce4145aac11ef81400242ac120006',
-            icon: null,
-            id: 'dafda450a72111efabb10242ac110003',
-            name: '\u5ba1\u8ba1\u6570\u636e',
-            update_date: 'Wed, 20 Nov 2024 09:28:52 GMT',
-            update_time: 1732094932163,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            app_type: 2,
-            base: 'agent',
-            create_date: 'Wed, 20 Nov 2024 09:28:45 GMT',
-            create_time: 1732094925535,
-            dialog_id: '156a7c7c5a1011efa5e20242ac120006',
-            icon: null,
-            id: 'd70a3dcca72111ef8d420242ac110003',
-            name: '\u6570\u636e\u5206\u6790\u52a9\u624b',
-            update_date: 'Wed, 20 Nov 2024 09:28:45 GMT',
-            update_time: 1732094925535,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            base: 'advanced-agent',
-            create_date: 'Wed, 20 Nov 2024 09:27:49 GMT',
-            create_time: 1732094869144,
-            dialog_id: 'excel_talk',
-            id: 'b56f42fca72111efbcf00242ac110003',
-            name: 'AMA\u516c\u53f8\u635f\u76ca\u8868',
-            update_date: 'Wed, 20 Nov 2024 09:27:49 GMT',
-            update_time: 1732094869150,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            base: 'advanced-agent',
-            create_date: 'Wed, 20 Nov 2024 09:24:33 GMT',
-            create_time: 1732094673910,
-            dialog_id: 'excel_talk',
-            id: '4110b8c8a72111ef824c0242ac110003',
-            name: 'AMA\u516c\u53f8\u635f\u76ca\u8868',
-            update_date: 'Wed, 20 Nov 2024 09:24:33 GMT',
-            update_time: 1732094673915,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            app_type: 1,
-            base: null,
-            create_date: 'Wed, 20 Nov 2024 09:05:24 GMT',
-            create_time: 1732093524507,
-            dialog_id: '7f0e55765afb11ef8d760242ac120006',
-            icon: '',
-            id: '93f6ed8aa71e11efb57d0242ac120004',
-            name: 'New conversation',
-            update_date: 'Wed, 20 Nov 2024 09:05:24 GMT',
-            update_time: 1732093524507,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            base: 'advanced-agent',
-            create_date: 'Wed, 20 Nov 2024 09:05:19 GMT',
-            create_time: 1732093519291,
-            dialog_id: 'adaf49d0a61e11ef9b9a0242ac110002',
-            id: '90dbece0a71e11ef900b0242ac110003',
-            name: '\u5168\u56fd\u9ad8\u6821\u7edf\u8ba1',
-            update_date: 'Wed, 20 Nov 2024 09:05:24 GMT',
-            update_time: 1732093519296,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            app_type: 1,
-            base: null,
-            create_date: 'Wed, 20 Nov 2024 08:58:30 GMT',
-            create_time: 1732093110583,
-            dialog_id: '7f0e55765afb11ef8d760242ac120006',
-            icon: '',
-            id: '9d3f2bbaa71d11ef8d650242ac120004',
-            name: 'New conversation',
-            update_date: 'Wed, 20 Nov 2024 08:58:30 GMT',
-            update_time: 1732093110583,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            base: 'advanced-agent',
-            create_date: 'Wed, 20 Nov 2024 08:58:19 GMT',
-            create_time: 1732093099765,
-            dialog_id: 'adaf49d0a61e11ef9b9a0242ac110002',
-            id: '96cd60f8a71d11ef8a720242ac110003',
-            name: 'DLX\u516c\u53f8\u635f\u76ca\u8868',
-            update_date: 'Wed, 20 Nov 2024 08:58:30 GMT',
-            update_time: 1732093099770,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            base: 'advanced-agent',
-            create_date: 'Wed, 20 Nov 2024 08:41:49 GMT',
-            create_time: 1732092109779,
-            dialog_id: 'adaf49d0a61e11ef9b9a0242ac110002',
-            id: '48b9843ea71b11ef9d940242ac110003',
-            name: '\u5168\u56fd\u9ad8\u6821\u7edf\u8ba1',
-            update_date: 'Wed, 20 Nov 2024 08:41:49 GMT',
-            update_time: 1732092109784,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            base: 'advanced-agent',
-            create_date: 'Wed, 20 Nov 2024 08:40:59 GMT',
-            create_time: 1732092059406,
-            dialog_id: 'excel_talk',
-            id: '2ab32d14a71b11ef82a40242ac110003',
-            name: '\u5168\u56fd\u9ad8\u6821\u7edf\u8ba1',
-            update_date: 'Wed, 20 Nov 2024 08:40:59 GMT',
-            update_time: 1732092059411,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            base: 'advanced-agent',
-            create_date: 'Wed, 20 Nov 2024 08:40:17 GMT',
-            create_time: 1732092017765,
-            dialog_id: 'adaf49d0a61e11ef9b9a0242ac110002',
-            id: '11e15d10a71b11ef82930242ac110003',
-            name: '\u5168\u56fd\u9ad8\u6821\u7edf\u8ba1',
-            update_date: 'Wed, 20 Nov 2024 08:40:17 GMT',
-            update_time: 1732092017771,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            base: 'advanced-agent',
-            create_date: 'Wed, 20 Nov 2024 08:39:24 GMT',
-            create_time: 1732091964899,
-            dialog_id: 'adaf49d0a61e11ef9b9a0242ac110002',
-            id: 'f25e8f62a71a11ef8c330242ac110003',
-            name: 'DLX\u516c\u53f8\u73b0\u91d1\u6d41\u91cf\u8868',
-            update_date: 'Wed, 20 Nov 2024 08:39:24 GMT',
-            update_time: 1732091964904,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            app_type: 2,
-            base: 'agent',
-            create_date: 'Wed, 20 Nov 2024 08:39:04 GMT',
-            create_time: 1732091944168,
-            dialog_id: 'c2d412e6593f11ef8e8f0242ac120006',
-            icon: null,
-            id: 'e601a42aa71a11efae440242ac110003',
-            name: '\u51fa\u9898\u52a9\u624b',
-            update_date: 'Wed, 20 Nov 2024 08:39:04 GMT',
-            update_time: 1732091944168,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            base: 'advanced-agent',
-            create_date: 'Wed, 20 Nov 2024 08:37:54 GMT',
-            create_time: 1732091874097,
-            dialog_id: 'excel_talk',
-            id: 'bc3f3d64a71a11ef826a0242ac110003',
-            name: 'DLX\u516c\u53f8\u73b0\u91d1\u6d41\u91cf\u8868',
-            update_date: 'Wed, 20 Nov 2024 08:37:54 GMT',
-            update_time: 1732091874102,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            base: 'advanced-agent',
-            create_date: 'Wed, 20 Nov 2024 08:11:01 GMT',
-            create_time: 1732090261677,
-            dialog_id: 'questions_talk',
-            id: 'fb2b7046a71611ef84e90242ac110003',
-            name: '\u51fa5\u9053\u9898',
-            update_date: 'Wed, 20 Nov 2024 08:13:26 GMT',
-            update_time: 1732090261682,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            base: 'advanced-agent',
-            create_date: 'Wed, 20 Nov 2024 06:30:49 GMT',
-            create_time: 1732084249095,
-            dialog_id: '19811268a59a11efa2ae0242ac110002',
-            id: 'fb6454f0a70811efb2c80242ac110003',
-            name: '\u51fa5\u4e2a\u9009\u62e9\u9898',
-            update_date: 'Wed, 20 Nov 2024 06:30:49 GMT',
-            update_time: 1732084249101,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            app_type: 2,
-            base: 'agent',
-            create_date: 'Tue, 19 Nov 2024 12:07:32 GMT',
-            create_time: 1732018052228,
-            dialog_id: 'ecbce4145aac11ef81400242ac120006',
-            icon: null,
-            id: 'dafac428a66e11ef8ff90242ac110002',
-            name: '\u5ba1\u8ba1\u6570\u636e',
-            update_date: 'Tue, 19 Nov 2024 12:07:32 GMT',
-            update_time: 1732018052228,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            app_type: 1,
-            base: null,
-            create_date: 'Tue, 19 Nov 2024 12:07:31 GMT',
-            create_time: 1732018051474,
-            dialog_id: '4fe26a72a23a11efbb640242ac120005',
-            icon: '/api/v1/llm/Image/f9967855-7ba7-47dc-830b-e3d4e802862e.jpeg',
-            id: 'da881e96a66e11efbba30242ac120005',
-            name: '\u548c\u6d4b\u8bd501\u7684\u4f1a\u8bdd',
-            update_date: 'Tue, 19 Nov 2024 12:07:31 GMT',
-            update_time: 1732018051474,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          },
-          {
-            app_type: 1,
-            base: null,
-            create_date: 'Tue, 19 Nov 2024 10:00:36 GMT',
-            create_time: 1732010436045,
-            dialog_id: '4fe26a72a23a11efbb640242ac120005',
-            icon: '/api/v1/llm/Image/f9967855-7ba7-47dc-830b-e3d4e802862e.jpeg',
-            id: '1f61cbdca65d11ef83940242ac120005',
-            name: '\u548c\u6d4b\u8bd501\u7684\u4f1a\u8bdd',
-            update_date: 'Tue, 19 Nov 2024 10:00:36 GMT',
-            update_time: 1732010436045,
-            user_id: '9f5fbce754ac11ef8857f0d4e2e8b768'
-          }
-        ],
-        msg: 'success'
-      };
+  const agent_id = params.agent_id;
 
-      const formated_data = [];
+  if (!agent_id) {
+    return Promise.reject(new Error('前端异常：Invalid Agent ID'));
+  }
 
-      const example_list = example_data.data;
+  const request_url = `/api/agent/${agent_id}/sessions`;
 
-      resolve({
-        code: example_data.code,
-        // data: formated_data,
-        data: example_list,
-        // data: [],
-        msg: example_data.msg
-      });
-    }, 1300);
+  const send_data = {};
+
+  if ('per_page' in params) {
+    send_data.limit = params.per_page / 1;
+  }
+  if ('page' in params) {
+    send_data.page = params.page / 1;
+  }
+  if ('search' in params && params.search) {
+    send_data.keyword = params.search;
+  }
+
+  return ajax({
+    url: request_url,
+    method: 'get',
+    params: send_data
   });
 };
 

src/views/ConversationBoard.vue

@@ -3,12 +3,14 @@
     <ContentContainer :containerStyle="content_style">
       <ChatAsideMenu />
 
-      <ConversationBoardContainer />
+      <ConversationBoardContainer @agentActive="handleAgentActive" />
     </ContentContainer>
   </LayoutExperience>
 </template>
 
 <script setup>
+import { useRouter } from 'vue-router';
+
 import LayoutExperience from './layout/LayoutExperience.vue';
 import ContentContainer from './layout/ContentContainer.vue';
 
@@ -16,9 +18,21 @@ import ChatAsideMenu from './conversation/ChatAsideMenu.vue';
 
 import ConversationBoardContainer from './conversation/ConversationBoardContainer.vue';
 
+const router = useRouter();
+
 const content_style = {
   backgroundImage: 'url(../../../assets/chat/board-bg.png)',
   backgroundRepeat: 'no-repeat',
   backgroundSize: 'contain'
 };
+
+const handleAgentActive = () => {
+  router.push({
+    path: '/chat/qa',
+    query: {
+      id: 'hsjaklfja',
+      age: 18
+    }
+  });
+};
 </script>

src/views/ConversationHistory.vue

@@ -3,12 +3,14 @@
     <ContentContainer :containerStyle="content_style">
       <ChatAsideMenu />
 
-      <ConversationHistoryContainer />
+      <ConversationHistoryContainer @historyActive="handleHistoryActive" />
     </ContentContainer>
   </LayoutExperience>
 </template>
 
 <script setup>
+import { useRouter } from 'vue-router';
+
 import LayoutExperience from './layout/LayoutExperience.vue';
 import ContentContainer from './layout/ContentContainer.vue';
 
@@ -16,9 +18,20 @@ import ChatAsideMenu from './conversation/ChatAsideMenu.vue';
 
 import ConversationHistoryContainer from './conversation/ConversationHistoryContainer.vue';
 
+const router = useRouter();
+
 const content_style = {
   backgroundImage: 'url(../../../assets/chat/history-bg.png)',
   backgroundRepeat: 'no-repeat',
   backgroundSize: 'cover'
 };
+
+const handleHistoryActive = ({ target_id }) => {
+  router.push({
+    path: '/chat/qa',
+    query: {
+      id: target_id
+    }
+  });
+};
 </script>

src/views/ConversationQA.vue

@@ -3,9 +3,7 @@
     <ContentContainer>
       <ChatAsideMenu />
 
-      <ConversationChatContainer>
-        <div class="conversation-qa">会话进行中</div>
-      </ConversationChatContainer>
+      <ConversationChatContainer />
     </ContentContainer>
   </LayoutExperience>
 </template>
@@ -17,4 +15,8 @@ import ContentContainer from './layout/ContentContainer.vue';
 import ChatAsideMenu from './conversation/ChatAsideMenu.vue';
 
 import ConversationChatContainer from './conversation/ConversationChatContainer.vue';
+
+/**
+ * 处理路由参数
+ */
 </script>

src/views/common/NavItem.vue

@@ -45,7 +45,7 @@ const img_src = computed(() => {
   if (is_active.value) {
     // TODO: 如果是激活状态，应该改为 2
     // 资源目录应该添加名为 2 的图标
-    return `../../assets/${props.icon_name}-1.png`;
+    return `../../assets/${props.icon_name}-2.png`;
   } else {
     return `../../assets/${props.icon_name}-1.png`;
   }

src/views/common/PermissionDropdown.vue

@@ -8,20 +8,27 @@
       </div>
 
       <template #content>
-        <a-doption><router-link class="arco-link" to="/permission/role">{{ $t('permission.role')
-            }}</router-link></a-doption>
-        <a-doption><router-link class="arco-link" to="/permission/account">{{
-          $t('permission.account')
-            }}</router-link></a-doption>
-        <a-doption><router-link class="arco-link" to="/permission/org">{{
-          $t('permission.organization')
-            }}</router-link></a-doption>
-        <a-doption><router-link class="arco-link" to="/permission/resource">{{
-          $t('permission.resource')
-            }}</router-link></a-doption>
-        <a-doption><router-link class="arco-link" to="/permission/group">{{
-          $t('permission.group')
-            }}</router-link></a-doption>
+        <a-doption
+          ><router-link class="arco-link" to="/permission/role">{{ $t('permission.role') }}</router-link></a-doption
+        >
+        <a-doption
+          ><router-link class="arco-link" to="/permission/account">{{
+            $t('permission.account')
+          }}</router-link></a-doption
+        >
+        <a-doption
+          ><router-link class="arco-link" to="/permission/org">{{
+            $t('permission.organization')
+          }}</router-link></a-doption
+        >
+        <a-doption
+          ><router-link class="arco-link" to="/permission/resource">{{
+            $t('permission.resource')
+          }}</router-link></a-doption
+        >
+        <a-doption
+          ><router-link class="arco-link" to="/permission/group">{{ $t('permission.group') }}</router-link></a-doption
+        >
       </template>
     </a-dropdown>
   </a-space>
@@ -40,7 +47,13 @@ const route = useRoute();
 const is_active = computed(() => {
   const cur_path = route.path;
 
-  const active_list = ['/permission/role', '/permission/account', '/permission/org', '/permission/resource', '/permission/group'];
+  const active_list = [
+    '/permission/role',
+    '/permission/account',
+    '/permission/org',
+    '/permission/resource',
+    '/permission/group'
+  ];
 
   return active_list.indexOf(cur_path) >= 0;
 });
@@ -49,7 +62,7 @@ const img_src = computed(() => {
   if (is_active.value) {
     // TODO: 如果是激活状态，应该改为 2
     // 资源目录应该添加名为 2 的图标
-    return `../../assets/header-quanxian-1.png`;
+    return `../../assets/header-quanxian-2.png`;
   } else {
     return `../../assets/header-quanxian-1.png`;
   }

src/views/conversation/ConversationBoardContainer.vue

@@ -1,32 +1,152 @@
 <template>
   <div class="conversation-board-container">
-    <BoardWelcome />
+    <div class="conversation-board-left"></div>
 
-    <BoardTags @change="handleTagChange" />
+    <div class="conversation-board-main">
+      <BoardWelcome />
 
-    <BoardAgentList />
+      <BoardTags @change="handleTagChange" />
 
-    <div class="conversation-board-placeholder"></div>
+      <BoardAgentList @itemActive="handleItemActive" :list="list_agents" />
+      <template v-if="api_status === 2">
+        <div class="infomations-container">
+          <a-spin :size="32" />
+        </div>
+      </template>
+      <template v-if="api_status === 3 && list_agents.length === 0">
+        <div class="infomations-container">
+          <a-empty> {{ $t('conversation.history_empty') }} </a-empty>
+        </div>
+      </template>
+      <template v-if="api_status === 4">
+        <div class="infomations-container">
+          <a-result status="warning" :title="api_message"> </a-result>
+        </div>
+      </template>
+      <template v-if="api_status === 5">
+        <div class="infomations-container">
+          <a-result status="error" :title="api_message"> </a-result>
+        </div>
+      </template>
+
+      <div class="conversation-board-placeholder"></div>
+    </div>
+
+    <div class="conversation-board-right"></div>
   </div>
 </template>
 
 <script setup>
+import { ref, onMounted } from 'vue';
+
 import BoardWelcome from '../../modules/conversation-board/BoardWelcome.vue';
 import BoardTags from '../../modules/conversation-board/BoardTags.vue';
 import BoardAgentList from '../../modules/conversation-board/BoardAgentList.vue';
 
+import { conversationBoardList } from '../../modules/conversation-board/api-conversation-board';
+import { useAllAgentStore } from '../../base/store/use-all-agents';
+
+const emit = defineEmits(['agentActive']);
+
+// api请求的状态
+const api_status = ref(1); // api状态 1 请求未启动 2 请求进心中 3 请求已成功 4 请求失败（网络成功，但是code不等于200） 5 请求出错
+const api_message = ref(''); // 请求消息 与 api_status 对应的 message 消息内容
+
+// 历史记录列表数据
+const list_agents = ref([]); // 历史记录的列表数据
+
+// store中保存的agents
+const allAgents = useAllAgentStore();
+
 const handleTagChange = (type) => {
   console.log(type);
 };
+
+const handleItemActive = (target_id) => {
+  emit('agentActive', target_id);
+};
+
+/**
+ * 处理请求参数
+ */
+const formatListOptions = () => {
+  return {};
+};
+
+/**
+ * 调用api请求
+ */
+const handleApiRequest = () => {
+  const cache_agents = allAgents.agents;
+  if (cache_agents.length !== 0) {
+    list_agents.value = cache_agents;
+    return;
+  }
+
+  // 处理查询参数
+  const opts = formatListOptions();
+
+  // 进入加载状态
+  api_status.value = 2;
+  api_message.value = '';
+  conversationBoardList(opts)
+    .then((res) => {
+      if (res.code / 1 === 200) {
+        // 成功
+        const res_list = res.data; // 历史记录列表
+
+        list_agents.value = res_list;
+        // 在store中缓存数据
+        allAgents.setList(res_list);
+
+        // api请求成功
+        api_status.value = 3;
+        api_message.value = 'success';
+      } else {
+        // api请求成功，但是业务失败
+        api_status.value = 4;
+        api_message.value = res.msg;
+      }
+    })
+    .catch((err) => {
+      console.log(err);
+      // api请求出错
+      api_status.value = 5;
+      api_message.value = err.message;
+    });
+};
+
+onMounted(() => {
+  // 调用api
+  handleApiRequest();
+});
 </script>
 
 <style lang="css" scoped>
 .conversation-board-container {
-  width: 60%;
+  display: flex;
+  justify-content: center;
+
+  margin-left: auto;
+  margin-right: auto;
+}
+.conversation-board-left {
+  width: 25%;
+  flex-shrink: 0;
+}
+.conversation-board-right {
+  width: 25%;
+  flex-shrink: 0;
+}
+.conversation-board-main {
+  /* width: 60%; */
+  flex-grow: 1;
   height: 100%;
   margin-left: auto;
   margin-right: auto;
 
+  margin-top: 150px;
+
   display: flex;
   flex-direction: column;
   justify-content: center;
@@ -36,4 +156,11 @@ const handleTagChange = (type) => {
 .conversation-board-placeholder {
   height: 50px;
 }
+
+.conversation-board-main .infomations-container {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  min-height: 200px;
+}
 </style>

src/views/conversation/ConversationChatContainer.vue

@@ -1,37 +1,98 @@
 <template>
   <div class="conversation-chat-container">
-    <HistoryName />
+    <div class="conversation-chat-left">
+      <DialogAsideLeft />
+    </div>
 
-    <div class="conversation-chat-placeholder"></div>
+    <div class="conversation-chat-main">
+      <DialogHeader />
+
+      <div class="conversation-chat-content">
+        <DialogList class="conversation-chat-list" />
+
+        <DialogInput class="conversation-chat-input" />
+      </div>
+
+      <DialogFooter />
+    </div>
+
+    <div class="conversation-chat-right">
+      <DialogAsideRight />
+    </div>
   </div>
 </template>
 
 <script setup>
 import { ref, onMounted } from 'vue';
 
-import ChatName from '../../modules/conversation-chat/ChatName.vue';
+import DialogAsideLeft from '../../modules/conversation-chat/DialogAsideLeft.vue';
+import DialogHeader from '../../modules/conversation-chat/DialogHeader.vue';
+import DialogList from '../../modules/conversation-chat/DialogList.vue';
+import DialogInput from '../../modules/conversation-chat/DialogInput.vue';
+import DialogFooter from '../../modules/conversation-chat/DialogFooter.vue';
+import DialogAsideRight from '../../modules/conversation-chat/DialogAsideRight.vue';
+
+/**
+ * 1. 历史会话进入此页面，展示历史会话内容
+ * 2. 点击智能体，新建会话
+ */
+
+const props = defineProps({
+  /**
+   * 会话ID
+   * 如果有此参数，则意味着获取该对话的记录内容
+   */
+  chat_id: String
+});
 </script>
 
 <style lang="css" scoped>
 .conversation-chat-container {
-  width: 60%;
+  display: flex;
+  justify-content: center;
+
+  margin-left: auto;
+  margin-right: auto;
+
+  height: 100%;
+}
+
+.conversation-chat-left {
+  width: 25%;
+  flex-shrink: 0;
+}
+.conversation-chat-right {
+  width: 25%;
+  flex-shrink: 0;
+}
+.conversation-chat-main {
+  /* width: 60%; */
+  flex-grow: 1;
   height: 100%;
   margin-left: auto;
   margin-right: auto;
 
   display: flex;
   flex-direction: column;
-}
 
-/* 底部占位元素 */
-.conversation-chat-placeholder {
-  height: 50px;
+  background-color: #aaa;
+
+  /* overflow: hidden; */
 }
+.conversation-chat-content {
+  flex-grow: 1;
 
-.conversation-chat-container .infomations-container {
   display: flex;
-  justify-content: center;
-  align-items: center;
-  min-height: 200px;
+  flex-direction: column;
+
+  overflow: hidden;
+}
+.conversation-chat-list {
+  overflow-y: auto;
+}
+.conversation-chat-input {
+  height: 100px;
+  background-color: #aaa;
+  flex-shrink: 0;
 }
 </style>

src/views/conversation/ConversationHistoryContainer.vue

@@ -1,38 +1,46 @@
 <template>
   <div class="conversation-history-container">
-    <HistoryName />
-
-    <HistorySearchInput @search="handleHistorySearch" />
-
-    <HistoryList
-      v-if="list_history.length !== 0"
-      :list="list_history"
-      :can_loadmore="can_loadmore"
-      @loadmore="handleListLoadMore"
-      @active="handleListItemActive"
-    />
-    <template v-if="api_status === 2">
-      <div class="infomations-container">
-        <a-spin :size="32" />
-      </div>
-    </template>
-    <template v-if="api_status === 3 && list_history.length === 0">
-      <div class="infomations-container">
-        <a-empty> {{ $t('conversation.history_empty') }} </a-empty>
-      </div>
-    </template>
-    <template v-if="api_status === 4">
-      <div class="infomations-container">
-        <a-result status="warning" :title="api_message"> </a-result>
-      </div>
-    </template>
-    <template v-if="api_status === 5">
-      <div class="infomations-container">
-        <a-result status="error" :title="api_message"> </a-result>
-      </div>
-    </template>
-
-    <div class="conversation-history-placeholder"></div>
+    <div class="conversation-history-left"></div>
+
+    <div class="conversation-history-main">
+      <HistoryName />
+
+      <HistorySearchInput @search="handleHistorySearch">
+        <HistoryTypeDropdown @typeSelected="handleTypeSelected" :api_status="api_status" />
+      </HistorySearchInput>
+
+      <HistoryList
+        v-if="list_history.length !== 0"
+        :list="list_history"
+        :can_loadmore="can_loadmore"
+        @loadmore="handleListLoadMore"
+        @active="handleListItemActive"
+      />
+      <template v-if="api_status === 1 || api_status === 2">
+        <div class="infomations-container">
+          <a-spin :size="32" />
+        </div>
+      </template>
+      <template v-if="api_status === 3 && list_history.length === 0">
+        <div class="infomations-container">
+          <a-empty> {{ $t('conversation.history_empty') }} </a-empty>
+        </div>
+      </template>
+      <template v-if="api_status === 4">
+        <div class="infomations-container">
+          <a-result status="warning" :title="api_message"> </a-result>
+        </div>
+      </template>
+      <template v-if="api_status === 5">
+        <div class="infomations-container">
+          <a-result status="error" :title="api_message"> </a-result>
+        </div>
+      </template>
+
+      <div class="conversation-history-placeholder"></div>
+    </div>
+
+    <div class="conversation-history-right"></div>
   </div>
 </template>
 
@@ -42,14 +50,18 @@ import { ref, onMounted } from 'vue';
 import HistoryName from '../../modules/conversation-history/HistoryName.vue';
 import HistorySearchInput from '../../modules/conversation-history/HistorySearchInput.vue';
 import HistoryList from '../../modules/conversation-history/HistoryList.vue';
+import HistoryTypeDropdown from '../../modules/conversation-history/HistoryTypeDropdown.vue';
 
 import { apiConversationHistoryList } from '../../modules/conversation-history/api-conversation-history';
 
 import { getTodayZeroTimestamp, ONE_DAY, ONE_MONTH } from '../../utils/datetime';
 
+const emit = defineEmits(['historyActive']);
+
 const page_no = ref(1); // 当前页码
 const page_count = ref(50); // 每页显示的数量
 const search_text = ref(''); // 搜索字符串
+const agent_id = ref('');
 
 const can_loadmore = ref(true); // 是否可以加载更多
 
@@ -78,67 +90,60 @@ const last_month_zero = yesterday_zero - ONE_MONTH; // 上个月(30天之前的)
  */
 function dropListByType(res_list) {
   res_list.forEach((item, index) => {
-    // 获取每一项的内容
-    const create_time = item.create_time; // 会话创建时间
+    let label_item = null; // label项目（今天、本月、更早以前）
+    const content_item = item; // 数据项目
+
+    const create_time = content_item.updated_time; // 会话创建时间
 
     if (create_time >= today_zero) {
+      // 今天的数据
       if (count_today.value === 0) {
-        // 第0个数据
-        // 今天的数据
-        list_history.value.push({
+        label_item = {
           client_field_content_type: 'label',
           client_field_timestamp_type: 'today',
           id: 'today'
-          // content: '今天'
-          // content: t('conversation.history_today')
-        });
+        };
       }
 
       // 非第0个数据
-      item.client_field_timestamp_type = 'today'; // 客户端自定义字段: 时间类型
-      item.client_field_content_type = 'content'; // 内容类别
-
-      // 今天的数据
-      list_history.value.push(item);
+      content_item.client_field_timestamp_type = 'today'; // 客户端自定义字段: 时间类型
+      content_item.client_field_content_type = 'content'; // 内容类别
 
       count_today.value = count_today.value + 1;
     } else if (create_time < today_zero && create_time > last_month_zero) {
-      // 本月
+      // 本月的数据
       if (count_month.value === 0) {
-        list_history.value.push({
+        label_item = {
           client_field_content_type: 'label',
           client_field_timestamp_type: 'month',
           id: 'month'
-          // content: '本月'
-          // content: t('conversation.history_month')
-        });
+        };
       }
 
-      item.client_field_timestamp_type = 'month'; // 客户端自定义字段: 时间类型
-      item.client_field_content_type = 'content'; // 内容类别
-
-      list_history.value.push(item);
+      content_item.client_field_timestamp_type = 'month'; // 客户端自定义字段: 时间类型
+      content_item.client_field_content_type = 'content'; // 内容类别
 
       count_month.value = count_month.value + 1;
     } else {
+      // 更早以前的数据
       if (count_earlier.value === 0) {
-        list_history.value.push({
+        label_item = {
           client_field_content_type: 'label',
           client_field_timestamp_type: 'earlier',
           id: 'earlier'
-          // content: '更早以前'
-          // content: t('conversation.history_earlier')
-        });
+        };
       }
 
-      item.client_field_timestamp_type = 'earlier'; // 客户端自定义字段: 时间类型
-      item.client_field_content_type = 'content'; // 内容类别
-
-      // 更早的数据
-      list_history.value.push(item);
+      content_item.client_field_timestamp_type = 'earlier'; // 客户端自定义字段: 时间类型
+      content_item.client_field_content_type = 'content'; // 内容类别
 
       count_earlier.value = count_earlier.value + 1;
     }
+
+    if (label_item) {
+      list_history.value.push(label_item);
+    }
+    list_history.value.push(content_item);
   });
 }
 
@@ -149,7 +154,8 @@ const formatListOptions = () => {
   return {
     search: search_text.value,
     page: page_no.value,
-    per_page: page_count.value
+    per_page: page_count.value,
+    agent_id: agent_id.value
   };
 };
 
@@ -169,14 +175,15 @@ const handleApiRequest = () => {
         // 成功
         const res_list = res.data; // 历史记录列表
 
-        if (res_list.length === 0) {
+        if (res_list.length < page_count.value) {
           // 数据已经加载完成，不能加载更多了
           can_loadmore.value = false;
         } else {
           can_loadmore.value = true;
-          dropListByType(res_list);
         }
 
+        dropListByType(res_list);
+
         // api请求成功
         api_status.value = 3;
         api_message.value = 'success';
@@ -187,10 +194,11 @@ const handleApiRequest = () => {
       }
     })
     .catch((err) => {
-      console.log(err);
+      // console.log(err, '这是错误吗？？');
+
       // api请求出错
       api_status.value = 5;
-      api_message.value = err.msg;
+      api_message.value = err.message;
     });
 };
 
@@ -217,7 +225,11 @@ const handleListLoadMore = () => {
  * 点击某个历史记录触发的事件
  * @param history_id
  */
-const handleListItemActive = (history_id) => {};
+const handleListItemActive = (history_id) => {
+  emit('historyActive', {
+    target_id: history_id
+  });
+};
 
 /**
  * 开始搜索
@@ -237,15 +249,54 @@ const handleHistorySearch = (value) => {
   handleApiRequest();
 };
 
-onMounted(() => {
+/**
+ * 选定具体的类型，此时应该执行历史记录获取的请求
+ * 当类型选定后，获取此类型对应的历史记录数据
+ * @param type_item
+ */
+const handleTypeSelected = (type_item) => {
+  if (api_status.value === 2) {
+    return;
+  }
+
+  // 记录Agent ID
+  agent_id.value = type_item.id;
+
+  page_no.value = 1; // 页码归位
+
+  list_history.value = []; // 清空数据
+
   // 调用api
   handleApiRequest();
+};
+
+onMounted(() => {
+  // // 调用api
+  // handleApiRequest();
 });
 </script>
 
 <style lang="css" scoped>
 .conversation-history-container {
-  width: 60%;
+  display: flex;
+  justify-content: center;
+
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.conversation-history-left {
+  width: 25%;
+  flex-shrink: 0;
+}
+.conversation-history-right {
+  width: 25%;
+  flex-shrink: 0;
+}
+
+.conversation-history-main {
+  /* width: 60%; */
+  flex-grow: 1;
   height: 100%;
   margin-left: auto;
   margin-right: auto;
@@ -259,7 +310,7 @@ onMounted(() => {
   height: 50px;
 }
 
-.conversation-history-container .infomations-container {
+.conversation-history-main .infomations-container {
   display: flex;
   justify-content: center;
   align-items: center;