ai辅导员的历史聊天记录

src/api/aitutor/chat.js

@@ -0,0 +1,85 @@
+import request from '@/utils/request';
+
+/**
+ * 获取会话列表
+ * @param {Object} params - 请求参数
+ * @param {number} params.user - 用户ID
+ * @returns {Promise}
+ */
+export function getConversationList(params) {
+  return request({
+    url: '/aitutor/aichat/conversations',
+    method: 'get',
+    params
+  });
+}
+
+/**
+ * 发送消息
+ * @param {Object} data - 请求体
+ * @param {string} data.query - 查询内容
+ * @param {string} [data.conversation_id] - 会话ID
+ * @param {number} data.user - 用户ID
+ * @param {number} data.user_id - 用户ID
+ * @param {string} data.user_name - 用户名
+ * @param {string} data.user_role - 用户角色
+ * @param {string} data.user_token - 用户token
+ * @returns {Promise}
+ */
+export function sendMessage(data) {
+  return request({
+    url: '/aitutor/aichat/stream',
+    method: 'post',
+    data,
+    headers: {
+      'Accept': 'text/event-stream'
+    }
+  });
+}
+
+/**
+ * 提交反馈
+ * @param {Object} data - 请求体
+ * @param {string} data.message_id - 消息ID
+ * @param {number} data.user_id - 用户ID
+ * @param {string} data.rating - 评分('like'或'dislike')
+ * @param {string} [data.content] - 反馈内容
+ * @returns {Promise}
+ */
+export function submitFeedback(data) {
+  return request({
+    url: '/aitutor/aichat/feedback',
+    method: 'post',
+    data
+  });
+}
+
+/**
+ * 获取反馈列表
+ * @param {Object} params - 请求参数
+ * @param {string} params.conversation_id - 会话ID
+ * @param {number} params.user_id - 用户ID
+ * @returns {Promise}
+ */
+export function getFeedbacks(params) {
+  return request({
+    url: '/aitutor/aichat/app/feedbacks',
+    method: 'get',
+    params
+  });
+}
+
+/**
+ * 获取历史消息
+ * @param {Object} params - 请求参数
+ * @param {string} params.conversation_id - 会话ID
+ * @param {number} params.user - 用户ID
+ * @returns {Promise}
+ */
+export function getHistoryMessages(params) {
+  return request({
+    url: '/aitutor/aichat/history',
+    method: 'get',
+    params
+  });
+}

src/views/aitutor/chathistory/index.vue

@@ -0,0 +1,273 @@
+<template>
+  <div class="app-container">
+    <div class="search-form">
+      <el-form :inline="true" :model="queryParams" ref="queryForm" label-width="68px">
+        <el-form-item label="用户ID" prop="user">
+          <el-input v-model="queryParams.user" placeholder="请输入用户ID" clearable size="small" />
+        </el-form-item>
+        <el-form-item label="会话ID" prop="conversation_id">
+          <el-input v-model="queryParams.conversation_id" placeholder="请输入会话ID" clearable size="small" />
+        </el-form-item>
+        <el-form-item label="消息内容" prop="content">
+          <el-input v-model="queryParams.content" placeholder="请输入消息内容" clearable size="small" />
+        </el-form-item>
+        <el-form-item label="时间段">
+          <el-date-picker
+            v-model="dateRange"
+            type="daterange"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+            size="small"
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="el-icon-search" size="small" @click="handleQuery">搜索</el-button>
+          <el-button type="success" icon="el-icon-menu" size="small" @click="getConversationsByUser">查询会话</el-button>
+          <el-button icon="el-icon-refresh" size="small" @click="resetQuery">重置</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <el-table v-loading="loading" :data="historyList" border fit highlight-current-row style="width: 100%">
+      <el-table-column label="序号" type="index" width="50" align="center" />
+      <el-table-column prop="user" label="用户ID" width="100" align="center" />
+      <el-table-column prop="conversation_id" label="会话ID" width="180" align="center" />
+      <el-table-column prop="message_id" label="消息ID" width="180" align="center" />
+      <el-table-column prop="type" label="消息类型" width="80" align="center">
+        <template slot-scope="scope">
+          <el-tag :type="scope.row.type === 'user' ? 'primary' : 'success'" size="small">
+            {{ scope.row.type === 'user' ? '用户' : 'AI' }}
+          </el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column prop="content" label="消息内容" min-width="300">
+        <template slot-scope="scope">
+          <div v-html="scope.row.content"></div>
+        </template>
+      </el-table-column>
+      <el-table-column prop="feedback" label="反馈状态" width="100" align="center">
+        <template slot-scope="scope">
+          <div v-if="scope.row.feedback === 'like'"><i class="el-icon-thumb text-primary"></i> 点赞</div>
+          <div v-else-if="scope.row.feedback === 'dislike'"><i class="el-icon-minus text-danger"></i> 点踩</div>
+          <div v-else>无反馈</div>
+        </template>
+      </el-table-column>
+      <el-table-column prop="created_at" label="创建时间" width="180" align="center" />
+      <el-table-column label="操作" width="150" align="center" fixed="right">
+        <template slot-scope="scope">
+          <el-button type="primary" icon="el-icon-view" size="mini" @click="viewMessage(scope.row)">查看详情</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <div class="pagination-container">
+      <el-pagination
+        v-show="total > 0"
+        :current-page="queryParams.pageNum"
+        :page-size="queryParams.pageSize"
+        :total="total"
+        :page-sizes="[10, 20, 50, 100]"
+        layout="total, sizes, prev, pager, next, jumper"
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import { getHistoryMessages, getFeedbacks, getConversationList } from "@/api/aitutor/chat";
+import { getTokenKeySessionStorage } from "@/utils/auth";
+
+export default {
+  name: "ChatHistory",
+  data() {
+    return {
+      loading: false,
+      historyList: [],
+      conversationList: [], // 存储会话列表
+      total: 0,
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        user: undefined,
+        conversation_id: undefined,
+        content: undefined
+      },
+      dateRange: [],
+      userToken: getTokenKeySessionStorage()
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 根据用户ID查询会话列表 */
+    getConversationsByUser() {
+      if (!this.queryParams.user) {
+        this.$message.error('请输入用户ID');
+        return;
+      }
+
+      this.loading = true;
+      const params = {
+        user: this.queryParams.user
+      };
+
+      getConversationList(params).then(response => {
+        if (response.code === 200) {
+          let conversationData = response.data;
+          // 如果返回的是字符串形式的JSON，尝试解析
+          if (typeof conversationData === 'string') {
+            try {
+              conversationData = JSON.parse(conversationData);
+            } catch (e) {
+              console.error('解析会话列表数据失败:', e);
+            }
+          }
+
+          // 格式化数据
+          if (Array.isArray(conversationData)) {
+            this.conversationList = conversationData;
+            if (conversationData.length > 0) {
+              this.$message.success(`成功获取到${conversationData.length}条会话记录`);
+              // 如果只有一条会话，可以自动填充到会话ID输入框
+              if (conversationData.length === 1) {
+                this.queryParams.conversation_id = conversationData[0].conversation_id;
+              }
+            } else {
+              this.$message.info('未找到该用户的会话记录');
+            }
+          } else if (conversationData && Array.isArray(conversationData.list)) {
+            this.conversationList = conversationData.list;
+            this.$message.success(`成功获取到${conversationData.list.length}条会话记录`);
+          } else {
+            this.conversationList = [];
+            this.$message.info('未找到该用户的会话记录');
+          }
+        } else {
+          this.$message.error("获取会话列表失败：" + (response.msg || response.message));
+        }
+        this.loading = false;
+      }).catch(error => {
+        console.error('获取会话列表失败:', error);
+        this.$message.error("网络错误：" + error.message);
+        this.loading = false;
+      });
+    },
+
+    /** 查询历史消息列表 */
+    getList() {
+      this.loading = true;
+      // 处理日期范围
+      if (this.dateRange && this.dateRange.length > 0) {
+        this.queryParams.start_time = this.dateRange[0];
+        this.queryParams.end_time = this.dateRange[1];
+      } else {
+        this.queryParams.start_time = undefined;
+        this.queryParams.end_time = undefined;
+      }
+
+      // 检查user参数是否存在
+      if (!this.queryParams.user) {
+        this.$message.error('请输入用户ID');
+        this.loading = false;
+        return;
+      }
+
+      // 添加user参数以匹配API要求
+      const params = {
+        ...this.queryParams,
+        user: this.queryParams.user
+      };
+      getHistoryMessages(params).then(response => {
+        // 假设接口返回格式为 { code: 200, data: { list: [], total: 0 } }
+        // 根据实际接口调整
+        if (response.code === 200) {
+          let historyData = response.data;
+          // 如果返回的是字符串形式的JSON，尝试解析
+          if (typeof historyData === 'string') {
+            try {
+              historyData = JSON.parse(historyData);
+            } catch (e) {
+              console.error('解析历史消息数据失败:', e);
+            }
+          }
+
+          // 格式化数据
+          if (Array.isArray(historyData)) {
+            this.historyList = historyData;
+            this.total = historyData.length;
+          } else if (historyData && Array.isArray(historyData.list)) {
+            this.historyList = historyData.list;
+            this.total = historyData.total;
+          } else {
+            this.historyList = [];
+            this.total = 0;
+          }
+        } else {
+          this.$message.error("获取历史消息失败：" + (response.msg || response.message));
+        }
+        this.loading = false;
+      }).catch(error => {
+        console.error('获取历史消息失败:', error);
+        this.$message.error("网络错误：" + error.message);
+        this.loading = false;
+      });
+    },
+
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.dateRange = [];
+      this.$refs.queryForm.resetFields();
+      this.handleQuery();
+    },
+
+    /** 查看消息详情 */
+    viewMessage(row) {
+      // 这里可以实现查看消息详情的逻辑
+      this.$modal.msgDetail('消息详情', {
+        user: row.user,
+        conversation_id: row.conversation_id,
+        message_id: row.message_id,
+        type: row.type,
+        content: row.content,
+        feedback: row.feedback,
+        created_at: row.created_at
+      });
+      // 如果需要更复杂的详情展示，可以打开一个新的弹窗组件
+      // this.$refs.detailDialog.open(row);
+    },
+
+    /** 分页大小改变 */
+    handleSizeChange(val) {
+      this.queryParams.pageSize = val;
+      this.getList();
+    },
+
+    /** 当前页码改变 */
+    handleCurrentChange(val) {
+      this.queryParams.pageNum = val;
+      this.getList();
+    }
+  }
+};
+</script>
+
+<style scoped>
+.search-form {
+  margin-bottom: 20px;
+}
+
+.pagination-container {
+  margin-top: 20px;
+  text-align: right;
+}
+</style>

src/views/aitutor/chattest/index.vue

@@ -0,0 +1,671 @@
+<!-- src/views/tool/ai-chat/index.vue -->
+
+<template>
+  <div class="ai-chat-container">
+    <h3>AI 聊天助手</h3>
+    <div class="conversation-controls">
+      <el-button @click="toggleConversationList">
+        {{ showConversationList ? '隐藏会话列表' : '显示会话列表' }}
+      </el-button>
+      <el-button @click="fetchHistoryMessages" :disabled="!conversationId || historyLoaded">获取历史消息</el-button>
+      <el-button @click="createNewConversation" type="primary">新建会话</el-button>
+      <el-button @click="fetchFeedbacks">获取反馈列表</el-button>
+    </div>
+
+    <!-- 会话列表 -->
+    <div v-if="showConversationList" class="conversation-list">
+      <h4>会话列表</h4>
+      <el-scrollbar max-height="200px">
+        <div v-for="conv in conversationList" :key="conv.id" class="conversation-item" :class="{ 'active': conv.id === conversationId }" @click="switchConversation(conv.id)">
+          <div class="conv-title">{{ conv.title || '未命名会话' }}</div>
+          <div class="conv-time">{{ formatDate(conv.updated_at) }}</div>
+          <div class="conv-preview">{{ conv.preview || '无消息' }}</div>
+        </div>
+      </el-scrollbar>
+    </div>
+    <el-button @click="fetchHistoryMessages" :disabled="!conversationId">获取历史消息</el-button>
+    <div class="chat-box" ref="chatBox">
+      <div v-for="(msg, index) in messages" :key="index" class="message-item">
+        <!-- 用户消息 -->
+        <div v-if="msg.type === 'user'" class="user-message">
+          <el-avatar :size="30" style="background-color: #1890ff;">U</el-avatar>
+          <div class="message-content user">{{ msg.content }}</div>
+        </div>
+
+        <!-- AI 消息（带点赞/点踩） -->
+        <div v-else class="ai-message">
+          <el-avatar :size="30" style="background-color: #52c41a;">AI</el-avatar>
+          <div class="message-content ai" v-html="msg.content"></div>
+
+          <!-- 引用和归属分段列表 -->
+          <div v-if="msg.references && msg.references.length > 0" class="references-section">
+            <h4 class="references-title">引用来源：</h4>
+            <ul class="references-list">
+              <li v-for="(ref, refIndex) in msg.references" :key="refIndex" class="reference-item">
+                <span class="reference-source">{{ ref.source }}：</span>
+                <span class="reference-content">{{ ref.content }}</span>
+              </li>
+            </ul>
+          </div>
+
+          <!-- 👍 点赞 / 👎 点踩 按钮 -->
+          <div class="feedback-actions" v-if="msg.message_id">
+            <el-button
+              size="mini"
+              :type="msg.feedback === 'like' ? 'primary' : 'default'"
+              icon="el-icon-thumb"
+              @click="submitFeedback(msg, 'like')"
+              :loading="msg.feedbackLoading"
+              >点赞</el-button
+            >
+            <el-button
+              size="mini"
+              :type="msg.feedback === 'dislike' ? 'danger' : 'default'"
+              icon="el-icon-minus"
+              @click="submitFeedback(msg, 'dislike')"
+              :loading="msg.feedbackLoading"
+              >点踩</el-button
+            >
+          </div>
+        </div>
+      </div>
+
+      <!-- 流式输出中 -->
+      <div v-if="isStreaming" class="ai-message">
+        <el-avatar :size="30" style="background-color: #52c41a;">AI</el-avatar>
+        <div class="message-content ai" v-html="currentText"></div>
+      </div>
+    </div>
+
+    <div class="input-area">
+      <el-input
+        v-model="inputText"
+        placeholder="请输入你的问题... (回车发送)"
+        @keyup.enter.native="send"
+        @keydown.enter.native="handleEnterKey"
+        clearable
+      />
+      <el-button type="primary" @click="send" :loading="isStreaming">发送</el-button>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getConversationList, submitFeedback, getFeedbacks, getHistoryMessages } from "@/api/aitutor/chat";
+import { getTokenKeySessionStorage } from "@/utils/auth";
+
+
+export default {
+  name: "AiChat",
+  data() {
+    return {
+        inputText: "",
+        messages: [],
+        currentText: "",
+        isStreaming: false,
+        abortController: null,
+        conversationId: null,
+        userId: 2023429112,
+        userName: "当前用户", // 添加用户名
+        userRole: "我是学生", // 添加用户角色
+        //userToken: getTokenKeySessionStorage(),
+        userToken: "123",
+        showConversationList: false,
+        conversationList: [],
+        loadingConversations: false,
+        historyLoaded: false, // 新增：标记历史消息是否已加载
+      };
+  },
+
+  mounted() {
+    // 组件挂载时获取会话列表
+    this.fetchConversationList();
+  },
+  methods: {
+    // 处理回车键事件
+    handleEnterKey(event) {
+      // 阻止默认行为，避免表单提交
+      event.preventDefault();
+      this.send();
+    },
+    // 切换会话列表显示状态并获取数据
+    toggleConversationList() {
+      this.showConversationList = !this.showConversationList;
+      this.fetchConversationList();
+    },
+
+    // 获取会话列表
+    async fetchConversationList() {
+      if (this.loadingConversations) return;
+
+      this.loadingConversations = true;
+
+      try {
+        const result = await getConversationList({ user: this.userId });
+
+        this.conversationList = result.data || [];
+        console.log('会话列表接口返回数据:', result.data);
+        // 自动选中第一个会话（如果有）
+        if (this.conversationList.length > 0 && !this.conversationId) {
+          this.switchConversation(this.conversationList[0].id);
+        }
+      } catch (err) {
+        this.$message.error("网络错误：" + err.message);
+      } finally {
+        this.loadingConversations = false;
+      }
+    },
+
+    // 切换会话
+    switchConversation(conversationId) {
+      this.conversationId = conversationId;
+      this.messages = []; // 清空当前消息
+      this.historyLoaded = false; // 重置历史消息加载标志
+      this.fetchHistoryMessages(); // 获取选中会话的历史消息
+    },
+
+    // 新建会话
+    createNewConversation() {
+      this.conversationId = null;
+      this.messages = [];
+      this.currentText = "";
+      this.historyLoaded = false;
+      this.showConversationList = false;
+      this.$message.info("已创建新会话，请先发送消息开始对话");
+    },
+
+    // 格式化日期
+    formatDate(dateString) {
+      if (!dateString) return '';
+      const date = new Date(dateString);
+      return date.toLocaleString();
+    },
+
+    async send() {
+      const query = this.inputText.trim();
+      if (!query || this.isStreaming) return;
+
+      this.messages.push({
+        type: "user",
+        content: query,
+      });
+
+      this.currentText = "";
+      this.isStreaming = true;
+      this.inputText = "";
+
+      // 确保有会话ID
+      if (!this.conversationId) {
+        console.log('发送消息时conversationId为null，尝试创建新会话');
+        if (this.conversationList.length > 0) {
+          this.switchConversation(this.conversationList[0].id);
+        } else {
+          console.log('没有现有会话，将发送消息以创建新会话');
+        }
+      }
+      console.log('发送消息时的conversationId:', this.conversationId);
+
+      // 创建请求体
+      const requestBody = {
+        query: query,
+        conversation_id: this.conversationId || undefined,
+        user: this.userId,
+        user_id: this.userId,
+        user_name: this.userName,
+        user_role: this.userRole,
+        user_token: this.userToken
+      };
+
+      // 创建AbortController以支持取消请求
+      this.abortController = new AbortController();
+
+      try {
+        // 对于SSE请求，使用原生fetch而不是axios封装
+        // Use the base API URL from environment configuration
+        const baseUrl = process.env.VUE_APP_BASE_API || '';
+        const response = await fetch(`${baseUrl}/aitutor/aichat/stream`, {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+            'Accept': 'text/event-stream',
+            'Authorization': `Bearer ${getTokenKeySessionStorage()}`
+          },
+          body: JSON.stringify(requestBody),
+          signal: this.abortController.signal
+        });
+
+        if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`);
+        if (!response.body) throw new Error("No response body");
+
+        const reader = response.body.getReader();
+        const decoder = new TextDecoder();
+        let buffer = "";
+
+        while (true) {
+          const { done, value } = await reader.read();
+          if (done) break;
+
+          buffer += decoder.decode(value, { stream: true });
+          const lines = buffer.split("\n");
+          buffer = lines.pop();
+
+          for (const line of lines) {
+            if (line.startsWith("data:")) {
+              const data = line.slice(5).trim();
+              if (data === "[DONE]") {
+                await this.finalizeResponse();
+                return;
+              } else {
+                try {
+                  const json = JSON.parse(data);
+                  const eventType = json.event;
+
+                  switch (eventType) {
+                    case "message":
+                      this.currentText += json.answer || "";
+                      break;
+                    case "message_end":
+                      // ✅ 保存 conversation_id 和 message_id
+                      if (json.conversation_id) {
+                        this.conversationId = json.conversation_id;
+                        console.log("Conversation ID set to:", this.conversationId); // 添加调试信息
+                      }
+                      // 给最后一条 AI 消息添加 message_id 和引用数据
+                      // 处理引用数据 - 根据Dify文档，引用数据在retriever_resources字段中
+                      let refs = [];
+                      if (json.retriever_resources && Array.isArray(json.retriever_resources)) {
+                        refs = json.retriever_resources;
+                        console.log('引用数据来自retriever_resources字段:', refs);
+                      } else if (json.references && Array.isArray(json.references)) {
+                        refs = json.references;
+                        console.log('引用数据来自references字段:', refs);
+                      } else if (json.sources && Array.isArray(json.sources)) {
+                        refs = json.sources;
+                        console.log('引用数据来自sources字段:', refs);
+                      } else {
+                        console.log('未找到引用数据或格式不正确:', json);
+                      }
+                       
+                      this.messages.push({
+                        type: "ai",
+                        content: this.currentText,
+                        message_id: json.id, // Dify 返回的消息 ID
+                        references: refs, // 引用数据
+                        feedback: null,     // 初始无反馈
+                        feedbackLoading: false,
+                      });
+                      this.currentText = "";
+                      break;
+                    case "error":
+                      this.currentText += `<span style=\"color:red\">[AI错误] ${json.message || "未知错误"}</span>`;
+                      break;
+                    default:
+                      break;
+                  }
+                } catch (e) {
+                  this.currentText += data;
+                }
+              }
+          }
+        }
+      }
+        await this.finalizeResponse();
+      } catch (err) {
+        if (err.name !== "AbortError") {
+          console.error("SSE Error:", err);
+          this.$message.error("连接失败: " + err.message + ", 请检查后端服务是否正常运行");
+        }
+        this.isStreaming = false;
+      }
+    },
+
+    async finalizeResponse() {
+      this.isStreaming = false;
+      this.abortController = null;
+    },
+
+    // ==================== 新增：提交点赞/点踩 ====================
+    async submitFeedback(msg, rating) {
+      // 防止重复提交
+      if (msg.feedbackLoading) return;
+
+      // 构造请求体
+      const payload = {
+        message_id: msg.message_id,
+        user_id: this.userId,
+        user: this.userId, // 添加user参数，与user_id保持一致
+        rating: rating, // 'like' 或 'dislike'
+        content: null,
+      };
+
+      // 更新 UI 状态
+      msg.feedbackLoading = true;
+
+      try {
+        const result = await submitFeedback(payload);
+        console.log("提交反馈响应:", result);
+        if (result.code === 200) {
+          // 更新反馈状态（如果再次点击则撤销）
+          if (msg.feedback === rating) {
+            msg.feedback = null;
+            this.$message.success("已撤销");
+          } else {
+            msg.feedback = rating;
+            this.$message.success(rating === "like" ? "感谢点赞！" : "已提交点踩");
+          }
+        } else {
+          this.$message.error("提交失败：" + (result.msg || result.message));
+        }
+      } catch (err) {
+        this.$message.error("网络错误：" + err.message);
+      } finally {
+        msg.feedbackLoading = false;
+      }
+    },
+
+    // 获取反馈列表
+    async fetchFeedbacks() {
+/*       if (!this.conversationId) {
+        this.$message.error("当前会话ID不存在，请先选择一个会话。");
+        return;
+      } */
+
+      try {
+        // 调用API函数
+        const data = await getFeedbacks({
+          conversation_id: this.conversationId,
+          user_id: this.userId
+        });
+
+        // 处理响应数据
+        if (data.code === 200) {
+          // 检查data是否是数组，如果不是则尝试获取其content属性
+          const feedbacks = Array.isArray(data.data) ? data.data : (data.data?.content || []);
+
+          // 创建一个反馈映射，方便快速查找
+          const feedbackMap = {};
+          feedbacks.forEach(feedback => {
+            feedbackMap[feedback.message_id] = feedback.rating;
+          });
+
+          // 更新消息列表中的反馈状态
+          this.messages = this.messages.map(msg => {
+            if (feedbackMap[msg.message_id] !== undefined) {
+              return {
+                ...msg,
+                feedback: feedbackMap[msg.message_id],
+              };
+            }
+            return msg;
+          });
+          this.$message.success("获取反馈列表成功");
+        } else {
+          console.error('获取反馈失败: 响应格式不正确', data);
+          this.$message.error("获取反馈列表失败：" + (data.msg || data.message));
+        }
+      } catch (error) {
+        console.error('获取反馈失败:', error);
+        this.$message.error("网络错误：" + error.message);
+      }
+    },
+
+    // ==================== 新增：获取历史消息 ====================
+    async fetchHistoryMessages() {
+      if (!this.conversationId) {
+        // 如果会话列表不为空但没有选中会话，自动选中第一个
+        if (this.conversationList.length > 0) {
+          this.switchConversation(this.conversationList[0].id);
+          return;
+        }
+        this.$message.error("当前会话ID不存在，请先发起一次对话。");
+        return;
+      }
+
+      // 如果历史消息已加载，则不再重复加载
+      if (this.historyLoaded) {
+        this.$message.info("历史消息已加载");
+        return;
+      }
+
+      try {
+        // 调用API函数
+        // 确保user参数是字符串类型并正确传递
+          const data = await getHistoryMessages({
+            conversation_id: this.conversationId,
+            user_id: this.userId,
+            user: String(this.userId)
+          });
+
+        // 处理响应数据
+        if (data.code === 200) {
+          let historyData;
+          try {
+            // 尝试解析数据（如果是字符串形式的JSON）
+            historyData = typeof data.data === 'string' ? JSON.parse(data.data) : data.data;
+          } catch (e) {
+            historyData = data.data;
+          }
+
+          if (Array.isArray(historyData)) {
+            // 格式化历史消息
+            const historyMessages = [];
+            historyData.forEach(msg => {
+              // 如果有query字段，添加用户消息
+              if (msg.query) {
+                historyMessages.push({
+                  type: 'user',
+                  content: msg.query,
+                  message_id: msg.id + '-user', // 添加后缀以确保唯一性
+                  feedback: null,
+                  feedbackLoading: false,
+                });
+              }
+                
+              // 如果有answer字段，添加AI消息
+              if (msg.answer) {
+                historyMessages.push({
+                    type: 'ai',
+                    content: msg.answer,
+                    message_id: msg.id,
+                    references: msg.references || msg.sources || [], // 引用数据，适配不同字段名
+                    feedback: msg.feedback || null,
+                    feedbackLoading: false,
+                  });
+              }
+            });
+            // 将历史消息添加到现有消息列表的开头
+            this.messages = [...historyMessages, ...this.messages];
+            this.historyLoaded = true; // 标记历史消息已加载
+          } else if (historyData && Array.isArray(historyData.messages)) {
+            // 格式化历史消息
+            const historyMessages = [];
+            historyData.messages.forEach(msg => {
+              if (msg.role === 'user') {
+                historyMessages.push({
+                  type: 'user',
+                  content: msg.content,
+                  message_id: msg.id + '-user',
+                  feedback: null,
+                  feedbackLoading: false,
+                });
+              } else {
+                historyMessages.push({
+                  type: 'ai',
+                  content: msg.content,
+                  message_id: msg.id,
+                  references: msg.references || [],
+                  feedback: null,
+                  feedbackLoading: false,
+                });
+              }
+            });
+            this.messages = [...historyMessages, ...this.messages];
+            this.historyLoaded = true; // 标记历史消息已加载
+          } else {
+            console.error('获取历史消息失败: 响应格式不正确', historyData);
+            this.$message.error("获取历史消息失败：响应格式不正确");
+          }
+        } else {
+          console.error('获取历史消息失败:', data);
+          this.$message.error("获取历史消息失败：" + (data.msg || data.message));
+        }
+      } catch (error) {
+        console.error('获取历史消息失败:', error);
+        this.$message.error("网络错误：" + error.message);
+      }
+    },
+  },
+
+  beforeUnmount() {
+    if (this.abortController) {
+      this.abortController.abort();
+    }
+  },
+};
+</script>
+
+<style scoped>
+.ai-chat-container {
+  padding: 20px;
+  background-color: #f5f5f5;
+  height: calc(100vh - 100px);
+  display: flex;
+  flex-direction: column;
+}
+
+.chat-box {
+  flex: 1;
+  overflow-y: auto;
+  padding: 10px;
+  border: 1px solid #ebeef5;
+  border-radius: 8px;
+  background-color: white;
+  margin-bottom: 20px;
+}
+
+.message-item {
+  margin-bottom: 15px;
+  display: flex;
+  align-items: flex-start;
+}
+
+.message-content {
+  max-width: 80%;
+  padding: 8px 12px;
+  border-radius: 18px;
+  margin-left: 8px;
+  line-height: 1.6;
+}
+
+.user-message .message-content {
+  background-color: #1890ff;
+  color: white;
+}
+
+.ai-message .message-content {
+  background-color: #f0f2f5;
+  color: #333;
+}
+
+.references-section {
+  margin-left: 40px;
+  margin-top: 10px;
+  padding: 10px;
+  background-color: #f5f5f5;
+  border-radius: 8px;
+  font-size: 13px;
+}
+
+.references-title {
+  margin-bottom: 8px;
+  font-size: 14px;
+  font-weight: bold;
+  color: #666;
+}
+
+.references-list {
+  list-style-type: none;
+  padding-left: 0;
+}
+
+.reference-item {
+  margin-bottom: 8px;
+  padding-bottom: 8px;
+  border-bottom: 1px dashed #e0e0e0;
+}
+
+.reference-item:last-child {
+  border-bottom: none;
+  margin-bottom: 0;
+  padding-bottom: 0;
+}
+
+.reference-source {
+  font-weight: bold;
+  color: #1890ff;
+}
+
+.reference-content {
+  color: #666;
+}
+
+/* 点赞/点踩按钮样式 */
+.feedback-actions {
+  margin-left: 40px;
+  margin-top: 5px;
+  font-size: 12px;
+}
+
+.feedback-actions .el-button {
+  padding: 4px 8px;
+  margin-right: 5px;
+}
+
+.conversation-controls {
+  margin-bottom: 15px;
+  display: flex;
+  gap: 10px;
+}
+
+.conversation-list {
+  margin-bottom: 15px;
+  padding: 10px;
+  border: 1px solid #ebeef5;
+  border-radius: 8px;
+  background-color: white;
+}
+
+.conversation-item {
+  padding: 10px;
+  border-bottom: 1px solid #f0f0f0;
+  cursor: pointer;
+}
+
+.conversation-item:hover {
+  background-color: #f5f5f5;
+}
+
+.conversation-item.active {
+  background-color: #e6f7ff;
+  border-left: 3px solid #1890ff;
+}
+
+.conv-title {
+  font-weight: bold;
+  margin-bottom: 5px;
+}
+
+.conv-time {
+  font-size: 12px;
+  color: #999;
+  margin-bottom: 5px;
+}
+
+.conv-preview {
+  font-size: 12px;
+  color: #666;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+</style>

vue.config.js

@@ -36,7 +36,7 @@ module.exports = {
       // detail: https://cli.vuejs.org/config/#devserver-proxy  `http://124.70.202.11:8085` https://wap.wzzyhp.com
       [process.env.VUE_APP_BASE_API]: {
         // target: 'http://172.16.96.111:8585', //`http://zhxg.gxsdxy.cn`,`https://wap.wzzyhp.com`,   http://localhost:8085  http://zhxgjava.gxsdxy.cn
-        target: 'http://localhost:8085',// `http://zhxg.gxsdxy.cn`,`https://wap.wzzyhp.com`,   http://localhost:8085  http://zhxgjava.gxsdxy.cn
+        target: 'http://localhost:8088',// `http://zhxg.gxsdxy.cn`,`https://wap.wzzyhp.com`,   http://localhost:8085  http://zhxgjava.gxsdxy.cn
         //target:`http://zhxg.gxsdxy.cn`,
         changeOrigin: true,
         pathRewrite: {