Skip to content

G
gassafety
Commit 6ef6b7b8 authored by 纪泽龙's avatar 纪泽龙
Browse files
Options

gis地图样式修改的差不多了，要把功能完善一下

parent 97f2a337
Hide whitespace changes
Inline Side-by-side
Showing with 117 additions and 75 deletions
gassafety-web/src/assets/images/llj.gif
View replaced file @ 97f2a337 View file @ 6ef6b7b8
gassafety-web/src/assets/images/llj.gif

2.05 KB | W: | H:

gassafety-web/src/assets/images/llj.gif

1.98 KB | W: | H:

gassafety-web/src/assets/images/llj.gif
gassafety-web/src/assets/images/llj.gif
gassafety-web/src/assets/images/llj.gif
gassafety-web/src/assets/images/llj.gif
  • 2-up
  • Swipe
  • Onion skin
gassafety-web/src/assets/images/ylb.gif
View replaced file @ 97f2a337 View file @ 6ef6b7b8
gassafety-web/src/assets/images/ylb.gif

1.93 KB | W: | H:

gassafety-web/src/assets/images/ylb.gif

1.83 KB | W: | H:

gassafety-web/src/assets/images/ylb.gif
gassafety-web/src/assets/images/ylb.gif
gassafety-web/src/assets/images/ylb.gif
gassafety-web/src/assets/images/ylb.gif
  • 2-up
  • Swipe
  • Onion skin
gassafety-web/src/assets/styles/gassafety.scss
View file @ 6ef6b7b8
......@@ -387,3 +387,9 @@
height: 140px !important;
}
}
.ddd {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
gassafety-web/src/components/PopWindowGis/lineInfoWindow.vue
View file @ 6ef6b7b8
<template>
<div class="wrapper">
<div class="top display-default">
<div class="left text">{{ obj.pipeName }}</div>
<div class="left text ddd" :title="obj.pipeName">{{ obj.pipeName }}</div>
<div class="right text">
<img @click="close" src="../../assets/images/closeBtn.png" alt="" />
</div>
......@@ -34,7 +34,6 @@
}}</span>
</div>
</div>
<div class="pic">
<img @mousedown.stop="mousedown" :src="obj.iconUrl" alt="" />
<el-image
......@@ -151,27 +150,32 @@ export default {
.wrapper {
width: 406px;
max-height: 430px;
background: #fff;
background: rgba(7, 29, 51, 0.9);
border-radius: 4px;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
color: #fff;
// overflow: hidden;
.top {
width: 100%;
height: 51px;
background-color: #053b6a;
// background-color: #053b6a;
background-image: url(../../assets/images/blueTopBg.png);
background-size: 100% 100%;
background-position: center;
// border-radius: 4px 4px 0px 0px;
// border: 1px solid #fff;
box-sizing: border-box;
position: relative;
&:before {
content: "";
position: absolute;
left: -20px;
top: 5px;
width: 0px;
height: 0px;
/* border: 20px solid red; */
border-top: 15px solid transparent;
border-bottom: 15px solid transparent;
/* border-left: 50px solid greenyellow; */
border-right: 30px solid #053b6a;
z-index: -1;
width: 33px;
height: 33px;
background-image: url(../../assets/images/blueLeftTriangle.png);
}
.text {
font-weight: 600;
......@@ -209,7 +213,8 @@ export default {
.eq-text {
font-size: 14px;
font-weight: 400;
color: #1d1d1d;
// color: #1d1d1d;
color: #fff;
opacity: 1;
& > span {
vertical-align: top;
......
gassafety-web/src/components/PopWindowGis/lineInfoWindowWarn.vue
View file @ 6ef6b7b8
<template>
<div class="wrapper">
<div class="top display-default">
<div class="left text">{{ obj.pipeName }}</div>
<div class="left text ddd" :title="obj.pipeName">{{ obj.pipeName }}</div>
<div class="right text">
<img @click="close" src="../../assets/images/closeBtn.png" alt="" />
</div>
......@@ -210,26 +210,29 @@ export default {
.wrapper {
width: 406px;
max-height: 500px;
background: #fff;
// background: #fff;
background: rgba(7, 29, 51, 0.9);
color: #fff;
border-radius: 4px;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
// overflow: hidden;
.top {
width: 100%;
height: 51px;
background-color: #ff5a67;
// background-color: #ff5a67;
background-image: url(../../assets/images/redTopBg.png);
background-size: 100% 100%;
background-position: center;
&:before {
content: "";
position: absolute;
left: -20px;
top: 5px;
width: 0px;
height: 0px;
/* border: 20px solid red; */
border-top: 15px solid transparent;
border-bottom: 15px solid transparent;
/* border-left: 50px solid greenyellow; */
border-right: 30px solid #ff5a67;
z-index: -1;
width: 33px;
height: 33px;
background-image: url(../../assets/images/redLeftTriangle.png);
}
.text {
font-weight: 600;
......@@ -239,6 +242,8 @@ export default {
}
.left {
padding-left: 22px;
width:100%;
overflow: hidden;
}
.right {
padding-right: 22px;
......@@ -267,7 +272,7 @@ export default {
.eq-text {
font-size: 14px;
font-weight: 400;
color: #1d1d1d;
color: #fff;
opacity: 1;
& > span {
vertical-align: top;
......@@ -300,6 +305,7 @@ export default {
// padding-right: 22px;
// padding-bottom: 10px;
// padding-top: 16px;
box-sizing: border-box;
// border-bottom: 1px solid #e2e2e2;
& > div {
......@@ -337,7 +343,7 @@ export default {
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
width: 95px;
height: 33px;
border: none;
// border: none;
}
}
}
......
gassafety-web/src/components/PopWindowGis/markerInfoWindow.vue
View file @ 6ef6b7b8
......@@ -2,7 +2,7 @@
<div class="wrapper">
<span class="dot-left"></span>
<div class="top display-default">
<div class="left text">{{ data.deviceName }}</div>
<div class="left text ddd" :title="data.deviceName">{{ data.deviceName }}</div>
<div class="right text">
<img src="../../assets/images/closeBtn.png" alt="" @click="close" />
</div>
......@@ -107,26 +107,38 @@ export default {
.wrapper {
width: 406px;
max-height: 430px;
background: #fff;
// background: #fff;
border-radius: 4px;
background: rgba(7, 29, 51, 0.9);
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
color: #fff;
// overflow: hidden;
.top {
width: 100%;
height: 51px;
background-color: #053b6a;
// background-color: #053b6a;
background-image: url(../../assets/images/blueTopBg.png);
background-size: 100% 100%;
background-position: center;
&:before {
// content: "";
// position: absolute;
// left: -20px;
// top: 5px;
// width: 0px;
// height: 0px;
// z-index:-1;
// border-top: 15px solid transparent;
// border-bottom: 15px solid transparent;
// border-right: 30px solid #053b6a;
content: "";
position: absolute;
left: -20px;
top: 5px;
width: 0px;
height: 0px;
/* border: 20px solid red; */
border-top: 15px solid transparent;
border-bottom: 15px solid transparent;
/* border-left: 50px solid greenyellow; */
border-right: 30px solid #053b6a;
z-index: -1;
width: 33px;
height: 33px;
background-image: url(../../assets/images/blueLeftTriangle.png);
}
.text {
font-weight: 600;
......@@ -164,7 +176,8 @@ export default {
.eq-text {
font-size: 14px;
font-weight: 400;
color: #1d1d1d;
// color: #1d1d1d;
color: #fff;
opacity: 1;
& > span {
vertical-align: top;
......
gassafety-web/src/components/PopWindowGis/markerInfoWindowWarn.vue
View file @ 6ef6b7b8
......@@ -2,13 +2,9 @@
<div class="wrapper">
<span class="dot-left"></span>
<div class="top display-default">
<div class="left text">{{ data.deviceName }}</div>
<div class="left text ddd" :title="data.deviceName">{{ data.deviceName }}</div>
<div class="right text">
<img
src="../../assets/images/closeBtn.png"
alt=""
@click="close"
/>
<img src="../../assets/images/closeBtn.png" alt="" @click="close" />
</div>
</div>
<!-- 设备信息 -->
......@@ -137,7 +133,7 @@ export default {
type: "device",
});
},
close(){
close() {
this.map.clearInfoWindow();
this.data.class.view.bottomDataShow = true;
},
......@@ -177,31 +173,32 @@ export default {
},
};
</script>
<style lang="scss" scoped>
.wrapper {
width: 406px;
max-height: 500px;
background: #fff;
// background: #fff;
background: rgba(7, 29, 51, 0.9);
color: #fff;
border-radius: 4px;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
// overflow: hidden;
.top {
width: 100%;
height: 51px;
background-color: #ff5a67;
&:before {
// background-color: #ff5a67;
background-image: url(../../assets/images/redTopBg.png);
background-size: 100% 100%;
background-position: center;
&:before {
content: "";
position: absolute;
left: -20px;
top: 5px;
width: 0px;
height: 0px;
/* border: 20px solid red; */
border-top: 15px solid transparent;
border-bottom: 15px solid transparent;
/* border-left: 50px solid greenyellow; */
border-right: 30px solid #ff5a67;
z-index: -1;
width: 33px;
height: 33px;
background-image: url(../../assets/images/redLeftTriangle.png);
}
.text {
font-weight: 600;
......@@ -239,7 +236,7 @@ export default {
.eq-text {
font-size: 14px;
font-weight: 400;
color: #1d1d1d;
color: #fff;
opacity: 1;
& > span {
vertical-align: top;
......@@ -309,7 +306,7 @@ export default {
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
width: 95px;
height: 33px;
border: none;
// border: none;
}
}
}
......
gassafety-web/src/components/PopWindowGis/troubleInfoWindowWarn.vue
View file @ 6ef6b7b8
......@@ -2,7 +2,9 @@
<div class="wrapper">
<span class="dot-left"></span>
<div class="top display-default">
<div class="left text">{{ data.troubleName }}</div>
<div class="left text ddd" :title="data.troubleName">
{{ data.troubleName }}
</div>
<div class="right text">
<img src="../../assets/images/closeBtn.png" alt="" @click="close" />
</div>
......@@ -185,26 +187,29 @@ export default {
.wrapper {
width: 406px;
max-height: 500px;
background: #fff;
// background: #fff;
background: rgba(7, 29, 51, 0.9);
border-radius: 4px;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
// overflow: hidden;
.top {
width: 100%;
height: 51px;
background-color: #e6a23c;
// background-color: #e6a23c;
background-image: url(../../assets/images/yellowTopBg.png);
background-size: 100% 100%;
background-position: center;
color: #fff;
&:before {
content: "";
position: absolute;
left: -20px;
top: 5px;
width: 0px;
height: 0px;
/* border: 20px solid red; */
border-top: 15px solid transparent;
border-bottom: 15px solid transparent;
/* border-left: 50px solid greenyellow; */
border-right: 30px solid #e6a23c;
z-index: -1;
width: 33px;
height: 33px;
background-image: url(../../assets/images/yellowLeftTriangle.png);
}
.text {
font-weight: 600;
......@@ -242,7 +247,7 @@ export default {
.eq-text {
font-size: 14px;
font-weight: 400;
color: #1d1d1d;
color: #fff;
opacity: 1;
& > span {
vertical-align: top;
......@@ -272,6 +277,7 @@ export default {
width: 100%;
max-height: 119px;
padding-left: 22px;
color: #fff;
// padding-right: 22px;
// padding-bottom: 10px;
// padding-top: 16px;
......@@ -312,7 +318,7 @@ export default {
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
width: 95px;
height: 33px;
border: none;
// border: none;
}
}
}
......
gassafety-web/src/components/PopWindowGis/workerManInfowindow.vue
View file @ 6ef6b7b8
<template>
<div class="wrapper">
<div class="content">
<span class="left">姓名: {{ data.userName }}</span>
<span class="left">姓名: {{ data.nickName }}</span>
<span class="right">时间: {{ data.createTime }}</span>
</div>
......@@ -26,7 +26,9 @@ export default {
.wrapper {
// width: 166px;
height: 54px;
background: #0d4f88;
// background: #0d4f88;
background: rgba(7, 29, 51, 0.9);
font-size: 14px;
color: #fff;
box-sizing: border-box;
......@@ -45,7 +47,9 @@ export default {
border-top: 15px solid transparent;
border-bottom: 15px solid transparent;
/* border-left: 50px solid greenyellow; */
border-right: 30px solid #0d4f88;
border-right: 30px solid rgba(7, 29, 51, 0.9);
box-shadow: 0 0 20px -5px #0d4f88;
z-index: -1;
}
.content {
......
gassafety-web/src/components/PopWindowGis/workerManView.vue
View file @ 6ef6b7b8
......@@ -117,7 +117,7 @@ export default {
created() {
this.formData.userId = this.userId;
this.workerManArr = this.gaodeMap.workerManArr.map((item) => ({
label: item.userName,
label: item.nickName,
value: item.userId,
}));
},
......
gassafety-web/src/utils/gaodeMapView.js
View file @ 6ef6b7b8
......@@ -719,7 +719,7 @@ class gaodeMap {
map: map,
path: lineArr,
showDir: true,
strokeColor: "#28F", //线颜色
strokeColor: "#2EE7E7", //线颜色
// strokeOpacity: 1, //线透明度
strokeWeight: 6 //线宽
// strokeStyle: "solid" //线样式
......
gassafety-web/src/views/enterprise/mapView/index.vue
View file @ 6ef6b7b8
......@@ -1147,7 +1147,7 @@ export default {
path: [item.longitude, item.latitude],
no: index,
userId: item.userId,
userName: item.userName,
userName: item.nickName,
userPhone: item.phonenumber,
};
});
......
gassafety-web/yarn.lock
View file @ 6ef6b7b8
......@@ -903,6 +903,11 @@
"@babel/helper-validator-identifier" "^7.14.5"
to-fast-properties "^2.0.0"
"@easydarwin/easywasmplayer@^4.0.13":
version "4.0.13"
resolved "https://registry.nlark.com/@easydarwin/easywasmplayer/download/@easydarwin/easywasmplayer-4.0.13.tgz#83dc92d880e9b0528e5d4cfc9c669a1a1e420c08"
integrity sha1-g9yS2IDpsFKOXUz8nGaaGh5CDAg=
"@eslint/eslintrc@^0.2.2":
version "0.2.2"
resolved "https://registry.nlark.com/@eslint/eslintrc/download/@eslint/eslintrc-0.2.2.tgz#d01fc791e2fc33e88a29d6f3dc7e93d0cd784b76"
......@@ -3378,9 +3383,9 @@ ecc-jsbn@~0.1.1:
jsbn "~0.1.0"
safer-buffer "^2.1.0"
echarts@4.9.0:
echarts@^4.9.0:
version "4.9.0"
resolved "https://registry.nlark.com/echarts/download/echarts-4.9.0.tgz#a9b9baa03f03a2a731e6340c55befb57a9e1347d"
resolved "https://registry.nlark.com/echarts/download/echarts-4.9.0.tgz?cache=0&sync_timestamp=1630472362764&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fecharts%2Fdownload%2Fecharts-4.9.0.tgz#a9b9baa03f03a2a731e6340c55befb57a9e1347d"
integrity sha1-qbm6oD8Doqcx5jQMVb77V6nhNH0=
dependencies:
zrender "4.3.2"
......
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