From ffc9f497ed62c2d0814dfdf64c80c2f8fd8a769f Mon Sep 17 00:00:00 2001
From: Administrator <admin>
Date: Thu, 17 Jun 2021 22:31:05 +0800
Subject: [PATCH] 1.警情点击当前位置时，地图定位到当前位置点 2.警情信息调整，样式修改，信息上下拉动bug修复
---
xcxMapJQ/css/body.css | 172 +++++++++++++++++++++++++++++++++++++++++----------------
1 files changed, 123 insertions(+), 49 deletions(-)
diff --git a/xcxMapJQ/css/body.css b/xcxMapJQ/css/body.css
index 0125b04..9f1731e 100644
--- a/xcxMapJQ/css/body.css
+++ b/xcxMapJQ/css/body.css
@@ -1,9 +1,17 @@
+page {
+ width: 100%;
+ height: 100%;
+ background-color: rgb(138, 138, 138, 0.1);
+}
+
body {
padding: 0;
margin: 0;
}
-html, body, #mapVue {
+html,
+body,
+#mapVue {
width: 100%;
height: 100%;
}
@@ -36,13 +44,11 @@
}
#seedata {
- position: fixed;
bottom: 0;
width: 100%;
- height: 70%;
+ height: 50%;
z-index: 400;
background-color: #fff;
- /* opacity: 0.9; */
display: flex;
flex-direction: column;
border-radius: 60px 60px 0 0;
@@ -50,33 +56,33 @@
.title {
width: 100%;
- height: 20%;
- /* border: 1px solid springgreen; */
- border-radius: 60px 60px 0 0;
- position: relative;
- /* top: -3%; */
+ height: 70px;
+ border-radius: 30px 30px 0 0;
+ position: absolute;
+ bottom: 0;
background-color: #fff;
- z-index: 101;
+ z-index: 999;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
-.title-span {
- height: 15%;
+.device-name {
+ letter-spacing: 2px;
+ font-size: 15px;
}
-/* .title::after {
- content: '';
- display: block;
- width: 40px;
- height: 40px;
- border: springgreen solid 1px;
-} */
+.device-number {
+ margin-top: 5px;
+ letter-spacing: 0.5px;
+ color: #808080;
+ font-size: 13px;
+}
.main {
- width: 95%;
+ width: 100%;
+ height: 100%;
margin: 0 auto;
display: flex;
align-items: center;
@@ -85,47 +91,110 @@
border-top: 1px solid rgb(138, 138, 138);
}
-.f-m-once {
- /* border: 1px solid rgb(194, 142, 0); */
+.div-alarm-people {
+ width: 96%;
+ height: 25%;
+ margin-left: 2%;
+ /* height: 80px; */
+}
+
+.div-alarm-people .f-m-once {
+ border-bottom: 1px solid rgb(243, 243, 243);
+ align-items: center;
width: 100%;
- height: 100%;
+ height: 50%;
+ display: flex;
+ margin: auto;
+}
+
+.div-alarm-people .f-m-o-t-img {
+ width: 20px;
+ height: 20px;
+ float: left;
+}
+
+.div-alarm-people .f-m-o-title {
+ font-size: 14px;
+ margin-left: 10px;
+ float: left;
+}
+
+.div-alarm-people .f-m-once-phone-number {
+ /* border-bottom: 1px solid rgb(128, 128, 128, 0.1); */
+ align-items: center;
+ width: 100%;
+ height: 50%;
+ display: flex;
+ margin: auto;
+}
+
+.div-alarm-people .f-m-once-alarm-type {
+ /* border-bottom: 1px solid rgb(128, 128, 128, 0.1); */
+ align-items: center;
+ width: 100%;
+ height: 50%;
+ display: flex;
+ margin: auto;
+}
+
+.div-alarm-people .f-m-once-desc {
+ /* border-bottom: 1px solid rgb(128, 128, 128, 0.1); */
+ width: 100%;
+ height: 50% !important;
+ height: 80px;
display: flex;
align-items: center;
- justify-content: center;
- padding: 8px 0 8px 0
}
-.f-m-o-title {
+.div-alarm-people .f-m-o-t-img-desc {
+ width: 20px;
+ height: 20px;
+ float: left;
+}
+
+.div-alarm-people .f-m-o-title-desc {
display: flex;
align-items: center;
- width: 40%;
+ height: 40px;
+ line-height: 40px;
+ font-size: 14px;
+ margin-left: 10px;
+ float: left;
}
-.f-m-o-t-img {
- width: 30px;
- height: 30px;
- padding-right: 10px;
+.div-alarm-people .f-m-o-center {
+ font-size: 14px;
+ position: absolute;
+ left: 135px;
+ color: #808080;
}
-.f-m-o-center {
- width: 60%;
+.div-alarm-people .f-m-o-center-desc {
+ width: 200px;
+ word-wrap: break-word;
+ line-height: 1.5;
+ /* height: 60px; */
+ /* background-color: rgb(46, 118, 228); */
+ font-size: 14px;
+ position: absolute;
+ left: 135px;
+ color: #808080;
}
-.el-divider {
- margin: 0 auto;
- width: 90%;
+.interval {
+ width: 100%;
+ height: 2%;
+ background-color: rgb(243, 243, 243);
}
.but {
width: 100%;
+ height: 19%;
+ flex: 1;
display: flex;
+ flex-direction: row;
align-items: center;
justify-content: space-around;
- padding-top: 5px;
-}
-
-.buta {
- /* border: 1px solid #4D7CEE; */
}
.shipingPopup {
@@ -154,21 +223,24 @@
height: 50px;
}
+
/* video::-webkit-media-controls-timeline {
display: none;
} */
.butb {
- width: 80px;
- height: 80px;
- border: 1px solid rgb(46, 118, 228);
+ width: 200px;
+ height: 40px;
+ /* border: 1px solid rgb(46, 118, 228); */
border-radius: 40px;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
- background-image: linear-gradient(to bottom, #3CA7F4, #4D7CEE);
+ /* background-image: linear-gradient(to bottom, #3CA7F4, #4D7CEE); */
+ background-image: linear-gradient(to bottom, #00BFFF, #4D7CEE);
}
+
/* .resultFeedback {
position: fixed;
@@ -182,6 +254,7 @@
align-items: center;
justify-content: center;
} */
+
/* .b-r-main {
width: 90%;
@@ -220,19 +293,20 @@
}
.b-r-i-o-ups{
/* align-items: center; */
+
+
}
.b-r-m-i-o-c-img {
width: 50px;
height: 50px;
}
-.b-r-m-but{
+.b-r-m-but {
position: relative;
left: calc(50% - 40px);
-} */
-.butc {
+}
+*/ .butc {
/* border: 1px solid #4D7CEE; */
}
-
.b-b-img {
width: 40px;
height: 40px;
--
Gitblit v1.9.3