From 1af0c937466d8f8df26aaddd72dbd702dd0f3033 Mon Sep 17 00:00:00 2001
From: hanbaoshan <hanbaoshan@aiotlink.com>
Date: 星期二, 19 一月 2021 15:59:52 +0800
Subject: [PATCH] 轨迹图查询方法更新,朔黄添加首页
---
src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue | 98 ++++++++++++++++++++++++++++++++-----------------
1 files changed, 64 insertions(+), 34 deletions(-)
diff --git a/src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue b/src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue
index e18d1f2..2006669 100644
--- a/src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue
+++ b/src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue
@@ -151,19 +151,19 @@
</div>
<div class="video-info">
<div class="base-info">
- <div>
+ <div class="flex-box">
<label>杞﹀彿:</label>
<span>{{data.CarNumber}}</span>
</div>
- <div>
+ <div class="flex-box">
<label>杞︽:</label>
<span>{{data.TrainNumber}}</span>
</div>
- <div>
+ <div class="flex-box">
<label>鏃堕棿:</label>
<span>{{data.VideoDate}}</span>
</div>
- <div>
+ <div class="flex-box">
<label>鍙告満|鍓徃鏈�:</label>
<span>{{data.Driver1}}|{{data.Driver2}}</span>
</div>
@@ -208,9 +208,9 @@
<el-table-column label="淇敼鏃ユ湡" prop="UpdatedAt" sortable></el-table-column>
<el-table-column label="鍒涘缓鏃ユ湡" prop="CreatedAt" sortable></el-table-column>
<el-table-column label="鎿嶄綔">
- <template>
+ <template slot-scope="scope">
<div class="operation">
- <i class="el-icon-star-off" style="font-size: 18px;"></i>
+ <i class="el-icon-star-off" @click="toggleFollow(scope.row)"></i>
</div>
</template>
</el-table-column>
@@ -272,23 +272,38 @@
</div>
</div>
<div class="players" ref="playerWrap">
- <div
- class="video-item"
- :ref="`gridVideoItem_${index}`"
- v-for="(item,index) in videoWrapArr"
- :key="index"
-
- >
- <template v-if="index<=videoArrs.length-1">
- <div :class="{'currentPlayer':curVideo.ID==videoArrs[index].ID}">
- {{videoArrs[index].ID}}
- <img
- :src="CLIP+videoArrs[index].VideoCover"
- style="width:100px"
- />
+ <template v-if="guid==1">
+ <div
+ class="video-item"
+ :ref="`gridVideoItem_${index}`"
+ v-for="(item,index) in videoWrapArr"
+ :key="index"
+ >
+ <div class="currentPlayer">
+ {{curVideo.ID}}
+ <img :src="CLIP+curVideo.VideoCover" style="width:100px" />
</div>
- </template>
- </div>
+ </div>
+ </template>
+ <template v-else>
+ <div
+ class="video-item"
+ :ref="`gridVideoItem_${index}`"
+ v-for="(item,index) in videoWrapArr"
+ :key="index"
+ >
+ <template v-if="index<=videoArrs.length-1">
+ <div :class="{'currentPlayer':curVideo.ID==videoArrs[index].ID}">
+ {{videoArrs[index].ID}}
+ <img
+ :src="CLIP+videoArrs[index].VideoCover"
+ style="width:100px"
+ />
+ </div>
+ </template>
+ </div>
+ </template>
+
<!-- <div
class="video-item"
:class="{'active':item.ID==curVideo.ID}"
@@ -534,7 +549,7 @@
},
removeCurLabel (ParentID, Time) {
delLabel({ ParentID, Time }).then(res => {
-
+
})
},
renderLabelOpts () {
@@ -548,11 +563,11 @@
let label = this.labelOptions.find(label => label.ID == id);
return label.Name;
},
- checkVideo (video,index) {
+ checkVideo (video, index) {
this.curVideo = video;
debugger
- if(index>0&&this.guid==1){
- this.videoWrapArr
+ if (index > 0 && this.guid == 1) {
+ //this.videoWrapArr =
}
},
handleTabSizeChange (size) {
@@ -694,6 +709,7 @@
},
setGuid (guid) {
let _this = this;
+ this.guid = guid;
// for(var i = 0; i < Math.pow(guid,2); i++){
// if(i>this.videoArrs.length-1){
// this.videoWrapArr[i] = this.videoArrs[i]
@@ -922,12 +938,12 @@
padding: 0px 12px;
border: 1px solid #ccc;
&:hover {
- color: #6486e7;
- border-color: #6486e7;
+ color: #7695ec;
+ border-color: #7695ec;
}
&.checked {
- color: #3d68e1;
- border-color: #3d68e1;
+ color: #409eff;
+ border-color: #409eff;
}
}
}
@@ -977,12 +993,15 @@
padding: 2px 5px;
cursor: pointer;
border: 1px solid #eee;
+ background-color: #ecf0fc;
border-radius: 3px;
+ color: #777;
&.menu {
margin-right: 10px;
}
&.current {
- border-color: #3d68e1;
+ border-color: #409eff;
+ background-color: #fff;
}
}
}
@@ -1041,8 +1060,9 @@
font-size: 20px;
right: 10px;
bottom: 10px;
+ color: #ccc;
.follow {
- color: #3d68e1;
+ color: #409eff;
}
}
}
@@ -1067,6 +1087,7 @@
}
.title-partment {
font-size: 14px;
+ font-weight: 500;
color: #333;
line-height: 18px;
margin-bottom: 8px;
@@ -1075,6 +1096,9 @@
background: #fff;
padding: 10px;
border-radius: 3px;
+ .flex-box > label {
+ color: #777;
+ }
}
.title {
font-size: 18px;
@@ -1092,6 +1116,9 @@
color: #cacaca;
padding-left: 12px;
cursor: pointer;
+ &.activegongge {
+ color: #3d68e1;
+ }
}
}
.video-area {
@@ -1101,10 +1128,10 @@
margin-right: 10px;
.video-name {
cursor: pointer;
- color: #666;
+ color: #777;
margin-bottom: 10px;
&.current {
- color: #3d68e1;
+ color: #409eff;
}
i {
padding-right: 4px;
@@ -1142,6 +1169,9 @@
font-size: 15px;
font-weight: bold;
color: #409eff;
+ span {
+ padding-right: 5px;
+ }
i[class^='el-icon'] {
padding: 3px;
}
--
Gitblit v1.8.0