<style>
|
.warning-msg { }
|
.warning-msg-content { background-color: #FFFFCC; border: 1px solid #FFFF33; padding: 10px; margin-bottom: 15px; color: #666; }
|
.warning-msg-content i { display: inline-block; font-size: 16px; margin-right: 5px; color: red; }
|
.warning-msg-content p { display: inline-block; }
|
.warning-msg-content a { color: #20a53a; }
|
.warning-msg-content a:hover { color: #23527c; }
|
</style>
|
<body>
|
<script type="text/html" template lay-done="layui.data.done(d);">
|
<div class="layui-form coreshop-form layui-form-pane" lay-filter="LAY-app-CoreCmsEnterprise-MapForm" id="LAY-app-CoreCmsEnterprise-MapForm">
|
<input type="hidden" name="coordinate" value="{{d.params.data.oldData}}">
|
|
<div class="layui-form-item">
|
<label for="tags" class="layui-form-label">请输入地址</label>
|
<div class="layui-input-inline layui-inline-10">
|
<input name="tags" class="layui-input" lay-reqText="请输入标签" placeholder="请输入标签" id="place" style="z-index: 99999999" />
|
</div>
|
<div class="layui-form-mid" style="padding: 0 !important;float: right">
|
<button type="button" id="save-map" class="layui-btn" lay-submit lay-filter="formDemo">保存当前位置</button>
|
</div>
|
</div>
|
<div class="layui-form-item layui-form-text">
|
<div class="layui-input-inline layui-inline-10" id="container" style="min-width: 100%; min-height: 450px;">
|
</div>
|
</div>
|
</div>
|
</script>
|
</body>
|
<script>
|
var $;
|
var debug = layui.setter.debug;
|
var coordinateBoxIdName;
|
var addressBoxIdName;
|
layui.data.done = function (d) {
|
//开启调试情况下获取接口赋值数据
|
if (debug) { console.log(d.params.data); }
|
|
coordinateBoxIdName = d.params.data.coordinateBoxIdName;
|
addressBoxIdName = d.params.data.addressBoxIdName;
|
|
layui.use(['admin', 'form', 'coreHelper'], function () {
|
$ = layui.$;
|
var setter = layui.setter, admin = layui.admin, coreHelper = layui.coreHelper, form = layui.form;
|
var layer = layui.layer;
|
|
var cityLocation, map, marker, center = null;
|
var markerImage = "http://api.map.baidu.com/images/marker_red_sprite.png";
|
var preLocationCenter = $("input[name=coordinate]").val();
|
if (preLocationCenter == '') {
|
cityLocation = new qq.maps.CityService({
|
complete: function (result) {
|
center = new qq.maps.LatLng(result.detail.latLng.lat, result.detail.latLng.lng);
|
setMap(center);
|
}
|
});
|
cityLocation.searchLocalCity();
|
} else {
|
var arr = preLocationCenter.split(',');
|
if (arr.length < 2) {
|
parent.layer.msg("坐标位置错误");
|
return false;
|
}
|
center = new qq.maps.LatLng(arr[0], arr[1]);
|
setMap(center);
|
}
|
function setMap(center) {
|
|
map = new qq.maps.Map(document.getElementById('container'), {
|
center: center,
|
zoom: 13
|
});
|
|
var size = new qq.maps.Size(20, 27);
|
var origin = new qq.maps.Point(0, 0);
|
var icon = new qq.maps.MarkerImage(markerImage, size, origin);
|
//创建一个Marker
|
marker = new qq.maps.Marker({
|
icon: icon,
|
position: center,
|
animation: qq.maps.MarkerAnimation.DOWN,
|
map: map,
|
title: '选择企业位置'
|
});
|
|
var jump = function (event) {
|
marker.setPosition(event.latLng);
|
};
|
qq.maps.event.addListener(map, 'click', jump);
|
|
//搜索框提示
|
var ap = new qq.maps.place.Autocomplete(document.getElementById('place'), {
|
offset: new qq.maps.Size(0, 5),
|
location: '北京市',
|
zIndex: 99999999
|
});
|
var keyword = "";
|
|
//调用Poi检索类。用于进行本地检索、周边检索等服务。
|
var searchService = new qq.maps.SearchService({
|
complete: function (results) {
|
if (results.type === "CITY_LIST") {
|
searchService.setLocation(results.detail.cities[0].cityName);
|
searchService.search(keyword);
|
return;
|
}
|
var pois = results.detail.pois;
|
var latlngBounds = new qq.maps.LatLngBounds();
|
for (var i = 0, l = pois.length; i < l; i++) {
|
var poi = pois[i];
|
latlngBounds.extend(poi.latLng);
|
var marker = new qq.maps.Marker({
|
map: map,
|
position: poi.latLng
|
});
|
|
marker.setTitle(poi.name);
|
}
|
map.fitBounds(latlngBounds);
|
}
|
});
|
//添加监听事件
|
qq.maps.event.addListener(ap, "confirm", function (res) {
|
console.log('查询地址');
|
keyword = res.value;
|
searchService.search(keyword);
|
});
|
}
|
|
$("#save-map").on('click', function () {
|
parent.$("#" + coordinateBoxIdName).val(marker.position.lat + ',' + marker.position.lng);
|
if (addressBoxIdName) {
|
setName(marker.position.lat, marker.position.lng);
|
}
|
//parent.layer.closeAll();
|
parent.layer.close(layer.index);
|
});
|
|
form.render(null, 'LAY-app-CoreCmsEnterprise-MapForm');
|
});
|
};
|
|
function setName(lat, lng) {
|
geocoder = new qq.maps.Geocoder({
|
complete: function (result) {
|
parent.$("#"+addressBoxIdName).val(result.detail.address);
|
}
|
});
|
var coord = new qq.maps.LatLng(lat, lng);
|
geocoder.getAddress(coord);
|
|
}
|
</script>
|
