102 lines
4.2 KiB
Vue
102 lines
4.2 KiB
Vue
<template>
|
||
<view class="pad-x140">
|
||
<status-container titlet="订单详情">
|
||
<view slot="content">
|
||
<view class="pad-zy20">
|
||
<view class="bacf radius30 pad-sx30 pad-zy40 fon30 mar-x25">
|
||
<view class="disjbac">
|
||
<view class="">订单编号</view>
|
||
<view class="bold">{{orderDetail.coding}}</view>
|
||
</view>
|
||
<view class="disjbac mar-sx30">
|
||
<view class="">下单时间</view>
|
||
<view class="bold">{{orderDetail.status_text}}</view>
|
||
</view>
|
||
<view class="disjbac">
|
||
<view class="">订单状态</view>
|
||
<view class="bold">{{orderDetail.coding}}</view>
|
||
</view>
|
||
</view>
|
||
<view class="bacf radius30 pad-sx30 pad-zy40 fon30 mar-x25">
|
||
<view class="">订单信息</view>
|
||
<view class="disjb bbot pad-sx30" v-for="(item,index) in orderDetail.skus" :key="index">
|
||
<image class="mar-y30 flexs radius30" src="https://s6.jpg.cm/2022/05/06/Lx4T45.jpg" mode="" style="width: 210rpx;height: 210rpx;"></image>
|
||
<view class="width100 disjb fc line-h40" style="height: 210rpx;">
|
||
<view class="clips2 fon24">{{item.spu_name}} </view>
|
||
<view class="">
|
||
<view class="fon24 mar-x30" style="color: #8c8c9b;">单位：{{item.sku_unit}}</view>
|
||
<view class="disjbac ">
|
||
<view class="textc bold">￥{{item.price}}</view>
|
||
<view class="fon24" style="color: #8c8c9b;">x{{item.num}}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="disje pad-s30">总计：<text class="fon36 bold textc" style="margin-top: -6rpx;">￥{{orderDetail.original_price}}</text></view>
|
||
</view>
|
||
<view class="bacf radius30 pad-sx30 pad-zy40 fon30 mar-x25">
|
||
<view class="mar-x30">联系信息</view>
|
||
<view class="bold">{{orderDetail.contacts}} {{orderDetail.phone}}</view>
|
||
<view class="fon24">
|
||
<view class="mar-sx10" style="color: #8c8c9b;">{{orderDetail.address}}</view>
|
||
<view class="" style="color: #8c8c9b;">婚期：{{orderDetail.wedding_date}}</view>
|
||
<view class="mar-s10" style="color: #8c8c9b;">希望到货时间：{{orderDetail.expected_delivery_date}}</view>
|
||
</view>
|
||
</view>
|
||
<view class="posixzy bacf pad-sx20 pad-zy50" style="box-shadow: 0rpx -2rpx 10rpx rgba(0, 0, 0, 0.06);">
|
||
<view class="navigate-to-where radius30 colf fon36 tcenter">确认收货</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</status-container>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
orderDetail: []
|
||
}
|
||
},
|
||
onShareAppMessage(res) {
|
||
var shareObj = {
|
||
title: res.target.dataset.title, // 默认是小程序的名称(可以写slogan等)
|
||
path: `/pagesB/shopDetail/shopDetail?id=${res.target.dataset.id}&category_id=0&is_activity=${res.target.dataset.is_activity}&share_id=${uni.getStorageSync('userId')}&invite_code=${uni.getStorageSync('invite_code')}`, // 默认是当前页面，必须是以‘/’开头的完整路径
|
||
imageUrl: res.target.dataset.imgsrc//自定义图片路径，可以是本地文件路径、代码包文件路径或者网络图片路径，支持PNG及JPG，不传入 imageUrl 则使用默认截图。显示图片长宽比是 5:4
|
||
};
|
||
return shareObj;
|
||
},
|
||
onLoad(op) {
|
||
this.getDetail(op.id);
|
||
},
|
||
methods: {
|
||
getDetail(id){
|
||
this.$requst.post('/api/user/order-detail',{id}).then(res=>{
|
||
if(res.code==0) {
|
||
let dataObj = {
|
||
coding: res.data.coding, //订单号
|
||
created_at: res.data.created_at, //下单时间
|
||
status_text: res.data.status_text, //订单状态
|
||
expected_delivery_date: res.data.expected_delivery_date, //期望到货时间
|
||
wedding_date: res.data.wedding_date, //婚期
|
||
original_price: res.data.original_price, //总价
|
||
contacts: res.data.contacts, //收件人姓名
|
||
address: res.data.address, //收件地址
|
||
phone: res.data.phone, //联系电话
|
||
skus: res.data.skus //订单详情列表
|
||
}
|
||
this.orderDetail = dataObj;
|
||
console.log(this.orderDetail,'订单详情2')
|
||
}
|
||
})
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
.navigate-to-where {height: 98rpx;line-height: 98rpx;background: linear-gradient(to right, #ff3772 0%,#fd5548 100%);box-shadow: 0rpx 6rpx 10rpx rgba(0, 0, 0, 0.2);}
|
||
</style>
|
||
|