From c9236cfff4aa2cb6fa6364f006918e8ba5a60665 Mon Sep 17 00:00:00 2001 From: susie-laptop Date: Wed, 12 Mar 2025 21:14:25 -0400 Subject: [PATCH] [dev]connect knowledgebase & chat api --- src/components/AccessRequestModal.jsx | 199 +++++++++++ src/components/CreateKnowledgeBaseModal.jsx | 168 +++++++++ .../components/Pagination.jsx | 8 +- src/components/SearchBar.jsx | 42 +++ src/pages/Chat/Chat.jsx | 60 ++-- src/pages/Chat/ChatSidebar.jsx | 123 ++++--- src/pages/Chat/ChatWindow.jsx | 201 +++++------ src/pages/Chat/NewChat.jsx | 106 +++--- .../KnowledgeBase/Detail/SettingsTab.jsx | 4 + .../Detail/components/FileUploadModal.jsx | 4 +- .../Detail/components/KnowledgeBaseForm.jsx | 31 ++ src/pages/KnowledgeBase/KnowledgeBase.jsx | 320 +++++------------- .../components/CreateKnowledgeBaseModal.jsx | 92 ----- .../components/KnowledgeBaseList.jsx | 3 +- .../components/KnowledgeCard.jsx | 25 +- .../KnowledgeBase/components/SearchBar.jsx | 29 -- src/pages/auth/Login.jsx | 4 +- src/services/api.js | 45 --- src/services/mockApi.js | 192 +++++++++-- src/store/auth/auth.mock.js | 13 + src/store/auth/auth.slice.js | 7 +- src/store/auth/auth.thunk.js | 2 +- src/store/chat/chat.messages.thunks.js | 45 +++ src/store/chat/chat.slice.js | 190 +++++++++++ src/store/chat/chat.thunks.js | 87 +++++ src/store/chatHistory/chatHistory.mock.js | 153 +++++++++ src/store/chatHistory/chatHistory.slice.js | 130 +++++++ src/store/chatHistory/chatHistory.thunks.js | 87 +++++ .../knowledgeBase/knowledgeBase.thunks.js | 12 + src/store/store.js | 2 + 30 files changed, 1736 insertions(+), 648 deletions(-) create mode 100644 src/components/AccessRequestModal.jsx create mode 100644 src/components/CreateKnowledgeBaseModal.jsx rename src/{pages/KnowledgeBase => }/components/Pagination.jsx (84%) create mode 100644 src/components/SearchBar.jsx delete mode 100644 src/pages/KnowledgeBase/components/CreateKnowledgeBaseModal.jsx delete mode 100644 src/pages/KnowledgeBase/components/SearchBar.jsx create mode 100644 src/store/auth/auth.mock.js create mode 100644 src/store/chat/chat.messages.thunks.js create mode 100644 src/store/chat/chat.slice.js create mode 100644 src/store/chat/chat.thunks.js create mode 100644 src/store/chatHistory/chatHistory.mock.js create mode 100644 src/store/chatHistory/chatHistory.slice.js create mode 100644 src/store/chatHistory/chatHistory.thunks.js diff --git a/src/components/AccessRequestModal.jsx b/src/components/AccessRequestModal.jsx new file mode 100644 index 0000000..5dc4da6 --- /dev/null +++ b/src/components/AccessRequestModal.jsx @@ -0,0 +1,199 @@ +import React, { useState } from 'react'; +import SvgIcon from './SvgIcon'; + +/** + * 申请权限弹窗组件 + * @param {Object} props + * @param {boolean} props.show - 是否显示弹窗 + * @param {string} props.knowledgeBaseId - 知识库ID + * @param {string} props.knowledgeBaseTitle - 知识库标题 + * @param {Function} props.onClose - 关闭弹窗的回调函数 + * @param {Function} props.onSubmit - 提交申请的回调函数，接收 requestData 参数 + * @param {boolean} props.isSubmitting - 是否正在提交 + */ +export default function AccessRequestModal({ + show, + knowledgeBaseId, + knowledgeBaseTitle, + onClose, + onSubmit, + isSubmitting = false, +}) { + const [accessRequestData, setAccessRequestData] = useState({ + accessType: '只读访问', + duration: '一周', + reason: '', + }); + const [accessRequestErrors, setAccessRequestErrors] = useState({}); + + const handleAccessRequestInputChange = (e) => { + const { name, value } = e.target; + setAccessRequestData((prev) => ({ + ...prev, + [name]: value, + })); + + // Clear error when user types + if (accessRequestErrors[name]) { + setAccessRequestErrors((prev) => ({ + ...prev, + [name]: '', + })); + } + }; + + const validateAccessRequestForm = () => { + const errors = {}; + + if (!accessRequestData.reason.trim()) { + errors.reason = '请输入申请原因'; + } + + setAccessRequestErrors(errors); + return Object.keys(errors).length === 0; + }; + + const handleSubmitAccessRequest = () => { + // Validate form + if (!validateAccessRequestForm()) { + return; + } + + // 调用父组件的提交函数 + onSubmit({ + id: knowledgeBaseId, + title: knowledgeBaseTitle, + ...accessRequestData, + }); + + // 重置表单 + setAccessRequestData({ + accessType: '只读访问', + duration: '一周', + reason: '', + }); + setAccessRequestErrors({}); + }; + + if (!show) return null; + + return ( +
+
+
+
申请访问权限
+ +
+
+
+ + +
+
+ + +
+ +
+ + +
+
+ + + {accessRequestErrors.reason && ( +
{accessRequestErrors.reason}
+ )} +
+
+
+ + +
+
+
+ ); +} diff --git a/src/components/CreateKnowledgeBaseModal.jsx b/src/components/CreateKnowledgeBaseModal.jsx new file mode 100644 index 0000000..4402387 --- /dev/null +++ b/src/components/CreateKnowledgeBaseModal.jsx @@ -0,0 +1,168 @@ +import React from 'react'; +import SvgIcon from './SvgIcon'; + +/** + * 创建知识库模态框组件 + * @param {Object} props + * @param {boolean} props.show - 是否显示弹窗 + * @param {Object} props.formData - 表单数据 + * @param {Object} props.formErrors - 表单错误信息 + * @param {boolean} props.isSubmitting - 是否正在提交 + * @param {Function} props.onClose - 关闭弹窗的回调函数 + * @param {Function} props.onChange - 表单输入变化的回调函数 + * @param {Function} props.onSubmit - 提交表单的回调函数 + */ +const CreateKnowledgeBaseModal = ({ show, formData, formErrors, isSubmitting, onClose, onChange, onSubmit }) => { + if (!show) return null; + + return ( +
+
+
+
新建知识库
+ +
+
+
+ + + {formErrors.name &&
{formErrors.name}
} +
+
+ + + {formErrors.desc &&
{formErrors.desc}
} +
+
+ +
+
+ + +
+
+ + +
+
+ {formErrors.type &&
{formErrors.type}
} +
+
+ + +
+
+ + +
+
+
+ + +
+
+
+ ); +}; + +export default CreateKnowledgeBaseModal; diff --git a/src/pages/KnowledgeBase/components/Pagination.jsx b/src/components/Pagination.jsx similarity index 84% rename from src/pages/KnowledgeBase/components/Pagination.jsx rename to src/components/Pagination.jsx index 8c8f4b1..c819887 100644 --- a/src/pages/KnowledgeBase/components/Pagination.jsx +++ b/src/components/Pagination.jsx @@ -2,6 +2,12 @@ import React from 'react'; /** * 分页组件 + * @param {Object} props + * @param {number} props.currentPage - 当前页码 + * @param {number} props.totalPages - 总页数 + * @param {number} props.pageSize - 每页显示的条目数 + * @param {Function} props.onPageChange - 页码变化的回调函数 + * @param {Function} props.onPageSizeChange - 每页条目数变化的回调函数 */ const Pagination = ({ currentPage, totalPages, pageSize, onPageChange, onPageSizeChange }) => { return ( @@ -17,7 +23,7 @@ const Pagination = ({ currentPage, totalPages, pageSize, onPageChange, onPageSiz -