nurseWeChatAppletUI/pages/payorderDetails/payorderDetails.vue

<template>
	<view class="app" v-if="order">
		<view class="time" style="" v-if="order.orderStatus=='WAIT_PAY'">
			剩余付款时间：
			<u-count-down style='' :timestamp="timestamp">
			</u-count-down>
		</view>
		<view class="OrderStatus" v-if="order.orderStatus=='REFUNDED'||order.orderStatus=='CANCEL'">
			订单已关闭
		</view>
		<!-- <custom-nav nav='To' Url="/pages/CommodityOrder/CommodityOrder" title='商品订单'></custom-nav> -->
		<view class="content">
			<view class="name">
				店铺名称
				<image src="../../static/huijiantou.png" mode=""></image>
			</view>
			<view class="details">
				<view class="detailslist">
					<image :src="baseurl+order.attributePitureUrl" mode=""></image>
					<view class="model">
						<view class="top">
							<span>{{order.goodsName}}</span>
							<span>￥{{order.goodsPrice}}</span>
						</view>
						<view class="bottom">
							<span class="box">型号：{{order.goodsAttributeName}}</span>
							<span class="box">X{{order.goodsCount}}</span>
						</view>
						<view class="bottom" v-if="order.discountPrice>0">
							<span class="box" style='width:40%'>优惠金额：</span>
							<span class="box">-￥{{order.discountPrice}}</span>
						</view>
						<view class="refund" @tap='gorefundType'
							v-if="order.orderStatus != 'WAIT_PAY'&& order.orderStatus!='CANCEL'&&order.orderStatus!='WAIT_REFUND'&&order.orderStatus!='REFUNDED'&&order.orderStatus!='RETURNED_GOODS'&&order.orderStatus!='WAIT_RETURNED_GOODS'">
							申请退款
						</view>
						<view class="refund" v-if="order.orderStatus=='WAIT_REFUND'" @tap='goAftersalesdetails(order)'>
							退款中
						</view>
						<view class="refund" v-if="order.orderStatus=='REFUNDED'">
							退款成功
						</view>
						<!-- <view class="refund" v-if="order.orderStatus=='RETURNED_GOODS'">
							退货中
						</view> -->
						<view class="refund" v-if="order.orderStatus=='WAIT_RETURNED_GOODS'">
							待退货
						</view>
						<view class="refund" v-if="order.orderStatus=='CANCEL'">
							已取消
						</view>
					</view>
				</view>
				<view class="payinfo">
					<text class="pay">实付款</text>
					<text class="price">￥{{order.totalPrice}}</text>
				</view>
			</view>
		</view>
		<view class="info" v-if="order.orderStatus != ' WAIT_PAY'&& order.orderStatus!='CANCEL'">
			<span>收货人：<text>{{order.receiver}}</text></span>
			<span>联系电话：<text>{{order.phone}}</text></span>
			<span>收货地址：<text>{{order.receiveAddress}}</text></span>
			<span>订单编号：<text>{{order.goOrderNo}}</text></span>
			<!-- <span>获得积分：<text>30点积分</text></span> -->
			<span>下单时间：<text>{{order.orderTime}}</text></span>
			<span v-if="order.orderStatus=='REFUNDED'">退款时间：<text>{{order.updateTime}}</text></span>
			<!-- <span>成交时间：<text>2022-10-28 11：31：26</text></span> -->
		</view>
		<view class="buy" v-if="order.orderStatus == 'WAIT_PAY'" @tap='pay'>
			<view class="pay">
				去支付
			</view>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import {
		appletGoodsOrderPay
	} from '@/api/confirmOrder/index.js'
	import {
		goodsOrder
	} from '@/api/CommodityOrder/index.js'
	import baseurl from '@/api/baseurl.js'
	export default {
		data() {
			return {
				baseurl: '',
				order: null,
				patientId: '',
				openid: null,
				orderStatus: '',
				pageSize: 10,
				pageNum: 1,
				timestamp: 0,
				goodsOrderId: null,
			}
		},
		methods: {
			//支付
			pay() {
				var that = this
				let paydata = this.order
				paydata.openid = this.openid
				paydata.payType = "WECHAT_PAY"
				paydata.paymentPrice = this.order.totalPrice
				paydata.orderChannel = 'WECHAT_APPLET'
				paydata.orderNo = this.order.goOrderNo
				appletGoodsOrderPay(paydata).then(response => {
					if (response.code == 200) {
						uni.requestPayment({
							timeStamp: response.data.timeStamp,
							nonceStr: response.data.nonceStr,
							package: response.data.prepayId,
							signType: response.data.signType,
							paySign: response.data.paySign,
							success: function(res) {
								that.$refs.uToast.show({
									title: '支付成功',
									type: 'success',
									duration: 1500,
									url: `/pages/paysuccess/paysuccess?delta=${3}`
								})
							},
							fail: function(err) {
								that.$refs.uToast.show({
									title: '取消支付',
									type: 'error',
									duration: 1500,
								})
							}
						});
					} else {
						that.$refs.uToast.show({
							title: response.msg,
							type: 'error',
							duration: 2000
						})
					}
				})
			},
			//退款页面
			gorefundType() {
				uni.navigateTo({
					url: `/pages/refundType/refundType?order=${JSON.stringify(this.order)}`
				})
			},
			goodsOrderinfo(goodsOrderId) {
				goodsOrder(this.patientId, this.orderStatus, goodsOrderId, this.pageSize, this.pageNum).then(res => {
					this.order = res.rows[0]
					var ordertimes = this.order.orderTime.replaceAll(/\-/gi, "/")
					var time = new Date(ordertimes).getTime() / 1000 + (60 * 60 * 24)
					var times = new Date().getTime() / 1000
					this.timestamp = time - times
				})
			},
			//跳转售后详情
			goAftersalesdetails(item) {
				uni.navigateTo({
					url: `/pages/Aftersalesdetails/Aftersalesdetails?goodsOrderId=${item.goodsOrderId}`
				})
			},
		},
		onLoad(options) {
			this.baseurl = baseurl
			this.goodsOrderId = options.goodsOrderId
			let that = this
			try {
				const value = uni.getStorageSync('patientId');
				if (value) {
					that.patientId = value
				}
			} catch (e) {}
			try {
				const value = uni.getStorageSync('openid');
				if (value) {
					that.openid = value
				} else {}
			} catch (e) {}
		},
		onShow() {
			this.goodsOrderinfo(this.goodsOrderId)
		},
		onUnload() {},
	}
</script>
<style lang="scss">
	@import '../orderDetails/orderDetails.scss'
</style>