298 lines
7.2 KiB
Vue
298 lines
7.2 KiB
Vue
|
<template>
|
|||
|
|
<view>
|
|||
|
|
<view class="navbar ">
|
|||
|
|
|
|||
|
|
<view v-for="item in tabs" class="item " :class="[tabCur==item.id?'on':'']" @click="selectTab(item.id)">
|
|||
|
|
{{item.name}}
|
|||
|
|
</view>
|
|||
|
|
</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)">
|
|||
|
|
<view>{{item.type_name}}</view>
|
|||
|
|
<view >
|
|||
|
|
{{item.status_name}}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="order-info" @click="goDetail(item.id)">
|
|||
|
|
<view class="order-li">
|
|||
|
|
<view class="fl">订单号：</view>{{item.order_no}}
|
|||
|
|
</view>
|
|||
|
|
<view class="order-li">
|
|||
|
|
<view class="" style="justify-content: space-between; display: flex;width:100%">
|
|||
|
|
<view><view class="fl">预约人：</view> {{item.accept_name}}</view>
|
|||
|
|
<view class="gongli" v-if="item.distance>=0">
|
|||
|
|
{{item.distance}}/km
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="order-li">
|
|||
|
|
<view>
|
|||
|
|
<view class="fl">手机号：</view><view v-if="item.person_id>0">{{item.accept_mobile}}</view>
|
|||
|
|
<view v-else>接单后可看</view></view>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="order-li">
|
|||
|
|
<view class="fl">预约重量：</view>
|
|||
|
|
{{item.weight}}
|
|||
|
|
</view>
|
|||
|
|
<view class="order-li">
|
|||
|
|
<view class="fl">预约时间：</view>
|
|||
|
|
{{item.order_time}}
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="order-li">
|
|||
|
|
<view class="fl">预约地址：</view>
|
|||
|
|
{{item.accept_address}}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="footer pb-32 " >
|
|||
|
|
<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 class="btn btn-default" @click="setorder(item.id,1)" v-if="item.status==2 ">转给他人</view>
|
|||
|
|
<view class="btn btn-default" @click="toshow(item.id)" v-if="item.status==2 ">点击完成</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="zanwuimg" v-if="list.length == 0">
|
|||
|
|
<image src="../../static/img/null.png" mode="widthFix"></image>
|
|||
|
|
<view>暂无相关订单</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<lvv-popup position="bottom" ref="lvvpopref">
|
|||
|
|
<view style="width: 100%;height: 700upx;background: #F8F8F8;;position: absolute;left:0;bottom: 0;">
|
|||
|
|
<view class="pop-c">
|
|||
|
|
<view class="pop-t">
|
|||
|
|
<view class='hs-row invoice'>
|
|||
|
|
<view class='hs-row-hd'>
|
|||
|
|
<view class='hs-hd-title'>完成订单</view>
|
|||
|
|
</view>
|
|||
|
|
<view class='hs-row-ft'
|
|||
|
|
@click="toclose()">
|
|||
|
|
<image class='fr icon' src='/static/img/close.png'></image>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="neirong">
|
|||
|
|
<view class="content-top">
|
|||
|
|
<view class='hs-box'>
|
|||
|
|
<view class='hs-row'>
|
|||
|
|
<view class='hs-row-hd'>
|
|||
|
|
<view class='hs-hd-title' style="width: 100px;">订单金额：</view>
|
|||
|
|
</view>
|
|||
|
|
<view class='hs-row-bd' style="width: 95%;">
|
|||
|
|
<input type="text" class='hs-input' placeholder='请填写金额' v-model="money" ></input>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="button-bottom">
|
|||
|
|
<button class="btn btn-success" @click="setorder(jiesuan_order_id,3)" :disabled='submitStatus' :loading='submitStatus'>完成</button>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</lvv-popup>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import lvvPopup from '@/components/lvv-popup/lvv-popup.vue';
|
|||
|
|
export default {
|
|||
|
|
components: { lvvPopup },
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
jiesuan_order_id:0,
|
|||
|
|
jiedan_type:0,
|
|||
|
|
show:false,
|
|||
|
|
tabs: [
|
|||
|
|
{
|
|||
|
|
id: 2,
|
|||
|
|
name: '已接单'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
id: 3,
|
|||
|
|
name: '已完成'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
id: 4,
|
|||
|
|
name: '已取消'
|
|||
|
|
},
|
|||
|
|
],
|
|||
|
|
tabCur: 2,
|
|||
|
|
list: [],
|
|||
|
|
page:1,
|
|||
|
|
money:'',
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
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:{
|
|||
|
|
toshow(id) {
|
|||
|
|
this.jiesuan_order_id = id;
|
|||
|
|
this.$refs.lvvpopref.show();
|
|||
|
|
},
|
|||
|
|
toclose() {
|
|||
|
|
this.jiesuan_order_id = 0;
|
|||
|
|
this.$refs.lvvpopref.close();
|
|||
|
|
},
|
|||
|
|
closePopup(){
|
|||
|
|
this.show = false
|
|||
|
|
},
|
|||
|
|
selectTab(id){
|
|||
|
|
this.page=1
|
|||
|
|
this.tabCur = id
|
|||
|
|
this.list = []
|
|||
|
|
this.getList()
|
|||
|
|
},
|
|||
|
|
setorder(id,status){
|
|||
|
|
var msg ='';
|
|||
|
|
if(status ==2){
|
|||
|
|
msg ='确认要接单吗？';
|
|||
|
|
}
|
|||
|
|
if(status ==1){
|
|||
|
|
msg ='确认要转给他人吗？';
|
|||
|
|
}
|
|||
|
|
if(status ==3){
|
|||
|
|
if (this.money == '' || this.money < 0 || isNaN(parseFloat(this.money))) {
|
|||
|
|
uni.showToast({ title: '请输入结算金额' , icon: 'none' })
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
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()
|
|||
|
|
this.money =''
|
|||
|
|
this.toclose();
|
|||
|
|
},1000)
|
|||
|
|
}else{
|
|||
|
|
uni.showToast({ title: res.msg , icon: 'none' })
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
getList(){
|
|||
|
|
this.$api.orderlist({
|
|||
|
|
page:this.page,
|
|||
|
|
status:this.tabCur
|
|||
|
|
}, res => {
|
|||
|
|
|
|||
|
|
if (res.code == "1") {
|
|||
|
|
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: 120rpx 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-info {
|
|||
|
|
padding: 0 28rpx;
|
|||
|
|
.order-li {
|
|||
|
|
color: #666666;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
padding-bottom: 28rpx;
|
|||
|
|
|
|||
|
|
.fl{ width: 76px;
|
|||
|
|
text-align: right;
|
|||
|
|
display: inline-block;}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.empty{text-align: center;} .navbar {
|
|||
|
|
/* #ifdef H5 */
|
|||
|
|
margin-top:44px;
|
|||
|
|
/* #endif */
|
|||
|
|
}
|
|||
|
|
</style>
|