1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
| <template>
| <view class="main">
| <view ref="player"
| class="Dplayer"
| id="dplayer">
| <video :src="videoUrl"
| @fullscreenchange="fullScreen"
| :autoplay='true'></video>
| </view>
| </view>
| </template>
| <script>
| export default {
| onLoad(params) {
| this.eqCode = params.eqCode || ''
| this.useEqCodeGetCameraUrl()
| },
| onReady() {
| this.videoContext = uni.createVideoContext('dplayer')
| },
| data() {
| return {
| eqCode: '',
| videoUrl: ''
| }
| },
| methods: {
| useEqCodeGetCameraUrl() {
| this.$reqGet('useEqCodeGetCameraUrl', { eqCode: this.eqCode }).then(res => {
| console.log(res);
| if (res.code == 0) {
| this.videoUrl = res.data.url.replace('192.168.1.87:83', 'mx.jzeg.cn:5211')
| } else {
| this.$u.toast(res.msg ? res.msg : '加载失败');
| }
| })
| },
| fullScreen(e) {
| let lastFullscreen = false;
| const isFullscreen = e.detail.fullScreen
| if (isFullscreen !== lastFullscreen && lastFullscreen == true) {
| // 状态改变,执行处理逻辑
| if (!isFullscreen) {
| lastFullscreen = false;
| this.videoContext.requestFullScreen();
| } else {
| lastFullscreen = true;
| this.videoContext.exitFullScreen();
| }
| }
| }
| },
| }
| </script>
|
| <style lang="scss"
| scoped>
| .main {
| width: 100%;
| height: 100%;
| display: flex;
| justify-content: center;
|
| .Dplayer {
| width: 96%;
| height: vww(300);
|
| video {
| width: 100%;
| height: 100%;
| }
| }
| }
| </style>
|
|
