|
@@ -2,7 +2,7 @@ import * as React from 'react';
|
|
|
import { Link } from 'react-router-dom';
|
|
import { Link } from 'react-router-dom';
|
|
|
import { observer } from 'mobx-react';
|
|
import { observer } from 'mobx-react';
|
|
|
import { Button, Table, TableColumnsType, Modal, TablePaginationConfig, Row, Col, Card } from 'antd';
|
|
import { Button, Table, TableColumnsType, Modal, TablePaginationConfig, Row, Col, Card } from 'antd';
|
|
|
-import { PlusOutlined, EditOutlined, DeleteOutlined, CloseOutlined, BulbOutlined } from '@ant-design/icons';
|
|
|
|
|
|
|
+import { PlusOutlined, EditOutlined, DeleteOutlined, CloseOutlined, BulbOutlined, UpOutlined, DownOutlined } from '@ant-design/icons';
|
|
|
import InfoModal from './components/InfoModal';
|
|
import InfoModal from './components/InfoModal';
|
|
|
import dayjs from 'dayjs';
|
|
import dayjs from 'dayjs';
|
|
|
import store from './store';
|
|
import store from './store';
|
|
@@ -38,7 +38,20 @@ const KnowledgeLibList: React.FC = () => {
|
|
|
const [userInfoAll, setUserInfoAll] = React.useState<any>({});
|
|
const [userInfoAll, setUserInfoAll] = React.useState<any>({});
|
|
|
// 新手引导(知识库)整体可见性(持久化到 localStorage)
|
|
// 新手引导(知识库)整体可见性(持久化到 localStorage)
|
|
|
const [showGuide, setShowGuide] = React.useState<boolean>(() => localStorage.getItem('knowledgeGuideHidden') !== 'true');
|
|
const [showGuide, setShowGuide] = React.useState<boolean>(() => localStorage.getItem('knowledgeGuideHidden') !== 'true');
|
|
|
- const hideGuide = () => { localStorage.setItem('knowledgeGuideHidden', 'true'); setShowGuide(false); };
|
|
|
|
|
|
|
+ // 新手引导展开/折叠状态(持久化到 localStorage),默认展开
|
|
|
|
|
+ const [isGuideExpanded, setIsGuideExpanded] = React.useState<boolean>(() => {
|
|
|
|
|
+ const saved = localStorage.getItem('knowledgeGuideExpanded');
|
|
|
|
|
+ // 如果 localStorage 中没有值,默认展开(返回 true)
|
|
|
|
|
+ return saved === null ? true : saved === 'true';
|
|
|
|
|
+ });
|
|
|
|
|
+ const toggleGuide = () => {
|
|
|
|
|
+ setIsGuideExpanded(prev => {
|
|
|
|
|
+ const newValue = !prev;
|
|
|
|
|
+ // 保存到 localStorage
|
|
|
|
|
+ localStorage.setItem('knowledgeGuideExpanded', String(newValue));
|
|
|
|
|
+ return newValue;
|
|
|
|
|
+ });
|
|
|
|
|
+ };
|
|
|
React.useEffect(() => {
|
|
React.useEffect(() => {
|
|
|
init();
|
|
init();
|
|
|
const cFlag = LocalStorage.getStatusFlag('deepseek:knowledge:create');
|
|
const cFlag = LocalStorage.getStatusFlag('deepseek:knowledge:create');
|
|
@@ -247,66 +260,70 @@ const KnowledgeLibList: React.FC = () => {
|
|
|
{/* 新手使用提示区块(知识库) */}
|
|
{/* 新手使用提示区块(知识库) */}
|
|
|
{showGuide && (
|
|
{showGuide && (
|
|
|
<div style={{ padding: '12px 20px 12px 20px', background: '#fff' }}>
|
|
<div style={{ padding: '12px 20px 12px 20px', background: '#fff' }}>
|
|
|
- <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: 8 }}>
|
|
|
|
|
|
|
+ <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: isGuideExpanded ? 8 : 0 }}>
|
|
|
<div style={{ fontSize: 13, color: '#333', display: 'flex', alignItems: 'center', gap: 6 }}>
|
|
<div style={{ fontSize: 13, color: '#333', display: 'flex', alignItems: 'center', gap: 6 }}>
|
|
|
<BulbOutlined style={{ color: '#faad14' }} />
|
|
<BulbOutlined style={{ color: '#faad14' }} />
|
|
|
提示: 如何创建并管理自己的知识库?
|
|
提示: 如何创建并管理自己的知识库?
|
|
|
</div>
|
|
</div>
|
|
|
- <CloseOutlined onClick={hideGuide} style={{ color: '#999', cursor: 'pointer' }} />
|
|
|
|
|
|
|
+ <div onClick={toggleGuide} style={{ color: '#999', cursor: 'pointer', display: 'flex', alignItems: 'center' }}>
|
|
|
|
|
+ {isGuideExpanded ? <UpOutlined /> : <DownOutlined />}
|
|
|
|
|
+ </div>
|
|
|
</div>
|
|
</div>
|
|
|
- <Row gutter={12}>
|
|
|
|
|
- <Col xs={24} sm={24} md={12} lg={8}>
|
|
|
|
|
- <Card
|
|
|
|
|
- size="small"
|
|
|
|
|
- bordered={false}
|
|
|
|
|
- style={{
|
|
|
|
|
- background: 'linear-gradient(90deg, #e6f4ff 0%, #f0f7ff 100%)',
|
|
|
|
|
- boxShadow: '0 1px 2px rgba(0,0,0,0.04)',
|
|
|
|
|
- borderRadius: 8,
|
|
|
|
|
- height: '100%'
|
|
|
|
|
- }}
|
|
|
|
|
- bodyStyle={{ display: 'flex', flexDirection: 'column', justifyContent: 'space-between', minHeight: 80 }}
|
|
|
|
|
- title={<span style={{ fontWeight: 600 }}>创建知识库</span>}
|
|
|
|
|
- >
|
|
|
|
|
- <div style={{ color: '#666', fontSize: 12 }}>点击右上角“创建知识库”,按需填写名称与描述,当前仅创建空的知识库集合。</div>
|
|
|
|
|
- <div style={{ textAlign: 'right', color: '#1677ff', fontWeight: 600 }}>step 1</div>
|
|
|
|
|
- </Card>
|
|
|
|
|
- </Col>
|
|
|
|
|
- <Col xs={24} sm={24} md={12} lg={8}>
|
|
|
|
|
- <Card
|
|
|
|
|
- size="small"
|
|
|
|
|
- bordered={false}
|
|
|
|
|
- style={{
|
|
|
|
|
- background: 'linear-gradient(90deg, #e6fffb 0%, #f0fffe 100%)',
|
|
|
|
|
- boxShadow: '0 1px 2px rgba(0,0,0,0.04)',
|
|
|
|
|
- borderRadius: 8,
|
|
|
|
|
- height: '100%'
|
|
|
|
|
- }}
|
|
|
|
|
- bodyStyle={{ display: 'flex', flexDirection: 'column', justifyContent: 'space-between', minHeight: 80 }}
|
|
|
|
|
- title={<span style={{ fontWeight: 600 }}>上传文档与管理知识片段</span>}
|
|
|
|
|
- >
|
|
|
|
|
- <div style={{ color: '#666', fontSize: 12 }}>上传Word, Pdf等多种文档格式,支持图片 OCR,查看切片与索引状态,按需更新或删除,保持知识内容最新。</div>
|
|
|
|
|
- <div style={{ textAlign: 'right', color: '#1677ff', fontWeight: 600 }}>step 2</div>
|
|
|
|
|
- </Card>
|
|
|
|
|
- </Col>
|
|
|
|
|
- <Col xs={24} sm={24} md={12} lg={8}>
|
|
|
|
|
- <Card
|
|
|
|
|
- size="small"
|
|
|
|
|
- bordered={false}
|
|
|
|
|
- style={{
|
|
|
|
|
- background: 'linear-gradient(90deg, #fff7e6 0%, #fffaf0 100%)',
|
|
|
|
|
- boxShadow: '0 1px 2px rgba(0,0,0,0.04)',
|
|
|
|
|
- borderRadius: 8,
|
|
|
|
|
- height: '100%'
|
|
|
|
|
- }}
|
|
|
|
|
- bodyStyle={{ display: 'flex', flexDirection: 'column', justifyContent: 'space-between', minHeight: 80 }}
|
|
|
|
|
- title={<span style={{ fontWeight: 600 }}>创建RAG应用时引用知识库</span>}
|
|
|
|
|
- >
|
|
|
|
|
- <div style={{ color: '#666', fontSize: 12 }}>在RAG应用配置中选择此知识库参与检索问答。</div>
|
|
|
|
|
- <div style={{ textAlign: 'right', color: '#1677ff', fontWeight: 600 }}>step 3</div>
|
|
|
|
|
- </Card>
|
|
|
|
|
- </Col>
|
|
|
|
|
- </Row>
|
|
|
|
|
|
|
+ {isGuideExpanded && (
|
|
|
|
|
+ <Row gutter={12}>
|
|
|
|
|
+ <Col xs={24} sm={24} md={12} lg={8}>
|
|
|
|
|
+ <Card
|
|
|
|
|
+ size="small"
|
|
|
|
|
+ bordered={false}
|
|
|
|
|
+ style={{
|
|
|
|
|
+ background: 'linear-gradient(90deg, #e6f4ff 0%, #f0f7ff 100%)',
|
|
|
|
|
+ boxShadow: '0 1px 2px rgba(0,0,0,0.04)',
|
|
|
|
|
+ borderRadius: 8,
|
|
|
|
|
+ height: '100%'
|
|
|
|
|
+ }}
|
|
|
|
|
+ bodyStyle={{ display: 'flex', flexDirection: 'column', justifyContent: 'space-between', minHeight: 80 }}
|
|
|
|
|
+ title={<span style={{ fontWeight: 600 }}>创建知识库</span>}
|
|
|
|
|
+ >
|
|
|
|
|
+ <div style={{ color: '#666', fontSize: 12 }}>点击右上角"创建知识库",按需填写名称与描述,当前仅创建空的知识库集合。</div>
|
|
|
|
|
+ <div style={{ textAlign: 'right', color: '#1677ff', fontWeight: 600 }}>step 1</div>
|
|
|
|
|
+ </Card>
|
|
|
|
|
+ </Col>
|
|
|
|
|
+ <Col xs={24} sm={24} md={12} lg={8}>
|
|
|
|
|
+ <Card
|
|
|
|
|
+ size="small"
|
|
|
|
|
+ bordered={false}
|
|
|
|
|
+ style={{
|
|
|
|
|
+ background: 'linear-gradient(90deg, #e6fffb 0%, #f0fffe 100%)',
|
|
|
|
|
+ boxShadow: '0 1px 2px rgba(0,0,0,0.04)',
|
|
|
|
|
+ borderRadius: 8,
|
|
|
|
|
+ height: '100%'
|
|
|
|
|
+ }}
|
|
|
|
|
+ bodyStyle={{ display: 'flex', flexDirection: 'column', justifyContent: 'space-between', minHeight: 80 }}
|
|
|
|
|
+ title={<span style={{ fontWeight: 600 }}>上传文档与管理知识片段</span>}
|
|
|
|
|
+ >
|
|
|
|
|
+ <div style={{ color: '#666', fontSize: 12 }}>上传Word, Pdf等多种文档格式,支持图片 OCR,查看切片与索引状态,按需更新或删除,保持知识内容最新。</div>
|
|
|
|
|
+ <div style={{ textAlign: 'right', color: '#1677ff', fontWeight: 600 }}>step 2</div>
|
|
|
|
|
+ </Card>
|
|
|
|
|
+ </Col>
|
|
|
|
|
+ <Col xs={24} sm={24} md={12} lg={8}>
|
|
|
|
|
+ <Card
|
|
|
|
|
+ size="small"
|
|
|
|
|
+ bordered={false}
|
|
|
|
|
+ style={{
|
|
|
|
|
+ background: 'linear-gradient(90deg, #fff7e6 0%, #fffaf0 100%)',
|
|
|
|
|
+ boxShadow: '0 1px 2px rgba(0,0,0,0.04)',
|
|
|
|
|
+ borderRadius: 8,
|
|
|
|
|
+ height: '100%'
|
|
|
|
|
+ }}
|
|
|
|
|
+ bodyStyle={{ display: 'flex', flexDirection: 'column', justifyContent: 'space-between', minHeight: 80 }}
|
|
|
|
|
+ title={<span style={{ fontWeight: 600 }}>创建RAG应用时引用知识库</span>}
|
|
|
|
|
+ >
|
|
|
|
|
+ <div style={{ color: '#666', fontSize: 12 }}>在RAG应用配置中选择此知识库参与检索问答。</div>
|
|
|
|
|
+ <div style={{ textAlign: 'right', color: '#1677ff', fontWeight: 600 }}>step 3</div>
|
|
|
|
|
+ </Card>
|
|
|
|
|
+ </Col>
|
|
|
|
|
+ </Row>
|
|
|
|
|
+ )}
|
|
|
</div>
|
|
</div>
|
|
|
)}
|
|
)}
|
|
|
<div className='knowledgeLibList-table'>
|
|
<div className='knowledgeLibList-table'>
|