@layout("/common/_container.html"){
|
<div class="row">
|
<div class="col-sm-12">
|
<div class="ibox float-e-margins">
|
<div class="ibox-title">
|
<h5>详情</h5>
|
</div>
|
<div class="ibox-content">
|
<div class="row row-lg">
|
<div class="col-sm-12">
|
|
<input hidden id="startLng" value="${startLng}">
|
<input hidden id="startLat" value="${startLat}">
|
<input hidden id="endLng" value="${endLng}">
|
<input hidden id="endLat" value="${endLat}">
|
|
<hr/>
|
<div class="initialLevel col-sm-12 control-label form-group" >
|
<div style="background-color: gray;height: 35px;line-height: 35px">
|
<label style="color: #0C0C0C">订单详情</label>
|
</div>
|
</div>
|
<hr/>
|
|
<div class="initialLevel col-sm-12 control-label form-group" >
|
<div class="initialLevel col-sm-3 control-label form-group" >
|
<label class="control-label" >下单时间:</label>
|
<label>${createTime}</label>
|
</div>
|
<div class="initialLevel col-sm-3 control-label form-group" >
|
<label class="control-label" >订单编号:</label>
|
<label>${code}</label>
|
</div>
|
</div>
|
|
<div class="initialLevel col-sm-12 control-label form-group" >
|
<div class="initialLevel col-sm-3 control-label form-group" >
|
<label class="control-label" >订单来源:</label>
|
@if(source==1){
|
<label>小程序</label>
|
@}
|
@if(source==2){
|
<label>APP</label>
|
@}
|
</div>
|
<div class="initialLevel col-sm-3 control-label form-group" >
|
<label class="control-label" >乘车时间:</label>
|
<label>${startTime}</label>
|
</div>
|
</div>
|
|
<div class="initialLevel col-sm-12 control-label form-group" style="color:green;" >
|
<div class="initialLevel col-sm-3 control-label form-group" >
|
<label class="control-label">下单用户昵称:</label>
|
<label>${userName}</label>
|
</div>
|
<div class="initialLevel col-sm-2 control-label form-group" >
|
<label class="control-label">下单用户手机号:</label>
|
<label>${userPhone}</label>
|
</div>
|
</div>
|
|
<div class="initialLevel col-sm-12 control-label form-group" >
|
<div class="initialLevel col-sm-3 control-label form-group" >
|
<label class="control-label">起点:</label>
|
<label>${startAddress}</label>
|
</div>
|
<div class="initialLevel col-sm-2 control-label form-group" >
|
<label class="control-label">终点:</label>
|
<label>${endAddress}</label>
|
</div>
|
</div>
|
|
<div class="initialLevel col-sm-12 control-label form-group" style="color:red;" >
|
<div class="initialLevel col-sm-3 control-label form-group" >
|
<label class="control-label">接单司机:</label>
|
<label>${driverName}</label>
|
</div>
|
<div class="initialLevel col-sm-2 control-label form-group" >
|
<label class="control-label">所属机构:</label>
|
<label>${branchOfficeName}</label>
|
</div>
|
</div>
|
|
<hr/>
|
<div class="initialLevel col-sm-12 control-label form-group" >
|
<div style="background-color: gray;height: 35px;line-height: 35px">
|
<label style="color: #0C0C0C">上下地点</label>
|
</div>
|
</div>
|
<hr/>
|
|
<div class="initialLevel col-sm-12 control-label form-group" >
|
<div class="initialLevel col-sm-3 control-label form-group" >
|
<label class="control-label" >上车地点:</label>
|
<label>${startAddress}</label>
|
</div>
|
<div class="initialLevel col-sm-2 control-label form-group" >
|
<label class="control-label">上车时间:</label>
|
<label>${boardingTime}</label>
|
</div>
|
</div>
|
|
<div class="initialLevel col-sm-12 control-label form-group" >
|
<div class="initialLevel col-sm-3 control-label form-group" >
|
<label class="control-label" >下车地点:</label>
|
<label>${endAddress}</label>
|
</div>
|
<div class="initialLevel col-sm-3 control-label form-group" >
|
<label class="control-label" >下车时间:</label>
|
<label>${getoffTime}</label>
|
</div>
|
</div>
|
|
<hr/>
|
<div class="initialLevel col-sm-12 control-label form-group" >
|
<div style="background-color: gray;height: 35px;line-height: 35px">
|
<label style="color: #0C0C0C">费用明细</label>
|
</div>
|
</div>
|
<hr/>
|
|
<div class="initialLevel col-sm-12 control-label form-group" >
|
<div class="initialLevel col-sm-2 control-label form-group" >
|
<label class="control-label" >起步价:</label>
|
<label>${startPrice}</label>
|
</div>
|
<div class="initialLevel col-sm-3 control-label form-group" >
|
<label class="control-label" >等待费:</label>
|
<label>${waitTimePrice}</label>
|
</div>
|
</div>
|
<div class="initialLevel col-sm-12 control-label form-group" >
|
<div class="initialLevel col-sm-2 control-label form-group" >
|
<label class="control-label" >里程费:</label>
|
<label>${overDrivePrice}</label>
|
</div>
|
<div class="initialLevel col-sm-3 control-label form-group" >
|
<label class="control-label" >恶劣天气:</label>
|
<label>${badWeatherPrice}</label>
|
</div>
|
</div>
|
<div class="initialLevel col-sm-12 control-label form-group" >
|
<div class="initialLevel col-sm-2 control-label form-group" >
|
<label class="control-label" >实际费用:</label>
|
<label>${orderMoney}</label>
|
</div>
|
<div class="initialLevel col-sm-3 control-label form-group" >
|
<label class="control-label" >实际支付费用:</label>
|
<label>${payMoney}</label>
|
</div>
|
</div>
|
<div class="initialLevel col-sm-12 control-label form-group" >
|
<div class="initialLevel col-sm-2 control-label form-group" >
|
<label class="control-label" >优惠券抵扣费用:</label>
|
<label>${discountedPrice}</label>
|
</div>
|
<div class="initialLevel col-sm-3 control-label form-group" >
|
<label class="control-label" >支付方式:</label>
|
@if(payType==1){
|
<label>微信支付</label>
|
@}
|
@if(payType==2){
|
<label>余额支付</label>
|
@}
|
@if(payType==3){
|
<label>线下收款</label>
|
@}
|
</div>
|
</div>
|
|
@if(havDiscount == 1){
|
<div class="initialLevel col-sm-12 control-label form-group" >
|
<div class="initialLevel col-sm-2 control-label form-group" >
|
<label class="control-label" >9折优惠:</label>
|
<label>${multiply}</label>
|
<label>元</label>
|
</div>
|
</div>
|
@}
|
|
@if(startLng != null){
|
<hr/>
|
<div class="initialLevel col-sm-12 control-label form-group" >
|
<div style="background-color: gray;height: 35px;line-height: 35px">
|
<label style="color: #0C0C0C">行程轨迹</label>
|
</div>
|
</div>
|
<hr/>
|
|
<div class="initialLevel col-sm-12 control-label form-group" >
|
<div id="container" ></div>
|
<div id="panel" ></div>
|
</div>
|
@}
|
|
<hr/>
|
<div class="initialLevel col-sm-12 control-label form-group" >
|
<div style="background-color: gray;height: 35px;line-height: 35px">
|
<label style="color: #0C0C0C">行程录音</label>
|
</div>
|
</div>
|
<hr/>
|
|
<div class="initialLevel col-sm-12 control-label form-group" >
|
<audio id="audio" autoplay controls muted>
|
<!-- <source src="http://www.w3capi.com/upload/audio/audio_example.mp3" type="audio/mpeg">-->
|
<source src="${routeRecord}" type="audio/mpeg">
|
</audio>
|
</div>
|
|
<div class="hidden-xs" id="TDriverTableToolbar" role="group" style="text-align: center">
|
<#button name="取消" icon="fa-plus" clickFun="TOrderInfoDlg.close()" />
|
</div>
|
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<script src="${ctxPath}/static/modular/system/tOrder/tOrder.js"></script>
|
<script src="${ctxPath}/static/modular/system/tOrder/tOrder_info.js"></script>
|
|
<!--<script type="text/javascript" src="https://webapi.amap.com/maps?v=2.0&key=1d43098bcd98ab124623e7e4bcc9595e&plugin=AMap.Driving"></script>-->
|
<!--<script type="text/javascript" src="https://a.amap.com/jsapi_demos/static/demo-center/js/demoutils.js"></script>-->
|
<!--<script type="text/javascript" src="https://cache.amap.com/lbs/static/addToolbar.js"></script>-->
|
<script src="https://webapi.amap.com/loader.js"></script>
|
|
<style type="text/css">
|
#container {
|
background-color: white;
|
height: 420px;
|
width: 1200px;
|
}
|
#audio {
|
height: 100px;
|
width: 600px;
|
}
|
#panel {
|
position: fixed;
|
background-color: white;
|
max-height: 90%;
|
overflow-y: auto;
|
top: 10px;
|
right: 10px;
|
width: 280px;
|
}
|
#panel .amap-call {
|
background-color: #009cf9;
|
border-top-left-radius: 4px;
|
border-top-right-radius: 4px;
|
}
|
#panel .amap-lib-driving {
|
border-bottom-left-radius: 4px;
|
border-bottom-right-radius: 4px;
|
overflow: hidden;
|
}
|
</style>
|
<script type="text/javascript">
|
window._AMapSecurityConfig = {
|
securityJsCode:'b62d9146929db08c4c2f4537d045320d',
|
};
|
laydate.render({
|
elem: '#createTime',
|
type: 'date',
|
range: true
|
});
|
if(null != $('#startLng').val() && '' != $('#startLng').val()){
|
AMapLoader.reset() // 需要把这个reset一下
|
AMapLoader.load({
|
"key": "1d43098bcd98ab124623e7e4bcc9595e", // 申请好的Web端开发者Key，首次调用 load 时必填
|
"version": "2.0", // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
|
"plugins": ['AMap.Driving'], // 需要使用的的插件列表，如比例尺'AMap.Scale'等
|
"AMapUI": { // 是否加载 AMapUI，缺省不加载
|
"version": '1.1', // AMapUI 版本
|
"plugins":['overlay/SimpleMarker'], // 需要加载的 AMapUI ui插件
|
},
|
"Loca":{ // 是否加载 Loca， 缺省不加载
|
"version": '2.0' // Loca 版本
|
},
|
}).then((AMap)=>{
|
//初始化地图对象，加载地图
|
var map = new AMap.Map('container', {
|
viewMode: '2D', // 默认使用 2D 模式，如果希望使用带有俯仰角的 3D 模式，请设置 viewMode: '3D',
|
zoom:13, //初始化地图层级
|
center: [$('#startLng').val(), $('#startLat').val()] //初始化地图中心点
|
});
|
//构造路线导航类
|
var driving = new AMap.Driving({
|
map: map,
|
});
|
// 根据起终点经纬度规划驾车导航路线
|
driving.search(new AMap.LngLat($('#startLng').val(), $('#startLat').val()), new AMap.LngLat($('#endLng').val(), $('#endLat').val()), function(status, result) {
|
// result 即是对应的驾车导航信息，相关数据结构文档请参考 https://lbs.amap.com/api/javascript-api/reference/route-search#m_DrivingResult
|
if (status === 'complete') {
|
Feng.success('绘制订单路线完成')
|
} else {
|
Feng.error('获取驾车数据失败：' + result)
|
}
|
});
|
}).catch((e)=>{
|
console.error(e); //加载错误提示
|
});
|
}else {
|
Feng.info('该订单未完成,无地图路线显示!')
|
}
|
|
|
</script>
|
@}
|
