@layout("/common/_container.html"){
|
<div class="ibox float-e-margins">
|
<div class="ibox-content">
|
<div class="form-horizontal">
|
|
<input type="hidden" id="html" value="2">
|
<div class="row">
|
<div class="form-group">
|
<label class="control-label col-sm-2">起点：</label>
|
<div class="col-sm-3">
|
<input class="form-control" id="startAddress" onclick="TOrderTaxiInfoDlg.startAddress()">
|
<input type="hidden" id="startLon">
|
<input type="hidden" id="startLat">
|
</div>
|
</div>
|
<div class="form-group" id="startAddressModel" hidden>
|
<label class="control-label col-sm-2"></label>
|
<div class="col-sm-6" style="margin-left: 15px;height: 500px" id="startAddressBody">
|
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="control-label col-sm-2">终点：</label>
|
<div class="col-sm-3">
|
<input class="form-control" id="endAddress" onclick="TOrderTaxiInfoDlg.endAddress()">
|
<input type="hidden" id="endLon">
|
<input type="hidden" id="endLat">
|
</div>
|
</div>
|
<div class="form-group" id="endAddressModel" hidden>
|
<label class="control-label col-sm-2"></label>
|
<div class="col-sm-6" style="margin-left: 15px;height: 500px" id="endAddressBody">
|
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="control-label col-sm-2">用车时间：</label>
|
<div class="col-sm-3">
|
<input class="form-control" autocomplete="off" id="travelTime">
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="control-label col-sm-2">乘车人姓名：</label>
|
<div class="col-sm-3">
|
<input class="form-control" id="passengers">
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="control-label col-sm-2">乘车人手机号：</label>
|
<div class="col-sm-3">
|
<input class="form-control" id="passengersPhone">
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="control-label col-sm-2">联系人手机号：</label>
|
<div class="col-sm-3">
|
<input class="form-control" id="contactPersonPhone">
|
</div>
|
</div>
|
<!-- <div class="form-group">-->
|
<!-- <label class="control-label col-sm-2">备注信息：</label>-->
|
<!-- <div class="col-sm-3">-->
|
<!-- <input class="form-control" id="remark">-->
|
<!-- </div>-->
|
<!-- </div>-->
|
</div>
|
|
<div class="row btn-group-m-t">
|
<div class="col-sm-10">
|
<#button btnCss="info" name="保存" id="ensure" icon="fa-check"
|
clickFun="TOrderTaxiInfoDlg.addSubmit()"/>
|
</div>
|
</div>
|
</div>
|
|
</div>
|
</div>
|
|
<script src="${ctxPath}/static/modular/system/tOrderTaxi/tOrderTaxi_info.js"></script>
|
<script type="text/javascript">
|
window._AMapSecurityConfig = {
|
securityJsCode: '44c5ee9ad584605d91ca69bfac32c761',
|
}
|
</script>
|
<script type="text/javascript"
|
src="https://webapi.amap.com/maps?v=1.4.10&key=d3bde6afb050067e1a765a8d1d1f4c54&plugin=AMap.Autocomplete,AMap.PlaceSearch"></script>
|
<script type="text/javascript" src="https://cache.amap.com/lbs/static/addToolbar.js"></script>
|
|
<script>
|
laydate.render({
|
elem: '#travelTime'
|
, type: 'datetime'
|
,trigger: 'click' //采用click弹出
|
, min: new Date().toString()
|
,
|
});
|
</script>
|
|
<script type="text/javascript">
|
//起点地图加载
|
var marker, map = new AMap.Map("startAddressBody", {
|
resizeEnable: true,
|
zoom: 15,
|
zooms: [3, 20]
|
}); //定位标注当前位置
|
map.plugin('AMap.Geolocation', function () {
|
geolocation = new AMap.Geolocation({
|
enableHighAccuracy: true, //是否使用高精度定位，默认:true
|
timeout: 10000, //超过10秒后停止定位，默认：无穷大
|
maximumAge: 0, //定位结果缓存0毫秒，默认：0
|
convert: true, //自动偏移坐标，偏移后的坐标为高德坐标，默认：true
|
showButton: true, //显示定位按钮，默认：true
|
showMarker: true, //定位成功后在定位到的位置显示点标记，默认：true
|
showCircle: true, //定位成功后用圆圈表示定位精度范围，默认：true
|
panToLocation: true, //定位成功后将定位到的位置作为地图中心点，默认：true
|
buttonPosition: 'LB', //定位按钮的停靠位置 LB左下角、 RB右下角
|
buttonOffset: new AMap.Pixel(10, 20), //定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
|
zoomToAccuracy: true, //定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
|
});
|
map.addControl(geolocation);
|
geolocation.getCurrentPosition();
|
AMap.event.addListener(geolocation, 'complete', onComplete);
|
//返回定位信息
|
AMap.event.addListener(geolocation, 'error', onError);
|
//返回定位出错信息
|
}); //解析定位结果
|
var city;
|
|
map.on('click', function (e) {
|
console.log(marker);
|
if (marker != null) {
|
marker.setMap(null);
|
}
|
//添加标记点
|
$("#startLon").val(e.lnglat.getLng());
|
$("#startLat").val(e.lnglat.getLat());
|
marker = new AMap.Marker({
|
map: map,
|
position: new AMap.LngLat(e.lnglat.getLng(), e.lnglat.getLat()), // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9]
|
});
|
regeoCode(e.lnglat.getLng(), e.lnglat.getLat());
|
});
|
|
|
var infoWindow = new AMap.InfoWindow({
|
autoMove: true,
|
offset: {
|
x: 0,
|
y: -30
|
}
|
}); //回调函数
|
|
|
//根据经纬度获取详细地址
|
function regeoCode(lon, lat) {
|
|
var lnglat = [];
|
lnglat.push(lon);
|
lnglat.push(lat);
|
map.add(marker);
|
marker.setPosition(lnglat);
|
|
AMap.service('AMap.Geocoder', function () {
|
geocoder = new AMap.Geocoder({});
|
geocoder.getAddress(lnglat, function (status, result) {
|
if (status === 'complete' && result.regeocode) {
|
var address = result.regeocode.formattedAddress;
|
$("#startAddress").val(address);
|
} else {
|
Feng.error('根据经纬度查询地址失败')
|
}
|
var data = {
|
"name": result.regeocode.addressComponent.neighborhood,
|
"location": {
|
"lat": lat,
|
"lng": lon
|
},
|
"address": address,
|
"tel": "",
|
"type": result.regeocode.addressComponent.neighborhoodType
|
};
|
infoWindow.setContent(createContent(data));
|
infoWindow.open(map, marker.getPosition());
|
});
|
})
|
}
|
|
|
function onComplete(data) {
|
var str = [];
|
city = data.addressComponent.citycode;
|
str.push('定位结果：' + data.position);
|
str.push('定位类别：' + data.location_type);
|
if (data.accuracy) {
|
str.push('精度：' + data.accuracy + ' 米');
|
}
|
//如为IP精确定位结果则没有精度信息
|
str.push('是否经过偏移：' + (data.isConverted ? '是' : '否'));
|
var lnglatXY = [data.position.getLng(), data.position.getLat()];
|
//地图上所标点的坐标
|
AMap.service('AMap.Geocoder', function () {
|
//回调函数
|
geocoder = new AMap.Geocoder({});
|
geocoder.getAddress(lnglatXY, function (status, result) {
|
if (status === 'complete' && result.info === 'OK') {
|
//获得了有效的地址信息: //即，result.regeocode.formattedAddress
|
// console.log(result.regeocode.formattedAddress);
|
var address = result.regeocode.formattedAddress;
|
str.push('详细地址：' + address);
|
// todo 不弹出信息框
|
// alert(str.join(' | '));
|
} else {
|
// alert(str.join(' | ')); //获取地址失败
|
}
|
});
|
})
|
} //解析定位错误信息
|
function onError(data) {
|
alert('定位失败，原因：' + data.message);
|
}
|
|
//输入搜索点信息
|
var autoOptions = {
|
city: city, //在规定城市搜索、默认全国
|
input: "startAddress"
|
};
|
var auto = new AMap.Autocomplete(autoOptions);
|
var placeSearch = new AMap.PlaceSearch({
|
pageSize: 5, // 单页显示结果条数
|
pageIndex: 1, // 页码
|
children: 0, //不展示子节点数据
|
city: city, // 兴趣点城市
|
citylimit: true, //是否强制限制在设置的城市内搜索
|
panel: "panel", // 结果列表将在此容器中进行展示。
|
autoFitView: true, // 是否自动调整地图视野使绘制的 Marker点都处于视口的可见范围
|
extensions: 'base', //返回基本地址信息 */
|
map: map // 展现结果的地图实例
|
}); //构造地点查询类
|
AMap.event.addListener(auto, "select", select); //注册监听，当选中某条记录时会触发
|
function select(e) {
|
placeSearch.setCity(e.poi.adcode);
|
placeSearch.search(e.poi.name); //关键字查询查询 //设置搜索位置定点标注
|
if (e.poi && e.poi.location) {
|
map.setZoom(15);
|
map.setCenter(e.poi.location);
|
var id = e.poi.id; //详情查询
|
placeSearch.getDetails(id, function (status, result) {
|
if (status === 'complete' && result.info === 'OK') {
|
placeSearch_CallBack(result);
|
}
|
});
|
}
|
}
|
|
var infoWindow = new AMap.InfoWindow({
|
autoMove: true,
|
offset: {
|
x: 0,
|
y: -30
|
}
|
}); //回调函数
|
function placeSearch_CallBack(data) {
|
if (marker != null) {
|
marker.setMap(null);
|
}
|
var poiArr = data.poiList.pois; //添加marker
|
marker = new AMap.Marker({
|
map: map,
|
position: poiArr[0].location
|
});
|
|
////
|
map.add(marker);
|
marker.setPosition(marker.getPosition());
|
// map.setCenter(marker.getPosition());
|
infoWindow.setContent(createContent(poiArr[0]));
|
infoWindow.open(map, marker.getPosition());
|
}
|
|
function createContent(poi) {
|
console.log(poi);
|
//信息窗体内容
|
$("#startAddress").val(poi.address);
|
$("#startLon").val(poi.location.lng);
|
$("#startLat").val(poi.location.lat);
|
$("#areaCode").val(poi.adcode);
|
|
var s = [];
|
s.push("<b>名称：" + poi.name + "</b>");
|
s.push("地址：" + poi.address);
|
s.push("电话：" + poi.tel);
|
s.push("类型：" + poi.type);
|
return s.join("<br>");
|
}
|
</script>
|
|
<script>
|
//终点地图加载
|
var marker1, mapp = new AMap.Map("endAddressBody", {
|
resizeEnable: true,
|
zoom: 15,
|
zooms: [3, 20]
|
}); //定位标注当前位置
|
mapp.plugin('AMap.Geolocation', function () {
|
geolocation = new AMap.Geolocation({
|
enableHighAccuracy: true, //是否使用高精度定位，默认:true
|
timeout: 10000, //超过10秒后停止定位，默认：无穷大
|
maximumAge: 0, //定位结果缓存0毫秒，默认：0
|
convert: true, //自动偏移坐标，偏移后的坐标为高德坐标，默认：true
|
showButton: true, //显示定位按钮，默认：true
|
showMarker: true, //定位成功后在定位到的位置显示点标记，默认：true
|
showCircle: true, //定位成功后用圆圈表示定位精度范围，默认：true
|
panToLocation: true, //定位成功后将定位到的位置作为地图中心点，默认：true
|
buttonPosition: 'LB', //定位按钮的停靠位置 LB左下角、 RB右下角
|
buttonOffset: new AMap.Pixel(10, 20), //定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
|
zoomToAccuracy: true, //定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
|
});
|
mapp.addControl(geolocation);
|
geolocation.getCurrentPosition();
|
AMap.event.addListener(geolocation, 'complete', onComplete);
|
//返回定位信息
|
AMap.event.addListener(geolocation, 'error', onError);
|
//返回定位出错信息
|
}); //解析定位结果
|
var cityy;
|
|
mapp.on('click', function (e) {
|
if (marker1 != null) {
|
marker1.setMap(null);
|
}
|
//添加标记点
|
$("#endLon").val(e.lnglat.getLng());
|
$("#endLat").val(e.lnglat.getLat());
|
marker1 = new AMap.Marker({
|
map: mapp,
|
position: new AMap.LngLat(e.lnglat.getLng(), e.lnglat.getLat()), // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9]
|
});
|
regeoCode1(e.lnglat.getLng(),e.lnglat.getLat());
|
});
|
|
|
var infoWindow = new AMap.InfoWindow({
|
autoMove: true,
|
offset: {
|
x: 0,
|
y: -30
|
}
|
}); //回调函数
|
|
|
//根据经纬度获取详细地址
|
function regeoCode1(lon,lat) {
|
|
var lnglat = [];
|
lnglat.push(lon);
|
lnglat.push(lat);
|
mapp.add(marker1);
|
marker1.setPosition(lnglat);
|
|
AMap.service('AMap.Geocoder', function() {
|
geocoder = new AMap.Geocoder({});
|
geocoder.getAddress(lnglat, function (status, result) {
|
if (status === 'complete' && result.regeocode) {
|
var address = result.regeocode.formattedAddress;
|
$("#endAddress").val(address);
|
} else {
|
Feng.error('根据经纬度查询地址失败')
|
}
|
var data={
|
"name":result.regeocode.addressComponent.neighborhood,
|
"location":{
|
"lat":lat,
|
"lng":lon
|
},
|
"address":address,
|
"tel":"",
|
"type":result.regeocode.addressComponent.neighborhoodType
|
};
|
|
infoWindow.setContent(createContentt(data));
|
infoWindow.open(mapp, marker1.getPosition());
|
});
|
})
|
}
|
|
|
function onComplete(data) {
|
var str = [];
|
cityy = data.addressComponent.citycode;
|
str.push('定位结果：' + data.position);
|
str.push('定位类别：' + data.location_type);
|
if (data.accuracy) {
|
str.push('精度：' + data.accuracy + ' 米');
|
}
|
//如为IP精确定位结果则没有精度信息
|
str.push('是否经过偏移：' + (data.isConverted ? '是' : '否'));
|
var lnglatXY = [data.position.getLng(), data.position.getLat()];
|
//地图上所标点的坐标
|
AMap.service('AMap.Geocoder', function () {
|
//回调函数
|
geocoder = new AMap.Geocoder({});
|
geocoder.getAddress(lnglatXY, function (status, result) {
|
if (status === 'complete' && result.info === 'OK') {
|
//获得了有效的地址信息: //即，result.regeocode.formattedAddress
|
// console.log(result.regeocode.formattedAddress);
|
var address = result.regeocode.formattedAddress;
|
str.push('详细地址：' + address);
|
// todo 不弹出信息框
|
// alert(str.join(' | '));
|
} else {
|
// alert(str.join(' | ')); //获取地址失败
|
}
|
});
|
})
|
} //解析定位错误信息
|
function onError(data) {
|
alert('定位失败，原因：' + data.message);
|
}
|
|
//输入搜索点信息
|
var autoOptionss = {
|
city: cityy, //在规定城市搜索、默认全国
|
input: "endAddress"
|
};
|
var autoo = new AMap.Autocomplete(autoOptionss);
|
var placeSearchh = new AMap.PlaceSearch({
|
pageSize: 5, // 单页显示结果条数
|
pageIndex: 1, // 页码
|
children: 0, //不展示子节点数据
|
city: city, // 兴趣点城市
|
citylimit: true, //是否强制限制在设置的城市内搜索
|
panel: "panel", // 结果列表将在此容器中进行展示。
|
autoFitView: true, // 是否自动调整地图视野使绘制的 Marker点都处于视口的可见范围
|
extensions: 'base', //返回基本地址信息 */
|
map: mapp // 展现结果的地图实例
|
}); //构造地点查询类
|
AMap.event.addListener(autoo, "select", selectt); //注册监听，当选中某条记录时会触发
|
function selectt(e) {
|
placeSearchh.setCity(e.poi.adcode);
|
placeSearchh.search(e.poi.name); //关键字查询查询 //设置搜索位置定点标注
|
if (e.poi && e.poi.location) {
|
mapp.setZoom(15);
|
mapp.setCenter(e.poi.location);
|
var id = e.poi.id; //详情查询
|
placeSearchh.getDetails(id, function (status, result) {
|
if (status === 'complete' && result.info === 'OK') {
|
placeSearch_CallBackk(result);
|
}
|
});
|
}
|
}
|
|
var infoWindoww = new AMap.InfoWindow({
|
autoMove: true,
|
offset: {
|
x: 0,
|
y: -30
|
}
|
}); //回调函数
|
function placeSearch_CallBackk(data) {
|
|
if (marker1 != null) {
|
marker1.setMap(null);
|
}
|
var poiArr = data.poiList.pois; //添加marker
|
marker1 = new AMap.Marker({
|
map: mapp,
|
position: poiArr[0].location
|
});
|
|
mapp.add(marker1);
|
marker1.setPosition(marker1.getPosition());
|
|
/* mapp.setCenter(marker.getPosition());*/
|
infoWindow.setContent(createContentt(poiArr[0]));
|
infoWindow.open(mapp, marker1.getPosition());
|
}
|
|
function createContentt(poi) {
|
console.log(poi);
|
//信息窗体内容
|
$("#endAddress").val(poi.address);
|
$("#endLon").val(poi.location.lng);
|
$("#endLat").val(poi.location.lat);
|
$("#areaCode").val(poi.adcode);
|
|
var ss = [];
|
ss.push("<b>名称：" + poi.name + "</b>");
|
ss.push("地址：" + poi.address);
|
ss.push("电话：" + poi.tel);
|
ss.push("类型：" + poi.type);
|
return ss.join("<br>");
|
}
|
</script>
|
@}
|
