Skip to content

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

样式修改

parent b9541b8e
Hide whitespace changes
Inline Side-by-side
Showing with 41 additions and 320 deletions
wj-smartcity/src/components/Standard/cameraVideo.vue
View file @ cf7b67ba
<template> <template>
<div class="cameraVideo"> <div class="cameraVideo">
<video <video
style="width: 400px; height: 100%;object-fit: fill;"
@loadstart="loadstart($event)" @loadstart="loadstart($event)"
@canplay="canplay($event)" @canplay="canplay($event)"
class="videoControl" class="videoControl"
...@@ -11,25 +10,18 @@ ...@@ -11,25 +10,18 @@
<div class="cameraTable"> <div class="cameraTable">
<el-table <el-table
:data="tableData" :data="tableData"
height="230px" height="180PX"
style="width: 100%;"> style="width: 100%;">
<el-table-column prop="producer" label="厂商"/> <el-table-column prop="channelName" label="通道名称" show-overflow-tooltip width="60"/>
<el-table-column prop="channelName" label="通道名称" show-overflow-tooltip width="240"/> <el-table-column prop="startTime" label="统计开始时间" show-overflow-tooltip width="80"/>
<el-table-column prop="startTime" label="统计开始时间" show-overflow-tooltip width="150"/> <el-table-column prop="flowTypeDes" align="right" show-overflow-tooltip label="车道号" width="45"/>
<el-table-column prop="flowTypeDes" align="right" label="车道号"> <el-table-column prop="laneNo" align="right" show-overflow-tooltip label="车道类型" width="80"/>
</el-table-column> <el-table-column prop="vehicleCount" align="right" show-overflow-tooltip label="车道总流量" width="80"/>
<el-table-column prop="laneNo" align="right" label="车道类型"> <el-table-column prop="straightCount" align="right" show-overflow-tooltip label="直行通道车辆数" width="90"/>
</el-table-column> <el-table-column prop="leftCount" align="right" show-overflow-tooltip label="左转通道车辆数" width="90"/>
<el-table-column prop="vehicleCount" align="right" label="车道总流量"> <el-table-column prop="rightCount" align="right" show-overflow-tooltip label="右转通道车辆数" width="90"/>
</el-table-column> <el-table-column prop="turnCount" align="right" show-overflow-tooltip label="掉头通道车辆数" width="90"/>
<el-table-column prop="straightCount" align="right" label="直行通道车辆数" width="100"> <el-table-column prop="producer" label="厂商" show-overflow-tooltip width="50"/>
</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> </el-table>
<el-pagination <el-pagination
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
...@@ -75,293 +67,6 @@ export default { ...@@ -75,293 +67,6 @@ export default {
"pageSize": this.paginationData.pageSize "pageSize": this.paginationData.pageSize
}).then(res=>{ }).then(res=>{
if(res.code== 200){ 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.tableData = res.content.rows
this.paginationData.total = res.content.total this.paginationData.total = res.content.total
} }
...@@ -485,7 +190,7 @@ video { ...@@ -485,7 +190,7 @@ video {
</style> </style>
<style lang="less" scoped> <style lang="less" scoped>
.loading-mask { .loading-mask {
border-radius: 4px; border-radius: 4PX;
position: absolute; position: absolute;
width: 100%; width: 100%;
height: 100%; height: 100%;
...@@ -498,12 +203,14 @@ video { ...@@ -498,12 +203,14 @@ video {
} }
.cameraVideo { .cameraVideo {
position: relative; //position: relative;
width: 1000px; //width: 1000PX;
display: flex; //display: flex;
justify-content: space-between; //justify-content: space-between;
.videoControl { .videoControl {
width: 400px; width: 300PX;
height: 200PX;
margin: 0 auto;
object-fit: fill; object-fit: fill;
} }
} }
...@@ -512,12 +219,12 @@ video { ...@@ -512,12 +219,12 @@ video {
//left: 100% ; //left: 100% ;
//top: 0; //top: 0;
height: 100%; height: 100%;
width:400px; //width:50%;
overflow-x:auto; overflow-x:auto;
background: #0f2645; background: #0f2645;
border-left:1px solid #037bb2; border-left:1PX solid #037bb2;
margin-left: 1px; margin-left: 1PX;
padding:10px 20px; padding:10PX 20PX;
box-sizing:border-box; box-sizing:border-box;
z-index:1000; z-index:1000;
::v-deep .el-table__body tr.hover-row > td.el-table__cell { ::v-deep .el-table__body tr.hover-row > td.el-table__cell {
...@@ -536,7 +243,10 @@ video { ...@@ -536,7 +243,10 @@ video {
background-color: transparent; background-color: transparent;
} }
td.el-table__cell{ 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{ th,td,tr{
padding: 0; padding: 0;
...@@ -545,18 +255,27 @@ video { ...@@ -545,18 +255,27 @@ video {
} }
.cell{ .cell{
padding-right: 0; padding-right: 0;
padding-left: 5px; padding-left: 5PX;
color:#fff; color:#fff;
font-size: 12px; font-size: 12PX;
} }
} }
::v-deep .el-pagination{ ::v-deep .el-pagination{
position: absolute; position: absolute;
bottom: 0; bottom: 0;
display: flex;
justify-content: center;
button:disabled,.el-pager li ,.btn-next, .btn-prev{ button:disabled,.el-pager li ,.btn-next, .btn-prev{
background: transparent; background: transparent;
color:rgba(255,255,255,.5); 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{ .el-pager li.active{
color:#409EFF !important; color:#409EFF !important;
...@@ -567,7 +286,7 @@ video { ...@@ -567,7 +286,7 @@ video {
::v-deep .el-icon-loading { ::v-deep .el-icon-loading {
position: absolute; position: absolute;
left: 30%; left: 30%;
top: -14px; top: -14PX;
transform: translateX(-50%); transform: translateX(-50%);
} }
::v-deep .vjs-control-bar { ::v-deep .vjs-control-bar {
......
wj-smartcity/src/views/signal/mapPopup/equipmentPopup.vue
View file @ cf7b67ba
...@@ -359,6 +359,8 @@ export default { ...@@ -359,6 +359,8 @@ export default {
.equip_camera { .equip_camera {
width: 800PX; width: 800PX;
height: 500PX;
overflow:hidden;
.camera_header { .camera_header {
height: 43PX; 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