Files
dtx_store/pages/order/index.vue

328 lines
13 KiB
Vue

<template>
<view class="content">
<!-- tabs -->
<u-sticky>
<u-tabs class="tabs" :list="tabs" :scrollable="false" :current="index" lineColor="#34CE98" @click="onTabs"
sticky />
</u-sticky>
<block v-if="array.length >= 1">
<!-- 订单列表 -->
<oct-order v-for="(item, arrayIndex) in array" :key="arrayIndex" :order-info="item" @onBtn="onType" />
<!-- 加载更多 -->
<view class="pages-load">
<u-loadmore :status="status" />
</view>
</block>
<block v-else>
<view class="vertical order-null">
<u-empty mode="order" icon="http://cdn.uviewui.com/uview/empty/order.png" text="暂无相关订单"
textColor="#999" />
</view>
</block>
</view>
</template>
<script>
import {
orders,
del,
cancel,
sign
} from '@/apis/interfaces/order'
import eventBus from '../../utils/eventBus.js';
export default {
data() {
return {
status: "loading",
tabs: [{
name: "全部",
type: "",
},
{
name: "待付款",
type: "unpay",
},
{
name: "待发货",
type: "paid",
},
{
name: "待收货",
type: "delivered",
},
{
name: " 已签收",
type: "signed",
},
],
index: '0',
array: [],
page: 1
};
},
onShow() {
if (this.$store.getters.getRefresh == 1) {
this.$store.commit('setRefresh', 0)
this.array = []
this.page = 1
this.getOrder()
}
},
mounted() {
this.index = this.$Route.query.index
this.getOrder()
eventBus.$on('paySuccess', function(data) {
let index = this.array.findIndex((item) => item.no === data);
console.log(typeof this.index, this.index)
if (this.index == '0') {
this.array[index].stateText = '待发货'
this.array[index].cans = {
"cancel": false,
"pay": false,
"sign": false,
"refund": true,
"user_deliver": false,
"logistic_show": false,
"refund_money": true
}
} else {
this.array.splice(index, 1);
}
}.bind(this));
eventBus.$on('applyRefundMoney', (data)=> {
console.log(data,'data....');
let index = this.array.findIndex((item) => item.no === data);
this.array.splice(index, 1);
});
},
methods: {
getOrder() {
orders({
state: this.tabs[this.index].type,
page: this.page
}).then(res => {
console.log(res);
if (res.page.current === 1) {
this.array = []
}
let ordersArr = res.data.map(val => {
return {
no: val.order_no,
cover: val.items[0].sku.cover,
name: val.items[0].sku.goods_name,
price: val.total,
sum: val.items[0].qty,
stateText: val.state,
cans: val.can,
shop: val.shop,
goods_id:val.items[0].sku.goods_id
}
})
this.array = this.array.concat(ordersArr)
this.status = res.page.has_more ? 'loadmore' : 'nomore'
})
},
onTabs(e) {
this.page = 1
this.index = e.index
this.getOrder()
},
onType(e) {
let orderNo = e.order.no;
let shopId = e.order.shop.shop_id;
let goodsId = e.order.goods_id;
let onFount;
switch (e.type) {
case 'delete':
onFount = del(orderNo);
break;
case 'cancel':
uni.showModal({
title: '温馨提示',
content: '是否确认取消该订单',
confirmText: '确认取消',
confirmColor: "#34CE98",
cancelText: '再想想',
cancelColor: "#666666",
success: (res) => {
if (res.confirm) {
cancel(orderNo).then(res => {
console.log(res)
let orderIndex = this.array.findIndex(val => val.no === e
.order.no)
console.log(this.index, typeof this.index, orderIndex);
if (this.index == '0') {
this.array[orderIndex].stateText = "已取消";
this.array[orderIndex].cans = {
"cancel": false,
"pay": false,
"sign": false,
"refund": false,
"user_deliver": false,
"logistic_show": false,
"refund_money": false
};
} else {
this.array.splice(orderIndex, 1);
}
return;
}).catch(err => {
uni.showToast({
title: err.message,
icon: 'none'
})
})
}
}
});
break;
case 'logistic':
this.$Router.push({
name: 'OrderLogistics',
params: {
orderNo: orderNo,
},
});
break;
case 'pay':
this.$Router.push({
name: 'Pay',
params: {
orderNo: orderNo,
price: e.order.price,
oepnType: 'order',
coins: e.order.coins
}
});
break;
case 'sign':
uni.showModal({
title: '温馨提示',
content: '是否确认收到货物并签收该订单',
confirmText: '确认签收',
confirmColor: "#34CE98",
cancelText: '再想想',
cancelColor: "#666666",
success: (res) => {
if (res.confirm) {
sign(orderNo).then(res => {
console.log(res)
let orderIndex = this.array.findIndex(val => val.no === e
.order.no)
console.log(this.index, typeof this.index, orderIndex);
if (this.index == '0') {
this.array[orderIndex].stateText = "已签收";
this.array[orderIndex].cans = {
"cancel": false,
"pay": false,
"sign": false,
"refund": true,
"user_deliver": false,
"logistic_show": true,
"refund_money": false
};
} else {
this.array.splice(orderIndex, 1);
}
return;
}).catch(err => {
uni.showToast({
title: err.message,
icon: 'none'
})
})
}
}
});
break;
case 'refundMoney':
this.$Router.push({
name: "RefundMoney",
params: {
id: orderNo
}
})
break;
case 'refund' :
this.$Router.push({
name: "AfterSale",
params: {
id: orderNo
}
})
break;
case 'shopsDetail':
this.$Router.push({ name: 'ShopDetail', params: {ShopId: shopId}})
break;
case 'goodsDetail':
this.$Router.push({ name: 'StoreGoods', params: {id: goodsId}})
break;
}
if (!onFount) return
onFount.then(res => {
console.log(res)
let orderIndex = this.array.findIndex(val => val.no === e.order.no)
if (e.type === 'delete' || e.type === 'sign') {
this.array.splice(orderIndex, 1)
return;
}
if (e.type === 'cancel') {
this.array.splice(orderIndex, 1, {
no: res.order_no,
cover: res.items[0].sku.cover,
name: res.items[0].sku.goods_name,
price: res.items[0].price,
sum: res.items[0].qty,
stateText: res.state,
cans: res.can
});
return;
}
}).catch(err => {
uni.showToast({
title: err.message,
icon: 'none'
})
})
}
},
onReachBottom() {
if (this.status === 'loadmore') {
this.page += 1
this.status = 'loading'
this.getOrder()
}
}
}
</script>
<style lang="scss">
.content {
background: $window-color;
min-height: 100vh;
}
.tabs {
background: white;
}
// 数据列表空
.order-null {
height: 80vh;
}
// 加载分页
.pages-load {
padding-bottom: $padding;
}
</style>