<template>
|
|
<view>
|
|
<u-sticky>
|
|
<u-tabs :list="nav_list" :is-scroll="false" :current="status" @change="getInfo" bar-width="80" active-color="#01AEEA" font-size="34"></u-tabs>
|
|
</u-sticky>
|
|
<!-- 待收货 -->
|
|
<view class="item" v-for="(item,index) in orderList" :key="item.id">
|
|
<view class="time">
|
|
<text class="time_text">{{item.createTime}}</text>
|
|
<text class="phone" @click="call">{{nav_list[status].name}}</text>
|
|
</view>
|
|
<u-read-more :toggle="true" showHeight="900" color="#6C6C6C" textIndent="0" fontSize="24rpx" closeText="展开(共5件)" openText="收起">
|
|
<view class="goods_item" v-for="item2 in item.orderDetailList" @click="toGoodsInfo(item2)">
|
|
<image :src="item2.goodPic2" mode="widthFix"></image>
|
|
<view class="right_box">
|
|
<text class="title">{{item2.goodName}}</text>
|
|
<text class="title" v-if="item2.prescriptionId!=null">【处方药】</text>
|
|
<view class="center_box">
|
|
<view class="money_box">
|
|
<!-- <text class="min red"></text> -->
|
|
<text class="bigs red" v-if="item.payFlag !== 2">¥{{item2.goodPrice}}</text>
|
|
<text class="bigs red" v-else>{{item2.goodPrice}}兑购</text>
|
|
</view>
|
|
<text class="back_money" v-if="item2.couponPrice!==0 && item2.couponPrice">再返消费金¥{{item2.couponPrice}}</text>
|
|
<text class="back_iconx">×{{item2.goodNum}}</text>
|
|
</view>
|
|
<text>{{item2.goodSku}}</text>
|
|
</view>
|
|
</view>
|
|
</u-read-more>
|
|
<!-- 0要显示 订单为消费金支付是不显示 -->
|
|
<text class="sum_back_momey m-l-30" v-show="item.name !== '普通订单消费金支付'">总返消费金¥{{item.giveMoneySum}} {{item.giveIntegerSum==0 ? '':'兑购金'+item.giveIntegerSum+"元"}}</text>
|
|
<view class="total_box" v-if="item.payFlag == 2 && !!item.giveIntegerSum"> <!--item.payFlag 兑购支付为2 -->
|
|
<text class="text_price">合计</text>
|
|
<text class="price font-42">{{item.giveIntegerSum}}元</text>
|
|
<text class="text_price">兑购金</text>
|
|
</view>
|
|
|
|
<view class="total_box" v-else-if="!!item.giveMoneySum" >
|
|
|
|
<text class="text_price">合计</text>
|
|
<text class="price font-42">¥{{item.payMoney}}</text>
|
|
</view>
|
|
|
|
<!-- 待付款的按钮 -->
|
|
<view class="btn_box" v-if="orderList.length>0">
|
|
<!-- 普通订单 -->
|
|
<text class="order_name" v-if="item.name == '普通订单'">{{item.payFlag == 1? '普通订单消费金支付': '普通订单微信支付'}} </text>
|
|
<text class="order_name" v-else>{{item.name}}</text>
|
|
<view class="btn_order">
|
|
<button v-if="status==0" class="gather cancel" @click="close(item.id,index)">取消订单</button>
|
|
<button v-if="status==0" class="gather" @click="payMoney(item.id,index,item)">立即支付</button>
|
|
<!-- 待发货的按钮 售后/退换的按钮 -->
|
|
<button v-if="status==1 || status==3 || status==4" class="gather" @click="toDetails(item.id)">订单详情</button>
|
|
<!-- 已完成的按钮 -->
|
|
<button v-if="status==2" class="gather cancel" @click="toAfterSales(item.id,index)">申请售后</button>
|
|
<button v-if="status==2" class="gather" @click="toConfirmOrderById(item.id,index)">确认收货</button>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
|
|
<view class="empty_box" v-if="orderList.length==0">
|
|
<image :src="IMG_URL+'empty.png'" alt=""></image>
|
|
<text class="text_">暂无订单记录</text>
|
|
</view>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { IMG_URL } from '@/env.js'
|
|
export default {
|
|
data() {
|
|
return {
|
|
IMG_URL,
|
|
status: null,
|
|
pageNo: 1,
|
|
pageSize: 10,
|
|
total: null,
|
|
isLock: true,
|
|
nav_list: [
|
|
{
|
|
name: "待付款"
|
|
},
|
|
{
|
|
name: "待发货"
|
|
},
|
|
{
|
|
name: "待收货"
|
|
},
|
|
{
|
|
name: "已完成"
|
|
},
|
|
{
|
|
name: "售后/退换"
|
|
}
|
|
],
|
|
orderList: []
|
|
}
|
|
},
|
|
onUnload() {
|
|
uni.switchTab({
|
|
url: '/pages/my/my'
|
|
})
|
|
},
|
|
onLoad(options) {
|
|
this.status = options.status
|
|
console.log(this.status)
|
|
this.getUserOrder(this.status);
|
|
},
|
|
onPullDownRefresh() {
|
|
this.orderList = [];
|
|
this.pageNo = 1;
|
|
this.total = null;
|
|
this.isLock = true;
|
|
this.getUserOrder(this.status)
|
|
},
|
|
onReachBottom() {
|
|
if(this.isLock){
|
|
this.isLock = false;
|
|
if(this.total !== null && this.pageNo * this.pageSize >= this.total){
|
|
this.$Toast('没有更多数据了哦!');
|
|
setTimeout(()=>{
|
|
this.isLock = true;
|
|
},3000)
|
|
return
|
|
}
|
|
this.pageNo+=1;
|
|
this.getUserOrder(this.status);
|
|
}
|
|
},
|
|
computed: {
|
|
gridData () {
|
|
return this.$store.state.gridData
|
|
}
|
|
},
|
|
methods: {
|
|
// 打电话
|
|
call(phone) {
|
|
uni.makePhoneCall({
|
|
phoneNumber: phone,
|
|
success(res) {
|
|
|
|
},
|
|
fail(err) {
|
|
|
|
}
|
|
})
|
|
},
|
|
toGoodsInfo (item) {
|
|
let idx = this.gridData.findIndex(obj => obj.id === item.bottonId)
|
|
let key = idx > -1 ? this.gridData[idx].key : 'home'
|
|
|
|
this.$tools.navigateTo({
|
|
url: `/pagesC/goodsInfo/goodsInfo?id=${item.goodId}&type=${key}`
|
|
})
|
|
},
|
|
// 详情
|
|
toDetails(id) {
|
|
uni.navigateTo({
|
|
url: `./details/index?id=${id}&status=${this.status}`
|
|
})
|
|
},
|
|
// 获取订单数据
|
|
getUserOrder(type,pageSize) {
|
|
uni.showLoading();
|
|
const params = {
|
|
pageNo: this.pageNo,
|
|
pageSize: this.pageSize,
|
|
type
|
|
}
|
|
this.$api('getOrderList',params).then(res => {
|
|
let { code, result, message} = res;
|
|
if(code == 200) {
|
|
if(this.total == null) {
|
|
this.total = result.total;
|
|
}
|
|
// 处理 图片
|
|
result.records.forEach(item => {
|
|
item.orderDetailList.forEach(item2 =>{
|
|
item2.goodPic2 = item2.goodPic ==null ? '': item2.goodPic.split(',')[0]
|
|
})
|
|
})
|
|
this.orderList = [];
|
|
this.orderList = this.orderList.concat(result.records)
|
|
console.log(result);
|
|
}else {
|
|
this.$Toast(message);
|
|
}
|
|
uni.hideLoading()
|
|
uni.stopPullDownRefresh()
|
|
this.isLock = true;
|
|
}).catch(err => {
|
|
uni.hideLoading()
|
|
this.isLock = true;
|
|
uni.stopPullDownRefresh()
|
|
this.$Toast(err.message);
|
|
})
|
|
},
|
|
// 取消订单
|
|
close(id,index){
|
|
const that = this
|
|
uni.showModal({
|
|
title: "确定取消该订单吗?",
|
|
success(res) {
|
|
if(res.confirm) {
|
|
that.$api('deleteOrderById',{id}).then(res => {
|
|
let { code, result, message} = res;
|
|
if(code == 200) {
|
|
that.$Toast(result);
|
|
that.orderList.splice(index,1)
|
|
// 删除该条数据
|
|
}else {
|
|
that.$Toast(message);
|
|
}
|
|
}).catch(err => {
|
|
that.$Toast(err.message);
|
|
})
|
|
}else if(res.cancel){
|
|
// this.$Toast('您取消了')
|
|
}
|
|
}
|
|
})
|
|
},
|
|
// 立即支付
|
|
payMoney(id,index,item){
|
|
const that = this
|
|
var type = item.payFlag
|
|
if(this.orderList[index].name == '兑购订单') {
|
|
this.payMoneyTeamCreateOrderPay(id,item.payFlag,item.addressId);
|
|
}
|
|
if(this.orderList[index].name == '拼团订单') {
|
|
this.payMoneyTeamCreateOrderPay(id,item.payFlag,item.addressId);
|
|
}else {
|
|
const that = this
|
|
// 消费金支付
|
|
uni.showActionSheet({
|
|
itemList: ['微信支付', '消费金支付'],
|
|
success: function (res) {
|
|
if (res.tapIndex + 1 == 1) {
|
|
// 微信支付
|
|
that.ImmediatePayment(id,type,index)
|
|
}else {
|
|
that.ImmediatePayment(id,1,index)
|
|
}
|
|
},
|
|
fail: function (res) {
|
|
console.log(res.errMsg);
|
|
}
|
|
});
|
|
|
|
}
|
|
|
|
},
|
|
// 立即支付
|
|
ImmediatePayment(id,type,index) {
|
|
const that = this
|
|
that.$api('submitOrderById',{id,type}).then(res => {
|
|
let { code, result, message} = res;
|
|
if(code == 200) {
|
|
// that.$Toast(result); type = 3 为兑购
|
|
if(type==3) {
|
|
that.$Toast(result);
|
|
that.orderList.splice(index,1);
|
|
}else if(type == 1) {
|
|
this.$Toast(result);
|
|
that.orderList.splice(index,1);
|
|
} else{
|
|
uni.requestPayment({
|
|
provider: 'wxpay',
|
|
timeStamp: result.timeStamp,
|
|
nonceStr: result.nonceStr,
|
|
package: result.packageValue,
|
|
signType: result.signType,
|
|
paySign: result.paySign,
|
|
success: res => {
|
|
this.$Toast('支付成功');
|
|
that.orderList.splice(index,1);
|
|
},
|
|
fail:error=>{
|
|
this.$Toast('取消支付');
|
|
this.getUserOrder(this.status);
|
|
}
|
|
})
|
|
}
|
|
|
|
// 删除该条数据
|
|
}else {
|
|
that.$Toast(message);
|
|
}
|
|
}).catch(err => {
|
|
that.$Toast(err.message);
|
|
})
|
|
},
|
|
|
|
payMoneyTeamCreateOrderPay(id,type,addressId){
|
|
const that = this
|
|
that.$api('teamCreateOrderPay',{id,type,addressId}).then(res => {
|
|
let { code, result, message} = res;
|
|
if(code == 200) {
|
|
// that.$Toast(result);
|
|
if(type==3) {
|
|
that.$Toast(result);
|
|
that.orderList.splice(index,1);
|
|
}else{
|
|
uni.requestPayment({
|
|
provider: 'wxpay',
|
|
timeStamp: result.timeStamp,
|
|
nonceStr: result.nonceStr,
|
|
package: result.packageValue,
|
|
signType: result.signType,
|
|
paySign: result.paySign,
|
|
success: res => {
|
|
this.$Toast('支付成功');
|
|
that.orderList.splice(index,1);
|
|
},
|
|
fail:error=>{
|
|
this.$Toast('取消支付')
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}).catch(err => {
|
|
that.$Toast(err.message);
|
|
})
|
|
},
|
|
// 确认收货
|
|
toConfirmOrderById(id,index){
|
|
const that = this
|
|
uni.showModal({
|
|
title: "确定该商品收货吗?",
|
|
success(res) {
|
|
if(res.confirm) {
|
|
that.$api('confirmOrderById',{id}).then(res => {
|
|
let { code, result, message} = res;
|
|
if(code == 200) {
|
|
that.$Toast(result);
|
|
that.orderList.splice(index,1);
|
|
// 删除该条数据
|
|
}else {
|
|
that.$Toast(message);
|
|
}
|
|
}).catch(err => {
|
|
that.$Toast(err.message);
|
|
})
|
|
}else if(res.cancel){
|
|
// this.$Toast('您取消了')
|
|
}
|
|
}
|
|
})
|
|
},
|
|
// 申请售后
|
|
toAfterSales(id,index){
|
|
const that = this
|
|
this.$tools.navigateTo({
|
|
url: '/pagesA/my_other_list/after_sale_order/after_sale_order?id='+id
|
|
});
|
|
|
|
},
|
|
getInfo(e) {
|
|
this.status = e;
|
|
this.orderList = [];
|
|
this.pageNo = 1;
|
|
this.total = null;
|
|
this.isLock = true;
|
|
this.getUserOrder(this.status)
|
|
console.log("获取新数据",e)
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.empty_box{
|
|
width: 100%;
|
|
height: 80vh;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
image{
|
|
width: 371rpx;
|
|
height: 371rpx;
|
|
|
|
}
|
|
.text_{
|
|
margin-top: 10rpx;
|
|
font-size: 36rpx;
|
|
font-weight: bold;
|
|
color: #01AEEA;
|
|
}
|
|
}
|
|
.item {
|
|
width: 711rpx;
|
|
margin: 0 auto;
|
|
margin-top: 10rpx;
|
|
border-radius: 24rpx;
|
|
padding-bottom: 21rpx;
|
|
box-shadow: 0 3rpx 6rpx 0 rgba(0, 0, 0, 0.16);
|
|
|
|
.time{
|
|
width: 648rpx;
|
|
margin: 0 auto;
|
|
margin-top: 30rpx;
|
|
padding-top: 34rpx;
|
|
padding-bottom: 15rpx;
|
|
border-bottom: 1px solid rgba(112,112,112,0.2);
|
|
display: flex;
|
|
justify-content: space-between;
|
|
font-size: 36rpx;
|
|
.time_text {
|
|
color: #333;
|
|
}
|
|
.phone{
|
|
color: #333333;
|
|
}
|
|
}
|
|
.goods_item{
|
|
display: flex;
|
|
width: 648rpx;
|
|
margin: 0 auto;
|
|
margin-top: 22rpx;
|
|
padding-bottom: 26rpx;
|
|
border-bottom: 1px solid rgba(112,112,112,0.2);
|
|
&:last-child{
|
|
border-bottom: none;
|
|
}
|
|
image{
|
|
width: 200rpx;
|
|
height: 200rpx;
|
|
border-radius: 20rpx;
|
|
}
|
|
.right_box{
|
|
display: flex;
|
|
flex-direction: column;
|
|
font-size: 36rpx;
|
|
margin-left: 25rpx;
|
|
.title{
|
|
color: #000;
|
|
width: 440rpx;
|
|
font-size: 36rpx;
|
|
line-height: 39rpx;
|
|
}
|
|
.center_box{
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
color: #01AEEA;
|
|
font-size: 36rpx;
|
|
.money_box{
|
|
.red{
|
|
color: #DB0618;
|
|
}
|
|
.min{
|
|
font-size: 20rpx;
|
|
}
|
|
.bigs{
|
|
font-size: 36rpx;
|
|
}
|
|
}
|
|
.back_money{
|
|
color: #fff;
|
|
background-color: #FFA952;
|
|
border-radius: 15rpx;
|
|
height: 47rpx;
|
|
line-height: 47rpx;
|
|
box-sizing: border-box;
|
|
font-size: 36rpx;
|
|
padding-left: 15rpx;
|
|
padding-right: 15rpx;
|
|
}
|
|
.back_iconx{
|
|
font-size: 38rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.sum_back_momey{
|
|
height: 47rpx;
|
|
line-height: 47rpx;
|
|
border-radius: 10rpx;
|
|
padding: 6rpx 14rpx;
|
|
margin-right: 45rpx;
|
|
color: #fff;
|
|
background-color: #FFA952;
|
|
font-size: 36rpx;
|
|
}
|
|
.total_box{
|
|
display: flex;
|
|
width: 648rpx;
|
|
margin: 0 auto;
|
|
justify-content: flex-end;
|
|
font-size: 36rpx;
|
|
margin-top: 6rpx;
|
|
padding-bottom: 16rpx;
|
|
border-bottom: 1px solid rgba(112,112,112,0.2);
|
|
|
|
.text_price{
|
|
font-size: 34rpx;
|
|
}
|
|
.price{
|
|
font-size: 36rpx;
|
|
color: #DB0618;
|
|
}
|
|
text{
|
|
&:last-child{
|
|
}
|
|
}
|
|
}
|
|
.btn_box{
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
.order_name{
|
|
margin-left: 30rpx;
|
|
margin-top: 20rpx;
|
|
font-size: 36rpx;
|
|
width: 30%;
|
|
}
|
|
.btn_order{
|
|
width: 70%;
|
|
display: flex;
|
|
height: 100%;
|
|
}
|
|
.gather{
|
|
height: 60rpx;
|
|
margin-top: 23rpx;
|
|
margin-left: 0;
|
|
margin-right: 21rpx;
|
|
border: 1rpx solid #01AEEA;
|
|
color: #01AEEA;
|
|
font-size: 32rpx;
|
|
border-radius: 30rpx;
|
|
line-height: 60rpx;
|
|
}
|
|
.cancel{
|
|
border: 1rpx solid #6C6C6C;
|
|
font-size: 36rpx;
|
|
color: #6C6C6C;
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
</style>
|