地图修改

zengh

2022-02-19 769a7477d69523bb70855fd329f8cfc4ddf74cca

地图修改

 public/grabOrdersMap/js/vueMain.js

@@ -39,6 +39,19 @@
        onPosition: false, //持续定位指示
    },
    methods: {
        setUniAppMsg(data) {
            // console.log(data)
            // console.log(uni)
            uni.postMessage({
                data: {
                    action: 'message'
                }
            });
            uni.getEnv(function(res) {
                console.log('当前环境：' + JSON.stringify(res));
            });

        },
        openAPP(type) {
            // console.log(type)
            let that = this;
@@ -50,9 +63,10 @@
                    });
                } else if (that.data.butCT == "begin") {
                    // 开始任务
                    // uni.navigateTo({
                    //     url: '/pages/grabOrders/feedback?data=' + JSON.stringify(this.data)
                    // });
                    this.setUniAppMsg({
                        type: "begin",
                        data: that.data
                    })
                }
            } else {
                this.$confirm('是否参与活动：' + this.data.rname + "?", '提示', {
@@ -103,7 +117,7 @@
                district: "西湖区",
                id: 37,
                integral: "222",
                iscation: "0",
                iscation: "1",
                jnum: 3,
                line: "LINESTRING(115.8995839881188 28.687205773173343,115.89391916267935 28.678966027079593,115.90404718391959 28.673644524394046,115.91211526863638 28.681369286356936)",
                num: 1,
@@ -116,7 +130,7 @@
                serid: "1123598821738675201,",
                team: "你,他,它",
                time: "2022-02-18 14:15:52",
                type: "0",
                type: "2",
                url: "http://223.82.109.183:2081/zhba/upload/20220218/67f0c8bf3e7b5024c64133691f265072.ico",
            }
            //url解码
@@ -633,7 +647,8 @@
                if (res.state === true || res.state === false) {
                    that.map.invalidateSize(true);
                }
                document.getElementsByClassName("dingwei")[0].style.bottom = res.height + 10 + "px";
                document.getElementsByClassName("dingwei")[0].style.bottom = res.height +
                    10 + "px";
            },
        });
        this.domMove.init();

 public/loginMap/css/body.css

@@ -18,7 +18,7 @@

#map {
    width: 100%;
    height: 50%;
    height: 100%;
    z-index: 1;
}


 public/loginMap/js/vueMain.js

@@ -12,50 +12,68 @@
        LxdhLine: null,

        activeName: 'first',


        //存放实时坐标
        lat: "",
        lng: "",
        seedata: '',
        nowPosition: '',
        resultFeedbackPopupShow: false,
        popupDisplay: "none",
    },
    methods: {
        getDataList() {
            var that = this;
            that.beginCome();
        getDataList () {
            var that = this
            that.beginCome()
        },
        beginCome() {
        beginCome () {
            var data = [{
                    "id": '100000',
                    "place": '无数据',
                    "state": '0',
                    "dtype": '0',
                    "size": '300',
                    "jd": "115.822311",
                    "wd": "28.646341"
                }]
                //url解码
            this.getdata = this.getQueryVariable('data') || data;
            this.map = this.beginMap(this.map, this.getdata); //创建并接受map
            this.map.invalidateSize(true); //应用地图高度
                "id": '100000',
                "place": '无数据',
                "state": '0',
                "dtype": '0',
                "size": '300',
                "jd": "115.822311",
                "wd": "28.646341"
            }]
            //url解码
            this.getdata = this.getQueryVariable('data') || data
            this.map = this.beginMap(this.map, this.getdata) //创建并接受map
            this.map.invalidateSize(true) //应用地图高度
        },
        //url解码
        getQueryVariable(variable) {
            var query = window.location.search.substring(1);
            var vars = query.split("&");
        getQueryVariable (variable) {
            var query = window.location.search.substring(1)
            var vars = query.split("&")
            for (var i = 0; i < vars.length; i++) {
                var pair = vars[i].split("=");
                if (pair[0] == variable) { return JSON.parse(decodeURI(pair[1])); } //解码url 和 JSON
                var pair = vars[i].split("=")
                if (pair[0] == variable) { return JSON.parse(decodeURI(pair[1])) } //解码url 和 JSON
            }
            return (false);
            return (false)
        },
        beginMap(map, data) {
        beginMap (map, data) {
            var that = this,
                center = [data[0].wd, data[0].jd],
                url = `http://223.82.109.183:2082/api/alarm/alarm/APP-getAlarm?id=${data[0].id}`;
                url = `http://223.82.109.183:2082/api/alarm/alarm/APP-getAlarm?id=${data[0].id}`
            // url = `http://localhost:89/alarm/alarm/APP-getAlarm?id=${data[0].id}`;
            this.nowPosition = center;
           
            this.nowPosition = center

            axios.post(url).then((res) => {
                if (res.data.data.length != 0) {
                    var dat = res.data.data[0]
                    for (var key in dat) {
                        if (dat[key] == null || dat[key] == '') {
                            dat[key] = '暂无'
                        }
                    }
                    this.seedata = dat

                } else {
                    this.seedata = data[0]
                }
            })

            var createMap = () => {
                map = L.map('map', { //初始化地图
                    center: center,
@@ -64,78 +82,78 @@
                    maxZoom: 17,
                    attributionControl: false, //去掉右下角
                    zoomControl: false, //去掉缩放
                });
                })
                L.tileLayer( //添加切片图层
                    // "https://webmap-tile.sf-express.com/MapTileService/rt?x={x}&y={y}&z={z}", {//顺丰地图
                    "https://webmap-tile.sf-express.com/MapTileService/rt?fetchtype=static&x={x}&y={y}&z={z}&project=sfmap&pic_size=256&pic_type=png8&data_name=361100&data_format=merged-dat&data_type=normal", { //顺丰地图
                    }
                ).addTo(map);
                }
                ).addTo(map)
            }
            createMap();
            createMap()

            markers.on('click', function(a) {
            this.nowPosition = center

            });
            this.nowPosition = center;
            return map; //抛出map
            return map //抛出map
        },

        //定位当前位置
        locationMap() {
            this.map.setView([this.lat, this.lng], 20);
        locationMap () {
            this.map.setView([this.lat, this.lng], 20)
        },
        getLocationData() {
            var that = this;
            var geolocation = new qq.maps.Geolocation("T7RBZ-62U3X-RSQ4P-ZZVCB-WE7JT-HRBOG", "mapqq");
            var positionNum = 0;

        getLocationData () {
            var that = this
            var geolocation = new qq.maps.Geolocation("T7RBZ-62U3X-RSQ4P-ZZVCB-WE7JT-HRBOG", "mapqq")
            var positionNum = 0
            var options = {
                timeout: 8000
            };
            }

            function showPosition(position) {
                var adCode = position.adCode; //邮政编码
                var nation = position.nation; //中国
                var city = position.city; //城市
                var addr = position.addr; //详细地址
                that.lat = position.lat; //
                that.lng = position.lng; //火星坐标 //TODO 实现业务代码逻辑 
            function showPosition (position) {
                var adCode = position.adCode //邮政编码
                var nation = position.nation //中国
                var city = position.city //城市
                var addr = position.addr //详细地址
                that.lat = position.lat //
                that.lng = position.lng //火星坐标 //TODO 实现业务代码逻辑 

                if (that.LXdhStart != null) {
                    that.map.removeLayer(that.LXdhStart);
                    that.map.removeLayer(that.LXdhStart)
                }

                //绘制起点和终点
                that.LXdhStart = L.markerClusterGroup();
                that.LXdhStart = L.markerClusterGroup()

                var transportIcon = L.Icon.extend({ //图标初始化
                    options: {
                        iconSize: [50, 50], // 图标尺寸
                    }
                });
                })

                var qd = new transportIcon({
                    iconUrl: './img/dingw.gif'
                });
                })

                that.LXdhStart.addLayer(L.marker([that.lat, that.lng], {
                    icon: qd,
                }));
                }))

                that.map.addLayer(that.LXdhStart);
                that.map.addLayer(that.LXdhStart)

            };

            function showErr() {
            function showErr () {
                //TODO 如果出错了调用此方法 
            };

            geolocation.getLocation(showPosition, showErr, options);
            geolocation.getLocation(showPosition, showErr, options)
        },

    },
    created() {},
    mounted() {
        this.getDataList();
        this.getLocationData();
    created () { },
    mounted () {
        this.getDataList()
        this.getLocationData()
    },
    wacth: {}
})

 public/loginMap/loginMap.html

@@ -60,11 +60,9 @@
            <img style="width: 80%;height: 80%;" src="./img/dingwei.png" alt="">
        </div>
        <div id="map">
            <div class="title" @click="titleClick">
                <span class="device-name">{{seedata.deviceName}}</span>
                <span class="device-number">{{seedata.deviceNumber}}</span>
            </div>
          
        </div>
       
    </div>
    <!-- vue渲染 -->
    <script src="./js/vueMain.js"></script>

 src/views/activitys/real.vue

@@ -377,11 +377,11 @@
            prop: "rtype",
            type: "select",
            span: 6,
            value: "0",
            value: "2",
            dicData: [
              {
                label: "任务开始",
                value: "0",
                value: "2",
              },
              {
                label: "正在进行",
@@ -389,7 +389,7 @@
              },
              {
                label: "任务结束",
                value: "2",
                value: "0",
              },
            ],
            // label: "任务状态",
@@ -482,7 +482,7 @@
            slot: true,
            rules: [
              {
                required: false,
                required: true,
                message: "请选择所属辖区",
                trigger: "click"
              }
@@ -679,7 +679,7 @@
      // console.log(row);
      // return;
      var userId1 = this.userInfo.user_id;
      var username = this.userInfo.user_name;
      var username = this.userInfo.nick_name;
      let d = {
        line: row.line, //路线
        rname: row.rname, //标题