From 5fab97cf7e49636d446e063ee6e0eea80c124bd2 Mon Sep 17 00:00:00 2001
From: 648540858 <648540858@qq.com>
Date: 星期三, 15 三月 2023 19:05:56 +0800
Subject: [PATCH] 支持不同域的前后端分离部署
---
web_src/src/components/GBRecordDetail.vue | 76 +++++++++++++++++++++++--------------
1 files changed, 47 insertions(+), 29 deletions(-)
diff --git a/web_src/src/components/GBRecordDetail.vue b/web_src/src/components/GBRecordDetail.vue
index feb2443..6fe29a8 100644
--- a/web_src/src/components/GBRecordDetail.vue
+++ b/web_src/src/components/GBRecordDetail.vue
@@ -42,9 +42,24 @@
<div class="player-option-box">
<div>
<el-button-group >
+ <el-time-picker
+ size="mini"
+ is-range
+ align="left"
+ v-model="timeRange"
+ value-format="yyyy-MM-dd HH:mm:ss"
+ range-separator="鑷�"
+ start-placeholder="寮�濮嬫椂闂�"
+ end-placeholder="缁撴潫鏃堕棿"
+ @change="timePickerChange"
+ placeholder="閫夋嫨鏃堕棿鑼冨洿">
+ </el-time-picker>
+ </el-button-group>
+
+ <el-button-group >
<el-button size="mini" class="iconfont icon-zanting" title="寮�濮�" @click="gbPause()"></el-button>
<el-button size="mini" class="iconfont icon-kaishi" title="鏆傚仠" @click="gbPlay()"></el-button>
- <el-dropdown size="mini" title="鎾斁鍊嶉��" style="margin-left: 1px;" @command="gbScale">
+ <el-dropdown size="mini" title="鎾斁鍊嶉��" @command="gbScale">
<el-button size="mini">
鍊嶉�� <i class="el-icon-arrow-down el-icon--right"></i>
</el-button>
@@ -74,7 +89,7 @@
:marks="playTimeSliderMarks">
</el-slider>
<div class="slider-val-box">
- <div class="slider-val" v-for="item of detailFiles" :style="'width:' + getDataWidth(item) + '%; left:' + getDataLeft(item) + '%'"></div>
+ <div class="slider-val" v-for="item of detailFiles" :style="'width:' + getDataWidth(item) + '%; left:' + getDataLeft(item) + '%'"></div>
</div>
</div>
@@ -100,9 +115,6 @@
deviceId: this.$route.params.deviceId,
channelId: this.$route.params.channelId,
recordsLoading: false,
- sliderTime: 0,
- seekTime: 0,
- recordStartTime: 0,
streamId: "",
hasAudio: false,
detailFiles: [],
@@ -129,7 +141,10 @@
"height": this.winHeight + "px",
},
winHeight: window.innerHeight - 240,
- playTime: 0,
+ playTime: null,
+ timeRange: null,
+ startTime: null,
+ endTime: null,
playTimeSliderMarks: {
0: "00:00",
3600: "01:00",
@@ -176,13 +191,13 @@
if (!this.chooseDate) {
return;
}
+
+ this.setTime(this.chooseDate + " 00:00:00", this.chooseDate + " 23:59:59");
this.recordsLoading = true;
this.detailFiles = [];
- let startTime = this.chooseDate + " 00:00:00";
- let endTime = this.chooseDate + " 23:59:59";
this.$axios({
method: 'get',
- url: '/api/gb_record/query/' + this.deviceId + '/' + this.channelId + '?startTime=' + startTime + '&endTime=' + endTime
+ url: '/api/gb_record/query/' + this.deviceId + '/' + this.channelId + '?startTime=' + this.startTime + '&endTime=' + this.endTime
}).then((res)=>{
this.recordsLoading = false;
if(res.data.code === 0) {
@@ -205,33 +220,37 @@
moment: function (v) {
return moment(v)
},
+ setTime: function (startTime, endTime){
+ this.startTime = startTime;
+ this.endTime = endTime;
+ let start = (new Date(this.startTime).getTime() - new Date(this.chooseDate + " 00:00:00").getTime())/1000;
+ let end = (new Date(this.endTime).getTime() - new Date(this.chooseDate + " 00:00:00").getTime())/1000;
+ console.log(start)
+ console.log(end)
+ this.playTime = [start, end];
+ this.timeRange = [startTime, endTime];
+ },
videoError: function (e) {
console.log("鎾斁鍣ㄩ敊璇細" + JSON.stringify(e));
},
checkedFile(file){
this.chooseFile = file;
+ this.setTime(file.startTime, file.endTime);
// 寮�濮嬪洖鏀�
- this.playRecord(file)
-
+ this.playRecord()
},
- playRecord: function (row) {
+ playRecord: function () {
- let startTime = row.startTime
- this.recordStartTime = row.startTime
- this.showTimeText = row.startTime.split(" ")[1]
- let endTime = row.endTime
- this.sliderTime = 0;
- this.seekTime = new Date(endTime).getTime() - new Date(startTime).getTime();
if (this.streamId !== "") {
this.stopPlayRecord(()=> {
this.streamId = "";
- this.playRecord(row);
+ this.playRecord();
})
} else {
this.$axios({
method: 'get',
- url: '/api/playback/start/' + this.deviceId + '/' + this.channelId + '?startTime=' + startTime + '&endTime=' +
- endTime
+ url: '/api/playback/start/' + this.deviceId + '/' + this.channelId + '?startTime=' + this.startTime + '&endTime=' +
+ this.endTime
}).then((res)=> {
if (res.data.code === 0) {
this.streamInfo = res.data.data;
@@ -256,7 +275,7 @@
method: 'get',
url: '/api/playback/resume/' + this.streamId
}).then((res)=> {
- this.$refs[this.activePlayer].play(this.videoUrl)
+ this.$refs["recordVideoPlayer"].play(this.videoUrl)
});
},
gbPause(){
@@ -347,19 +366,18 @@
return this.videoUrl;
},
+ timePickerChange: function (val){
+ this.setTime(val[0], val[1])
+ },
playTimeChange(val){
console.log(val)
- let maxTime = this.getTimeForFile(this.detailFiles[this.detailFiles.length - 1])[1];
let startTimeStr = moment(new Date(this.chooseDate + " 00:00:00").getTime() + val[0]*1000).format("YYYY-MM-DD HH:mm:ss");
let endTimeStr = moment(new Date(this.chooseDate + " 00:00:00").getTime() + val[1]*1000).format("YYYY-MM-DD HH:mm:ss");
- console.log(startTimeStr);
- console.log(endTimeStr);
- this.checkedFile({
- startTime: startTimeStr,
- endTime: endTimeStr,
- });
+ this.setTime(startTimeStr, endTimeStr)
+
+ this.playRecord();
},
setSliderFit() {
if (this.sliderMIn === 0 && this.sliderMax === 86400) {
--
Gitblit v1.8.0