首次提交

This commit is contained in:
duan
2024-06-06 11:48:06 +08:00
parent 7d3ace3cd2
commit 3fe43d0841
270 changed files with 51481 additions and 1 deletions

View File

@@ -0,0 +1,937 @@
<template>
<view class="content">
<view class="list_box1">
<view class="part2" v-if="orderDelites.indentType == 1 || orderDelites.indentType == 2">
<view class="box_add">
<!-- <view class="distance">
<view v-if="orderDelites.distancess>1000">{{(Number(orderDelites.distancess) / 1000).toFixed(2)}}</view>
<view v-else>{{Number(orderDelites.distancess?(orderDelites.distancess).toFixed(2):0)}}</view>
<view class="a" v-if="orderDelites.distancess>1000">km</view>
<view class="a" v-else>m</view>
<view>{{orderDelites.distancess}}</view>
</view> -->
<view class="add_name" @click="goStart()">
<view class="flex align-center">
<view class="buy">
<image src="../../../static/rider/icon-buy.png"></image>
</view>
<view class="sh_name">
{{orderDelites.shopAddressDetail}}({{orderDelites.shopProvince?orderDelites.shopProvince:''}}{{orderDelites.shopCity?orderDelites.shopCity:''}}{{orderDelites.shopDistrict?orderDelites.shopDistrict:''}})
<u-icon name="map"></u-icon>
</view>
</view>
<!-- <view class="xs_add">
{{orderDelites.shopProvince?orderDelites.shopProvince:''}}{{orderDelites.shopCity?orderDelites.shopCity:''}}
{{orderDelites.shopDistrict?orderDelites.shopDistrict:''}}
</view> -->
</view>
</view>
<!-- <view class="jiantou">
<image src="../../../static/rider/jiantou.png"></image>
<view>{{orderDelites.distance}}</view>
</view> -->
<view class="box_add">
<!-- <view class="distance">
<view v-if="orderDelites.distance>1000">{{(Number(orderDelites.distance)/ 1000).toFixed(2)}}</view>
<view v-else>{{Number(orderDelites.distance?(orderDelites.distance).toFixed(2):0)}}</view>
<view class="a" v-if="orderDelites.distance>1000">km</view>
<view class="a" v-else>m</view>
<view>{{orderDelites.distancessd}}</view>
</view> -->
<view class="add_name" @click="goEnd()">
<view class="flex align-center">
<view class="send">
<image src="../../../static/rider/icon-send.png"></image>
</view>
<view class="sh_name">
{{orderDelites.userAddressDetail}}({{orderDelites.userProvince?orderDelites.userProvince:''}}{{orderDelites.userCity?orderDelites.userCity:''}}{{orderDelites.userDistrict?orderDelites.userDistrict:''}})
<u-icon name="map"></u-icon>
</view>
</view>
</view>
</view>
</view>
<view class="part2" v-if="orderDelites.indentType == 3 && orderDelites.buyType==0">
<view class="box_add">
<!-- <view class="distance">
<view v-if="orderDelites.distance>1000">{{(Number(orderDelites.distance)/ 1000).toFixed(2)}}</view>
<view v-else>{{Number(orderDelites.distance?(orderDelites.distance).toFixed(2):0)}}</view>
<view class="a" v-if="orderDelites.distance>1000">km</view>
<view class="a" v-else>m</view>
<view>{{orderDelites.distancessd}}</view>
</view> -->
<view class="add_name flex align-center" @click="goEnd()">
<view class="send">
<image src="../../../static/rider/icon-send.png"></image>
</view>
<view class="sh_name">
{{orderDelites.userAddressDetail}}({{orderDelites.userProvince?orderDelites.userProvince:''}}{{orderDelites.userCity?orderDelites.userCity:''}}{{orderDelites.userDistrict?orderDelites.userDistrict:''}})
<u-icon name="map"></u-icon>
</view>
</view>
</view>
</view>
<view class="part2" v-if="orderDelites.indentType == 3 && orderDelites.buyType==1">
<view class="box_add">
<!-- <view class="distance">
<view v-if="orderDelites.distancess>1000">{{(Number(orderDelites.distancess) / 1000).toFixed(2)}}</view>
<view v-else>{{Number(orderDelites.distancess?(orderDelites.distancess).toFixed(2):0)}}</view>
<view class="a" v-if="orderDelites.distancess>1000">km</view>
<view class="a" v-else>m</view>
<view>{{orderDelites.distancess}}</view>
</view> -->
<view class="add_name flex" @click="goStart()">
<view class="buy">
<image src="../../../static/rider/icon-buy.png"></image>
</view>
<view class="sh_name">
{{orderDelites.shopAddressDetail}}({{orderDelites.shopProvince?orderDelites.shopProvince:''}}{{orderDelites.shopCity?orderDelites.shopCity:''}}{{orderDelites.shopDistrict?orderDelites.shopDistrict:''}})
<u-icon name="map"></u-icon>
</view>
<!-- <view class="xs_add">
{{orderDelites.shopProvince?orderDelites.shopProvince:''}}{{orderDelites.shopCity?orderDelites.shopCity:''}}
{{orderDelites.shopDistrict?orderDelites.shopDistrict:''}}
</view> -->
</view>
</view>
<!-- <view class="jiantou">
<image src="../../../static/rider/jiantou.png"></image>
<view>{{orderDelites.distance}}</view>
</view> -->
<view class="box_add">
<!-- <view class="distance">
<view v-if="orderDelites.distance>1000">{{(Number(orderDelites.distance)/ 1000).toFixed(2)}}</view>
<view v-else>{{Number(item.distance?(item.distance).toFixed(2):0)}}</view>
<view class="a" v-if="orderDelites.distance>1000">km</view>
<view class="a" v-else>m</view>
<view>{{orderDelites.distancessd}}</view>
</view> -->
<view class="add_name" @click="goEnd()">
<view class="flex align-center">
<view class="send">
<image src="../../../static/rider/icon-send.png"></image>
</view>
<view class="sh_name">
{{orderDelites.userAddressDetail}}({{orderDelites.userProvince?orderDelites.userProvince:''}}{{orderDelites.userCity?orderDelites.userCity:''}}{{orderDelites.userDistrict?orderDelites.userDistrict:''}})
<u-icon name="map"></u-icon>
</view>
</view>
</view>
</view>
</view>
<view class="part2" v-if="orderDelites.indentType == 4">
<view class="box_add">
<view class="distance">
<!-- <view v-if="orderDelites.distancessd>1000">{{(Number(orderDelites.distancessd)/ 1000).toFixed(2)}}</view>
<view v-else>{{Number(orderDelites.distancessd?(orderDelites.distancessd).toFixed(2):0)}}</view>
<view class="a" v-if="orderDelites.distancessd>1000">km</view>
<view class="a" v-else>m</view> -->
<!-- <view>{{orderDelites.distancessd}}</view> -->
</view>
<view class="add_name" @click="goEnd()">
<view class="send">
<image src="../../../static/rider/icon-send.png"></image>
</view>
<view class="sh_name">
{{orderDelites.userAddressDetail}}({{orderDelites.userProvince?orderDelites.userProvince:''}}{{orderDelites.userCity?orderDelites.userCity:''}}{{orderDelites.userDistrict?orderDelites.userDistrict:''}})
<u-icon name="map"></u-icon>
</view>
</view>
</view>
</view>
<view class="part2" v-if="orderDelites.indentType == 5">
<view class="box_add">
<view class="distance">
<!-- <view v-if="orderDelites.distancess>1000">{{(Number(orderDelites.distancess) / 1000).toFixed(2)}}</view>
<view v-else>{{Number(orderDelites.distancess?(orderDelites.distancess).toFixed(2):0)}}</view>
<view class="a" v-if="orderDelites.distancess>1000">km</view>
<view class="a" v-else>m</view> -->
<view>{{orderDelites.distancess}}</view>
</view>
<view class="add_name" @click="goStart()">
<view class="flex align-center">
<view class="buy">
<image src="../../../static/rider/icon-buy.png"></image>
</view>
<view class="sh_name">
{{orderDelites.shopAddressDetail}}
<u-icon name="map"></u-icon>
</view>
</view>
<view class="xs_add">
{{orderDelites.shopProvince?orderDelites.shopProvince:''}}{{orderDelites.shopCity?orderDelites.shopCity:''}}
{{orderDelites.shopDistrict?orderDelites.shopDistrict:''}}
</view>
</view>
</view>
<view class="jiantou">
<image src="../../../static/rider/jiantou.png"></image>
<!-- <view>{{orderDelites.distance}}</view> -->
</view>
<view class="box_add">
<view class="distance">
<!-- <view v-if="orderDelites.distance>1000">{{(Number(orderDelites.distance)/ 1000).toFixed(2)}}</view>
<view v-else>{{Number(item.distance?(item.distance).toFixed(2):0)}}</view>
<view class="a" v-if="orderDelites.distance>1000">km</view>
<view class="a" v-else>m</view> -->
<view>{{orderDelites.distancessd}}</view>
</view>
<view class="add_name" @click="goEnd()">
<view class="flex align-center">
<view class="send">
<image src="../../../static/rider/icon-send.png"></image>
</view>
<view class="sh_name">
{{orderDelites.userAddressDetail}}({{orderDelites.userProvince?orderDelites.userProvince:''}}{{orderDelites.userCity?orderDelites.userCity:''}}{{orderDelites.userDistrict?orderDelites.userDistrict:''}})
<u-icon name="map"></u-icon>
</view>
</view>
</view>
</view>
</view>
</view>
<!-- tip -->
<view class="tip_box" v-if="orderDelites.indentType != 5">
<view class="tip_part1">
<view class="tip_title" v-if="orderDelites.indentType == 1">帮送清单</view>
<view class="tip_title" v-if="orderDelites.indentType == 2">帮取清单</view>
<view class="tip_title" v-if="orderDelites.indentType == 3">帮买清单</view>
<view class="tip_title" v-if="orderDelites.indentType == 4">服务内容</view>
<view class="tip_rider" v-if="orderDelites.prepayMoney">
用户预付:<text>{{orderDelites.prepayMoney}}</text>
</view>
<view class="box_two1" v-if="orderDelites.itemType">{{orderDelites.itemType}}</view>
<view class="box_two1" v-if="orderDelites.itemValue">{{orderDelites.itemValue}}</view>
<view class="box_two1" v-if="orderDelites.itemWeight">{{orderDelites.itemWeight}}</view>
</view>
<u-line color="#F2F2F2" />
<view class="tip_content" v-if="orderDelites.indentType == 3">
{{orderDelites.productDetails?orderDelites.productDetails:''}}
</view>
<view class="tip_content"
v-if="orderDelites.indentType == 1 || orderDelites.indentType == 2&&orderDelites.remarks">
备注{{orderDelites.remarks?orderDelites.remarks:''}}</view>
<view class="tip_content" v-if="orderDelites.indentType == 4">
{{orderDelites.serviceDetails?orderDelites.serviceDetails:''}}
</view>
</view>
<!-- 订单信息 -->
<view class="order_box">
<view class="order_title">订单信息</view>
<view class="order_list">
<view class="order_name">订单号码</view>
<view class="order_numbers" @click="copyOrder(orderDelites.indentNumber)">{{orderDelites.indentNumber}}
<u-icon name="order"></u-icon>
</view>
</view>
<view class="order_list">
<view class="order_name">送达时间</view>
<view class="order_numbers">
{{orderDelites.sendOutTime?orderDelites.sendOutTime:'立即配送'}}
</view>
</view>
<view class="order_list" v-if="orderDelites.remarks">
<view class="order_name">订单备注</view>
<view class="order_numbers">
{{orderDelites.remarks}}
</view>
</view>
<!-- <view class="order_list">
<view class="order_name">发票抬头</view>
<view class="order_numbers">(不需要发票)</view>
</view> -->
</view>
<!-- 费用明细 -->
<view class="order_box">
<view class="order_title">费用明细</view>
<view class="order_list">
<view class="income_name">跑腿费</view>
<view class="income_numbers">¥<text>{{orderDelites.errandMoney}}</text></view>
</view>
<view class="order_list" v-if="orderDelites.tip">
<view class="income_name">小费奖励</view>
<view class="income_numbers">¥<text>{{orderDelites.tip?orderDelites.tip:0}}</text></view>
</view>
<view class="order_list" v-if="orderDelites.prepayMoney">
<view class="income_name">商品费用</view>
<view class="income_numbers1">¥<text>{{orderDelites.prepayMoney}}</text></view>
</view>
</view>
<!-- 接单按钮 -->
<view class="tabbar_btn">
<view class="btn" @click="bindorder">
接单
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
orderDelites: {},
longitude: '', //骑手起点经度
latitude: '', //骑手起点纬度
qiJuli: '', //骑手距离
dianJuli: '', //店家之间距离
checkCertification: '',
userId: '',
arr: [],
showModal: false
}
},
onLoad(options) {
uni.showLoading({
title: '加载中......',
icon: 'none'
})
console.log(options)
this.indentNumber = options.id
var that = this
uni.getLocation({
type: 'wgs84',
success: function(res) {
console.log('当前位置的经度:' + res.longitude);
console.log('当前位置的纬度:' + res.latitude);
that.longitude = res.longitude
that.latitude = res.latitude
that.taskData()
}
});
that.userId = that.$queue.getData("userId");
},
onShow() {
this.checkCertification = this.$queue.getData("checkCertification");
// //用户端骑手转单订单通知 335
// this.$Request.getT('/app/common/type/335').then(res => {
// if (res.code === 0) {
// this.arr = [];
// this.arr.push(res.data.value)
// }
// });
// #ifdef MP-WEIXIN
//订阅
// if (this.userId) {
// if (this.showModal) {
// this.openMsg()
// }
// }
// #endif
},
methods: {
openMsg() {
console.log('订阅消息')
var that = this
uni.getSetting({
withSubscriptions: true, //是否获取用户订阅消息的订阅状态默认false不返回
success(ret) {
console.log(ret.subscriptionsSetting, '------------------')
// if (ret.subscriptionsSetting.itemSettings && Object.keys(ret.subscriptionsSetting.itemSettings).length == 2) {
if (ret.subscriptionsSetting.itemSettings) {
uni.setStorageSync('sendOrderMsg', true)
uni.openSetting({ // 打开设置页
success(rea) {
console.log(rea.authSetting)
}
});
} else { // 用户没有点击“总是保持以上,不再询问”则每次都会调起订阅消息
uni.setStorageSync('sendOrderMsg', false)
uni.showModal({
title: '提示',
content: '为了更好的体验,请绑定消息推送',
confirmText: '确定',
cancelText: '取消',
success: function(res) {
if (res.confirm) {
wx.requestSubscribeMessage({
tmplIds: that.arr,
success(re) {
var datas = JSON.stringify(re);
if (datas.indexOf("accept") != -1) {
console.log(re)
// uni.setStorageSync('sendMsg', true)
}
},
fail: (res) => {
console.log(res)
}
})
// uni.setStorageSync('sendMsg', true)
that.showModal = false
} else if (res.cancel) {
console.log('取消')
// uni.setStorageSync('sendMsg', false)
// that.showModal = true
}
}
})
}
}
})
},
copyOrder(value) {
// #ifdef MP-WEIXIN
if (uni.getStorageSync('sendOrderMsg')) {
uni.requestSubscribeMessage({
tmplIds: this.arr,
success(re) {
// console.log(re,'**********')
var datas = JSON.stringify(re);
if (datas.indexOf("accept") != -1) {
console.log(re)
}
},
fail: (res) => {
console.log(res)
}
})
}
// #endif
uni.setClipboardData({
data: value, //要被复制的内容
success: () => { //复制成功的回调函数
uni.showToast({ //提示
title: '复制成功'
})
}
});
},
// 获取任务数据
taskData() {
this.$Request.postT('/app/tbindent/indentMessage', {
indentNumber: this.indentNumber,
ol: this.longitude,
od: this.latitude
}).then(res => {
if (res.code == 0) {
uni.hideLoading()
if (res.data.distancess > 1000) {
res.data.distancess = Number((res.data.distancess / 1000)).toFixed(2) + "km"
} else {
if (res.data.distancess == 0) {
res.data.distancess = "0m";
} else {
res.data.distancess = Number(res.data.distancess).toFixed(1) + "m";
}
}
if (res.data.distance > 1000) {
res.data.distance = Number((res.data.distance / 1000)).toFixed(2) + "km"
} else {
res.data
if (res.data.distance == 0) {
res.data.distance = "0m";
} else {
res.data.distance = Number(res.data.distance).toFixed(1) + "m";
}
}
if (res.data.distancessd > 1000) {
res.data.distancessd = Number((res.data.distancessd / 1000)).toFixed(2) + "km"
} else {
if (res.data.distancessd == 0) {
res.data.distancessd = "0m";
} else {
res.data.distancessd = Number(res.data.distancessd).toFixed(1) + "m";
}
}
this.orderDelites = res.data
} else {
console.log('失败:', res.data)
}
});
},
bindorder() {
let that = this
if (!that.userId) {
uni.showModal({
title: '提示',
content: '请先登录后再接单',
success: function(res) {
if (res.confirm) {
console.log('用户点击确定');
uni.navigateTo({
url: '/pages/login/login'
})
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
return;
}
// #ifdef MP-WEIXIN
if (uni.getStorageSync('sendOrderMsg')) {
uni.requestSubscribeMessage({
tmplIds: this.arr,
success(re) {
// console.log(re,'**********')
var datas = JSON.stringify(re);
if (datas.indexOf("accept") != -1) {
console.log(re)
}
},
fail: (res) => {
console.log(res)
}
})
}
// #endif
if (that.checkCertification == null) {
uni.showModal({
title: '提示',
content: '请先实名认证后再接单',
success: function(res) {
if (res.confirm) {
console.log('用户点击确定');
uni.navigateTo({
url: '/pages/riderMy/approve/approve'
})
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
return;
}
if (that.checkCertification == 0) {
uni.showToast({
title: '实名认证审核中,无法接单',
icon: 'none'
});
return;
}
if (that.checkCertification == 2) {
uni.showToast({
title: '实名认证未通过,无法接单',
icon: 'none'
});
return;
}
uni.showModal({
title: '提示',
content: '确认接单吗',
success: function(res) {
if (res.confirm) {
console.log('用户点击确定');
that.$Request.postT('/app/tbindent/indentReceiving', {
indentNumber: that.indentNumber
}).then(res => {
if (res.code == 0) {
uni.navigateTo({
url: '/pages/index/orderdetail/orderdetail?id=' + that
.indentNumber
})
} else {
console.log('失败:', res.data)
uni.showToast({
title: res.msg,
icon: 'none',
duration: 1500
});
setTimeout(()=>{
uni.reLaunch({
url:'/pages/index/index'
})
},1500)
}
});
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
},
// 计算两点之间的距离
jsjl(qj, qw, jj, jw) {
this.$Request.postT('/app/indent/findNewIndent', {
ol: qj,
od: qw,
dl: jj,
dd: jw
}).then(res => {
// if(){
// }
});
},
goStart() {
// let obj = {
// name: this.orderDelites.shopAddressDetail,
// lat: this.orderDelites.shopLat,
// long: this.orderDelites.shopLng,
// }
// this.navgate(obj)
// 一键导航
let latitude = this.orderDelites.shopLat
let longitude = this.orderDelites.shopLng
let name = this.orderDelites.shopAddressDetail
uni.openLocation({
latitude: Number(latitude), //要去的纬度-地址
longitude: Number(longitude), //要去的经度-地址
name: name, //地址名称
address: name, //详细地址名称
success: function() {
console.log('导航成功');
},
fail: function(error) {
console.log(error)
}
})
},
goEnd() {
// let obj = {
// name: this.orderDelites.userAddressDetail,
// lat: this.orderDelites.userLat,
// long: this.orderDelites.userLng,
// }
// this.navgate(obj)
let latitude = this.orderDelites.userLat
let longitude = this.orderDelites.userLng
let name = this.orderDelites.userAddressDetail
uni.openLocation({
latitude: Number(latitude), //要去的纬度-地址
longitude: Number(longitude), //要去的经度-地址
name: name, //地址名称
address: name, //详细地址名称
success: function() {
console.log('导航成功');
},
fail: function(error) {
console.log(error)
}
})
},
navgate(e) {
let plugin = requirePlugin('routePlan');
let key = this.$queue.getData('mapKey'); //使用在腾讯位置服务申请的key
let referer = this.$queue.getData('mapName'); //调用插件的app的名称
let endPoint = JSON.stringify({ //终点
'name': e.name,
'latitude': e.lat,
'longitude': e.long
});
wx.navigateTo({
url: 'plugin://routePlan/index?key=' + key + '&referer=' + referer + '&endPoint=' + endPoint
});
}
}
}
</script>
<style>
body {
background: #F5F5F5;
}
.content {
width: 100%;
margin-bottom: 159rpx;
}
.list_box1 {
width: 90%;
margin: 0 auto;
/* height: 320rpx; */
background: #FFFFFF;
border-radius: 23rpx;
box-shadow: 0rpx 5rpx 5rpx 0rpx rgba(198, 186, 181, 0.20);
margin-top: 20rpx;
}
.part2 {
width: 92%;
margin: 0 auto;
padding: 25rpx 0;
}
.box_add {
display: flex;
}
.box_two1 {
background: #c4e2ff;
color: #359CFF;
width: 72px;
height: 45rpx;
font-size: 22rpx;
text-align: center;
line-height: 45rpx;
border-radius: 5rpx;
margin-top: 20rpx;
margin-left: 10rpx;
}
.distance {
flex: 1;
/* text-align: center; */
font-size: 28rpx;
display: flex;
align-items: center;
justify-content: left;
}
.a {
font-size: 16rpx;
}
.add_name {
flex: 8;
position: relative;
padding-bottom: 20px;
}
.buy {
/* position: absolute;
top: 0rpx; */
}
.buy image {
width: 20px;
height: 20px;
}
.send {
/* position: absolute;
top: 0rpx; */
}
.send image {
width: 20px;
height: 20px;
}
.sh_name {
font-size: 30rpx;
font-weight: bold;
letter-spacing: 2rpx;
/* text-indent: 15rpx; */
margin-left: 8upx;
}
.xs_add {
color: #999999;
font-size: 24rpx;
margin-top: 10rpx;
margin-left: 30px;
}
.jiantou {
margin-left: 23rpx;
display: flex;
/* justify-content: space-between; */
align-items: center;
}
.jiantou image {
width: 20rpx;
height: 40rpx;
}
.jiantou>view {
margin-left: 10rpx;
}
.part3 {
width: 90%;
margin: 0 auto;
display: flex;
}
.three_left {
flex: 1;
height: 100rpx;
display: flex;
justify-content: left;
align-items: center;
}
.three_left image {
width: 36rpx;
height: 37rpx;
}
.three_left text {
color: #333333;
font-size: 25rpx;
margin-left: 10rpx;
}
.three_right {
flex: 1;
height: 100rpx;
display: flex;
justify-content: flex-end;
align-items: center;
color: #FF412D;
font-size: 32rpx;
font-weight: bold;
}
/* tip */
.tip_box {
width: 90%;
margin: 0 auto;
/* height: 180rpx; */
background: #FFFFFF;
margin-top: 20rpx;
border-radius: 22rpx;
}
.tip_part1 {
display: flex;
}
.tip_title {
/* flex: 1; */
height: 80rpx;
display: flex;
justify-content: left;
align-items: center;
font-size: 32rpx;
font-weight: bold;
margin-left: 30rpx;
}
.tip_rider {
/* flex: 1; */
font-size: 20rpx;
display: flex;
justify-content: flex-end;
align-items: center;
margin-left: 30rpx;
}
.tip_rider text {
font-size: 30rpx;
}
.tip_content {
width: 90%;
margin: 0 auto;
font-size: 27rpx;
font-weight: bold;
letter-spacing: 2rpx;
margin-top: 15rpx;
padding-bottom: 15rpx;
}
.u-line {
border-bottom-width: 3px !important;
}
/* 订单信息 */
.order_box {
width: 90%;
margin: 0 auto;
/* height: 300rpx; */
background: #ffffff;
margin-top: 20rpx;
border-radius: 22rpx;
}
.order_title {
width: 90%;
margin: 0 auto;
font-size: 32rpx;
font-weight: 600;
line-height: 67rpx;
letter-spacing: 3rpx;
}
.order_list {
display: flex;
}
.order_name {
flex: 1;
margin-left: 35rpx;
color: #999999;
font-size: 25rpx;
height: 75rpx;
display: flex;
justify-content: left;
align-items: center;
}
.order_numbers {
flex: 1;
color: #333333;
display: flex;
justify-content: flex-end;
align-items: center;
font-size: 26rpx;
margin-right: 35rpx;
}
/* 费用明细 */
.income_name {
flex: 1;
margin-left: 35rpx;
color: #999999;
font-size: 26rpx;
height: 75rpx;
display: flex;
justify-content: left;
align-items: center;
}
.income_numbers {
flex: 1;
color: #333333;
display: flex;
justify-content: flex-end;
align-items: center;
font-size: 26rpx;
margin-right: 35rpx;
}
.income_numbers1 {
flex: 1;
color: #FF2400;
display: flex;
justify-content: flex-end;
align-items: center;
font-size: 26rpx;
margin-right: 35rpx;
}
/* 接单按钮 */
.tabbar_btn {
position: fixed;
bottom: 0rpx;
left: 0rpx;
right: 0rpx;
width: 100%;
height: 120rpx;
background: #FFFFFF;
display: flex;
justify-content: center;
align-items: center;
}
.btn {
width: 90%;
height: 80rpx;
background: #FF7F00;
border-radius: 21rpx;
color: white;
text-align: center;
line-height: 80rpx;
font-size: 26rpx;
}
</style>

View File

@@ -0,0 +1,506 @@
<template>
<view class="content">
<view class="part2 u-skeleton-fillet">
<view class="box_add">
<!-- <view class="distance">
<view>{{orderDelites.distancessd}}</view>
</view> -->
<view class="add_name" @click="goStart">
<view class="sh_name">
{{orderDelites.userAddressDetail}}({{orderDelites.userProvince}}{{orderDelites.userCity}}{{orderDelites.userDistrict}})
<u-icon name="map"></u-icon>
</view>
</view>
</view>
<u-line color="#F2F2F2" />
<view class="part3">
<view class="three_left">
<image src="../../../static/rider/icon_data.png"></image>
<text>{{orderDelites.sendOutTime}}</text>
</view>
<!-- <view class="three_right">¥{{orderDelites.errandMoney}}</view> -->
</view>
</view>
<!-- tip -->
<view class="tip_box u-skeleton-fillet">
<view class="tip_part1">
<view class="box_two" v-if="orderDelites.indentType==4">同城服务</view>
<view class="box_two" v-if="orderDelites.indentType==3">同城帮买</view>
<view class="box_one" v-if='orderDelites.serviceType'>{{orderDelites.serviceType}}</view>
<view class="box_one" v-if='orderDelites.tool'>{{orderDelites.tool}}</view>
</view>
<u-line color="#F2F2F2" />
<view class="tip_content" v-if="orderDelites.indentType==3">
{{orderDelites.remarks}}
</view>
<view class="tip_content" v-if="orderDelites.indentType==4">
{{orderDelites.serviceDetails}}
</view>
</view>
<!-- 订单信息 -->
<view class="order_box u-skeleton-fillet">
<view class="order_title">订单信息</view>
<view class="order_list">
<view class="order_name">订单号码</view>
<view class="order_numbers" @click="copyOrder(orderDelites.indentNumber)">{{orderDelites.indentNumber}}
<u-icon name="order"></u-icon>
</view>
</view>
<view class="order_list">
<view class="order_name">预约时间</view>
<view class="order_numbers">{{orderDelites.sendOutTime}}</view>
</view>
</view>
<!-- 费用明细 -->
<view class="order_box u-skeleton-fillet">
<view class="order_title">费用明细</view>
<view class="order_list">
<view class="income_name">跑腿费</view>
<view class="income_numbers">¥<text>{{orderDelites.errandMoney}}</text></view>
</view>
<view class="order_list" v-if="orderDelites.tip">
<view class="income_name">小费奖励</view>
<view class="income_numbers">¥<text>{{orderDelites.tip}}</text></view>
</view>
<view class="order_list" v-if="orderDelites.prepayMoney">
<view class="income_name">商品预付</view>
<view class="income_numbers">¥<text>{{orderDelites.prepayMoney}}</text></view>
</view>
<view class="order_list">
<view class="income_name">合计</view>
<view class="income_numbers1">¥<text>{{orderDelites.riderMoney}}</text></view>
</view>
</view>
<!-- 接单按钮 -->
<view class="tabbar_btn">
<view class="btn" @click="bindorder">接单</view>
</view>
<u-skeleton :loading="loading" :animation="true" bgColor="#FFF"></u-skeleton>
</view>
</template>
<script>
export default {
data() {
return {
orderDelites: {},
indentNumber: '',
checkCertification: '',
userId: '',
loading: true, // 是否显示骨架屏组件
}
},
onLoad(options) {
console.log(options)
this.indentNumber = options.id
var that = this
uni.getLocation({
type: 'wgs84',
success: function(res) {
console.log('当前位置的经度:' + res.longitude);
console.log('当前位置的纬度:' + res.latitude);
that.longitude = res.longitude
that.latitude = res.latitude
that.taskData()
}
});
this.userId = that.$queue.getData("userId");
this.checkCertification = that.$queue.getData("checkCertification");
},
methods: {
copyOrder(value) {
uni.setClipboardData({
data: value, //要被复制的内容
success: () => { //复制成功的回调函数
uni.showToast({ //提示
title: '复制成功'
})
}
});
},
goStart() {
// let obj = {
// name: this.orderDelites.deilveryAddressDetail,
// lat: this.orderDelites.userLat,
// long: this.orderDelites.userLng,
// }
// this.navgate(obj)
let latitude = this.orderDelites.userLat
let longitude = this.orderDelites.userLng
let name = this.orderDelites.userAddressDetail
uni.openLocation({
latitude: Number(latitude), //要去的纬度-地址
longitude: Number(longitude), //要去的经度-地址
name: name, //地址名称
address: name, //详细地址名称
success: function() {
console.log('导航成功');
},
fail: function(error) {
console.log(error)
}
})
},
navgate(e) {
let plugin = requirePlugin('routePlan');
let key = this.$queue.getData('mapKey'); //使用在腾讯位置服务申请的key
let referer = this.$queue.getData('mapName'); //调用插件的app的名称
let endPoint = JSON.stringify({ //终点
'name': e.name,
'latitude': e.lat,
'longitude': e.long
});
wx.navigateTo({
url: 'plugin://routePlan/index?key=' + key + '&referer=' + referer + '&endPoint=' + endPoint
});
},
// 获取任务数据
taskData() {
this.$Request.postT('/app/tbindent/indentMessage', {
indentNumber: this.indentNumber,
ol: this.longitude,
od: this.latitude
}).then(res => {
if (res.code == 0) {
if (res.data.distancessd > 1000) {
res.data.distancessd = Number((res.data.distancessd / 1000)).toFixed(2) + "km"
} else {
if (res.data.distancessd == 0) {
res.data.distancessd = "0m";
} else {
res.data.distancessd = Number(res.data.distancessd).toFixed(1) + "m";
}
}
this.orderDelites = res.data
} else {
console.log('res', res.data)
}
this.loading = false;
});
},
bindorder() {
let that = this
if (!that.userId) {
uni.showModal({
title: '提示',
content: '请先登录后再接单',
success: function(res) {
if (res.confirm) {
console.log('用户点击确定');
uni.navigateTo({
url: '/pages/login/login'
})
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
return;
}
if (that.checkCertification != 1) {
uni.showModal({
title: '提示',
content: '请先实名认证后再接单',
success: function(res) {
if (res.confirm) {
console.log('用户点击确定');
uni.navigateTo({
url: '/pages/riderMy/approve/approve'
})
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
return;
}
uni.showModal({
title: '提示',
content: '确认接单吗',
success: function(res) {
if (res.confirm) {
console.log('用户点击确定');
that.$Request.postT('/app/tbindent/indentReceiving', {
indentNumber: that.indentNumber
}).then(res => {
if (res.code == 0) {
uni.navigateTo({
url: '/pages/index/orderdetail/orderdetail?id=' + that
.indentNumber
})
} else {
console.log('失败:', res.data)
uni.showToast({
title: res.msg,
icon: 'none',
duration: 1500
});
}
});
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
}
}
}
</script>
<style>
body {
background: #F5F5F5;
}
.content {
width: 100%;
padding-bottom: 180rpx;
}
.part2 {
width: 90%;
margin: 0 auto;
/* padding-top: 25rpx; */
/* height: 230rpx; */
background: #ffffff;
border-radius: 23rpx;
/* box-shadow: 0rpx 5rpx 5rpx 0rpx rgba(198, 186, 181, 0.20); */
margin-top: 30rpx;
}
.box_add {
display: flex;
/* height: 100rpx; */
/* line-height: 31rpx; */
padding: 15px 17px;
}
.distance {
flex: 1;
text-align: center;
font-size: 28rpx;
margin-top: 15rpx;
}
.a {
font-size: 16rpx;
}
.add_name {
flex: 4;
}
.sh_name {
font-size: 28rpx;
font-weight: bold;
letter-spacing: 2rpx;
}
.xs_add {
color: #999999;
font-size: 24rpx;
margin-top: 10rpx;
}
.u-line {
border-bottom-width: 3px !important;
}
.part3 {
width: 90%;
margin: 0 auto;
display: flex;
}
.three_left {
flex: 1;
height: 100rpx;
display: flex;
justify-content: left;
align-items: center;
}
.three_left image {
width: 36rpx;
height: 37rpx;
}
.three_left text {
color: #333333;
font-size: 25rpx;
margin-left: 10rpx;
}
.three_right {
flex: 1;
height: 100rpx;
display: flex;
justify-content: flex-end;
align-items: center;
color: #FF412D;
font-size: 32rpx;
font-weight: bold;
}
/* tip */
.tip_box {
width: 90%;
margin: 0 auto;
height: 180rpx;
background: #FFFFFF;
margin-top: 20rpx;
border-radius: 22rpx;
}
.tip_part1 {
display: flex;
height: 70rpx;
justify-content: left;
align-items: center;
margin-left: 30rpx;
}
.box_one {
background: #c4e2ff;
color: #359CFF;
height: 45rpx;
font-size: 22rpx;
text-align: center;
line-height: 45rpx;
border-radius: 5rpx;
margin-left: 20rpx;
padding: 0 10rpx
}
.box_two {
font-size: 32rpx;
font-weight: bold;
letter-spacing: 3rpx;
}
.tip_content {
width: 90%;
margin: 0 auto;
font-size: 29rpx;
/* font-weight: bold; */
letter-spacing: 2rpx;
margin-top: 15rpx;
}
.u-line {
border-bottom-width: 3px !important;
}
/* 订单信息 */
.order_box {
width: 90%;
margin: 0 auto;
/* height: 300rpx; */
padding-bottom: 10upx;
background: #ffffff;
margin-top: 20rpx;
border-radius: 22rpx;
}
.order_title {
width: 90%;
margin: 0 auto;
font-size: 32rpx;
font-weight: bold;
line-height: 67rpx;
letter-spacing: 3rpx;
}
.order_list {
display: flex;
}
.order_name {
flex: 1;
margin-left: 35rpx;
color: #999999;
font-size: 25rpx;
height: 75rpx;
display: flex;
justify-content: left;
align-items: center;
}
.order_numbers {
flex: 1;
color: #333333;
display: flex;
justify-content: flex-end;
align-items: center;
font-size: 26rpx;
margin-right: 35rpx;
}
/* 费用明细 */
.income_name {
flex: 1;
margin-left: 35rpx;
color: #999999;
font-size: 26rpx;
height: 75rpx;
display: flex;
justify-content: left;
align-items: center;
}
.income_numbers {
flex: 1;
color: #333333;
display: flex;
justify-content: flex-end;
align-items: center;
font-size: 26rpx;
margin-right: 35rpx;
}
.income_numbers1 {
flex: 1;
color: #FF2400;
display: flex;
justify-content: flex-end;
align-items: center;
font-size: 26rpx;
margin-right: 35rpx;
}
/* 接单按钮 */
.tabbar_btn {
position: fixed;
bottom: 0rpx;
left: 0rpx;
right: 0rpx;
width: 100%;
height: 120rpx;
background: #FFFFFF;
display: flex;
justify-content: center;
align-items: center;
}
.btn {
width: 90%;
height: 80rpx;
background: #FF7F00;
border-radius: 21rpx;
color: white;
text-align: center;
line-height: 80rpx;
font-size: 26rpx;
}
</style>

2799
pages/index/index.vue Normal file

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,152 @@
<template>
<view>
<map id="tencentMap" :style="[...mapStyle]" :show-compass="showCompass" :enable-traffic="enableTraffic"
:longitude="longitude" :latitude="latitude" :markers="markers" :show-location="showLocation"
@markertap="markertap"></map>
</view>
</template>
<script>
export default {
props: {
mapStyle: {
type: Object,
default: {
width: '100%',
height: '600rpx'
}
},
showCompass: { // 是否显示指南针
type: Boolean,
default: true
},
enableTraffic: { // 是否开启实时路况
type: Boolean,
default: false
},
showLocation: { // 是否显示带有方向的当前定位点
type: Boolean,
default: true
},
},
data() {
return {
longitude: '118.72495',
latitude: '32.00834',
markers: [],
}
},
onReady() {
let vm = this
vm.map = uni.createMapContext('tencentMap', this)
vm.getLocation()
},
onReady() {
// wx请求获取位置权限
this.getAuthorize().then(() => {
// 同意后获取
this.getLocationInfo();
}).catch(() => {
// 不同意给出弹框,再次确认
this.openConfirm().then(() => {
this.getLocationInfo();
}).catch(() => {
this.rejectGetLocation();
});
});
},
methods: {
// 初次位置授权
getAuthorize() {
return new Promise((resolve, reject) => {
uni.authorize({
scope: "scope.userLocation",
success: () => {
resolve(); // 允许授权
},
fail: () => {
reject(); // 拒绝授权
},
});
});
},
// 确认授权后,获取用户位置
getLocationInfo() {
const that = this;
uni.getLocation({
type: "gcj02",
success: function(res) {
that.longitude = res.longitude;
that.latitude = res.latitude;
that.markers = [{
id: 2,
latitude: 32.00834,
longitude: 118.72495,
callout: {
content: '奥林皮克体育中心',
color: '#000',
fontSize: 10,
bgColor: '#fff',
padding: 5,
display: 'ALWAYS',
textAlign: 'center'
}
}, ]
}
});
},
// 拒绝授权后,弹框提示是否手动打开位置授权
openConfirm() {
return new Promise((resolve, reject) => {
uni.showModal({
title: "请求授权当前位置",
content: "我们需要获取地理位置信息,为您推荐附近的商家",
success: (res) => {
if (res.confirm) {
uni.openSetting().then((res) => {
if (res[1].authSetting["scope.userLocation"] === true) {
resolve(); // 打开地图权限设置
} else {
reject();
}
});
} else if (res.cancel) {
reject();
}
},
});
});
},
// 彻底拒绝位置获取
rejectGetLocation() {
uni.showToast({
title: "您拒绝了授权,无法获得周边信息",
icon: "none",
duration: 2000,
});
},
// 地图标点 点击事件
markertap(e) {
let plugin = requirePlugin('routePlan');
let key = '5ZKBZ-W3TCU-LSDVC-4XJLB-KQOYO-TVBQ6'; // 使用在腾讯位置服务申请的key
let referer = 'test'; // 调用插件的app的名称
let navigation = 1 // 值为1时开启驾车导航功能默认不开启此功能
let endPoint = JSON.stringify({ // 终点
'name': '奥林皮克体育中心',
'latitude': 32.00834,
'longitude': 118.72495
});
wx.navigateTo({
url: 'plugin://routePlan/index?key=' + key + '&referer=' + referer + '&endPoint=' + endPoint +
'&navigation=' + navigation
});
}
},
}
</script>
<style>
</style>

View File

@@ -0,0 +1,976 @@
<template>
<view class="content">
<view class="part_one u-skeleton-fillet" v-if="orderDelites.indentState=='3' || orderDelites.indentState=='4'">
<view class="pickup" v-if="orderDelites.indentState=='3'">待取货...</view>
<view class="pickup" v-if="orderDelites.indentState=='4'">配送中...</view>
<view class="pickup_tit" v-if="orderDelites.indentState=='3'">抢单成功请及时取货送达</view>
<view class="pickup_tit" v-if="orderDelites.indentState=='4'">取货成功请及时送达</view>
</view>
<view class="part_one u-skeleton-fillet" v-else>
<view class="pickup" v-if="orderDelites.indentState=='5'">已完成...</view>
<view class="pickup" v-if="orderDelites.indentState=='6'">已完成...</view>
<view class="pickup" v-if="orderDelites.indentState=='7'">已完成...</view>
<view class="pickup" v-if="orderDelites.indentState=='9'">已取消...</view>
<view class="pickup" v-if="orderDelites.indentState=='10'">已取消...</view>
<view class="pickup_tit">加油明天会更好</view>
</view>
<view class="part_one u-skeleton-fillet" style="height: auto;"
v-if="orderDelites.indentState=='3'|| orderDelites.indentState=='4' && orderDelites.indentType=='5'&& orderDelites.indentType!='3'">
<view class="pickup">取货码</view>
<view class="pickup_tit quhuoma">{{orderDelites.orderCode}}</view>
</view>
<view class="list_box1 u-skeleton-fillet">
<view class="part2">
<view class="box_add" style="padding-bottom: 12px;"
v-if="orderDelites.indentType == 5||orderDelites.indentType == 1 || orderDelites.indentType == 2 || (orderDelites.indentType==3 &&orderDelites.buyType==1)">
<view class="add_name">
<view class="flex">
<view class="buy">
<image src="../../../static/rider/icon-buy.png"></image>
</view>
<view class="sh_name" @click="goStart()">
{{orderDelites.shopAddressDetail}}
<u-icon name="map"></u-icon>
</view>
</view>
<view class="xs_add" @click="coll(orderDelites.shopPhone)">
{{orderDelites.shopName?orderDelites.shopName:''}}<text
style="margin-left: 10upx;">{{orderDelites.shopPhone?orderDelites.shopPhone:''}}</text>
<u-icon name="phone"></u-icon>
</view>
</view>
</view>
<view class="box_add">
<view class="add_name">
<view class="flex">
<view class="send">
<image src="../../../static/rider/icon-send.png"></image>
</view>
<view class="sh_name" @click="goEnd()">
{{orderDelites.userAddressDetail}}({{orderDelites.userProvince?orderDelites.userProvince:''}}
{{orderDelites.userCity?orderDelites.userCity:''}}{{orderDelites.userDistrict?orderDelites.userDistrict:''}})
<u-icon name="map"></u-icon>
</view>
</view>
<view class="xs_add" @click="coll(orderDelites.userPhone)">
{{orderDelites.userName?orderDelites.userName:''}}<text
style="margin-left: 10upx;">{{orderDelites.userPhone?orderDelites.userPhone:''}}</text>
<u-icon name="phone"></u-icon>
</view>
</view>
</view>
</view>
<view v-if="orderDelites.indentType == 5" style="padding-bottom: 15px;"></view>
<view class="part3" v-if="orderDelites.indentType != 5">
<view class="three_left" v-if="orderDelites.predictTime">
<image src="../../../static/rider/icon_data.png"></image>
<text>{{orderDelites.predictTime}}分钟内送达</text>
</view>
<view class="three_right">{{orderDelites.errandMoney}}</view>
</view>
</view>
<!-- tip -->
<view class="tip_box u-skeleton-fillet" v-if="orderDelites.indentType != 5">
<view class="tip_part1">
<view class="tip_title" v-if="orderDelites.indentType == 1">帮送清单</view>
<view class="tip_title" v-if="orderDelites.indentType == 2">帮取清单</view>
<view class="tip_title" v-if="orderDelites.indentType == 3">帮买清单</view>
<view class="tip_title" v-if="orderDelites.indentType == 4">服务内容</view>
<view class="tip_rider" v-if="orderDelites.prepayMoney" style="margin-right: 16upx;">
商品预付:<text>{{orderDelites.prepayMoney}}</text>
</view>
<view class="box_two1" v-if="orderDelites.itemType">{{orderDelites.itemType}}</view>
<view class="box_two1" v-if="orderDelites.serviceType">{{orderDelites.serviceType}}</view>
<view class="box_two1" v-if="orderDelites.itemValue">{{orderDelites.itemValue}}</view>
<view class="box_two1" v-if="orderDelites.itemWeight">{{orderDelites.itemWeight}}</view>
</view>
<u-line color="#F2F2F2" />
<view class="tip_content" v-if="orderDelites.indentType == 3">
{{orderDelites.productDetails?orderDelites.productDetails:''}}
</view>
<view class="tip_content" v-if="orderDelites.indentType == 1 || orderDelites.indentType == 2">
{{orderDelites.remarks?orderDelites.remarks:''}}
</view>
<view class="tip_content" v-if="orderDelites.indentType == 4">
{{orderDelites.serviceDetails?orderDelites.serviceDetails:''}}
</view>
</view>
<!-- 订单信息 -->
<view class="order_box u-skeleton-fillet">
<view class="order_title">订单信息</view>
<view class="order_list">
<view class="order_name">订单号码</view>
<view class="order_numbers" @click="copyOrder(orderDelites.indentNumber)">{{orderDelites.indentNumber}}
<u-icon name="order"></u-icon>
</view>
</view>
<view class="order_list">
<view class="order_name">发布时间</view>
<view class="order_numbers">{{orderDelites.createTime}}
</view>
</view>
<view class="order_list">
<view class="order_name">接单时间</view>
<view class="order_numbers">{{orderDelites.receivingTime}}
</view>
</view>
<view class="order_list" v-if="orderDelites.finishTime">
<view class="order_name">完成时间</view>
<view class="order_numbers">{{orderDelites.finishTime}}
</view>
</view>
<view class="order_list padding-bottom-sm" v-if="orderDelites.remarks">
<view class="order_name">订单备注</view>
<view class="order_numbers">{{orderDelites.remarks}}
</view>
</view>
<!-- <view class="order_list">
<view class="order_name">发票抬头</view>
<view class="order_numbers">(不需要发票)</view>
</view> -->
</view>
<!-- 费用明细 -->
<view class="order_box u-skeleton-fillet">
<view class="order_title">费用明细</view>
<view class="order_list">
<view class="income_name">跑腿费</view>
<view class="income_numbers">¥<text>{{orderDelites.errandMoney}}</text></view>
</view>
<view class="order_list" v-if="orderDelites.tip">
<view class="income_name">小费奖励</view>
<view class="income_numbers">¥<text>{{orderDelites.tip?orderDelites.tip:'0'}}</text></view>
</view>
<view class="order_list" v-if="orderDelites.prepayMoney">
<view class="income_name">商品费用</view>
<view class="income_numbers1">¥<text>{{orderDelites.prepayMoney}}</text></view>
</view>
<view class="order_list">
<view class="income_name">合计</view>
<view class="income_numbers1">¥<text>{{orderDelites.riderMoney}}</text></view>
</view>
</view>
<!-- 接单按钮 -->
<view class="tabbar_btn"
v-if="orderDelites.indentState=='3'||orderDelites.indentState=='4'||orderDelites.indentState=='5'">
<!-- <view class="btn_left">
联系TA
</view>
<view class="btn_right" @click="onshow">
确定送达
</view> -->
<view class="btn_right" @click="quhuo(orderDelites.indentId)" v-if="orderDelites.indentState=='3'">确认取货
</view>
<view class="btn_left" @click="zhuanOrder(orderDelites.indentId)" v-if="orderDelites.indentState=='3'">
转单
</view>
<view class="btn_left" v-if="orderDelites.indentState=='4'" @click="coll(orderDelites.userPhone)">
联系TA</view>
<view class="btn_right" v-if="orderDelites.indentState=='4'" @click.stop="shouhuo(orderDelites)">确认送达</view>
<view class="btn_right" v-if="orderDelites.indentState=='5'">客户待确认</view>
</view>
<!-- 聊天室 -->
<view style="position: fixed;bottom: 150rpx;right: 50rpx;" v-if="orderDelites.indentType == 5">
<image @tap="goChat(orderDelites.indentId,orderDelites.orderId)" src="../../../static/image/chats.png"
style="width: 100rpx;height: 100rpx;border-radius: 50rpx;">
</image>
<view class="shopxiaoix" v-if="RiderUnreadCount">{{RiderUnreadCount}}</view>
</view>
<!-- 转单 -->
<u-popup v-model="showOrder" mode="center" border-radius="18" :closeable="closeable" close-icon="close-circle"
close-icon-size="45" width="580rpx" height="400rpx">
<view class="receipt_code">
<view class="code_title">填写手机号码</view>
<u-input v-model="phone" type="number" placeholder="填写转单人手机号码" :border="border" />
<view class="sure" style="margin-top: 40rpx;" @click="zhuandan">确定</view>
</view>
</u-popup>
<!-- 收货码弹框 -->
<u-popup v-model="show" mode="center" border-radius="18" :closeable="closeable" close-icon="close-circle"
close-icon-size="45" width="580rpx" height="400rpx">
<view class="receipt_code">
<view class="code_title">填写收货码</view>
<u-input v-model="shouhuoma" :type="type" placeholder="请输入收货码" :border="border" />
<view class="sure" @click="querenSh">确定</view>
</view>
</u-popup>
<!-- <u-skeleton :loading="loading" :animation="true" bgColor="#FFF"></u-skeleton> -->
</view>
</template>
<script>
export default {
data() {
return {
show: false,
closeable: true,
value: '',
type: 'text',
border: true,
indentNumber: '',
orderId: '',
orderDelites: {},
latitude: '', //骑手起点经度
longitude: '', //骑手起点纬度
qiJuli: '', //骑手距离
shouhuoma: '',
loading: true, // 是否显示骨架屏组件
RiderUnreadCount: 0,
indentId: '',
showOrder: false,
phone: ''
}
},
onLoad(options) {
var that = this
console.error(options)
// uni.showLoading({
// title: '加载中......',
// icon: 'none'
// })
that.indentNumber = options.id
that.orderId = options.orderId
uni.getLocation({
type: 'wgs84',
success: function(res) {
console.log('当前位置的经度:' + res.longitude);
console.log('当前位置的纬度:' + res.latitude);
that.longitude = res.longitude
that.latitude = res.latitude
that.taskData()
}
});
setInterval(function() {
that.getRiderUnreadCount()
}, 10000)
},
methods: {
zhuanOrder(indentId) {
this.phone = ''
this.indentId = indentId
this.showOrder = true
},
zhuandan() {
this.$Request.postT('/app/tbindent/transferOfOrder', {
indentId: this.indentId,
phone: this.phone
}).then(res => {
if (res.code == 0) {
this.phone = ''
this.$queue.setData('zhuandan', this.indentId);
uni.showToast({
title: '转单成功',
icon: "none"
});
setTimeout(d => {
uni.navigateBack()
}, 1000)
} else {
uni.showToast({
title: res.msg,
icon: "none"
});
}
});
},
goChat(indentId, orderId) {
orderId = orderId ? orderId : this.orderId;
uni.navigateTo({
url: '/pages/riderMy/kefu/liaotianshi?indentId=' + indentId + '&orderId=' + orderId
});
},
copyOrder(value) {
uni.setClipboardData({
data: value, //要被复制的内容
success: () => { //复制成功的回调函数
uni.showToast({ //提示
title: '复制成功'
})
}
});
},
onshow() {
this.show = true
},
coll(phone) {
uni.makePhoneCall({
phoneNumber: phone
});
},
taskData() {
if (this.indentNumber) {
if (!this.longitude) {
uni.showModal({
title: '温馨提示',
content: '未开启定位权限,无法获取数据,请开启一下',
showCancel: false,
cancelText: '',
confirmText: '我知道了',
success: res => {
uni.navigateBack({
})
},
fail: () => {},
complete: () => {}
});
return;
}
this.$Request.postT('/app/tbindent/indentMessage', {
indentNumber: this.indentNumber,
ol: this.longitude,
od: this.latitude
}).then(res => {
this.loading = false
uni.hideLoading()
if (res.code == 0 && res.data) {
// this.jsjl(this.longitude,this.latitude,res.data.deliveryAddressLatitude, res.data.deliveryAddressLongitude)
// this.jsjl(res.data.shipAddressLatitude, res.data.shipAddressLongitude,res.data.deliveryAddressLatitude, res.data.deliveryAddressLongitude)
// if (res.data.distanceInitial > 1000) {
// res.data.distanceInitials = (Number(res.data.distanceInitial) / 1000).toFixed(2)
// }
if (res.data.distance > 1000) {
res.data.distances = (Number(res.data.distance) / 1000).toFixed(2)
}
this.orderDelites = res.data
this.orderDelites.orderCode = res.data.orderCode.substring(res.data.orderCode.length -
3)
console.log('````', res.data)
} else {
console.log('失败:', res.data)
uni.navigateBack({
})
}
this.loading = false;
});
} else {
this.$Request.postT('/app/tbindent/indentMessageByOrderId', {
orderId: this.orderId,
ol: this.longitude,
od: this.latitude
}).then(res => {
this.loading = false
uni.hideLoading()
if (res.code == 0) {
// this.jsjl(this.longitude,this.latitude,res.data.deliveryAddressLatitude, res.data.deliveryAddressLongitude)
// this.jsjl(res.data.shipAddressLatitude, res.data.shipAddressLongitude,res.data.deliveryAddressLatitude, res.data.deliveryAddressLongitude)
if (res.data.distanceInitial > 1000) {
res.data.distanceInitials = (Number(res.data.distanceInitial) / 1000).toFixed(2)
}
if (res.data.distance > 1000) {
res.data.distances = (Number(res.data.distance) / 1000).toFixed(2)
}
this.orderDelites = res.data
this.orderDelites.orderCode = res.data.orderCode.substring(res.data.orderCode.length -
3)
console.log('````', res.data)
} else {
console.log('失败:', res.data)
}
this.loading = false;
});
}
},
quhuo(indentId) {
let that = this
uni.showModal({
title: '提示',
content: '确认取到货吗',
success: function(res) {
if (res.confirm) {
that.$Request.postJson('/app/tbindent/riderBuyGoods', {
indentId: indentId,
indentState: "4"
}).then(res => {
if (res.code == 0) {
that.taskData()
uni.showToast({
title: '确认取货成功',
icon: "none"
});
} else {
uni.showToast({
title: res.msg,
icon: "none"
});
}
});
}
}
})
},
goStart() {
// let obj = {
// name: this.orderDelites.shopAddressDetail,
// lat: this.orderDelites.shopLat,
// long: this.orderDelites.shopLng,
// }
// this.navgate(obj)
// 一键导航
let latitude = this.orderDelites.shopLat
let longitude = this.orderDelites.shopLng
let name = this.orderDelites.shopAddressDetail
uni.openLocation({
latitude: latitude - 0, //要去的纬度-地址
longitude: longitude - 0, //要去的经度-地址
name: name, //地址名称
address: name, //详细地址名称
success: function() {
console.log('导航成功');
},
fail: function(error) {
console.log(error)
}
})
},
goEnd() {
// let obj = {
// name: this.orderDelites.userAddressDetail,
// lat: this.orderDelites.userLat,
// long: this.orderDelites.userLng,
// }
// this.navgate(obj)
let latitude = this.orderDelites.userLat
let longitude = this.orderDelites.userLng
let name = this.orderDelites.userAddressDetail
uni.openLocation({
latitude: Number(latitude), //要去的纬度-地址
longitude: Number(longitude), //要去的经度-地址
name: name, //地址名称
address: name, //详细地址名称
success: function() {
console.log('导航成功');
},
fail: function(error) {
console.log(error)
}
})
},
navgate(e) {
console.log(e)
let plugin = requirePlugin('routePlan');
let key = this.$queue.getData('mapKey'); //使用在腾讯位置服务申请的key
let referer = this.$queue.getData('mapName'); //调用插件的app的名称
let endPoint = JSON.stringify({ //终点
'name': e.name,
'latitude': e.lat,
'longitude': e.long
});
wx.navigateTo({
url: 'plugin://routePlan/index?key=' + key + '&referer=' + referer + '&endPoint=' + endPoint
});
},
shouhuo(e) {
console.log(e)
this.indentNumber = e.indentNumber
if (e.itemCodeFlag == 0 && e.indentType != 5) {
this.show = true
} else {
this.querenSh()
}
},
querenSh() {
let that = this
that.$Request.postT('/app/tbindent/riderDelivery', {
indentNumber: that.indentNumber,
itemCode: that.shouhuoma
}).then(res => {
console.log(res)
if (res.code == 0) {
uni.showToast({
title: '订单完成',
icon: "none"
});
setTimeout(function() {
uni.navigateBack()
}, 1000)
} else {
uni.showToast({
title: res.msg,
icon: "none"
});
}
});
},
getRiderUnreadCount() {
let that = this
let data = {
ordersId: that.orderId
}
that.$Request.getT("/app/ordersChat/selectRiderUnreadCount", data).then(res => {
if (res.code == 0) {
if (res.data > 0) {
if (that.RiderUnreadCount != res.data) {
that.RiderUnreadCount = res.data
that.aplayAudio()
uni.showModal({
title: '消息',
content: '有' + res.data + '条消息,请前往聊天列表处理。',
success: (ret) => {
if (ret.confirm) {
uni.navigateTo({
url: '/pages/riderMy/kefu/liaotian'
})
} else {
console.log('else', ret)
that.defineCallBack()
}
}
});
}
}
}
});
},
//消息提示
aplayAudio() {
// console.log('语音提示')
const innerAudioContext = uni.createInnerAudioContext();
innerAudioContext.autoplay = true;
innerAudioContext.src =
'https://pw.xianmxkj.com/file/uploadPath/2022/01/19/0753211f78d718d44ee6372e33eae9ee.mp3';
innerAudioContext.onPlay(() => {
console.log('开始播放');
});
innerAudioContext.onError((res) => {
console.log(res.errMsg);
console.log(res.errCode);
});
},
}
}
</script>
<style>
body {
background: #F5F5F5;
}
.content {
width: 100%;
padding-bottom: 259rpx;
}
.part_one {
width: 90%;
margin: 0 auto;
height: 120rpx;
background: #ffffff;
margin-top: 20rpx;
border-radius: 23rpx;
padding-top: 10rpx;
}
.pickup {
width: 90%;
margin: 0 auto;
font-size: 29rpx;
font-weight: bold;
letter-spacing: 2rpx;
line-height: 60rpx;
}
.pickup_tit {
color: #999999;
font-size: 22rpx;
width: 90%;
margin: 0 auto;
}
.quhuoma {
font-size: 50rpx;
text-align: center;
font-weight: 600;
margin: 50rpx 0;
height: 100rpx;
}
.list_box1 {
width: 90%;
margin: 0 auto;
/* height: 320rpx; */
background: #FFFFFF;
border-radius: 23rpx;
/* box-shadow: 0rpx 5rpx 5rpx 0rpx rgba(198, 186, 181, 0.20); */
margin-top: 20rpx;
}
.part2 {
width: 90%;
margin: 0 auto;
padding-top: 25rpx;
}
.box_add {
display: flex;
}
.distance {
flex: 1;
text-align: center;
font-size: 28rpx;
}
.a {
font-size: 16rpx;
}
.add_name {
flex: 8;
position: relative;
}
.buy {
/* position: absolute;
top: 0rpx; */
}
.buy image {
width: 20px;
height: 20px;
}
.send {
/* position: absolute;
top: 0rpx; */
}
.send image {
width: 20px;
height: 20px;
}
.sh_name {
font-size: 30rpx;
font-weight: bold;
letter-spacing: 2rpx;
margin-left: 10px;
}
.xs_add {
color: #999999;
font-size: 24rpx;
margin-top: 10rpx;
margin-left: 30px;
}
.jiantou {
margin-left: 23rpx;
}
.jiantou image {
width: 20rpx;
height: 40rpx;
}
.part3 {
width: 90%;
margin: 0 auto;
display: flex;
}
.three_left {
flex: 1;
height: 100rpx;
display: flex;
justify-content: left;
align-items: center;
}
.three_left image {
width: 36rpx;
height: 37rpx;
}
.box_two1 {
background: #c4e2ff;
color: #359CFF;
/* width: 60px; */
padding: 0 5px;
height: 45rpx;
font-size: 22rpx;
text-align: center;
line-height: 45rpx;
border-radius: 5rpx;
margin-top: 20rpx;
margin-left: 10rpx;
}
.three_left text {
color: #333333;
font-size: 25rpx;
margin-left: 10rpx;
}
.three_right {
flex: 1;
height: 100rpx;
display: flex;
justify-content: flex-end;
align-items: center;
color: #FF412D;
font-size: 32rpx;
font-weight: bold;
}
/* tip */
.tip_box {
width: 90%;
margin: 0 auto;
height: 180rpx;
background: #FFFFFF;
margin-top: 20rpx;
border-radius: 22rpx;
}
.tip_part1 {
display: flex;
}
.tip_title {
/* flex: 1; */
height: 80rpx;
display: flex;
justify-content: left;
align-items: center;
font-size: 32rpx;
font-weight: bold;
margin-left: 30rpx;
}
.tip_rider {
flex: 1;
font-size: 20rpx;
display: flex;
justify-content: flex-end;
align-items: center;
margin-left: 30rpx;
}
.tip_rider text {
font-size: 30rpx;
}
.tip_content {
width: 90%;
margin: 0 auto;
font-size: 27rpx;
font-weight: bold;
letter-spacing: 2rpx;
margin-top: 15rpx;
}
.u-line {
border-bottom-width: 3px !important;
}
/* 订单信息 */
.order_box {
width: 90%;
margin: 0 auto;
/* height: 300rpx; */
background: #ffffff;
margin-top: 20rpx;
border-radius: 22rpx;
}
.order_title {
width: 90%;
margin: 0 auto;
font-size: 32rpx;
font-weight: 600;
line-height: 67rpx;
letter-spacing: 3rpx;
}
.order_list {
display: flex;
}
.order_name {
flex: 1;
margin-left: 35rpx;
color: #999999;
font-size: 25rpx;
height: 75rpx;
display: flex;
justify-content: left;
align-items: center;
}
.order_numbers {
flex: 1;
color: #333333;
display: flex;
justify-content: flex-end;
align-items: center;
font-size: 26rpx;
margin-right: 35rpx;
}
/* 费用明细 */
.income_name {
flex: 1;
margin-left: 35rpx;
color: #999999;
font-size: 26rpx;
height: 75rpx;
display: flex;
justify-content: left;
align-items: center;
}
.income_numbers {
flex: 1;
color: #333333;
display: flex;
justify-content: flex-end;
align-items: center;
font-size: 26rpx;
margin-right: 35rpx;
}
.income_numbers1 {
flex: 1;
color: #FF2400;
display: flex;
justify-content: flex-end;
align-items: center;
font-size: 26rpx;
margin-right: 35rpx;
}
/* 接单按钮 */
.tabbar_btn {
position: fixed;
bottom: 0rpx;
left: 0rpx;
right: 0rpx;
width: 100%;
height: 120rpx;
background: #FFFFFF;
display: flex;
justify-content: center;
align-items: center;
}
.btn_left {
flex: 1;
height: 80rpx;
color: white;
background: #33D442;
text-align: center;
line-height: 80rpx;
border-radius: 16rpx;
margin-left: 35rpx;
margin-right: 20rpx;
font-size: 26rpx;
letter-spacing: 3rpx;
}
.btn_right {
flex: 1;
height: 80rpx;
color: white;
background: #FF7F00;
text-align: center;
line-height: 80rpx;
border-radius: 16rpx;
margin-left: 20rpx;
margin-right: 35rpx;
font-size: 26rpx;
letter-spacing: 3rpx;
}
/* 收货码弹框 */
.receipt_code {
width: 90%;
margin: 0 auto;
}
.code_title {
width: 100%;
line-height: 100rpx;
font-size: 31rpx;
font-weight: bold;
text-align: center;
letter-spacing: 2rpx;
margin-top: 21rpx;
margin-bottom: 25rpx;
}
.u-input--border {
border: 1px solid #F2F2F2 !important;
background: #F2F2F2 !important;
color: #999999 !important;
font-weight: 500 !important;
letter-spacing: 2rpx !important;
}
.u-input__input {
font-size: 30rpx;
font-weight: bold;
flex: 1;
color: #999999 !important;
min-height: 85rpx !important;
margin-top: 7rpx;
}
.sure {
width: 100%;
height: 80rpx;
background: #FF7F00;
color: white;
border-radius: 46rpx;
text-align: center;
line-height: 80rpx;
margin-top: 30rpx;
letter-spacing: 2rpx;
}
.shopxiaoix {
background: red;
color: #ffffff;
width: 40rpx;
height: auto;
text-align: center;
border-radius: 30rpx;
position: relative;
top: -66px;
left: 35px;
}
</style>