bhd-components 0.7.9 → 0.7.10

package/esm/customerService/index.js

@@ -40,6 +40,7 @@ var CustomerService = function(props) {
     var _useState4 = _sliced_to_array(useState(""), 2), keyWord = _useState4[0], setKeyWord = _useState4[1]; //搜索内容
     var _useState5 = _sliced_to_array(useState([]), 2), questionsList = _useState5[0], setQuestionsList = _useState5[1]; //问题列表
     var _useState6 = _sliced_to_array(useState([]), 2), hotQuestionsList = _useState6[0], setHotQuestionsList = _useState6[1]; //热门问题
+    // const [videoHotQuestionsList, setVideoHotQuestionsList] = useState([]); //热门问题
     var _useState7 = _sliced_to_array(useState(false), 2), greetingMessage = _useState7[0], setGreetingMessage = _useState7[1]; //聊天记录列表是否请求完成
     var _useState8 = _sliced_to_array(useState(1), 2), pageNum = _useState8[0], setPageNum = _useState8[1]; //页码
     var _useState9 = _sliced_to_array(useState(0), 2), pageNumHistory = _useState9[0], setPageNumHistory = _useState9[1]; //用于搜索历史记录后的页码
@@ -77,6 +78,7 @@ var CustomerService = function(props) {
     var scrollTopHei = useRef(0);
     var isPosition = useRef(true);
     var recommendeQuestionID = useRef([]); //推荐问题id
+    var videoHotQuestionsList = useRef([]); //视频热门问题
     var mid = props.userData.mid;
     var remarkable = new Remarkable({
         highlight: function highlight(str, lang) {
@@ -91,6 +93,21 @@ var CustomerService = function(props) {
             return ""; // use external default escaping
         }
     });
+    useEffect(function() {
+        // console.log(props,'lsdkcmsdlcksd')
+        // getQuestiionsList("", 1);
+        if (props.config && props.config.type == "video") {
+            //获取热门推荐
+            videoPageQuestiionsList(1);
+        // getQuestiionsList("", 3)
+        }
+        setShowType(initShowType);
+    //获取视频页面推荐问题
+    // videoPageQuestiionsList();
+    // scrollToBottom();
+    }, [
+        initShowType
+    ]);
     useEffect(function() {
         var handleScroll = function handleScroll() {
             var container = document.getElementById(showType == 1 || showType == 3 ? "chat_content" : "chat_content_modal");
@@ -139,55 +156,31 @@ var CustomerService = function(props) {
             scrollTopHei.current = scrollTop;
         };
         if (showType == 5) {
-            // 获取屏幕流  
-            // 获取 video 元素和 canvas 元素
-            // var video = document.getElementById('container_html5_api');
-            // // const canvas = document.createElement('canvas'); 
-            // const canvas = document.getElementById('canvas_test');
-            // var context = canvas.getContext('2d');
-            // // 设置 canvas 尺寸
-            // canvas.width = video.videoWidth/4;
-            // canvas.height = video.videoHeight/4;
-            // // 在 canvas 上绘制 video 的当前帧
-            // context.drawImage(video, 0, 0, canvas.width, canvas.height);
-            // // 使用 html2canvas 对 canvas 进行截图
-            // html2canvas(canvas,{
-            //   scale: 1,
-            //   useCORS: true,
-            //   logging: true,
-            // }).then(function(screenshot) {
-            //     // 将截图显示在页面上，或者进行其他操作
-            //     document.body.appendChild(screenshot);
-            //     setTimeout(()=>{
-            //       let url = screenshot.toDataURL('image/png');
-            //       console.log(url);
-            //     },3000)
-            //     // console.log("container_html5_apicontainer_html5_api",screenshot)
-            //     // console.log(screenshot.toDataURL('image/jpeg'))
-            // });
-            // // 显示图片或者做其他操作
             try {
                 setImgBese64("");
-                html2canvas(document.getElementsByTagName("html")[0]).then(function(canvas) {
-                    console.log(canvas, 22222);
-                    setTimeout(function() {
-                        var dom = document.getElementById(screenshotAreaId);
-                        //let dom = document.getElementById("container_html5_api");
-                        //let dom = document.getElementsByTagName('html')[0];
-                        html2canvas(dom, {
-                            useCORS: true,
-                            // allowTaint: true, // 污染处理
-                            scale: 1
-                        }).then(function(canvas) {
-                            // document.body.appendChild(canvas);
-                            // document.body.appendChild(canvas);
-                            console.log(canvas, 4444444);
-                            // var base64URL = canvas.toDataURL('image/jpeg')
-                            var base64URL = canvas.toDataURL("image/jpg", 1.0);
-                            setImgBese64(base64URL);
-                        });
-                    }, 100);
+                // html2canvas(document.getElementsByTagName('html')[0],{
+                //   // ignoreElements:(element)=>{
+                //   //  if(element.compareDocumentPosition(dom)===2)return true
+                //   //     return false
+                //   //  }
+                // }).then((canvas)=>{
+                //   console.log(canvas,22222);
+                // setTimeout(()=>{
+                var dom = document.getElementById(screenshotAreaId);
+                html2canvas(dom, {
+                    useCORS: true,
+                    // allowTaint: true, // 污染处理
+                    scale: 1
+                }).then(function(canvas) {
+                    // document.body.appendChild(canvas);
+                    // document.body.appendChild(canvas);
+                    console.log(canvas, 99999);
+                    // var base64URL = canvas.toDataURL('image/jpeg')
+                    var base64URL = canvas.toDataURL("image/jpg", 1.0);
+                    setImgBese64(base64URL);
                 });
+            //   },100)
+            // })
             } catch (error) {
                 console.log(error);
             }
@@ -228,16 +221,21 @@ var CustomerService = function(props) {
         buttomHei,
         showType
     ]);
+    //创建聊天室并获取聊天室列表
     useEffect(function() {
-        // console.log(props,'lsdkcmsdlcksd')
-        // getQuestiionsList("", 1);
-        setShowType(initShowType);
-        //获取视频页面推荐问题
-        videoPageQuestiionsList();
-        scrollToBottom();
-    }, [
-        initShowType
-    ]);
+        createRooms("AI").then(function(res) {
+            setRoomId(res.data.id);
+        });
+        roomsListTimer();
+        return function() {
+            clearTimeout(receiveMessageTimer.current);
+            // clearTimeout(voiceCountdownTimer.current);
+            clearTimeout(listTimer.current);
+            clearTimeout(timer.current);
+            clearTimeout(roomMessage.current);
+            clearTimeout(chatRoomList.current);
+        };
+    }, []);
     useEffect(function() {
         if (roomId != "") {
             if (lastId == "") {
@@ -258,21 +256,6 @@ var CustomerService = function(props) {
     }, [
         roomId
     ]);
-    //创建聊天室并获取聊天室列表
-    useEffect(function() {
-        createRooms("AI").then(function(res) {
-            setRoomId(res.data.id);
-        });
-        roomsListTimer();
-        return function() {
-            clearTimeout(receiveMessageTimer.current);
-            // clearTimeout(voiceCountdownTimer.current);
-            clearTimeout(listTimer.current);
-            clearTimeout(timer.current);
-            clearTimeout(roomMessage.current);
-            clearTimeout(chatRoomList.current);
-        };
-    }, []);
     //进入页面，发送打招呼信息
     useEffect(function() {
         //老师的聊天窗口不发送打招呼信息
@@ -291,9 +274,8 @@ var CustomerService = function(props) {
             scrollToBottom();
         }
     }, [
-        greetingMessage,
-        hotQuestionsList
-    ]);
+        greetingMessage
+    ]); //hotQuestionsList
     //查找需要复制的代码
     var findCopyContent = function(e) {
         var source = findParent(e.target, styles.copyCode);
@@ -336,10 +318,9 @@ var CustomerService = function(props) {
         var questionsList = [];
         var obj = {};
         if (type == 1) {
-            var questionsId = [];
+            console.log(hotQuestionsList, "33322221111");
             questionsList = hotQuestionsList.map(function(item, index) {
                 if (index < 3) {
-                    questionsId.push(item.id);
                     return {
                         key: "messageSource",
                         value: item.id,
@@ -350,7 +331,6 @@ var CustomerService = function(props) {
                     return null;
                 }
             });
-            recommendeQuestionID.current = questionsId; //保存推荐问题id
             questionsList = questionsList.filter(function(i) {
                 return i != null;
             });
@@ -692,9 +672,9 @@ var CustomerService = function(props) {
         }
         console.log(type, "接受答案77777");
         //获取下面的推荐问题
-        if (type == 2) {
-            videoPageQuestiionsList(2);
-        }
+        // if(type == 2){
+        //   videoPageQuestiionsList(2);
+        // }
         http.post("".concat(urllocation, "/chat-service/public/v1.0/history-messages"), obj).then(function(res) {
             if (res.data.id) {
                 if (pageNumHistory <= 1) {
@@ -773,6 +753,7 @@ var CustomerService = function(props) {
                     "watchTime": watchTime
                 }
             ];
+            obj.regenerate = false;
         }
         var data = JSON.stringify(obj);
         setKeyWord("");
@@ -813,6 +794,10 @@ var CustomerService = function(props) {
             });
             scrollToBottom();
         }
+        if (props.config && props.config.type == "video") {
+            //先请求问题列表
+            videoPageQuestiionsList(3);
+        }
         //使用fetchEventSource接收数据
         var eventSource = fetchEventSource("".concat(urllocation, "/chat-service/public/v1.0/chat-with-ai/messages"), {
             method: "POST",
@@ -985,9 +970,23 @@ var CustomerService = function(props) {
             } else {
                 var newHistoryMessageList2 = list1.map(function(item) {
                     message = item.message + obj.message;
+                    var extraInfo = [];
+                    // message = '抱歉，我暂时无法回答这样的问题。'
+                    if (message == "抱歉，我暂时无法回答这样的问题。") {
+                        extraInfo = videoHotQuestionsList.current.map(function(str, index) {
+                            return {
+                                key: "messageSource",
+                                value: str.id,
+                                question: str.question,
+                                answer: str.answer,
+                                welcomeMessage: true
+                            };
+                        });
+                    }
                     if (item.id == id) {
                         return _object_spread_props(_object_spread({}, item), {
-                            message: message
+                            message: message,
+                            extraInfo: extraInfo == null ? item.extraInfo : JSON.stringify(extraInfo)
                         });
                     } else {
                         return item;
@@ -1314,7 +1313,7 @@ var CustomerService = function(props) {
         } else if (flag == 3) {
             data = {
                 page: 1,
-                maxPageSize: 4,
+                maxPageSize: 5,
                 question: value,
                 sectionId: getQuery("s_id")
             };
@@ -1344,18 +1343,29 @@ var CustomerService = function(props) {
                 } else {
                     setQuestionsList(questionList);
                 }
-                if (questionList.length < 4 && flag == 3) {
+                if (questionList.length < 5 && flag == 3) {
                     console.log("视频页面，联想问题小于4个");
                     //视频页面，联想问题小于4个
-                    getQuestiionsList(value, 4);
+                    http.get("".concat(urllocation, "/chat-service/public/v1.0/knowledge-base/questions"), {
+                        params: {
+                            page: 1,
+                            maxPageSize: 5 - questionList.length
+                        }
+                    }).then(function(res) {
+                        if (res.data.questions) {
+                            setHotQuestionsList(function(questionList) {
+                                return _to_consumable_array(questionList).concat(_to_consumable_array(res.data.questions));
+                            });
+                        }
+                    });
                 }
             }
         });
     };
-    //获取视频页面热门问题 flag == 1，默认推荐问题 == 2，已经推荐过问题
+    //获取视频页面热门问题 flag == 1，默认推荐问题 == 2，底部渲染问题，flag == 3，ai回答后请求相关问题
     var videoPageQuestiionsList = function() {
         var flag = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 1;
-        console.log(props, 3333333);
+        console.log(flag, props, 3333333);
         var config = props.config;
         if (config && config.type == "video" && config.params) {
             var params = config.params;
@@ -1365,9 +1375,7 @@ var CustomerService = function(props) {
             var sectionId = params.VideoBriefSummaryId;
             if (videoId && courseId && sectionId) {
                 http.post("".concat(urllocation, "/chat-service/public/v1.0/knowledge-base/questions:recommend"), {
-                    "recommendedQuestions": flag == 2 ? recommendeQuestionID.current : [
-                        ""
-                    ],
+                    "recommendedQuestions": [],
                     "contexts": [
                         {
                             "type": "VIDEO",
@@ -1377,22 +1385,32 @@ var CustomerService = function(props) {
                             "watchTime": watchTime
                         }
                     ],
-                    "maximum": 5
+                    "maximum": flag == 1 || flag == 2 ? 3 : 5
                 }).then(function(res) {
-                    console.log(res, 333333);
                     if (res.data.total > 0) {
                         var data = res.data.questions;
+                        if (flag == 3) {
+                            // setQuestionsList(data);
+                            // setVideoHotQuestionsList(data);
+                            videoHotQuestionsList.current = data;
+                            return;
+                        }
                         if (flag == 2) {
                             setBottomRecommendationQuestions(data);
                         } else {
                             setHotQuestionsList(data);
                         }
+                        var ids = [];
+                        data.map(function(str) {
+                            ids.push(str.id);
+                        });
+                        recommendeQuestionID.current = Array.from(new Set(recommendeQuestionID.current.concat(ids)));
                         resettingBottomHei();
                         scrollToBottom();
-                        console.log(data, 99999);
-                        if (data.length < 4) {
-                            getQuestiionsList("", 4);
-                        }
+                    // console.log(data,99999);
+                    // if(data.length < 4){
+                    //   getQuestiionsList('',4)
+                    // }
                     }
                 }).catch(function() {});
             }
@@ -1777,9 +1795,6 @@ var CustomerService = function(props) {
                 var timeObj = parseDate(item.createdAt);
                 // console.log(item.message);
                 var message = item.message;
-                if (message == "抱歉，我暂时无法回答这样的问题。" && props.config && props.config.type == "video") {
-                    videoPageQuestiionsList(2);
-                }
                 var li;
                 // 是否需要显示日期
                 var itemIndex = historyMessageList.findIndex(function(ite) {
@@ -2039,23 +2054,37 @@ var CustomerService = function(props) {
                                                                         })
                                                                     ]
                                                                 }),
-                                                                item.extraInfo != undefined && JSON.parse(item.extraInfo).length > 0 && JSON.parse(item.extraInfo)[0].key == "messageSource" && JSON.parse(item.extraInfo)[0].value != "knowledgebase" && /*#__PURE__*/ _jsx("ul", {
-                                                                    className: styles.association_problem,
-                                                                    children: JSON.parse(item.extraInfo).map(function(list, index) {
-                                                                        return /*#__PURE__*/ _jsxs("li", {
-                                                                            onClick: function() {
-                                                                                sendMessage(list, 1);
-                                                                            },
-                                                                            children: [
-                                                                                index + 1,
-                                                                                ".",
-                                                                                list.question
-                                                                            ]
-                                                                        }, i + "_" + index + "_" + list.value);
-                                                                    })
+                                                                item.extraInfo != undefined && JSON.parse(item.extraInfo).length > 0 && JSON.parse(item.extraInfo)[0].key == "messageSource" && JSON.parse(item.extraInfo)[0].value != "knowledgebase" && /*#__PURE__*/ _jsxs("ul", {
+                                                                    className: "".concat(styles.association_problem, " ").concat(item.message == "抱歉，我暂时无法回答这样的问题。" ? "association_problem_flag" : ""),
+                                                                    children: [
+                                                                        item.message == "抱歉，我暂时无法回答这样的问题。" && /*#__PURE__*/ _jsx("li", {
+                                                                            className: styles.related_issues_flag,
+                                                                            children: /*#__PURE__*/ _jsx("span", {
+                                                                                children: "相关问题"
+                                                                            })
+                                                                        }),
+                                                                        JSON.parse(item.extraInfo).map(function(list, index) {
+                                                                            return /*#__PURE__*/ _jsx("li", {
+                                                                                onClick: function() {
+                                                                                    sendMessage(list, 1);
+                                                                                    if (props.config && props.config.type == "video") {
+                                                                                        //先请求问题列表
+                                                                                        videoPageQuestiionsList(2);
+                                                                                    }
+                                                                                },
+                                                                                children: item.message == "抱歉，我暂时无法回答这样的问题。" ? list.question : /*#__PURE__*/ _jsxs(_Fragment, {
+                                                                                    children: [
+                                                                                        index + 1,
+                                                                                        ".",
+                                                                                        list.question
+                                                                                    ]
+                                                                                })
+                                                                            }, i + "_" + index + "_" + list.value);
+                                                                        })
+                                                                    ]
                                                                 }),
                                                                 //findTeacher//是否在召唤老师过程中，是否是最后一条消息
-                                                                !item.findTeacher && historyMessageList.length - 1 == i && item.id != "123456" && renderLastOperateBtn(item, isAiChatWindow, i),
+                                                                !item.findTeacher && historyMessageList.length - 1 == i && item.id != "123456" && item.id != "123456_date" && renderLastOperateBtn(item, isAiChatWindow, i),
                                                                 //召唤老师回答按钮
                                                                 isAiChatWindow && item.findTeacher && userData.modules.some(function(item) {
                                                                     return item.short == "TeacherAnswer";
@@ -2281,11 +2310,9 @@ var CustomerService = function(props) {
         if (!showStopBtn && isAiChatWindow && (extraInfo != undefined && JSON.parse(extraInfo).length > 0 && JSON.parse(extraInfo)[0].key == "questionId" || extraInfo == null) && historyMessageList[i - 1] && historyMessageList[i - 1].extraInfo && JSON.parse(historyMessageList[i - 1].extraInfo).length > 0 && JSON.parse(historyMessageList[i - 1].extraInfo)[0].key != "imageUrl") {
             findTeacherBtn = true;
         }
+        /// style={{position:showStopBtn && isPosition.current ? 'sticky' : 'relative'}}
         return /*#__PURE__*/ _jsxs("div", {
             className: "".concat(styles.operate_modal_bottom),
-            style: {
-                position: showStopBtn && isPosition.current ? "sticky" : "relative"
-            },
             children: [
                 /*#__PURE__*/ _jsxs("p", {
                     className: styles.stop_generate,
@@ -2555,6 +2582,7 @@ var CustomerService = function(props) {
                                                     className: styles.icon_close,
                                                     onClick: function() {
                                                         setScreenshotBese64("");
+                                                        resettingBottomHei();
                                                     },
                                                     children: /*#__PURE__*/ _jsx(CustomRoundClose, {})
                                                 }),
@@ -2931,7 +2959,7 @@ var CustomerService = function(props) {
         return /*#__PURE__*/ _jsx("div", {
             className: styles.issues_list_flag,
             style: {
-                bottom: "".concat(buttomHei, "px")
+                bottom: "".concat(buttomHei - 60, "px")
             },
             id: "BottomAssociationProblem",
             children: bottomRecommendationQuestions.map(function(item) {

package/esm/customerService/index.module.less

@@ -626,7 +626,9 @@
             cursor: pointer;
             list-style-type: none;
           }
+          
         }
+  
 
         .img_con{
           width: 100%;
@@ -743,6 +745,34 @@
 
         }
       }
+
+      .association_problem_flag{
+        padding-left: 30px;
+       
+        li{
+          position: relative;
+          &::after{
+            content: '';
+            width: 6px;
+            height: 6px;
+            border-radius: 50%;
+            background-color: rgba(217, 217, 217, 1);
+            display: block;
+            position: absolute;
+            top: 12px;
+            left: 12px;
+          }
+        }
+        .related_issues_flag{
+          span{
+            color: #000;
+            font-weight: 600;
+            border-bottom: 4px solid @color-background-primary-weak-hover;
+          }
+          
+        }
+      }
+
       .time {
         display: block;
         margin: 40px 0;
@@ -915,6 +945,7 @@
         padding: 8px 16px;
         background-color: #fff;
         border-radius: 38px;
+        margin-bottom: 16px;
         cursor: pointer;
         &:hover{
           background-color: @color-background-primary-weak;

package/esm/customerService/index2.module.less

@@ -113,7 +113,10 @@
           position: relative;
           z-index: 99;
           .popover{
-            padding: 8px;
+            padding: 8px 0;
+            width: 74px;
+            text-align: center;
+
             border-radius: 4px;
             line-height: 1.5;
             color: rgba(0, 0, 0, 0.65);
@@ -620,7 +623,9 @@
             cursor: pointer;
             list-style-type: none;
           }
+          
         }
+  
 
         .img_con{
           width: 100%;
@@ -629,7 +634,10 @@
           border-radius: 4px;
           overflow: hidden;
           display: inline-flex;
-          margin-top: 24px;
+          margin-top: 12px;
+          img{
+            width: 100%;
+          }
           .mask_zoom{
             position: absolute;
             top: 0;
@@ -714,8 +722,13 @@
           padding: 0 2px;
         }
         li{
+          :global{
+            ::marker {
+              font-weight: 600 !important;
+            }
+          }
           ::marker {
-            font-weight: 600;
+            font-weight: 600 !important;
           }
           p{
             font-weight: 400 !important;
@@ -723,11 +736,40 @@
               border-bottom: 6px solid @color-background-primary-weak-hover;
               height: 20px;
               display: inline-block;
+              font-weight: 600;
             }
           }
 
         }
       }
+
+      .association_problem_flag{
+        padding-left: 30px;
+       
+        li{
+          position: relative;
+          &::after{
+            content: '';
+            width: 6px;
+            height: 6px;
+            border-radius: 50%;
+            background-color: rgba(217, 217, 217, 1);
+            display: block;
+            position: absolute;
+            top: 12px;
+            left: 12px;
+          }
+        }
+        .related_issues_flag{
+          span{
+            color: #000;
+            font-weight: 600;
+            border-bottom: 4px solid @color-background-primary-weak-hover;
+          }
+          
+        }
+      }
+
       .time {
         display: block;
         margin: 40px 0;
@@ -895,11 +937,12 @@
       margin: 0 16px;
       // padding-bottom: 4px;
       line-height: 1;
-      // padding-top: 24px;
+      padding-top: 24px;
       p{
         padding: 8px 16px;
         background-color: #fff;
         border-radius: 38px;
+        margin-bottom: 16px;
         cursor: pointer;
         &:hover{
           background-color: @color-background-primary-weak;
@@ -1119,6 +1162,7 @@
           svg {
             font-size: 20px;
             color: @color-icon-fill-Tr;
+            cursor: pointer;
           }
         }
         .disabled {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bhd-components",
-  "version": "0.7.9",
+  "version": "0.7.10",
   "description": "组件功能描述",
   "files": [
     "esm",