+

liuyg

2021-07-02 e3be7edc5564f1723b87ec82442a3877be894c22

+

 pages.json

@@ -275,6 +275,15 @@
            }
        },
        {
            "path": "pages/poput/mapJQtijiao/mapJQtijiao/mapJQtijiao",
            "name": "mapJQtijiao",
            "style": {
                "navigationBarTitleText": "处理结果",
                "enablePullDownRefresh": false,
                "navigationStyle": "custom"
            }
        },
        {
            "path": "pages/error-page/403",
            "style": {
                "navigationBarTitleText": "403"

 pages/alarm_list/alarm_list.vue

@@ -219,11 +219,46 @@
                    datas.state = 0;
                    datas.dtype = 0;
                    datas.size = 300;
                    datas.userid = this.$store.state.puserID;
                    datas.username = this.$store.state.puserName;
                    datas.url = this.$store.state.piAPI + "/alarm/alarm/APP-setAlarm";
					
					
                    datas.jd = 114.91385;//模拟位置
                    datas.wd = 25.81051;//模拟位置
                    // datas.wd = 25.81051;//模拟位置
					
					
                    var data = [datas]; //传给地图的参数
                    console.log(data) 
                    uni.navigateTo({
                        url: '/pages/map/map?data=' + JSON.stringify(data)
                        url: '/pages/map/map?data=' + JSON.stringify(data) + '&html=xcxMapJQLG/xcxmap.html'
                    })
                }
                // receives() {// 接受任务
                //     var url = this.$store.state.piAPI + "/alarm/alarm/APP-setAlarm",
                //         Pid = this.Pdata.id,
                //         id = this.$store.state.puserID, //警察id
                //         name = this.$store.state.puserName, //警察id
                //         data = {
                //             id: Pid,
                //             securityId: id,
                //             alarmPeople: name
                //         },
                //         that = this;
                //     // console.log(data);
                //     wx.request({
                //         url: url,
                //         data: data,
                //         header: {
                //             "content-type": "application/x-www-form-urlencoded"
                //         },
                //         method: 'POST',
                //         success(res) {
                //             // console.log(res.data.msg);
                //         }
                //     })
                // },
            },

            //触摸遮罩事件

 pages/map/MapJQLG.vue

New file
@@ -0,0 +1,41 @@
<template>
    <view class="content">
        <web-view :src="urls"></web-view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                urls: '',
                // dataList: [],
            }
        },
        methods: {},
        mounted() {},
        onLoad: function(options) {
            var data = [];
            if (options.data == undefined) {
                data = [{
                    "id": '100000',
                    "place": '无数据',
                    "state": '0',
                    "dtype": '0',
                    "size": '300',
                    "jd": "115.822311",
                    "wd": "28.646341"
                }]
                data = JSON.stringify(data);
            }else{
                data = options.data;
            }
            this.urls = "http://s16s652780.51mypc.cn/xcxMapJQLG/xcxmap.html?data=" + data;
            // this.dataList = data;
            console.log(this.urls);
        },
    }
</script>

<style>
</style>

 pages/map/map.vue

@@ -27,12 +27,15 @@
                    "wd": "28.646341"
                }]
                data = JSON.stringify(data);
            }else{
            } else {
                data = options.data;
            }
            this.urls = "http://s16s652780.51mypc.cn/xcxMapJQ/xcxmap.html?data=" + data;
            console.log(options.html)
            var a = options.html != undefined ? options.html : "xcxMapJQ/xcxmap.html";
            console.log(a)
            this.urls = "http://s16s652780.51mypc.cn/" + a + "?data=" + data;
            // this.dataList = data;
            console.log(this.urls);
            // console.log(this.urls);
        },
    }
</script>

 pages/poput/mapJQtijiao/mapJQtijiao/mapJQtijiao.vue

New file
@@ -0,0 +1,305 @@
<template>
    <view class="mapJQtijiao">
        <view class="head">
            <u-navbar :is-fixed="false" :border-bottom="false" :is-back="false" title=""
                :background="{ background: '#0cd7e5' }">
                <div>
                    处理结果
                </div>
            </u-navbar>
        </view>
        <view class="mapJQtijiaomain">
            <view class="title" style="padding-top: 0.5rem;">请输入处理结果:</view>
            <view class="f">
                <view class="main" style="margin:0 1rem;">
                    <textarea rows="9" cols="27" placeholder="请输入处理结果。" v-model="longInputD"></textarea>
                </view>
            </view>
            <view class="title">照片上传:</view>
            <view class="t">
                <view class="main">
                    <image @tap="takePhoto" src="../../../../static/JQimg/相机.png" mode=""></image>
                </view>
            </view>
            <seeImgs :imgs="imgs" :videos="[]" @del="delImg" :type="'imgs'"></seeImgs>
            <view class="title">视频上传:</view>
            <view class="s">
                <view class="main">
                    <image @tap="takeVideo" src="../../../../static/JQimg/视频.png" mode=""></image>
                </view>
            </view>
            <seeImgs :imgs="[]" :videos="videos" @del="delVideo" :type="'videos'"></seeImgs>
            <view class="butb" @click="upData">
                提交
            </view>
        </view>
    </view>
</template>

<script>
    import seeImgs from '../../../../components/seeImges/seeImges.vue'
    export default {
        components: {
            seeImgs
        },
        data() {
            return {
                datas: '',
                longInputD: '',
                imgs: [],
                videos: [],
            }
        },
        methods: {
            upData() {
                console.log('开始上传');
                var dataList = {
                    jid: this.datas.id,
                    sname: this.$store.state.puserName,
                    phone: this.$store.state.puserIphone,
                    snumber: this.$store.state.puserID,
                    result: this.longInputD,
                    status: 0,
                    tpaddress: '',
                    spaddress: ''
                };
                if (this.imgs.length > 0) {
                    var i = this.imgs;
                    for (var k in i) {
                        // console.log(i[k].src)
                        dataList.tpaddress += i[k].src + ','
                    }
                }
                if (this.videos.length > 0) {
                    var i = this.videos;
                    for (var k in i) {
                        // console.log(i[k].src)
                        dataList.spaddress += i[k].src + ','
                    }
                }
                // console.log(dataList)
                wx.showLoading({
                    title: "提交中...",
                    mask: true
                })
                wx.request({
                    url: 'http://s16s652780.51mypc.cn/api/feedback/feedback/saves', //仅为示例，并非真实接口地址。
                    data: dataList,
                    method: 'POST',
                    header: {
                        "Content-Type": "application/x-www-form-urlencoded"
                    },
                    success: (res) => {
                        if (res.data.code == 200) {
                            wx.showToast({
                                title: '提交成功！',
                                duration: 2000
                            });
                        }
                    }
                });
            },
            takePhoto() {
                var that = this;
                wx.chooseImage({
                    count: 4, //可选择数量，默认9
                    sizeType: ['compressed', 'original'], //上传压缩图,原图
                    sourceType: ['album', 'camera'], //从相册选择或从使用相机
                    success: async (res) => {
                        for (var i = 0; i < res.tempFiles.length; i++) {
                            if (res.tempFiles[i].size > 10 * 1024 * 1000) { //上传图片大小限制
                                uni.showToast({
                                    title: "照片大小不能10MB",
                                    icon: "none"
                                })
                                return
                            }
                        }
                        var tempFilePath = res.tempFilePaths;
                        // try {
                        wx.showLoading({
                            title: "上传中...",
                            mask: true
                        })
                        var that = this;
                        // 循环调用uni.uploadFile ，因微信小程序只支持单文件上传
                        for (var i = 0; i < tempFilePath.length; i++) {
                            wx.uploadFile({
                                // url: 'https://web.byisf.com/api/depl/put-depl', //仅为示例，非真实的接口地址
                                url: 'http://web.byisf.com:82/blade-jfpts/depl/put-depl',
                                filePath: tempFilePath[i],
                                name: 'file',
                                formData: {
                                    'user': 'test' // 上传附带参数
                                },
                                success: (data) => {
                                    wx.showToast({
                                        title: '上传图片成功！',
                                        duration: 1000
                                    });
                                    // 根据接口具体返回格式   赋值具体对应url
                                    that.imgs.push({
                                        id: i,
                                        src: JSON.parse(data.data).data
                                    })
                                }
                            });
                        }
                        // } catch (e) {
                        //     console.log(e);
                        //     wx.showToast({
                        //         title: '上传图片失败！',
                        //         duration: 2000
                        //     });
                        // } finally {
                        //     wx.hideLoading();
                        // }
                    }
                });
            },
            delImg(index) {
                this.imgs.splice(index, 1);
                // console.log(this.imgs)
            },
            takeVideo() {
                var that = this;
                wx.chooseVideo({
                    sourceType: ['album', 'camera'],
                    maxDuration: 60,
                    camera: 'back',
                    success(res) {
                        var tempFilePath = res.tempFilePath;
                        // try {
                        wx.showLoading({
                            title: "上传中...",
                            mask: true
                        })
                        wx.uploadFile({
                            // url: 'https://web.byisf.com/api/depl/put-depl', //仅为示例，非真实的接口地址
                            url: 'http://web.byisf.com:82/blade-jfpts/depl/put-depl',
                            filePath: tempFilePath,
                            name: 'file',
                            formData: {
                                'user': 'test' // 上传附带参数
                            },
                            success: (data) => {
                                wx.showToast({
                                    title: '上传视频成功！',
                                    duration: 1000
                                });
                                //         // 根据接口具体返回格式   赋值具体对应url
                                that.videos.push({
                                    id: that.videos.length,
                                    src: JSON.parse(data.data).data
                                })
                                // console.log(JSON.parse(data.data).data)
                            }
                        });
                        // } catch (e) {
                        // console.log(e);
                        // wx.showToast({
                        //     title: '上传视频失败！',
                        //     duration: 2000
                        // });
                        // } finally {
                        // wx.hideLoading();
                        // }
                    }
                })
            },
            delVideo(index) {
                this.videos.splice(index, 1);
                // console.log(this.imgs)
            },
        },
        onLoad(e) {
            if (e.id == undefined) {
                e = {
                    id: 422
                }
            }
            console.log(e);
            this.datas = e;
        }
    }
</script>

<style lang="scss">
    .mapJQtijiao {
        width: 100%;
        height: 100%;
        margin: 0 auto;

        .head {
            position: relative;
            top: 0;
            left: 0;
            z-index: 1;
            font-size: 16px;
            font-weight: 600;
            text-align: center;

            div {
                width: 100%;
                border: 1px solid rgba($color: #000000, $alpha: 0);
            }
        }

        .mapJQtijiaomain {
            width: 100%;
            height: 100%;
            // border: 1px solid #000000;
            box-sizing: border-box;
            background-color: #efefef;

            .title {
                margin-left: 1rem;
                margin-bottom: 0.5rem;
            }
        }

        .f {
            background-color: #fff;
            padding: 0.5rem 0 0.5rem 0;
            margin-bottom: 0.5rem;

            .main {
                margin: 0.5rem;
                border: 1px solid rgba($color: #000000, $alpha: 0.5);
            }
        }

        .t,
        .s {
            background-color: #fff;
            padding: 0.5rem 0 0.5rem 0;
            margin-bottom: 0.5rem;
            display: flex;
            align-items: center;

            .main {
                image {
                    width: 3rem;
                    height: 3rem;
                    margin-left: 1rem;

                }
            }
        }


        .butb {
            margin: 2rem auto;
            width: 6rem;
            height: 3rem;
            // border: 1px solid rgb(46, 118, 228);
            border-radius: 1rem;
            display: flex;
            font-size: 18px;
            align-items: center;
            justify-content: center;
            color: #fff;
            background-image: linear-gradient(to right, #4adeff, #55ffff);
        }
    }
</style>

 static/JQimg/相机.png

 static/JQimg/视频.png

 xcxMapJQLG/css/body.css

@@ -1,49 +1,122 @@
page {
    width: 100%;
    height: 100%;
    background-color: rgb(138, 138, 138, 0.1);
    width: 100%;
    height: 100%;
    background-color: rgb(138, 138, 138, 0.1);
}

body {
    padding: 0;
    margin: 0;
    padding: 0;
    margin: 0;
}

html,
body,
#mapVue {
    width: 100%;
    height: 100%;
    width: 100%;
    height: 100%;
}

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

#mapVue {
    overflow: hidden;
    /* border: solid 1px springgreen; */
    overflow: hidden;
    /* border: solid 1px springgreen; */
}

.dingwei {
    position: fixed;
    width: 38px;
    height: 38px;
    bottom: 8.5rem;
    right: 0;
    z-index: 100;
    background-color: #fff;
    border-radius: 40%;
    opacity: 0.8;
    /* border: 1px solid gray; */
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    width: 38px;
    height: 38px;
    bottom: 8.5rem;
    right: 0;
    z-index: 10;
    background-color: #fff;
    border-radius: 80%;
    opacity: 0.8;
    /* border: 1px solid gray; */
    display: flex;
    align-items: center;
    justify-content: center;
}

#Dmain{
.shuaxin {
    position: fixed;
    width: 38px;
    height: 38px;
    bottom: 11.5rem;
    right: 0;
    z-index: 10;
    background-color: #fff;
    border-radius: 80%;
    opacity: 0.8;
    /* border: 1px solid gray; */
    display: flex;
    align-items: center;
    justify-content: center;
}

.baozu {
    position: fixed;
    width: 38px;
    height: 100px;
    top: 8.5rem;
    right: 5px;
    z-index: 10;
    background-color: #fff;
    border-radius: 5rem;
    /* opacity: 0.8; */
    /* border: 1px solid gray; */
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    flex-direction: column;
}

.baozu .bz-once {
    width: 38px;
    height: 40px;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    /* border: 1px solid gray; */
}

#Umain {
    position: fixed;
    width: 100%;
    /* margin-left: 2.5%; */
    height: 7.5rem;
    top: 0;
    z-index: 10;
    /* border: #0000FF 1px solid; */
    background-color: #fff;
    border-radius: 0 0 1rem 1rem;
}

#Umain .Um-m {
    width: 100%;
    height: 33%;
    display: flex;
    align-items: center;
    padding-left: 1rem;
}

#Umain .Um-m img {
    margin-right: 0.5rem;
}

#Umain .Um-m .um-m-t {
    font-size: 14px;
    font-weight: 300;
}

#Dmain {
    position: fixed;
    width: 95%;
    margin-left: 2.5%;
@@ -54,17 +127,20 @@
    background-color: #fff;
    border-radius: 1rem;
}
#title{

#title {
    /* border: #0000FF 1px solid; */
    display: flex;
    align-items: center;
    height: 3.5rem;
}
.t-fz,.t-mi{

.t-fz,
.t-mi {
    margin-left: 1rem;
}

#bot{
#bot {
    /* border: #0000FF 1px solid; */
    height: 4rem;
    display: flex;
@@ -72,7 +148,8 @@
    justify-content: center;
    width: 100%;
}
#bot button{

#bot button {
    width: 80%;
    height: 2.8rem;
    border: none;
@@ -81,6 +158,66 @@
    color: #fff;
}

#bot button:hover{
#bot button:hover {
    background-color: #1abbff;
}
}

#loding {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(125, 125, 125, 0.5);
    z-index: 11;
}

#loding .titles {
    width: 10rem;
    height: 4rem;
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 1rem;
    position: absolute;
    left: calc(50% - 5rem);
    top: calc(50% - 2.5rem);
    /* line-height: 1.5rem; */
    /* padding: 0 0 0 1rem; */
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-around;
    flex-direction: column;
}

#SubmitDown {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: #fff;
    z-index: 12;
}

#SubmitDown .S-use {
    width: 100%;
    height: auto;
    /* border: 1px solid #0000FF; */
    box-sizing: border-box;
    padding: 2rem 0.5rem 0 0.5rem;
}

#SubmitDown textarea {
    width: 100%;
}

.ups {
    padding-top: 0.5rem !important;
}

#S-tijiao {
    width: 50%;
    position: relative;
    top: 2rem;
    left: 25%;
}

 xcxMapJQLG/img/zd.png

 xcxMapJQLG/img/zd2.png

 xcxMapJQLG/img/刷新.png

 xcxMapJQLG/img/定位.png

 xcxMapJQLG/img/打开.png

 xcxMapJQLG/img/排队数.png

 xcxMapJQLG/img/提示.png

 xcxMapJQLG/img/文件.png

 xcxMapJQLG/js/vueMain.js

@@ -24,6 +24,14 @@
        shipingM3u8Url: '',
        resultFeedbackPopupShow: false,
        popupDisplay: "none",

        haveShishiweizhi: 1,
        isFromJQ: false,
        chulijieguo: '',
        wentifankui: '',
        oldlat: '',
        oldlng: '',

    },
    methods: {
        getDataList() {
@@ -37,26 +45,58 @@
                "state": '0',
                "dtype": '0',
                "size": '300',
                "jd": "115.822311",
                "wd": "28.646341"
                "jd": "114.91385",
                "wd": "25.81051"
            }]
            //url解码
            // this.getdata = this.getQueryVariable('data') || data;
            this.getdata = data;
            this.getdata = this.getQueryVariable('data') || data;
            // this.getdata = data;
            this.changeDom(this.getdata[0]);
            this.map = this.beginMap(this.map, this.getdata); //创建并接受map
            // this.move = new myDomMove('#seedata', '.title', '#map');
            this.map.invalidateSize(true); //应用地图高度
            // this.move.followFinger(this.map, 'down');
            this.lat = data[0].wd;
            this.lng = data[0].jd;
            this.oldlat = data[0].wd;
            this.oldlng = data[0].jd;
        },
        changeDom(data) {
            console.log(data, 'changeDom');

            function changeDoms(dom, item) {
                $(dom).empty();
                $(dom).append(item);
            }
            changeDoms('#um-m-t-bz', data.bz);
            changeDoms('#um-m-t-dz', data.place);
            // console.log(data.jtype, data.securityId, '11111111111')
            if (data.jtype == 2) {
                changeDoms('#um-m-t-states', '已处理');

            } else if (data.jtype == 1) {
                changeDoms('#um-m-t-states', '处理中');
                $('#jieshou').hide();
                $('#wanchen').show();
            } else {
                changeDoms('#um-m-t-states', '未处理');
                $('#jieshou').show();
                $('#wanchen').hide();
            }
            // if (this.isFromJQ == false) {
            //     $('#wanchen').show();
            // }

        },
        //url解码
        getQueryVariable(variable) {
            var that = this;
            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) {
                    that.isFromJQ = true; //确认是警情进来
                    return JSON.parse(decodeURI(pair[1]));
                } //解码url 和 JSON
            }
@@ -103,14 +143,14 @@

            var transportIcon = L.Icon.extend({ //图标初始化
                options: {
                    iconSize: [30, 30], // 图标尺寸
                    iconSize: [50, 30], // 图标尺寸
                }
            });
            var carIcon = new transportIcon({ //引入图标
                    iconUrl: './img/gray.png'
                }),
                planeIcon = new transportIcon({
                    iconUrl: './img/green.png'
                    iconUrl: './img/zd.png'
                }),
                busIcon = new transportIcon({
                    iconUrl: './img/red.png'
@@ -131,7 +171,6 @@
                    console.log('没有坐标', i)
                } else {
                    setData(a);
                    that.getDHLine(a.jd, a.wd);
                }
                markers.addLayer(marker);
            }
@@ -140,26 +179,116 @@
            markers.on('click', function(a) {
                if (i == 0) {


					
                    console.log(that.getdata)


                    i = 1
                } else if (i == 1) {
                    i = 0
                    i = -1
                }
                i++
            });
            console.log(markers)
            // console.log(markers)
            this.nowPosition = center;
            return map; //抛出map
        },
        Submit(){
            this.$message({
                message: '恭喜你，这是一条成功消息',
                type: 'success',
                center: true
            });
        Submit() {
            $('#loding').show();
            var time = setTimeout(() => {
                $('#loding').hide();
            }, 2000)

        },
        SubmitDown() {
            $('#SubmitDown').show();
        },
        SubmitSD() {
            console.log(this.chulijieguo, 'chulijieguo')
            console.log(this.wentifankui, 'wentifankui')
        },

        showPolyLine(xy) {
            var that = this;
            that.LxdhLine = L.polyline(xy, {
                color: 'red'
            }).addTo(that.map);

            // zoom the map to the polyline
            that.map.fitBounds(that.LxdhLine.getBounds())
        },
        //定位警情位置
        // titleClick() {
        //     this.map.setView(this.nowPosition, 20);
        // },
        //定位当前位置
        locationMap() {
            // console.log([this.lat, this.lng])
            // this.map.setView([this.lat, this.lng], 20);
            this.getLocationData();
        },
        // 获取实时位置
        getLocationData() {

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

            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 实现业务代码逻辑 
                that.haveShishiweizhi++; //控制只执行一次
                console.log(that.haveShishiweizhi)
                if (that.haveShishiweizhi == 2) {
                    // console.log(position)
                    if (that.LXdhStart == null) {
                        //点位
                        var position = [that.lat, that.lng];

                        //把map定位到点位上，13为地图的级别，也可以直接marker.getLatLng()
                        that.map.setView(position, 15);

                    } else {
                        that.map.removeLayer(that.LXdhStart);
                    }


                    //绘制起点和终点
                    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.getDHLine(+that.oldlng, +that.oldlat)
                    // console.log(that.lat, that.lng);
                    // console.log(+that.oldlat, +that.oldlng);

                };
            };

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

            geolocation.getLocation(showPosition, showErr, options);
            // console.log(geolocation);
        },
        getDHLine(x, y) {

@@ -180,17 +309,28 @@
                    opt: "sf2"
                },
            }).then((res) => {
                var resdata = res.data.result.coords;
                var err = res.data.result.err;
                var data = [];
                // console.log(err)
                if (!err) {
                if (res.data.result.coords == undefined) {
                    console.log('目标太远 或不存在路径')
                } else {

                    var resdata = res.data.result.coords;
                    console.log(resdata)
                    var data = [];
                    for (var i = 0; i < resdata.length; i++) {
                        var xy = [];
                        xy.push(resdata[i][1]);
                        xy.push(resdata[i][0]);
                        data.push(xy);
                    }
                    var w = resdata[0][0] - resdata[resdata.length - 1][0];
                    w = Math.abs(w);
                    w = w / 0.00000899;
                    w = w.toFixed(2);
                    console.log(w);
                    $('#t-mi').empty();
                    $('#t-mi').append(w + '米');
                    $('#t-fz').empty();
                    $('#t-fz').append(w / 30 + '分钟');

                    if (that.LXdhEnd != null) {
                        that.map.removeLayer(that.LXdhEnd);
@@ -209,7 +349,7 @@
                    });

                    var zd = new transportIcon({
                        iconUrl: './img/zd.png'
                        iconUrl: './img/zd2.png'
                    });
                    // var qd = new transportIcon({
                    //     iconUrl: './img/qd.png'
@@ -220,9 +360,9 @@
                    var x = resdata[resdata.length - 1][0];
                    var y = resdata[resdata.length - 1][1];

                    that.LXdhEnd.addLayer(L.marker([y, x], {
                        icon: zd,
                    }));
                    // that.LXdhEnd.addLayer(L.marker([y, x], {//不要图标
                    //     icon: zd,
                    // }));
                    // markers.addLayer(L.marker([qdzb.start.y, qdzb.start.x], {
                    //     icon: qd,
                    // }));
@@ -230,142 +370,38 @@
                    that.map.addLayer(that.LXdhEnd);

                    that.showPolyLine(data);
                } else {
                    console.log('请求位置出错');
                }
            });
        },
        showPolyLine(xy) {
            var that = this;
            that.LxdhLine = L.polyline(xy, {
                color: 'red'
                color: '#169BD5'
            }).addTo(that.map);

            // zoom the map to the polyline
            that.map.fitBounds(that.LxdhLine.getBounds())
        },
        //定位警情位置
        // titleClick() {
        //     this.map.setView(this.nowPosition, 20);
        // },
        //定位当前位置
        locationMap() {
            console.log([this.lat, this.lng])
            this.map.setView([this.lat, this.lng], 20);
        refreshMap() {
            console.log('shuaxin')

        },
        shipingClick(open) { //打开视频
            if (open) {
                this.openRealVideoBox(this.seedata.serialNumber, this.seedata.channelNumber, this.seedata
                    .deviceNumber, this.seedata.manufacturer);
            } else {
                this.shipingPopupShow = false;
            }
        },
        resultFeedbackClick() { //结果反馈跳转小程序
            uni.webView.navigateTo({
                url: `../poput/workbench/policeDetails/policeDetails?id=${this.seedata.id}`
            });
        },
        openRealVideoBox(serialNumber, channelNumber, deviceNumber, manufacturer) { //获取视频地址
            var that = this;
            if (manufacturer == "HK") {
                axios
                    .get(
                        `/api/equipment/equipment/selectEquimentPlayInfo?number=${deviceNumber}&bmp=m3u8&manufacturer=${manufacturer}`
                    )
                    .then((result) => {
                        that.videoSource = result.data.data.address;
                        that.shipingM3u8Url = decodeURIComponent(that.videoSource);
                        that.shipingPopupShow = true;
                    })
                    .ce;
            } else {
                var newAxios = axios.create({
                    baseURL: "https://web.byisf.com:18000",
                    withCredentials: false,
                    headers: {
                        "Content-type": "application/x-www-form-urlencoded",
                    },
                });
                newAxios
                    .post(
                        "/api_control", {}, {
                            params: {
                                param: JSON.stringify({
                                    PktType: "GetAccessToken"
                                }),
                            },
                        }
                    )
                    .then((res) => {
                        newAxios
                            .get(
                                `https://web.byisf.com:18000/GetPlayUrl?deviceCode=${serialNumber}&chl=${channelNumber}`
                            )
                            .then((result) => {
                                that.videoSource = result.data.data.m3u8;
                                that.shipingM3u8Url = decodeURIComponent(that.videoSource);
                                that.shipingPopupShow = true;
                            });
                    });
            }
        },
        upData() {
            console.log('上传信息成功')
        },
        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 实现业务代码逻辑 
                console.log(position, 1111)
                if (that.LXdhStart != null) {
                    that.map.removeLayer(that.LXdhStart);
                }

                //绘制起点和终点
                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);

            };

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

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

        // resultFeedbackClick() { //结果反馈跳转小程序
        //     uni.webView.navigateTo({
        //         url: `../poput/workbench/policeDetails/policeDetails?id=${this.seedata.id}`
        //     });
    },
    created() {},
    mounted() {
        this.getDataList();
        this.getLocationData();
        var time = setInterval(() => {
            if (this.haveShishiweizhi == 1) {
                this.getLocationData();
                console.log(this.haveShishiweizhi)

            } else if (this.haveShishiweizhi == 2) {
                clearInterval(time);
                time = null;
            }
        }, 3000)
    },
    wacth: {}
})

 xcxMapJQLG/xcxmap.html

@@ -45,7 +45,8 @@
        <!-- uni 的 SDK -->
        <script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js">
        </script>

        <!-- 百度地图api -->
        <script type="text/javascript" src="./js/geolocation.min.js"></script>
        <!-- omyself支持 -->
        <link rel="stylesheet" href="./css/body.css" />

@@ -58,21 +59,85 @@

    <body>
        <div id="mapVue">
            <div id="loding" style="display: none;">
                <div class="titles">
                    <div>
                        已接收任务~
                    </div>
                    <div>
                        请尽快前往！
                    </div>

                </div>
            </div>
            <div class="dingwei" @click="locationMap">
                <img style="width: 70%" src="./img/dingwei.png" alt="">
                <img style="width: 60%" src="./img/dingwei.png" alt="">
            </div>
            <div class="shuaxin" @click="refreshMap">
                <img style="width: 60%" src="./img/刷新.png" alt="">
            </div>
            <div class="baozu" @click="refreshMap">
                <div class="bz-once">
                    <img style="width: 60%" src="./img/提示.png" alt="">
                    <div id="bz-title">
                        报错
                    </div>
                </div>
                <div class="bz-once">
                    <img style="width: 60%" src="./img/排队数.png" alt="">
                    <div id="bz-title">
                        编队
                    </div>
                </div>
            </div>
            <div id="map">
            </div>
            <div id="Umain">
                <div class="Um-m">
                    <img style="width: 1rem" src="./img/打开.png" alt="">
                    <div class="um-m-t">调解任务- <span id="um-m-t-states">未处置</span> </div>
                </div>
                <div class="Um-m">
                    <img style="width: 1rem" src="./img/文件.png" alt="">
                    <div class="um-m-t" id="um-m-t-bz">现场引导员与一插队男子发生冲突纠纷</div>
                </div>
                <div class="Um-m">
                    <img style="width: 1rem" src="./img/定位.png" alt="">
                    <div class="um-m-t" id="um-m-t-dz">江西省南昌市第二附属医院住院部</div>
                </div>
            </div>
            <div id="Dmain">
                <div id="title">
                    <div class="t-fz">2分钟</div>
                    <div class="t-mi">119米</div>
                    <div class="t-fz" id="t-fz">
                        <!-- 2分钟 -->
                    </div>
                    <div class="t-mi" id="t-mi">
                        <!-- 119米 -->
                    </div>
                </div>
                <div id="bot">
                    <!-- <button type="button">接受任务</button> -->
                    <el-button type="primary" @click="Submit" round>接受任务</el-button>
                    <el-button id="jieshou" type="primary" @click="Submit" round>接受任务</el-button>
                    <el-button id="wanchen" type="primary" style="display: none;" @click="SubmitDown" round>完成任务
                    </el-button>
                </div>
            </div>
            <div id="SubmitDown" style="display: none;">
                <div class="S-use">
                    <div>处理结果</div>
                    <div>
                        <textarea v-model="chulijieguo" cols="2" rows="6" style="OVERFLOW:hidden"></textarea>
                    </div>
                </div>
                <div class="S-use ups">
                    <div>问题反馈</div>
                    <div>
                        <textarea v-model="wentifankui" cols="2" rows="6" style="OVERFLOW:hidden"></textarea>
                    </div>
                </div>
                <el-button id="S-tijiao" type="primary" @click="SubmitSD" round>提交
                </el-button>
            </div>
        </div>
        <!-- vue渲染 -->
        <script src="./js/vueMain.js"></script>