react_hsbc_teller 2.0.23 → 2.0.25

package/packages/pages/video/video.jsx

@@ -7,6 +7,8 @@ import API from '../../api/api';
 import { BoardOperate } from '../../common/index.esm.js';
 import './video.less'
 import { compressImage, isLight } from '../../utils/utils'
+import Recorder from "../../utils/recorder";
+import MyAsrController from '../../utils/asrController'
 import Header from '../header/header.jsx'
 import Foot from '../foot/foot.jsx'
 import IconSuccess from '../../assets/img/icon_success.jpg'
@@ -20,6 +22,8 @@ import ocrImage from '../../assets/img/jietu.png'
 import faceImage from '../../assets/img/jietu_face.png'
 import autod from '../../assets/mp3/joinmeeting.mp3'
 import recordErrorAudio from '../../assets/mp3/record_error.mp3'
+import IpadLeaveAudio from '../../assets/mp3/ipad_leave_error.mp3';
+import IpadLowPowerAudio from '../../assets/mp3/ipad_low_power.mp3'; 
 import internalJoin from '../../assets/mp3/internalJoin.mp3'
 import internalLeft from '../../assets/mp3/internalLeft.mp3'
 import leftMetting from '../../assets/mp3/leftmeeting.mp3'
@@ -50,10 +54,11 @@ import styled from 'styled-components';
 import { Button } from '../../../node_modules/antd/lib/index';
 import SignMy from '../sign/signMy.jsx'
 import Step from '../components/step/step.jsx'
+import MultiModule from '../multiModule/multiModule'//签字、抄录
 import axios from 'axios';
 import CryptoJS from "crypto-js";
 
-const SDK_VERISON = '2.0.23'
+const SDK_VERISON = '2.0.25'
 const IDtypeFront = '请客户在其设备后置摄像头下展示证件正面（如：身份证照片页面）'
 const IDtypeBack = '请在后置摄像头下展示证件反面（如：身份证国徽页）'
 const { Option } = Select;
@@ -75,6 +80,7 @@ const POINT_TYPE = {
 }
 const RECORD_DEVICE_NAME = 'screen-capture-recorder'
 // const RECORD_DEVICE_NAME = 'Full HD webcam'
+const IPAD_SUFFIX = '_ipad'
 let media_status = 0
 let pictureInPictureVideo
 let mix_stream
@@ -370,6 +376,7 @@ class Video extends Component {
       console.log(result);
       this.state.imRoomId = result.imRoomId,
         this.state.sessionId = result.sessionId;
+        window.imRoom.sessionId = result.sessionId;
 
       let publish_config = {}
       publish_config.media_type = 1
@@ -383,6 +390,11 @@ class Video extends Component {
       publish_config.publish_video_id = 'publish_video1'
       publish_config.publish_streamId_id = 'publish_streamId1'
       publish_config.publish_tag = 'tag1'
+      if (this.props.recordMode == 2) {
+        // 分行模式，只收音 不发布摄像头
+        publish_config.media_type = 2
+        // publish_config.publish_streamId_id = 'publish_video1'
+      }
       this.test_controller.Publish(publish_config)
   
       // this.publishAllScreen();
@@ -477,9 +489,16 @@ class Video extends Component {
       // let result = await API.mpaasSig({account: data.account, type: data.type});
       console.log('mpaasSig', result, result.mpsSig);
       window.sessionStorage.setItem('alimpassSig', result.mpsSig);
-      this.state.workSpaceId = result.workspaceId,
-        this.state.appId = result.appId,
+      this.state.workSpaceId = result.workspaceId
+        this.state.appId = result.appId
         this.state.bizName = result.bizName
+
+      //asr初始化
+      this.state.asrAppKey = this.props.asrAppKey || result.asrAppKey
+      this.state.asrServerUrl = this.props.asrServerUrl || result.asrServerUrl
+      this.state.asrToken = this.props.asrToken || result.asrToken
+      this.initAsrRecorder()
+
       window.sessionStorage.setItem('sigData', JSON.stringify(result));
       if (data.sigType == 1) {
         this.handleEdit()
@@ -735,6 +754,47 @@ class Video extends Component {
     })
 
   };
+  // 开启ipad录制
+  enableIpadRecording = (record_business_id) => {
+    const that = this
+    const filePath = 'recordId_' + new Date().valueOf() + '_ipad';
+      const recordParam = {};
+      recordParam.width = 1280;
+      recordParam.height = 720;
+      recordParam.recordTotalStream = 0;
+      recordParam.startTimeout = 10;
+      recordParam.splitType = 0;
+      recordParam.endType = 1;
+      recordParam.crf = 26
+      recordParam.overlaps = [
+        {
+          tag: '', // 流 tag，如果不设置或为空，则为全局⽔印
+          type: 2, // 1 为时间戳⽔印；2 为⽂字⽔印；3 为图⽚⽔印
+          id: 2, // ⽔印 ID
+          enable: true,
+          xPosition: 640, // x 轴位置
+          yPosition: 10, // y 轴位置
+          text: `${this.props.recordMode ==1 ?'远程录制' :'网点录制'} ${this.props.salesBranchCode || ''} ${this.state.branchName || ''} ${this.props.financialOffice || ''}`,
+          fontSize: 16, // 字体⼤⼩
+          url: '' // ⽔印图⽚ HTTP 地址
+        },
+        {
+          tag: '', // 流 tag，如果不设置或为空，则为全局⽔印
+          type: 1, // 1 为时间戳⽔印；2 为⽂字⽔印；3 为图⽚⽔印
+          id: 1, // ⽔印 ID
+          enable: true,
+          xPosition: 1080, // x 轴位置
+          yPosition: 10, // y 轴位置
+          text: '', // ⽔印⽂字
+          fontSize: 16, // 字体⼤⼩
+          url: '' // ⽔印图⽚ HTTP 地址
+        },
+      ];
+      recordParam.tagPositions = []
+      recordParam.tagFilter = that.state.ipadTag
+      console.log('recordParam', recordParam);
+      that.test_controller.StartRemoteRecord(filePath, recordParam, record_business_id+'_ipad')
+  };
   // 结束会话
   endSession = value => {
     if (value == 'customerHangUp') {
@@ -1401,7 +1461,7 @@ class Video extends Component {
         })
         this.loopPlay = () => {
           console.log('loopPlay status', this.state.isPictureInPicture);
-          if(!this.state.isPictureInPicture && document.getElementById("publish_video1")){
+          if(!this.state.isPictureInPicture && document.getElementById("publish_streamId1")){
             let audio = new Audio(PIPictureClosedAudio)
             audio.play()
             setTimeout(this.loopPlay, 3000);
@@ -1551,6 +1611,23 @@ class Video extends Component {
         this.messageClick(TITLE+'当前网络较弱', 'error')
         // this.saveVideoPoint('wnd', '客户端弱网');
       }
+      else if (Mival.typeId == 5004) { // ipad低电量
+        this.messageClick('IPAD电量过低', 'error')
+        
+        this.setState({
+          ipadLowPowerErrorModalVisible: true,
+        })
+        // 循环播放ipad低电量
+        clearTimeout(this.ipadLowPowerPlay)
+        this.ipadLowPowerPlay = () => {
+          if(this.state.ipadLowPowerErrorModalVisible){
+            let audio = new Audio(IpadLowPowerAudio)
+            audio.play()
+            setTimeout(this.ipadLowPowerPlay, 3000);
+          }
+        }
+        setTimeout(this.ipadLowPowerPlay, 0);
+      }
       else if (Mival.typeId == 1220) {
         // 一炒多的图片  1214
         if (Mival.sessionId == this.state.sessionId) {
@@ -1632,6 +1709,24 @@ class Video extends Component {
             this.pictureInPicture('Refresh')
           }
         }
+      } else if (Mival.typeId == 1214) {
+        if (Mival.sessionId == this.state.sessionId) {
+          this.setState({
+            moduleData: Mival,
+            isBackdrop: false
+          }, ()=>{
+            this.showModal('copy')
+          })
+        }
+      } else if (Mival.typeId == 1213) {
+        if (Mival.sessionId == this.state.sessionId) {
+          this.setState({
+            moduleData: Mival,
+            isBackdrop: false
+          }, ()=>{
+            this.showModal('subscribe') 
+          })
+        }
       } else if (Mival.typeId == 121305) {
         if (Mival.sessionId == this.state.sessionId) {
           this.saveLog('signatureCallback fail, typeId=121305, ')
@@ -1703,22 +1798,23 @@ class Video extends Component {
           }
         }
       } else if (Mival.typeId == 10020) {
-        // 录制中断
-        this.messageClick('录制服务异常中断，请重试', 'error')
-        this.saveLog('recording error')
-        this.setState({
-          isRecordingeErrorModalVisible: true,
-          recordId: ''
-        })
-        // 循环播放录制中断语音
-        const loopPlay = () => {
-          if(!this.state.recordId && document.getElementById("publish_video1")){
-            let audio = new Audio(recordErrorAudio)
-            audio.play()
-            setTimeout(loopPlay, 3000);
-          }
-        }
-        setTimeout(loopPlay, 0);
+        // 录制中断（模拟测试）
+        // this.messageClick('双录异常中断，请重新开启', 'error')
+        // this.setState({
+        //   isRecordingeErrorModalVisible: true,
+        //   businessRecordId: '',
+        // })
+        // // 循环播放录制中断语音
+        // clearTimeout(this.recordLoopPlay)
+        // this.recordLoopPlay = () => {
+        //   console.log('loop recordId', this.state.recordId, 'businessRecordId ', this.state.businessRecordId)
+        //   if(!this.state.businessRecordId && document.getElementById("publish_video1")){
+        //     let audio = new Audio(recordErrorAudio)
+        //     audio.play()
+        //     setTimeout(this.recordLoopPlay, 3000);
+        //   }
+        // }
+        // setTimeout(this.recordLoopPlay, 0);
 
       } else if (Mival.typeId == 33001 && this.state.sessionId == Mival.data.sessionId) {
         if (Mival.type == 1) {
@@ -1733,21 +1829,28 @@ class Video extends Component {
           this.state.businessId = Mival.id;
           this.saveLog('Start business recording')
           this.enableServerRecording( Mival.id)
+          if (this.state.ipadTag) this.enableIpadRecording(Mival.id)
 
-          if (this.props.whetherDetectFace){
+          if (this.props.whetherDetectFace && this.props.recordMode != 2){
             this.startFaceDetection();
           }
-          if (this.props.whetherDetectLight){
+          if (this.props.whetherDetectLight && this.props.recordMode != 2){
             this.startImageDetection();
           }
+          if (this.props.whetherNeedAsr) {
+            this.startASR();
+          }
         } else if (Mival.status == 2) {
           // 关闭了业务录制
           console.log('业务录制关闭', this.state.businessRecordId)
           this.saveLog('Stop business recording')
           this.test_controller.StopRemoteRecord(this.state.businessRecordId)
+          if (this.state.ipadRecordId) this.test_controller.StopRemoteRecord(this.state.ipadRecordId)
+
           this.state.businessId = '';
           clearInterval(this.state.faceDetectionTimer);
           clearInterval(this.state.imageDetectionTimer);
+          if(this.state.isAsrStart) this.stopASR();
         }
       } else if (Mival.typeId == 2002 && this.state.sessionId == Mival.sessionId) {
         // 会议到时间
@@ -2094,7 +2197,7 @@ class Video extends Component {
     this.test_controller.OnMediaClose = (code, sid) => {
       console.log(code, sid)
       if (code == 5003 || code == 5004 || code == 5005 || code == 5007 || code == 5009 || code == 5010 || code == 5011 || code == 5012) {
-        if (sid == document.getElementById('publish_video1').name) {
+        if (sid == document.getElementById('publish_streamId1').name) {
           this.saveLog('Audio and video close notification，' + code)
           this.roomCallBack(2, '音视频异常关闭', 8)
         } else {
@@ -2118,6 +2221,11 @@ class Video extends Component {
       publish_config.publish_video_id = 'publish_video1'
       publish_config.publish_streamId_id = 'publish_streamId1'
       publish_config.publish_tag = 'tag1'
+      if (this.props.recordMode == 2) {
+        // 分行模式，只收音 不发布摄像头
+        publish_config.media_type = 2
+        // publish_config.publish_streamId_id = 'publish_video1'
+      }
       this.test_controller.Publish(publish_config)
 
       // this.publishAllScreen();
@@ -2293,7 +2401,7 @@ class Video extends Component {
           this.state.isScreenSwitching = false
         }
       }
-      if (sid == document.getElementById('publish_video1').name) {
+      if (sid == document.getElementById('publish_streamId1').name) {
 
         this.setState({
 
@@ -2322,7 +2430,7 @@ class Video extends Component {
           },
           1000
         );
-        this.mediaInfo = this.generateMediaInfo(document.getElementById("publish_video1").name);
+        this.mediaInfo = this.generateMediaInfo(document.getElementById("publish_streamId1").name);
 
       } else {
         var box = document.getElementById("whiteboardDIV");
@@ -2345,7 +2453,7 @@ class Video extends Component {
     this.test_controller.OnPublishFailed = (sid, err_code, err_msg) => {
       this.saveLog('mrtc OnPublishFailed 发布失败, code=' + err_code)
       console.log('Publishing media stream failed，', sid, err_code, err_msg)
-      if (sid == document.getElementById('publish_video1').name) {
+      if (sid == document.getElementById('publish_streamId1').name) {
         this.state.sessionType = false
         this.roomCallBack(2, '发布失败', 4)
       } else {
@@ -2568,6 +2676,11 @@ class Video extends Component {
         }
 
       }
+
+      // 记录ipad摄像头流，需要单独开启录制
+      if (feed.mediaSource == 'VIDEO_SOURCE_CAMERA' && feed.uid.includes(IPAD_SUFFIX)) {
+        this.state.ipadTag = feed.tag;
+      }
     };
     // 推送“有新订阅”给与会者
     this.test_controller.OnNewSubscribe = (subscriber, feed) => {
@@ -2575,8 +2688,8 @@ class Video extends Component {
     };
     // 取消发布成功
     this.test_controller.OnUnPublishSucc = (sid) => {
-      console.log('取消发布成功', sid, document.getElementById('publish_video1').name)
-      if (document.getElementById('publish_video1').name && sid != document.getElementById('publish_video1').name) {
+      console.log('取消发布成功', sid, document.getElementById('publish_streamId1').name)
+      if (document.getElementById('publish_streamId1').name && sid != document.getElementById('publish_streamId1').name) {
         this.sendMessage({
             'typeId': 2030,
             'sessionId': this.state.sessionId,
@@ -2594,7 +2707,7 @@ class Video extends Component {
         // }
 
       }
-      if (sid == document.getElementById('publish_video1').name || !document.getElementById('publish_video1').name) {
+      if (sid == document.getElementById('publish_streamId1').name || !document.getElementById('publish_streamId1').name) {
         clearStreamRemain()
       }
     };
@@ -2684,6 +2797,27 @@ class Video extends Component {
         console.log('过滤掉的uid', participant)
         return
       }
+
+      if (participant.includes(IPAD_SUFFIX) && this.state.businessId){
+        // ipad单独处理，不需要加入和退出的提示。但双录过程中ipad如果离开，要提示+循环播报直到ipad重新入会
+        console.log('ipad退出房间', participant)
+        
+        this.setState({
+          IpadLeaveErrorModalVisible: true,
+          ipadTag: '',
+        })
+        // 循环播放录制中断语音
+        clearTimeout(this.ipadLeavePlay)
+        this.ipadLeavePlay = () => {
+          if(!this.state.ipadTag && document.getElementById("publish_streamId1")){
+            let audio = new Audio(IpadLeaveAudio)
+            audio.play()
+            setTimeout(this.ipadLeavePlay, 3000);
+          }
+        }
+        setTimeout(this.ipadLeavePlay, 0);
+        return
+      }
       
 
       this.appGetUsernameClick(participant).then((res) => {
@@ -2722,7 +2856,7 @@ class Video extends Component {
     // 弱网回调
     this.test_controller.OnNetworkWeak = (bpsSend, bpsRecv, sid) => {
       console.log('弱网回调', bpsSend, bpsRecv, sid)
-      if (sid == document.getElementById('publish_video1').name) {
+      if (sid == document.getElementById('publish_streamId1').name) {
         
         this.detectNetworkWeak().then((isWeak) => {
           console.log('弱网结果：' + isWeak)
@@ -2755,6 +2889,11 @@ class Video extends Component {
         this.state.recordId = record_id
         this.videoRecordCallback('1', true)
         this.saveLog('mrtc OnStartRemoteRecordSucc')
+      } else if (String(record_third_id).includes('_ipad')){
+        this.state.ipadRecordId = record_id
+        const busId = Number(record_third_id.split('_')[0])
+        this.ipadRecordCallback('1', true, busId)
+        this.saveLog('mrtc OnStartIpadRecordSucc')
       } else {
         // 业务录制
         this.state.businessRecordId = record_id
@@ -2779,6 +2918,10 @@ class Video extends Component {
       if (!record_third_id) {
         this.videoRecordCallback('1', false)
         this.saveLog('mrtc OnStartRemoteRecordFailed, code='+err_code)
+      } else if (String(record_third_id).includes('_ipad')){
+        const busId = Number(record_third_id.split('_')[0])
+        this.ipadRecordCallback('1', false, busId)
+        this.saveLog('mrtc OnStartIpadRecordFailed, code='+err_code)
       } else {
         this.businessRecordCallback('1', false, record_third_id)
         this.saveLog('mrtc OnStartRemoteBusinessRecordFailed, code='+err_code + ',businessId=' + record_third_id)
@@ -2795,6 +2938,11 @@ class Video extends Component {
         this.videoRecordCallback('2', true)
         this.saveLog('mrtc OnStopRemoteRecordSucc, recordId='+recordId)
         this.state.recordId = '';
+      } else if (String(record_third_id).includes('_ipad')){
+        const busId = Number(record_third_id.split('_')[0])
+        this.ipadRecordCallback('2', true, busId)
+        this.saveLog('mrtc OnStopIpadRecordSucc, recordId='+recordId)
+        this.state.ipadRecordId = '';
       } else {
         this.businessRecordCallback('2', true, record_third_id)
         this.saveLog('mrtc OnStopRemoteBusinessRecordSucc, recordId='+recordId + ',businessId=' + record_third_id)
@@ -2817,6 +2965,10 @@ class Video extends Component {
       if (!record_third_id) {
         this.videoRecordCallback('2', false)
         this.saveLog('mrtc OnStopRemoteRecordFailed, err_code='+err_code)
+      } else if (String(record_third_id).includes('_ipad')){
+        const busId = Number(record_third_id.split('_')[0])
+        this.ipadRecordCallback('2', false, busId)
+        this.saveLog('mrtc OnStopIpadRecordFailed, err_code='+err_code)
       } else {
         this.businessRecordCallback('2', false, record_third_id)
         this.saveLog('mrtc OnStopRemoteBusinessRecordFailed, err_code='+err_code+',businessId=' + record_third_id)
@@ -2885,6 +3037,28 @@ class Video extends Component {
       msg
     ) => {
       console.log('服务端录制失败通知', recordId, feedId, code, msg)
+      this.saveLog(`recording error, recordId=${recordId}`)
+
+      // 如果在业务双录中，需要重新开启；如果是full录制出错，则不用处理
+      if (this.state.businessRecordId == recordId) {
+        // 录制中断
+        this.messageClick('双录异常中断，请重新开启', 'error')
+        this.setState({
+          isRecordingeErrorModalVisible: true,
+          businessRecordId: '',
+        })
+        // 循环播放录制中断语音
+        clearTimeout(this.recordLoopPlay)
+        this.recordLoopPlay = () => {
+          console.log('loop recordId', this.state.recordId, 'businessRecordId ', this.state.businessRecordId)
+          if(!this.state.businessRecordId && document.getElementById("publish_streamId1")){
+            let audio = new Audio(recordErrorAudio)
+            audio.play()
+            setTimeout(this.recordLoopPlay, 3000);
+          }
+        }
+        setTimeout(this.recordLoopPlay, 0);
+      }
     };
     // 停止浏览器录制成功回调
     this.test_controller.OnClientStopRecordSuccess = (
@@ -3104,7 +3278,7 @@ class Video extends Component {
         let startX = x2 // 绘制起始点x
         let startY = y1 - height  // 绘制起始点y
         ctx.fillRect(startX, startY, width, height)
-        if (document.getElementById('publish_video1').name == sid && i == 39) {
+        if (document.getElementById('publish_streamId1').name == sid && i == 39) {
           this.state.analyserHeight.set(sid, number / 40 / 70)
           this.state.analyserHeight = this.state.analyserHeight
         }
@@ -3150,128 +3324,24 @@ class Video extends Component {
 
 
     };
-
-    const that = this;
-    this.asr_controller.OnGetSign = function(bizName, subBiz, uid) {
-      return 'signature'
-    }
-    // 连接成功回调
-    this.asr_controller.OnAsrConnectOK = function() {
-      // 需要状态控制
-      if (media_status == 1) {
-        return
-      }
-
-      const config_param = {}
-      const biz_name = 'demo'
-      const sub_biz = 'default'
-      const uid = that.props.tellerAccount
-      const sampleRate = 16000
-      const procType = 8
-      config_param.bizName = biz_name
-      config_param.subBiz = sub_biz
-      config_param.uid = uid
-      config_param.sampleRate = sampleRate
-      config_param.procType = procType
-      config_param.mediaStreamType = 2 // 1:麦克风;2:传stream
-      // console.log(test_controller.GetMediaInfo(document.getElementById('publish_video1').name).audio_)
-      config_param.audio_ = that.test_controller.GetMediaInfo(document.getElementById('publish_video1').name).audio_
-      config_param.idleTime = 6 // 12s没有识别结果返回通知上层
-      config_param.tag = 'asr_tag0'
-      that.asr_sid = that.asr_controller.TurnOnMicrophone(config_param, config_param.audio_)
-    }
-    // 初始化成功
-    this.asr_controller.OnInitOk = function(sid, tag) {
-      console.log('OnInitOk:')
-      media_status = 1
-    }
-
-    // 初始化失败
-    this.asr_controller.OnInitError = function(sid, code, msg, tag) {
-      console.log('OnInitError:' + msg)
-      that.asr_sid = ''
-    }
-
-    // 识别结果
-    this.asr_controller.OnAsrMessage = function(msg, sid, tag, status) {
-      that.asr_controller.trace(`OnAsrMessage sid=${sid},status=${status},tag=${tag}`)
-      const parse = JSON.parse(msg)
-      const resultValue = parse.value
-      const sentence_id = parse.sentence_id
-      // sentence_id相同,取最后一个值
-      let text = resultValue || ''
-      const sensitiveArr = that.props.sensitiveWords
-      // const regex = new RegExp(sensitiveArr.join('|'), 'g') // /\#{(.+?)\}/g;
-      // text = text.replace(regex, function(r) { return '<span style="background: red;">' + r + '</span>' })
-      let matchArr = sensitiveArr.filter(el => text.includes(el));
-      if (matchArr.length>0) {
-        matchArr.forEach(el => {
-          that.messageClick('检测到敏感词:' + matchArr, 'error')
-          that.state.sensitiveTitle = '检测到敏感词:' + matchArr
-          clearTimeout(that.state.sensitiveTitleTimer)
-          that.state.sensitiveTitleTimer = setTimeout(() => {
-            that.state.sensitiveTitle = ''
-          }, 3000);
-          if (!that.state.sensitiveRecordMap[sentence_id] || !that.state.sensitiveRecordMap[sentence_id].includes(el)){
-            API.addSensitiveRecord({
-              tellerId: that.props.tellerAccount,
-              sessionId: that.state.sessionId,
-              sensitiveWord: el
-            });
-            if (!that.state.sensitiveRecordMap[sentence_id]) {
-              that.state.sensitiveRecordMap[sentence_id] = []
-            } 
-            that.state.sensitiveRecordMap[sentence_id].push(el)
-          }
-        })
-      }
-      // that.AsrResultText = text
-    }
-
-    // 停止录音回调
-    this.asr_controller.OnTurnOffMicrophoneOK = function(sid, tag) {
-      media_status = 0
-      that.asr_controller.Disconnect()
-    }
-    this.asr_controller.OnAsrMsgIdle = function(sid, tag) {
-      // that.AsrResultText = ''
-      that.asr_controller.trace('OnAsrMsgIdle')
-    }
-    this.asr_controller.OnAsrDisconnectOK = function() {
-      that.asr_controller.trace('Disconnect is  success')
-    }
-
+    
+  
   }
   startASR() {
     // const publish_sid = document.getElementById('publish_video1').name
 
-    if (media_status == 1) {
-      return
-    }
-    this.asr_controller.Connect(this.props.asrServerUrl)
-    message.success({
-      content: '敏感词检测已开启',
-      icon: <img src={require("../../assets/img/tooltips1_pass.png").default} alt="" ></img>,
-      className: 'successClassName',
-      top: 200,
-      // duration: 10
-    })
-    this.state.isAsrStart = true
-    this.state.sensitiveRecordMap = {}
-    // this.AsrResultText = ''
+    // if (media_status == 1) {
+    //   return
+    // }
+    this.asr_controller.initWebSocket(this.props.asrServerUrl)
   }
   stopASR() {
     this.state.isAsrStart = false
-    // this.AsrResultText = ''
-    // const { publish_sid } = this.getSidsInfo()
-    if (media_status == 0) {
-      return
-    }
-    this.asr_controller.TurnOffMicrophone(this.asr_sid)
-    // clearInterval(this.asrTimer)
-    // if (this.localRecordStatus && this.client_record_id) {
-    //   test_controller.StopRecord(this.client_record_id)
+    // if (media_status == 0) {
+    //   return
     // }
+    this.asr_controller.Disconnect()
+  
     message.success({
       content: '敏感词检测已关闭',
       icon: <img src={require("../../assets/img/tooltips1_pass.png").default} alt="" ></img>,
@@ -3340,6 +3410,27 @@ class Video extends Component {
       }
     }
   }
+  // ipad录制回调
+  ipadRecordCallback= async (type, status, businessId) => {
+    try {
+      let result = await API.videoRecordCallback({
+        activityId: this.props.businessNumber,
+        sessionId: this.state.sessionId,
+        roomId: this.state.channelId + '',
+        id: businessId,
+        appId: this.state.appId,
+        recordId: this.state.ipadRecordId,
+        customerId: this.props.customerId,
+        isIpad: 1,
+        type: type,
+        status: status
+      });
+    } catch (err) {
+      console.error(err);
+      if (err.status == 502 || err.status == 404) {
+      }
+    }
+  }
   uploadLogCallback = async (url) => {
     try {
       let result = await API.uploadLogCallback({
@@ -3387,7 +3478,7 @@ class Video extends Component {
       });
       console.log(result);
       this.queryRecordStatus()
-      this.appGetUsername(document.getElementById('publish_video1').name)
+      this.appGetUsername(document.getElementById('publish_streamId1').name)
       this.sendMessage({
           'typeId': 1014,
           'sessionId': this.state.sessionId,
@@ -3416,7 +3507,7 @@ class Video extends Component {
         beautyStop();
         console.log('beautyStop!!')
       } catch (err){
-        console.error(err)
+        console.log(err)
       }
     }
     if (this.state.isAsrStart){
@@ -3426,8 +3517,13 @@ class Video extends Component {
     if (this.state.isPictureInPicture) {
       document.exitPictureInPicture()
     }
+    worker.postMessage(false);
+    worker.terminate();
     message.destroy()
     clearTimeout(this.loopPlay)
+    clearTimeout(this.recordLoopPlay)
+    clearTimeout(this.ipadLeavePlay)
+    clearTimeout(this.ipadLowPowerPlay)
     clearInterval(this.state.drawCanvasInterval)
     clearInterval(this.state.faceDetectionTimer);
     clearInterval(this.state.imageDetectionTimer);
@@ -3566,9 +3662,9 @@ class Video extends Component {
     let params =  `?v=${SDK_VERISON}`
     const _dependScripts = [
       // this.props.resourcePath + "/opencv.js" + params,
-      this.props.resourcePath + "/asr_api.js" + params,
-      this.props.resourcePath + "/reconnecting-websocket.min.js" + params,
-      this.props.resourcePath + "/resampler.js" + params,
+      // this.props.resourcePath + "/asr_api.js" + params,
+      // this.props.resourcePath + "/reconnecting-websocket.min.js" + params,
+      // this.props.resourcePath + "/resampler.js" + params,
       this.props.resourcePath + "/beauty/beauty_frame_pkg.js" + params,
       this.props.resourcePath + "/adapter.js" + params,
       this.props.resourcePath + "/getMediaInfo.js" + params,
@@ -3622,14 +3718,12 @@ class Video extends Component {
             script.onreadystatechange = () => {
               if (script.readyState == 'loaded' || script.readyState == 'complete') {
                 that.test_controller = new MeetingController();
-                that.asr_controller = new AsrController()
                 that.mountClick()
               }
             }
           } else {
             script.onload = () => {
               that.test_controller = new MeetingController();
-              that.asr_controller = new AsrController()
               that.mountClick()
             }
           }
@@ -3690,8 +3784,95 @@ class Video extends Component {
     if (this.props.salesBranchCode) {
       this.queryBranchName()
     }
+    window.imRoom = {
+      sessionId: this.props.sessionId,
+      userId: this.props.tellerAccount
+    }
   }
+  initAsrRecorder = () => {
+    this.state.recorder = new Recorder({
+      sampleBits: 16,                 // 采样位数，，默认是16
+      sampleRate: 16000,              //音频采样率，默认是16000Hz，
+      numChannels: 1,                 // 声道，支持 1 或 2， 默认是1
+      compiling: true                 // 是否边录边转换，默认是false
+    })
+    this.asr_controller = new MyAsrController({
+      token: this.state.asrToken,
+      appkey: this.state.asrAppKey,
+      url: this.state.asrServerUrl,
+      recorder: this.state.recorder
+    })
+
+    let that = this;
+    this.asr_controller.onConnectError = () => {
+      this.messageClick('违禁词检测服务连接失败', 'error')
+    }
+
+    this.asr_controller.onConnectOK = () => {
+      message.success({
+        content: '敏感词检测已开启',
+        icon: <img src={require("../../assets/img/tooltips1_pass.png").default} alt="" ></img>,
+        className: 'successClassName',
+        top: 200,
+        // duration: 10
+      })
+      this.state.recorder.start().then(() => {
+        console.log('asr recorder 开启')
+      }, (error) => {
+        console.log(`出错了`);
+      });
+      this.state.isAsrStart = true
+      this.state.sensitiveRecordMap = {}
+      // this.AsrResultText = ''
+    }
 
+    this.asr_controller.onSentenceEnd = (msg) => {
+      console.log('句子解析结果', msg.result)
+      const resultValue = msg.result
+      const sentence_id = msg.index
+      API.keywordMatch({
+        text: resultValue,
+        appCode: `HSBCCode`
+      }).then((re) => {
+        if (re.data.match) {
+          this.saveVideoPoint('pwd', `${resultValue}`)
+          console.log('匹配到敏感词', re.data.matchRawTextItems)
+          let matchArr = re.data.matchRawTextItems.map(el => el.matchedText);
+          if (matchArr.length>0) {
+                matchArr.forEach(el => {
+                  this.messageClick('检测到敏感词:' + matchArr, 'error')
+                })
+              }
+        }
+      }); 
+    }
+    // this.asr_controller.onAsrMessage = (msg) => {
+    //   console.log('收到解析结果', msg.result)
+    //   const resultValue = msg.result
+    //   const sentence_id = msg.index
+    //   // sentence_id相同,取最后一个值
+    //   let text = resultValue || ''
+    //   const sensitiveArr = that.props.sensitiveWords
+    //   let matchArr = sensitiveArr.filter(el => text.includes(el));
+    //   if (matchArr.length>0) {
+    //     matchArr.forEach(el => {
+    //       that.messageClick('检测到敏感词:' + matchArr, 'error')
+    //       that.state.sensitiveTitle = '检测到敏感词:' + matchArr
+    //       clearTimeout(that.state.sensitiveTitleTimer)
+    //       that.state.sensitiveTitleTimer = setTimeout(() => {
+    //         that.state.sensitiveTitle = ''
+    //       }, 3000);
+    //       if (!that.state.sensitiveRecordMap[sentence_id] || !that.state.sensitiveRecordMap[sentence_id].includes(el)){
+          
+    //         if (!that.state.sensitiveRecordMap[sentence_id]) {
+    //           that.state.sensitiveRecordMap[sentence_id] = []
+    //         } 
+    //         that.state.sensitiveRecordMap[sentence_id].push(el)
+    //       }
+    //     })
+    //   }
+    // }
+  }
   voice = () => {
     if (this.isFileSuccuse()) {
       if (!this.state.voiceStatue) {
@@ -3761,8 +3942,9 @@ class Video extends Component {
           this.state.businessId = result.businessId;
           third_id_Map.set(result.businessRecordId, result.businessId);
           console.log(third_id_Map)
-          if (this.props.whetherDetectFace) this.startFaceDetection();
-          if (this.props.whetherDetectLight) this.startImageDetection();
+          if (this.props.whetherDetectFace && this.props.recordMode != 2) this.startFaceDetection();
+          if (this.props.whetherDetectLight && this.props.recordMode != 2) this.startImageDetection();
+          if (this.props.whetherNeedAsr) this.startASR();
         }
       } else {
         this.state.recordId = ''
@@ -3985,6 +4167,36 @@ class Video extends Component {
     }
 
   };
+  // 打开抄录/签署面板
+  showModal=(moduleName)=>{
+    if (!this.state.multiModuleShow) {
+			this.setState({
+				multiModuleShow:true,
+				multiModule: moduleName,
+			},()=>{
+      })
+      this.tabTitlesClick(
+        {
+          value: 'multiModule',
+          name: '签署抄录'
+        },'add'
+      )
+		}else{
+			this.closeModule()
+		}
+  }
+  // 关闭面板
+  closeModule=()=>{
+      setTimeout(() => {
+        this.setState({
+          multiModuleShow:false,
+				  multiModule: '',
+        })  
+        this.tabTitlesClick('multiModule','delect')
+      }, 0);
+      // const sid = document.getElementById('video20').name;
+      // sid ? this.test_controller.UnPublish(sid) : ''
+  }
   handleOkPictureConfirm = () => {
     this.pictureInPictureClick('add')
     this.setState({isPictureConfirmModalVisible: false})
@@ -3993,8 +4205,21 @@ class Video extends Component {
     if (!this.state.isPictureInPicture) {
       this.pictureInPicture()
     }
-    this.saveLog('Start recording')
-    this.enableServerRecording()
+    this.saveLog('Start business recording')
+    this.enableServerRecording(this.state.businessId)
+  }
+  handleOkLowPowerConfirm = () => {
+    this.setState({ ipadLowPowerErrorModalVisible: false})
+    clearTimeout(this.ipadLowPowerPlay)
+  }
+  handleOkIpadLeaveConfirm = () => {
+    // 检测ipad是否入会
+    if (!this.state.ipadTag) {
+      this.messageClick('未检测到IPAD，请重新加入后再试', 'error')
+    } else {
+      clearTimeout(this.ipadLeavePlay)
+      this.setState({IpadLeaveErrorModalVisible: false})
+    }
   }
   handleOk = () => {
     // 代表此时按钮是暂停会话，把isSuspend改成true变成恢复会话
@@ -4788,7 +5013,7 @@ class Video extends Component {
         userId = this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId"+i).innerText).uid
       }
     }
-    if (document.getElementById('publish_video1').name == sid) {
+    if (document.getElementById('publish_streamId1').name == sid) {
       userId = this.props.tellerAccount
     }
     try {
@@ -4808,7 +5033,7 @@ class Video extends Component {
       } else {
         this.messageClick('查询失败', 'error')
       }
-      if (this.props.isOpenSound && sid != document.getElementById('publish_video1').name) {
+      if (this.props.isOpenSound && sid != document.getElementById('publish_streamId1').name) {
           if (result.data.userType == 1) {
             let src = autod
             let audio = new Audio(src)
@@ -4819,7 +5044,7 @@ class Video extends Component {
             audio.play()
           }
       }
-      if (document.getElementById('publish_video1').name == sid) {
+      if (document.getElementById('publish_streamId1').name == sid) {
         this.setState({
           titleNameRm: data
         })
@@ -5402,7 +5627,7 @@ class Video extends Component {
     this.setState({
       isModalVisibleEnvironment: false,
     })
-    if (!this.state.isPictureInPicture) {
+    if (!this.state.isPictureInPicture && this.props.recordMode != 2) {
       this.pictureInPicture()
     }
   }
@@ -5417,7 +5642,7 @@ class Video extends Component {
       loading: true
     })
     const config = {}
-    config.sid = document.getElementById('publish_video1').name
+    config.sid = document.getElementById('publish_video1').name || document.getElementById('publish_streamId1').name
     config.videoSource = this.state.cameraValue
     config.audioSource = this.state.microphoneValue
     this.test_controller.ChangeProfile(config)
@@ -5475,7 +5700,7 @@ class Video extends Component {
   }
   changeMediaStream = () => {
     let publish_config = {}
-      publish_config.sid = document.getElementById('publish_video1').name
+      publish_config.sid = document.getElementById('publish_video1').name || document.getElementById('publish_streamId1').name
       publish_config.media_type = 1
       publish_config.publish_device = 1
       // publish_config.videoSource = this.state.cameraValue
@@ -6012,9 +6237,9 @@ class Video extends Component {
     const isEnvironmentOK = !this.state.loading && 
                             this.state.envInfo.networkResult=='合格' &&
                             this.state.envInfo.batteryResult=='合格' &&
-                            this.state.envInfo.cameraResult=='合格' &&
+                            (this.state.envInfo.cameraResult=='合格' || this.props.recordMode == 2) &&
                             this.state.envInfo.microResult=='合格' &&
-                            this.state.envInfo.lightResult=='合格'
+                            (this.state.envInfo.lightResult=='合格' || this.props.recordMode == 2 )
 
     const sectionStyle = this.state.tabTitles.length > 0 ? {
       zIndex: '-1',
@@ -6062,6 +6287,18 @@ class Video extends Component {
                     }
                     <canvas id="canvas" className="canvas"></canvas>
                   </CanvasHome>
+                  <div className="videoDiv" style={{ display: (this.state.isSelect == 'multiModule') ? '' : 'none', }}>
+                    <div className="videoDiv">
+                    {/* <div style={{ display: (this.state.multiModuleShow) ? '' : 'none', height: '100%'}}> */}
+                    {
+                      this.state.multiModuleShow && 
+                      <div style={{ height: '100%'}}>
+                      <MultiModule  moduleName={this.state.multiModule} data={this.state.moduleData} finish={this.closeModule} handleReceiveMsg={this.handleReceiveMsg}></MultiModule>
+                      </div>
+                    }
+                    </div>
+
+                  </div>
                   <div className="videoDiv" style={{ display: (this.state.isSelect == 'RMScreen' || this.state.isSelect == 'staffScreen') ? '' : 'none', }}>
                     <div className="videoDiv" style={{ 'textAlign': 'center' }}>
                       <video
@@ -6126,7 +6363,7 @@ class Video extends Component {
 
                         </ul>
                       </div>
-                      {!this.state.loading && this.state.sessionType && this.state.sessionId?
+                      {!this.state.loading && this.state.sessionType && this.state.sessionId && this.props.recordMode == 2?
                       <div className='QRCode'>
                         <QRCode
                             value={JSON.stringify({
@@ -6148,6 +6385,7 @@ class Video extends Component {
               <div id="videoList" className={`wrapper ${this.state.isVideoList? 'videoListClass': ''}`} style={{ width: '20%' }}>
                 <div
                   className={`itemed ${this.state.isVideoList? 'videoMinutuListClass': 'videoMinutuClass'}`}
+                  style={{ display: (this.props.recordMode == 2) ? 'none' : ''}}
                 >
                   <div className="publishVideoDiv">
 
@@ -6341,6 +6579,22 @@ class Video extends Component {
           ]}>
             <div className='endModal'>双录异常中断，请重新开启</div>
           </Modal>
+          {/* ipad低电量确认 */}
+          <Modal closable={false} centered={true} visible={this.state.ipadLowPowerErrorModalVisible} maskClosable={false} footer={[
+            <div key='end'>
+              <Button className="modelButtonOk" type="primary" danger onClick={this.handleOkLowPowerConfirm}>确定</Button>
+            </div>
+          ]}>
+            <div className='endModal'>IPAD电量过低，请检查</div>
+          </Modal>
+          {/* 双录中ipad退出确认 */}
+          <Modal closable={false} centered={true} visible={this.state.IpadLeaveErrorModalVisible} maskClosable={false} footer={[
+            <div key='end'>
+              <Button className="modelButtonOk" type="primary" danger onClick={this.handleOkIpadLeaveConfirm}>确定</Button>
+            </div>
+          ]}>
+            <div className='endModal'>IPAD异常退出，请重新加入</div>
+          </Modal>
           {/* 是否退出会议*/}
           <Modal closable={false} centered={true} visible={this.state.isModalVisibleEnd} maskClosable={false} footer={[
             <div key='end'>
@@ -6705,6 +6959,8 @@ class Video extends Component {
                 key="2" className={this.state.envInfo.batteryResult=='不合格'? 'panel-error':''}>
                 <p className='envClass'>电量：{this.state.envInfo.batteryLevel}（{this.state.envInfo.batteryCharging}）</p>
               </Panel>
+              {
+                this.props.recordMode != 2 && 
               <Panel header={<span>摄像头设备 - {this.state.envInfo.cameraResult}{this.state.envInfo.cameraResult=='不合格'? <img src={IconFail} />: <img src={IconSuccess} />}</span>} 
                 key="3" className={this.state.envInfo.cameraResult=='不合格'? 'panel-error':''}>
                 <div >
@@ -6719,6 +6975,7 @@ class Video extends Component {
                   {this.state.cameraList.length == 0 ? <p className="envClass">获取不到设备，请检查电脑“设置”中的摄像头权限是否开启，并重启浏览器再试</p> : null}
                 </div>
               </Panel>
+              }
               <Panel header={<span>麦克风设备 - {this.state.envInfo.microResult} {this.state.envInfo.microResult=='不合格'? <img src={IconFail} />: <img src={IconSuccess} />}</span>} key="4" className={this.state.envInfo.microResult=='不合格'? 'panel-error':''}>
                 <div>
                   {
@@ -6731,9 +6988,12 @@ class Video extends Component {
                   {this.state.cameraList.length == 0 ? <p className="envClass">获取不到设备，请检查电脑“设置”中的麦克风权限是否开启，并重启浏览器再试</p> : null}
                 </div>
               </Panel>
+              {
+                this.props.recordMode != 2 && 
               <Panel header={<span>背光、曝光 - {this.state.envInfo.lightResult} {this.state.envInfo.lightResult=='合格'? <img src={IconSuccess} />: <img src={IconFail} />}</span>} key="6" className={this.state.envInfo.lightResult=='合格'? '':'panel-error'}>
                  <p className="envClass">{this.state.envInfo.lightResult=='合格'? '无过度背光、曝光':'过度背光、曝光'}</p> 
               </Panel>
+              }
             </Collapse>
           </Modal>
           <video className="mixedvideo" id="mixedvideo" autoPlay muted={true} width="0" height="0"></video>
@@ -6758,7 +7018,10 @@ Video.defaultProps = {
   callbackUrl: 'http://182.92.184.31:8720/hsbc/callback',
   // roomServerUrl: 'wss://app.uat.dsp.hsbcfts.com.cn/mpaas/mrtc/ws', 
   roomServerUrl: 'wss://mrtc.mpaas.cn-hangzhou.aliyuncs.com/ws',
-  asrServerUrl: 'wss://ismis.alipay.com/ws',
+  // asr公有云默认参数
+  // asrServerUrl: 'wss://nls-gateway.cn-shanghai.aliyuncs.com/ws/v1',
+  // asrAppKey: 'E6DAPlpMun5L2dJ7',
+  // asrToken: 'a07198021d434d1288cd4ab3178712cb',
   resourcePath: 'https://counter-web.leimondata.cn:7199',
   // resourcePath: 'https://zuul.uat.dsp.hsbcfts.com.cn/wealth/js/',
   prohbiitPrompt: '当前无客户',
@@ -6784,6 +7047,7 @@ Video.defaultProps = {
   isWeakSound: false,
   whetherDetectFace: false, // 是否在双录时开启人脸检测
   whetherDetectLight: false, // 是否在双录时开启背光检测
+  whetherNeedAsr: false, // 是否在双录时开启违禁词检测
   faceDetectInterval: 6, // 人脸检测间隔（秒）
   lightDetectInterval: 6, // 背光检测间隔（秒）
   userSide: 2,