样式优化

zengh

2021-05-28 9f2abfee9cb58b2e7abf1faa0b02723b70063d27

样式优化

 xcxjingqingmap/js/vueMain.js

@@ -23,16 +23,15 @@
    methods: {
        getDataList() {
            var that = this;
            var url = 'https://web.byisf.com/api/blade-jfpts/equipment/equipment/listAll';
            axios.get(url).then((res) => {
                that.getdata = res.data.data;
                // console.log(that.getdata)
                that.beginCome();
            })
            // var url = 'https://web.byisf.com/api/blade-jfpts/equipment/equipment/listAll';
            // axios.get(url).then((res) => {
            //     that.getdata = res.data.data;
            that.beginCome();
            // })
        },
        beginCome() {
            // this.getdata = this.getQueryVariable('data');//url解码
            console.log(this.getdata)
            this.getdata = this.getQueryVariable('data');//url解码
            // console.log(this.getdata)
            // this.getdata = [{
            //     jd: 115.91042800000002,
            //     wd: 28.68094757898212,
@@ -64,24 +63,23 @@
            var that = this,
                center = [data[0].wd, data[0].jd],
                url = `/api/blade-jfpts/alarm/alarm/APP-getAlarm?id=${data[0].id}`;
            // console.log(center)
            this.nowPosition = center;
            // axios.post(url).then((res) => {
            //     // console.log(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;
            axios.post(url).then((res) => {
                // console.log(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];
            //     }
            //     // console.log(this.seedata, 1524545453)
            // })
                } else {
                    this.seedata = data[0];
                }
                // console.log(this.seedata, 1524545453)
            })


            var createMap = () => {
@@ -125,8 +123,7 @@
            // console.log(data, 43545343)
            var setData = (a) => {//定义图标
                marker = L.marker([a.wd, a.jd], {
                    icon: planeIcon,
                    // icon: a.dtype == 0 ? carIcon : a.dtype == 1 ? planeIcon : a.dtype == 2 ? busIcon : '',
                    icon: a.dtype == 0 ? carIcon : a.dtype == 1 ? planeIcon : a.dtype == 2 ? busIcon : '',
                    // title: title,
                    myData: {//自定义数据
                        ...a
@@ -136,16 +133,11 @@
            for (var i = 0; i < data.length; i++) {
                var a = data[i];
                // var title = a.title;
                // if (a.dtype == 0) {
                //     setData(a);
                // } else if (a.dtype == 1) {
                //     setData(a);
                // } else if (a.dtype == 2) {
                //     setData(a);
                // }
                if(a.jd == '' || a.wd == '' || a.jd == null || a.wd == null){
                    console.log('没有坐标', i)
                } else {
                if (a.dtype == 0) {
                    setData(a);
                } else if (a.dtype == 1) {
                    setData(a);
                } else if (a.dtype == 2) {
                    setData(a);
                }
                // marker.bindPopup(title);
@@ -155,9 +147,7 @@

            markers.on('click', function (a) {
                // that.drawer = true;
                that.seedata = a.layer.options.myData;
                that.nowPosition = [that.seedata.wd,that.seedata.jd]
                console.log(that.seedata)
                // that.seedata = a.layer.options.myData;
                $('#seedata').css('top', '');
                $('#map').css("height", (index, value) => {//改变地图高度
                    return '50%';
@@ -169,66 +159,18 @@

            });
            that.seedata = data[0];
            this.nowPosition = center;
            // map.on('mousemove', (e) => {//实时显示坐标
            //     let latlng = e.latlng;
            //     console.log(latlng);// {lat: 30.59, lng: 114.32}
            // });
            return map;//抛出map
        },
        getLocation() {
            // if (navigator.geolocation) {
            //     // console.log(navigator.geolocation)
            //     navigator.geolocation.getCurrentPosition(onSuccess, onError);

            // } else {
            //     alert("您的浏览器不支持使用HTML 5来获取地理位置服务");
            // }

            // function onSuccess(position) {
            //     console.log('纬度: ' + position.coords.latitude + '\n' +
            //         '经度: ' + position.coords.longitude + '\n' +
            //         '海拔: ' + position.coords.altitude + '\n' +
            //         '水平精度: ' + position.coords.accuracy + '\n' +
            //         '垂直精度: ' + position.coords.altitudeAccura)
            // }
            // function onError(error) {
            //     switch (error.code) {
            //         case error.PERMISSION_DENIED:
            //             alert("您拒绝对获取地理位置的请求");
            //             break;
            //         case error.POSITION_UNAVAILABLE:
            //             alert("位置信息是不可用的");
            //             break;
            //         case error.TIMEOUT:
            //             alert("请求您的地理位置超时");
            //             break;
            //         case error.UNKNOWN_ERROR:
            //             alert("未知错误");
            //             break;
            //     }
            // }
            // this.map.locate({
            //     setView: true,
            //     maxZoom: 16
            // });
            // console.log(this.map)
            // this.map.on('locationfound', function (e) {
            //     // var radius = e.accuracy / 2;
            //     // L.marker(e.latlng).addTo(mapid).bindPopup("你就在这个圈内");
            //     // L.circle(e.latlng, radius).addTo(mapid);
            //     console.log(e)
            // });
        },
        handleClick(tab, event) {
            // console.log(tab, event);
        },
        titleClick(){

        locationMap() {
            this.map.setView(this.nowPosition, 12);
        },
        locationMap() {//定位
            // this.map.setView(this.nowPosition, 12);//定警情位置
            // this.getLocation();
            // console.log(wx,12);
            // wx.miniProgram.navigateTo({url: 'pages/workbench/workbench'})
        },
@@ -291,11 +233,11 @@
        },
        gotoxcx(routs) {
            wx.miniProgram.navigateTo({
                url: `../poput/workbench/policeDetails/${routs}?id=${this.seedata.id}`,            //指定跳转至小程序页面的门路
                success: function () {
                    console.log('success');   //页面跳转胜利的回调函数
                url:`../poput/workbench/policeDetails/${routs}?id=${this.seedata.id}`,            //指定跳转至小程序页面的门路
                success: function(){
                   console.log('success');   //页面跳转胜利的回调函数
                }
            });
             });
        }

    },

 xcxjingqingmap/xcxmap.html

@@ -45,7 +45,7 @@
    <script src="./js/move.js"></script>
    <!-- sha1加密 -->
    <!-- <script src="./js/sha1.js"></script> -->
    <script src="http://pv.sohu.com/cityjson?ie=utf-8"></script>

</head>

<body>
@@ -55,17 +55,16 @@
        </div>
        <div id="map"></div>
        <div id="seedata">
            <div class="title" @click="titleClick">
                {{seedata.deviceName}}
                <div class="title-span"> </div>
                {{seedata.deviceNumber}}
            <div class="title">
                {{seedata.place}}
                <!-- {{getdata[0].place}} -->
                <div class="title-span"> </div>
                <div class="title-span"> </div>
            </div>
            <div class="main">
                <div class="f-m-once">
                    <div class="f-m-o-title">
                        <img class="f-m-o-t-img" src="./img/shiyongren.png" alt="">
                        <img class="f-m-o-t-img" src="./img/ren.png" alt="">
                        使用方:
                    </div>
                    <div class="f-m-o-center">{{seedata.deptName}}</div>
@@ -95,9 +94,9 @@
                <div class="f-m-once">
                    <div class="f-m-o-title">
                        <img class="f-m-o-t-img" src="./img/leixing.png" alt="">
                        报警类型:
                        报警类型&&编号:
                    </div>
                    <div class="f-m-o-center">{{seedata.alarmType}}</div>
                    <div class="f-m-o-center">{{seedata.alarmType}}&&{{seedata.id}}</div>
                </div>
                <el-divider></el-divider>
                <div class="f-m-once">
@@ -123,7 +122,44 @@
                        </div>
                    </div>
                    <div class="butb" @click="resultFeedbackClick">结果反馈</div>

                    <!-- 加上display： none不会闪烁 -->
                    <!-- <div class="resultFeedback" v-show="resultFeedbackPopupShow" style="display: none;">
                        <div class="b-r-main">
                            <div @click="resultFeedbackClick">
                                <img src="./img/gaunbi.png" alt="" class="s-p-gaunbi">
                            </div>
                            <div class="b-r-main-in">
                                <div class="b-r-m-i-once">
                                    <div class="b-r-m-i-o-title">
                                        警情反馈:
                                    </div>
                                    <div class="b-r-m-i-o-center">
                                        <textarea rows="9" cols="27" placeholder="请输入警情反馈。"></textarea>
                                    </div>
                                </div>
                                <div class="b-r-m-i-once b-r-i-o-ups">
                                    <div class="b-r-m-i-o-title">
                                        照片上传:
                                    </div>
                                    <div class="b-r-m-i-o-center">
                                        <img class="b-r-m-i-o-c-img" src="./img/xiangji.png" alt="">
                                        <div>2522</div>
                                    </div>
                                </div>
                                <el-divider></el-divider>
                                <div class="b-r-m-i-once b-r-i-o-ups">
                                    <div class="b-r-m-i-o-title">
                                        视频上传:
                                    </div>
                                    <div class="b-r-m-i-o-center">
                                        <img class="b-r-m-i-o-c-img" src="./img/shiping11.png" alt="">
                                        <div>2522</div>
                                    </div>
                                </div>
                                <div class="butb b-r-m-but" @click="upData">结果反馈</div>
                            </div>
                        </div>
                    </div> -->
                    <div class="butc">
                        <img class="b-b-img" src="./img/huifang.png" alt="">
                        <!-- <div class="huifangPopup">