Skip to content

H
holo-web
Commit cf7b67ba authored by wuquanxin's avatar wuquanxin
Browse files
Options

样式修改

parent b9541b8e
Show whitespace changes
Inline Side-by-side
Showing with 41 additions and 320 deletions
wj-smartcity/src/components/Standard/cameraVideo.vue
View file @ cf7b67ba
<template>
<div class="cameraVideo">
<video
style="width: 400px; height: 100%;object-fit: fill;"
@loadstart="loadstart($event)"
@canplay="canplay($event)"
class="videoControl"
......@@ -11,25 +10,18 @@
<div class="cameraTable">
<el-table
:data="tableData"
height="230px"
height="180PX"
style="width: 100%;">
<el-table-column prop="producer" label="厂商"/>
<el-table-column prop="channelName" label="通道名称" show-overflow-tooltip width="240"/>
<el-table-column prop="startTime" label="统计开始时间" show-overflow-tooltip width="150"/>
<el-table-column prop="flowTypeDes" align="right" label="车道号">
</el-table-column>
<el-table-column prop="laneNo" align="right" label="车道类型">
</el-table-column>
<el-table-column prop="vehicleCount" align="right" label="车道总流量">
</el-table-column>
<el-table-column prop="straightCount" align="right" label="直行通道车辆数" width="100">
</el-table-column>
<el-table-column prop="leftCount" align="right" label="左转通道车辆数" width="100">
</el-table-column>
<el-table-column prop="rightCount" align="right" label="右转通道车辆数" width="100">
</el-table-column>
<el-table-column prop="turnCount" align="right" label="掉头通道车辆数" width="100">
</el-table-column>
<el-table-column prop="channelName" label="通道名称" show-overflow-tooltip width="60"/>
<el-table-column prop="startTime" label="统计开始时间" show-overflow-tooltip width="80"/>
<el-table-column prop="flowTypeDes" align="right" show-overflow-tooltip label="车道号" width="45"/>
<el-table-column prop="laneNo" align="right" show-overflow-tooltip label="车道类型" width="80"/>
<el-table-column prop="vehicleCount" align="right" show-overflow-tooltip label="车道总流量" width="80"/>
<el-table-column prop="straightCount" align="right" show-overflow-tooltip label="直行通道车辆数" width="90"/>
<el-table-column prop="leftCount" align="right" show-overflow-tooltip label="左转通道车辆数" width="90"/>
<el-table-column prop="rightCount" align="right" show-overflow-tooltip label="右转通道车辆数" width="90"/>
<el-table-column prop="turnCount" align="right" show-overflow-tooltip label="掉头通道车辆数" width="90"/>
<el-table-column prop="producer" label="厂商" show-overflow-tooltip width="50"/>
</el-table>
<el-pagination
@current-change="handleCurrentChange"
......@@ -75,293 +67,6 @@ export default {
"pageSize": this.paginationData.pageSize
}).then(res=>{
if(res.code== 200){
/*res = {
"code": 200,
"content": {
"pageNum": 1,
"pageSize": 10,
"rows": [
{
"avgSpeed": 52,
"cameraIndexCode": "",
"channelName": "龙鼎大道与龙翔路路口北向南",
"crossId": "",
"cycle": 0,
"deviceId": "",
"dt": 0,
"eventDesc": "",
"eventType": "",
"expTime": "",
"expand": "",
"flowType": 2,
"flowTypeDesc": "直行",
"id": "",
"ipAddr": "",
"ipv6Addr": "",
"laneDir": 5,
"laneDirDesc": "南",
"laneNo": 0,
"laneNum": 3,
"leftCount": 0,
"macAddr": "",
"pdTime": "",
"portNo": 0,
"producer": "HIKVISION",
"recvTime": "",
"rightCount": 0,
"sendTime": "",
"startTime": "2024-11-08 13:51:00",
"straightCount": 37,
"turnCount": 0,
"vehicleCount": 50
},
{
"avgSpeed": 53,
"cameraIndexCode": "",
"channelName": "龙鼎大道与龙翔路路口北向南",
"crossId": "",
"cycle": 0,
"deviceId": "",
"dt": 0,
"eventDesc": "",
"eventType": "",
"expTime": "",
"expand": "",
"flowType": 2,
"flowTypeDesc": "直行",
"id": "",
"ipAddr": "",
"ipv6Addr": "",
"laneDir": 5,
"laneDirDesc": "南",
"laneNo": 0,
"laneNum": 4,
"leftCount": 0,
"macAddr": "",
"pdTime": "",
"portNo": 0,
"producer": "HIKVISION",
"recvTime": "",
"rightCount": 0,
"sendTime": "",
"startTime": "2024-11-08 13:51:00",
"straightCount": 28,
"turnCount": 0,
"vehicleCount": 33
},
{
"avgSpeed": 46,
"cameraIndexCode": "",
"channelName": "龙鼎大道与龙翔路路口北向南",
"crossId": "",
"cycle": 0,
"deviceId": "",
"dt": 0,
"eventDesc": "",
"eventType": "",
"expTime": "",
"expand": "",
"flowType": 2,
"flowTypeDesc": "直行",
"id": "",
"ipAddr": "",
"ipv6Addr": "",
"laneDir": 1,
"laneDirDesc": "北",
"laneNo": 0,
"laneNum": 5,
"leftCount": 0,
"macAddr": "",
"pdTime": "",
"portNo": 0,
"producer": "HIKVISION",
"recvTime": "",
"rightCount": 0,
"sendTime": "",
"startTime": "2024-11-08 13:51:00",
"straightCount": 0,
"turnCount": 0,
"vehicleCount": 204
},
{
"avgSpeed": 36,
"cameraIndexCode": "",
"channelName": "龙鼎大道与龙翔路路口北向南",
"crossId": "",
"cycle": 0,
"deviceId": "",
"dt": 0,
"eventDesc": "",
"eventType": "",
"expTime": "",
"expand": "",
"flowType": 1,
"flowTypeDesc": "左转",
"id": "",
"ipAddr": "",
"ipv6Addr": "",
"laneDir": 5,
"laneDirDesc": "南",
"laneNo": 0,
"laneNum": 1,
"leftCount": 2,
"macAddr": "",
"pdTime": "",
"portNo": 0,
"producer": "HIKVISION",
"recvTime": "",
"rightCount": 0,
"sendTime": "",
"startTime": "2024-11-08 13:46:00",
"straightCount": 0,
"turnCount": 0,
"vehicleCount": 3
},
{
"avgSpeed": 55,
"cameraIndexCode": "",
"channelName": "龙鼎大道与龙翔路路口北向南",
"crossId": "",
"cycle": 0,
"deviceId": "",
"dt": 0,
"eventDesc": "",
"eventType": "",
"expTime": "",
"expand": "",
"flowType": 2,
"flowTypeDesc": "直行",
"id": "",
"ipAddr": "",
"ipv6Addr": "",
"laneDir": 5,
"laneDirDesc": "南",
"laneNo": 0,
"laneNum": 2,
"leftCount": 0,
"macAddr": "",
"pdTime": "",
"portNo": 0,
"producer": "HIKVISION",
"recvTime": "",
"rightCount": 0,
"sendTime": "",
"startTime": "2024-11-08 13:46:00",
"straightCount": 18,
"turnCount": 0,
"vehicleCount": 29
},
{
"avgSpeed": 55,
"cameraIndexCode": "",
"channelName": "龙鼎大道与龙翔路路口北向南",
"crossId": "",
"cycle": 0,
"deviceId": "",
"dt": 0,
"eventDesc": "",
"eventType": "",
"expTime": "",
"expand": "",
"flowType": 2,
"flowTypeDesc": "直行",
"id": "",
"ipAddr": "",
"ipv6Addr": "",
"laneDir": 5,
"laneDirDesc": "南",
"laneNo": 0,
"laneNum": 3,
"leftCount": 0,
"macAddr": "",
"pdTime": "",
"portNo": 0,
"producer": "HIKVISION",
"recvTime": "",
"rightCount": 0,
"sendTime": "",
"startTime": "2024-11-08 13:46:00",
"straightCount": 30,
"turnCount": 0,
"vehicleCount": 39
},
{
"avgSpeed": 42,
"cameraIndexCode": "",
"channelName": "龙鼎大道与龙翔路路口北向南",
"crossId": "",
"cycle": 0,
"deviceId": "",
"dt": 0,
"eventDesc": "",
"eventType": "",
"expTime": "",
"expand": "",
"flowType": 2,
"flowTypeDesc": "直行",
"id": "",
"ipAddr": "",
"ipv6Addr": "",
"laneDir": 5,
"laneDirDesc": "南",
"laneNo": 0,
"laneNum": 4,
"leftCount": 0,
"macAddr": "",
"pdTime": "",
"portNo": 0,
"producer": "HIKVISION",
"recvTime": "",
"rightCount": 0,
"sendTime": "",
"startTime": "2024-11-08 13:46:00",
"straightCount": 10,
"turnCount": 0,
"vehicleCount": 16
},
{
"avgSpeed": 46,
"cameraIndexCode": "",
"channelName": "龙鼎大道与龙翔路路口北向南",
"crossId": "",
"cycle": 0,
"deviceId": "",
"dt": 0,
"eventDesc": "",
"eventType": "",
"expTime": "",
"expand": "",
"flowType": 2,
"flowTypeDesc": "直行",
"id": "",
"ipAddr": "",
"ipv6Addr": "",
"laneDir": 1,
"laneDirDesc": "北",
"laneNo": 0,
"laneNum": 5,
"leftCount": 0,
"macAddr": "",
"pdTime": "",
"portNo": 0,
"producer": "HIKVISION",
"recvTime": "",
"rightCount": 0,
"sendTime": "",
"startTime": "2024-11-08 13:46:00",
"straightCount": 0,
"turnCount": 0,
"vehicleCount": 184
}
],
"startRowNum": 0,
"total": 3133,
"totalPageNum": 314
},
"message": "",
"status": "success",
"timestamp": 0
}*/
this.tableData = res.content.rows
this.paginationData.total = res.content.total
}
......@@ -485,7 +190,7 @@ video {
</style>
<style lang="less" scoped>
.loading-mask {
border-radius: 4px;
border-radius: 4PX;
position: absolute;
width: 100%;
height: 100%;
......@@ -498,12 +203,14 @@ video {
}
.cameraVideo {
position: relative;
width: 1000px;
display: flex;
justify-content: space-between;
//position: relative;
//width: 1000PX;
//display: flex;
//justify-content: space-between;
.videoControl {
width: 400px;
width: 300PX;
height: 200PX;
margin: 0 auto;
object-fit: fill;
}
}
......@@ -512,12 +219,12 @@ video {
//left: 100% ;
//top: 0;
height: 100%;
width:400px;
//width:50%;
overflow-x:auto;
background: #0f2645;
border-left:1px solid #037bb2;
margin-left: 1px;
padding:10px 20px;
border-left:1PX solid #037bb2;
margin-left: 1PX;
padding:10PX 20PX;
box-sizing:border-box;
z-index:1000;
::v-deep .el-table__body tr.hover-row > td.el-table__cell {
......@@ -536,7 +243,10 @@ video {
background-color: transparent;
}
td.el-table__cell{
border-bottom: 1px solid rgba(255,255,255,.1) !important;
border-bottom: 1PX solid rgba(255,255,255,.1) !important;
}
th{
text-align: center;
}
th,td,tr{
padding: 0;
......@@ -545,18 +255,27 @@ video {
}
.cell{
padding-right: 0;
padding-left: 5px;
padding-left: 5PX;
color:#fff;
font-size: 12px;
font-size: 12PX;
}
}
::v-deep .el-pagination{
position: absolute;
bottom: 0;
display: flex;
justify-content: center;
button:disabled,.el-pager li ,.btn-next, .btn-prev{
background: transparent;
color:rgba(255,255,255,.5);
font-size: 12PX;
width: 35PX;
height: 28PX;
}
.btn-next .el-icon, .btn-prev .el-icon{
font-size: 12PX;
}
.el-pager li.active{
color:#409EFF !important;
......@@ -567,7 +286,7 @@ video {
::v-deep .el-icon-loading {
position: absolute;
left: 30%;
top: -14px;
top: -14PX;
transform: translateX(-50%);
}
::v-deep .vjs-control-bar {
......
wj-smartcity/src/views/signal/mapPopup/equipmentPopup.vue
View file @ cf7b67ba
......@@ -359,6 +359,8 @@ export default {
.equip_camera {
width: 800PX;
height: 500PX;
overflow:hidden;
.camera_header {
height: 43PX;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment