Browse Source

重构新手引导逻辑,添加展开/折叠功能并持久化状态到localStorage;在用户重新登录时重置引导状态。

刘博博 2 days ago
parent
commit
2aa63de376

+ 75 - 58
src/pages/deepseek/knowledgeLib/detail/index.tsx

@@ -18,7 +18,7 @@ import {
   Col,
   Col,
   Card
   Card
 } from 'antd';
 } from 'antd';
-import { EditOutlined, DeleteOutlined, InboxOutlined, PlusOutlined, ArrowLeftOutlined, CloseOutlined, BulbOutlined } from '@ant-design/icons';
+import { EditOutlined, DeleteOutlined, InboxOutlined, PlusOutlined, ArrowLeftOutlined, CloseOutlined, BulbOutlined, UpOutlined, DownOutlined } from '@ant-design/icons';
 import InfoModal from './components/InfoModal';
 import InfoModal from './components/InfoModal';
 import InfoModalSetting from './components/InfoModalSetting';
 import InfoModalSetting from './components/InfoModalSetting';
 import router from '@/router';
 import router from '@/router';
@@ -75,7 +75,20 @@ const KnowledgeLibInfo : React.FC = () => {
   const [userInfoAll, setUserInfoAll] = React.useState<any>({});
   const [userInfoAll, setUserInfoAll] = React.useState<any>({});
   // 新手引导(知识库文档)整体可见性(持久化到 localStorage)
   // 新手引导(知识库文档)整体可见性(持久化到 localStorage)
   const [showDocGuide, setShowDocGuide] = React.useState<boolean>(() => localStorage.getItem('knowledgeDocGuideHidden') !== 'true');
   const [showDocGuide, setShowDocGuide] = React.useState<boolean>(() => localStorage.getItem('knowledgeDocGuideHidden') !== 'true');
-  const hideDocGuide = () => { localStorage.setItem('knowledgeDocGuideHidden', 'true'); setShowDocGuide(false); };
+  // 新手引导展开/折叠状态(持久化到 localStorage),默认展开
+  const [isDocGuideExpanded, setIsDocGuideExpanded] = React.useState<boolean>(() => {
+    const saved = localStorage.getItem('knowledgeDocGuideExpanded');
+    // 如果 localStorage 中没有值,默认展开(返回 true)
+    return saved === null ? true : saved === 'true';
+  });
+  const toggleDocGuide = () => {
+    setIsDocGuideExpanded(prev => {
+      const newValue = !prev;
+      // 保存到 localStorage
+      localStorage.setItem('knowledgeDocGuideExpanded', String(newValue));
+      return newValue;
+    });
+  };
 
 
   const props : UploadProps = {
   const props : UploadProps = {
     name: 'files',
     name: 'files',
@@ -409,67 +422,71 @@ const KnowledgeLibInfo : React.FC = () => {
         <Spin spinning={ uploadLoading || listLoading }>
         <Spin spinning={ uploadLoading || listLoading }>
           {showDocGuide && (
           {showDocGuide && (
             <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: isDocGuideExpanded ? 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={hideDocGuide} style={{ color: '#999', cursor: 'pointer' }} />
+                <div onClick={toggleDocGuide} style={{ color: '#999', cursor: 'pointer', display: 'flex', alignItems: 'center' }}>
+                  {isDocGuideExpanded ? <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 }}>支持多种格式(Word、PDF、图片等),单个/总大小有上限,上传后自动处理(约5-10分钟,如遇到超时,可等待几分钟后刷新页面,将自动成功)。</div>
-                    {/* <div style={{ color: '#666', fontSize: 12 }}>支持pdf,doc,docx文件格式上传,建议单个文件不要超过10M,页数控制在100页以内。尽量单文件上传。</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 }}>自动解析成功后可查看切片数量与索引状态,必要时可重新生成或调整配置。</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 }}>在应用中生效</span>}
-                  >
-                    <div style={{ color: '#666', fontSize: 12 }}>在RAG应用中切片将会被模型检索并召回,形成大模型对话的依据语料。</div>
-                    <div style={{ textAlign: 'right', color: '#1677ff', fontWeight: 600 }}>step 3</div>
-                  </Card>
-                </Col>
-              </Row>
+              {isDocGuideExpanded && (
+                <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 }}>支持多种格式(Word、PDF、图片等),单个/总大小有上限,上传后自动处理(约5-10分钟,如遇到超时,可等待几分钟后刷新页面,将自动成功)。</div>
+                      {/* <div style={{ color: '#666', fontSize: 12 }}>支持pdf,doc,docx文件格式上传,建议单个文件不要超过10M,页数控制在100页以内。尽量单文件上传。</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 }}>自动解析成功后可查看切片数量与索引状态,必要时可重新生成或调整配置。</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 }}>在应用中生效</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>
           )}
           )}
           {
           {

+ 74 - 57
src/pages/deepseek/knowledgeLib/list/index.tsx

@@ -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'>

+ 74 - 57
src/pages/deepseek/questionAnswer/list/index.tsx

@@ -30,7 +30,7 @@ import {
   BookOutlined,
   BookOutlined,
   TeamOutlined,
   TeamOutlined,
   AppstoreOutlined,
   AppstoreOutlined,
-  EditOutlined, CloseOutlined, BulbOutlined
+  EditOutlined, CloseOutlined, BulbOutlined, UpOutlined, DownOutlined
 } from '@ant-design/icons';
 } from '@ant-design/icons';
 import { apis } from '@/apis';
 import { apis } from '@/apis';
 import './style.less';
 import './style.less';
@@ -138,7 +138,20 @@ const QuestionAnswerList: React.FC = () => {
   const [levelTypeList, setLevelTypeList] = React.useState<AppTypeList>([]);
   const [levelTypeList, setLevelTypeList] = React.useState<AppTypeList>([]);
   // 新手引导整体可见性(持久化到 localStorage)
   // 新手引导整体可见性(持久化到 localStorage)
   const [showGuide, setShowGuide] = React.useState<boolean>(() => localStorage.getItem('appGuideHidden') !== 'true');
   const [showGuide, setShowGuide] = React.useState<boolean>(() => localStorage.getItem('appGuideHidden') !== 'true');
-  const hideGuide = () => { localStorage.setItem('appGuideHidden', 'true'); setShowGuide(false); };
+  // 新手引导展开/折叠状态(持久化到 localStorage),默认展开
+  const [isGuideExpanded, setIsGuideExpanded] = React.useState<boolean>(() => {
+    const saved = localStorage.getItem('appGuideExpanded');
+    // 如果 localStorage 中没有值,默认展开(返回 true)
+    return saved === null ? true : saved === 'true';
+  });
+  const toggleGuide = () => {
+    setIsGuideExpanded(prev => {
+      const newValue = !prev;
+      // 保存到 localStorage
+      localStorage.setItem('appGuideExpanded', String(newValue));
+      return newValue;
+    });
+  };
   // 搜索输入框展开状态
   // 搜索输入框展开状态
   const [isSearchExpanded, setIsSearchExpanded] = React.useState(false);
   const [isSearchExpanded, setIsSearchExpanded] = React.useState(false);
   const searchWrapperRef = React.useRef<HTMLDivElement>(null);
   const searchWrapperRef = React.useRef<HTMLDivElement>(null);
@@ -769,66 +782,70 @@ const QuestionAnswerList: React.FC = () => {
       {/* 新手使用提示区块 */}
       {/* 新手使用提示区块 */}
       {showGuide && (
       {showGuide && (
         <div style={{ padding: '12px 20px 12px 20px' }}>
         <div style={{ padding: '12px 20px 12px 20px' }}>
-          <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' }} />
               提示:如何创建并发布自己的RAG(增强检索生成)应用?
               提示:如何创建并发布自己的RAG(增强检索生成)应用?
             </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 }}>点击右上角,创建应用,选择模型与知识范围,配置Prompt、检索策略并调试。</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 }}>发布应用</span>}
-              >
-                <div style={{ color: '#666', fontSize: 12 }}>发布后可在相应的项目内使用。</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 }}>点击右上角,创建应用,选择模型与知识范围,配置Prompt、检索策略并调试。</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 }}>发布应用</span>}
+                >
+                  <div style={{ color: '#666', fontSize: 12 }}>发布后可在相应的项目内使用。</div>
+                  <div style={{ textAlign: 'right', color: '#1677ff', fontWeight: 600 }}>step 3</div>
+                </Card>
+              </Col>
+            </Row>
+          )}
         </div>
         </div>
       )}
       )}
       {
       {

+ 4 - 0
src/pages/login/store.tsx

@@ -55,6 +55,10 @@ const useLoginStore = (): LoginStore => {
                     id: info.userId,
                     id: info.userId,
                     name: info.nickName,
                     name: info.nickName,
                 });
                 });
+                // 重新登录时,重置引导展开状态为默认展开
+                localStorage.removeItem('appGuideExpanded');
+                localStorage.removeItem('knowledgeGuideExpanded');
+                localStorage.removeItem('knowledgeDocGuideExpanded');
                 // 获取用户详细信息(permissions,role, user)
                 // 获取用户详细信息(permissions,role, user)
                 const resUserInfo = await apis.fetchUserInfo(info.userId);
                 const resUserInfo = await apis.fetchUserInfo(info.userId);
                 if (resUserInfo.code === 200) {
                 if (resUserInfo.code === 200) {

+ 4 - 0
src/router.tsx

@@ -281,6 +281,10 @@ router.routes.forEach((route: any) => {
                             id: res.user.userId,
                             id: res.user.userId,
                             name: res.user.nickName,
                             name: res.user.nickName,
                         });
                         });
+                        // 重新登录时,重置引导展开状态为默认展开
+                        localStorage.removeItem('appGuideExpanded');
+                        localStorage.removeItem('knowledgeGuideExpanded');
+                        localStorage.removeItem('knowledgeDocGuideExpanded');
                         window.location.replace(originUrl + path);
                         window.location.replace(originUrl + path);
                     }
                     }
                 } catch (error: any) {
                 } catch (error: any) {