react_hsbc_teller 0.5.5 → 0.5.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/hsbc.js +1 -1
- package/lib/index.html +1 -1
- package/package.json +1 -1
- package/packages/common/websocket.js +1 -0
- package/packages/pages/video/video.jsx +74 -11
- package/packages/pages/video/video.less +50 -1
- package/packages/utils/cell.js +3 -3
- package/public/index.html +6 -0
package/lib/index.html
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
<!doctype html><html><head><meta charset="utf-8"/><link rel="shortcut icon" href="favicon.ico"><meta content="width=device-width,minimum-scale=1,maximum-scale=1,user-scalable=no" name="viewport"/><title>汇丰银行营业厅 | lib 创建 library</title><script defer="defer" src="hsbc.js"></script></head><body><div id="root"></div></body></html>
|
|
1
|
+
<!doctype html><html><head><meta charset="utf-8"/><link rel="shortcut icon" href="favicon.ico"><meta content="width=device-width,minimum-scale=1,maximum-scale=1,user-scalable=no" name="viewport"/><meta name="renderer" content="webkit"/><meta name="force-rendering" content="webkit"/><meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"/><title>汇丰银行营业厅 | lib 创建 library</title><script defer="defer" src="hsbc.js"></script></head><body><div id="root"></div></body></html>
|
package/package.json
CHANGED
|
@@ -23,9 +23,10 @@ import { Button } from '../../../node_modules/antd/lib/index';
|
|
|
23
23
|
import CanvasDraw from "react-canvas-draw";
|
|
24
24
|
import { FormattedMessage, injectIntl } from 'react-intl';
|
|
25
25
|
import html2canvas from 'html2canvas';
|
|
26
|
+
import axios from 'axios';
|
|
26
27
|
const LEAVE_TYPE = {
|
|
27
|
-
TELLER_EXIT:
|
|
28
|
-
ROOM_DESTROYED:
|
|
28
|
+
TELLER_EXIT: 1, // 坐席退出
|
|
29
|
+
ROOM_DESTROYED: -1, // 房间异常
|
|
29
30
|
}
|
|
30
31
|
let pictureInPictureVideo = ''
|
|
31
32
|
@injectIntl
|
|
@@ -102,7 +103,9 @@ class Video extends Component {
|
|
|
102
103
|
microphoneList: [],
|
|
103
104
|
isModalVisibleInspection: false,
|
|
104
105
|
cameraValue: '',
|
|
105
|
-
microphoneValue: ''
|
|
106
|
+
microphoneValue: '',
|
|
107
|
+
imStatus: false,
|
|
108
|
+
imJoinRoom: false
|
|
106
109
|
};
|
|
107
110
|
// eslint-disable-next-line no-undef
|
|
108
111
|
test_controller = '';
|
|
@@ -132,7 +135,13 @@ class Video extends Component {
|
|
|
132
135
|
sessionId: result.sessionId
|
|
133
136
|
});
|
|
134
137
|
// eslint-disable-next-line no-undef
|
|
135
|
-
|
|
138
|
+
if(this.state.imStatus) {
|
|
139
|
+
joinRoom((this.props.tellerAccount + '@' + JSON.parse(window.sessionStorage.getItem('sigData')).hostname), this.state.imRoomId)
|
|
140
|
+
this.setState({
|
|
141
|
+
imJoinRoom:true
|
|
142
|
+
})
|
|
143
|
+
console.log('加入IM房间')
|
|
144
|
+
}
|
|
136
145
|
this.props.createRoomCallback({
|
|
137
146
|
type: 1,
|
|
138
147
|
errorManage: '',
|
|
@@ -1006,7 +1015,24 @@ class Video extends Component {
|
|
|
1006
1015
|
}
|
|
1007
1016
|
}
|
|
1008
1017
|
};
|
|
1018
|
+
window.IMOpenfire = msg =>{
|
|
1019
|
+
console.log('im登录', msg)
|
|
1020
|
+
if(!msg) {
|
|
1021
|
+
this.roomCallBack(2, 'im建立连接失败')
|
|
1022
|
+
} else {
|
|
1023
|
+
this.setState({
|
|
1024
|
+
imStatus: msg
|
|
1025
|
+
})
|
|
1026
|
+
if(this.state.imRoomId && !this.state.imJoinRoom) {
|
|
1027
|
+
joinRoom((this.props.tellerAccount + '@' + JSON.parse(window.sessionStorage.getItem('sigData')).hostname), this.state.imRoomId)
|
|
1028
|
+
this.setState({
|
|
1029
|
+
imJoinRoom:true
|
|
1030
|
+
})
|
|
1031
|
+
console.log('加入im房间')
|
|
1032
|
+
}
|
|
1033
|
+
}
|
|
1009
1034
|
|
|
1035
|
+
}
|
|
1010
1036
|
let data = {
|
|
1011
1037
|
account: this.props.tellerAccount,
|
|
1012
1038
|
type: '2',
|
|
@@ -1086,7 +1112,7 @@ class Video extends Component {
|
|
|
1086
1112
|
this.test_controller.OnGetDevicesFailed = (code, msg) => {
|
|
1087
1113
|
console.log('获取设备失败', code, msg)
|
|
1088
1114
|
this.messageClick('获取设备失败,请检查摄像头设备是否可用或是否禁用摄像头','error')
|
|
1089
|
-
this.roomCallBack(2, '
|
|
1115
|
+
this.roomCallBack(2, '获取失败')
|
|
1090
1116
|
};
|
|
1091
1117
|
// 建立连接成功
|
|
1092
1118
|
this.test_controller.OnConnectOK = () => {
|
|
@@ -1371,6 +1397,21 @@ class Video extends Component {
|
|
|
1371
1397
|
})
|
|
1372
1398
|
}, function (code, message, data) {
|
|
1373
1399
|
})
|
|
1400
|
+
if(this.state.voiceStatue) {
|
|
1401
|
+
callNimIM('sendCustomCmdMsg', {
|
|
1402
|
+
customId: this.state.imRoomId,
|
|
1403
|
+
content: JSON.stringify({
|
|
1404
|
+
'typeId': 1013,
|
|
1405
|
+
'muteStatus': 1,
|
|
1406
|
+
'data': {
|
|
1407
|
+
'sessionId': this.state.sessionId,
|
|
1408
|
+
'userId': this.props.tellerAccount
|
|
1409
|
+
}
|
|
1410
|
+
})
|
|
1411
|
+
}, function (code, message, data) {
|
|
1412
|
+
console.log(data)
|
|
1413
|
+
})
|
|
1414
|
+
}
|
|
1374
1415
|
let array = this.state.roomCustomerList;
|
|
1375
1416
|
let newArray = [...array];
|
|
1376
1417
|
newArray.push({
|
|
@@ -2015,6 +2056,8 @@ class Video extends Component {
|
|
|
2015
2056
|
isCustomer: false,
|
|
2016
2057
|
isWhiteboard: false,
|
|
2017
2058
|
isPictureInPicture: false,
|
|
2059
|
+
imStatus: false,
|
|
2060
|
+
imJoinRoom: false
|
|
2018
2061
|
});
|
|
2019
2062
|
this.props.onLeaveRoom({
|
|
2020
2063
|
code: LEAVE_TYPE.TELLER_EXIT,
|
|
@@ -2048,6 +2091,15 @@ class Video extends Component {
|
|
|
2048
2091
|
this.setState({
|
|
2049
2092
|
loading: true,
|
|
2050
2093
|
})
|
|
2094
|
+
axios.get(this.props.resourcePath + "/beauty/beauty.js")
|
|
2095
|
+
.then(response => this.addToScriptClick()).catch(function (error) {
|
|
2096
|
+
console.log(error);
|
|
2097
|
+
this.roomCallBack(2, '创建房间失败')
|
|
2098
|
+
|
|
2099
|
+
})
|
|
2100
|
+
|
|
2101
|
+
}
|
|
2102
|
+
addToScriptClick=()=>{
|
|
2051
2103
|
const _dependScripts = [
|
|
2052
2104
|
// https://counter-web.leimondata.cn:7199
|
|
2053
2105
|
this.props.resourcePath + "/beauty/beauty.js",
|
|
@@ -2786,7 +2838,11 @@ class Video extends Component {
|
|
|
2786
2838
|
{
|
|
2787
2839
|
this.state.cameraList.map((item, index) => {
|
|
2788
2840
|
return <div>
|
|
2789
|
-
<
|
|
2841
|
+
<label className="radio">
|
|
2842
|
+
<input type="radio" name="camere" value={item.actionid} style={{float: 'left'}} checked={this.state.cameraValue == item.actionid} onChange={(e) => this.getCameraValue(e)} /><i></i>
|
|
2843
|
+
{item.actionname}
|
|
2844
|
+
</label>
|
|
2845
|
+
{/* <input type="radio" name="camere" value={item.actionid} checked={this.state.cameraValue == item.actionid} onChange={(e) => this.getCameraValue(e)} /><label for={item.actionid}>{item.actionname}</label> <br /> */}
|
|
2790
2846
|
</div>
|
|
2791
2847
|
})
|
|
2792
2848
|
}
|
|
@@ -2798,7 +2854,11 @@ class Video extends Component {
|
|
|
2798
2854
|
{
|
|
2799
2855
|
this.state.microphoneList.map((item, index) => {
|
|
2800
2856
|
return <div class="cameraAnMicrophone">
|
|
2801
|
-
<
|
|
2857
|
+
<label className="radio">
|
|
2858
|
+
<input type="radio" name="microphone" value={item.actionid} style={{float: 'left'}} checked={this.state.microphoneValue == item.actionid} onChange={(e) => this.getMicrophoneValue(e)} /><i></i>
|
|
2859
|
+
{item.actionname}
|
|
2860
|
+
</label>
|
|
2861
|
+
{/* <input type="radio" name="microphone" value={item.actionid} checked={this.state.microphoneValue == item.actionid} onChange={(e) => this.getMicrophoneValue(e)} /><label for={item.actionid}>{item.actionname}</label> <br /> */}
|
|
2802
2862
|
</div>
|
|
2803
2863
|
})
|
|
2804
2864
|
}
|
|
@@ -2808,12 +2868,15 @@ class Video extends Component {
|
|
|
2808
2868
|
'z-index': '-1',
|
|
2809
2869
|
width:'100%',
|
|
2810
2870
|
height:'100%',
|
|
2811
|
-
position: 'absolute'
|
|
2871
|
+
position: 'absolute',
|
|
2872
|
+
left: 0
|
|
2873
|
+
|
|
2812
2874
|
} :{
|
|
2813
2875
|
'z-index': '0',
|
|
2814
2876
|
width:'100%',
|
|
2815
2877
|
height:'100%',
|
|
2816
|
-
position: 'absolute'
|
|
2878
|
+
position: 'absolute',
|
|
2879
|
+
left: 0
|
|
2817
2880
|
};
|
|
2818
2881
|
return (
|
|
2819
2882
|
<div className="all">
|
|
@@ -2867,11 +2930,11 @@ class Video extends Component {
|
|
|
2867
2930
|
<label className='labelClass'>{meetingInfo.title}</label>
|
|
2868
2931
|
</li>
|
|
2869
2932
|
<li>
|
|
2870
|
-
<span
|
|
2933
|
+
<span>客户:</span>
|
|
2871
2934
|
<label className='labelClass'>{meetingInfo.host}</label>
|
|
2872
2935
|
</li>
|
|
2873
2936
|
<li>
|
|
2874
|
-
<span
|
|
2937
|
+
<span>参会人:</span>
|
|
2875
2938
|
{customerNameList}
|
|
2876
2939
|
</li>
|
|
2877
2940
|
</ul>
|
|
@@ -276,7 +276,7 @@
|
|
|
276
276
|
// position: absolute;
|
|
277
277
|
// bottom: 0;
|
|
278
278
|
// left: 0;
|
|
279
|
-
transform: rotateY(180deg);
|
|
279
|
+
// transform: rotateY(180deg);
|
|
280
280
|
}
|
|
281
281
|
.cameraAnMicrophone{
|
|
282
282
|
margin: 10px 20px;
|
|
@@ -361,4 +361,53 @@
|
|
|
361
361
|
margin-bottom: 3px;
|
|
362
362
|
}
|
|
363
363
|
|
|
364
|
+
}
|
|
365
|
+
|
|
366
|
+
.radio {
|
|
367
|
+
position: relative;
|
|
368
|
+
display: inline-block;
|
|
369
|
+
font-weight: 400;
|
|
370
|
+
padding-left: 25px;
|
|
371
|
+
text-align: left;
|
|
372
|
+
width: 100%;
|
|
373
|
+
display: flex;
|
|
374
|
+
}
|
|
375
|
+
|
|
376
|
+
.radio input {
|
|
377
|
+
position: absolute;
|
|
378
|
+
left: -9999px;
|
|
379
|
+
}
|
|
380
|
+
|
|
381
|
+
.radio i {
|
|
382
|
+
display: block;
|
|
383
|
+
position: absolute;
|
|
384
|
+
top: 3px;
|
|
385
|
+
left: 2px;
|
|
386
|
+
width: 15px;
|
|
387
|
+
height: 15px;
|
|
388
|
+
outline: 0;
|
|
389
|
+
border: 1px solid rgb(133, 133, 133);
|
|
390
|
+
background: transparent;
|
|
391
|
+
border-radius: 50%;
|
|
392
|
+
transition: border-color .3s;
|
|
393
|
+
-webkit-transition: border-color .3s;
|
|
394
|
+
}
|
|
395
|
+
|
|
396
|
+
.radio input+i:after {
|
|
397
|
+
position: absolute;
|
|
398
|
+
content: '';
|
|
399
|
+
top: 1.5px;
|
|
400
|
+
left: 1.5px;
|
|
401
|
+
width: 10px;
|
|
402
|
+
height: 10px;
|
|
403
|
+
border-radius: 50%;
|
|
404
|
+
background-color: #269792;
|
|
405
|
+
border: 1px solid #269792;
|
|
406
|
+
opacity: 0;
|
|
407
|
+
transition: opacity .1s;
|
|
408
|
+
-webkit-transition: opacity .1s;
|
|
409
|
+
}
|
|
410
|
+
|
|
411
|
+
.radio input:checked+i:after {
|
|
412
|
+
opacity: 1;
|
|
364
413
|
}
|
package/packages/utils/cell.js
CHANGED
|
@@ -25,9 +25,9 @@ function callNimIM(method, json, callback) {
|
|
|
25
25
|
|
|
26
26
|
callbackRegister.set(callId, fn)
|
|
27
27
|
if (method == 'sendGroupMsg') {
|
|
28
|
-
sendMessage(json.groupId, (window.sessionStorage.getItem('
|
|
28
|
+
sendMessage(json.groupId, (JSON.parse(window.sessionStorage.getItem('sigData')).account + '@' + JSON.parse(window.sessionStorage.getItem('sigData')).hostname), 'groupchat', json.content)
|
|
29
29
|
} else if (method == 'sendCustomCmdMsg') {
|
|
30
|
-
sendMessage(json.customId, (window.sessionStorage.getItem('
|
|
30
|
+
sendMessage(json.customId, (JSON.parse(window.sessionStorage.getItem('sigData')).account + '@' + JSON.parse(window.sessionStorage.getItem('sigData')).hostname), 'groupchat', json.content)
|
|
31
31
|
} else if (method == 'transfer' || method == 'transferreject' || method == 'transferagree') {
|
|
32
32
|
// 发起转接或者邀请
|
|
33
33
|
json.event = 'IMVedio'
|
|
@@ -39,7 +39,7 @@ function callNimIM(method, json, callback) {
|
|
|
39
39
|
json.command = 'transfer_reject'
|
|
40
40
|
}
|
|
41
41
|
console.log('json', json)
|
|
42
|
-
sendMessage((json.distUserId + '@' + window.sessionStorage.getItem('
|
|
42
|
+
sendMessage((json.distUserId + '@' + JSON.parse(window.sessionStorage.getItem('sigData')).hostname), (JSON.parse(window.sessionStorage.getItem('sigData')).account + '@' + JSON.parse(window.sessionStorage.getItem('sigData')).hostname), 'chat', JSON.stringify(json))
|
|
43
43
|
}
|
|
44
44
|
// window.RemoteShellBridge.callNimIM(method, JSON.stringify(json), callId)
|
|
45
45
|
}
|
package/public/index.html
CHANGED
|
@@ -4,6 +4,12 @@
|
|
|
4
4
|
<meta charset="utf-8"/>
|
|
5
5
|
<link rel="shortcut icon" href="favicon.ico">
|
|
6
6
|
<meta content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport" />
|
|
7
|
+
<!-- // 强制Chromium内核,作用于360浏览器、QQ浏览器等国产双核浏览器: -->
|
|
8
|
+
<meta name="renderer" content="webkit"/>
|
|
9
|
+
<!-- // 强制Chromium内核,作用于其他双核浏览器: -->
|
|
10
|
+
<meta name="force-rendering" content="webkit"/>
|
|
11
|
+
<!-- // 如果有安装 Google Chrome Frame 插件则强制为Chromium内核,否则强制本机支持的最高版本IE内核,作用于IE浏览器: -->
|
|
12
|
+
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"/>
|
|
7
13
|
<!-- <script src="/mrtc1.4.7/lib/tfjs.js"></script>
|
|
8
14
|
<script src="./mrtc1.4.7/lib/pix.js"></script>
|
|
9
15
|
<script src="./mrtc1.4.7/lib/log4b.js"></script>
|