bhd-components 0.10.37 → 0.10.38

package/esm/customerService/index.js

@@ -58,6 +58,13 @@ function escapeHtml(str) {
     }
     return str;
 }
+var pattern = /!\[.*?\]\((.*?)\)/;
+var exactRegex = /class\s*=\s*["']think-block["']/;
+// 去掉think
+var replaceThinkAndYaml = function() {
+    var text = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "";
+    return text.replace(/```(\s)?yaml(?:.|\n)*?```/ig, "").replace(/<thinking>([\s\S]*?)<\/thinking>/g, "").replace(RegExp('<div\\s+class="think-block">.*?<\\/div>', "gs"), "");
+};
 mermaid.initialize({
     startOnLoad: false,
     theme: "default",
@@ -140,6 +147,7 @@ var CustomerService = function(props) {
     var getLisyFlagRef = useRef(0);
     var _useState36 = _sliced_to_array(useState(false), 2), showMemaid = _useState36[0], setShowMemaid = _useState36[1]; //是否显示mermaid弹窗
     var _useState37 = _sliced_to_array(useState(""), 2), memaidContent = _useState37[0], setMemaidContent = _useState37[1]; //mermaid内容
+    var shouqiTimer = useRef(null);
     var remarkable = new Remarkable({
         html: true,
         highlight: function highlight(str, lang) {
@@ -226,6 +234,7 @@ var CustomerService = function(props) {
         //   //获取热门推荐
         //   videoPageQuestiionsList(1);
         // }
+        console.log("initShowType", initShowType);
         setShowType(initShowType);
     }, [
         initShowType
@@ -1395,6 +1404,7 @@ var CustomerService = function(props) {
             //先请求问题列表
             videoPageQuestiionsList(3);
         }
+        var hasYamlStarted = false;
         //使用fetchEventSource接收数据
         var eventSource = fetchEventSource("".concat(urllocation, "/chat-service/public/v1.0/chat-with-ai/messages"), {
             method: "POST",
@@ -1504,7 +1514,12 @@ var CustomerService = function(props) {
                 //识别的内容
                 // console.log("eventSource msg: ", event.data);
                 var msg = JSON.parse(event.data);
-                if (msg.message) {}
+                if (msg.message) {
+                    if (!hasYamlStarted && msg.message && /```\s*yaml/.test(content)) {
+                        hasYamlStarted = true;
+                    }
+                    msg.message = msg.message.replace(/<thinking>/g, '<div class="think-block">').replace(/<\/thinking>/g, "</div>\n");
+                }
                 finishedRef.current = false;
                 setFinished(false);
                 msgStreamingCountRef.current = msgStreamingCountRef.current + 1;
@@ -1521,6 +1536,20 @@ var CustomerService = function(props) {
                         videoPageQuestiionsList(2);
                     }
                     testLabQuestion(JSON.parse(data).message, content, "");
+                    if (shouqiTimer.current) {
+                        clearTimeout(shouqiTimer.current);
+                    }
+                    shouqiTimer.current = setTimeout(function() {
+                        if ($(".think-block").last().css("display") === "block") {
+                            clearTimeout(shouqiTimer.current);
+                            $(".think-block").last().parent().find(".think-block").css({
+                                display: "none"
+                            });
+                            $(".think-block").last().parent().parent().find("i").css({
+                                transform: "rotate(180deg)"
+                            });
+                        }
+                    }, 1000);
                 } else {}
             },
             onclose: function onclose() {
@@ -1540,7 +1569,8 @@ var CustomerService = function(props) {
         // console.log(aiSendQuestions().abort(),'slkdsdsdsd')
         if (pageNumHistory > 1) return;
         var obj = msg;
-        var id = msg.messageId;
+        var tempId = "ai thought process";
+        var id = tempId; // 原：let id = msg.messageId;  备注：解决思考过程返回的messageId和下边回复的内容值不同问题，新：改成临时固定相同id，finished完成时替换为实际返回的messageId值
         setHistoryMessageList(function(prevHistoryMessageList) {
             var list1 = prevHistoryMessageList;
             //删除临时数据
@@ -1607,6 +1637,17 @@ var CustomerService = function(props) {
         console.log("isPosition", isPosition.current);
         scrollToBottom();
         if (msg.finished) {
+            setHistoryMessageList(function(prevHistoryMessageList) {
+                return prevHistoryMessageList.map(function(item) {
+                    if (item.id === tempId) {
+                        return _object_spread_props(_object_spread({}, item), {
+                            id: msg.messageId
+                        });
+                    } else {
+                        return item;
+                    }
+                });
+            });
             console.log("返回完成", msg, msgStreamingCountRef.current);
             //发送结束
             finishedRef.current = true;
@@ -1714,6 +1755,12 @@ var CustomerService = function(props) {
                 //     getHistoryMessage(page-1,5,'1',dataList);
                 //     return;
                 // }
+                dataList = dataList.map(function(ele, index) {
+                    if (ele.message.includes("<thinking>") && !ele.message.includes("</thinking>")) {
+                        ele.message = ele.message + "</thinking>";
+                    }
+                    return ele;
+                });
                 setPageCount(Math.ceil(total / maxPageSize));
                 setFirstItemIndex(total - maxPageSize * (page - 1));
                 var newHistoryMessageList = [];
@@ -2546,6 +2593,9 @@ var CustomerService = function(props) {
                 message = removeMermaidBlockComments(message);
             }
             message = handleRenderSyntaxBlock(message, finishedRef.current || i != historyMessageList.length - 1);
+            message = message.replace(/<thinking>([\s\S]*?)<\/thinking>/g, '<div class="think-block">$1</div>\n');
+            message = message.replace(/```(\s)?yaml(?:.|\n)*?```/ig, "");
+            message = message.replace(/```\s*yaml[\s\S]*/, "");
             if (lastId == item.id && keyWordProblem != "") {
                 //点击历史记录时，找到关键字，防止关键字和标签名重复
                 // let key_sign = 'sign_'+new Date().getTime();+'sign';
@@ -2594,6 +2644,8 @@ var CustomerService = function(props) {
                                                                 /*#__PURE__*/ _jsx("i", {
                                                                     className: "yinyong_quote1",
                                                                     onClick: function() {
+                                                                        // 问题的引用
+                                                                        item.message = replaceThinkAndYaml(item.message);
                                                                         setCitationContent({
                                                                             content: item.message,
                                                                             id: item.id,
@@ -2675,14 +2727,14 @@ var CustomerService = function(props) {
                                             item.quotedMessage && /*#__PURE__*/ _jsxs("div", {
                                                 className: styles.citation_content,
                                                 children: [
-                                                    getByteLen(item.quotedMessage) > 120 ? /*#__PURE__*/ _jsx(Tooltip, {
+                                                    getByteLen(replaceThinkAndYaml(item.quotedMessage)) > 120 ? /*#__PURE__*/ _jsx(Tooltip, {
                                                         overlayClassName: styles.popover_main_content,
-                                                        title: item.quotedMessage,
+                                                        title: replaceThinkAndYaml(item.quotedMessage),
                                                         placement: "leftTop",
                                                         children: /*#__PURE__*/ _jsxs("p", {
                                                             className: styles.text_exceed,
                                                             children: [
-                                                                item.quotedMessage,
+                                                                replaceThinkAndYaml(item.quotedMessage),
                                                                 /*#__PURE__*/ _jsx(RightOutlined, {})
                                                             ]
                                                         })
@@ -2840,6 +2892,35 @@ var CustomerService = function(props) {
                                                 /*#__PURE__*/ _jsxs("div", {
                                                     className: styles.content,
                                                     children: [
+                                                        !exactRegex.test(message) ? null : /*#__PURE__*/ _jsxs("div", {
+                                                            id: "click_" + i,
+                                                            onClick: function() {
+                                                                if ($("#click_".concat(i, " + p .think-block")).css("display") === "inline-block" || $("#click_".concat(i, " + p .think-block")).css("display") === "block") {
+                                                                    $("#click_".concat(i, " + p .think-block")).css({
+                                                                        display: "none"
+                                                                    });
+                                                                    $("#click_".concat(i, " i")).css({
+                                                                        transform: "rotate(180deg)"
+                                                                    });
+                                                                } else {
+                                                                    $("#click_".concat(i, " + p .think-block")).css({
+                                                                        display: "block"
+                                                                    });
+                                                                    $("#click_".concat(i, " i")).css({
+                                                                        transform: "rotate(0deg)"
+                                                                    });
+                                                                }
+                                                            },
+                                                            className: styles.content_put,
+                                                            children: [
+                                                                /*#__PURE__*/ _jsx("span", {
+                                                                    children: "思考过程"
+                                                                }),
+                                                                /*#__PURE__*/ _jsx("i", {
+                                                                    className: "iconfont iconfangxiang-xiaxiao"
+                                                                })
+                                                            ]
+                                                        }),
                                                         item.message != "AI助手繁忙，请稍后再提问或" && /*#__PURE__*/ _jsx("p", {
                                                             dangerouslySetInnerHTML: {
                                                                 __html: message
@@ -2924,14 +3005,14 @@ var CustomerService = function(props) {
                                                 item.quotedMessage && /*#__PURE__*/ _jsxs("div", {
                                                     className: styles.citation_content,
                                                     children: [
-                                                        getByteLen(item.quotedMessage) > 120 ? /*#__PURE__*/ _jsx(Tooltip, {
+                                                        getByteLen(replaceThinkAndYaml(item.quotedMessage)) > 120 ? /*#__PURE__*/ _jsx(Tooltip, {
                                                             overlayClassName: styles.popover_main_content,
-                                                            title: item.quotedMessage,
+                                                            title: replaceThinkAndYaml(item.quotedMessage),
                                                             placement: "rightTop",
                                                             children: /*#__PURE__*/ _jsxs("p", {
                                                                 className: styles.text_exceed,
                                                                 children: [
-                                                                    item.quotedMessage,
+                                                                    replaceThinkAndYaml(item.quotedMessage),
                                                                     /*#__PURE__*/ _jsx(RightOutlined, {})
                                                                 ]
                                                             })
@@ -3159,6 +3240,8 @@ var CustomerService = function(props) {
                 /*#__PURE__*/ _jsx("i", {
                     className: "yinyong_quote1",
                     onClick: function() {
+                        // 答案的引用
+                        item.message = replaceThinkAndYaml(item.message);
                         setCitationContent({
                             content: item.message,
                             imageUrl: item.extraInfo && JSON.parse(extraInfo).length > 0 && JSON.parse(extraInfo)[0].key == "imageUrl" && JSON.parse(extraInfo)[0].value,
@@ -3367,6 +3450,7 @@ var CustomerService = function(props) {
                         /*#__PURE__*/ _jsx("i", {
                             className: "yinyong_quote1",
                             onClick: function() {
+                                item.message = replaceThinkAndYaml(item.message);
                                 setCitationContent({
                                     content: item.message,
                                     imageUrl: item.extraInfo && JSON.parse(extraInfo).length > 0 && JSON.parse(extraInfo)[0].key == "imageUrl" && JSON.parse(extraInfo)[0].value,

package/esm/customerService/index.module.less

@@ -369,6 +369,42 @@
               .content_child {
                 padding: 0;
                 line-height: 1;
+                img {
+                  width: 100%;
+                }
+                :global {
+                  .think-block {
+                    padding: 12px;
+                    border-left: 1px solid rgba(0, 0, 0, 0.15);
+                    background: rgba(0, 0, 0, 0.04);
+                    // display: inline-block;
+                    margin-bottom: 8px;
+                    width: 100%;
+                    font-weight: 400;
+                    font-size: 12px;
+                    line-height: 1.5;
+                    color: rgba(0, 0, 0, 0.45);
+                    * {
+                      color: rgba(0, 0, 0, 0.45);
+                      font-weight: 400;
+                      font-size: 12px;
+                      line-height: 150%;
+                    }
+                    &:not(:first-of-type, :last-of-type){
+                      padding-top:0;
+                      padding-bottom: 0;
+                    }
+                    &:first-of-type{
+                      padding-top: 12px !important;
+                    }
+                    &:last-of-type{
+                      padding-bottom: 12px !important;
+                    }
+                    &+.think-block{
+                      margin-top: -8px;
+                    }
+                  }
+                }
 
                 p{
                   word-break: break-all;
@@ -441,7 +477,7 @@
                 // > ul + *, > ol + * {
                 //   margin-top:16px;
                 // }
-                > *:not(pre){
+                > *:not(pre):not(:global(.think-block)){
                   word-break: break-all;
                   padding-top: 8px;
                   padding-bottom: 8px;
@@ -2279,4 +2315,24 @@ strong {
     padding: 10px;
   }
   
+}
+
+.content_put {
+  display: flex;
+  padding: 4px 16px;
+  margin-bottom: 8px;
+  border-radius: 100px;
+  background: rgba(0, 0, 0, 0.04);
+  width: max-content;
+  align-items: center;
+  cursor: pointer;
+  span {
+    color: rgba(0, 0, 0, 0.65);
+    font-size: 12px;
+    font-weight: 400;
+    line-height: 150%;
+  }
+  i {
+    margin-left: 8px;
+  }
 }

package/esm/customerService/index2.module.less

@@ -365,6 +365,43 @@
               .content_child {
                 padding: 0;
                 line-height: 1;
+                img {
+                  width: 100%;
+                }
+                :global {
+                  .think-block {
+                    padding: 12px;
+                    padding-top: 12px !important;
+                    border-left: 1px solid rgba(0, 0, 0, 0.15);
+                    background: rgba(0, 0, 0, 0.04);
+                    // display: inline-block;
+                    margin-bottom: 8px;
+                    width: 100%;
+                    font-weight: 400;
+                    font-size: 12px;
+                    line-height: 1.5;
+                    color: rgba(0, 0, 0, 0.45);
+                    * {
+                      color: rgba(0, 0, 0, 0.45);
+                      font-weight: 400;
+                      font-size: 12px;
+                      line-height: 150%;
+                    }
+                    &:not(:first-of-type, :last-of-type){
+                      padding-top:0;
+                      padding-bottom: 0;
+                    }
+                    &:first-of-type{
+                      padding-top: 12px !important;
+                    }
+                    &:last-of-type{
+                      padding-bottom: 12px !important;
+                    }
+                    &+.think-block{
+                      margin-top: -8px;
+                    }
+                  }
+                }
                 p{
                   word-break: break-all;
                   white-space: break-spaces;
@@ -436,7 +473,7 @@
                 // > ul + *, > ol + * {
                 //   margin-top:16px;
                 // }
-                > *:not(pre){
+                > *:not(pre):not(:global(.think-block)){
                   word-break: break-all;
                   padding-top: 8px;
                   padding-bottom: 8px;
@@ -2217,3 +2254,23 @@
 strong {
   font-weight: bold !important;
 }
+
+.content_put {
+  display: flex;
+  padding: 4px 16px;
+  margin-bottom: 8px;
+  border-radius: 100px;
+  background: rgba(0, 0, 0, 0.04);
+  width: max-content;
+  align-items: center;
+  cursor: pointer;
+  span {
+    color: rgba(0, 0, 0, 0.65);
+    font-size: 12px;
+    font-weight: 400;
+    line-height: 150%;
+  }
+  i {
+    margin-left: 8px;
+  }
+}

package/package.json

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