diff --git a/public/image/videos.jpg b/public/image/videos.jpg new file mode 100644 index 0000000..1c1e17b Binary files /dev/null and b/public/image/videos.jpg differ diff --git a/src/views/mortgage/index.vue b/src/views/mortgage/index.vue index e4ea67e..9b796ff 100644 --- a/src/views/mortgage/index.vue +++ b/src/views/mortgage/index.vue @@ -112,7 +112,9 @@
-
+
+ +
东北角摄像头1
@@ -139,22 +141,22 @@ style="height: 16px; width: 16px" /> - 警告信息 + 告警信息
- 2023-11-19  19:33:21  摄像头1号离线 + 2023-11-19  19:33:21    摄像头1号离线
- 2023-11-19  19:33:21  摄像头1号离线 + 2023-11-19  19:33:21    摄像头1号离线
- 2023-11-19  19:33:21  摄像头1号离线 + 2023-11-19  19:33:21    摄像头1号离线
- 2023-11-19  19:33:21  摄像头1号离线 + 2023-11-19  19:33:21    摄像头1号离线
@@ -270,6 +272,15 @@ + + +
+ +
+
@@ -319,7 +330,8 @@ export default { ], dayValue: "15日", dialogVisible:false, - videos:true + videos:true, + lookvideo:false }; }, mounted(){ @@ -328,6 +340,7 @@ export default { methods:{ clivideo(){ this.videos = !this.videos + this.lookvideo = true } } }; @@ -337,7 +350,7 @@ export default { width: 100%; height: 100%; box-sizing: border-box; - padding: 20px; + padding: 0px 20px 20px 20px; display: flex; flex-direction: column; position: relative; @@ -349,16 +362,18 @@ export default { } .mortgage_top { width: 100%; - height: calc((100% - 25px) / 2); + height: calc((100% - 50px) / 2); position: relative; display: flex; justify-content: space-between; - margin-bottom: 20px; + margin-bottom: 40px; .mortgage_top_item { height: 100%; position: relative; &:nth-of-type(1) { width: 26%; + box-sizing: border-box; + padding-right: 30px; ::v-deep .el-select { width: 150px; .el-input { @@ -504,6 +519,8 @@ export default { .mortgage_top_item_cons_right { width: 40%; height: 100%; + box-sizing: border-box; + padding-left: 30px; position: relative; .mortgage_top_item_cons_right_top { height: 50%; @@ -512,12 +529,16 @@ export default { position: relative; .mortgage_top_item_cons_right_top_video { width: 100%; - height: 85%; + height: 90%; position: relative; + img{ + width: 100%; + height: 100%; + } } .mortgage_top_item_cons_right_top_foor { width: 100%; - height: 15%; + height: 10%; display: flex; position: relative; .invie { @@ -583,9 +604,13 @@ export default { height: 30px; line-height: 30px; color: #999; - font-size: 18px; + font-size: 16px; + font-family: '微软雅黑'; box-sizing: border-box; padding-left: 20px; + span{ + margin-left: 10px; + } } } } @@ -710,7 +735,7 @@ export default { } .mortgage_bom { width: 100%; - height: calc((100% - 45px) / 2); + height: calc((100% - 75px) / 2); display: flex; align-items: center; position: relative; @@ -718,9 +743,12 @@ export default { height: 100%; &:nth-of-type(1) { width: 26%; + box-sizing:border-box; + padding-right: 30px; .mortgage_bom_item_cont { + box-sizing: border-box; - padding-left: 25px; + padding: 20px; .mortgage_bom_item_cont_item { &:last-child { border-bottom: none; @@ -737,7 +765,7 @@ export default { width: 28%; .mortgage_bom_item_cont { box-sizing: border-box; - padding-left: 25px; + padding-left: 45px; .mortgage_bom_item_cont_item { &:last-child { border-bottom: none; @@ -791,12 +819,12 @@ export default { } .mortgage_bom_item_cont { width: 100%; - height: calc(100% - 50px); + height: calc(100% - 100px); position: relative; .mortgage_bom_item_cont_item { width: 100%; - height: 40px; + height: calc(100% / 5); position: relative; display: flex; border-bottom: solid 1px #dadada; @@ -818,7 +846,7 @@ export default { } } .ditus { - height: 200px; + height: 160px; width: 100%; position: relative; cursor: pointer; @@ -843,5 +871,13 @@ export default { height: 100%; } } + .loockvideo{ + width: 100%; + height: 300px; + video{ + width: 100%; + height: 100%; + } + } } \ No newline at end of file