bhd-components 0.10.8 → 0.10.10

package/esm/AIMessageList/components/virtuosoList/index.js

@@ -49,8 +49,8 @@ var VirtuosoList = /*#__PURE__*/ forwardRef(function(props, ref) {
     var prefix = props.prefix, contentConfig = props.contentConfig, apiRef = props.apiRef;
     var getList = contentConfig.getList, coverRenderText = contentConfig.coverRenderText, _contentConfig_msgAction = contentConfig.msgAction, msgAction = _contentConfig_msgAction === void 0 ? [
         "copy",
-        "references"
-    ] : _contentConfig_msgAction, coverRenderReferences = contentConfig.coverRenderReferences, _contentConfig_onRecordMessage = contentConfig.onRecordMessage, onRecordMessage = _contentConfig_onRecordMessage === void 0 ? function() {} : _contentConfig_onRecordMessage, _contentConfig_onVoteChange = contentConfig.onVoteChange, onVoteChange = _contentConfig_onVoteChange === void 0 ? function() {} : _contentConfig_onVoteChange, _contentConfig_onRefresh = contentConfig.onRefresh, onRefresh = _contentConfig_onRefresh === void 0 ? function() {} : _contentConfig_onRefresh, iconFileRender = contentConfig.iconFileRender;
+        "reference"
+    ] : _contentConfig_msgAction, coverRenderReferences = contentConfig.coverRenderReferences, _contentConfig_onRecordMessage = contentConfig.onRecordMessage, onRecordMessage = _contentConfig_onRecordMessage === void 0 ? function() {} : _contentConfig_onRecordMessage, _contentConfig_onVoteChange = contentConfig.onVoteChange, onVoteChange = _contentConfig_onVoteChange === void 0 ? function() {} : _contentConfig_onVoteChange, _contentConfig_onRefresh = contentConfig.onRefresh, onRefresh = _contentConfig_onRefresh === void 0 ? function() {} : _contentConfig_onRefresh, helloMsg = contentConfig.helloMsg, _contentConfig_fileCustomRender = contentConfig.fileCustomRender, fileCustomRender = _contentConfig_fileCustomRender === void 0 ? {} : _contentConfig_fileCustomRender;
     var loadMoreProps = contentConfig.loadMore || true;
     var virtuosoRef = useRef(null);
     var _useState = _sliced_to_array(useState(false), 2), loading = _useState[0], setLoading = _useState[1]; // 是否加载中
@@ -77,20 +77,7 @@ var VirtuosoList = /*#__PURE__*/ forwardRef(function(props, ref) {
     var htmlRenderCache = useRef(new Map()).current;
     useImperativeHandle(ref, function() {
         return {
-            addMsg: function(msg) {
-                if (msg.id !== "inputing") {
-                    // 不记录"正在输入..."的消息
-                    onRecordMessage(msg);
-                }
-                setDataSource(function(data) {
-                    return _to_consumable_array(data).concat([
-                        msg
-                    ]);
-                });
-                timerRef.current.scrollTimer = setTimeout(function() {
-                    scrollToBottom();
-                }, 100);
-            },
+            addMsg: addMsg,
             updateMsg: function(id, obj) {
                 setDataSource(function(data) {
                     return data.map(function(item) {
@@ -134,7 +121,19 @@ var VirtuosoList = /*#__PURE__*/ forwardRef(function(props, ref) {
         };
     });
     useEffect(function() {
-        getData(page, pageSize);
+        getData(page, pageSize).then(function() {
+            if (helloMsg) {
+                addMsg({
+                    id: "helloMsg",
+                    createTime: new Date().getTime(),
+                    content: helloMsg,
+                    location: "left",
+                    reference: null,
+                    source: null,
+                    fileList: []
+                });
+            }
+        });
         var removeFn = delegate(wrapperRef.current, "click", ".".concat(styles.copyCode), function(event, target) {
             findCopyContent(event);
         });
@@ -175,6 +174,37 @@ var VirtuosoList = /*#__PURE__*/ forwardRef(function(props, ref) {
         dataSource,
         sendingId
     ]);
+    var addMsg = function(msg) {
+        if (msg.id !== "inputing" && msg.id !== "helloMsg") {
+            // 不记录"正在输入..."的消息
+            onRecordMessage(msg);
+        }
+        var list = [];
+        if (msg.location === "right" && msg.fileList && msg.fileList.length > 0) {
+            console.log("fileList", msg, msg.fileList);
+            msg.fileList.map(function(item) {
+                list.push({
+                    type: "file",
+                    id: item.fileId,
+                    createTime: msg.createTime,
+                    content: "",
+                    location: "right",
+                    reference: null,
+                    source: null,
+                    suffix: item.suffix,
+                    fileSize: item.size || 0,
+                    fileTitle: item.name
+                });
+            });
+        }
+        list.push(msg);
+        setDataSource(function(data) {
+            return _to_consumable_array(data).concat(_to_consumable_array(list));
+        });
+        timerRef.current.scrollTimer = setTimeout(function() {
+            scrollToBottom();
+        }, 100);
+    };
     var scrollToBottom = function() {
         if (!virtuosoRef.current) return;
         virtuosoRef.current.scrollToIndex({
@@ -184,21 +214,17 @@ var VirtuosoList = /*#__PURE__*/ forwardRef(function(props, ref) {
     };
     var getData = function(page, pageSize) {
         setLoading(true);
-        clearTimeout(timerRef.current.loadMore);
-        timerRef.current.loadMore = setTimeout(function() {
+        return getList(page, pageSize).then(function(listObj) {
             setLoading(false);
-            getList(page, pageSize).then(function(listObj) {
-                setLoading(false);
-                console.log("listObjlistObj", listObj);
-                setDataSource(function(data) {
-                    return _to_consumable_array(data).concat(_to_consumable_array(listObj.dataSource));
-                });
-                setTotal(listObj.total);
-                setPage(page);
-                setPageSize(pageSize);
-                setFirstItemIndex(listObj.total - pageSize * (page - 1));
+            console.log("listObjlistObj", listObj);
+            setDataSource(function(data) {
+                return _to_consumable_array(data).concat(_to_consumable_array(listObj.dataSource));
             });
-        }, 500);
+            setTotal(listObj.total);
+            setPage(page);
+            setPageSize(pageSize);
+            setFirstItemIndex(listObj.total - pageSize * (page - 1));
+        });
     };
     var getCls = function(clsName) {
         return styles[clsName] + " " + prefix + "-" + clsName;
@@ -228,26 +254,32 @@ var VirtuosoList = /*#__PURE__*/ forwardRef(function(props, ref) {
         // item.fileTitle = "这是一个文件名称.docx";
         // item.fileSize = "5Mb";
         if (item.type === "file") {
-            contentNode = /*#__PURE__*/ _jsxs("div", {
-                className: "".concat(getCls("msgItem-file")),
-                children: [
-                    /*#__PURE__*/ _jsx("div", {
-                        className: "".concat(getCls("msgItem-file-left")),
-                        children: fileIconRender(item.suffix, iconFileRender)
-                    }),
-                    /*#__PURE__*/ _jsxs("div", {
-                        className: "".concat(getCls("msgItem-file-right")),
-                        children: [
-                            /*#__PURE__*/ _jsx("p", {
-                                children: item.fileTitle
-                            }),
-                            /*#__PURE__*/ _jsx("p", {
-                                children: item.fileSize
+            var renderFileObj = _object_spread({
+                fileTitleRender: function(item) {
+                    return /*#__PURE__*/ _jsx(_Fragment, {
+                        children: item.fileTitle
+                    });
+                }
+            }, fileCustomRender);
+            if (renderFileObj.fileRender) {
+                contentNode = renderFileObj.fileRender(item);
+            } else {
+                contentNode = /*#__PURE__*/ _jsxs("div", {
+                    className: "".concat(getCls("msgItem-file")),
+                    children: [
+                        /*#__PURE__*/ _jsx("div", {
+                            className: "".concat(getCls("msgItem-file-left")),
+                            children: fileIconRender(item.suffix, renderFileObj.iconFileRender)
+                        }),
+                        /*#__PURE__*/ _jsx("div", {
+                            className: "".concat(getCls("msgItem-file-right")),
+                            children: /*#__PURE__*/ _jsx("p", {
+                                children: renderFileObj.fileTitleRender(item)
                             })
-                        ]
-                    })
-                ]
-            });
+                        })
+                    ]
+                });
+            }
         }
         // 是否显示时间
         var itemNode = /*#__PURE__*/ _jsx("div", {
@@ -291,12 +323,30 @@ var VirtuosoList = /*#__PURE__*/ forwardRef(function(props, ref) {
         var referenceNode = null;
         if (reference.type === "text") {
             referenceNode = /*#__PURE__*/ _jsx("div", {
-                className: "".concat(getCls("msgItem-references-text")),
+                className: "".concat(getCls("msgItem-reference-text")),
                 children: /*#__PURE__*/ _jsx("div", {
                     children: reference.value
                 })
             });
         }
+        if (reference.type === "file") {
+            referenceNode = /*#__PURE__*/ _jsx("div", {
+                className: "".concat(getCls("msgItem-reference-file")),
+                children: /*#__PURE__*/ _jsxs("div", {
+                    className: "".concat(getCls("msgItem-reference-file-box")),
+                    children: [
+                        /*#__PURE__*/ _jsx("div", {
+                            className: "".concat(getCls("msgItem-reference-file-left")),
+                            children: fileIconRender(reference.value.suffix, fileCustomRender.iconFileRender)
+                        }),
+                        /*#__PURE__*/ _jsx("div", {
+                            className: "".concat(getCls("msgItem-reference-file-right")),
+                            children: reference.value.name
+                        })
+                    ]
+                })
+            });
+        }
         if (coverRenderReferences) {
             return coverRenderReferences(item, referenceNode);
         } else {
@@ -419,7 +469,7 @@ var VirtuosoList = /*#__PURE__*/ forwardRef(function(props, ref) {
             if (!msgAction.includes("copy")) {
                 copyNode = null;
             }
-            if (!msgAction.includes("references")) {
+            if (!msgAction.includes("reference")) {
                 referencesNode = null;
             }
             if (!msgAction.includes("upVite")) {
@@ -586,6 +636,9 @@ var VirtuosoList = /*#__PURE__*/ forwardRef(function(props, ref) {
             p[0].innerText = "复制代码";
         }
     };
+    var onScroll = function() {
+        console.log("滚动滚动");
+    };
     return /*#__PURE__*/ _jsx("div", {
         className: "".concat(getCls("virtuosoList-wrapper")),
         ref: wrapperRef,
@@ -610,7 +663,8 @@ var VirtuosoList = /*#__PURE__*/ forwardRef(function(props, ref) {
                 Header: Header
             },
             increaseViewportBy: 200,
-            overscan: 10
+            overscan: 10,
+            onScroll: onScroll
         })
     });
 });

package/esm/AIMessageList/components/virtuosoList/index.module.less

@@ -274,30 +274,33 @@
             border-radius: 8px;
             border: 1px solid #ebebeb;
             gap: 12px;
-            .msgItem-file-left{
+            min-width: 216px;
+            .msgItem-file-left {
               font-size: 24px;
               display: flex;
               justify-content: center;
               align-items: center;
               padding: 0;
               margin: 0;
-              &>i{
+              & > i {
                 display: flex;
                 font-size: 24px;
               }
             }
-            .msgItem-file-right{
+            .msgItem-file-right {
               font-size: 14px;
               font-weight: 400;
               color: rgba(0, 0, 0, 0.65);
-              &>p{
-                &:nth-child(1){
-                  margin-bottom: 4px;
-                }
-                &:nth-child(2){
-                  font-size: 12px;
-                  color: rgba(0, 0, 0, 0.25);
+              margin: 0;
+              padding: 0;
+              & > p {
+                &:nth-child(1) {
+                  // margin-bottom: 4px;
                 }
+                // &:nth-child(2) {
+                //   font-size: 12px;
+                //   color: rgba(0, 0, 0, 0.25);
+                // }
               }
             }
           }
@@ -356,7 +359,7 @@
       }
     }
 
-    .msgItem-references-text {
+    .msgItem-reference-text {
       padding: 8px;
       border-radius: 2px;
       background: #e7e7e7;
@@ -375,6 +378,45 @@
         word-wrap: break-word;
       }
     }
+    .msgItem-reference-file {
+      padding: 8px;
+      border-radius: 2px;
+      background: #e7e7e7;
+      font-size: 12px;
+      color: rgba(0, 0, 0, 0.65);
+      margin-top: 8px;
+
+      .msgItem-reference-file-box {
+        display: flex;
+        align-items: center;
+        gap: 12px;
+        background: #fafafa;
+        border-radius: 8px;
+        border: 1px solid #ebebeb;
+        display: flex;
+        align-items: center;
+        gap: 12px;
+        padding: 8px 12px;
+        min-width: 216px;
+        .msgItem-reference-file-left {
+          font-size: 24px;
+          display: flex;
+          justify-content: center;
+          align-items: center;
+          padding: 0;
+          margin: 0;
+          & > i {
+            display: flex;
+            font-size: 24px;
+          }
+        }
+        .msgItem-reference-file-right {
+          font-size: 14px;
+          font-weight: 400;
+          color: rgba(0, 0, 0, 0.65);
+        }
+      }
+    }
     &.msgItem-left {
       justify-content: flex-start;
       .msgItem-box {

package/esm/AIMessageList/type.d.ts

@@ -62,7 +62,12 @@ export interface contentConfigProps {
   onRecordMessage?: (item: dataItemType) => void; // 发送和接收的消息记录
   onVoteChange?: (type:string,item: dataItemType) => void; // 点赞 或踩
   onRefresh?: (item:dataItemType) => void;// 刷新
-  iconFileRender?: (suffix: string) => React.ReactNode; // 文件上传的 icon。参数 文件对象file 返回值为图标
+  fileCustomRender?: {// 文件对象的自定义渲染
+    iconFileRender?: (suffix: string) => React.ReactNode; // 文件上传的 icon。参数 文件对象file 返回值为图标
+    fileTitleRender?: (item: dataItemType) => React.ReactNode;
+    fileBottomRender?: (item: dataItemType) => React.ReactNode;
+    fileRender?: (item: dataItemType) => React.ReactNode;
+  };
 }
 
 // content props
@@ -206,6 +211,7 @@ export interface fileCustomProps {
   url: string;
   status: fileStatus | undefined;
   source: File | undefined;
+  size:number
 }
 
 // FileList 组件 ref props
@@ -294,7 +300,7 @@ export interface dataItemType {
   vote?:string;// "up":点赞。"down":踩
   type?:"file"|"text",
   suffix?:string;
-  fileSize?:string;
+  fileSize?:number;
   fileTitle?:string;
   fileList?:fileCustomProps[];
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bhd-components",
-  "version": "0.10.8",
+  "version": "0.10.10",
   "description": "组件功能描述",
   "config": {
     "commitizen": {