feat(aiChat): 新增AI助手与知识库功能模块

- 新增AI助手和知识库菜单项，增加界面入口
- 添加AI聊天相关API接口及数据类型定义
- 实现AI聊天界面，支持多会话管理、消息流式接收及展示
- 支持聊天消息中的参考文档显示和管理
- 实现知识库文档上传、列表展示、删除及重新索引功能
- 完成知识库管理界面，支持项目选择及文件上传过滤
- 路由配置新增aiChat和knowledgeBase模块，确保访问路径正确
- 国际化资源更新，支持AI助手和知识库菜单名称显示

locales/en.yaml

@@ -70,6 +70,8 @@ panel:
 menus:
   pureHome: Home
   pureProject: Project Management
+  aiChat: AI Assistant
+  knowledgeBase: Knowledge Base
   pureRiskWorkorder: Risk & Workorder
   pureRiskAssessment: Risk Assessment
   pureWorkorderManagement: Workorder Management

locales/zh-CN.yaml

@@ -70,6 +70,8 @@ panel:
 menus:
   pureHome: 首页
   pureProject: 项目管理
+  aiChat: AI助手
+  knowledgeBase: 知识库
   pureRiskWorkorder: 风险与工单
   pureRiskAssessment: 风险评估
   pureWorkorderManagement: 工单管理

src/api/ai-chat.ts

@@ -0,0 +1,231 @@
+import { http } from "@/utils/http";
+
+/** 通用响应结果 */
+type Result<T = any> = {
+  code: number;
+  message: string;
+  data?: T;
+};
+
+// ==================== 数据结构定义 ====================
+
+/** 会话信息 */
+export interface ChatSessionVO {
+  sessionId: string; // UUID格式
+  sessionTitle: string;
+  projectId: number;
+  projectName: string;
+  timelineNodeId?: number;
+  timelineNodeName?: string;
+  lastMessageTime: string; // ISO 8601格式
+  messageCount: number;
+  createTime: string;
+}
+
+/** 引用文档 */
+export interface ReferencedDocVO {
+  id: number;
+  docId: string;
+  title: string;
+  docType: string;
+  fileType: string;
+  sourceType: string;
+  score: number; // 相似度分数 0-1
+  content: string; // 内容摘要
+}
+
+/** 对话消息 */
+export interface ChatMessageVO {
+  id: number;
+  role: "user" | "assistant" | "system";
+  content: string;
+  referencedDocs?: ReferencedDocVO[];
+  model?: string;
+  tokensUsed?: number;
+  responseTime?: number;
+  messageIndex: number;
+  createTime: string;
+}
+
+/** 知识库文档 */
+export interface KbDocumentVO {
+  id: number;
+  docId: string; // UUID格式
+  title: string;
+  docType: string; // report/document/text/data/other
+  fileType: string; // pdf/doc/txt/md等
+  fileSize: number; // 字节
+  filePath: string;
+  sourceType: string; // upload/project/risk等
+  chunkCount: number; // 分块数量
+  status: "pending" | "processing" | "active" | "error";
+  createByName: string;
+  createTime: string;
+}
+
+/** 文档状态 */
+export type DocumentStatus = "pending" | "processing" | "active" | "error";
+
+// ==================== SSE事件数据类型 ====================
+
+/** SSE start 事件数据 */
+export interface SSEStartData {
+  sessionId: string;
+  isNewSession: boolean;
+}
+
+/** SSE chunk 事件数据 */
+export interface SSEChunkData {
+  content: string;
+}
+
+/** SSE references 事件数据 */
+export interface SSEReferencesData {
+  docs: ReferencedDocVO[];
+}
+
+/** SSE complete 事件数据 */
+export interface SSECompleteData {
+  messageId: number;
+  tokensUsed: number;
+}
+
+/** SSE error 事件数据 */
+export interface SSEErrorData {
+  message: string;
+}
+
+// ==================== 请求参数类型 ====================
+
+/** 创建会话请求参数 */
+export interface CreateSessionRequest {
+  projectId: number;
+  timelineNodeId?: number | null;
+  firstMessage?: string;
+  sessionTitle?: string;
+}
+
+/** SSE对话请求参数 */
+export interface SSEChatParams {
+  sessionId?: string; // UUID格式，为空则新建会话
+  projectId: number;
+  timelineNodeId?: number;
+  message: string;
+  useRag?: boolean; // 默认true
+  useTextToSql?: boolean; // 默认false
+  contextWindow?: number; // 默认10
+}
+
+/** 上传文件请求参数 */
+export interface UploadDocumentParams {
+  projectId: number;
+  file: File;
+}
+
+// ==================== AI对话接口 ====================
+
+/** 新建会话 */
+export const createChatSession = (data: CreateSessionRequest) => {
+  return http.request<Result<ChatSessionVO>>(
+    "post",
+    "/api/v1/ai/chat/session",
+    {
+      data
+    }
+  );
+};
+
+/** 获取会话列表 */
+export const getChatSessions = (projectId: number) => {
+  return http.request<Result<ChatSessionVO[]>>(
+    "get",
+    "/api/v1/ai/chat/sessions",
+    {
+      params: { projectId }
+    }
+  );
+};
+
+/** 获取会话历史消息 */
+export const getSessionMessages = (sessionId: string) => {
+  return http.request<Result<ChatMessageVO[]>>(
+    "get",
+    `/api/v1/ai/chat/session/${sessionId}/messages`
+  );
+};
+
+/** 删除会话 */
+export const deleteChatSession = (sessionId: string) => {
+  return http.request<Result<void>>(
+    "delete",
+    `/api/v1/ai/chat/session/${sessionId}`
+  );
+};
+
+/** 构建SSE URL */
+export const buildSSEUrl = (params: SSEChatParams): string => {
+  const queryParams = new URLSearchParams();
+
+  if (params.sessionId) {
+    queryParams.append("sessionId", params.sessionId);
+  }
+  queryParams.append("projectId", String(params.projectId));
+  if (params.timelineNodeId !== undefined) {
+    queryParams.append("timelineNodeId", String(params.timelineNodeId));
+  }
+  queryParams.append("message", params.message);
+  if (params.useRag !== undefined) {
+    queryParams.append("useRag", String(params.useRag));
+  }
+  if (params.useTextToSql !== undefined) {
+    queryParams.append("useTextToSql", String(params.useTextToSql));
+  }
+  if (params.contextWindow !== undefined) {
+    queryParams.append("contextWindow", String(params.contextWindow));
+  }
+
+  return `/api/v1/ai/chat/sse?${queryParams.toString()}`;
+};
+
+// ==================== 知识库接口 ====================
+
+/** 上传文档 */
+export const uploadDocument = (params: UploadDocumentParams) => {
+  const formData = new FormData();
+  formData.append("projectId", String(params.projectId));
+  formData.append("file", params.file);
+
+  return http.request<Result<KbDocumentVO>>("post", "/api/v1/ai/kb/upload", {
+    data: formData,
+    headers: {
+      "Content-Type": undefined // 让浏览器自动设置 multipart/form-data
+    }
+  });
+};
+
+/** 获取文档列表 */
+export const getDocuments = (projectId: number) => {
+  return http.request<Result<KbDocumentVO[]>>(
+    "get",
+    "/api/v1/ai/kb/documents",
+    {
+      params: { projectId }
+    }
+  );
+};
+
+/** 删除文档 */
+export const deleteDocument = (docId: string) => {
+  return http.request<Result<void>>(
+    "delete",
+    `/api/v1/ai/kb/document/${docId}`
+  );
+};
+
+/** 重新索引文档 */
+export const reindexDocument = (docId: string) => {
+  return http.request<Result<void>>(
+    "post",
+    `/api/v1/ai/kb/document/${docId}/reindex`
+  );
+};

src/router/enums.ts

@@ -3,38 +3,42 @@
 const home = 0, // 平台规定只有 home 路由的 rank 才能为 0 ，所以后端在返回 rank 的时候需要从非 0 开始
   chatai = 1,
   project = 2,
-  vueflow = 3,
+  aiChat = 3,
-  ganttastic = 4,
+  knowledgeBase = 4,
-  components = 5,
+  vueflow = 5,
-  able = 6,
+  ganttastic = 6,
-  table = 7,
+  components = 7,
-  form = 8,
+  able = 8,
-  list = 9,
+  table = 9,
-  result = 10,
+  form = 10,
-  error = 11,
+  list = 11,
-  frame = 12,
+  result = 12,
-  nested = 13,
+  error = 13,
-  permission = 14,
+  frame = 14,
-  monitor = 16,
+  nested = 15,
-  tabs = 17,
+  permission = 16,
-  about = 18,
+  monitor = 17,
-  codemirror = 19,
+  tabs = 18,
-  markdown = 20,
+  about = 19,
-  editor = 21,
+  codemirror = 20,
-  flowchart = 22,
+  markdown = 21,
-  formdesign = 23,
+  editor = 22,
-  board = 24,
+  flowchart = 23,
-  ppt = 25,
+  formdesign = 24,
-  mind = 26,
+  board = 25,
-  guide = 27,
+  ppt = 26,
-  menuoverflow = 28,
+  mind = 27,
-  riskWorkorder = 29,
+  guide = 28,
+  menuoverflow = 29,
+  riskWorkorder = 30,
   system = 99;
 
 export {
   home,
   chatai,
   project,
+  aiChat,
+  knowledgeBase,
   vueflow,
   ganttastic,
   components,

src/router/index.ts

@@ -47,6 +47,8 @@ const modules: Record<string, any> = import.meta.glob(
     "./modules/home.ts",
     "./modules/risk-assessment.ts",
     "./modules/workorder-management.ts",
+    "./modules/knowledge-base.ts",
+    "./modules/ai-chat.ts",
     "!./modules/**/remaining.ts"
   ],
   {

src/router/modules/ai-chat.ts

@@ -0,0 +1,22 @@
+import { $t } from "@/plugins/i18n";
+import { aiChat } from "@/router/enums";
+
+export default {
+  path: "/ai-chat",
+  redirect: "/ai-chat/index",
+  meta: {
+    icon: "ri:robot-line",
+    title: $t("menus.aiChat") || "AI助手",
+    rank: aiChat
+  },
+  children: [
+    {
+      path: "/ai-chat/index",
+      name: "AiChat",
+      component: () => import("@/views/ai-chat/index.vue"),
+      meta: {
+        title: $t("menus.aiChat") || "AI助手"
+      }
+    }
+  ]
+} satisfies RouteConfigsTable;

src/router/modules/knowledge-base.ts

@@ -0,0 +1,22 @@
+import { $t } from "@/plugins/i18n";
+import { knowledgeBase } from "@/router/enums";
+
+export default {
+  path: "/knowledge-base",
+  redirect: "/knowledge-base/index",
+  meta: {
+    icon: "ri:database-2-line",
+    title: $t("menus.knowledgeBase") || "知识库",
+    rank: knowledgeBase
+  },
+  children: [
+    {
+      path: "/knowledge-base/index",
+      name: "KnowledgeBase",
+      component: () => import("@/views/knowledge-base/index.vue"),
+      meta: {
+        title: $t("menus.knowledgeBase") || "知识库"
+      }
+    }
+  ]
+} satisfies RouteConfigsTable;

src/views/ai-chat/index.vue

@@ -0,0 +1,787 @@
+<script setup lang="ts">
+import { ref, nextTick, onUnmounted, watch } from "vue";
+import { ElMessage, ElMessageBox } from "element-plus";
+import { useRenderIcon } from "@/components/ReIcon/src/hooks";
+import {
+  getChatSessions,
+  getSessionMessages,
+  deleteChatSession,
+  createChatSession,
+  buildSSEUrl,
+  type ChatSessionVO,
+  type ChatMessageVO,
+  type ReferencedDocVO,
+  type SSEStartData,
+  type SSEChunkData,
+  type SSEReferencesData,
+  type SSECompleteData,
+  type SSEErrorData
+} from "@/api/ai-chat";
+import { getProjectList, type ProjectItem } from "@/api/project";
+import dayjs from "dayjs";
+
+import SendIcon from "~icons/ri/send-plane-fill";
+import AddIcon from "~icons/ri/add-line";
+import DeleteIcon from "~icons/ep/delete";
+import DocumentIcon from "~icons/ri/file-text-line";
+import RefreshIcon from "~icons/ri/refresh-line";
+
+defineOptions({
+  name: "AiChat"
+});
+
+// 状态
+const loading = ref(false);
+const sessions = ref<ChatSessionVO[]>([]);
+const currentSession = ref<ChatSessionVO | null>(null);
+const messages = ref<ChatMessageVO[]>([]);
+const inputMessage = ref("");
+const sending = ref(false);
+const projects = ref<ProjectItem[]>([]);
+const projectLoading = ref(false);
+const showProjectSelect = ref(false);
+
+// SSE连接
+let eventSource: EventSource | null = null;
+
+// 消息容器引用
+const messagesContainer = ref<HTMLElement | null>(null);
+
+// 会话中的临时消息（用于流式显示）
+const streamingMessage = ref<string>("");
+const streamingReferences = ref<ReferencedDocVO[]>([]);
+
+// 加载项目列表
+async function loadProjects() {
+  projectLoading.value = true;
+  try {
+    const res = await getProjectList({ pageNum: 1, pageSize: 100 });
+    if (res.code === 200) {
+      projects.value = res.data?.rows || [];
+    }
+  } catch (error) {
+    console.error("加载项目列表失败:", error);
+  } finally {
+    projectLoading.value = false;
+  }
+}
+
+// 加载会话列表
+async function loadSessions(projectId?: number) {
+  loading.value = true;
+  try {
+    const res = await getChatSessions(
+      projectId || currentSession.value?.projectId || 0
+    );
+    if (res.code === 200) {
+      sessions.value = res.data || [];
+    }
+  } catch (error) {
+    console.error("加载会话列表失败:", error);
+  } finally {
+    loading.value = false;
+  }
+}
+
+// 选择会话
+async function selectSession(session: ChatSessionVO) {
+  currentSession.value = session;
+  await loadMessages(session.sessionId);
+}
+
+// 加载会话消息
+async function loadMessages(sessionId: string) {
+  try {
+    const res = await getSessionMessages(sessionId);
+    if (res.code === 200) {
+      messages.value = res.data || [];
+      scrollToBottom();
+    }
+  } catch (error) {
+    console.error("加载消息失败:", error);
+  }
+}
+
+// 创建新会话
+async function createNewSession() {
+  if (!currentSession.value?.projectId && projects.value.length === 0) {
+    await loadProjects();
+  }
+  showProjectSelect.value = true;
+}
+
+// 选择项目后创建会话
+async function handleProjectSelect(project: ProjectItem) {
+  showProjectSelect.value = false;
+  currentSession.value = {
+    sessionId: "",
+    sessionTitle: "新对话",
+    projectId: Number(project.id),
+    projectName: project.projectName || "",
+    lastMessageTime: new Date().toISOString(),
+    messageCount: 0,
+    createTime: new Date().toISOString()
+  };
+  messages.value = [];
+  streamingMessage.value = "";
+  streamingReferences.value = [];
+}
+
+// 发送消息
+async function sendMessage() {
+  if (!inputMessage.value.trim() || sending.value) return;
+
+  const message = inputMessage.value.trim();
+  inputMessage.value = "";
+
+  // 如果没有会话，需要先创建
+  if (!currentSession.value?.projectId) {
+    ElMessage.warning("请先选择项目");
+    return;
+  }
+
+  // 添加用户消息
+  const userMessage: ChatMessageVO = {
+    id: Date.now(),
+    role: "user",
+    content: message,
+    messageIndex: messages.value.length + 1,
+    createTime: new Date().toISOString()
+  };
+  messages.value.push(userMessage);
+
+  sending.value = true;
+  streamingMessage.value = "";
+  streamingReferences.value = [];
+
+  // 建立SSE连接
+  const sseUrl = buildSSEUrl({
+    sessionId: currentSession.value.sessionId || undefined,
+    projectId: currentSession.value.projectId,
+    message: message,
+    useRag: true
+  });
+
+  // 关闭之前的连接
+  if (eventSource) {
+    eventSource.close();
+    eventSource = null;
+  }
+
+  eventSource = new EventSource(sseUrl);
+
+  eventSource.addEventListener("start", (e: MessageEvent) => {
+    const data: SSEStartData = JSON.parse(e.data);
+    if (data.isNewSession || !currentSession.value.sessionId) {
+      currentSession.value = {
+        ...currentSession.value,
+        sessionId: data.sessionId,
+        sessionTitle: message.slice(0, 20)
+      };
+      loadSessions(currentSession.value.projectId);
+    }
+  });
+
+  eventSource.addEventListener("chunk", (e: MessageEvent) => {
+    const data: SSEChunkData = JSON.parse(e.data);
+    streamingMessage.value += data.content;
+    scrollToBottom();
+  });
+
+  eventSource.addEventListener("references", (e: MessageEvent) => {
+    const data: SSEReferencesData = JSON.parse(e.data);
+    streamingReferences.value = data.docs || [];
+  });
+
+  eventSource.addEventListener("complete", (e: MessageEvent) => {
+    const data: SSECompleteData = JSON.parse(e.data);
+
+    // 添加AI回复消息
+    const assistantMessage: ChatMessageVO = {
+      id: data.messageId,
+      role: "assistant",
+      content: streamingMessage.value,
+      referencedDocs: streamingReferences.value,
+      tokensUsed: data.tokensUsed,
+      messageIndex: messages.value.length + 1,
+      createTime: new Date().toISOString()
+    };
+    messages.value.push(assistantMessage);
+
+    // 重置状态
+    streamingMessage.value = "";
+    streamingReferences.value = [];
+    sending.value = false;
+
+    eventSource?.close();
+    eventSource = null;
+
+    loadSessions(currentSession.value?.projectId);
+    scrollToBottom();
+  });
+
+  eventSource.addEventListener("error", (e: MessageEvent) => {
+    const data: SSEErrorData = JSON.parse(e.data);
+    ElMessage.error(data.message || "对话发生错误");
+    sending.value = false;
+    streamingMessage.value = "";
+    streamingReferences.value = [];
+    eventSource?.close();
+    eventSource = null;
+  });
+
+  eventSource.onerror = () => {
+    ElMessage.error("连接服务器失败");
+    sending.value = false;
+    streamingMessage.value = "";
+    streamingReferences.value = [];
+    eventSource?.close();
+    eventSource = null;
+  };
+}
+
+// 删除会话
+async function handleDeleteSession(session: ChatSessionVO) {
+  try {
+    await ElMessageBox.confirm("确定要删除这个会话吗？", "提示", {
+      confirmButtonText: "确定",
+      cancelButtonText: "取消",
+      type: "warning"
+    });
+
+    const res = await deleteChatSession(session.sessionId);
+    if (res.code === 200) {
+      ElMessage.success("删除成功");
+      loadSessions(currentSession.value?.projectId);
+
+      if (currentSession.value?.sessionId === session.sessionId) {
+        currentSession.value = null;
+        messages.value = [];
+      }
+    }
+  } catch (error) {
+    if (error !== "cancel") {
+      console.error("删除会话失败:", error);
+    }
+  }
+}
+
+// 滚动到底部
+function scrollToBottom() {
+  nextTick(() => {
+    if (messagesContainer.value) {
+      messagesContainer.value.scrollTop = messagesContainer.value.scrollHeight;
+    }
+  });
+}
+
+// 格式化时间
+function formatTime(time: string) {
+  return dayjs(time).format("MM-DD HH:mm");
+}
+
+// 格式化文件大小
+function formatFileSize(bytes: number) {
+  if (bytes < 1024) return bytes + " B";
+  if (bytes < 1024 * 1024) return (bytes / 1024).toFixed(1) + " KB";
+  return (bytes / (1024 * 1024)).toFixed(1) + " MB";
+}
+
+// 组件卸载时关闭SSE连接
+onUnmounted(() => {
+  if (eventSource) {
+    eventSource.close();
+    eventSource = null;
+  }
+});
+
+// 初始化加载
+loadProjects();
+</script>
+
+<template>
+  <div class="ai-chat-container">
+    <!-- 左侧会话列表 -->
+    <div class="session-sidebar">
+      <div class="sidebar-header">
+        <h3>AI 助手</h3>
+        <el-button
+          type="primary"
+          :icon="useRenderIcon(AddIcon)"
+          @click="createNewSession"
+        >
+          新对话
+        </el-button>
+      </div>
+
+      <!-- 项目选择 -->
+      <div v-if="showProjectSelect" class="project-select-panel">
+        <div class="panel-header">
+          <span>选择项目</span>
+          <el-button link @click="showProjectSelect = false">
+            <component :is="useRenderIcon('ri/close-line')" />
+          </el-button>
+        </div>
+        <el-scrollbar height="300px">
+          <div
+            v-for="project in projects"
+            :key="project.id"
+            class="project-item"
+            @click="handleProjectSelect(project)"
+          >
+            <component :is="useRenderIcon('ri/folder-line')" class="mr-2" />
+            {{ project.projectName }}
+          </div>
+        </el-scrollbar>
+      </div>
+
+      <!-- 会话列表 -->
+      <el-scrollbar class="session-list">
+        <div v-if="loading" class="loading-placeholder">
+          <el-icon class="is-loading"
+            ><component :is="useRenderIcon('ri/loader-4-line')"
+          /></el-icon>
+          <span>加载中...</span>
+        </div>
+        <template v-else>
+          <div
+            v-for="session in sessions"
+            :key="session.sessionId"
+            :class="[
+              'session-item',
+              { active: currentSession?.sessionId === session.sessionId }
+            ]"
+            @click="selectSession(session)"
+          >
+            <div class="session-info">
+              <div class="session-title">{{ session.sessionTitle }}</div>
+              <div class="session-meta">
+                <span>{{ session.projectName }}</span>
+                <span>{{ formatTime(session.lastMessageTime) }}</span>
+              </div>
+            </div>
+            <el-button
+              link
+              class="delete-btn"
+              @click.stop="handleDeleteSession(session)"
+            >
+              <component :is="useRenderIcon(DeleteIcon)" />
+            </el-button>
+          </div>
+          <el-empty
+            v-if="sessions.length === 0"
+            description="暂无会话"
+            :image-size="80"
+          />
+        </template>
+      </el-scrollbar>
+    </div>
+
+    <!-- 右侧聊天区域 -->
+    <div class="chat-main">
+      <template v-if="currentSession">
+        <!-- 会话头部 -->
+        <div class="chat-header">
+          <div class="header-info">
+            <h4>{{ currentSession.sessionTitle }}</h4>
+            <span class="project-name">{{ currentSession.projectName }}</span>
+          </div>
+          <el-button
+            :icon="useRenderIcon(RefreshIcon)"
+            @click="loadMessages(currentSession.sessionId)"
+          >
+            刷新
+          </el-button>
+        </div>
+
+        <!-- 消息列表 -->
+        <div ref="messagesContainer" class="messages-container">
+          <div
+            v-for="msg in messages"
+            :key="msg.id"
+            :class="['message-item', msg.role]"
+          >
+            <div class="message-avatar">
+              <el-avatar v-if="msg.role === 'user'" :size="32">
+                <component :is="useRenderIcon('ri/user-line')" />
+              </el-avatar>
+              <el-avatar
+                v-else
+                :size="32"
+                style="
+                  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+                "
+              >
+                <component :is="useRenderIcon('ri/robot-line')" />
+              </el-avatar>
+            </div>
+            <div class="message-content">
+              <div
+                class="message-text"
+                v-html="msg.content.replace(/\n/g, '<br>')"
+              />
+              <!-- 引用文档 -->
+              <div v-if="msg.referencedDocs?.length" class="referenced-docs">
+                <div class="ref-title">
+                  <component :is="useRenderIcon(DocumentIcon)" />
+                  参考文档
+                </div>
+                <div
+                  v-for="doc in msg.referencedDocs"
+                  :key="doc.id"
+                  class="ref-doc"
+                >
+                  <span class="doc-title">{{ doc.title }}</span>
+                  <el-tag size="small" type="info"
+                    >相关度: {{ (doc.score * 100).toFixed(0) }}%</el-tag
+                  >
+                </div>
+              </div>
+              <div class="message-time">{{ formatTime(msg.createTime) }}</div>
+            </div>
+          </div>
+
+          <!-- 流式输出中的消息 -->
+          <div v-if="streamingMessage" class="message-item assistant streaming">
+            <div class="message-avatar">
+              <el-avatar
+                :size="32"
+                style="
+                  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+                "
+              >
+                <component :is="useRenderIcon('ri/robot-line')" />
+              </el-avatar>
+            </div>
+            <div class="message-content">
+              <div
+                class="message-text"
+                v-html="streamingMessage.replace(/\n/g, '<br>')"
+              />
+              <div v-if="streamingReferences.length" class="referenced-docs">
+                <div class="ref-title">
+                  <component :is="useRenderIcon(DocumentIcon)" />
+                  参考文档
+                </div>
+                <div
+                  v-for="doc in streamingReferences"
+                  :key="doc.id"
+                  class="ref-doc"
+                >
+                  <span class="doc-title">{{ doc.title }}</span>
+                  <el-tag size="small" type="info"
+                    >相关度: {{ (doc.score * 100).toFixed(0) }}%</el-tag
+                  >
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <!-- 输入区域 -->
+        <div class="input-area">
+          <el-input
+            v-model="inputMessage"
+            type="textarea"
+            :rows="3"
+            placeholder="输入您的问题..."
+            :disabled="sending"
+            @keydown.enter.ctrl="sendMessage"
+          />
+          <div class="input-actions">
+            <span class="tip">Ctrl + Enter 发送</span>
+            <el-button
+              type="primary"
+              :icon="useRenderIcon(SendIcon)"
+              :loading="sending"
+              :disabled="!inputMessage.trim()"
+              @click="sendMessage"
+            >
+              发送
+            </el-button>
+          </div>
+        </div>
+      </template>
+
+      <!-- 未选择会话时的提示 -->
+      <div v-else class="empty-chat">
+        <div class="empty-icon">
+          <component
+            :is="useRenderIcon('ri/chat-3-line')"
+            style="font-size: 64px; color: var(--el-color-primary)"
+          />
+        </div>
+        <h3>开始新的对话</h3>
+        <p class="text-gray-400">选择一个项目开始与AI助手对话</p>
+        <el-button type="primary" class="mt-4" @click="createNewSession">
+          <template #icon>
+            <component :is="useRenderIcon(AddIcon)" />
+          </template>
+          新建对话
+        </el-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.ai-chat-container {
+  display: flex;
+  height: calc(100vh - 100px);
+  overflow: hidden;
+  background: var(--el-bg-color);
+  border-radius: 8px;
+}
+
+.session-sidebar {
+  display: flex;
+  flex-direction: column;
+  width: 280px;
+  background: var(--el-fill-color-blank);
+  border-right: 1px solid var(--el-border-color-light);
+
+  .sidebar-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 16px;
+    border-bottom: 1px solid var(--el-border-color-light);
+
+    h3 {
+      margin: 0;
+      font-size: 16px;
+    }
+  }
+
+  .project-select-panel {
+    border-bottom: 1px solid var(--el-border-color-light);
+
+    .panel-header {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding: 12px 16px;
+      font-weight: 500;
+    }
+
+    .project-item {
+      display: flex;
+      align-items: center;
+      padding: 12px 16px;
+      cursor: pointer;
+      transition: background 0.2s;
+
+      &:hover {
+        background: var(--el-fill-color-light);
+      }
+    }
+  }
+
+  .session-list {
+    flex: 1;
+    overflow: auto;
+  }
+
+  .loading-placeholder {
+    padding: 20px;
+    color: var(--el-text-color-secondary);
+    text-align: center;
+  }
+
+  .session-item {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 12px 16px;
+    cursor: pointer;
+    border-bottom: 1px solid var(--el-border-color-lighter);
+    transition: background 0.2s;
+
+    &:hover {
+      background: var(--el-fill-color-light);
+    }
+
+    &.active {
+      background: var(--el-color-primary-light-9);
+    }
+
+    .session-info {
+      flex: 1;
+      min-width: 0;
+    }
+
+    .session-title {
+      overflow: hidden;
+      text-overflow: ellipsis;
+      font-weight: 500;
+      white-space: nowrap;
+    }
+
+    .session-meta {
+      display: flex;
+      justify-content: space-between;
+      margin-top: 4px;
+      font-size: 12px;
+      color: var(--el-text-color-secondary);
+    }
+
+    .delete-btn {
+      opacity: 0;
+      transition: opacity 0.2s;
+    }
+
+    &:hover .delete-btn {
+      opacity: 1;
+    }
+  }
+}
+
+.chat-main {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  min-width: 0;
+
+  .chat-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 16px 20px;
+    border-bottom: 1px solid var(--el-border-color-light);
+
+    .header-info {
+      h4 {
+        margin: 0;
+        font-size: 16px;
+      }
+
+      .project-name {
+        margin-left: 8px;
+        font-size: 12px;
+        color: var(--el-text-color-secondary);
+      }
+    }
+  }
+
+  .messages-container {
+    flex: 1;
+    padding: 20px;
+    overflow: auto;
+
+    .message-item {
+      display: flex;
+      margin-bottom: 20px;
+
+      &.user {
+        flex-direction: row-reverse;
+
+        .message-content {
+          align-items: flex-end;
+        }
+
+        .message-text {
+          color: #fff;
+          background: var(--el-color-primary);
+        }
+      }
+
+      &.streaming {
+        .message-text {
+          background: var(--el-fill-color);
+        }
+      }
+
+      .message-avatar {
+        flex-shrink: 0;
+        margin: 0 12px;
+      }
+
+      .message-content {
+        display: flex;
+        flex-direction: column;
+        max-width: 70%;
+
+        .message-text {
+          padding: 12px 16px;
+          line-height: 1.6;
+          overflow-wrap: break-word;
+          background: var(--el-fill-color);
+          border-radius: 12px;
+        }
+
+        .referenced-docs {
+          padding: 8px 12px;
+          margin-top: 8px;
+          background: var(--el-fill-color-lighter);
+          border-radius: 8px;
+
+          .ref-title {
+            display: flex;
+            gap: 4px;
+            align-items: center;
+            margin-bottom: 8px;
+            font-size: 12px;
+            color: var(--el-text-color-secondary);
+          }
+
+          .ref-doc {
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            padding: 4px 0;
+            font-size: 13px;
+
+            .doc-title {
+              flex: 1;
+              margin-right: 8px;
+              overflow: hidden;
+              text-overflow: ellipsis;
+              white-space: nowrap;
+            }
+          }
+        }
+
+        .message-time {
+          margin-top: 4px;
+          font-size: 12px;
+          color: var(--el-text-color-secondary);
+        }
+      }
+    }
+  }
+
+  .input-area {
+    padding: 16px 20px;
+    background: var(--el-fill-color-blank);
+    border-top: 1px solid var(--el-border-color-light);
+
+    .input-actions {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      margin-top: 12px;
+
+      .tip {
+        font-size: 12px;
+        color: var(--el-text-color-secondary);
+      }
+    }
+  }
+}
+
+.empty-chat {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+
+  .empty-icon {
+    margin-bottom: 16px;
+  }
+
+  h3 {
+    margin: 0 0 8px;
+  }
+}
+</style>

src/views/knowledge-base/index.vue

@@ -0,0 +1,508 @@
+<script setup lang="ts">
+import { ref, onMounted, watch } from "vue";
+import { ElMessage, ElMessageBox } from "element-plus";
+import { useRenderIcon } from "@/components/ReIcon/src/hooks";
+import {
+  getDocuments,
+  uploadDocument,
+  deleteDocument,
+  reindexDocument,
+  type KbDocumentVO,
+  type DocumentStatus
+} from "@/api/ai-chat";
+import { getProjectList, type ProjectItem } from "@/api/project";
+import dayjs from "dayjs";
+
+import UploadIcon from "~icons/ri/upload-2-line";
+import RefreshIcon from "~icons/ri/refresh-line";
+import DeleteIcon from "~icons/ep/delete";
+import ReIndexIcon from "~icons/ri/restart-line";
+import FileIcon from "~icons/ri/file-text-line";
+import PdfIcon from "~icons/ri/file-pdf-line";
+import DocIcon from "~icons/ri/file-word-line";
+import TxtIcon from "~icons/ri/file-text-line";
+
+defineOptions({
+  name: "KnowledgeBase"
+});
+
+// 状态
+const loading = ref(false);
+const uploading = ref(false);
+const documents = ref<KbDocumentVO[]>([]);
+const projects = ref<ProjectItem[]>([]);
+const selectedProjectId = ref<number | undefined>();
+const projectLoading = ref(false);
+
+// 上传相关
+const uploadDialogVisible = ref(false);
+const uploadFileList = ref<File[]>([]);
+const fileInputRef = ref<HTMLInputElement | null>(null);
+
+// 加载项目列表
+async function loadProjects() {
+  projectLoading.value = true;
+  try {
+    const res = await getProjectList({ pageNum: 1, pageSize: 100 });
+    if (res.code === 200) {
+      projects.value = res.data?.rows || [];
+      if (projects.value.length > 0 && !selectedProjectId.value) {
+        selectedProjectId.value = Number(projects.value[0].id);
+      }
+    }
+  } catch (error) {
+    console.error("加载项目列表失败:", error);
+  } finally {
+    projectLoading.value = false;
+  }
+}
+
+// 加载文档列表
+async function loadDocuments() {
+  if (!selectedProjectId.value) return;
+
+  loading.value = true;
+  try {
+    const res = await getDocuments(selectedProjectId.value);
+    if (res.code === 200) {
+      documents.value = res.data || [];
+    }
+  } catch (error) {
+    console.error("加载文档列表失败:", error);
+  } finally {
+    loading.value = false;
+  }
+}
+
+// 项目变更时重新加载文档
+watch(selectedProjectId, () => {
+  loadDocuments();
+});
+
+// 打开上传对话框
+function openUploadDialog() {
+  uploadFileList.value = [];
+  uploadDialogVisible.value = true;
+}
+
+// 选择文件
+function handleFileSelect(event: Event) {
+  const target = event.target as HTMLInputElement;
+  if (target.files) {
+    const files = Array.from(target.files);
+    // 过滤支持的文件类型
+    const supportedTypes = ["pdf", "doc", "docx", "txt", "md"];
+    const validFiles = files.filter(file => {
+      const ext = file.name.split(".").pop()?.toLowerCase();
+      return supportedTypes.includes(ext || "");
+    });
+
+    if (validFiles.length !== files.length) {
+      ElMessage.warning(
+        "部分文件格式不支持，仅支持 PDF、Word、TXT、Markdown 格式"
+      );
+    }
+
+    uploadFileList.value = [...uploadFileList.value, ...validFiles];
+  }
+}
+
+// 移除文件
+function removeFile(index: number) {
+  uploadFileList.value.splice(index, 1);
+}
+
+// 上传文件
+async function handleUpload() {
+  if (uploadFileList.value.length === 0) {
+    ElMessage.warning("请选择要上传的文件");
+    return;
+  }
+
+  if (!selectedProjectId.value) {
+    ElMessage.warning("请先选择项目");
+    return;
+  }
+
+  uploading.value = true;
+  let successCount = 0;
+  let failCount = 0;
+
+  for (const file of uploadFileList.value) {
+    try {
+      const res = await uploadDocument({
+        projectId: selectedProjectId.value,
+        file
+      });
+      if (res.code === 200) {
+        successCount++;
+      } else {
+        failCount++;
+      }
+    } catch (error) {
+      failCount++;
+      console.error(`上传文件 ${file.name} 失败:`, error);
+    }
+  }
+
+  uploading.value = false;
+  uploadDialogVisible.value = false;
+
+  if (successCount > 0) {
+    ElMessage.success(`成功上传 ${successCount} 个文件`);
+    loadDocuments();
+  }
+  if (failCount > 0) {
+    ElMessage.error(`${failCount} 个文件上传失败`);
+  }
+}
+
+// 删除文档
+async function handleDelete(doc: KbDocumentVO) {
+  try {
+    await ElMessageBox.confirm(
+      "确定要删除这个文档吗？删除后将无法恢复。",
+      "提示",
+      {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      }
+    );
+
+    const res = await deleteDocument(doc.docId);
+    if (res.code === 200) {
+      ElMessage.success("删除成功");
+      loadDocuments();
+    }
+  } catch (error) {
+    if (error !== "cancel") {
+      console.error("删除文档失败:", error);
+    }
+  }
+}
+
+// 重新索引文档
+async function handleReindex(doc: KbDocumentVO) {
+  try {
+    const res = await reindexDocument(doc.docId);
+    if (res.code === 200) {
+      ElMessage.success("重新索引已启动");
+      loadDocuments();
+    }
+  } catch (error) {
+    console.error("重新索引失败:", error);
+    ElMessage.error("重新索引失败");
+  }
+}
+
+// 获取状态标签类型
+function getStatusType(
+  status: DocumentStatus
+): "success" | "warning" | "info" | "danger" {
+  switch (status) {
+    case "active":
+      return "success";
+    case "processing":
+      return "warning";
+    case "error":
+      return "danger";
+    default:
+      return "info";
+  }
+}
+
+// 获取状态文本
+function getStatusText(status: DocumentStatus): string {
+  switch (status) {
+    case "pending":
+      return "待处理";
+    case "processing":
+      return "处理中";
+    case "active":
+      return "可用";
+    case "error":
+      return "处理失败";
+    default:
+      return "未知";
+  }
+}
+
+// 获取文件图标
+function getFileIcon(fileType: string) {
+  const type = fileType.toLowerCase();
+  if (type === "pdf") return PdfIcon;
+  if (["doc", "docx"].includes(type)) return DocIcon;
+  if (type === "txt") return TxtIcon;
+  return FileIcon;
+}
+
+// 格式化文件大小
+function formatFileSize(bytes: number): string {
+  if (bytes < 1024) return bytes + " B";
+  if (bytes < 1024 * 1024) return (bytes / 1024).toFixed(1) + " KB";
+  return (bytes / (1024 * 1024)).toFixed(1) + " MB";
+}
+
+// 格式化时间
+function formatTime(time: string): string {
+  return dayjs(time).format("YYYY-MM-DD HH:mm");
+}
+
+// 初始化
+onMounted(() => {
+  loadProjects();
+});
+</script>
+
+<template>
+  <div class="knowledge-base-container">
+    <!-- 页面标题 -->
+    <div class="page-header">
+      <div>
+        <h2 class="text-xl font-bold">项目知识库</h2>
+        <p class="text-gray-500 text-sm mt-1">
+          管理项目相关文档，为AI对话提供知识支持
+        </p>
+      </div>
+      <div class="header-actions">
+        <el-button :icon="useRenderIcon(RefreshIcon)" @click="loadDocuments">
+          刷新
+        </el-button>
+        <el-button
+          type="primary"
+          :icon="useRenderIcon(UploadIcon)"
+          @click="openUploadDialog"
+        >
+          上传文档
+        </el-button>
+      </div>
+    </div>
+
+    <!-- 项目选择 -->
+    <el-card shadow="never" class="mb-4">
+      <div class="flex items-center gap-4">
+        <span class="text-gray-600">选择项目：</span>
+        <el-select
+          v-model="selectedProjectId"
+          placeholder="请选择项目"
+          style="width: 300px"
+          @change="loadDocuments"
+        >
+          <el-option
+            v-for="project in projects"
+            :key="project.id"
+            :label="project.projectName"
+            :value="Number(project.id)"
+          />
+        </el-select>
+      </div>
+    </el-card>
+
+    <!-- 文档列表 -->
+    <el-card shadow="never">
+      <template #header>
+        <div class="flex-bc">
+          <span>文档列表</span>
+          <span class="text-gray-400 text-sm"
+            >共 {{ documents.length }} 个文档</span
+          >
+        </div>
+      </template>
+
+      <el-table v-loading="loading" :data="documents" stripe>
+        <el-table-column label="文档名称" min-width="200">
+          <template #default="{ row }">
+            <div class="flex items-center gap-2">
+              <component
+                :is="useRenderIcon(getFileIcon(row.fileType))"
+                :size="20"
+                class="text-gray-400"
+              />
+              <span class="truncate">{{ row.title }}</span>
+            </div>
+          </template>
+        </el-table-column>
+
+        <el-table-column label="文件类型" width="100" align="center">
+          <template #default="{ row }">
+            <el-tag size="small" type="info">{{
+              row.fileType.toUpperCase()
+            }}</el-tag>
+          </template>
+        </el-table-column>
+
+        <el-table-column label="文件大小" width="100" align="center">
+          <template #default="{ row }">
+            {{ formatFileSize(row.fileSize) }}
+          </template>
+        </el-table-column>
+
+        <el-table-column label="分块数量" width="100" align="center">
+          <template #default="{ row }">
+            {{ row.chunkCount || 0 }}
+          </template>
+        </el-table-column>
+
+        <el-table-column label="状态" width="100" align="center">
+          <template #default="{ row }">
+            <el-tag :type="getStatusType(row.status)" size="small">
+              {{ getStatusText(row.status) }}
+            </el-tag>
+          </template>
+        </el-table-column>
+
+        <el-table-column label="上传者" width="100" align="center">
+          <template #default="{ row }">
+            {{ row.createByName }}
+          </template>
+        </el-table-column>
+
+        <el-table-column label="上传时间" width="160" align="center">
+          <template #default="{ row }">
+            {{ formatTime(row.createTime) }}
+          </template>
+        </el-table-column>
+
+        <el-table-column label="操作" width="180" align="center" fixed="right">
+          <template #default="{ row }">
+            <el-button
+              v-if="row.status === 'active' || row.status === 'error'"
+              link
+              type="primary"
+              @click="handleReindex(row)"
+            >
+              <component :is="useRenderIcon(ReIndexIcon)" class="mr-1" />
+              重新索引
+            </el-button>
+            <el-button link type="danger" @click="handleDelete(row)">
+              <component :is="useRenderIcon(DeleteIcon)" class="mr-1" />
+              删除
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <el-empty
+        v-if="!loading && documents.length === 0"
+        description="暂无文档"
+      >
+        <el-button type="primary" @click="openUploadDialog">
+          <template #icon>
+            <component :is="useRenderIcon(UploadIcon)" />
+          </template>
+          上传文档
+        </el-button>
+      </el-empty>
+    </el-card>
+
+    <!-- 上传对话框 -->
+    <el-dialog
+      v-model="uploadDialogVisible"
+      title="上传文档"
+      width="500px"
+      :close-on-click-modal="false"
+    >
+      <div class="upload-content">
+        <div
+          class="upload-area"
+          @click="fileInputRef?.click()"
+          @dragover.prevent
+          @drop.prevent="handleFileSelect"
+        >
+          <input
+            ref="fileInputRef"
+            type="file"
+            multiple
+            accept=".pdf,.doc,.docx,.txt,.md"
+            style="display: none"
+            @change="handleFileSelect"
+          />
+          <component
+            :is="useRenderIcon(UploadIcon)"
+            style="font-size: 48px; color: var(--el-color-primary)"
+          />
+          <p class="mt-4 text-gray-500">点击或拖拽文件到此处上传</p>
+          <p class="text-xs text-gray-400 mt-2">
+            支持 PDF、Word、TXT、Markdown 格式，单个文件最大 50MB
+          </p>
+        </div>
+
+        <div v-if="uploadFileList.length > 0" class="file-list mt-4">
+          <div
+            v-for="(file, index) in uploadFileList"
+            :key="index"
+            class="file-item"
+          >
+            <div class="flex items-center gap-2">
+              <component :is="useRenderIcon(FileIcon)" />
+              <span class="flex-1 truncate">{{ file.name }}</span>
+              <span class="text-xs text-gray-400">{{
+                formatFileSize(file.size)
+              }}</span>
+              <el-button link type="danger" @click="removeFile(index)">
+                <component :is="useRenderIcon('ri/close-line')" />
+              </el-button>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <template #footer>
+        <el-button @click="uploadDialogVisible = false">取消</el-button>
+        <el-button type="primary" :loading="uploading" @click="handleUpload">
+          开始上传
+        </el-button>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.knowledge-base-container {
+  padding: 16px;
+
+  .page-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin-bottom: 16px;
+
+    .header-actions {
+      display: flex;
+      gap: 8px;
+    }
+  }
+
+  .upload-content {
+    .upload-area {
+      padding: 40px;
+      text-align: center;
+      cursor: pointer;
+      border: 2px dashed var(--el-border-color);
+      border-radius: 8px;
+      transition: border-color 0.2s;
+
+      &:hover {
+        border-color: var(--el-color-primary);
+      }
+    }
+
+    .file-list {
+      max-height: 200px;
+      overflow-y: auto;
+
+      .file-item {
+        padding: 8px 12px;
+        margin-bottom: 8px;
+        background: var(--el-fill-color-lighter);
+        border-radius: 4px;
+
+        &:last-child {
+          margin-bottom: 0;
+        }
+      }
+    }
+  }
+}
+</style>