@gientech/modual 2.0.8 → 2.0.9

package/src/utils/gientechCommon/slate/richElements/index.tsx

@@ -0,0 +1,499 @@
+// 富文本元素渲染统一出口
+
+// 迁移自ChatMessage.tsx
+import React, { useMemo } from 'react';
+
+// 新增工具函数：判断 heading 是否在 li 内
+function isInListItem(attributes: any) {
+  return (
+    attributes &&
+    attributes['data-slate-node'] === 'element' &&
+    attributes['data-slate-leaf'] !== undefined &&
+    attributes['data-slate-list-item'] === 'true'
+  );
+}
+
+// 优化 heading 渲染，li 内外样式区分
+const HeadingOne = ({ attributes, children, inListItem }: any) => (
+  <h1
+    {...attributes}
+    className={
+      inListItem
+        ? 'text-base font-bold mt-2 mb-1 text-gray-900'
+        : 'text-xl font-bold mb-6 text-gradient bg-clip-text text-transparent bg-gradient-to-r from-blue-600 to-cyan-500'
+    }
+    style={inListItem ? { marginTop: 12, marginBottom: 4 } : {}}
+  >
+    {children}
+  </h1>
+);
+const HeadingTwo = ({ attributes, children, inListItem }: any) => (
+  <h2
+    {...attributes}
+    className={
+      inListItem
+        ? 'text-base font-semibold mt-2 mb-1 text-gray-800'
+        : 'text-lg font-semibold mb-4 text-gray-600 border-l-4  pl-3'
+    }
+    style={inListItem ? { marginTop: 10, marginBottom: 4 } : {}}
+  >
+    {children}
+  </h2>
+);
+const HeadingThree = ({ attributes, children, inListItem }: any) => (
+  <h3
+    {...attributes}
+    className={
+      inListItem
+        ? 'text-base font-medium mt-2 mb-1 text-gray-700'
+        : "text-lg font-medium mb-3 text-gray-600 flex items-center before:content-[''] before:w-2 before:h-2 before:rounded-full before:bg-blue-500 before:mr-2"
+    }
+    style={inListItem ? { marginTop: 8, marginBottom: 2 } : {}}
+  >
+    {children}
+  </h3>
+);
+
+export const renderElement = (props: any) => {
+  const { element, children, attributes, finish } = props;
+  //console.log('------------------renderElement element:', props);
+  // const respTime = useMemo(() => {
+  //   if (element.type === 'think') {
+  //     if (element.children?.length) {
+  //       // console.log('element.children[0].respTime', element.children[0].respTime);
+
+  //       return element.children[0].respTime;
+  //     } else {
+  //       return null;
+  //     }
+  //   } else {
+  //     return null;
+  //   }
+  // }, [element]);
+  // 判断是否在 list-item 内
+  const inListItem =
+    element &&
+    element.type &&
+    element.type.startsWith('heading') &&
+    props.parent &&
+    props.parent.type === 'list-item';
+  switch (element.type) {
+    case 'paragraph':
+      // 渲染文章尾部所有retrive-tag图片
+      if (props.isLast) {
+        // 收集所有retrive-tag的imageUrls
+        const allImageUrls: string[] = [];
+        function collectImages(nodes: any[]) {
+          for (const node of nodes) {
+            if (node && typeof node === 'object') {
+              if (Array.isArray(node)) {
+                collectImages(node);
+              } else {
+                if (node.retrive && node.imageUrls && Array.isArray(node.imageUrls)) {
+                  allImageUrls.push(...node.imageUrls);
+                }
+                if (node.children) collectImages(node.children);
+              }
+            }
+          }
+        }
+        collectImages([props.editor?.children || element]);
+        if (allImageUrls.length > 0) {
+          return (
+            <div>
+              <p {...attributes} className="mb-4 leading-7 text-gray-700 font-normal">
+                {children}
+              </p>
+              <div className="mt-4 flex flex-wrap gap-3">
+                {allImageUrls.map((url, idx) => (
+                  <div
+                    key={url + idx}
+                    className="w-32 h-32 bg-gray-100 flex items-center justify-center rounded overflow-hidden relative"
+                  >
+                    <img
+                      src={url}
+                      alt="retrive-img"
+                      className="object-contain w-full h-full"
+                      style={{ display: 'block' }}
+                      onLoad={e => {
+                        e.currentTarget.style.background = 'none';
+                      }}
+                      onError={e => {
+                        e.currentTarget.style.background = '#f00';
+                      }}
+                    />
+                    <span
+                      className="absolute left-0 right-0 top-0 bottom-0 flex items-center justify-center text-xs text-gray-400"
+                      style={{ display: 'none' }}
+                    >
+                      加载中...
+                    </span>
+                  </div>
+                ))}
+              </div>
+            </div>
+          );
+        }
+      }
+      return (
+        <p {...attributes} className="mb-4 leading-7 text-gray-700 font-normal">
+          {children}
+        </p>
+      );
+    case 'heading-one':
+      return <HeadingOne attributes={attributes} children={children} inListItem={inListItem} />;
+    case 'heading-two':
+      return <HeadingTwo attributes={attributes} children={children} inListItem={inListItem} />;
+    case 'heading-three':
+      return <HeadingThree attributes={attributes} children={children} inListItem={inListItem} />;
+    case 'bulleted-list':
+      return (
+        <ul {...attributes} className="mb-4 space-y-2 list-none pl-4">
+          {children}
+        </ul>
+      );
+
+    case 'numbered-list':
+      return (
+        <ol {...attributes} className="mb-1 space-y-2 list-decimal pl-5 marker:text-gray-500 ">
+          {children}
+        </ol>
+      );
+    case 'list-item':
+      //console.log(3333,props,parent)
+      return (
+        <li {...attributes} className="relative pl-2">
+          {children}
+        </li>
+      );
+    case 'table':
+      return (
+        <div
+          style={{
+            display: 'flex',
+            msOverflowX: 'scroll',
+            width: '100%',
+            maxWidth: '65vw',
+            overflowX: 'auto',
+            margin: '1rem 0',
+          }}
+        >
+          <table
+            style={{
+              minWidth: 380,
+              maxwidth: '100%',
+              borderCollapse: 'collapse',
+              border: '1px solid #e5e7eb',
+            }}
+            {...attributes}
+          >
+            <tbody>{children}</tbody>
+          </table>
+        </div>
+      );
+    case 'table-row':
+      return (
+        <tr style={{ borderBottom: '1px solid #e5e7eb' }} {...attributes}>
+          {children}
+        </tr>
+      );
+    case 'table-cell':
+      if (element.header) {
+        return (
+          <th
+            style={{
+              padding: '0.75rem 1.5rem',
+              textAlign: 'left',
+              fontSize: '0.875rem',
+              fontWeight: 600,
+              color: '#1e3a8a',
+              textTransform: 'uppercase',
+              letterSpacing: '0.05em',
+              borderRight: '1px solid #93c5fd',
+              backgroundColor: '#f0f9ff',
+            }}
+            {...attributes}
+          >
+            {children}
+          </th>
+        );
+      }
+      return (
+        <td
+          style={{
+            padding: '0.75rem 1.5rem',
+            fontSize: '0.875rem',
+            color: '#374151',
+            borderRight: '1px solid #e5e7eb',
+          }}
+          {...attributes}
+        >
+          {children}
+        </td>
+      );
+    case 'block-quote':
+      return (
+        <blockquote
+          {...attributes}
+          className="border-l-4 border-blue-500 bg-blue-50 pl-4 py-2 mb-4 rounded-r-lg italic text-gray-700"
+        >
+          {children}
+        </blockquote>
+      );
+    case 'code-block':
+      const codeLines = element.children[0]?.text?.split('\n') || [''];
+      return (
+        <div
+          {...attributes}
+          className="mb-4 w-full rounded-lg  overflow-x-scroll bg-[#f6f8fa] border border-[#d0d7de]"
+        >
+          <div className="flex w-full">
+            {/* 行号区域 */}
+            <div className="py-4 pr-4 pl-3 text-right select-none bg-[#f6f8fa] border-r border-[#d0d7de] text-gray-400 font-mono text-xs">
+              {codeLines.map((_: string, i: number) => (
+                <div key={i} className="leading-5">
+                  {i + 1}
+                </div>
+              ))}
+            </div>
+            {/* 代码区域 */}
+            <pre className="flex-1 p-4 m-0 overflow-x-auto bg-[#f6f8fa] text-[#1f2328]">
+              <code className="font-mono text-sm leading-5">{children}</code>
+            </pre>
+          </div>
+        </div>
+      );
+    case 'think':
+      if (!element.thinkContent) return <></>;
+      // 1. 获取唯一 key
+      const thinkKey =
+        element.id ||
+        element.queryId ||
+        props.parentIndex ||
+        element.key ||
+        Math.random().toString(36).slice(2);
+      // 2. 获取展开状态和 toggle 回调
+      //  console.log('props.thinkExpandMap', props.thinkExpandMap);
+
+      const expanded =
+        props.thinkExpandMap?.[thinkKey] === undefined
+          ? element.finish
+            ? false
+            : true
+          : props.thinkExpandMap?.[thinkKey];
+
+      const onToggle = props.onThinkToggle;
+      // 3. 展示内容
+      let displayChildren = children;
+      const arr = React.Children.toArray(children);
+      const needExpand = arr.length > 3;
+      if (!needExpand) {
+        displayChildren = arr;
+      } else if (!expanded) {
+        displayChildren = (
+          <>
+            {arr.slice(0, 2)}
+            <span style={{ color: '#aaa' }}> ... </span>
+          </>
+        );
+      } else {
+        displayChildren = arr;
+      }
+      return (
+        <div
+          {...attributes}
+          style={{
+            background: '#f8fafc',
+            borderRadius: '8px',
+            border: '1px dashed #e0e7ef',
+            color: '#b0b8c9',
+            margin: '16px 0',
+            padding: '0',
+            position: 'relative',
+            fontStyle: 'italic',
+            overflow: 'hidden',
+            display: 'flex',
+          }}
+          className="relative my-4"
+        >
+          <div
+            style={{
+              width: 4,
+              background: 'linear-gradient(to bottom, #e0e7ef 60%, #f1f5f9 100%)',
+              borderRadius: '2px',
+              marginRight: 12,
+              minHeight: '100%',
+              padding: '12px 0',
+            }}
+          />
+          <div style={{ flex: 1 }}>
+            <div
+              style={{ color: '#b0b8c9', fontSize: '13px', lineHeight: 1.7, padding: '8px 12px' }}
+            >
+              {displayChildren}
+              {needExpand && (
+                <button
+                  style={{
+                    color: '#1890ff',
+                    marginLeft: 8,
+                    fontSize: 12,
+                    background: 'none',
+                    border: 'none',
+                    cursor: 'pointer',
+                  }}
+                  onClick={e => {
+                    e.stopPropagation();
+                    onToggle && onToggle(thinkKey);
+                  }}
+                >
+                  {expanded ? '收起' : '展开'}
+                </button>
+              )}
+            </div>
+          </div>
+        </div>
+      );
+
+    default:
+      return (
+        <div {...attributes} className="mb-4">
+          {children}
+        </div>
+      );
+  }
+};
+
+export const renderLeaf = (props: any) => {
+  const { attributes, children, leaf } = props;
+  let el = children;
+
+  // retrive-tag 行内高亮渲染
+  if (leaf.retrive) {
+    // 获取全局编号映射
+    let retriveTagIndexMap = props.retriveTagIndexMap;
+    if (
+      !retriveTagIndexMap &&
+      props.editor &&
+      props.editor.children &&
+      props.editor.children._retriveTagIndexMap
+    ) {
+      retriveTagIndexMap = props.editor.children._retriveTagIndexMap;
+    }
+    // 只渲染indexId，阿拉伯数字
+    let num = leaf.indexId;
+    if (!num && leaf.id && retriveTagIndexMap && retriveTagIndexMap[leaf.id]) {
+      num = retriveTagIndexMap[leaf.id];
+    }
+    el = (
+      <span
+        {...attributes}
+        style={{
+          display: 'inline-block',
+          background: leaf.fromtype === '1' ? '#dcf9d8' : '#e6f7ff',
+          color: leaf.fromtype === '1' ? '#23eb0d' : '#1890ff',
+          border: leaf.fromtype === '1' ? '1px solid #c3f7bd' : '1px solid rgba(114,187,255,0.3)',
+          borderRadius: 6,
+          padding: '1px 6px',
+          margin: '0 2px',
+          fontWeight: 600,
+          fontSize: 12,
+          lineHeight: '17px',
+          cursor: leaf.fromtype === '1' ? 'default' : 'pointer',
+          verticalAlign: 'middle',
+        }}
+        onClick={() => {
+          if (props.onRetriveTagClick) {
+            props.onRetriveTagClick(leaf, attributes);
+          }
+        }}
+        onMouseEnter={e =>
+          (e.currentTarget.style.background = leaf.fromtype === '1' ? '#dcf9d8' : '#bae7ff')
+        }
+        onMouseLeave={e =>
+          (e.currentTarget.style.background = leaf.fromtype === '1' ? '#dcf9d8' : '#e6f7ff')
+        }
+      >
+        {num}
+      </span>
+    );
+    return el;
+  }
+
+  if (leaf.code) {
+    el = (
+      <code
+        style={{
+          padding: '0.125rem 0.375rem',
+          margin: '0 0.125rem',
+          borderRadius: '0.25rem',
+          backgroundColor: '#f6f8fa',
+          color: '#1f2328',
+          fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace',
+          fontSize: '0.875rem',
+          border: '1px solid #d0d7de',
+          fontWeight: leaf.bold ? 600 : 'normal',
+          fontStyle: leaf.italic ? 'italic' : 'normal',
+          textDecoration:
+            [leaf.underline && 'underline', leaf.strikethrough && 'line-through']
+              .filter(Boolean)
+              .join(' ') || 'none',
+        }}
+      >
+        {el}
+      </code>
+    );
+  } else {
+    const style: React.CSSProperties = {
+      fontWeight: leaf.bold ? 600 : 'normal',
+      fontStyle: leaf.italic ? 'italic' : 'normal',
+      textDecoration:
+        [leaf.underline && 'underline', leaf.strikethrough && 'line-through']
+          .filter(Boolean)
+          .join(' ') || 'none',
+      color: leaf.strikethrough ? '#6b7280' : 'inherit',
+    };
+    el = <span style={style}>{el}</span>;
+  }
+
+  if (leaf.link) {
+    el = (
+      <a
+        href={leaf.link}
+        target="_blank"
+        rel="noopener noreferrer"
+        style={{
+          color: '#3b82f6',
+          textDecoration: 'underline',
+        }}
+        onMouseEnter={e => {
+          e.currentTarget.style.color = '#2563eb';
+        }}
+        onMouseLeave={e => {
+          e.currentTarget.style.color = '#3b82f6';
+        }}
+      >
+        {el}
+      </a>
+    );
+  }
+
+  return <span {...attributes}>{el}</span>;
+};
+
+// 递归渲染，传递 parent
+export function renderNodesWithParent(nodes: any[], parent: any = null): React.ReactNode[] {
+  return nodes.map((node: any, i: number) =>
+    React.cloneElement(
+      renderElement({
+        element: node,
+        attributes: {},
+        children:
+          node.children && Array.isArray(node.children)
+            ? renderNodesWithParent(node.children, node)
+            : node.children,
+        parent,
+      }),
+      { key: i }
+    )
+  );
+}

package/src/utils/gientechCommon/utils/fileUtils.ts

@@ -0,0 +1,86 @@
+/**
+ * 文件工具函数
+ * 用于统一 chat 和 headlessChat 的文件处理逻辑
+ */
+
+/**
+ * 文件结构标准化，保证有 file 字段
+ * @param f - 文件对象（可能是扁平对象或已有 file 字段的对象）
+ * @returns 标准化后的文件对象
+ */
+export function normalizeFileItem(f: any) {
+  if (!f) return f;
+  if (f.file && f.file.name) {
+    // 如果已有 file 字段，确保有 preview 字段（用于图片预览）
+    if (f.filePath && !f.preview) {
+      const fileName = f.file.name || f.name || '';
+      const fileExt = fileName.split('.').pop()?.toLowerCase() || '';
+      const isImage = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp'].includes(fileExt) || f.type === 'image';
+      if (isImage) {
+        return {
+          ...f,
+          preview: f.filePath,
+          url: f.url || f.filePath,
+        };
+      }
+    }
+    return f;
+  }
+  // 兼容后端返回的扁平对象，优先 name，其次 fileName
+  const name = f.name || f.fileName || '';
+  const fileExt = name.split('.').pop()?.toLowerCase() || '';
+  const isImage = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp'].includes(fileExt) || f.type === 'image';
+  return {
+    ...f,
+    url: f.filePath || f.url || '',
+    uid: f.uid || '',
+    preview: isImage && f.filePath ? f.filePath : (f.preview || undefined),
+    file: {
+      name,
+      size:
+        typeof f.size === 'string' && f.size.endsWith('MB')
+          ? Number(f.size.replace('MB', '')) * 1024 * 1024
+          : f.size || 0,
+      type: f.type || '',
+    },
+    name, // 兜底 name 字段，供 UI 使用
+  };
+}
+
+/**
+ * 合并文件工具，避免重复，且保证每个文件有 file 字段
+ * @param oldFiles - 旧文件列表
+ * @param newFiles - 新文件列表
+ * @returns 合并去重后的文件列表
+ */
+export function mergeFiles(oldFiles: any[], newFiles: any[]) {
+  const map = new Map();
+  oldFiles.forEach(f => map.set(f.uid, normalizeFileItem(f)));
+  newFiles.forEach(f => map.set(f.uid, normalizeFileItem(f)));
+  return Array.from(map.values());
+}
+
+/**
+ * 将后端返回的文件列表转换为标准格式
+ * @param files - 后端返回的文件数组
+ * @param getFileTypeByName - 获取文件类型的函数
+ * @returns 标准化后的文件数组
+ */
+export function normalizeUploadedFiles(files: any[], getFileTypeByName: (name: string) => string) {
+  return files.map((f: any) => {
+    const fileName = f.name || f.fileName || '';
+    return {
+      file: {
+        name: fileName,
+        size: Number(f.size?.replace('MB', '')) * 1024 * 1024 || 0,
+        type: f.type,
+      } as File,
+      type: getFileTypeByName(fileName),
+      status: 'uploaded' as const,
+      url: f.filePath,
+      convertedFilePath: f.convertedFilePath,
+      uid: f.uid,
+      preview: f.type === 'image' ? f.filePath : undefined,
+    };
+  });
+}

package/src/utils/gientechCommon/utils/request.ts

@@ -0,0 +1,37 @@
+import axios from 'axios';
+import { message } from 'antd';
+
+const request = axios.create({
+  timeout: 15000,
+});
+
+// 响应拦截器统一处理错误
+request.interceptors.response.use(
+  response => {
+    if (response.data && response.data.success === false) {
+      message.error(response.data.errorMsg || '请求失败');
+      return Promise.reject(response.data);
+    }
+    return response;
+  },
+  error => {
+    // 401 特殊处理
+    if (error?.response?.status === 401) {
+      const authError = new Error('Unauthorized');
+      (authError as any).isAuthError = true;
+      (authError as any).origin = error;
+      return Promise.reject(authError);
+    }
+    if (error?.response?.status === 500) {
+      const authError = new Error('Server Error');
+      (authError as any).isAuthError = true;
+      (authError as any).origin = error;
+      return Promise.reject(authError);
+    }
+    // 其它错误可以弹窗
+    // message.error(error?.response?.data?.errorMsg || error.message || '网络错误');
+    return Promise.reject(error);
+  }
+);
+
+export default request;