Skip to content

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

Merge branch 'develop_jzl'

parents 77e76c21 5295048e
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 923 additions and 192 deletions
gassafety-web/src/components/PopWindow/markerInfoWindow.vue
View file @ b651ddc3
......@@ -13,7 +13,7 @@
<div class="text-wrapper">
<div class="eq-text">设备类型：<span>{{title}}</span></div>
<div class="eq-text">设备型号：<span>{{data.deviceModel}}</span></div>
<div class="eq-text">所属管道：<span>{{data.pipeCode}}</span></div>
<div class="eq-text">所属管道：<span>{{data.pipeName}}</span></div>
<div class="eq-text">物联网编号：<span>{{data.iotNo}}</span></div>
</div>
<div class="pic">
......
gassafety-web/src/components/PopWindowGis/markerInfoWindow.vue
View file @ b651ddc3
......@@ -22,7 +22,7 @@
设备型号：<span>{{ data.deviceModel }}</span>
</div>
<div class="eq-text">
所属管道：<span>{{ data.pipeCode }}</span>
所属管道：<span>{{ data.pipeName }}</span>
</div>
<div class="eq-text">
物联网编号：<span>{{ data.iotNo }}</span>
......
gassafety-web/src/components/PopWindowGis/markerInfoWindowWarn.vue
View file @ b651ddc3
......@@ -22,7 +22,7 @@
设备型号：<span>{{ data.deviceModel }}</span>
</div>
<div class="eq-text">
所属管道：<span>{{ data.pipeCode }}</span>
所属管道：<span>{{ data.pipeName }}</span>
</div>
<div class="eq-text">
物联网编号：<span>{{ data.iotNo }}</span>
......
gassafety-web/src/components/PopWindowGis/troubleInfoWindowWarn.vue 0 → 100644
View file @ b651ddc3
<template>
<div class="wrapper">
<span class="dot-left"></span>
<div class="top display-default">
<div class="left text">{{ data.deviceName }}</div>
<div class="right text">
<img
src="../../assets/images/closeBtn.png"
alt=""
@click="map.clearInfoWindow()"
/>
</div>
</div>
<!-- 设备信息 -->
<div class="content">
<div class="eq-content display-default">
<div class="text-wrapper">
<div class="eq-text">
设备类型：<span>{{ title }}</span>
</div>
<div class="eq-text">
设备型号：<span>{{ data.deviceModel }}</span>
</div>
<div class="eq-text">
所属管道：<span>{{ data.pipeName }}</span>
</div>
<div class="eq-text">
物联网编号：<span>{{ data.iotNo }}</span>
</div>
</div>
<div class="pic">
<img v-bind:src="data.iconUrl" alt="" />
</div>
</div>
<!-- 维修人员 -->
<div class="maintain-content">
<el-col :span="11">
<div>
<span>安装日期：</span>
<span>{{
moment(data.installationTime).format("YYYY-MM-DD")
}}</span>
</div>
</el-col>
<el-col :span="13">
<div>
<span>最后巡检日期：</span>
<span>{{ data.inspectionTime ? data.inspectionTime : "-" }}</span>
</div>
</el-col>
<div>
<span>管道所在地址：</span>
<span>{{ data.pipeAddr }}</span>
</div>
<div>
<span>备注信息：</span>
<span>{{ data.remarks }} </span>
</div>
</div>
</div>
<!-- 报警状态 -->
<div class="warn-wrapper" v-if="true">
<div class="warn-content">
<div>
报警状态：<span>报警({{ data.alarmType }})</span>
</div>
<div>
详细信息：<span>{{ data.alarmValue ? data.alarmValue : "-" }}</span>
</div>
<div v-if="!orderId">
工单编号：<span>{{ data.orderId }}</span>
</div>
</div>
<div class="btn">
<span @mousedown.stop="deviceMore">
<el-button class="elbtn" type="primary">设备详情</el-button>
</span>
<span v-if="orderId" @mousedown.stop="createWork">
<el-button
v-if="title == '压力表' || title == '流量计'"
class="elbtn"
type="primary"
>生成工单</el-button
>
</span>
<span v-else @mousedown.stop="checkWork">
<el-button class="elbtn" type="primary">查看工单</el-button>
</span>
</div>
</div>
</div>
</template>
<script>
import moment from "moment";
//line移入时的的infowindow
export default {
props: {
obj: { typs: Object },
title: "",
data: {},
map: null,
},
data() {
return {
deviceType: {
1: "调压箱",
2: "阀门井",
3: "流量计",
4: "智能燃气表",
},
};
},
computed: {
orderId() {
// 如果已经生成过工单，就不能再次生成了
// return this.data.orderId ? false : true;
return this.data.orderId ? false : true;
},
},
methods: {
moment,
createWork() {
// 控制外层弹框
// console.log(this.data.view.$refs.CreateWork);
this.data.view.$refs.CreateWork.alarmId = this.data.alarmId;
this.data.view.$refs.CreateWork.open = true;
this.data.view.$refs.CreateWork.gaoMap = this.data.view.gaoMap;
// 改变外层回调
// this.data.view.CreateWorkCallBack = this.CreateWorkCallBack;
this.data.view.alarmObjChange({
alarmId: this.data.alarmId,
type: "device",
});
},
// CreateWorkCallBack(e) {
// // console.log("生成工单后传过来的参数", e);
// // console.log("markerCallBack");
// const marker = this.data.view.gaoMap.markers.filter((item) => {
// return item.getExtData().alarmId == this.data.alarmId;
// })[0];
// console.log("marer.getExtData()", marker.getExtData());
// let options = marker.getExtData();
// // 暂时传值，到时候回重新刷新
// options.orderId = e;
// marker.setExtData(options);
// },
deviceMore() {
this.data.view.$router.push({
path: "/dataMonitoring/alarmdetail",
query: {
alarmId: this.data.alarmId,
dcviceType: this.deviceType[this.data.deviceType],
},
});
},
// 查看工单
checkWork() {
this.data.view.$router.push({
path: "/workOrder/detail",
query: {
orderId: this.data.orderId,
},
});
},
},
beforeDestroy() {
// this.data.view.createWorkOpen = false;
},
};
</script>
<style lang="scss" scoped>
.wrapper {
width: 406px;
max-height: 430px;
background: #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;
.text {
font-weight: 600;
font-size: 16px;
color: #ffffff;
line-height: 51px;
}
.left {
padding-left: 22px;
}
.right {
padding-right: 22px;
img {
cursor: pointer;
}
}
}
.content {
position: relative;
max-height: 300px;
overflow: hidden;
overflow-y: auto;
padding-bottom: 2px;
border-bottom: 1px solid #eeeeee;
.eq-content {
// min-height: 156px;
box-sizing: border-box;
padding: 13px 22px 0px 22px;
// border-bottom: 1px solid #e2e2e2;
.text-wrapper {
padding-top: 1px;
& > div {
margin-bottom: 6px;
}
.eq-text {
font-size: 14px;
font-weight: 400;
color: #1d1d1d;
opacity: 1;
& > span {
vertical-align: top;
display: inline-block;
// white-space: nowrap;
// text-overflow: ellipsis;
// overflow: hidden;
word-break: break-all;
max-width: 100px;
}
}
}
.pic {
width: 180px;
height: 103px;
// background-color: black;
img {
width: 100%;
height: 100%;
// cursor: pointer;
}
}
}
}
.maintain-content {
width: 100%;
max-height: 119px;
padding-left: 22px;
// padding-right: 22px;
// padding-bottom: 10px;
// padding-top: 16px;
box-sizing: border-box;
// border-bottom: 1px solid #e2e2e2;
& > div {
margin-bottom: 8px;
font-size: 14px;
font-weight: 400;
span {
vertical-align: top;
display: inline-block;
word-break: break-all;
max-width: 280px;
}
}
}
.warn-wrapper {
.warn-content {
box-sizing: border-box;
padding: 10px 0 2px 22px;
border-bottom: 1px solid #e2e2e2;
color: #fe5966;
& > div {
font-size: 14px;
font-weight: 400;
margin-bottom: 8px;
}
}
.btn {
padding: 16px 0;
text-align: center;
span {
display: inline-block;
padding: 0 10px;
.elbtn {
background-color: #053b6a;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
width: 95px;
height: 33px;
border: none;
}
}
}
}
}
.wrapperEditorPage {
}
.display-default {
display: flex;
justify-content: space-between;
}
</style>
gassafety-web/src/utils/gaodeMap.js
View file @ b651ddc3
......@@ -34,6 +34,7 @@ class gaodeMap {
mouseTool = null;
myMap = null;
showInfoWindow = null;
view = null;
//构造函数中设置中央点默认值
constructor(center) {
......@@ -86,6 +87,16 @@ class gaodeMap {
// console.log("缩放开始")
this.closeInfoWindow();
});
this.myMap.on("moveend", () => {
// console.log("缩放开始")
if (!this.onceFlag) {
this.onceFlag = true;
this.view.backFlag = false;
// 让抽屉不在隐身
this.view.drawerOpacity = true;
}
});
this.districtBoundaries();
}
......@@ -987,10 +998,10 @@ class gaodeMap {
}
});
let infoWindow = new AMap.InfoWindow({
isCustom:true,
isCustom: true,
content: `<span style='border:1px solid #80d8ff;background:#fff'>${pipeName}</span>`,
anchor: "left-top",
offset: new AMap.Pixel(20, -20),
offset: new AMap.Pixel(20, -20)
});
polyline.on("mouseover", e => {
const options = polyline.getOptions();
......@@ -1007,7 +1018,7 @@ class gaodeMap {
map.add(polyline);
const path = eval(coordinates)[0];
// map.setFitView();
map.setCenter([+path[0],+path[1]], false)
map.setCenter([+path[0], +path[1]], false);
// const lntlat = eval(coordinates)[0];
// map.panTo(lntlat)
......
gassafety-web/src/utils/gaodeMapView.js
View file @ b651ddc3
......@@ -29,13 +29,14 @@ export const DEVICE_TYPE = {
PRESSUREGAGE: "7",
INSPECTOR: "8",
SMALLINSPECTOR: "workPoint",
TROUBLE:"trouble"
TROUBLE: "trouble"
};
class gaodeMap {
// 所有线的数组
polyLines = [];
//值班人员的单独数组，轨迹的时候使用
workerManArr = [];
troubles=[];
// 值班人员对象的arr
workerManMarkArr = [];
// 是否开启新增
......@@ -115,7 +116,10 @@ class gaodeMap {
if (!this.onceFlag) {
this.onceFlag = true;
this.view.backFlag = false;
// 让抽屉不在隐身
this.view.drawerOpacity = true;
}
// 每次地图移动结束，就让地图可以缩放
let options = this.myMap.getStatus();
options.scrollWheel = true;
......@@ -271,17 +275,14 @@ class gaodeMap {
}
// 隐患
if(DEVICE_TYPE.TROUBLE == markerType){
console.log("隐患上图")
if (DEVICE_TYPE.TROUBLE == markerType) {
this.troubles.push(marker)
}
if (
DEVICE_TYPE.WORKORDER != markerType &&
DEVICE_TYPE.INSPECTOR != markerType &&
DEVICE_TYPE.SMALLINSPECTOR != markerType&&
DEVICE_TYPE.SMALLINSPECTOR != markerType &&
DEVICE_TYPE.TROUBLE != markerType
) {
// marker.content = this.getMarketContent(data, markerInfoWindow);
......@@ -369,6 +370,7 @@ class gaodeMap {
return marker;
}
// 值班人员
wokerManOpen = e => {
this.markerType = e.target.markerType;
e.target.content = this.getMarketContent(e.target.data);
......
gassafety-web/src/views/enterprise/mapView/index.vue
View file @ b651ddc3
......@@ -75,17 +75,14 @@
@callback="CreateWorkCallBack"
/>
<div ref="drawer" class="drawer" :class="{ back: backFlag }">
<div
ref="drawer"
class="drawer"
:class="{ back: backFlag, opacity: drawerOpacity }"
>
<div class="switch" @click="backFlag = !backFlag">
<!-- <i
:class="{
'el-icon-arrow-left': !backFlag,
'el-icon-arrow-right': backFlag,
}"
></i> -->
<img v-if="!backFlag" src="@/assets/images/l.png" alt="" />
<img v-else src="@/assets/images/r.png" alt="" />
<!-- <i class="el-icon-arrow-right"></i> -->
</div>
<!-- 只能动态传入内嵌盒子的高 -->
<div class="scroll" :style="{ height: `${boxHeight}px` }">
......@@ -194,12 +191,8 @@
</div>
</div>
</template>
<!-- 翻页 -->
<div class="goback">
<!-- <div class="minMax">
页数
{{ item.nowPage }}/{{ item.maxPage }}
</div> -->
<div class="btn-w">
<el-button
class="btn backPage"
......@@ -346,6 +339,7 @@ export default {
alarmObj: { alarmId: "", type: "" },
// 左边抽屉 内嵌scroll盒子的高
boxHeight: "",
drawerOpacity: false,
//抽屉是否收回
backFlag: true,
};
......@@ -473,7 +467,8 @@ export default {
},
// 隐患
getMapHiddenTroublelist(queryParams) {
return getMapHiddenTroublelist({ dealStatus: 3 }).then((res) => {
return getMapHiddenTroublelist().then((res) => {
console.log(res);
if (res.code == 200) {
res.data.forEach((item) => {
console.log("隐患", item);
......@@ -1206,9 +1201,9 @@ export default {
},
beforeDestroy() {
// 让抽屉继续隐身
console.log("移除window事件");
map.clearMap();
window.removeEventListener("mousedown", this.barClose);
// 关闭scoket
if (this.ws) {
......@@ -1228,93 +1223,93 @@ export default {
bottom: 0;
width: 100%;
}
.btn-wrapper {
position: fixed;
right: 32px;
top: 100px;
.myBtn {
display: flex;
justify-content: space-between;
.el-btn {
width: 144px;
height: 44px;
background-color: #053b6a;
margin-right: 22px;
border-radius: 4px;
text-align: center;
line-height: 44px;
color: #fff;
cursor: pointer;
font-size: 18px;
display: flex;
justify-content: space-between;
&.active {
background: #31eaea;
color: #053b6a !important;
}
.left {
padding-left: 38px;
i {
font-size: 18px;
}
}
.right {
padding-right: 38px;
}
.newLetf {
margin-left: 20px;
}
.newRight {
margin-right: 20px;
position: relative;
i {
position: absolute;
right: 0px;
top: 1px;
font-size: 30px;
}
}
}
}
.animate {
.option {
.op-btn {
width: 144px;
height: 38px;
border-radius: 0;
color: #053b6a;
line-height: 38px;
background-color: #fff;
cursor: pointer;
position: relative;
border: 1px solid #cccccc;
border-top: 0;
&.active {
background-image: url("../../../assets/images/bac1.png");
}
.left {
position: relative;
margin-right: 30px;
margin-left: 22px;
i {
position: absolute;
top: -7px;
font-size: 20px;
}
}
.right {
display: inline-block;
font-size: 14px;
line-height: 38px;
}
// .btn-wrapper {
// position: fixed;
// right: 32px;
// top: 100px;
// .myBtn {
// display: flex;
// justify-content: space-between;
// .el-btn {
// width: 144px;
// height: 44px;
// background-color: #053b6a;
// margin-right: 22px;
// border-radius: 4px;
// text-align: center;
// line-height: 44px;
// color: #fff;
// cursor: pointer;
// font-size: 18px;
// display: flex;
// justify-content: space-between;
// &.active {
// background: #31eaea;
// color: #053b6a !important;
// }
// .left {
// padding-left: 38px;
// i {
// font-size: 18px;
// }
// }
// .right {
// padding-right: 38px;
// }
// .newLetf {
// margin-left: 20px;
// }
// .newRight {
// margin-right: 20px;
// position: relative;
// i {
// position: absolute;
// right: 0px;
// top: 1px;
// font-size: 30px;
// }
// }
// }
// }
// .animate {
// .option {
// .op-btn {
// width: 144px;
// height: 38px;
// border-radius: 0;
// color: #053b6a;
// line-height: 38px;
// background-color: #fff;
// cursor: pointer;
// position: relative;
// border: 1px solid #cccccc;
// border-top: 0;
// &.active {
// background-image: url("../../../assets/images/bac1.png");
// }
// .left {
// position: relative;
// margin-right: 30px;
// margin-left: 22px;
// i {
// position: absolute;
// top: -7px;
// font-size: 20px;
// }
// }
// .right {
// display: inline-block;
// font-size: 14px;
// line-height: 38px;
// }
&:hover {
background-image: url("../../../assets/images/bac1.png");
}
}
}
}
}
// &:hover {
// background-image: url("../../../assets/images/bac1.png");
// }
// }
// }
// }
// }
.input-card {
display: flex;
flex-direction: column;
......@@ -1373,6 +1368,11 @@ input[type="radio"] {
transition: 0.2s linear;
background: #fff;
// background: red;
opacity: 0;
// 优化抽屉出来回去
&.opacity {
opacity: 1;
}
&.back {
left: -348px;
}
......@@ -1439,21 +1439,21 @@ input[type="radio"] {
// border-right: 1px solid #cccccc;
box-sizing: border-box;
// padding-left: 5px;
color: #053B6A;
color: #053b6a;
font-weight: 600;
}
}
.deviceList {
cursor: pointer;
margin-bottom: 2px;
box-sizing: border-box;
border-bottom: 1px solid #053b6a00;
color: #1D1D1D;
color: #1d1d1d;
&:hover {
box-sizing: border-box;
border-bottom: 1px solid #053b6a;
color: #053B6A;
color: #053b6a;
font-weight: 600;
}
&.topActive {
// border-top: 1px solid #cccccc;
......@@ -1589,18 +1589,6 @@ input[type="radio"] {
// width: 14px;
// height: 14px;
padding: 2px;
&:active {
// border-color: #053b6a;
// color: #053b6a;
// outline: none;
}
&:hover {
// background: #053b6a;
// color: #053b6a;
}
}
.goPage {
// margin-left: 0;
}
.btn-w-num {
display: inline-block;
......@@ -1621,7 +1609,6 @@ input[type="radio"] {
border-radius: 40%;
overflow: hidden;
cursor: pointer;
// background: #fff;
i {
background: #fff;
}
......
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