Skip to content

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

合并到jzl

parent 86967f22
Hide whitespace changes
Inline Side-by-side
Showing with 184 additions and 74 deletions
gassafety-web/src/components/PopWindow/workerManInfowindow.vue → gassafety-web/src/components/PopWindowGis/workerManInfowindow.vue
View file @ 42ff83c0
<template>
<div class="wrapper">
<span class="left">高雄:</span>
<span class="left">高雄高雄:</span>
<span class="right">2019-99-99 15:21:21</span>
</div>
</template>
......@@ -11,22 +11,22 @@ export default {};
<style lang="scss" scoped>
.wrapper{
width: 136px;
width: 166px;
height: 54px;
background: #0D4F88;
font-size: 14px;
color:#fff;
box-sizing: border-box;
padding:7px 0px 7px 10px;
padding:7px 0px 7px 8px;
box-shadow: 0 0 20px -5px #0D4F88;
border-radius: 4px;
span{
word-break: break-all;
display: inline-block;
vertical-align: top;
&.right{
width:90px;
padding-left:4px;
}
}
}
......
gassafety-web/src/components/PopWindowGis/workerManView.vue 0 → 100644
View file @ 42ff83c0
<template>
<el-dialog
:title="title"
:visible.sync="dialogVisible"
:before-close="handleClose"
>
<div>
<el-date-picker
v-model="dateValue"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">取 消</el-button>
<el-button :loading="okLoading" type="primary" @click="ok"
>确 定
</el-button>
</span>
</el-dialog>
</template>
<script>
import MyFileUpload from "@/components/MyFileUpload";
import { addPipe, updatePipe } from "@/api/device/pipe.js";
import { getString } from "@/utils/gassafety.js";
import moment from "moment";
export default {
props: {
id: {
type: String,
},
title:{
type:String,
}
},
components: {},
data() {
return {
dialogVisible: false,
dateValue:"",
};
},
computed: {},
created() {},
methods: {
ok() {},
async requeset(id, data) {
id ? console.log("修改") : console.log("新增");
return id ? updatePipe(data) : addPipe(data);
},
show() {
this.dialogVisible = true;
},
handleClose(done) {
done();
},
},
};
</script>
<style lang="scss">
</style>
gassafety-web/src/utils/gaodeMap.js
View file @ 42ff83c0
......@@ -74,6 +74,17 @@ class gaodeMap {
}
// console.log("抬起来了");
});
// 地图开始平移删除infowindow
this.myMap.on("movestart",()=>{
// console.log("地图平移");
this.closeInfoWindow()
})
// 地图开始缩放删除infowindow
this.myMap.on("zoomstart",()=>{
// console.log("缩放开始")
this.closeInfoWindow()
})
this.districtBoundaries();
}
......
gassafety-web/src/utils/gaodeMapView.js
View file @ 42ff83c0
......@@ -6,11 +6,13 @@ import pipelineView from "../components/PopWindow/pipelineView.vue";
import lineInfoWindow from "../components/PopWindow/lineInfoWindow.vue";
import { delDeviceInfo } from "@/api/device/deviceInfo";
import markerInfoWindow from "../components/PopWindow/markerInfoWindow.vue";
import workerManInfowindow from "../components/PopWindow/workerManInfowindow.vue";
import workerManInfowindow from "../components/PopWindowGis/workerManInfowindow.vue";
import workerManView from "../components/PopWindowGis/workerManView.vue";
import { getArray } from "@/utils/gassafety.js";
import { delPipe } from "@/api/device/pipe.js";
import vue from "../main";
import {Card} from "element-ui"
import { Card } from "element-ui";
let defaultCenter = "石家庄";
export let map;
export const DEVICE_TYPE = {
......@@ -74,8 +76,19 @@ class gaodeMap {
})
.catch(() => {});
}
// //console.log("抬起来了");
});
// 地图开始平移删除infowindow
this.myMap.on("movestart", () => {
// console.log("地图平移");
this.closeInfoWindow();
});
// 地图开始缩放删除infowindow
this.myMap.on("zoomstart", () => {
// console.log("缩放开始")
this.closeInfoWindow();
});
this.districtBoundaries();
}
......@@ -162,40 +175,37 @@ class gaodeMap {
});
this.setMarkerIcon(marker);
// 值班人员的marker
if (DEVICE_TYPE.INSPECTOR == markerType) {
// 存值
const { createTime,locationId,longitude,latitude} = data;
marker.setExtData({createTime, locationId ,pos:[longitude,latitude]});
const { createTime, locationId, longitude, latitude } = data;
marker.setExtData({ createTime, locationId, pos: [longitude, latitude] });
// 值班人员的事件
marker.on("click", e => {
console.log(e);
console.log(e.target.getExtData())
// console.log(Card)
// e.target.content = this.getMarketContent(data);
});
marker.on("mouseover",(e)=>{
// marker.on("click", e => {
// console.log(e);
// console.log(e.target.getExtData());
// // console.log(Card)
// // e.target.content = this.getMarketContent(data);
// });
marker.on("mouseover", e => {
e.target.content = this.getMarketContent(data);
infoWindow.setContent(e.target.content);
infoWindow.open(map, e.target.getPosition());
e.target.cloneDom = infoWindow.dom.cloneNode(true);
// console.log(infoWindow.dom.offsetLeft);
// console.log(infoWindow.dom);
e.target.cloneDom.style.top = infoWindow.dom.offsetTop + 80 + "px";
e.target.cloneDom.style.left = infoWindow.dom.offsetLeft + 100 + "px";
// 先删除之前的，后增加现在的
// this.removeCloneDom();
that.removeCloneDom();
document.body.appendChild(e.target.cloneDom);
that.workerManCloneDom = e.target.cloneDom;
infoWindow.close();
that.addCloneDome(e.target, infoWindow);
// infoWindow.close();
that.workerManInfoWindow = infoWindow;
})
});
marker.on("mousedown", e => {
that.closeInfoWindow();
that.workerManView({title:"值班人员轨迹回放"});
});
}
if (
DEVICE_TYPE.WORKORDER != markerType &&
DEVICE_TYPE.WORKORDER != markerType &&
DEVICE_TYPE.INSPECTOR != markerType
) {
marker.content = this.getMarketContent(data);
......@@ -283,22 +293,9 @@ class gaodeMap {
map.setStatus(options);
infoWindow.setContent(e.target.content);
infoWindow.open(map, e.target.getPosition());
that.addCloneDome(e.target, infoWindow);
// infoWindow.close();
// console.log(infoWindow.dom);
// 这个是为了盖住vue里的东西
e.target.cloneDom = infoWindow.dom.cloneNode(true);
// console.log(infoWindow.dom.offsetLeft);
// console.log(infoWindow.dom);
e.target.cloneDom.style.top = infoWindow.dom.offsetTop + 80 + "px";
e.target.cloneDom.style.left = infoWindow.dom.offsetLeft + 100 + "px";
// 先删除之前的，后增加现在的
// this.removeCloneDom();
that.removeCloneDom();
document.body.appendChild(e.target.cloneDom);
that.markerCloneDom = e.target.cloneDom;
infoWindow.close();
that.markerInfoWindow = infoWindow;
}
}
......@@ -311,7 +308,6 @@ class gaodeMap {
this.markers[i].setDraggable(true);
}
}
/**
* marker移除拖拽事件
*/
......@@ -378,7 +374,6 @@ class gaodeMap {
dom.remove();
return html;
}
}
}
......@@ -463,6 +458,23 @@ class gaodeMap {
}
}
workerManView(options) {
// const {} =options;
const notice = createPop(workerManView, {
// 数据
// lineData: options.lineData,
// lnglatsArr:options.lnglatsArr,
// pipeLength:options.pipeLength,
// //线是新线还是老线
// lineType: options.lineType,
// target: options.obj,
...options,
//把当前对象当作that传进去
gaodeMap: this,
// lineOkCallBack: this.lineOkCallBack
});
notice.show();
}
/**
* 添加折线
* @param path
......@@ -570,21 +582,16 @@ class gaodeMap {
infoWindow.setOffset(new AMap.Pixel(X, Y));
infoWindow.open(map, e.lnglat);
// 这个是为了盖住vue里的东西
polyline.cloneDom = infoWindow.dom.cloneNode(true);
// console.log(infoWindow.dom.offsetLeft);
// console.log(infoWindow.dom);
polyline.cloneDom.style.top = infoWindow.dom.offsetTop + 80 + "px";
polyline.cloneDom.style.left = infoWindow.dom.offsetLeft + 100 + "px";
// 先删除之前的，后增加现在的
this.removeCloneDom();
document.body.appendChild(polyline.cloneDom);
infoWindow.close();
// polyline.infoWindow=infoWindow;
// polyline.cloneDom = infoWindow.dom.cloneNode(true);
// polyline.cloneDom.style.top = infoWindow.dom.offsetTop + 80 + "px";
// polyline.cloneDom.style.left = infoWindow.dom.offsetLeft + 100 + "px";
// // 先删除之前的，后增加现在的
// this.removeCloneDom();
// document.body.appendChild(polyline.cloneDom);
// infoWindow.close();
this.addCloneDome(polyline, infoWindow);
// infoWindow.close();
this.showInfoWindow = infoWindow;
this.cloneDom = polyline.cloneDom;
// const
});
polyline.on("mouseout", e => {
......@@ -598,20 +605,47 @@ class gaodeMap {
// 缩放地图到合适的视野级别
// map.setFitView();
}
// 把map里的in佛window转化成vue里的dom
addCloneDome(target, infoWindow) {
target.cloneDom = infoWindow.dom.cloneNode(true);
target.cloneDom.style.top = infoWindow.dom.offsetTop + 80 + "px";
target.cloneDom.style.left = infoWindow.dom.offsetLeft + 100 + "px";
// 先删除之前的，后增加现在的
this.closeInfoWindow();
document.body.appendChild(target.cloneDom);
this.cloneDom = target.cloneDom;
this.cloneDom.addEventListener("mousedown", e => {
// e.stopPropagation();
console.log("this");
});
infoWindow.close();
}
closeInfoWindow() {
this.removeCloneDom();
this.showInfoWindow && this.showInfoWindow.close();
// 删除浮动到线上的cloneDom
this.markerInfoWindow && this.markerInfoWindow.close();
this.workerManInfoWindow && this.workerManInfoWindow.close();
}
// 关闭转化到vue的dom
removeCloneDom() {
// 线
this.cloneDom && document.body.removeChild(this.cloneDom);
// 设备
this.markerCloneDom && document.body.removeChild(this.markerCloneDom);
// this.markerCloneDom && document.body.removeChild(this.markerCloneDom);
// 值班人员
this.workerManCloneDom && document.body.removeChild(this.workerManCloneDom);
// that.workerManInfoWindow = infoWindow;
// this.workerManCloneDom && document.body.removeChild(this.workerManCloneDom);
// that.workerManInfoWindow = infoWindow;
this.cloneDom = null;
this.markerCloneDom = null;
this.workerManCloneDom = null;
// 关闭以前的infowindow
// this.markerCloneDom = null;
// this.workerManCloneDom = null;
}
// 新建line增加编辑以及右键菜单
// 创建一条新的线
createNewLine() {
......@@ -642,13 +676,7 @@ class gaodeMap {
this.newLineObj = null;
}
}
// 新建line增加编辑以及右键菜单
closeInfoWindow() {
this.showInfoWindow && this.showInfoWindow.close();
// 删除浮动到线上的cloneDom
this.removeCloneDom();
this.markerInfoWindow && this.markerInfoWindow.close();
}
// 新line与老line添加点击事件
newLineAddEvent(obj) {
obj.polyEditor = new AMap.PolyEditor(map, obj);
......@@ -806,6 +834,7 @@ class gaodeMap {
});
notice.show();
}
/**
* 添加鼠标事件
*/
......
gassafety-web/src/views/device/map/index.vue
View file @ 42ff83c0
......@@ -360,6 +360,7 @@ export default {
this.gaoMap.closeAddMarker();
this.gaoMap.removeMarkerDragg();
this.gaoMap.mapOperateType = "normal";
this.leftBarNum=[1,2,3,4,7]
// map.remove(this.gaodeMap.markerOverlays);
},
search() {
......@@ -404,6 +405,8 @@ export default {
this.targetNum = 0;
map.clearMap();
this.initMap();
this.leftBarNum=[1,2,3,4,7];
this.keyWord="";
},
},
......
gassafety-web/src/views/enterprise/mapView/index.vue
View file @ 42ff83c0
......@@ -183,7 +183,7 @@ export default {
initMap() {
let gaoMap = new gaodeMap("石家庄");
this.gaoMap = gaoMap;
window.addEventListener("click", this.barClose);
window.addEventListener("mousedown", this.barClose);
gaoMap.addMouseTool();
gaoMap.searchTips("tipinput");
this.getDeviceInfo();
......
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