球星卡微信小程序
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

583 lines
14 KiB

<template>
<view class="flex-col page">
<view class="flex-col group_4">
<view class="flex-row section_2">
<view class="flex-row group_5">
<text class="text_2">订单编号</text>
<text class="text_3">{{ details.order.order_id || '暂无编号' }}</text>
</view>
<text class="text_4" style="color: #999999;" @click="setClipboardData(details.order.order_id || '')">复制</text>
</view>
<view class="flex-row section_2" style="padding-top: 0;">
<view class="flex-row group_5">
<text class="text_2">发货单号</text>
<text class="text_3">{{ details.order.back_express_numb ? details.order.back_express_type +' ' + details.order.back_express_numb : '暂无单号' }}</text>
</view>
<text class="text_4" :style="{color: details.order.status_text_color}">{{ details.order.status_text }}</text>
</view>
<view class="section_3 flex-col">
<view class="justify-between" @click="toSubDetail(details.order.id)">
<view class="flex-row">
<text class="text_5">明细</text>
<text class="text_6">{{ details.order.num }}</text>
</view>
<image
src="@/static/icon/rightArrow.png"
class="image_6"
/>
</view>
<view class="justify-between group_8" @click="details.order.amount && $url('/packages/sonpingDetail/expenseDetail?id='+ id)" v-if="details.order.amount">
<view class="flex-row">
<text class="text_7">费用</text>
<text class="text_8">{{ details.order.amount || '暂无' }}</text>
</view>
<image
src="@/static/icon/rightArrow.png"
class="image_6"
/>
</view>
<view class="flex-col group_10" @click="$url('/packages/address/address')">
<view class="justify-between">
<view class="flex-row lf-flex">
<view class="text_9">收货人</view>
<view class="text_10">{{ details.order.address.name }}</view>
<view class="text_11">{{ details.order.address.tel }}</view>
</view>
<image
src="@/static/icon/rightArrow.png"
class="image_6"
/>
</view>
<view class="text_12">{{ details.order.address.area_name }}{{ details.order.address.desc }}</view>
</view>
</view>
<view class="section_3 flex-col">
<view class="flex-col group_13" @click="$url('/packages/sonpingDetail/ratingTrajectory?id='+ id)">
<view class="flex-row">
<image
:src="details.logs && details.logs.icon_url"
class="image_10"
/>
<text class="text_13">{{ details.logs && details.logs.title }}</text>
<image
src="@/static/icon/rightArrow.png"
class="image_6 image_11"
/>
</view>
<text class="text_14">{{ details.logs && details.logs.create_time }}</text>
</view>
<view class="flex-row group_15">
<image
src="@/static/icon/aixin.png"
class="image_12"
/>
<text class="text_15">温馨提示如需发票请在订单完成后一个月内到官网申请</text>
</view>
</view>
<view class="flex-col section_4">
<text class="text_16">送评信息</text>
<view class="justify-between group_16" @click="orderSend()">
<view class="flex-row">
<text class="text_17">寄送藏品</text>
<text class="text_18">{{ details.order.express_type }} {{ details.order.express_numb }}</text>
</view>
<image
src="@/static/icon/rightArrow.png"
class="image_6"
/>
</view>
<view class="flex-row group_18">
<text class="text_19">送评公司</text>
<text class="text_20">北京评分卡部</text>
</view>
<view class="flex-row group_19">
<text class="text_21">送评人</text>
<text class="text_22">{{ details.order.owner }}</text>
</view>
<view class="flex-row group_20">
<text class="text_23">联系方式</text>
<text class="text_24">{{ details.order.tel }}</text>
</view>
<view class="flex-row group_21">
<text class="text_25">是否快评</text>
<text class="text_26">{{ details.order.fast_text }}</text>
</view>
<!-- <view class="flex-row group_22">
<text class="text_27">保价</text>
<text class="text_28">暂无</text>
</view> -->
<view class="flex-col group_23">
<view class="flex-col">
<view class="flex-row">
<text class="text_29">打包照片</text>
<text class="text_30">送评前请拍照可确保权益</text>
</view>
<view class="flex-row equal-division">
<image
mode="aspectFill"
:src="item"
class="equal-division-item image_14"
v-for="(item, index) in showImages"
:key="index"
@click="previewImage(index)"
/>
</view>
</view>
<view class="flex-col group_26">
<view class="flex-col items-center text-wrapper" @click="$url('/packages/address/address?is_select=1')" v-if="details.order.status == 2">
<text>更改地址</text>
</view>
<view class="flex-col items-center text-wrapper text-wrapper-1" @click="orderConfirm" v-else-if="details.order.status == 4">
<text>确认收货</text>
</view>
<view class="section_5"> </view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import { gradingDetail } from '@/service/grading.js'
import { confirmOrder, changOrderAddress } from '@/service/order.js';
export default {
data() {
return {
address: {},
id: '',
details: {}
};
},
watch: {
address(){
this.changOrderAddress();
}
},
computed: {
showImages(){
if(this.details.order && this.details.order.images){
return String(this.details.order.images).split(',');
}else{
return []
}
}
},
onLoad(options){
this.id = options.id;
this.getGradingDetail();
},
methods: {
async getGradingDetail(){
let res = await gradingDetail(this.id);
console.log("res", res);
this.details = res.data.datas;
},
previewImage(current){
uni.previewImage({
urls: this.showImages,
current: current
})
},
// 确认收货
async orderConfirm(){
uni.showModal({
title:"确认收货",
content:'确认收到货物并签收?',
success:async (e) => {
if(e.confirm){
await confirmOrder(this.details.order.id);
this.$msg('确认收货成功');
this.getGradingDetail();
}
}
});
},
// 更换收货地址
async changOrderAddress(){
await changOrderAddress({order_id: this.details.order.order_id, addr_id: this.address.id});
this.$msg('地址修改成功');
this.getGradingDetail();
},
// 复制
setClipboardData(data){
uni.setClipboardData({
data: data
})
},
orderSend(){
if(this.details.order.express_type && this.details.order.express_numb){
return;
}
let item = this.details.order;
let base_data = encodeURIComponent(JSON.stringify(item));
this.$url('/pages/write/distribution?base_data='+ base_data);
},
toSubDetail(id){
if(this.details.order.grading_finish){
this.$url('/packages/sonpingDetail/viewDetail?id='+ id)
}else{
uni.showToast({
icon:'none',
title:'正在评审中'
})
}
}
}
};
</script>
<style scoped lang="css">
.section_3 {
margin-top: 30rpx;
padding: 40rpx 30rpx 40rpx 32rpx;
background-color: rgb(255, 255, 255);
}
.image_6 {
margin: 10rpx 0 8rpx;
width: 44rpx;
height: 44rpx;
}
.equal-division-item {
margin-left: 28rpx;
/* flex: 1 1 210rpx; */
width: 80px;
height: 80px;
}
.page {
background-color: #f6f6f6;
width: 100%;
overflow-y: auto;
height: 100%;
}
.group_4 {
padding-top: 2rpx;
flex: 1 1 auto;
overflow-y: auto;
}
.section_2 {
padding: 40rpx 32rpx;
background-color: rgb(255, 255, 255);
}
.section_4 {
margin-top: 30rpx;
padding: 40rpx 30rpx 16rpx 32rpx;
background-color: rgb(255, 255, 255);
}
.group_5 {
flex: 1 1 auto;
}
.text_4 {
margin-left: 40rpx;
/* color: rgb(172, 205, 35); */
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.group_8 {
margin-top: 50rpx;
}
.group_10 {
margin-top: 50rpx;
}
.group_13 {
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.group_15 {
margin-top: 40rpx;
color: rgb(153, 153, 153);
font-size: 24rpx;
font-weight: 500;
line-height: 34rpx;
white-space: nowrap;
}
.text_16 {
color: rgb(51, 51, 51);
font-size: 36rpx;
font-weight: 600;
line-height: 50rpx;
white-space: nowrap;
}
.group_16 {
margin-top: 40rpx;
}
.group_18 {
margin-top: 50rpx;
}
.group_19 {
margin-top: 50rpx;
}
.group_20 {
margin-top: 50rpx;
}
.group_21 {
margin-top: 50rpx;
}
.group_22 {
margin-top: 50rpx;
}
.group_23 {
margin-top: 50rpx;
}
.text_2 {
color: rgb(119, 119, 119);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_3 {
margin-left: 10rpx;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_12 {
margin-top: 10rpx;
align-self: center;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
width: 100%;
box-sizing: border-box;
padding-left: 160rpx;
padding-right: 32rpx;
}
.text_14 {
margin-left: 66rpx;
}
.image_12 {
width: 30rpx;
height: 30rpx;
}
.text_15 {
margin-left: 10rpx;
margin-right: 24rpx;
}
.text_19 {
color: rgb(119, 119, 119);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_20 {
margin-left: 10rpx;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
overflow:hidden;
text-overflow:ellipsis;
width: 522rpx;
display: inline-block;
}
.text_21 {
color: rgb(119, 119, 119);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_22 {
margin-left: 42rpx;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_23 {
color: rgb(119, 119, 119);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_24 {
margin-left: 10rpx;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_25 {
color: rgb(119, 119, 119);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_26 {
margin-left: 10rpx;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_27 {
color: rgb(119, 119, 119);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_28 {
margin-left: 74rpx;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.group_26 {
margin-top: 40rpx;
padding: 0 2rpx;
color: rgb(153, 153, 153);
font-size: 28rpx;
font-weight: 500;
line-height: 40rpx;
white-space: nowrap;
}
.text_5 {
color: rgb(119, 119, 119);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_6 {
margin-left: 74rpx;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_7 {
color: rgb(119, 119, 119);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_8 {
margin-left: 74rpx;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.image_10 {
width: 56rpx;
height: 56rpx;
}
.text_13 {
margin-left: 10rpx;
display: inline-block;
width: 557rpx;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.image_11 {
margin-top: 10rpx;
margin-bottom: 0;
margin-left: 30rpx;
margin-right: 0;
}
.text_17 {
color: rgb(119, 119, 119);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_18 {
margin-left: 10rpx;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.equal-division {
margin-top: 20rpx;
}
.text-wrapper {
padding: 10rpx 0;
align-self: flex-end;
border-radius: 32rpx;
width: 160rpx;
border: solid 2rpx rgb(153, 153, 153);
}
.text-wrapper-1{
border-color: #E7A23F;
color: #E7A23F;
}
.section_5 {
margin-top: 40rpx;
align-self: center;
border-radius: 4rpx;
width: 196rpx;
height: 8rpx;
}
.text_9 {
color: rgb(119, 119, 119);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_10 {
margin-left: 42rpx;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
max-width: 280rpx;
overflow:hidden;
text-overflow:ellipsis;
}
.text_11 {
margin-left: 30rpx;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_29 {
color: rgb(119, 119, 119);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_30 {
margin-left: 20rpx;
margin-top: 8rpx;
color: rgb(153, 153, 153);
font-size: 24rpx;
font-weight: 500;
line-height: 34rpx;
white-space: nowrap;
}
.image_14 {
margin-left: 0;
}
</style>