+地图更新成uniapp

liuyg

2022-02-22 53f5367d635ecfde9ceb36fe3bcafa86c32275a8

+地图更新成uniapp

 leafletMapOur/grabOrdersMap/js/getPosition.js

@@ -1,9 +1,9 @@
class $getPositions {
    constructor(arg) {
        this.id = arg.id || 0; //任务id
        this.fn = arg.fn ? function(data) {
        this.fn = arg.fn ? function (data) {
            arg.fn(data);
        } : function(data) {
        } : function (data) {
            console.log("未设置输出回调")
            return data;
        };
@@ -33,13 +33,13 @@
            console.log("重复开始持续定位")
            return;
        } else {
            that.once(function(res) {
            that.once(function (res) {
                if (res.state == false) {
                    console.log(res.intlat)
                }
            })
            this.isContinuedTimeInt = setInterval(() => {
                that.once(function(res) {
                that.once(function (res) {
                    if (res.state == false) {
                        console.log(res.intlat)
                    }
@@ -54,7 +54,7 @@
        if (val != 1) {
            // console.log(that.id,"开始持续定位")
            this.isContinued = true;
            that.once(function(res) {
            that.once(function (res) {
                if (res.state == false) {
                    // console.log(res.intlat)
                    that.outData();
@@ -66,7 +66,7 @@
            }
        }
        this.isContinuedTimeOut = setTimeout(() => {
            that.once(function(res) {
            that.once(function (res) {
                if (res.state == false) {
                    // console.log(res.intlat)
                    that.outData();
@@ -108,7 +108,7 @@
        let ok = true;
        let that = this,
            fns = fn || '',
            outit = function() {
            outit = function () {
                if (fns) {
                    fns({
                        state: that.state,
@@ -120,14 +120,18 @@
                }
            };
        outit();
        // uni定位
        console.log(uni.getLocation)
        //qq定位
        // var geolocation = new qq.maps.Geolocation("T7RBZ-62U3X-RSQ4P-ZZVCB-WE7JT-HRBOG", "mapqq");
        // console.log(that.geolocation)
        // var options = {
        //     // timeout: 1000
        // };

        // function showPosition(position) {
        //     console.log(JSON.stringify(position))
        //     console.log("position:", position)
        //     console.log("position:", JSON.stringify(position))
        //     let lat = position.lat; //
        //     let lng = position.lng; //火星坐标 //TODO 实现业务代码逻辑 
        //     that.onceNowPosition = [lng, lat];
@@ -147,43 +151,43 @@
        // that.geolocation.getLocation(showPosition, showErr, options);
        // 高德定位
        // console.log(AMap)
        AMap.plugin("AMap.Geolocation", function() {
            var geolocation = new AMap.Geolocation({
                // 是否使用高精度定位，默认：true
                enableHighAccuracy: true,
                // 设置定位超时时间，默认：无穷大
                // timeout: 10000,
                // 定位按钮的停靠位置的偏移量，默认：Pixel(10, 20)
                // buttonOffset: new AMap.Pixel(10, 20),
                //  定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
                // zoomToAccuracy: true,
                //  定位按钮的排放位置,  RB表示右下
                // buttonPosition: "RB",
            });
            geolocation.getCurrentPosition();
            AMap.event.addListener(geolocation, "complete", onComplete);
            AMap.event.addListener(geolocation, "error", onError);
        // AMap.plugin("AMap.Geolocation", function() {
        //     var geolocation = new AMap.Geolocation({
        //         // 是否使用高精度定位，默认：true
        //         enableHighAccuracy: true,
        //         // 设置定位超时时间，默认：无穷大
        //         timeout: 10000,
        //         // 定位按钮的停靠位置的偏移量，默认：Pixel(10, 20)
        //         // buttonOffset: new AMap.Pixel(10, 20),
        //         //  定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
        //         // zoomToAccuracy: true,
        //         //  定位按钮的排放位置,  RB表示右下
        //         // buttonPosition: "RB",
        //     });
        //     geolocation.getCurrentPosition();
        //     AMap.event.addListener(geolocation, "complete", onComplete);
        //     AMap.event.addListener(geolocation, "error", onError);

            function onComplete(data) {
                // data是具体的定位信息
                console.log(JSON.stringify(data));
                var lat = data.position.lat;
                var lon = data.position.lng;
                that.onceNowPosition = [lat, lon];
                that.state = false;
                ok = true;
                outit();
            }
        //     function onComplete(data) {
        //         // data是具体的定位信息
        //         console.log(data);
        //         var lat = data.position.lat;
        //         var lon = data.position.lng;
        //         that.onceNowPosition = [lat, lon];
        //         that.state = false;
        //         ok = true;
        //         outit();
        //     }

            function onError(data) {
                // 定位出错
                console.log(JSON.stringify(data));
                that.onceNowPosition = data.message;
                that.state = false;
                ok = false;
                outit();
            }
        });
        //     function onError(data) {
        //         // 定位出错
        //         console.log(data);
        //         that.onceNowPosition = data.message;
        //         that.state = false;
        //         ok = false;
        //         outit();
        //     }
        // });
        // return
        // let success = function(position) {
        //     // console.log(position);
@@ -247,4 +251,4 @@
    }
}

// export default $getPositions;
// export default $getPositions;

 pages/grabOrders/map.vue

@@ -2,11 +2,95 @@
    <view class="content">
        <u-top-tips ref="uTips"></u-top-tips>
        <!-- <u-button type="info" @click="acc">测试</u-button> -->
        <web-view :src="urls" @message="message"></web-view>
        <!-- <web-view :src="urls" @message="message"></web-view> -->
        <map :scale='18' id="myMap" style="width: 100%;" :style="{height: mapHeight + 'px'}" :markers="markers"
            :longitude="longitude" :latitude="latitude" :circles="circles" :polyline="polylines"></map>
        <view id="Umain">
            <view class="once-b">
                任务详情
            </view>
            <view class="once">
                <span class="once-left">
                    任务标题
                </span>
                <span class="once-right">
                    {{ourData.rname}}
                </span>
            </view>
            <view class="once">
                <span class="once-left">
                    任务内容
                </span>
                <span class="once-right">
                    {{ourData.content}}
                </span>
            </view>
            <view class="once">
                <span class="once-left">
                    发布者
                </span>
                <span class="once-right">
                    <span>{{ourData.fname}}</span>
                </span>
            </view>
            <view class="once">
                <span class="once-left">
                    任务地区
                </span>
                <span class="once-right">
                    {{ourData.province}}&nbsp;-&nbsp;{{ourData.city}}&nbsp;-&nbsp;{{ourData.district}}
                </span>
            </view>
            <view class="once">
                <span class="once-left">
                    开始时间
                </span>
                <span class="once-right">
                    {{ourData.time}}
                </span>
            </view>
            <view class="once">
                <span class="once-left">
                    人数
                </span>
                <span class="once-right">
                    {{ourData.num}}&nbsp;/&nbsp;{{ourData.jnum}}
                </span>
            </view>
            <view class="once">
                <span class="once-left">
                    队长
                </span>
                <span class="once-right">
                    <span>{{ourData.captain}}</span>
                </span>
            </view>
            <view class="once">
                <span class="once-left">
                    参与者
                </span>
                <span class="once-right">
                    <span v-for="(item,index) in ourData.team">{{item}}</span>
                </span>
            </view>
            <view class="once-c" v-if="ourData.buttype == 0">
                <u-button :type="ourData.butCT == 'beginUp'?'primary':ourData.butCT == 'begin'?'success':'info'"
                    @click="openAPP(ourData.buttype)" :disabled="ourData.butCT== 'over' || ourData.iscation == '0'">
                    {{ourData.butCT == 'beginUp'?(ourData.iscation == '0'?'正在进行':'上传反馈'):ourData.butCT == 'begin'?(ourData.iscation == '0'?'还未开始':'开始任务'):'任务完成'}}
                </u-button>
            </view>
            <view class="once-c" v-if="ourData.buttype == 1">
                <u-button :type="ourData.num==ourData.jnum?'info':'success'" @click="openAPP(ourData.buttype)"
                    :disabled="(ourData.num==ourData.jnum)&& ourData.buttype==1 ||ourData.type == 1">
                    {{ourData.num==ourData.jnum?"人数已满":'我参与'}}
                </u-button>
            </view>
        </view>
    </view>
</template>

<script>
    import $moveWindow from "./map/js/move.js"
    export default {
        data() {
            return {
@@ -16,9 +100,38 @@
                rid: '',
                webV: null,
                wv: null,
                latitude: 28.687205773173343,
                longitude: 115.8995839881188,
                circles: [], //圆
                markers: [], //标记点
                polylines: [{ //指定一系列坐标点，从数组第一项连线至最后一项
                    points: [{
                            latitude: 40.013305,
                            longitude: 118.685713
                        },
                        {
                            latitude: 40.013,
                            longitude: 118.685
                        },
                    ],
                    color: "#FE0000", //线的颜色
                    width: 4, //线的宽度
                    dottedLine: false, //是否虚线
                    arrowLine: false, //带箭头的线 开发者工具暂不支持该属性
                }],
                useTime: null,
                useTimeSet: null,
                times: 3000,
                setTimes: 30000,
                ourData: {},
                map: null,
                domMove: null,
            }
        },
        methods: {
            openAPP(val){
				
            },
            message(event) {
                let data = event.detail.data;

@@ -35,6 +148,146 @@
                } else {
                    this.wv.evalJS(`requestData(${param})`);
                }
            },
            timeBegin(val) {
                let that = this;
                if (this.useTime) {
                    return
                } else {
                    if (val == 1) {
                        that.getLocationInfo();
                    }
                    this.useTime = setTimeout(() => {
                        that.getLocationInfo();
                        clearTimeout(this.useTime);
                        that.useTime = null;
                        that.timeBegin();
                    }, that.times)
                }
            },
            timeBeginSet(d) {
                let that = this;
                if (this.useTimeSet) {
                    return
                } else {
                    this.useTimeSet = setTimeout(() => {
                        that.$store.commit("setMsg", d)
                        clearTimeout(this.useTime);
                        that.useTime = null;
                    }, that.setTimes)
                }
            },
            mover(o, a) {
                let that = this;
                uni.createMapContext("myMap", this).moveToLocation({
                    longitude: o,
                    latitude: a,
                });
            },
            getLocationInfo() {
                var that = this
                uni.getLocation({
                    type: 'wgs84',
                    success(res) {
                        // console.log(res, "当前位置");
                        that.latitude = res.latitude
                        that.longitude = res.longitude
                        console.log(that.latitude)
                        console.log(that.longitude)
                        let d = {
                            id: that.ourData.id,
                            intlat: [res.longitude, res.latitude]
                        }
                        that.timeBeginSet(d) //30秒送数据
                        that.map.moveToLocation({
                            latitude: res.latitude,
                            longitude: res.longitude
                        });
                        // that.mover(res.longitude, res.latitude); //移动
                        // that.$store.commit("setMsg",d)
                        //标记点
                        that.markers = [{
                            id: 1,
                            latitude: res.latitude,
                            longitude: res.longitude,
                            iconPath: './map/img/dinw/dinw1.png',
                        }]
                        that.circles = [{ //在地图上显示圆
                            latitude: res.latitude,
                            longitude: res.longitude,
                            fillColor: "#D9E6EF", //填充颜色
                            color: "#A7B6CB", //描边的颜色
                            radius: 10, //半径
                            strokeWidth: 2 //描边的宽度
                        }]
                    }
                });
            },
            checkDomHeight(data) {
                //  声明定时器
                var timer = null;
                //  检查dom是否执行完成
                function checkDom() {
                    let useData;
                    if (data.domName == 'not') {
                        useData = this[data.name];
                    } else {
                        let dom = document[data.domName](data.name);
                        useData = dom;
                    }
                    if (useData[0]) {
                        //  执行dom加载完成后的操作
                        //  清除定时器
                        if (!timer) {
                            clearTimeout(timer);
                        }
                        if (data.fn) {
                            //回调函数
                            data.fn(useData);
                            return;
                        } else {
                            return dom;
                        }
                    } else {
                        //  自我调用
                        timer = setTimeout(checkDom, 200);
                    }
                }
                //  首次执行
                checkDom();
            },
            checkDomHeightId(data) {
                //  声明定时器
                var timer = null;
                //  检查dom是否执行完成
                function checkDom() {
                    let useData;
                    if (data.domName == 'not') {
                        useData = this[data.name];
                    } else {
                        let dom = document[data.domName](data.name);
                        useData = dom;
                    }
                    if (useData) {
                        //  执行dom加载完成后的操作
                        //  清除定时器
                        if (!timer) {
                            clearTimeout(timer);
                        }
                        if (data.fn) {
                            //回调函数
                            data.fn(useData);
                            return;
                        } else {
                            return dom;
                        }
                    } else {
                        //  自我调用
                        timer = setTimeout(checkDom, 200);
                    }
                }
                //  首次执行
                checkDom();
            }
        },
        computed: {
@@ -64,41 +317,43 @@
        mounted() {},
        onReady() {
            let that = this;
            window['hBackMsg'] = (val) => {
                // console.log(val)
                let d = {
                    rid: val.data.id,
                    serid: val.data.serid,
                    type: val.type,
                    that: that,
                    fn: () => {
                        // that.getGrabOrders(that.current); //重获取数据
                        if (val.fn) {
                            // console.log(111)
                            val.fn("success");
                        }
                    }
                }
                that.$store.commit('useWebScoketApi', d);
            }
            window['setIntLat'] = (val) => {
                // console.log(fn);
                that.fn = val.fn || '';
                that.rid = val.rid || '';
            }
            window['showTip '] = (val) => {
                that.$refs.uTips.show({
                    title: val,
                    type: "warning",
                    duration: '2300'
                })
            }
            this.map = uni.createMapContext("myMap", this);
            // window['hBackMsg'] = (val) => {
            //     // console.log(val)
            //     let d = {
            //         rid: val.data.id,
            //         serid: val.data.serid,
            //         type: val.type,
            //         that: that,
            //         fn: () => {
            //             // that.getGrabOrders(that.current); //重获取数据
            //             if (val.fn) {
            //                 // console.log(111)
            //                 val.fn("success");
            //             }
            //         }
            //     }
            //     that.$store.commit('useWebScoketApi', d);
            // }
            // window['setIntLat'] = (val) => {
            //     // console.log(fn);
            //     that.fn = val.fn || '';
            //     that.rid = val.rid || '';
            // }
            // window['showTip '] = (val) => {
            //     that.$refs.uTips.show({
            //         title: val,
            //         type: "warning",
            //         duration: '2300'
            //     })
            // }
        },
        onLoad: function(options) {
            var data = [],
                that = this;
            if (options.data == undefined) {
                data = JSON.stringify({
                // data = JSON.stringify({
                data = {
                    appenUrl: "http://192.168.0.108:83/",
                    butCT: "beginUp",
                    buttype: 0,
@@ -122,51 +377,153 @@
                    team: "你,他,它",
                    time: "2022-02-18 14:15:52",
                    type: "2",
                    fname: "管理者",
                    url: "http://223.82.109.183:2081/zhba/upload/20220218/67f0c8bf3e7b5024c64133691f265072.ico",
                })

                    // })
                }
            } else {
                data = options.data;
            }
            // console.log(data);
            if (typeof data == "string") {
                data = JSON.parse(data)
            }
            this.ourData = data;

            console.log(data);
            // return
            // console.log(options.html)
            // var a = options.html != undefined ? options.html : "xcxMapJQ/xcxmap.html";
            // console.log(a)
            // let a = "grabOrdersMap/xcxmap.html";
            // this.urls = "http://223.82.109.183:2082/" + a + "?data=" + data;
            let name = 2; //1是本地  2是服务器
            // let name = 1;
            let b = this.$store.state.piAPI;
            if (b == '/api') {
                name = 1;
            }
            // "E:\liumy\qfqk\qfqks\qfqk-android\leafletMapOur\grabOrdersMap\xcxmap.html"
            let a = name == 1 ? "http://127.0.0.1:8848/qfqk-android/leafletMapOur/" : b.slice(0, b.indexOf('api'));
            // let name = 1; //1是本地  2是服务器
            // // let name = 1;
            // let b = this.$store.state.piAPI;
            // if (b == '/api') {
            //     name = 1;
            // }
            // // "E:\liumy\qfqk\qfqks\qfqk-android\leafletMapOur\grabOrdersMap\xcxmap.html"
            // let a = name == 1 ? "http://127.0.0.1:8848/qfqk-android/leafletMapOur/" : b.slice(0, b.indexOf('api'));
            // // this.urls = a + "grabOrdersMap/xcxmap.html?data=" + data;
            // // a = a.slice(0, a.indexOf('api'));
            // this.urls = a + "grabOrdersMap/xcxmap.html?data=" + data;
            // a = a.slice(0, a.indexOf('api'));
            this.urls = a + "grabOrdersMap/xcxmap.html?data=" + data;
            // this.urls = "http://localhost:80?data=" + data;
            // http://127.0.0.1:8848/qfqk-android/grabOrdersMap/xcxmap.html
            // this.dataList = data;
            // console.log(this.urls);
            let type = uni.getSystemInfoSync().platform;
            if (type == "android") {
                //webView传值
                let currentWebview = this.$scope.$getAppWebview();
                setTimeout(() => {
                    that.wv = currentWebview.children()[0];
                    console.log(that.wv)
                }, 1000)
                window.addEventListener('message', e => {
                    console.log(e)
                    that.webV = e.source // window的对象
                    console.log(e.data.data.arg, '接收h5页面发来的消息'); // 接收h5页面发来的消息(11)  ====>H5端
                }, false)
                setTimeout(() => {
                    that.sendRequestData("给html", 1);
                    that.sendRequestData("给html", 2);
                }, 10000)
            // this.urls = "http://192.168.0.222:5500/xcxmap.html?data=" + data;
            // // this.urls = "http://localhost:80?data=" + data;
            // // http://127.0.0.1:8848/qfqk-android/grabOrdersMap/xcxmap.html
            // // this.dataList = data;
            // // console.log(this.urls);
            // let type = uni.getSystemInfoSync().platform;
            // if (type == "android") {
            //     //webView传值
            //     let currentWebview = this.$scope.$getAppWebview();
            //     setTimeout(() => {
            //         that.wv = currentWebview.children()[0];
            //         console.log(that.wv)
            //     }, 1000)
            //     window.addEventListener('message', e => {
            //         console.log(e)
            //         that.webV = e.source // window的对象
            //         console.log(e.data.data.arg, '接收h5页面发来的消息'); // 接收h5页面发来的消息(11)  ====>H5端
            //     }, false)
            //     setTimeout(() => {
            //         that.sendRequestData("给html", 1);
            //         that.sendRequestData("给html", 2);
            //     }, 10000)
            // }
            const _this = this;
            // console.log(document.getElementById("Umain"))
            this.checkDomHeightId({
                domName: "getElementById",
                name: "Umain",
                fn: function(dom) {
                    console.log(dom)
                    let UmainHeights = dom.clientHeight;
                    uni.getSystemInfo({
                        success: (res) => {
                            _this.mapHeight = res.screenHeight - res.statusBarHeight -
                                UmainHeights
                            _this.mapHeight = _this.mapHeight
                        }
                    })
                }
            })
            this.checkDomHeight({
                domName: "getElementsByClassName",
                name: "content",
                fn: function(dom) {
                    // console.log(dom[0])
                    // dom.style.height = h - UmainHeight + "px";
                    // document.getElementsByClassName("dingwei")[0].style.bottom =
                    //     UmainHeight + 10 + "px";
                    // that.map.invalidateSize(true);

                    let h = dom[0].clientHeight;
                    //因为按钮使用v-if所以在识别高度时候，but还没渲染所以手动添加 56px 不会变
                    // console.log("应用数据")
                    let UmainHeight = document.getElementById("Umain").clientHeight;
                    // if (that.ourData.iscation == "1") {
                    //     UmainHeight += 56;
                    // }
                    //计算最小单位
                    let rows = document.getElementsByClassName("once"),
                        rowsHeight = 45;
                    for (let ri = 0; ri < 3; ri++) {
                        rowsHeight += rows[ri].clientHeight;
                    }
                    //适应高度
                    that.domMove = new $moveWindow({
                        id: "Umain",
                        minHeight: rowsHeight,
                        maxHeight: UmainHeight,
                        critical: (UmainHeight - rowsHeight) / 4,
                        openAnimation: false,
                        fn: function(res) {
                            // console.log(that.map.options)

                            // document.getElementById("myMap").style.height = h - res.height + "px";
                            // console.log(h, res.height)
                            // uni.getSystemInfo({
                            //     success: (res) => {
                            //         _this.mapHeight = h - res.height
                            //         _this.mapHeight = _this.mapHeight
                            //     }
                            // })
                            // that.map.setView([that.map.options.center[0], +that.map.options.center[1] + 0.002], that.map
                            //     .options.zoom);
                            // console.log(h - res.height)
                            if (res.state === true || res.state === false) {
                                //     that.map.invalidateSize(true);
                                // _this.mapHeight = h - res.height;
                                // _this.map.moveToLocation({
                                //     latitude: _this.latitude,
                                //     longitude: _this.longitude
                                // });
                                document.getElementById("myMap").style.height = h - res
                                    .height + "px";
                            }
                            // document.getElementsByClassName("dingwei")[0].style.bottom = res.height +
                            //     10 + "px";
                        },
                    });
                    that.domMove.init();
                }
            })


            //画线
            let line = data.line.split("(")[1].split(")")[0].split(",");
            let ourline = [];
            for (let k in line) {
                let ins = line[k].split(" ");
                ourline.push({
                    latitude: ins[1],
                    longitude: ins[0]
                })
            }
            this.polylines[0].points = ourline;
            // this.getLocationInfo(data);
            if (data.butCT == "beginUp") {
                this.timeBegin(1);
            }
        },
        beforeDestroy() {
@@ -175,9 +532,110 @@
    }
</script>

<style>
<style lang="scss">
    .content {
        flex: 1;
        height: 100%;
    }

    #Umain {
        position: absolute;
        width: 100%;
        height: auto;
        left: 0;
        bottom: 0;
        background-color: #e8e8e8;
        z-index: 100;
    }

    .once {
        width: 100%;
        min-height: 40px;
        background-color: #fff;
        display: flex;
        align-items: center;
        /* margin-bottom: 10px; */
        border-bottom: 1px solid #e8e8e8;
        padding: 0 10px;
    }

    .once-left {
        width: 25%;
        text-align: justify;
        text-align-last: justify;
        padding-right: 20px;
        box-sizing: border-box;
    }

    .once-left::after {
        content: "：";
        position: absolute;
    }

    .once-right {
        width: calc(75% - 20px);
        height: auto;
        /* border: 1px solid red; */
        box-sizing: border-box;
        word-break: break-all;
    }

    .once-right span {
        display: inline-block;
        padding: 0px 5px 1px;
        margin: 0 5px;
        background-color: #ECF5FF;
        border: 0.5px solid #e4f1ff;
        color: #429FFF;
        border-radius: 8px;
    }

    .once-c {
        width: 100%;
        height: 60px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 8px 0;
        background-color: #fff;
    }

    .once-b {
        width: 100%;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #fff;
        border-bottom: 1px solid #e8e8e8;
        /* margin-bottom: 10px; */
    }

    .submits {
        margin: 60rpx 90rpx 0;
        border: none;
        width: 572rpx;
        height: 86rpx;
        // line-height: 86rpx;
        box-sizing: border-box;
        border-radius: 15rpx;
        background-color: #103289;
        color: #ffffff;

        &::after {
            content: none;
        }

        &::before {
            content: none;
        }

        &[disabled='true'] {
            background: #e4e4e4;
            font-size: 36rpx;
            font-family: Source Han Sans CN;
            font-weight: 500;
            color: #ffffff;
        }
    }
</style>

 pages/grabOrders/map/img/dinw/dinw1.png

 pages/grabOrders/map/img/dinw/dinw2.png

 pages/grabOrders/map/img/dinw/dinw3.png

 pages/grabOrders/map/img/dinw/dinw4.png

 pages/grabOrders/map/img/dinw/dinw5.png

 pages/grabOrders/map/img/dinw/dinw6.png

 pages/grabOrders/map/js/move.js

New file
@@ -0,0 +1,173 @@
class $moveWindow {
    constructor(data) {
        this.id = data.id;
        this.start = 0;
        this.end = 0;
        this.domHeight = 0;
        this.domMove = null;
        this.openValue = false;
        this.useHeight = data.minHeight;
        this.maxHeight = data.maxHeight;
        this.height = data.minHeight;
        this.critical = data.critical;
        this.openAnimation = data.openAnimation;
        let that = this;
        this.fn =
            data.fn ? (function(res) {
                // console.log("回调函数");
                data.fn(res);
                that.changeHeight(res);
                // if (res.state === true) {
                //     console.log(that.openValue, res.state)
                // } else if (res.state === false) {
                //     console.log(that.openValue, res.state)
                // }
            }) :
            (function(res) {
                console.log("未设置回调函数");
                console.log(res);
            });

        this.ListenerTouchmove = function(window) {
            let moseHeight = window.changedTouches[0].clientY;
            //   let windowHeight = document.body.clientHeight; //屏幕宽度
            let endOn = moseHeight;
            // console.log(that.domHeight, that.start, endOn)
            let cha = that.domHeight + (+that.start - +endOn);
            if (cha >= that.maxHeight) {
                cha = that.maxHeight;
            } else if (cha <= that.useHeight) {
                cha = that.useHeight;
            }
            let d = {
                state: "on",
                height: cha,
            };
            that.fn(d);
        };
        this.ListenerTouchstart = function(window) {
            let moseHeight = window.changedTouches[0].clientY;
            that.start = moseHeight;
            // that.domHeight = document
            //     .getElementById(that.id)
            //     .style.cssText.split("px")[0]
            //     .split("height:")[1];
            that.domHeight = document
                .getElementById(that.id)
                .clientHeight;
        };
        this.ListenerTouchend = function(window) {
            let moseHeight = window.changedTouches[0].clientY;
            that.end = moseHeight;
            let cha, states;
            if (that.end >= that.start) {
                states = false; //方向
                cha = that.end - that.start;
            } else {
                states = true; //方向
                cha = that.start - that.end;
            }
            if (cha >= that.critical) {
                //高
                that.opens(states, true); //程度
            } else if (cha < that.critical) {
                //低
                that.opens(states, false); //程度
            }
        };
        return this;
    }
    //启动监听事件
    init() {
        // this.domMove = document.getElementById(this.id);
        let that = this;
        this.checkDom(that.id, (dom) => {
            //检测是否有dom
            that.domMove = dom;
            if (that.openAnimation) {
                that.domMove.style.transition = 'all 0.2s';
            }
            that.domMove.addEventListener("touchmove", that.ListenerTouchmove);
            // 结束位置靠滑动距离判断
            that.domMove.addEventListener("touchstart", that.ListenerTouchstart);
            that.domMove.addEventListener("touchend", that.ListenerTouchend);
        });
    }
    //关闭监听事件
    closeInit() {
        this.domMove = document.getElementById(this.id);
        this.domMove.removeEventListener("touchmove", this.ListenerTouchmove);
        // 结束位置靠滑动距离判断
        this.domMove.removeEventListener("touchstart", this.ListenerTouchstart);
        this.domMove.removeEventListener("touchend", this.ListenerTouchend);
    }
    //输出事件
    opens(val, chengdu) {
        if (chengdu) {
            this.openValue = val;
            if (val) {
                this.height = this.maxHeight;
            } else {
                this.height = this.useHeight;
            }
        } else {
            this.height = this.domHeight;
        }
        let d = {
            state: this.openValue,
            height: this.height,
        };
        this.fn(d);
    }
    changeHeight(data) {
        document
            .getElementById(this.id).style.height = data.height  + "px";
    }
    checkDom(name, fn) {
        //  声明定时器
        var timer = null;
        //  检查dom是否执行完成
        function checkDom() {
            // let dom = that.$refs[name];
            let dom = document.getElementById(name);
            if (dom) {
                //  执行dom加载完成后的操作
                //  清除定时器
                if (!timer) {
                    clearTimeout(timer);
                }
                if (fn) {
                    //回调函数
                    fn(dom);
                    return;
                } else {
                    return dom;
                }
            } else {
                //  自我调用
                timer = setTimeout(checkDom, 100);
            }
        }
        //  首次执行
        checkDom();
    }
    // 结束位置是一半判断
    //  domMove.addEventListener("touchend", function (window) {
    //   let moseHeight = window.changedTouches[0].clientY;
    //   let windowHeight = document.body.clientHeight;
    //   let cha = windowHeight - moseHeight;
    //   console.log(cha, "最后位置");
    //   let centerPoint =
    //     (windowHeight / 2 - +that.useHeight) / 2 + +that.useHeight;
    //   if (cha >= centerPoint) {
    //     cha = windowHeight / 2;
    //   } else if (cha < centerPoint) {
    //     cha = that.useHeight;
    //   }
    //   that.height = cha;
    // });
}

export default $moveWindow;

// console.log(moveWindow)

 store/apiConfig.js

@@ -1,4 +1,4 @@
let i = 1;//1是服务器
let i = 1; //1是服务器
if (i) {
    var api = 'http://223.82.109.183:2082/api/';
    var wsapi = 'ws://223.82.109.183:2082/wss/websocket';
@@ -7,8 +7,8 @@
    var wsapi = 'ws://192.168.0.108:9034/websocket';
}

// piAPI: 'http://223.82.109.183:2082/api/',
// piAPI: 'http://192.168.0.108:83/',
// var api = 'http://192.168.0.222:5500';
// var wsapi = 'ws://192.168.0.222:5500';

export default {
    api: api,

 store/positions.js

@@ -70,7 +70,7 @@
            //uid ；自己id，rid： 任务id，jd，wd经度纬度
            // console.log(value)
            let d = {
                uid: WxStorage.get("ids"),
                uid: WxStorage.get("ids") || $store.state.puserID,
                rid: value.id,
                jd: value.intlat[0],
                wd: value.intlat[1],