307 lines
8.0 KiB
Vue
307 lines
8.0 KiB
Vue
<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>
|