react_hsbc_teller 1.6.5 → 1.6.9

package/lib/hsbc.js.LICENSE.txt

@@ -35,6 +35,23 @@ PERFORMANCE OF THIS SOFTWARE.
  * LICENSE file in the root directory of this source tree.
  */
 
+/** @preserve
+	 * Counter block mode compatible with  Dr Brian Gladman fileenc.c
+	 * derived from CryptoJS.mode.CTR
+	 * Jan Hruby jhruby.web@gmail.com
+	 */
+
+/** @preserve
+	(c) 2012 by Cédric Mesnil. All rights reserved.
+
+	Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:
+
+	    - Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.
+	    - Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.
+
+	THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+	*/
+
 //! moment.js
 
 //! moment.js locale configuration

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react_hsbc_teller",
-  "version": "1.6.5",
+  "version": "1.6.9",
   "description": "React",
   "private": false,
   "main": "lib/hsbc.js",
@@ -87,12 +87,14 @@
     "@babel/plugin-proposal-decorators": "^7.16.4",
     "antd": "^4.16.13",
     "axios": "0.19.0",
+    "crypto-js": "^4.1.1",
     "html2canvas": "^1.4.0",
     "react": "^17.0.1",
     "react-canvas-draw": "^1.1.1",
     "react-dom": "^17.0.1",
     "react-intl": "^5.21.2",
     "react-signature-canvas": "^1.0.5",
+    "styled-components": "^5.3.5",
     "url-loader": "^4.1.1"
   },
   "peerDependencies": {

package/packages/api/api.js

@@ -326,7 +326,7 @@ class API extends Server{
     console.log(params)
     try{
       let result = await this.axios('post', '/hsbc/sig', params); 
-      if(result && (result.data instanceof Object) && result.code === 200){
+      if(result && result.code === 200){
         return result.data||[];
       }else{
         let err = {

package/packages/common/index.esm.js

@@ -0,0 +1,374 @@
+function _classCallCheck(instance, Constructor) {
+  if (!(instance instanceof Constructor)) {
+    throw new TypeError("Cannot call a class as a function");
+  }
+}
+
+function _defineProperties(target, props) {
+  for (var i = 0; i < props.length; i++) {
+    var descriptor = props[i];
+    descriptor.enumerable = descriptor.enumerable || false;
+    descriptor.configurable = true;
+    if ("value" in descriptor) descriptor.writable = true;
+    Object.defineProperty(target, descriptor.key, descriptor);
+  }
+}
+
+function _createClass(Constructor, protoProps, staticProps) {
+  if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+  if (staticProps) _defineProperties(Constructor, staticProps);
+  Object.defineProperty(Constructor, "prototype", {
+    writable: false
+  });
+  return Constructor;
+}
+
+/* eslint-disable @typescript-eslint/no-unused-vars */
+
+/**
+ * canvas 画板
+ */
+var BoardOperate = /*#__PURE__*/function () {
+  function BoardOperate(canvas, _ref) {
+    var _ref$drawType = _ref.drawType,
+        drawType = _ref$drawType === void 0 ? 'pen' : _ref$drawType,
+        _ref$drawColor = _ref.drawColor,
+        drawColor = _ref$drawColor === void 0 ? 'rgba(19, 206, 102, 1)' : _ref$drawColor,
+        _ref$lineWidth = _ref.lineWidth,
+        lineWidth = _ref$lineWidth === void 0 ? 5 : _ref$lineWidth,
+        _ref$sides = _ref.sides,
+        sides = _ref$sides === void 0 ? 3 : _ref$sides,
+        _ref$fillStyle = _ref.fillStyle,
+        fillStyle = _ref$fillStyle === void 0 ? null : _ref$fillStyle,
+        allowCallback = _ref.allowCallback,
+        moveCallback = _ref.moveCallback;
+
+    _classCallCheck(this, BoardOperate);
+
+    this.canvas = canvas; // 画板DOM
+
+    this.width = canvas.width; // 宽
+
+    this.height = canvas.height; // 高
+
+    this.ratio = canvas.width > canvas.clientWidth ? canvas.width / canvas.clientWidth : 1; // 比例(width和clientWidth不一致可调整比例)
+
+    this.ctx = canvas.getContext('2d');
+    this.isClickCanvas = false; // 是否点击canvas内部
+
+    this.isMoveCanvas = false; // 鼠标是否有移动
+
+    this.imgData = []; // 存储上一次的图像，用于撤回
+
+    this.index = 0; // 记录当前显示的是第几帧
+
+    this.x = 0; // 鼠标按下时的 x 坐标
+
+    this.y = 0; // 鼠标按下时的 y 坐标
+
+    this.last = [this.x, this.y]; // 鼠标按下及每次移动后的坐标
+
+    this.drawType = drawType; // 绘制形状
+
+    this.drawColor = drawColor; // 绘制颜色
+
+    this.lineWidth = lineWidth; // 线条宽度
+
+    this.sides = sides; // 多边形边数
+
+    this.fillStyle = fillStyle; // 初始填充颜色
+
+    this.allowCallback = allowCallback || function () {}; // 允许操作的回调
+
+
+    this.moveCallback = moveCallback || function () {}; // 鼠标移动的回调
+
+
+    this.bindMousemove = function () {}; // 解决 eventlistener 不能bind
+
+
+    this.bindMousedown = function () {}; // 解决 eventlistener 不能bind
+
+
+    this.bindMouseup = function () {}; // 解决 eventlistener 不能bind
+
+
+    this.init();
+  }
+
+  _createClass(BoardOperate, [{
+    key: "init",
+    value: function init() {
+      if (this.fillStyle) {
+        this.ctx.fillStyle = 'transparent';
+        this.ctx.fillRect(0, 0, this.width, this.height);
+      }
+
+      this.gatherImage();
+      this.bindMousemove = this.onmousemove.bind(this); // 解决 eventlistener 不能bind
+
+      this.bindMousedown = this.onmousedown.bind(this);
+      this.bindMouseup = this.onmouseup.bind(this);
+      var eventNameDown = 'mousedown',
+          eventNameUp = 'mouseup';
+
+      if ('ontouchstart' in this.canvas) {
+        // 移动端适配
+        this.isTouch = true;
+        eventNameDown = 'touchstart';
+        eventNameUp = 'touchend';
+      } else {
+        // PC 端鼠标事件
+        this.isTouch = false;
+      }
+
+      this.canvas.addEventListener(eventNameDown, this.bindMousedown);
+      this.canvas.addEventListener(eventNameUp, this.bindMouseup);
+    } // 获取当前位置
+
+  }, {
+    key: "getPoint",
+    value: function getPoint(e) {
+      // const { pageX, pageY, target } = e.changedTouches[0];
+      var _e$changedTouches$ = e.changedTouches[0],
+          clientX = _e$changedTouches$.clientX,
+          clientY = _e$changedTouches$.clientY,
+          target = _e$changedTouches$.target;
+
+      var _target$getBoundingCl = target.getBoundingClientRect(),
+          top = _target$getBoundingCl.top,
+          left = _target$getBoundingCl.left; // 获取当前节点到视口顶部和左边的距离
+
+
+      var x = (clientX - left) * this.ratio;
+      var y = (clientY - top) * this.ratio;
+      return {
+        x: x,
+        y: y
+      };
+    } // 鼠标按下
+
+  }, {
+    key: "onmousedown",
+    value: function onmousedown(e) {
+      e.preventDefault();
+      var eventName = 'mousemove';
+
+      if (this.isTouch) {
+        var _this$getPoint = this.getPoint(e),
+            x = _this$getPoint.x,
+            y = _this$getPoint.y;
+
+        e.offsetX = x;
+        e.offsetY = y;
+        eventName = 'touchmove';
+      }
+
+      this.canvas.addEventListener(eventName, this.bindMousemove);
+      this.isClickCanvas = true;
+      this.x = e.offsetX;
+      this.y = e.offsetY;
+      this.last = [this.x, this.y];
+    }
+  }, {
+    key: "gatherImage",
+    value: function gatherImage() {
+      // 采集图像
+      this.imgData = this.imgData.slice(0, this.index + 1); // 每次鼠标抬起时，将储存的imgdata截取至index处
+
+      var imgData = this.ctx.getImageData(0, 0, this.width, this.height);
+      this.imgData.push(imgData);
+      this.index = this.imgData.length - 1; // 储存完后将 index 重置为 imgData 最后一位
+
+      this.allowCallback(this.index > 0, this.index < this.imgData.length - 1);
+    }
+  }, {
+    key: "reSetImage",
+    value: function reSetImage() {
+      // 重置为上一帧
+      this.ctx.clearRect(0, 0, this.width, this.height);
+
+      if (this.imgData.length >= 1) {
+        this.ctx.putImageData(this.imgData[this.index], 0, 0);
+      }
+    } // 鼠标移动
+
+  }, {
+    key: "onmousemove",
+    value: function onmousemove(e) {
+      if (this.isTouch) {
+        e.preventDefault();
+
+        var _this$getPoint2 = this.getPoint(e),
+            x = _this$getPoint2.x,
+            y = _this$getPoint2.y;
+
+        e.offsetX = x;
+        e.offsetY = y;
+      }
+
+      this.isMoveCanvas = true;
+      var endx = e.offsetX;
+      var endy = e.offsetY;
+      var width = endx - this.x;
+      var height = endy - this.y;
+      var now = [endx, endy]; // 当前移动到的位置
+
+      switch (this.drawType) {
+        case 'pen':
+          {
+            var params = [this.last, now, this.lineWidth, this.drawColor, true];
+            this.moveCallback.apply(this, ['pen'].concat(params));
+            this.line.apply(this, params);
+          }
+          break;
+
+        case 'eraser':
+          {
+            var _params = [endx, endy, this.lineWidth];
+            this.moveCallback.apply(this, ['eraser'].concat(_params));
+            this.eraser.apply(this, _params);
+          }
+          break;
+      }
+    } // 鼠标抬起
+
+  }, {
+    key: "onmouseup",
+    value: function onmouseup(e) {
+      e.preventDefault();
+
+      if (this.isClickCanvas) {
+        this.isClickCanvas = false;
+
+        if (this.isTouch) {
+          this.canvas.removeEventListener('touchmove', this.bindMousemove);
+        } else {
+          this.canvas.removeEventListener('mousemove', this.bindMousemove);
+        }
+
+        if (this.isMoveCanvas) {
+          // 鼠标没有移动不保存
+          this.isMoveCanvas = false;
+          this.gatherImage();
+          this.moveCallback('gatherImage', this.index);
+        }
+      }
+    } // 绘制线性（直线和铅笔）
+
+  }, {
+    key: "line",
+    value: function line(last, now, lineWidth, drawColor, isPencil) {
+      if (!isPencil) {
+        this.reSetImage();
+      }
+
+      this.ctx.beginPath();
+      this.ctx.lineCap = 'round'; // 设定线条与线条间接合处的样式
+
+      this.ctx.lineJoin = 'round';
+      this.ctx.lineWidth = lineWidth;
+      this.ctx.strokeStyle = drawColor;
+      this.ctx.moveTo(last[0], last[1]);
+      this.ctx.lineTo(now[0], now[1]);
+      this.ctx.closePath();
+      this.ctx.stroke(); // 进行绘制
+
+      if (isPencil) {
+        // 铅笔需要保存最后一次记录
+        this.last = now;
+      }
+    } // 橡皮擦
+
+  }, {
+    key: "eraser",
+    value: function eraser(endx, endy, lineWidth) {
+      this.ctx.save();
+      this.line(this.last, [endx, endy], lineWidth * 2, '#fff', true);
+    } // 撤回
+
+  }, {
+    key: "undo",
+    value: function undo() {
+      if (--this.index < 0) {
+        this.index = 0;
+        return;
+      }
+
+      this.allowCallback(this.index > 0, this.index < this.imgData.length - 1);
+      this.ctx.putImageData(this.imgData[this.index], 0, 0);
+    } // 前进
+
+  }, {
+    key: "redo",
+    value: function redo() {
+      if (++this.index > this.imgData.length - 1) {
+        this.index = this.imgData.length - 1;
+        return;
+      }
+
+      this.allowCallback(this.index > 0, this.index < this.imgData.length - 1);
+      this.ctx.putImageData(this.imgData[this.index], 0, 0);
+    } // 清屏
+
+  }, {
+    key: "clear",
+    value: function clear() {
+      this.imgData = [];
+      this.ctx.clearRect(0, 0, this.width, this.height);
+      this.gatherImage();
+    } // 设置画板参数
+
+  }, {
+    key: "changeWay",
+    value: function changeWay(_ref2) {
+      var type = _ref2.type,
+          color = _ref2.color,
+          lineWidth = _ref2.lineWidth,
+          sides = _ref2.sides;
+
+      if (type === 'eraser') {
+        this.ctx.globalCompositeOperation = 'destination-out'; // 擦除
+      } else {
+        this.ctx.globalCompositeOperation = 'source-over'; // 画
+      } // 绘制条件
+
+
+      this.drawType = type !== 'color' && type || this.drawType; // 绘制形状
+
+      this.drawColor = color || this.drawColor; // 绘制颜色
+
+      this.lineWidth = lineWidth || this.lineWidth; // 线宽
+
+      this.sides = sides || this.sides; // 边数
+    } // 销毁画板
+
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      this.clear();
+      this.canvas.removeEventListener('mousedown', this.bindMousedown);
+      this.canvas.removeEventListener('mouseup', this.bindMouseup);
+      this.canvas = null;
+      this.ctx = null;
+    } // 保留笔画
+
+  }, {
+    key: "retain",
+    value: function retain() {
+      var base64 = this.canvas.toDataURL();
+      var img = document.createElement('img');
+      img.style.position = 'fixed';
+      img.style.width = '90vw';
+      img.style.height = '95vh';
+      img.style.top = '9vh';
+      img.style.left = '5vw';
+      img.src = base64;
+      document.body.appendChild(img);
+    }
+  }]);
+
+  return BoardOperate;
+}();
+
+export { BoardOperate };

package/packages/demo/demo.js

@@ -5,10 +5,10 @@ import Pdf from './pdf.js'
 class Demo extends Component {
   state = {
     shareMask: false,
-    imRoomId: "oSqhUSooi@conference.ls-im-xmpp.chinawp.dev.ali.cloud.cn.hsbc",
-    sessionId: "oSqhUSooi",
-    mtoken: "8af047a2b64b",
-roomId: "654754010601621",
+    mtoken: "492948d0a7ec",
+roomId: "656467744508298",
+    imRoomId: "ACkhcdtat@conference.openfire2.leimondata.cn",
+    sessionId: "ACkhcdtat",
     // roomId: '',
     // mtoken: '',
     // imRoomId: '',

package/packages/pages/foot/foot.jsx

@@ -53,6 +53,9 @@ export default class foot extends Component {
     beautyClick=()=>{
         this.props.beautyClick()
     }
+    graffiti=()=>{
+        this.props.graffiti()
+    }
     render() {
         const {clickedOcr,clickedFacial,img,isWhiteboard,cameraImg,isTranscribing ,screenName,suspendName,customerList,menus,voiceName,beautyName} = this.props
         const content = (
@@ -83,15 +86,16 @@ export default class foot extends Component {
                   {
                       menus.map((item,index)=>{
                           return <div key={index}className='footHover'>
-                          {/* {
-                                  isTranscribing &&
-                                  <div className="one" onClick={this.transcribingClick.bind(this)}>
-                                  <img className="imgClass"src={require("../../assets/img/icon_copy.png").default} alt="" />
-                                  <div className="text">
-                                      签字
-                                  </div>
-                              </div>
-                              } */}
+                          {
+                      item == 'GRAFFITI'&&<div className='footHover' onClick={this.graffiti.bind(this)}>
+                      <div className="one">
+                          <img className="imgClass" src={require("../../assets/img/tuya.png").default} alt="" />
+                          <div className="text">
+                          互动涂鸦
+                          </div>
+                      </div>
+                      </div>
+                  }
                               {
                       item == 'BOARD'&&<div className='footHover' onClick={this.switchExternal.bind(this)}>
                       <div className="one">