@gientech/modual 1.4.7 → 1.5.2

package/src/modules/chat/index.tsx

@@ -9,9 +9,10 @@ import '@mxmweb/rtext/style.css';
 import '@mxmweb/aichat/style.css';
 import '@mxmweb/zui/style.css';
 import { defaultTheme, deepMergeTheme, type Styles } from '@mxmweb/zui';
-
 import { DefaultSenderConfig } from './constants';
 import GientechConversationPanel from './Conversations';
+import { registerPDFWorker } from '@mxmweb/fviewer';
+registerPDFWorker('/worker/pdf.worker1.min.js');
 import {
   convertQueryReplyPairListToMessages,
   getFileTypeByName,
@@ -38,6 +39,11 @@ import DisplayError from '../../utils/gientechCommon/components/DisplayError';
 import { maxPollCount, maxPollInterval } from '../../utils/gientechCommon/configs/commonConfig';
 import { RenameModal } from '../../utils/gientechCommon/components/RenameModal';
 import { DeleteModal } from '../../utils/gientechCommon/components/DeleteModal';
+import { ReferenceBar } from './ReferenceBar';
+
+export enum DrawerType {
+  REFERENCELIST = 'referencelist',
+}
 
 interface SenderConfig {
   actions?: Array<{
@@ -450,7 +456,7 @@ export default function withGientechChatAdopter(WrappedComponent = AiChat) {
         .catch(() => {
           setAppStatus(prev => ({ ...prev, app: 'error' }));
         });
-    }, [url, token]);
+    }, []);
 
     /**
      * 当 activeSessionId 变化时，获取对应的聊天记录
@@ -464,6 +470,78 @@ export default function withGientechChatAdopter(WrappedComponent = AiChat) {
           headers: { Authorization: token },
         })
         .then(res => {
+          // const r = {
+          //   data: {
+          //     success: true,
+          //     errorMsg: null,
+          //     errorCode: null,
+          //     data: {
+          //       label: '控制器起不来（控制器右上角RDY灯不亮）',
+          //       sessionId: '3d752532b3d4510867288e5ac5cb3833',
+          //       gmtCreate: '2025-11-06 14:30:43',
+          //       gmtModified: '2025-11-06 14:30:43',
+          //       createBy: 'admin',
+          //       updateBy: 'admin',
+          //       filePath: 'http://10.160.33.221:9000',
+          //       configId: 703,
+          //       kbId: null,
+          //       queryReplyPairList: [
+          //         {
+          //           query: {
+          //             id: 27665,
+          //             gmtCreate: '2025-11-06T06:31:05.000+00:00',
+          //             content: '控制器起不来（控制器右上角RDY灯不亮）',
+          //             type: 'text',
+          //             queryId: 'query-2532b3d4510867288e5ac5cb38338870',
+          //             audioUrl: '',
+          //             filePaths: null,
+          //             currentFiles: null,
+          //           },
+          //           reply: {
+          //             id: 27638,
+          //             gmtCreate: '2025-11-06T06:31:15.000+00:00',
+          //             content:
+          //               '<think>\n好的，我现在需要回答用户的问题：“控制器起不来（控制器右上角RDY灯不亮）”。首先，我要查看提供的参考资料，看看是否有相关信息。\n\n参考资料0提到了现象“控制器起不来（控制器右上角RDY灯不亮）”，并关联到“包含”和“产生”关系，但没有提供处理方法。参考资料1和2都详细描述了这个现象，并且都给出了处理方法：检查NT255模块是否报红，更换模块，并特别提到机舱检查FS211/N模块。这些处理方法的ID都是10001，说明是同一个解决方案。\n\n用户的问题没有指定版本，根据规则2，我应该使用最新的版本信息。不过，参考资料中没有明确的版本日期，所以只能假设它们都是最新的。因此，我应该综合所有参考资料的信息，提供处理方法。\n\n最后，我需要按照要求，用简洁的语言回答，并标注来源。由于处理方法在参考资料1和2中都有，我会引用这两个来源。\n\n\n</think>\n\n控制器起不来（控制器右上角RDY灯不亮）的处理方法如下：\n\n1. 检查NT255模块是否报红（ERR灯是否亮红）[retrive-tag id="2290607639633892359" image_urls="" fromType="2"][1][/retrive-tag][retrive-tag id="439368868506707299" image_urls="" fromType="2"][2][/retrive-tag]。\n2. 更换NT255模块（注：机舱检查FS211/N模块）[retrive-tag id="2290607639633892359" image_urls="" fromType="2"][1][/retrive-tag][retrive-tag id="439368868506707299" image_urls="" fromType="2"][2][/retrive-tag]。\n\n这些步骤可以帮助解决控制器无法启动的问题。',
+          //             type: 'text',
+          //             reference: '[]',
+          //             webReference: '[]',
+          //             graphReference:
+          //               '[{"cyphers":["match (n:`组件`)-[e]-(m) where id(n) == \\"组件101\\" return n,e,m;","match (n:`现象`)-[e]-(m) where id(n) == \\"现象1001\\" return n,e,m;","match (n:`现象`)-[e]-(m) where id(n) == \\"现象1001\\" return n,e,m;"],"fetchUrl":"https://10.160.33.150:30001/jinxin_graph/proxy/search/graph/search/cypherSearch4Rag","graphName":"故障处理图谱","id":"1952195957278367755","traceNodes":[{"graphId":"1952195957278367755","id":"3484145002858895870","name":"控制器","nodeType":"组件","vid":"组件101"},{"graphId":"1952195957278367755","id":"2290607639633892359","name":"控制器起不来（控制器右上角RDY灯不亮）","nodeType":"现象","vid":"现象1001"},{"graphId":"1952195957278367755","id":"439368868506707299","name":"控制器起不来（控制器右上角RDY灯不亮）","nodeType":"现象","vid":"现象1001"}]}]',
+          //             queryId: 'query-2532b3d4510867288e5ac5cb38338870',
+          //             feedbackResult: null,
+          //             feedbackId: null,
+          //             parsedFilePaths: null,
+          //             recommendQuestion:
+          //               '["在检查NT255模块时，ERR灯亮红可能表示哪些具体问题？","更换NT255模块时需要注意哪些步骤或注意事项？","除了检查和更换NT255模块，还有哪些方法可以排查控制器无法启动的问题？"]',
+          //             llmType: 1,
+          //             resultType: 1,
+          //             respTime: 32453,
+          //             tokens: 824,
+          //           },
+          //         },
+          //       ],
+          //       searchConfigDTO: {
+          //         id: 703,
+          //         status: 1,
+          //         isDefault: 0,
+          //         configJson:
+          //           '{"status":1,"defaultAnswer":"您好！我注意到您的消息中可能包含了一些敏感的内容。为了保证社区的友好氛围，我们无法继续就此话题进行讨论。如果您有其他问题或需要帮助，我很乐意继续为您服务！谢谢您的理解和支持。","dependOnKb":1,"isDel":1,"config_name":"图谱测试","model_name":"deepseek-distill-qwen32b","plan_model_name":"deepseek-distill-qwen32b","prologue":"你好","system_prompt":"","recommend_model_name":"deepseek-distill-qwen32b","temperature":0.3,"top_p":0.8,"top_k":10,"score_threshold":0.1,"max_tokens":4096,"max_round":5,"rerank_model_name":"bge-reranker-v2-m3_xinference","knowledge_base_name_source":"","graph_nb_name":[{"graph_name":"故障处理图谱","index_name":"1952195957278367755"}],"thinking":false,"knowledge_base_name":"","selectedKnowledgeBase":[],"enabled_graph":false,"enabled_nb_graph":true,"need_trace_source":true,"trace_by_llm":true,"is_download":false,"search_policy":1,"enabled_question_rewrite":false,"enabled_faq":true,"enabled_rerank":true,"rerank":false}',
+          //         name: '图谱测试',
+          //         des: null,
+          //         createBy: 'admin',
+          //         gmtCreate: '2025-11-05 19:37:54',
+          //         permission: null,
+          //         sensitiveWordIds: '',
+          //         defaultAnswer:
+          //           '您好！我注意到您的消息中可能包含了一些敏感的内容。为了保证社区的友好氛围，我们无法继续就此话题进行讨论。如果您有其他问题或需要帮助，我很乐意继续为您服务！谢谢您的理解和支持。',
+          //         model: false,
+          //         enabledFaq: 0,
+          //         dependOnKb: 1,
+          //         isDel: 1,
+          //       },
+          //     },
+          //   },
+          // };
           // 如果会话没有数据（例如新建的），直接返回
 
           if (!res.data.data) {
@@ -1399,6 +1477,7 @@ export default function withGientechChatAdopter(WrappedComponent = AiChat) {
         console.log('error', error);
       }
     };
+
     /**
      * 统一事件分发器，连接业务逻辑与所有子组件的事件
      * @param {string} eventName - 事件名称
@@ -1592,6 +1671,36 @@ export default function withGientechChatAdopter(WrappedComponent = AiChat) {
           // 处理文件下载事件，透传给父组件
           eventsEmit?.('referenceFile_download', data);
           break;
+        case 'references:click': {
+          // 使用 AiChat 内置的右侧栏事件
+          const Content = () => {
+            // const safe = (() => {
+            //   try {
+            //     return typeof data === 'string' ? data : JSON.stringify(data, null, 2);
+            //   } catch (e) {
+            //     return String(data);
+            //   }
+            // })();
+            return (
+              <ReferenceBar
+                type={DrawerType.REFERENCELIST}
+                data={data}
+                token={token}
+                eventsEmit={eventsEmit}
+                is_download={is_download}
+              />
+            );
+          };
+          const setContentEvent = new CustomEvent('aichat:right_set_content', {
+            detail: { content: <Content /> },
+          });
+          window.dispatchEvent(setContentEvent);
+          const openEvent = new CustomEvent('aichat:right_set', {
+            detail: { collapsed: false },
+          });
+          window.dispatchEvent(openEvent);
+          break;
+        }
         case 'retrive_tag:click':
           // 处理 retrive-tag 点击事件，透传给父组件
           eventsEmit?.('retrive_tag:click', data);
@@ -1813,6 +1922,7 @@ export default function withGientechChatAdopter(WrappedComponent = AiChat) {
             <ChatMessageAdapter
               key={`${msg?.queryId || msg?.id || idx}-${msg?.istype || 'unknown'}`}
               {...msg}
+              referenceMode="button"
               reference={safeReference}
               webReference={safeWebReference}
               graphReference={safeGraphReference}
@@ -1855,6 +1965,7 @@ export default function withGientechChatAdopter(WrappedComponent = AiChat) {
             <ChatMessageAdapter
               key={`${msg?.queryId || msg?.id || idx}-user`}
               {...msg}
+              referenceMode="button"
               contentType="plainText"
               isUser={true}
               displayStatus="ready"
@@ -1902,7 +2013,7 @@ export default function withGientechChatAdopter(WrappedComponent = AiChat) {
     // Render - 渲染
     // =================================================================
     return (
-      <>
+      <div style={{ height: '100%', minWidth: '1116px', overflow: 'hidden' }}>
         <FileManager
           open={fileManagerOpen}
           onCancel={() => setFileManagerOpen(false)}
@@ -1914,6 +2025,8 @@ export default function withGientechChatAdopter(WrappedComponent = AiChat) {
           eventsEmit={mergedEventsEmit}
         />
 
+        {/* 右侧栏由 AiChat 内置事件控制，此处不再使用 antd Drawer */}
+
         <WrappedComponent
           {...rest}
           status={appStatus}
@@ -1927,6 +2040,7 @@ export default function withGientechChatAdopter(WrappedComponent = AiChat) {
           CustomComponents={mergedCustomComponents}
           activeSessionId={activeSessionId}
           scrollOld={scrollOld}
+          rightbarWidth={'400px'}
         />
         <FeedBackModal
           open={openFeed}
@@ -1946,7 +2060,7 @@ export default function withGientechChatAdopter(WrappedComponent = AiChat) {
           handleCancel={() => handleEvent('close_remove')}
           data={curEditData?.data || {}}
         />
-      </>
+      </div>
     );
   };
 }

package/src/modules/chat/referenceCom/DeleteModal.tsx

@@ -0,0 +1,75 @@
+import { Button, ConfigProvider, Form, Input, Modal } from "antd";
+import { useForm } from "antd/es/form/Form";
+import { useEffect } from "react";
+
+export const DeleteModal = ({
+  isModalOpen,
+  handleOk,
+  handleCancel,
+  data
+}: any) => {
+  const modalStyles = {
+    header: {
+      height: "60px",
+      borderBottom: "1px solid #F0F0F0",
+      display: "flex",
+      paddingLeft: "24px",
+      alignItems: "center",
+      marginBottom: "16px"
+    },
+    title: { fontSize: "16px" },
+    body: { padding: "0 24px" },
+    mask: {},
+    footer: { marginTop: "0px", padding: "0 24px 16px 24px" },
+    content: { padding: 0 }
+  };
+  const [rename_form] = useForm();
+  useEffect(() => {
+    if (!isModalOpen) {
+      rename_form.resetFields();
+      return;
+    }
+    rename_form.setFieldValue("new_name", data?.label);
+  }, [data, isModalOpen]);
+  return (
+    <ConfigProvider
+      modal={{
+        styles: modalStyles
+      }}
+    >
+      <Modal
+        title={<div className="text-[16px]">删除会话</div>}
+        closeIcon={null}
+        open={isModalOpen}
+        width={520}
+        centered
+        className="[&:[.ant-modal-content]]:bg-red"
+        footer={
+          <div className="mt-[16px] flex justify-end">
+            <Button
+              children="取消"
+              onClick={handleCancel}
+              className="mr-[8px]"
+            />
+            <Button
+              children="确认"
+              onClick={async () => {
+                try {
+                  const data = await rename_form.validateFields();
+                  handleOk("ok_remove", data);
+                } catch (e) {
+                  console.log(e);
+                  return;
+                }
+              }}
+              type="primary"
+              className="border-none"
+            />
+          </div>
+        }
+      >
+        <div>{`确定要删除会话「${data.label}」吗？删除后无法恢复。`}</div>
+      </Modal>
+    </ConfigProvider>
+  );
+};

package/src/modules/chat/referenceCom/DrawerContent.tsx

@@ -0,0 +1,136 @@
+import { uid } from 'uid';
+import { useMemo } from 'react';
+import { dealMinioUrl, getFileName, getFilePath, getFileType, getInitialZoom } from '../utils';
+import { GientechStreamReader } from '@gientech/modual/streamFilesReader';
+export const DrawerContent = ({
+  content,
+  onClose,
+  token,
+}: {
+  content: {
+    file_source: string;
+    contents: any[];
+    curMark: string;
+    file_type: string;
+    title: string;
+    metadata: any;
+    pdfPages: number | undefined;
+    url: string;
+    parse_url: string;
+  } | null;
+  onClose: any;
+  token: string;
+}) => {
+  const getAnnotations: any = (content: any) => {
+    if (!content?.metadata) return;
+    const fileType = getFileType(content, '');
+    const { page_number, page_size, position, offset, chunk_type } = content.metadata;
+    if (fileType === 'markdown_table') {
+      if (offset?.length) {
+        return {
+          annotations: [{ id: uid(), offsets: offset }],
+          initialPage: 1,
+        };
+      } else {
+        return {};
+      }
+    } else {
+      if (!page_size || !position) {
+        console.log('%c缺少文件size或者文件坐标', 'color: red');
+        return {};
+      }
+      const pageSizes = Array.isArray(page_size) ? page_size : JSON.parse(page_size);
+      if (!pageSizes.length) {
+        console.log('%c缺少文件size', 'color: red');
+        return {};
+      }
+      const positions = Array.isArray(position) ? position : JSON.parse(position);
+      if (!positions.length || !page_number) {
+        console.log('%c缺少文件坐标或者文件页数', 'color: red');
+        return {};
+      }
+      const anno = positions.map((item: any, index: number) => {
+        return {
+          id: uid(),
+          pageNumber: page_number[index],
+          x: +(item[0][0] / pageSizes[0][0]).toFixed(4),
+          y: +(item[0][1] / pageSizes[0][1]).toFixed(4),
+          width: +((item[1][0] - item[0][0]) / pageSizes[0][0]).toFixed(4),
+          height: +((item[2][1] - item[0][1]) / pageSizes[0][1]).toFixed(4),
+          content: '',
+          color: chunk_type === 'image' ? '#60f74f' : '#4FC3F7',
+        };
+      });
+      return { annotations: anno, initialPage: page_number[0] };
+    }
+  };
+
+  const curData = useMemo(() => {
+    console.log('content88888888888', content);
+    if (content && token) {
+      console.log('content999', content);
+      const { annotations, initialPage } = getAnnotations(content);
+      const curContent = {
+        ...content,
+        metadata: {
+          source: content?.metadata?.source || content.parse_url || content.url,
+          page_size: content?.metadata?.page_size,
+        },
+      };
+
+      const filePath = dealMinioUrl(getFilePath(curContent));
+      return {
+        filePath,
+        fileName: getFileName(curContent),
+        fileType: getFileType(curContent, filePath),
+        totalPages: curContent.pdfPages || 0,
+        token,
+        annotations,
+        initialPage,
+        initialZoom: getInitialZoom(598, curContent),
+      };
+    } else {
+      return {};
+    }
+  }, [content]);
+
+  const renderFileCom = useMemo(() => {
+    if (!curData.filePath) return <></>;
+    console.log('curData', curData);
+    return (
+      <GientechStreamReader
+        initialZoom={curData.initialZoom || 100}
+        convertedFilePath={curData.filePath}
+        fileName={curData.fileName}
+        fileType={curData.fileType}
+        initialPage={curData.initialPage}
+        totalPages={curData.totalPages}
+        authorization={curData.token}
+        annotations={curData.annotations}
+        streamApiUrl="/proxy/index/knowledgeBase/file/stream"
+        eventsEmit={name => {
+          switch (name) {
+            case 'viewer:close':
+              onClose();
+              break;
+          }
+        }}
+        tools={{
+          close: true,
+        }}
+      />
+    );
+  }, [curData]);
+
+  return (
+    <div
+      style={{
+        fontFamily: 'Source Han Sans CN',
+        fontSize: '12px',
+      }}
+      className="h-full w-full"
+    >
+      {renderFileCom}
+    </div>
+  );
+};

package/src/modules/chat/referenceCom/DrawerDatabase.tsx

@@ -0,0 +1,110 @@
+import { getUrlPrefix } from '../utils';
+import { Empty, Table, Pagination } from 'antd';
+import axios from 'axios';
+import { useEffect, useState } from 'react';
+
+const DrawerDatabase = ({ curFileInfo }: any) => {
+  const [pageNo, setPageNo] = useState(1);
+  const [pageSize, setPageSize] = useState(10);
+  const [columns, setColumn] = useState([]);
+  const [dataList, setDataList] = useState([]);
+  const [totalData, setTotalData] = useState(0);
+
+  useEffect(() => {
+    const url = curFileInfo?.metadata?.fetchUrl || curFileInfo?.fetchUrl;
+    if (url) {
+      toGetDataBaseData(url);
+    }
+  }, [curFileInfo, pageNo, pageSize]);
+
+  const getDataBaseData = async ({ url, params }: any) => {
+    try {
+      const res = await axios.get(
+        `${getUrlPrefix()}${url}?${new URLSearchParams(params).toString()}`
+      );
+      const data = res?.data;
+      if (data) {
+        const { columns, dataList, totalData } = data;
+        setColumn(
+          (columns?.slice(1) || []).map((col: any) => ({
+            title: col.businessName,
+            dataIndex: col.physicalName,
+            key: col.physicalName,
+          }))
+        );
+        setDataList(dataList || []);
+        setTotalData(totalData || []);
+      }
+    } catch (error) {
+      console.log('error', error);
+    }
+  };
+
+  const toGetDataBaseData = async (url: string) => {
+    getDataBaseData({
+      url: `${url}`,
+      params: {
+        pageNo,
+        pageSize,
+      },
+    });
+  };
+
+  const renderTitle = () => {
+    const { file, metadata } = curFileInfo;
+    const { dataSourceType, databaseName, tableName, businessTableName } = metadata;
+    if (dataSourceType == 'DataTable') {
+      return `${databaseName} - ${businessTableName}`;
+    }
+
+    if (dataSourceType == 'DirectDB') {
+      return `${databaseName} - ${tableName}`;
+    }
+
+    return file;
+  };
+
+  return (
+    <div>
+      <div className="h-[52px] leading-[52px] font-bold text-[16px] px-[15px] overflow-hidden border-t-none border-l-none border-b-[1px] border-solid border-[rgb(222,226,230)]">
+        {renderTitle()}
+      </div>
+
+      {columns?.length > 0 ? (
+        <div>
+          <div className="p-4 overflow-auto h-[calc(100vh-120px)]">
+            <Table
+              columns={columns}
+              dataSource={dataList}
+              pagination={false}
+              scroll={{ x: 'max-content' }}
+            />
+          </div>
+          <div className="flex justify-end px-[18px]">
+            <Pagination
+              current={pageNo}
+              pageSize={pageSize}
+              responsive
+              simple
+              total={totalData}
+              showSizeChanger
+              showQuickJumper
+              onChange={(page, size) => {
+                setPageNo(page);
+                setPageSize(size || 10);
+              }}
+              onShowSizeChange={(current, size) => {
+                setPageNo(1);
+                setPageSize(size);
+              }}
+            />
+          </div>
+        </div>
+      ) : (
+        <Empty />
+      )}
+    </div>
+  );
+};
+
+export default DrawerDatabase;

package/src/modules/chat/referenceCom/DrawerGraphPreview.tsx

@@ -0,0 +1,86 @@
+import axios from 'axios';
+import { useEffect, useState } from 'react';
+import { KnowledgeGraphPreview, registerPreviewViewer } from '@mxmweb/nodegraph';
+import DrawerTitle from './DrawerTitle';
+registerPreviewViewer();
+
+const DrawerGraphPreview = ({
+  curFileInfo,
+  onClose,
+  token,
+}: {
+  curFileInfo: any;
+  onClose: any;
+  token: string;
+}) => {
+  const config = {
+    title: '',
+    subtitle: '',
+    backgroundColor: '#f8f9fa',
+    showGrid: true,
+    showLegend: false,
+    showTooltip: true,
+    showFullscreen: false,
+    showMinimap: false,
+  };
+  const [graphList, setGraphList] = useState<any>({
+    nodeList: [],
+    edgeList: [],
+  });
+
+  useEffect(() => {
+    console.log('curFileInfo', curFileInfo);
+  }, [curFileInfo]);
+
+  const getGraphData = async (curFileInfo: any) => {
+    if (!curFileInfo?.id || !curFileInfo?.cyphers || !curFileInfo?.fetchUrl) return;
+    try {
+      const { cyphers, fetchUrl, id } = curFileInfo || {};
+      console.log('getGraphData params', cyphers, fetchUrl, id);
+
+      const res = await axios.post(
+        fetchUrl,
+        { cyphers, ontologyId: id },
+        {
+          headers: { Authorization: token },
+        }
+      );
+      console.log('getGraphData res', res);
+      setGraphList(res?.data || {});
+    } catch (error) {
+      console.log('error', error);
+    }
+  };
+  useEffect(() => {
+    getGraphData(curFileInfo);
+  }, [curFileInfo]);
+
+  return (
+    <div>
+      <DrawerTitle title={curFileInfo?.graphName} setOpen={onClose} />
+      <div style={{ width: '100%', height: 'calc(100vh - 60px)' }}>
+        <KnowledgeGraphPreview
+          centerNode={{
+            vid: curFileInfo?.traceNode?.vid,
+          }}
+          data={graphList}
+          layout={{ type: 'force', linkDistance: 190 }}
+          title={config.title}
+          subtitle={config.subtitle}
+          backgroundColor={config.backgroundColor}
+          showGrid={config.showGrid}
+          showLegend={config.showLegend}
+          showTooltip={config.showTooltip}
+          showFullscreen={config.showFullscreen}
+          showMinimap={config.showMinimap}
+          customPlugins={{}}
+          onReady={(graph: any) => {
+            console.log('KnowledgeGraphPreview ready:', graph);
+          }}
+        />
+      </div>
+    </div>
+  );
+};
+
+export default DrawerGraphPreview;

package/src/modules/chat/referenceCom/DrawerPreview.tsx

@@ -0,0 +1,73 @@
+import { useMemo } from 'react';
+import { dealMinioUrl, getFileName, getFilePath, getFileType, getInitialZoom } from '../utils';
+import { GientechStreamReader } from '@gientech/modual/streamFilesReader';
+
+const DrawerPreview = ({
+  curFileInfo,
+  onClose,
+  token,
+}: {
+  curFileInfo: any;
+  onClose: any;
+  token: string;
+}) => {
+  const curData = useMemo(() => {
+    if (curFileInfo && token) {
+      console.log('content999', curFileInfo);
+      const content = {
+        file_source: curFileInfo.url || curFileInfo.parse_url || curFileInfo.parsedFilePath,
+        file_type: curFileInfo.file_type,
+        metadata: {
+          source: curFileInfo.filePath || curFileInfo.url || curFileInfo?.metadata?.source || '',
+          page_size: curFileInfo?.metadata?.page_size,
+        },
+        pdfPages: curFileInfo.pdfPages,
+      };
+      const filePath = dealMinioUrl(getFilePath(content));
+      return {
+        filePath,
+        fileName: getFileName(content),
+        fileType: getFileType(content, filePath),
+        totalPages: content.pdfPages || 0,
+        token,
+        initialZoom: getInitialZoom(document.getElementById('pdfBox')?.clientWidth || 0, content),
+      };
+    } else {
+      return {};
+    }
+  }, [curFileInfo]);
+
+  const renderFileCom = useMemo(() => {
+    console.log('curData', curData);
+    if (!curData.filePath) return <></>;
+    return (
+      <GientechStreamReader
+        initialZoom={curData.initialZoom || 100}
+        convertedFilePath={curData.filePath}
+        fileName={curData.fileName}
+        fileType={curData.fileType}
+        initialPage={1}
+        totalPages={curData.totalPages}
+        authorization={curData.token}
+        streamApiUrl="/proxy/index/knowledgeBase/file/stream"
+        eventsEmit={type => {
+          switch (type) {
+            case 'viewer:close':
+              onClose();
+              break;
+          }
+        }}
+        tools={{
+          close: true,
+        }}
+      />
+    );
+  }, [curData]);
+  return (
+    <div id="pdfBox" className="h-full overflow-y-auto">
+      {renderFileCom}
+    </div>
+  );
+};
+
+export default DrawerPreview;