南昌市物联网技防平台-前端
liuyg
2021-04-24 0a6ef5b319ab9e18405a4f115a3c852955533194
Merge branch 'master' of http://192.168.0.105:10010/r/jfpt-Vue
3 files modified
104 ■■■■ changed files
public/map/widgets/securityMap/SecurityMap.css 9 ●●●●● patch | view | raw | blame | history
public/map/widgets/securityMap/SecurityMap.js 91 ●●●● patch | view | raw | blame | history
src/views/clientManagement/clientManagement.vue 4 ●●●● patch | view | raw | blame | history
public/map/widgets/securityMap/SecurityMap.css
@@ -52,14 +52,17 @@
.tips {
    width: 120px;
    height: 18px;
    height: 26px;
    background-color: #ffffff;
    position: absolute;
    display: none;
    border-radius: 5px;
    border-radius: 4px;
    border: 1px solid #3385FF;
}
.tips span {
    line-height: 18px;
    line-height: 26px;
    font-size: 10px;
    position: absolute;
    left: 7px;
}
public/map/widgets/securityMap/SecurityMap.js
@@ -135,6 +135,7 @@
        polygonFlag: false,
        editToolbar: null,
        addPolygonEntitys: null,
        addLineEntitys: null,
        //是否选中电子围栏区域
        isChecked: false,
@@ -185,6 +186,12 @@
                id: 'addPolygonEntitys'
            });
            // 添加线的图层
            this.addLineEntitys = new GraphicsLayer({
                id: 'addLineEntitys'
            });
            // 添加所有图层的地方
            this.entityPolygonAll = new GraphicsLayer({
                id: 'entityPolygonAll'
@@ -193,6 +200,7 @@
            this._map.addLayer(this.addEntitys);
            this._map.addLayer(this.addPolygonEntitys);
            this._map.addLayer(this.addLineEntitys);
            this._map.addLayer(this.entityPolygonAll);
        },
@@ -342,9 +350,14 @@
            //鼠标右击事件
            document.getElementById('mainMapWidget').onmousedown = function(event) {
                //去除系统默认右键功能
                event.preventDefault();
                document.oncontextmenu = function() {
                        //alert("当前页面不能使用右键!");
                        return false;
                    }
                    //event.preventDefault();
                if (event.button == 2) {
                    if (that.polygonFlag == true) {
                        if (that.polygonData.length >= 2) {
                        // 勾画最后一个点
                        var normalizedVal = webMercatorUtils.xyToLngLat(event.mapPoint.x, event.mapPoint.y);
                        that.polygonData.push([normalizedVal[0], normalizedVal[1]]);
@@ -386,16 +399,21 @@
                                    that.polygonData = [];
                                    //新增按钮颜色改回
                                    $("#insertEngineeringMap").css("color", "#757575");
                                }
                            }
                        })
                    }
                                        //清空线图层信息
                                        that.addLineEntitys.clear();
                    //修改电子围栏数据状态
                    that.isEngineer = true;
                    //修改电子围栏选中状态
                    that.isChecked = false;
                    //修改电子围栏编辑状态
                    that.polygonFlag = false;
                                    }
                                }
                            })
                        }
                    }
                }
            }
        },
@@ -406,8 +424,10 @@
            var self = this;
            self._map.onClick = mapClick;
            //点击事件
            function mapClick(evt) {
                //坐标格式转换
                var normalizedVal = webMercatorUtils.xyToLngLat(evt.mapPoint.x, evt.mapPoint.y);
                var y = self._map.toMap({
                    spatialReference: '4326',
@@ -415,7 +435,6 @@
                    x: evt.screenPoint.x,
                    y: evt.screenPoint.y,
                });
                // 编辑中的
                if (self.polygonFlag == true) {
@@ -459,10 +478,10 @@
            }
            // 提示信息
            // 鼠标移动监听事件
            $(document).off('mousemove').mousemove(function(ev) {
                var oEvent = ev || event;
                //鼠标移动
                //鼠标移动,提示语
                var oDiv1 = document.getElementById('securityMapTips1');
                var oDiv2 = document.getElementById('securityMapTips2');
                var oDiv3 = document.getElementById('securityMapTips3');
@@ -490,14 +509,35 @@
                        oDiv3.style.top = oEvent.clientY + scrollTop + 'px';
                        oDiv3.style.display = 'block';
                    }
                    //已经有一个点或以上
                    if (self.polygonData.length >= 1) {
                        //鼠标移动,上个点和当前点之间画线
                        //临时的线数据
                        var tempLineData = [];
                        //鼠标当前点的数据
                        var normalizedVal = webMercatorUtils.xyToLngLat(oEvent.originalEvent.mapPoint.x, oEvent.originalEvent.mapPoint.y);
                        //获取面数据
                        var polygonArr = self.polygonData;
                        //上个点的数据
                        var prevPointArr = polygonArr[self.polygonData.length - 1];
                        //封装数据
                        tempLineData.push([prevPointArr[0], prevPointArr[1]]);
                        tempLineData.push([normalizedVal[0], normalizedVal[1]]);
                        console.log(tempLineData, 123);
                        //画线
                        self.addLine(self.addLineEntitys, tempLineData);
                    }
                } else {
                    oDiv3.style.display = 'none';
                }
                //编辑电子围栏提示语
                if (that.editToolbarStatus) {
                    $("#securityMapTips4").css("width", "200px");
                    $("#securityMapTips4").css("height", "36");
                    $("#securityMapTips4").css("width", "220px");
                    $("#securityMapTips4").css("height", "40px");
                    $("#securityMapTips4").css("line-height", "20px");
                    $("#securityMapTips4 span").css("line-height", "20px");
                    var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
                    var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
                    oDiv4.style.left = oEvent.clientX + scrollLeft + 15 + 'px';
@@ -510,12 +550,39 @@
            })
        },
        //新增线
        /**
         * 新增线图层
         * @param {*} entitys  addPolygonEntitys
         * @param {*} path  坐标点的数据
         */
        addPolyline: function(entitys, path) {
            entitys.clear();
            var polylineSymbol = new SimpleLineSymbol();
            polylineSymbol.color = [255, 0, 0, 1];
            polylineSymbol.width = 4;
            polylineSymbol.width = 2;
            var polyline = new Polyline({
                "paths": [path],
                "spatialReference": {
                    "wkid": 4326
                }
            });
            entitys.add(new Graphic(polyline, polylineSymbol));
        },
        /**
         * 新增线图层
         * @param {*} entitys  addLineEntitys
         * @param {*} path  坐标点的数据
         */
        addLine: function(entitys, path) {
            entitys.clear();
            var polylineSymbol = new SimpleLineSymbol();
            //var polylineSymbol = new SimpleMarkerSymbol();
            polylineSymbol.color = [255, 0, 0, 1];
            polylineSymbol.width = 2;
            polylineSymbol.style = "short-dot";
            var polyline = new Polyline({
                "paths": [path],
                "spatialReference": {
src/views/clientManagement/clientManagement.vue
@@ -488,13 +488,11 @@
            {
              label: "经度",
              hide: true,
              addDisplay: false,
              prop: "jd",
            },
            {
              label: "纬度",
              hide: true,
              addDisplay: false,
              prop: "wd",
            },
            {
@@ -582,12 +580,14 @@
      "form.oneId":{
        handler(val) {
          var that = this;
          if (val != null && val !=""){
          getBaTree(val).then(res => {
            if (res) {
              that.form.onePhone = res.data.data.records[0].phone;
              that.form.oneContacts = res.data.data.records[0].name;
            }
          });
          }
        },
      }
    },