czapp/pages/amap/fence/fence.js

(function () {
    var page = {
        init: function ($page, param) {
            
            $page.find('#fence-switch').rlswitch();
            var userinfo = learun.storage.get('userinfo');



            // //地图初始化
            var map = new AMap.Map("fence-map", {
                center: [113.955439, 22.542956],//地图中心点
                zoom: 12 //地图显示的缩放级别
            });
            learun.layer.loading(true, "加载数据中");



            map.on('complete', function(){
                learun.layer.loading(false);
			});


            var fenceInfo = null;
            var defaultPt = [113.955439, 22.542956];
            var ableStatus = null;
            var radius = null;

            if(param){
                fenceInfo = param.fenceInfo;
                defaultPt = param.defaultLocation;
                ableStatus = param.fenceStatus;
                radius = fenceInfo.data.radius;
                console.log(param)
            }
            


            if(ableStatus !== '0'){
                console.log(ableStatus);
                $('#fence-switch').addClass('f-active');
            }
            var circleFence = new AMap.Circle({
                center: defaultPt,
                radius: radius || 100, 
                strokeOpacity: 0,
                strokeWeight: 0,
                strokeOpacity: 0.2,
                fillOpacity: 0.3,
                fillColor : '#1791fc',
                zIndex: 50,
            });

            circleFence.setMap(map)
            map.setFitView(circleFence);


            

            var rangeObj = $('#fence-radius');
            rangeObj[0].value = radius || 100;
            $('#display-radius')[0].innerHTML = rangeObj[0].value;
            //获取要设置的半径
            function getSetRadius(){
                return rangeObj[0].value; 
            }

            $('#fence-radius').on('input',function(){
                $('#display-radius')[0].innerHTML = this.value;
                var radius = getSetRadius();
                circleFence.setRadius(radius);
                map.setFitView([ circleFence ]);
                
            });

            map.on('moveend', function(){
                var center = map.getCenter();
                circleFence.setCenter(center);
            });

            //保存
            $page.find('#save-fence').on('tap', function(){
                
                learun.layer.confirm('保存将会覆盖原围栏', function (_index) { 
                    if(_index === '1'){
                        var data = getPostData();
                        console.log(data);
                        if(!data){
                            learun.layer.toast('围栏信息有误或者为空');
                            return;
                        }
                        postFence(data);
                    }else{
                        return;
                    }
                }, '保存围栏', ['否', '是']);
            });

            //获取提交数据
            function getPostData(){
                var fenceEnable = getAbleStatus();
                var circleCenter = circleFence.getCenter();
                var center = {lng: circleCenter.lng, lat:circleCenter.lat}

                var fenceData = {};
                fenceData.type = 'circle';
                fenceData.data = {};
                fenceData.data.radius = circleFence.getRadius();
                fenceData.data.center = center;

                var data = {};
                data.vehicleNumber = userinfo.baseinfo.deviceNumber;
                data.data =  JSON.stringify(fenceData);
                data.fenceAlarmEnable = fenceEnable;
                console.log(data)
                return data;
            }

            //获取启用状态
            function getAbleStatus(){
                var status = $('#fence-switch').hasClass('f-active');
                if(status){
                    return true;
                }else{
                    return false;
                }
            }


            //post围栏信息
            function postFence(data){
                learun.httppost(config.webapi+'?s=api/save_fence_info',data,function(res){
                    if(!res.success){
                        learun.layer.toast(res.message);
                        return;
                    }
                    learun.layer.toast('保存成功');
                });
            }


            

            
        }
    };

    return page;
})();