| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274 | <style>    .amap-icon img,    .amap-marker-content img{        width: 25px;        height: 34px;    }</style><div class="{{$viewClass['form-group']}}">    <label class="{{$viewClass['label']}} control-label">{!! $label !!}</label>    <div class="{{$viewClass['field']}}">        @include('admin::form.error')        @if($type === 'baidu' || $type === 'amap')            <div class="row mb-1">                <div class="col-md-5 col-md-offset-3">                    <div class="input-group">                        <input type="text" placeholder="{{ trans('admin.search') }}" class="form-control" id="{{ $searchId }}">                        @if($type === 'baidu')                            <span class="input-group-btn">                                <button type="button" class="btn btn-primary btn-flat"><i class="fa fa-search"></i></button>                            </span>                        @endif                    </div>                </div>            </div>        @endif        <div class="{{ $class }}">            <div class="form-map" style="width: 100%;height: {{ $height }}"></div>            <input type="hidden" class="form-lat" name="{{ $name['lat'] }}" value="{{ $value['lat'] ?? null }}" {!! $attributes !!} />            <input type="hidden" class="form-lng" name="{{$name['lng']}}" value="{{ $value['lng'] ?? null }}" {!! $attributes !!} />        </div>        @include('admin::form.help-block')    </div></div><script init="{!! $selector !!}">    var lat = $this.find('.form-lat'),        lng = $this.find('.form-lng'),        container = $this.find('.form-map'),        mapId = "_" + Dcat.helpers.random();    container.attr('id', mapId);    @if($type === 'google')    function initGoogleMap() {        var LatLng = new google.maps.LatLng(lat.val(), lng.val());        var options = {            zoom: 13,            center: LatLng,            panControl: false,            zoomControl: true,            scaleControl: true,            mapTypeId: google.maps.MapTypeId.ROADMAP        }        var map = new google.maps.Map(container[0], options);        var marker = new google.maps.Marker({            position: LatLng,            map: map,            title: 'Drag Me!',            draggable: true        });        google.maps.event.addListener(marker, 'dragend', function (event) {            lat.val(event.latLng.lat());            lng.val(event.latLng.lng());        });    }    initGoogleMap();    @endif    @if($type === 'tencent')    function initTencentMap() {        var center = new qq.maps.LatLng(lat.val(), lng.val());        var map = new qq.maps.Map(container[0], {            center: center,            zoom: 13        });        var marker = new qq.maps.Marker({            position: center,            draggable: true,            map: map        });        if( ! lat.val() || ! lng.val()) {            var citylocation = new qq.maps.CityService({                complete : function(result){                    map.setCenter(result.detail.latLng);                    marker.setPosition(result.detail.latLng);                }            });            citylocation.searchLocalCity();        }        qq.maps.event.addListener(map, 'click', function(event) {            marker.setPosition(event.latLng);        });        qq.maps.event.addListener(marker, 'position_changed', function(event) {            var position = marker.getPosition();            lat.val(position.getLat());            lng.val(position.getLng());        });    }    initTencentMap();    @endif    @if($type === 'yandex')    function initYandexMap() {        ymaps.ready(function(){            var myMap = new ymaps.Map(mapId, {                center: [lat.val(), lng.val()],                zoom: 18            });            var myPlacemark = new ymaps.Placemark([lat.val(), lng.val()], {            }, {                preset: 'islands#redDotIcon',                draggable: true            });            myPlacemark.events.add(['dragend'], function (e) {                lat.val(myPlacemark.geometry.getCoordinates()[0]);                lng.val(myPlacemark.geometry.getCoordinates()[1]);            });            myMap.geoObjects.add(myPlacemark);        });    }    initYandexMap();    @endif    @if($type === 'baidu')    function initBaiduMap() {        var map = new BMap.Map(mapId);        var point = new BMap.Point(lng.val(), lat.val());        map.centerAndZoom(point, 15);        map.enableScrollWheelZoom(true);        var marker = new BMap.Marker(point);        map.addOverlay(marker);        marker.enableDragging();        if (! lat.val() || ! lng.val()) {            var geolocation = new BMap.Geolocation();            geolocation.getCurrentPosition(function(e){                if (this.getStatus() == BMAP_STATUS_SUCCESS) {                    map.panTo(e.point);                    marker.setPosition(e.point);                    lat.val(e.point.lat);                    lng.val(e.point.lng);                } else {                    console.log('failed'+this.getStatus());                }            },{enableHighAccuracy: true})        }        map.addEventListener("click", function(e) {            marker.setPosition(e.point);            lat.val(e.point.lat);            lng.val(e.point.lng);        });        marker.addEventListener("dragend", function(e) {            lat.val(e.point.lat);            lng.val(e.point.lng);        });        var ac = new BMap.Autocomplete(            {"input" : "{{ $searchId }}"                ,"location" : map            });        var address;        ac.addEventListener("onconfirm", function(e) {    //鼠标点击下拉列表后的事件            var _value = e.item.value;            address = _value.province +  _value.city +  _value.district +  _value.street +  _value.business;            setPlace();        });        function setPlace() {            function myFun() {                var pp = local.getResults().getPoi(0).point;                map.centerAndZoom(pp, 15);                marker.setPosition(pp);                lat.val(pp.lat);                lng.val(pp.lng);            }            var local = new BMap.LocalSearch(map, {                onSearchComplete: myFun            });            local.search(address);        }    }    initBaiduMap();    @endif    @if($type === 'amap')    function initAmap(){        var map = new AMap.Map(container[0], {            resizeEnable: true,            center: lng.val() && lat.val() ? [lng.val(), lat.val()] : null,            zoom: 14        });        var marker = new AMap.Marker({            position: new AMap.LngLat(lng.val(), lat.val()),            draggable: true,            map:map,            icon:'//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-red.png',            zoom:15        });        if (!lng.val() || !lat.val()){            var geolocation = new AMap.Geolocation({                enableHighAccuracy: true,                zoomToAccuracy: true,                buttonPosition: 'RB'            })            geolocation.getCurrentPosition(function (status,result){                if (status === 'complete'){                    var point = new AMap.LngLat(result.position.lng, result.position.lat);                    map.setCenter(point);                    map.setZoom(15);                    marker.setPosition(point)                    lat.val(result.position.lat);                    lng.val(result.position.lng);                }            })        }        //输入提示        var auto = new AMap.Autocomplete({            input: "{{$searchId}}"        });        var placeSearch = new AMap.PlaceSearch({            map: map        });        AMap.event.addListener(auto, "select", function (e){            placeSearch.setCity(e.poi.adcode);            placeSearch.search(e.poi.name);        });        AMap.event.addListener(placeSearch, "markerClick", function (e){            let point = new AMap.LngLat(e.data.location.lng, e.data.location.lat);            marker.setPosition(point)            lat.val(e.data.location.lat);            lng.val(e.data.location.lng);        });        marker.on('dragend',function (e){            lat.val(e.lnglat.lat);            lng.val(e.lnglat.lng);        });        map.on('click',function (e){            if (e.type === 'click'){                let point = new AMap.LngLat(e.lnglat.lng, e.lnglat.lat);                marker.setPosition(point)                lat.val(e.lnglat.lat);                lng.val(e.lnglat.lng);            }        })    }    initAmap();    @endif</script>
 |