<template>
|
<view>
|
<!-- 团购、粗去玩、深夜食堂、挖宝商品 -->
|
<view style="position: fixed;left: 0;right: 0;top: 0;background-color: #fff;height: 84rpx;z-index: 999;">
|
<top-tabs :tabs="tabs" :flg.sync="tabIndex" @change="changeTab"></top-tabs>
|
|
</view>
|
<view style="height: 100rpx;"></view>
|
<!-- 根据tab不同显示不同信息 -->
|
|
<!-- 根据不同加载不同的继续的底部 -->
|
<view style="min-height: calc(100vh - 200rpx);">
|
<no-data v-if="!list||list.length==0" style="width: 100%;"></no-data>
|
<view v-if="type=='shop'" class="order-container">
|
<card-list-item source="order" :type="type" :dto="item" v-for="(item,index) in list" @refresh="refresh"
|
:key="index"></card-list-item>
|
</view>
|
<view v-if="type=='travel'" class="order-container">
|
<card-list-item source="order" :type="type" :dto="item" v-for="(item,index) in list" @refresh="refresh"
|
:key="index"></card-list-item>
|
</view>
|
<view v-if="type=='canteen'" class="order-container">
|
<!-- 时间，状态 -->
|
<view class="order-item good-item" v-for="(item,index) in list" :key="index">
|
<view class="flex ">
|
<view class="time">下单: {{item.createdDate}}</view>
|
<view class="status">{{item.statusStr}}</view>
|
</view>
|
|
<view class="flex">
|
<!-- overfi -->
|
<scroll-view class="flex scroll-view" :scroll-x="true" style="max-width: 500rpx;"
|
v-if="item.items">
|
<view v-for="each of item.items" class="item-each">
|
<image :src="each.cover" class="cover"></image>
|
<!-- 文字缩写 -->
|
<view class="cover-name word-e">{{each.name}}</view>
|
</view>
|
</scroll-view>
|
<view style="min-width: 100rpx;margin-left: auto;">
|
<view class="price"><span class="dot">￥</span>{{item.totalAmount||'0.0'}}</view>
|
<view class="num-tip">共{{getItemsNum(item.items)||0}}件</view>
|
</view>
|
</view>
|
<!-- <view class="address">
|
{{item.customerAddress}}
|
</view> -->
|
<view class="infos">
|
<view class="flex">
|
<view class="info-user-name flex flex1">
|
<uni-icons type="person-filled" class="icon"></uni-icons>
|
{{item.customer}}
|
</view>
|
<view class="info-user-tel flex flex1">
|
<uni-icons type="phone-filled" class="icon"></uni-icons>
|
{{item.customerTel}}
|
</view>
|
</view>
|
<view class="info-user-address flex">
|
<uni-icons type="location-filled" class="icon"></uni-icons>
|
{{item.customerAddress}}
|
</view>
|
|
</view>
|
<view class="buttons">
|
<view class="button-wuliu button" v-if="item.status=='PENDING'||item.status==='PREPAYMENT'"
|
@click.stop="toPay(item)">支付订单</view>
|
<view class="button-wuliu button" v-if="item.status=='PENDING'||item.status==='PREPAYMENT'"
|
@click.stop="cancelPay(item)">取消订单</view>
|
|
<view class="button-shouhuo button" @click.stop="toOrderDetail(item)">订单详情</view>
|
</view>
|
</view>
|
<!-- 货物单 -->
|
<!-- 地址 -->
|
</view>
|
<view v-if="type=='good'" class="order-container">
|
<view class="order-item good-item" v-for="(item,index) in list" :key="index">
|
<view class="flex ">
|
<view class="time">下单: {{item.createdDate}}</view>
|
<view class="status">{{item.statusStr}}</view>
|
</view>
|
<view class="flex">
|
<image class="cover" :src="item.items[0].cover"></image>
|
<view>
|
<view class="name">{{item.items[0].name}}</view>
|
<!-- <view>介绍尺码</view> -->
|
<view class="price"><span class="dot">￥</span>{{item.totalAmount||'0.0'}}</view>
|
</view>
|
</view>
|
<view class="infos">
|
<view class="info-user-name flex">
|
<uni-icons type="person-filled" class="icon"></uni-icons>
|
{{item.customer}}
|
</view>
|
<view class="info-user-tel flex">
|
<uni-icons type="phone-filled" class="icon"></uni-icons>
|
{{item.customerTel}}
|
</view>
|
<view class="info-user-address flex">
|
<uni-icons type="location-filled" class="icon"></uni-icons>
|
{{item.customerAddress}}
|
</view>
|
|
</view>
|
<view class="buttons">
|
<view class="button-wuliu button" v-if="item.status=='PENDING'||item.status==='PREPAYMENT'"
|
@click.stop="toPay(item)">支付订单</view>
|
<view class="button-wuliu button" v-if="item.status=='PENDING'||item.status==='PREPAYMENT'"
|
@click.stop="cancelPay(item)">取消订单</view>
|
|
<!-- <view class="button-shouhuo button" v-if="item.status!=='PENDING'&&item.status!=='PREPAYMENT'||true">查看物流</view> -->
|
<view class="button-shouhuo button" @click.stop="toOrderDetail(item)">订单详情</view>
|
|
<!-- <view class="button-shouhuo button" v-if="item.status!=='PENDING'&&item.status!=='PREPAYMENT'">确认收货</view> -->
|
</view>
|
|
</view>
|
</view>
|
</view>
|
|
<footer-msg :more="page.total>0&&page.total>page.current*page.size"></footer-msg>
|
|
</view>
|
</template>
|
|
<script>
|
export default {
|
data() {
|
return {
|
type: '',
|
tabIndex: 1,
|
query: {
|
|
},
|
tabs: [{
|
name: '团购',
|
id: 'shop',
|
api: '/api/buy/customer/group/list/mine'
|
},
|
{
|
name: '粗去玩',
|
id: 'travel',
|
api: '/api/trip/customer/list/mine'
|
},
|
{
|
name: '每日维C',
|
id: 'canteen',
|
api: '/api/canteen/customer/order/list'
|
|
},
|
{
|
name: '挖宝商品',
|
id: 'good',
|
api: '/api/wabao/customer/order/list'
|
|
},
|
],
|
}
|
},
|
onLoad(options) {
|
this.type = options.type || ''
|
var index = -1
|
for (var item of this.tabs) {
|
index++
|
if (item.id == this.type) {
|
this.tabIndex = index
|
this.listApi = item.api
|
break
|
}
|
}
|
this.refresh()
|
|
|
},
|
onReachBottom() {
|
this.page.current += 1
|
this.getMore()
|
},
|
methods: {
|
toOrderDetail(row) {
|
var url = `/pages/order/bussiness-order/bussincess-order-detail?source=user&type=${this.type}`
|
if (this.type == 'travel') {
|
url += `&id=${row.id}&userId=${this.currentInfo.id}`
|
} else {
|
url += `&id=${row.id}`
|
}
|
uni.navigateTo({
|
url: url
|
})
|
},
|
async cancelPay(item) {
|
if (!this.currentInfo.id) {
|
await this.$message.confirm('未登录，前往登录?')
|
uni.navigateTo({
|
url: '/pages/user/user'
|
})
|
return
|
}
|
await this.$message.confirm('是否确认取消支付?')
|
this.$message.showLoading()
|
const orderInfo = await this.$http.request('post', '/api/order/cancel/' + (item.orderId ||
|
item.id || ''), {
|
|
})
|
this.$message.hideLoading()
|
if (code == 0) {
|
this.$message.showToast('取消成功')
|
this.dto.status = 'COMPLETED'
|
this.dto.statusStr = '已取消'
|
setTimeout(() => {
|
that.refresh()
|
}, 500)
|
}
|
|
},
|
async toPay(item) {
|
if (!this.currentInfo.id) {
|
this.$message.showToast('请先登陆')
|
return
|
}
|
if (item.status === 'PENDING' || item.status === 'PREPAYMENT') {
|
if (this.type == 'canteen') {
|
const orderInfo = await this.$http.request('get', '/api/canteen/customer/payment/' + item
|
.id, {})
|
//支付准备
|
var info = orderInfo.data
|
let that = this
|
wx.requestPayment({
|
...info,
|
success(res) {
|
console.log('pay success', res)
|
that.$message.showToast('支付成功')
|
setTimeout(() => {
|
that.refresh()
|
}, 500)
|
},
|
fail(err) {
|
console.error('pay fail', err)
|
that.$message.showToast('支付失败')
|
}
|
})
|
|
} else {
|
// this.$message.showToast('等待接口，请联系开发者')
|
// return
|
this.$message.showLoading()
|
const orderInfo = await this.$http.request('post', '/api/order/pay/again/' + (item.orderId ||
|
item.id || ''), {
|
|
})
|
var info = orderInfo.data || {}
|
this.$message.hideLoading()
|
if (code == 0) {
|
let that = this
|
wx.requestPayment({
|
...info,
|
success(res) {
|
console.log('pay success', res)
|
that.$message.showToast('支付成功')
|
item.status = 'PAYMENT'
|
item.statusStr = '已支付'
|
setTimeout(() => {
|
that.refresh()
|
}, 500)
|
},
|
fail(err) {
|
console.error('pay fail', err)
|
that.$message.showToast('支付失败')
|
}
|
})
|
}
|
}
|
|
} else {
|
this.$message.showToast('请不要重复支付')
|
return
|
}
|
},
|
getItemsNum(arr) {
|
var a = 0
|
if (arr) {
|
for (var item of arr) {
|
a += item.num || 0
|
}
|
}
|
|
return a
|
},
|
refresh() {
|
//获取
|
console.log('refresh')
|
this.page.current = 1
|
this.getList()
|
},
|
changeTab(e) {
|
this.type = this.tabs[e].id
|
console.log('this.type', this.type, this.tabs, e)
|
|
this.list = []
|
for (var item of this.tabs) {
|
if (item.id == this.type) {
|
this.listApi = item.api
|
break
|
}
|
}
|
this.refresh()
|
},
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
@import './order.scss'
|
</style>
|
