373 lines
8.8 KiB
Vue
373 lines
8.8 KiB
Vue
<template>
|
|
<view class="NumberWeight">
|
|
<!-- 订单分类 -->
|
|
<view class="nav" >
|
|
<view :class="['nav-item' ,selectNavId === item.id?'nav-item-selected':'']" v-for="(item,index) in navList"
|
|
:key="index" @click="selectNav(item.id)">
|
|
{{item.name}}
|
|
{{item.id ==='signed' && count.signed >0 ? '('+count.signed + ')':''}}
|
|
{{item.id ==='completed' && count.completed >0 ?'('+count.completed + ')':''}}
|
|
{{item.id ==='init' && count.init >0 ?'('+count.init + ')':''}}
|
|
{{item.id ==='delivered' && count.delivered >0 ?'('+count.delivered + ')':''}}
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 有订单列表 -->
|
|
<block v-if="lists.length > 0">
|
|
<!-- 订单列表 -->
|
|
<view class="order-list" v-for="(item,index) in lists" :key="index">
|
|
<MallShipmentsTemplate :item="item" />
|
|
<view class="actions">
|
|
<view class="nowPay" @click="goDetail(item.shipment_no)" >查看详情</view>
|
|
<view v-if="item.can.cancel" @click="nowCancel(index,item.shipment_no)" class="nowPay">取消订单</view>
|
|
<view v-if="item.can.sign && type==='1'" @click="nowSign(index,item.shipment_no)" class="nowPay">确认签收</view>
|
|
<view v-if="item.can.refund" @click="nowRefund(item.shipment_no)" class="nowPay">申请退货</view>
|
|
<view v-if="item.can.logistic" @click="nowLogistics(item.shipment_no)" class="nowPay">查看物流</view>
|
|
</view>
|
|
</view>
|
|
</block>
|
|
<!-- 没有订单列表 -->
|
|
<no-list v-if="lists.length === 0" name='no-order' txt="暂无数据~" />
|
|
|
|
<!-- <u-toast ref="uToast" /> -->
|
|
<u-toast ref="uToast" />
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { MallShipmentsTemplate } from '@/components/mall-shipments-template/mall-shipments-template'
|
|
import { mallShipmentsPostShop , mallShipmentsSign , mallShipmentsCancel } from '@/apis/interfaces/numberWeight'
|
|
export default {
|
|
components: {
|
|
MallShipmentsTemplate
|
|
},
|
|
data() {
|
|
return {
|
|
lists: [],
|
|
page:1,
|
|
total:0,
|
|
navList: [],
|
|
type:'',// post 快递单 空为自提单
|
|
selectNavId: 'init',
|
|
count:{},// 订单数量
|
|
};
|
|
},
|
|
onLoad(e) {
|
|
console.log(e.type)
|
|
this.type = e.type
|
|
if(e.type === 'post'){
|
|
this.navList = [
|
|
{
|
|
name: '待发货',
|
|
id: 'init'
|
|
},
|
|
{
|
|
name: '已发货',
|
|
id: 'delivered'
|
|
},
|
|
{
|
|
name: '已签收',
|
|
id: 'signed'
|
|
},
|
|
{
|
|
name: '已完成',
|
|
id: 'completed'
|
|
}
|
|
]
|
|
uni.setNavigationBarTitle({
|
|
title:'我的快递单'
|
|
})
|
|
this.selectNavId = 'init'
|
|
}else{
|
|
this.navList = [
|
|
// {
|
|
// name: '待提货',
|
|
// id: 'init'
|
|
// },
|
|
{
|
|
name: '已提货',
|
|
id: 'signed'
|
|
},
|
|
{
|
|
name: '已完成',
|
|
id: 'completed'
|
|
}
|
|
]
|
|
this.selectNavId = 'signed'
|
|
uni.setNavigationBarTitle({
|
|
title:'我的提货单'
|
|
})
|
|
}
|
|
this.getList()
|
|
},
|
|
onShow(){
|
|
console.log(uni.getStorageSync('refresh'),'getStorageSync')
|
|
if(uni.getStorageSync('refresh')){
|
|
this.reset()
|
|
}
|
|
},
|
|
onUnload() {
|
|
uni.setStorageSync('refresh',false)
|
|
},
|
|
onReachBottom() {
|
|
if(this.total>this.lists.length){
|
|
this.page = this.page + 1
|
|
this.getList()
|
|
}else{
|
|
this.$refs.uToast.show({
|
|
title: '吼吼吼~我是有底的~',
|
|
type: 'error',icon:false,
|
|
duration: 3000
|
|
})
|
|
}
|
|
},
|
|
methods: {
|
|
reset(){
|
|
this.page =1
|
|
this.total = 0
|
|
this.lists = []
|
|
this.getList()
|
|
uni.setStorageSync('refresh',false)
|
|
},
|
|
// 选择订单
|
|
selectNav(id) {
|
|
if (this.selectNavId !== id) {
|
|
this.selectNavId = id
|
|
this.reset()
|
|
}
|
|
},
|
|
// 获取订单列表
|
|
getList(){
|
|
let data = {
|
|
pageSize:4,
|
|
page:this.page,
|
|
state:this.selectNavId
|
|
}
|
|
let apiUrl = ''
|
|
if(this.type === 'post'){
|
|
apiUrl = 'mall/shipments/post'
|
|
}else{
|
|
apiUrl = 'mall/shipments/shop'
|
|
}
|
|
mallShipmentsPostShop(apiUrl,data).then(res=>{
|
|
console.log(res.count)
|
|
this.count = res.count
|
|
this.lists = this.lists.concat(res.lists.data)
|
|
this.total = res.lists.page.total
|
|
}).catch(err=>{
|
|
this.$refs.uToast.show({
|
|
title: err.message,
|
|
type: 'error',icon:false,
|
|
duration: 3000
|
|
})
|
|
})
|
|
},
|
|
// 取消提货单
|
|
nowCancel(index,no){
|
|
console.log(index,no)
|
|
uni.showModal({
|
|
title: '哎呦，提醒你',
|
|
content: '是否确认要取消订单啊，取消后请去我的数权中查看',
|
|
success: (res) =>{
|
|
if (res.confirm) {
|
|
mallShipmentsCancel(no).then(res=>{
|
|
console.log(res)
|
|
this.$refs.uToast.show({
|
|
title:res,
|
|
type: 'error',icon:false,
|
|
duration: 3000
|
|
})
|
|
this.lists.splice(index,1)
|
|
this.total = this.total - 1
|
|
}).catch(err=>{
|
|
this.$refs.uToast.show({
|
|
title: err.message,
|
|
type: 'error',icon:false,
|
|
duration: 3000
|
|
})
|
|
})
|
|
} else if (res.cancel) {
|
|
this.$refs.uToast.show({
|
|
title:'放弃了~',
|
|
type: 'error',icon:false,
|
|
duration: 3000
|
|
})
|
|
}
|
|
}
|
|
});
|
|
|
|
},
|
|
// 签收提货单
|
|
nowSign(index,no){
|
|
console.log(index,no)
|
|
uni.showModal({
|
|
title: '哎呦，提醒你',
|
|
content: '是否确认已经收到商品了呀',
|
|
success: (res) =>{
|
|
if (res.confirm) {
|
|
console.log(no)
|
|
mallShipmentsSign(no).then(res=>{
|
|
console.log(res)
|
|
this.$refs.uToast.show({
|
|
title:res,
|
|
type: 'error',icon:false,
|
|
duration: 3000
|
|
})
|
|
this.lists.splice(index,1)
|
|
this.total = this.total - 1
|
|
}).catch(err=>{
|
|
this.$refs.uToast.show({
|
|
title: err.message,
|
|
type: 'error',icon:false,
|
|
duration: 3000
|
|
})
|
|
})
|
|
|
|
} else if (res.cancel) {
|
|
this.$refs.uToast.show({
|
|
title:'放弃了~',
|
|
type: 'error',icon:false,
|
|
duration: 3000
|
|
})
|
|
}
|
|
}
|
|
});
|
|
},
|
|
|
|
// 申请退货
|
|
nowRefund(no){
|
|
this.$Router.push({
|
|
name: 'MallShipmentsRefund',
|
|
params:{
|
|
no:no
|
|
}
|
|
})
|
|
},
|
|
// 查看物流
|
|
nowLogistics(no){
|
|
this.$Router.push({
|
|
name: 'Orderlogistics',
|
|
params:{
|
|
no:no
|
|
}
|
|
})
|
|
},
|
|
// 查看详情
|
|
goDetail(no){
|
|
this.$Router.push({
|
|
name: 'MallShipmentsInfo',
|
|
params:{
|
|
no:no
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
page {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.NumberWeight {
|
|
width: 100%;
|
|
min-height: 100vh;
|
|
box-sizing: border-box;
|
|
background-color: #F7F7F7;
|
|
|
|
// 订单nav
|
|
.nav {
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
justify-content: space-around;
|
|
box-sizing: border-box;
|
|
font-size: $title-size*0.95;
|
|
padding: 0 30rpx;
|
|
background-color: #fff;
|
|
color: #666;
|
|
border-top: solid 20rpx #f7f7f7;
|
|
position: sticky;
|
|
top: 0rpx;
|
|
z-index: 10000;
|
|
|
|
.nav-item {
|
|
border-bottom: solid 4rpx #fff;
|
|
padding: 30rpx 10rpx;
|
|
}
|
|
|
|
.nav-item-selected {
|
|
border-bottom: solid 4rpx $main-color;
|
|
color: $main-color;
|
|
}
|
|
}
|
|
|
|
// 订单列表
|
|
.order-list {
|
|
background-color: #fff;
|
|
border-radius: 20rpx;
|
|
min-height: 300rpx;
|
|
margin: 30rpx 20rpx 0 20rpx;
|
|
padding:30rpx 30rpx 20rpx 30rpx ;
|
|
// border-top: solid 4rpx #cacaca;
|
|
|
|
// 操作信息
|
|
.actions {
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
box-sizing: border-box;
|
|
flex-wrap: wrap;
|
|
flex: 1;
|
|
font-size: 28rpx;
|
|
color: #fff;
|
|
border-top: solid 1rpx #EFF4F2;
|
|
.nowPay {
|
|
padding: 4rpx 20rpx;
|
|
border-radius: 40rpx;
|
|
margin-left: 20rpx;
|
|
margin-top: 20rpx;
|
|
// background-color: $main-color;
|
|
color: #999;
|
|
border:solid 1rpx #cacaca;
|
|
}
|
|
|
|
.cancelOrder {
|
|
padding: 10rpx 30rpx;
|
|
border-radius: 40rpx;
|
|
margin-left: 20rpx;
|
|
margin-top: 20rpx;
|
|
background-color: #DD524D;
|
|
}
|
|
|
|
.logistics {
|
|
background-color: $main-color;
|
|
padding: 10rpx 30rpx;
|
|
border-radius: 40rpx;
|
|
margin-left: 20rpx;
|
|
margin-top: 20rpx;
|
|
}
|
|
|
|
.sign {
|
|
background-color: #DD524D;
|
|
padding: 10rpx 30rpx;
|
|
border-radius: 40rpx;
|
|
margin-left: 20rpx;
|
|
margin-top: 20rpx;
|
|
}
|
|
|
|
.evaluate {
|
|
background-color: $main-color;
|
|
padding: 10rpx 30rpx;
|
|
border-radius: 40rpx;
|
|
margin-left: 20rpx;
|
|
margin-top: 20rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|