recycapp/pages/person/orderinfo.vue

307 lines
8.0 KiB
Vue
Raw Normal View History

2025-10-22 20:28:50 +08:00
<template>
<view class="content">
<view style="overflow: hidden;">
<view class="news_title">
<view class="fsz30 overflow2 title tag">
{{orderInfo.status_name||''}}
</view>
<view class="time fsz26">
订单号{{orderInfo.order_no||''}}
</view>
<view class="time fsz26">
下单时间{{orderInfo.createtime||''}}
</view>
<view class="time fsz26" v-if="orderInfo.status ==3">
完成时间{{orderInfo.finish_time||''}}
</view>
</view>
<view class="line"></view>
<view class="xydd_main w">
<view class="biaoti fsz30">
预约信息
</view>
<view class="main">
<view class="li fsz30">
<view class="ti">联系人 : </view>
<view>{{orderInfo.accept_name||''}}</view>
</view>
<view class="li fsz30">
<view class="ti">电话 : </view>
<view v-if="orderInfo.person_id>0" @tap="call(orderInfo.accept_mobile)">{{orderInfo.accept_mobile||''}}</view>
<view v-else>接单后可看</view>
</view>
<view class="li fsz30" >
<view class="ti">地址 : </view>
<view>{{orderInfo.area_name||''}}</view>
</view>
<view class="li fsz30" >
<view clas="ti"></view>
<view style=" text-align: right;">{{orderInfo.accept_address||''}}</view>
</view>
</view>
</view>
<view class="line"></view>
<view class="xydd_main w">
<view class="biaoti fsz30">
回收信息
</view>
<view class="main">
<view class="li fsz30">
<view class="ti">预约回收品类 : </view>
<view>{{orderInfo.type_name||''}}</view>
</view>
<view class="li fsz30">
<view class="ti">预约时间 : </view>
<view>{{orderInfo.order_time||''}}</view>
</view>
<view class="li fsz30">
<view class="ti">预约重量 : </view>
<view>{{orderInfo.weight||''}}</view>
</view>
<view class="li fsz30">
<view class="ti">备注 : </view>
<view>{{orderInfo.remark||''}}</view>
</view>
<view class="li fsz30" v-if="orderInfo.status ==3">
<view class="ti">订单金额 : </view>
<view class="red-price">{{orderInfo.price||''}}</view>
</view>
</view>
</view>
<view class="line"></view>
<view class="xydd_main w" v-if="orderInfo.status>=2">
<view class="biaoti fsz30">
回收员
</view>
<view class="main">
<view class="li fsz30">
<view>姓名 : </view>
<view>{{orderInfo.person_name||''}}</view>
</view>
</view>
<view class="main">
<view class="li fsz30">
<view>接单时间 : </view>
<view>{{orderInfo.jiedan_time||''}}</view>
</view>
</view>
</view>
</view>
<view style="height:100px"></view>
<view class="button-bottom" v-if="(orderInfo.status==1 && jiedan_type ==1) || orderInfo.status==2">
<button class='btn btn-default' @click="setorder(orderInfo.id,2)" v-if="orderInfo.status==1 && jiedan_type ==1 ">接单</button>
<button class='btn btn-default' @click="setorder(orderInfo.id,1)" v-if="orderInfo.status==2 ">转给他人</button>
<button class='btn btn-default' @click="toshow()" v-if="orderInfo.status==2 ">点击完成</button>
</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" style="width: 100%;margin: 0px; padding: 0px;">
<button style="width: 100%;margin: 0px; padding: 0px;" class="btn btn-default" @click="setorder(orderInfo.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 {
money:'',
jiedan_type:0,
order_id: '',
orderInfo: {},
};
},
onLoad(e) {
this.order_id = e.id;
this.getOrderDetail();
this.config()
},
methods: {
toshow() {
this.$refs.lvvpopref.show();
},
toclose() {
this.$refs.lvvpopref.close();
},
getOrderDetail() {
let _this = this
let data = {
id: _this.order_id
}
_this.$api.personorderdetail(data, function(res) {
if (res.code ==1 ) {
let data = res.data.info
_this.orderInfo = data;
} else {
uni.showToast({ title: res.msg , icon: 'none' })
}
})
},
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 ,
status:status
}, res => {
if (res.code == "1") {
uni.showToast({
title: res.msg,
icon: 'none'
})
setTimeout(()=>{
this.money =''
this.toclose();
this.getOrderDetail()
},1000)
}else{
uni.showToast({ title: res.msg , icon: 'none' })
}
})
}
}
})
},
call(phone){
uni.makePhoneCall({
phoneNumber:phone,
success:function(){
console.log('拨打电话成功');
},
fail() {
console.log('打电话失败了');
}
})
},
config(){
this.$api.config({}, res => {
if (res.code == "1") {
this.jiedan_type = res.data.jiedan_type;
}else{
}
})
},
}
};
</script>
<style lang="scss">
.container {
/* padding: 22upx 14upx 100upx; */
}
.news_title{
border-bottom: 1px solid #eee;
padding: 20rpx 5%;
box-sizing: border-box;
overflow: hidden;
position: relative;
width: 100%; }
.news_title .title{
color: #333;
line-height: 50rpx;
}
.news_title .time{
color: #777;
margin-top: 20rpx;
}
.news_title .tag{
color: #e01f20;
}
.xydd_main{ }
.biaoti{
color: #777777;
height: 90rpx;
line-height: 90rpx;
margin-top: 20rpx; }
.biaoti image{width: 35rpx;margin-right: 10rpx; margin-bottom: -6rpx;}
.main{
line-height: 60rpx;}
.main .li{
display: flex;
justify-content: space-between;
}
.servicepic{
width: 180rpx;
height: 180rpx;
position: relative;
box-sizing: border-box;}
.servicepic image{
width: 180rpx;
height: 180rpx;
}
.servicepic uni-icons{
position: absolute;
right: 0;
top: 0;
}
.line{border:solid 3px #eee}.button-bottom {
padding: 15upx 26upx;
text-align: right;
display: block;
}
.button-bottom .btn {
margin-left: 20upx;
}
.ti{width:115px}
</style>