bhd-components 0.9.0 → 0.9.2

package/esm/bhdDatePicker/index.module.less

@@ -3,35 +3,58 @@
 .bhdDatePicker {
   width: 100%;
 
-  .pickerLabel {
-    display: flex;
-    gap: 5px;
-  }
   :global {
     .bhd-picker {
-      &.hide {
-        position: absolute;
+      // table 模式下显示样式
+      &.table-date-picker {
+        * {
+          background: transparent;
+          border: none;
+        }
+        position: relative;
         top: 0;
         left: 0;
-        // z-index: -1;
-        opacity: 0;
-        // width: 0;
-        // padding: 0;
-        // height: 0;
-        // border: none;
-        // & * {
-        //   display: none !important;
-        // }
-        // .bhd-picker-range-separator {
-        //   display: none !important;
-        // }
+        border: none;
+        box-shadow: none;
+        background: transparent;
+        padding: 0;
+        margin-left: -78px;
+        cursor: pointer;
+        .bhd-picker-input {
+          &:nth-child(1) {
+            width: 78px;
+            opacity: 0;
+            & > input {
+              cursor: pointer;
+              &::placeholder {
+                display: none !important;
+                opacity: 0;
+              }
+            }
+          }
+          &:nth-child(3) {
+            display: none;
+          }
+        }
+        .bhd-picker-range-separator {
+          display: none;
+        }
+        .bhd-picker-active-bar {
+          display: none;
+        }
+        .bhd-picker-suffix {
+          color: @color-text-Tr;
+        }
+        .bhd-picker-clear {
+          display: none;
+        }
       }
     }
   }
 }
-// 额外的弹出日历样式
+// 弹出日历样式
 .bhdDatePickerPopup {
-  // 单选、范围、带额外文字
+  // 单选、范围、日程安排
   &.singlePicker,
   &.rangePicker,
   &.extraPicker {
@@ -103,6 +126,22 @@
             line-height: 32px;
           }
         }
+
+        & .bhd-picker-body {
+          position: relative;
+
+          // 设置标题背景色
+          &::before {
+            content: "";
+            width: 100%;
+            height: 32px;
+            border-radius: 4px;
+            position: absolute;
+            top: 0;
+            left: 0;
+            background-color: @color-background-filltertiary-Tr;
+          }
+        }
       }
 
       //周
@@ -245,6 +284,7 @@
           line-height: 30px;
           height: 30px;
           gap: 10px;
+          align-items: center;
 
           & .bhd-picker-now {
             color: @color-background-primary-base;
@@ -292,6 +332,9 @@
             height: 30px;
             padding: 0 16px;
             // line-height: 30px;
+            border: none;
+            box-shadow: none;
+            line-height: 21px;
 
             &:disabled,
             &.disabled {
@@ -313,10 +356,19 @@
         // }
       }
 
+      // 默认
+      .bhd-picker-cell-in-view {
+        color: @color-text-Secondary-Tr;
+      }
+
       .bhd-picker-cell-disabled.bhd-picker-cell-today
         .bhd-picker-cell-inner::before {
         border-color: @color-background-primary-base !important;
       }
+      // 禁用
+      .bhd-picker-cell-disabled {
+        color: @color-text-quaternary-Tr !important;
+      }
     }
   }
 
@@ -475,7 +527,7 @@
       }
       .bhd-picker-year-panel .bhd-picker-cell::before,
       .bhd-picker-year-panel .bhd-picker-cell::before {
-        left: 8px;
+        left: 0;
         border-radius: 4px;
       }
 
@@ -535,7 +587,7 @@
     }
   }
 
-  // 带有额外文字场景
+  // 日程安排
   &.extraPicker {
     :global {
       .extraText {
@@ -557,7 +609,7 @@
       }
       .bhd-picker-date-panel {
         width: 416px;
-        padding: 24px 24px 16px 24px;
+        padding: 16px 24px 16px 24px;
         & .bhd-picker-content {
           width: 336px;
           margin: 0 auto;
@@ -669,6 +721,10 @@
             border: none !important;
           }
         }
+        .bhd-picker-cell-in-view {
+          pointer-events: none;
+          color: @color-text-Secondary-Tr;
+        }
       }
     }
   }
@@ -738,22 +794,9 @@
     .bhd-picker-date-panel,
     .bhd-picker-time-panel {
       padding: 16px;
-      gap: 24px;
+      gap: 16px;
       & .bhd-picker-body {
         padding: 0 !important;
-        position: relative;
-
-        // 设置标题背景色
-        &::before {
-          content: "";
-          width: 100%;
-          height: 32px;
-          border-radius: 4px;
-          position: absolute;
-          top: 0;
-          left: 0;
-          background-color: @color-background-filltertiary-Tr;
-        }
       }
 
       // 设置头部圆角
@@ -769,6 +812,7 @@
         }
       }
     }
+
     // 头部
     .bhd-picker-header {
       padding: 0 !important;
@@ -813,11 +857,6 @@
       justify-content: center;
     }
 
-    // 默认
-    .bhd-picker-cell-in-view {
-      color: @color-text-Secondary-Tr !important;
-    }
-
     //当天
     .bhd-picker-cell-today {
       color: @color-background-primary-base !important;
@@ -843,9 +882,5 @@
         }
       }
     }
-    // 禁用
-    .bhd-picker-cell-disabled {
-      color: rgba(0, 0, 0, 0.25) !important;
-    }
   }
 }

package/esm/customerService/index.js

@@ -6,7 +6,6 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@ice/jsx-runt
 import React, { useEffect, useState, useRef } from "react";
 import { Modal, Drawer, Input, Tooltip } from "antd";
 import ViewImage from "../viewImage";
-// import html2canvas from "html2canvas";
 import cssStyle from "./index.module.less";
 import cssStyleOnline from "./index2.module.less";
 var styles = cssStyle;
@@ -22,7 +21,6 @@ import TeacherList from "./teacherList";
 import { parseDate } from "../utils/Date";
 import { Remarkable } from "remarkable";
 import hljs from "highlight.js";
-//import "highlight.js/styles/default.css";
 import "highlight.js/styles/github.css";
 import { render } from "react-dom";
 import Provider from "../provider";
@@ -31,6 +29,9 @@ var TextArea = Input.TextArea;
 import knowledge_icon from "./images/knowledge_icon.png";
 // import { useMediaRecorder } from "./useMediaRecorder"; //录音使用文件
 import { readMessage, getByteLen, serverUrl, copyText, getDataTime, getQuery, resetStyles, findParent, delegate } from "./function"; //一些方法
+// import html2canvas from "html2canvas";
+// const screenShot = require('./screenShotPlugin.esm') 
+import ScreenShot from "./js-screen-shot/main";
 var CustomerService = function(props) {
     var userData = props.userData, http = props.http, urllocation = props.urllocation, onCancel = props.onCancel, serverName = props.serverName, fetchEventSource = props.fetchEventSource, initShowType = props.initShowType, onEvent = props.onEvent, stepIds = props.stepIds, stepId = props.stepId, screenshotAreaId = props.screenshotAreaId, config = props.config;
     // const { bese64String, startRecord, stopRecord } = useMediaRecorder(); //语音转文字
@@ -99,6 +100,8 @@ var CustomerService = function(props) {
             return ""; // use external default escaping
         }
     });
+    var _useState33 //1是 screenShotPlugin   2是html2canvas
+     = _sliced_to_array(useState(0), 2), screenShotType = _useState33[0], setScreenShotType = _useState33[1];
     useEffect(function() {
         // if(config && config.type == 'video'){
         //   //获取热门推荐
@@ -109,6 +112,120 @@ var CustomerService = function(props) {
         initShowType
     ]);
     useEffect(function() {
+        var handlerHtml2canvas = function handlerHtml2canvas() {
+            console.log("kkkkkkkkkkk");
+            try {
+                newShowType.current = true;
+                setImgBese64("");
+                if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
+                    setScreenShotType(1);
+                    console.log("看看变了没有1213133");
+                    console.log("截图方式：【screenShotPlugin】", ScreenShot);
+                    var plugin = new ScreenShot({
+                        clickCutFullScreen: true,
+                        enableWebRtc: true,
+                        loadCrossImg: true,
+                        canvasWidth: window.innerWidth,
+                        canvasHeight: window.innerHeight,
+                        level: -1,
+                        hiddenToolIco: true,
+                        screenShotDom: document.body,
+                        cropBoxInfo: {
+                            x: 0,
+                            y: 0,
+                            w: window.innerWidth,
+                            h: window.innerHeight
+                        },
+                        wrcReplyTime: 500,
+                        wrcWindowMode: true,
+                        curTabState: false,
+                        hiddenScrollBar: {
+                            state: true
+                        },
+                        completeCallback: function(param) {
+                            var base64 = param.base64;
+                            // console.log(
+                            //   "截图组件加载完毕调用此方法来完成框选区域的截图",
+                            //   base64
+                            // );
+                            setImgBese64(base64);
+                        },
+                        triggerCallback: function() {
+                            // 截图组件加载完毕调用此方法来完成框选区域的截图
+                            plugin.completeScreenshot();
+                        },
+                        cancelCallback: function(err) {
+                            if (err.code === -1) {
+                                console.log(err);
+                                newShowType.current = false;
+                                if (saveShowType != -1) {
+                                    setShowType(saveShowType);
+                                } else {
+                                    setShowType(1);
+                                }
+                                setShowScreenshot(false);
+                                onCancel();
+                            }
+                        }
+                    });
+                } else {
+                    setScreenShotType(2);
+                    console.log("截图方式：【html2canvas】");
+                    html2canvas(screenshotAreaId, {
+                        useCORS: true,
+                        allowTaint: true,
+                        scale: 1,
+                        logging: false,
+                        // foreignObjectRendering:true,
+                        ignoreElements: function(element) {
+                            if (element.compareDocumentPosition(screenshotAreaId) === 2) return true;
+                            return false;
+                        },
+                        windowWidth: window.innerWidth,
+                        windowHeight: window.innerHeight
+                    }).then(function(canvas) {
+                        // document.body.appendChild(canvas);
+                        // console.log(canvas,99999);
+                        // var base64URL = canvas.toDataURL('image/jpeg')
+                        var base64URL = canvas.toDataURL("image/jpg", 1.0);
+                        // console.log(base64URL);
+                        setImgBese64(base64URL);
+                    // svgNodesToRemove.forEach(item=>{
+                    //   item.remove()
+                    // })
+                    });
+                }
+            // modernScreenshot
+            // .domToPng(document.querySelector("body"))
+            // .then((dataUrl:any) => {
+            //   console.log(dataUrl);
+            //   setImgBese64(dataUrl);
+            // });
+            // domtoimage
+            // .toPng(document.body)
+            // .then(function (dataUrl:any) {
+            //   setImgBese64(dataUrl);
+            // })
+            // .catch(function (error:any) {
+            //   console.error("oops, something went wrong!", error);
+            // });
+            // //排除
+            // new screenShotPlugin({
+            //   enableWebRtc: true,
+            //   canvasWidth:window.innerWidth,
+            //   canvasHeight:window.innerHeight,
+            //   level:9999999,
+            //   completeCallback: function (info:any) {
+            //     console.log(info);
+            //     setImgBese64(info.base64);
+            //   },
+            //   closeCallback: function () {
+            //   },
+            // });
+            } catch (error) {
+                console.log(error);
+            }
+        };
         var handleScroll = function handleScroll() {
             var container = document.getElementById(showType == 1 || showType == 3 ? "chat_content" : "chat_content_modal");
             var scrollTop = container.scrollTop;
@@ -157,30 +274,9 @@ var CustomerService = function(props) {
         };
         //|| showScreenshot
         if (showType == 5 || showScreenshot) {
-            try {
-                newShowType.current = true;
-                setImgBese64("");
-                // let dom = document.getElementById(screenshotAreaId);
-                html2canvas(screenshotAreaId, {
-                    useCORS: true,
-                    // allowTaint: true, // 污染处理
-                    scale: 1,
-                    // logging:true,
-                    ignoreElements: function(element) {
-                        if (element.compareDocumentPosition(screenshotAreaId) === 2) return true;
-                        return false;
-                    }
-                }).then(function(canvas) {
-                    // document.body.appendChild(canvas);
-                    console.log(canvas, 99999);
-                    // var base64URL = canvas.toDataURL('image/jpeg')
-                    var base64URL = canvas.toDataURL("image/jpg", 1.0);
-                    console.log(base64URL);
-                    setImgBese64(base64URL);
-                });
-            } catch (error) {
-                console.log(error);
-            }
+            console.log("bbbbbbbbbbbbbb");
+            handlerHtml2canvas();
+        // window.addEventListener('resize',handlerHtml2canvas)
         }
         if (showType != 1 && !firstLoad && pageCount > 0) {
             setFirstLoad(true);
@@ -195,7 +291,7 @@ var CustomerService = function(props) {
             if (content) {
                 content.removeEventListener("scroll", handleScroll);
             }
-        // window.removeEventListener('resize',handlerHtml2canvas)
+            window.removeEventListener("resize", handlerHtml2canvas);
         };
     }, [
         historyMessageList,
@@ -3453,6 +3549,9 @@ var CustomerService = function(props) {
                     }),
                     (showType == 4 || showType == 5) && /*#__PURE__*/ _jsxs("div", {
                         className: "".concat(styles.ChatWindow_Drawer),
+                        style: {
+                            display: "".concat(!showScreenshot ? "none" : "flex")
+                        },
                         id: "",
                         children: [
                             /*#__PURE__*/ _jsx("div", {
@@ -3552,6 +3651,7 @@ var CustomerService = function(props) {
             }),
             (showType == 5 || showScreenshot) && imgBese64 && /*#__PURE__*/ _jsx(ScreenshotTool, {
                 imgBese64: imgBese64,
+                screenShotType: screenShotType,
                 saveScreenshotBese64: function(base64) {
                     newShowType.current = false;
                     setScreenshotBese64(base64);