214 lines
4.7 KiB
Vue
214 lines
4.7 KiB
Vue
<template>
|
||
<view>
|
||
<view class="card-list">
|
||
<view class="order-box" v-for="item in list" :key="item.id" >
|
||
<view class="order-header" @click="goDetail(item.id)">
|
||
<text >{{item.type_name}}</text>
|
||
</view>
|
||
<view class="order-box" @click="goDetail(item.id)">
|
||
<view class="li">
|
||
<view class="lr">订单号：</view> {{item.order_no}}
|
||
</view>
|
||
<view class="li">
|
||
<view class="" style="justify-content: space-between; display: flex;width:100%">
|
||
<view><view class="lr">预约人：</view> {{item.accept_name}}</view>
|
||
<view class="gongli" v-if="item.distance>=0">
|
||
{{item.distance}}/km
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="li">
|
||
<view class="lr">手机号：</view>
|
||
<text v-if="item.person_id>0">{{item.accept_mobile}}</text>
|
||
<text v-else>接单后可看</text>
|
||
</view>
|
||
|
||
<view class="li">
|
||
<view class="lr">预约重量：</view>
|
||
<view>{{item.weight}}</view>
|
||
</view>
|
||
<view class="li">
|
||
<view class="lr">预约时间：</view>
|
||
<view>{{item.order_time}}</view>
|
||
</view>
|
||
<view class="li">
|
||
<view class="lr">预约地址：</view>
|
||
<view>{{item.accept_address}}</view>
|
||
</view>
|
||
</view>
|
||
<view class="footer" >
|
||
<view class="btn btn-default" @click="goDetail(item.id)" >详情</view>
|
||
<view class="btn btn-default" @click="setorder(item.id,2)" v-if="item.status==1 && jiedan_type ==1 ">接单</view>
|
||
</view>
|
||
</view>
|
||
<view class="zanwuimg" v-if="list.length == 0">
|
||
<image src="../../static/img/null.png" mode="widthFix"></image>
|
||
<view>暂无相关订单</view>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
jiesuan_order_id:0,
|
||
jiedan_type:0,
|
||
show:false,
|
||
tabCur: 0,
|
||
list: [],
|
||
page:1,
|
||
};
|
||
},
|
||
onLoad(e) {
|
||
},
|
||
|
||
onShow () {
|
||
|
||
this.page = 1
|
||
this.list = []
|
||
var token = uni.getStorageSync('userToken');
|
||
if (!token) {
|
||
return false;
|
||
}
|
||
this.getList()
|
||
},
|
||
onPullDownRefresh() {
|
||
this.page = 1
|
||
this.list = []
|
||
this.getList()
|
||
},
|
||
onReachBottom() {
|
||
this.page++
|
||
this.getList()
|
||
},
|
||
methods:{
|
||
setorder(id,status){
|
||
var msg ='';
|
||
if(status ==2){
|
||
msg ='确认要接单吗？';
|
||
}
|
||
uni.showModal({
|
||
title:'提示',
|
||
content: msg,
|
||
success:(ret)=>{
|
||
if(ret.confirm){
|
||
this.$api.setorder({
|
||
order_id:id ,
|
||
money:this.money ,
|
||
status:status
|
||
}, res => {
|
||
if (res.code == "1") {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none'
|
||
})
|
||
setTimeout(()=>{
|
||
this.page=1
|
||
this.list = []
|
||
this.getList()
|
||
},1000)
|
||
}else{
|
||
uni.showToast({ title: res.msg , icon: 'none' })
|
||
}
|
||
})
|
||
|
||
}
|
||
}
|
||
})
|
||
},
|
||
getList(){
|
||
this.$api.qiangdanlist({
|
||
page:this.page,
|
||
status:this.tabCur
|
||
}, res => {
|
||
|
||
if (res.code == "1") {
|
||
this.jiedan_type = res.data.jiedan_type;
|
||
if(this.jiedan_type ==0){
|
||
uni.showToast({ title: "未开启抢单" , icon: 'none' })
|
||
|
||
setTimeout(()=>{
|
||
uni.navigateBack({
|
||
delta: 1
|
||
})
|
||
},2000)
|
||
|
||
return false
|
||
}
|
||
let list = res.data.list.data
|
||
if(list.length>0){
|
||
this.list = [
|
||
...this.list,
|
||
...list
|
||
]
|
||
this.page++
|
||
}else{
|
||
uni.showLoading({
|
||
title:'加载中...'
|
||
})
|
||
setTimeout(()=>{
|
||
uni.hideLoading()
|
||
return
|
||
},500)
|
||
this.zanwuflag = true
|
||
this.flagjiazai = true
|
||
}
|
||
|
||
}
|
||
})
|
||
},
|
||
goDetail(id){
|
||
uni.navigateTo({
|
||
url:'/pages/person/orderinfo?id=' + id
|
||
})
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
page {
|
||
background: #eee;
|
||
}
|
||
|
||
|
||
.card-list {
|
||
padding: 18rpx 14rpx 50px;
|
||
}
|
||
|
||
|
||
|
||
.order-box {
|
||
background: #ffffff;
|
||
border-radius: 12rpx;
|
||
margin-bottom: 16rpx;
|
||
.footer{
|
||
display: flex;
|
||
justify-content: flex-end;padding-bottom: 10px;
|
||
|
||
}
|
||
.order-header {
|
||
width: 100%;
|
||
padding: 28rpx;
|
||
justify-content: space-between;
|
||
display: flex;
|
||
}
|
||
.order-box {
|
||
padding: 0 28rpx;
|
||
.li {
|
||
color: #666666;
|
||
font-size: 28rpx;
|
||
padding-bottom: 28rpx;display: flex;
|
||
.lr{ width: 76px;
|
||
text-align: right;
|
||
display: inline-block;
|
||
}
|
||
|
||
}
|
||
}
|
||
}
|
||
</style>
|