guzijian / wvp-GB28181-pro · Commits

Commit 038d360dd4f2dd3c06f5d97dc66ed13fd78de212

Authored by 648540858
2 parents 9c555b56 6d2291a5

Merge remote-tracking branch 'origin/rtc' into commercial 

# Conflicts:
#	web_src/src/components/dialog/devicePlayer.vue
Inline Side-by-side
Showing 1 changed file with 72 additions and 220 deletions
web_src/src/components/dialog/devicePlayer.vue
  View file @038d360
... ... @@ -3,23 +3,9 @@
3 3  
4 4 <el-dialog title="视频播放" top="0" :close-on-click-modal="false" :visible.sync="showVideoDialog" @close="close()">
5 5 <!-- <LivePlayer v-if="showVideoDialog" ref="videoPlayer" :videoUrl="videoUrl" :error="videoError" :message="videoError" :hasaudio="hasaudio" fluent autoplay live></LivePlayer> -->
6   - <div style="width: 100%; height: 100%">
7   - <el-tabs type="card" :stretch="true" v-model="activePlayer" @tab-click="changePlayer" v-if="Object.keys(this.player).length > 1">
8   - <el-tab-pane label="Jessibuca" name="jessibuca">
9   - <jessibucaPlayer v-if="activePlayer === 'jessibuca'" ref="jessibuca" :visible.sync="showVideoDialog" :videoUrl="videoUrl" :error="videoError" :message="videoError" height="100px" :hasAudio="hasAudio" fluent autoplay live ></jessibucaPlayer>
10   - </el-tab-pane>
11   - <el-tab-pane label="WebRTC" name="webRTC">
12   - <rtc-player v-if="activePlayer === 'webRTC'" ref="webRTC" :visible.sync="showVideoDialog" :videoUrl="videoUrl" :error="videoError" :message="videoError" height="100px" :hasAudio="hasAudio" fluent autoplay live ></rtc-player>
13   - </el-tab-pane>
14   - <el-tab-pane label="h265web">h265web敬请期待</el-tab-pane>
15   - <el-tab-pane label="wsPlayer">wsPlayer 敬请期待</el-tab-pane>
16   - </el-tabs>
17   - <jessibucaPlayer v-if="Object.keys(this.player).length == 1 && this.player.jessibuca" ref="jessibuca" :visible.sync="showVideoDialog" :videoUrl="videoUrl" :error="videoError" :message="videoError" height="100px" :hasAudio="hasAudio" fluent autoplay live ></jessibucaPlayer>
18   - <rtc-player v-if="Object.keys(this.player).length == 1 && this.player.webRTC" ref="jessibuca" :visible.sync="showVideoDialog" :videoUrl="videoUrl" :error="videoError" :message="videoError" height="100px" :hasAudio="hasAudio" fluent autoplay live ></rtc-player>
19   -
20   - </div>
  6 + <player ref="videoPlayer" :visible.sync="showVideoDialog" :videoUrl="videoUrl" :error="videoError" :message="videoError" :height="false" :hasAudio="hasAudio" fluent autoplay live ></player>
21 7 <div id="shared" style="text-align: right; margin-top: 1rem;">
22   - <el-tabs v-model="tabActiveName" @tab-click="tabHandleClick" >
  8 + <el-tabs v-model="tabActiveName" @tab-click="tabHandleClick">
23 9 <el-tab-pane label="实时视频" name="media">
24 10 <div style="margin-bottom: 0.5rem;">
25 11 <!-- <el-button type="primary" size="small" @click="playRecord(true, '')">播放</el-button>-->
... ... @@ -45,100 +31,10 @@
45 31 <div style="display: flex; margin-bottom: 0.5rem; height: 2.5rem;">
46 32 <span style="width: 5rem; line-height: 2.5rem; text-align: right;">资源地址：</span>
47 33 <el-input v-model="getPlayerShared.sharedRtmp" :disabled="true" >
48   - <el-button slot="append" icon="el-icon-document-copy" title="点击拷贝" v-clipboard="getPlayerShared.sharedRtmp" @success="$message({type:'success', message:'成功拷贝到粘贴板'})"></el-button>
49   - <el-dropdown slot="prepend" v-if="streamInfo" trigger="click" @command="copyUrl">
50   - <el-button >
51   - 更多地址<i class="el-icon-arrow-down el-icon--right"></i>
52   - </el-button>
53   - <el-dropdown-menu slot="dropdown" >
54   - <el-dropdown-item :command="streamInfo.flv">
55   - <el-tag >FLV:</el-tag>
56   - <span>{{ streamInfo.flv }}</span>
57   - </el-dropdown-item>
58   - <el-dropdown-item :command="streamInfo.https_flv">
59   - <el-tag >FLV(https):</el-tag>
60   - <span>{{ streamInfo.https_flv }}</span>
61   - </el-dropdown-item>
62   - <el-dropdown-item :command="streamInfo.ws_flv">
63   - <el-tag >FLV(ws):</el-tag>
64   - <span >{{ streamInfo.ws_flv }}</span>
65   - </el-dropdown-item>
66   - <el-dropdown-item :command="streamInfo.wss_flv">
67   - <el-tag >FLV(wss):</el-tag>
68   - <span>{{ streamInfo.wss_flv }}</span>
69   - </el-dropdown-item>
70   - <el-dropdown-item :command="streamInfo.fmp4">
71   - <el-tag >FMP4:</el-tag>
72   - <span>{{ streamInfo.fmp4 }}</span>
73   - </el-dropdown-item>
74   - <el-dropdown-item :command="streamInfo.https_fmp4">
75   - <el-tag >FMP4(https):</el-tag>
76   - <span>{{ streamInfo.https_fmp4 }}</span>
77   - </el-dropdown-item>
78   - <el-dropdown-item :command="streamInfo.ws_fmp4">
79   - <el-tag >FMP4(ws):</el-tag>
80   - <span>{{ streamInfo.ws_fmp4 }}</span>
81   - </el-dropdown-item>
82   - <el-dropdown-item :command="streamInfo.wss_fmp4">
83   - <el-tag >FMP4(wss):</el-tag>
84   - <span>{{ streamInfo.wss_fmp4 }}</span>
85   - </el-dropdown-item>
86   - <el-dropdown-item :command="streamInfo.hls">
87   - <el-tag>HLS:</el-tag>
88   - <span>{{ streamInfo.hls }}</span>
89   - </el-dropdown-item>
90   - <el-dropdown-item :command="streamInfo.https_hls">
91   - <el-tag >HLS(https):</el-tag>
92   - <span>{{ streamInfo.https_hls }}</span>
93   - </el-dropdown-item>
94   - <el-dropdown-item :command="streamInfo.ws_hls">
95   - <el-tag >HLS(ws):</el-tag>
96   - <span>{{ streamInfo.ws_hls }}</span>
97   - </el-dropdown-item>
98   - <el-dropdown-item :command="streamInfo.wss_hls">
99   - <el-tag >HLS(wss):</el-tag>
100   - <span>{{ streamInfo.wss_hls }}</span>
101   - </el-dropdown-item>
102   - <el-dropdown-item :command="streamInfo.ts">
103   - <el-tag>TS:</el-tag>
104   - <span>{{ streamInfo.ts }}</span>
105   - </el-dropdown-item>
106   - <el-dropdown-item :command="streamInfo.https_ts">
107   - <el-tag>TS(https):</el-tag>
108   - <span>{{ streamInfo.https_ts }}</span>
109   - </el-dropdown-item>
110   - <el-dropdown-item :command="streamInfo.ws_ts">
111   - <el-tag>TS(ws):</el-tag>
112   - <span>{{ streamInfo.ws_ts }}</span>
113   - </el-dropdown-item>
114   - <el-dropdown-item :command="streamInfo.wss_ts">
115   - <el-tag>TS(wss):</el-tag>
116   - <span>{{ streamInfo.wss_ts }}</span>
117   - </el-dropdown-item>
118   - <el-dropdown-item :command="streamInfo.rtc">
119   - <el-tag >RTC:</el-tag>
120   - <span>{{ streamInfo.rtc }}</span>
121   - </el-dropdown-item>
122   - <el-dropdown-item :command="streamInfo.rtmp">
123   - <el-tag >RTMP:</el-tag>
124   - <span>{{ streamInfo.rtmp }}</span>
125   - </el-dropdown-item>
126   - <el-dropdown-item :command="streamInfo.rtmps">
127   - <el-tag >RTMPS:</el-tag>
128   - <span>{{ streamInfo.rtmps }}</span>
129   - </el-dropdown-item>
130   - <el-dropdown-item :command="streamInfo.rtsp">
131   - <el-tag >RTSP:</el-tag>
132   - <span>{{ streamInfo.rtsp }}</span>
133   - </el-dropdown-item>
134   - <el-dropdown-item :command="streamInfo.rtsps">
135   - <el-tag >RTSPS:</el-tag>
136   - <span>{{ streamInfo.rtsps }}</span>
137   - </el-dropdown-item>
138   - </el-dropdown-menu>
139   - </el-dropdown>
  34 + <template slot="append">
  35 + <i class="cpoy-btn el-icon-document-copy" title="点击拷贝" v-clipboard="getPlayerShared.sharedRtmp" @success="$message({type:'success', message:'成功拷贝到粘贴板'})"></i>
  36 + </template>
140 37 </el-input>
141   -
142 38 </div>
143 39 </el-tab-pane>
144 40 <!--{"code":0,"data":{"paths":["22-29-30.mp4"],"rootPath":"/home/kkkkk/Documents/ZLMediaKit/release/linux/Debug/www/record/hls/kkkkk/2020-05-11/"}}-->
... ... @@ -219,27 +115,27 @@
219 115  
220 116 <div class="control-panel">
221 117 <el-button-group>
222   - <el-tag style="position :absolute; left: 0rem; top: 0rem; width: 5rem; text-align: center" size="medium">预置位编号</el-tag>
  118 + <el-tag style="position :absolute; left: 0rem; top: 0rem; width: 5rem; text-align: center" size="medium" type="info">预置位编号</el-tag>
223 119 <el-input-number style="position: absolute; left: 5rem; top: 0rem; width: 6rem" size="mini" v-model="presetPos" controls-position="right" :precision="0" :step="1" :min="1" :max="255"></el-input-number>
224 120 <el-button style="position: absolute; left: 11rem; top: 0rem; width: 5rem" size="mini" icon="el-icon-add-location" @click="presetPosition(129, presetPos)">设置</el-button>
225 121 <el-button style="position: absolute; left: 27rem; top: 0rem; width: 5rem" size="mini" type="primary" icon="el-icon-place" @click="presetPosition(130, presetPos)">调用</el-button>
226 122 <el-button style="position: absolute; left: 16rem; top: 0rem; width: 5rem" size="mini" icon="el-icon-delete-location" @click="presetPosition(131, presetPos)">删除</el-button>
227   - <el-tag style="position :absolute; left: 0rem; top: 2.5rem; width: 5rem; text-align: center" size="medium">巡航速度</el-tag>
  123 + <el-tag style="position :absolute; left: 0rem; top: 2.5rem; width: 5rem; text-align: center" size="medium" type="info">巡航速度</el-tag>
228 124 <el-input-number style="position: absolute; left: 5rem; top: 2.5rem; width: 6rem" size="mini" v-model="cruisingSpeed" controls-position="right" :precision="0" :min="1" :max="4095"></el-input-number>
229 125 <el-button style="position: absolute; left: 11rem; top: 2.5rem; width: 5rem" size="mini" icon="el-icon-loading" @click="setSpeedOrTime(134, cruisingGroup, cruisingSpeed)">设置</el-button>
230   - <el-tag style="position :absolute; left: 16rem; top: 2.5rem; width: 5rem; text-align: center" size="medium">停留时间</el-tag>
  126 + <el-tag style="position :absolute; left: 16rem; top: 2.5rem; width: 5rem; text-align: center" size="medium" type="info">停留时间</el-tag>
231 127 <el-input-number style="position: absolute; left: 21rem; top: 2.5rem; width: 6rem" size="mini" v-model="cruisingTime" controls-position="right" :precision="0" :min="1" :max="4095"></el-input-number>
232 128 <el-button style="position: absolute; left: 27rem; top: 2.5rem; width: 5rem" size="mini" icon="el-icon-timer" @click="setSpeedOrTime(135, cruisingGroup, cruisingTime)">设置</el-button>
233   - <el-tag style="position :absolute; left: 0rem; top: 4.5rem; width: 5rem; text-align: center" size="medium">巡航组编号</el-tag>
  129 + <el-tag style="position :absolute; left: 0rem; top: 4.5rem; width: 5rem; text-align: center" size="medium" type="info">巡航组编号</el-tag>
234 130 <el-input-number style="position: absolute; left: 5rem; top: 4.5rem; width: 6rem" size="mini" v-model="cruisingGroup" controls-position="right" :precision="0" :min="0" :max="255"></el-input-number>
235 131 <el-button style="position: absolute; left: 11rem; top: 4.5rem; width: 5rem" size="mini" icon="el-icon-add-location" @click="setCommand(132, cruisingGroup, presetPos)">添加点</el-button>
236 132 <el-button style="position: absolute; left: 16rem; top: 4.5rem; width: 5rem" size="mini" icon="el-icon-delete-location" @click="setCommand(133, cruisingGroup, presetPos)">删除点</el-button>
237 133 <el-button style="position: absolute; left: 21rem; top: 4.5rem; width: 5rem" size="mini" icon="el-icon-delete" @click="setCommand(133, cruisingGroup, 0)">删除组</el-button>
238 134 <el-button style="position: absolute; left: 27rem; top: 5rem; width: 5rem" size="mini" type="primary" icon="el-icon-video-camera-solid" @click="setCommand(136, cruisingGroup, 0)">巡航</el-button>
239   - <el-tag style="position :absolute; left: 0rem; top: 7rem; width: 5rem; text-align: center" size="medium">扫描速度</el-tag>
  135 + <el-tag style="position :absolute; left: 0rem; top: 7rem; width: 5rem; text-align: center" size="medium" type="info">扫描速度</el-tag>
240 136 <el-input-number style="position: absolute; left: 5rem; top: 7rem; width: 6rem" size="mini" v-model="scanSpeed" controls-position="right" :precision="0" :min="1" :max="4095"></el-input-number>
241 137 <el-button style="position: absolute; left: 11rem; top: 7rem; width: 5rem" size="mini" icon="el-icon-loading" @click="setSpeedOrTime(138, scanGroup, scanSpeed)">设置</el-button>
242   - <el-tag style="position :absolute; left: 0rem; top: 9rem; width: 5rem; text-align: center" size="medium">扫描组编号</el-tag>
  138 + <el-tag style="position :absolute; left: 0rem; top: 9rem; width: 5rem; text-align: center" size="medium" type="info">扫描组编号</el-tag>
243 139 <el-input-number style="position: absolute; left: 5rem; top: 9rem; width: 6rem" size="mini" v-model="scanGroup" controls-position="right" :precision="0" :step="1" :min="0" :max="255"></el-input-number>
244 140 <el-button style="position: absolute; left: 11rem; top: 9rem; width: 5rem" size="mini" icon="el-icon-d-arrow-left" @click="setCommand(137, scanGroup, 1)">左边界</el-button>
245 141 <el-button style="position: absolute; left: 16rem; top: 9rem; width: 5rem" size="mini" icon="el-icon-d-arrow-right" @click="setCommand(137, scanGroup, 2)">右边界</el-button>
... ... @@ -276,28 +172,26 @@
276 172 </div>
277 173  
278 174 </el-tab-pane>
279   -
280 175 </el-tabs>
281 176 </div>
282 177 </el-dialog>
283   - <recordDownload ref="recordDownload"></recordDownload>
284 178 </div>
285 179 </template>
286 180  
287 181 <script>
288   -import rtcPlayer from '../dialog/rtcPlayer.vue'
  182 +import player from '../dialog/rtcPlayer.vue'
289 183 // import LivePlayer from '@liveqing/liveplayer'
290 184 // import player from '../dialog/easyPlayer.vue'
291   -import jessibucaPlayer from '../common/jessibuca.vue'
292   -import recordDownload from '../dialog/recordDownload.vue'
  185 +// import player from '../dialog/jessibuca.vue'
293 186 export default {
294 187 name: 'devicePlayer',
295 188 props: {},
296 189 components: {
297   - jessibucaPlayer, rtcPlayer, recordDownload,
  190 + player,
298 191 },
299 192 computed: {
300 193 getPlayerShared: function () {
  194 +
301 195 return {
302 196 sharedUrl: window.location.origin + '/#/play/wasm/' + encodeURIComponent(this.videoUrl),
303 197 sharedIframe: '<iframe src="' + window.location.origin + '/#/play/wasm/' + encodeURIComponent(this.videoUrl) + '"></iframe>',
... ... @@ -305,22 +199,11 @@ export default {
305 199 };
306 200 }
307 201 },
308   - created() {
309   - console.log(this.player)
310   - if (Object.keys(this.player).length === 1) {
311   - this.activePlayer = Object.keys(this.player)[0]
312   - }
313   - },
  202 + created() {},
314 203 data() {
315 204 return {
316 205 video: 'http://lndxyj.iqilu.com/public/upload/2019/10/14/8c001ea0c09cdc59a57829dabc8010fa.mp4',
317 206 videoUrl: '',
318   - activePlayer: "jessibuca",
319   - // 如何你只是用一种播放器，直接注释掉不用的部分即可
320   - player: {
321   - jessibuca : ["ws_flv", "wss_flv"],
322   - webRTC: ["rtc", "rtc"],
323   - },
324 207 videoHistory: {
325 208 date: '',
326 209 searchHistoryResult: [] //媒体流历史记录搜索结果
... ... @@ -358,7 +241,6 @@ export default {
358 241 seekTime: 0,
359 242 recordStartTime: 0,
360 243 showTimeText: "00:00:00",
361   - streamInfo: null,
362 244 };
363 245 },
364 246 methods: {
... ... @@ -368,7 +250,7 @@ export default {
368 250 that.tracks = [];
369 251 that.tracksLoading = true;
370 252 that.tracksNotLoaded = false;
371   - if (tab.name === "codec") {
  253 + if (tab.name == "codec") {
372 254 this.$axios({
373 255 method: 'get',
374 256 url: '/zlm/' +this.mediaServerId+ '/index/api/getMediaInfo?vhost=__defaultVhost__&schema=rtmp&app='+ this.app +'&stream='+ this.streamId
... ... @@ -387,12 +269,6 @@ export default {
387 269 }).catch(function (e) {});
388 270 }
389 271 },
390   - changePlayer: function (tab) {
391   - console.log(this.player[tab.name][0])
392   - this.activePlayer = tab.name;
393   - this.videoUrl = this.streamInfo[this.player[tab.name][0]]
394   - console.log(this.videoUrl)
395   - },
396 272 openDialog: function (tab, deviceId, channelId, param) {
397 273 this.tabActiveName = tab;
398 274 this.channelId = channelId;
... ... @@ -401,8 +277,8 @@ export default {
401 277 this.mediaServerId = "";
402 278 this.app = "";
403 279 this.videoUrl = ""
404   - if (!!this.$refs[this.activePlayer]) {
405   - this.$refs[this.activePlayer].pause();
  280 + if (!!this.$refs.videoPlayer) {
  281 + this.$refs.videoPlayer.pause();
406 282 }
407 283 switch (tab) {
408 284 case "media":
... ... @@ -427,32 +303,44 @@ export default {
427 303 console.log(val)
428 304 },
429 305 play: function (streamInfo, hasAudio) {
430   - this.streamInfo = streamInfo;
431 306 this.hasAudio = hasAudio;
432 307 this.isLoging = false;
433   - // this.videoUrl = streamInfo.rtc;
434   - this.videoUrl = this.getUrlByStreamInfo();
435   - this.streamId = streamInfo.stream;
  308 + this.videoUrl = streamInfo.rtc;
  309 + // this.videoUrl = this.getUrlByStreamInfo(streamInfo);
  310 + this.streamId = streamInfo.streamId;
436 311 this.app = streamInfo.app;
437 312 this.mediaServerId = streamInfo.mediaServerId;
438 313 this.playFromStreamInfo(false, streamInfo)
439 314 },
440   - getUrlByStreamInfo(){
  315 + getUrlByStreamInfo(streamInfo){
  316 + let baseZlmApi = process.env.NODE_ENV === 'development'?`${location.host}/debug/zlm`:`${location.host}/zlm`
  317 + // return `${baseZlmApi}/${streamInfo.app}/${streamInfo.streamId}.flv`;
  318 + // return `http://${baseZlmApi}/${streamInfo.app}/${streamInfo.streamId}.flv`;
441 319 if (location.protocol === "https:") {
442   - this.videoUrl = this.streamInfo[this.player[this.activePlayer][1]]
  320 + if (streamInfo.wss_flv === null) {
  321 + console.error("媒体服务器未配置ssl端口, 使用http端口")
  322 + // this.$message({
  323 + // showClose: true,
  324 + // message: '媒体服务器未配置ssl端口, ',
  325 + // type: 'error'
  326 + // });
  327 + return streamInfo.ws_flv
  328 + }else {
  329 + return streamInfo.wss_flv;
  330 + }
  331 +
443 332 }else {
444   - this.videoUrl = this.streamInfo[this.player[this.activePlayer][0]]
  333 + return streamInfo.ws_flv;
445 334 }
446   - return this.videoUrl;
447 335  
448 336 },
449 337 coverPlay: function () {
450 338 var that = this;
451 339 this.coverPlaying = true;
452   - this.$refs[this.activePlayer].pause()
  340 + this.$refs.videoPlayer.pause()
453 341 that.$axios({
454 342 method: 'post',
455   - url: '/api/gb_record/convert/' + that.streamId
  343 + url: '/api/play/convert/' + that.streamId
456 344 }).then(function (res) {
457 345 if (res.data.code == 0) {
458 346 that.convertKey = res.data.key;
... ... @@ -481,7 +369,7 @@ export default {
481 369 },
482 370 convertStopClick: function() {
483 371 this.convertStop(()=>{
484   - this.$refs[this.activePlayer].play(this.videoUrl)
  372 + this.$refs.videoPlayer.play(this.videoUrl)
485 373 });
486 374 },
487 375 convertStop: function(callback) {
... ... @@ -506,12 +394,12 @@ export default {
506 394 playFromStreamInfo: function (realHasAudio, streamInfo) {
507 395 this.showVideoDialog = true;
508 396 this.hasaudio = realHasAudio && this.hasaudio;
509   - this.$refs[this.activePlayer].play(this.getUrlByStreamInfo(streamInfo))
  397 + this.$refs.videoPlayer.play(this.getUrlByStreamInfo(streamInfo))
510 398 },
511 399 close: function () {
512 400 console.log('关闭视频');
513   - if (!!this.$refs[this.activePlayer]){
514   - this.$refs[this.activePlayer].pause();
  401 + if (!!this.$refs.videoPlayer){
  402 + this.$refs.videoPlayer.pause();
515 403 }
516 404 this.videoUrl = '';
517 405 this.coverPlaying = false;
... ... @@ -562,19 +450,9 @@ export default {
562 450 method: 'get',
563 451 url: '/api/gb_record/query/' + this.deviceId + '/' + this.channelId + '?startTime=' + startTime + '&endTime=' + endTime
564 452 }).then(function (res) {
565   - console.log(res)
566   - if(res.data.code === 0) {
567   - // 处理时间信息
568   - that.videoHistory.searchHistoryResult = res.data.data.recordList;
569   - that.recordsLoading = false;
570   - }else {
571   - this.$message({
572   - showClose: true,
573   - message: res.data.msg,
574   - type: "error",
575   - });
576   - }
577   -
  453 + // 处理时间信息
  454 + that.videoHistory.searchHistoryResult = res.data.recordList;
  455 + that.recordsLoading = false;
578 456 }).catch(function (e) {
579 457 console.log(e.message);
580 458 // that.videoHistory.searchHistoryResult = falsificationData.recordData;
... ... @@ -596,8 +474,8 @@ export default {
596 474 console.log(this.seekTime)
597 475 if (that.streamId != "") {
598 476 that.stopPlayRecord(function () {
599   - that.streamId = "";
600   - that.playRecord(row);
  477 + that.streamId = "",
  478 + that.playRecord(row);
601 479 })
602 480 } else {
603 481 this.$axios({
... ... @@ -607,20 +485,19 @@ export default {
607 485 }).then(function (res) {
608 486 var streamInfo = res.data;
609 487 that.app = streamInfo.app;
610   - that.streamId = streamInfo.stream;
  488 + that.streamId = streamInfo.streamId;
611 489 that.mediaServerId = streamInfo.mediaServerId;
612   - that.ssrc = streamInfo.ssrc;
613 490 that.videoUrl = that.getUrlByStreamInfo(streamInfo);
614 491 that.recordPlay = true;
615 492 });
616 493 }
617 494 },
618 495 stopPlayRecord: function (callback) {
619   - this.$refs[this.activePlayer].pause();
  496 + this.$refs.videoPlayer.pause();
620 497 this.videoUrl = '';
621 498 this.$axios({
622 499 method: 'get',
623   - url: '/api/playback/stop/' + this.deviceId + "/" + this.channelId + "/" + this.streamId
  500 + url: '/api/playback/stop/' + this.deviceId + "/" + this.channelId
624 501 }).then(function (res) {
625 502 if (callback) callback()
626 503 });
... ... @@ -628,47 +505,33 @@ export default {
628 505 downloadRecord: function (row) {
629 506 let that = this;
630 507 if (that.streamId != "") {
631   - that.stopDownloadRecord(function (res) {
632   - if (res.code == 0) {
633   - that.streamId = "";
634   - that.downloadRecord(row);
635   - }else {
636   - this.$message({
637   - showClose: true,
638   - message: res.data.msg,
639   - type: "error",
640   - });
641   - }
642   -
  508 + that.stopDownloadRecord(function () {
  509 + that.streamId = "",
  510 + that.downloadRecord(row);
643 511 })
644 512 } else {
645 513 this.$axios({
646 514 method: 'get',
647   - url: '/api/gb_record/download/start/' + this.deviceId + '/' + this.channelId + '?startTime=' + row.startTime + '&endTime=' +
  515 + url: '/api/download/start/' + this.deviceId + '/' + this.channelId + '?startTime=' + row.startTime + '&endTime=' +
648 516 row.endTime + '&downloadSpeed=4'
649 517 }).then(function (res) {
650   - if (res.data.code == 0) {
651   - let streamInfo = res.data.data;
652   - that.recordPlay = false;
653   - that.$refs.recordDownload.openDialog(that.deviceId, that.channelId, streamInfo.app, streamInfo.stream, streamInfo.mediaServerId);
654   - }else {
655   - that.$message({
656   - showClose: true,
657   - message: res.data.msg,
658   - type: "error",
659   - });
660   - }
  518 + var streamInfo = res.data;
  519 + that.app = streamInfo.app;
  520 + that.streamId = streamInfo.streamId;
  521 + that.mediaServerId = streamInfo.mediaServerId;
  522 + that.videoUrl = that.getUrlByStreamInfo(streamInfo);
  523 + that.recordPlay = true;
661 524 });
662 525 }
663 526 },
664 527 stopDownloadRecord: function (callback) {
665   - this.$refs[this.activePlayer].pause();
  528 + this.$refs.videoPlayer.pause();
666 529 this.videoUrl = '';
667 530 this.$axios({
668 531 method: 'get',
669   - url: '/api/gb_record/download/stop/' + this.deviceId + "/" + this.channelId+ "/" + this.streamId
670   - }).then((res)=> {
671   - if (callback) callback(res)
  532 + url: '/api/download/stop/' + this.deviceId + "/" + this.channelId
  533 + }).then(function (res) {
  534 + if (callback) callback()
672 535 });
673 536 },
674 537 ptzCamera: function (command) {
... ... @@ -676,6 +539,8 @@ export default {
676 539 let that = this;
677 540 this.$axios({
678 541 method: 'post',
  542 + // url: '/api/ptz/' + this.deviceId + '/' + this.channelId + '?leftRight=' + leftRight + '&upDown=' + upDown +
  543 + // '&inOut=' + zoom + '&moveSpeed=50&zoomSpeed=50'
679 544 url: '/api/ptz/control/' + this.deviceId + '/' + this.channelId + '?command=' + command + '&horizonSpeed=' + this.controSpeed + '&verticalSpeed=' + this.controSpeed + '&zoomSpeed=' + this.controSpeed
680 545 }).then(function (res) {});
681 546 },
... ... @@ -755,21 +620,13 @@ export default {
755 620 console.log(resultArray)
756 621 return resultArray;
757 622 },
758   - copyUrl: function (dropdownItem){
759   - console.log(dropdownItem)
760   - this.$copyText(dropdownItem).then((e)=> {
761   - this.$message.success("成功拷贝到粘贴板");
762   - }, (e)=> {
763   -
764   - })
765   - },
766 623 gbPlay(){
767 624 console.log('前端控制：播放');
768 625 this.$axios({
769 626 method: 'get',
770 627 url: '/api/playback/resume/' + this.streamId
771 628 }).then((res)=> {
772   - this.$refs[this.activePlayer].play(this.videoUrl)
  629 + this.$refs.videoPlayer.play(this.videoUrl)
773 630 });
774 631 },
775 632 gbPause(){
... ... @@ -798,13 +655,8 @@ export default {
798 655 this.$axios({
799 656 method: 'get',
800 657 url: `/api/playback/seek/${this.streamId }/` + Math.floor(this.seekTime * val / 100000)
801   - }).then( (res)=> {
802   - setTimeout(()=>{
803   - this.$refs[this.activePlayer].play(this.videoUrl)
804   - }, 600)
805   - });
806   - },
807   -
  658 + }).then(function (res) {});
  659 + }
808 660  
809 661 }
810 662 };
... ...