mall_client/zyhs3_uniapp/pages/merchants/order/index.vue

283 lines
8.9 KiB
Vue

<template>
<view>
<v-tabs
v-if="showTabs"
:tabs="tabs"
:value="current"
:scroll="tabsScroll"
:fixed="true"
field="name"
height="90rpx"
fontSize="30rpx"
@change="tabsChange">
</v-tabs>
<view class="list">
<view class="list-item bg-w" v-for="(item, i) in list" :key="i" @tap="goDetails(item)">
<view class="flex flex-between font30 color-b6 title">
<text>{{item.createTime}}</text>
<view class="flex flex-align-center">
<text class="color-purple font28" v-if="item.status === 1">待付款</text>
<text class="color-purple font28" v-if="item.status === 2">未支付完成</text>
<text class="color-purple font28" v-if="item.status === 3">{{deliveryStatus(item)}}</text>
<text class="color-purple font28" v-if="item.status === 4">待评价</text>
<text class="color-b9 font28" v-if="item.status === 5">已完成</text>
<text class="color-b9 font28" v-if="item.status === 10">已退款</text>
<text class="color-b9 font28" v-if="item.status === 11">已关闭</text>
<text class="color-purple font28" v-if="item.orderType === 14">
-{{item.groupStatus === 2 ? '拼团中' :'拼团成功'}}{{item.groupTrueNumber}}/{{item.groupNumber}}
</text>
</view>
</view>
<view class="flex">
<view><image :src="filterImg(item.skuImage || item.goodsImage)" mode="aspectFit" class="img"></image></view>
<view class="flex flex-column flex-grow">
<text class="color-b3 line line-2 font32">{{item.goodsName}}</text>
<text class="color-b9 line line-2 font26">{{item.skuName}}</text>
</view>
<view class="flex flex-column flex-align-end">
<text class="color-b3 font32">¥{{item.unitPrice}}</text>
<text class="color-b9 font26">x{{item.number}}</text>
</view>
</view>
<text class="font28 color-b6">订单号:{{item.orderNumber}}</text>
<!-- <view class="flex flex-space-end">
<text class="color-b9 font28">共{{item.orderItemList.length}}件商品 实付款¥{{item.totalAmount}}</text>
</view> -->
</view>
</view>
<uni-load-more :status="loadingType"></uni-load-more>
</view>
</template>
<script>
import url from "@/common/http/url.js"
import publics from "@/common/utils/public.js"
import selectOptions from "@/common/utils/selectOptions.js"
import mix from "../../order/mix.js"
import vTabs from "@/components/v-tabs/v-tabs.vue"
import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
let filterTabName = (name, total) => {
let s = ""
if (name.indexOf("(") > -1){
s = name.split("(")[0]
} else {
s = name
}
if (!total) {
return s
} else {
return `${s}(${total})`
}
}
let options = null
export default{
mixins: [mix],
components: { vTabs, uniLoadMore },
data(){
return {
showTabs: false,
tabs: selectOptions.merchantsOrderList,
tabsScroll: true,
current: 0,
deliveryMethod: "",
dStatus: "",
loadingType: "loading",
list: [],
pageSize: 1
}
},
onPullDownRefresh() {
this.getList('refresh')
this.getOrderTotal(this.deliveryMethod)
},
onReachBottom() {
this.getList('add')
},
onLoad(opt) {
options = JSON.parse(JSON.stringify(selectOptions))
this.tabs = options.merchantsOrderList
console.log('opt', opt)
if (opt.deliveryStatus){
this.dStatus = opt.deliveryStatus
}
if (opt.deliveryMethod){
this.tabsScroll = false
this.deliveryMethod = parseInt(opt.deliveryMethod)
let title = ""
if (this.deliveryMethod === 1) {
title = "物流配送订单"
this.tabs = options.logisticsList
} else if (this.deliveryMethod === 2){
title = "商家配送订单"
this.tabs = options.businessList
} else if (this.deliveryMethod === 3){
title = "用户自提订单"
this.tabs = options.extractionList
} else if (this.deliveryMethod === 4){
title = "平台配送订单"
this.tabs = options.platformList
} else if (this.deliveryMethod === 5){
title = "线下订单"
this.tabs = options.onStoreList
}else if (this.deliveryMethod === 6) {
title = "拼团订单"
this.tabs = options.collateList
}
uni.setNavigationBarTitle({
title: title
})
}
if (opt.status || opt.deliveryStatus){
let status = opt.status || opt.deliveryStatus
this.tabs.forEach((v, i) => {
if (v.value === parseInt(status)) {
this.current = i
if (this.deliveryMethod == 5) {
if (status == 12) this.current = 0;
else this.current = 1
}
return false
}
})
}
this.getList()
this.getOrderTotal(this.deliveryMethod)
},
methods:{
getOrderTotal(type){
this.$http("GET", url.store.getOrderAmount).then(res =>{
uni.stopPullDownRefresh()
let data = res.data;
console.log('type*******', type);
console.log('type*******deliveryMethod', this.deliveryMethod)
if (type === 1) {// 物流
this.tabs[0].name = filterTabName(this.tabs[0].name, data.logisticsToBeDelivered)
this.tabs[1].name = filterTabName(this.tabs[1].name, data.logisticsDelivered)
this.tabs[2].name = filterTabName(this.tabs[2].name, data.logisticsConfirmed)
} else if (type === 2) {// 商家
this.tabs[0].name = filterTabName(this.tabs[0].name, data.businessToBeDelivered)
this.tabs[1].name = filterTabName(this.tabs[1].name, data.businessDelivery)
this.tabs[2].name = filterTabName(this.tabs[2].name, data.businessDelivered)
} else if (type === 3) { // 自提
this.tabs[0].name = filterTabName(this.tabs[0].name, data.raisingToBePickedUp)
this.tabs[1].name = filterTabName(this.tabs[1].name, data.raisingPickedUp)
} else if (type === 4) {// 平台
this.tabs[0].name = filterTabName(this.tabs[0].name, data.platformWaitingForDelivery)
this.tabs[1].name = filterTabName(this.tabs[1].name, data.platformPickingUp)
this.tabs[2].name = filterTabName(this.tabs[2].name, data.platformPickedUp)
this.tabs[3].name = filterTabName(this.tabs[3].name, data.platformDelivered)
} else if (type === 5) {// 平台
this.tabs[0].name = filterTabName(this.tabs[0].name, data.deliveryStoreUnused)
this.tabs[1].name = filterTabName(this.tabs[1].name, data.deliveryStoreUsed)
}
else if (type === 6) { //拼团
this.tabs[0].name = filterTabName(this.tabs[0].name, data.inAGroupOrder)
this.tabs[1].name = filterTabName(this.tabs[1].name, data.successAGroupOrder)
} else { // 订单
this.tabs[0].name = filterTabName(this.tabs[0].name, data.waitingForPayment)
this.tabs[1].name = filterTabName(this.tabs[1].name, data.toBeEvaluated)
this.tabs[2].name = filterTabName(this.tabs[2].name, data.completed)
this.tabs[3].name = filterTabName(this.tabs[3].name, data.refunded)
this.tabs[4].name = filterTabName(this.tabs[4].name, data.overtimeClosing)
}
if (this.deliveryMethod === 5) {
this.showTabs = true
// this.showTabs = false
// uni.setNavigationBarTitle({
// title: data.noDeliveryRequired ? `到店体验订单(${data.noDeliveryRequired})` : "到店体验订单"
// })
} else {
this.showTabs = true
}
console.log('this.showTabs', this.showTabs)
})
},
getList(type){
if (type === 'add') {
if (this.loadingType === 'nomore') {
return;
}
this.loadingType = 'loading';
} else {
this.loadingType = 'more';
this.pageSize = 1
this.list = []
}
let params = {
pageSize: this.pageSize,
deliveryMethod: this.deliveryMethod
}
if (this.deliveryMethod === 6){ // 拼团
params.groupOrderStatus = this.tabs[this.current].value
} else {
// params.deliveryMethod = this.deliveryMethod
if (this.dStatus){
params.deliveryStatus = this.tabs[this.current].value
} else {
params.status = this.tabs[this.current].value
}
}
this.$http("GET", url.store.getOrderList, params).then(res =>{
this.list = this.list.concat(res.data.records)
if(this.list.length < res.data.total){
this.pageSize++;
this.loadingType = "more"
} else{
this.loadingType = "nomore"
}
uni.stopPullDownRefresh();
})
},
tabsChange(val){
this.current = val
this.getList('refresh')
},
goDetails(row){
this.$navigateTo("details?id="+row.id)
},
filterImg(img) {
return publics.filterImgUrl(img, 3)
}
}
}
</script>
<style lang="scss" scoped>
.list{
margin: 20rpx;
&-item{
border-radius: 20rpx;
margin-bottom: 20rpx;
padding: 20rpx;
.title{
margin-bottom: 30rpx;
}
.img{
width: 180rpx;
height: 180rpx;
border-radius: 10rpx;
margin-right: 20rpx;
}
.bom{
margin-top: 30rpx;
.btn{
font-size: 26rpx;
border: 2rpx solid #aeadaf;
padding: 10rpx 26rpx;
border-radius: 50rpx;
margin-left: 20rpx;
color: #666;
}
.base{
color: #F8D247;
border: 2rpx solid #F8D247;
}
}
}
}
</style>