NurseStationApp/pages/CommodityOrder/CommodityOrder.vue

<template>
	<view class="app">
		<view class="inputs">
			<i class="icon"></i>
			<input v-model="goodsName" type="text" name="" id="" class="input" placeholder="请输入商品名称">
		</view>
		<view class="" v-if="total>0">
			<view class="Apayment" v-for='(item,index) in orderlist' :key="index">
				<view class="names">店铺名称
					<image class="picture" src="/static/pic.png" mode=""></image>
					<span v-if="item.orderStatus=='WAIT_PAY'">待付款</span>
					<span v-if="item.orderStatus=='WAIT_PAY'&&item.timestamp<=0">订单已关闭</span>
					<span v-if="item.orderStatus=='WAIT_REFUND'">退款中</span>
					<span v-if="item.orderStatus=='CANCEL'">已取消</span>
					<span v-if="item.orderStatus=='WAIT_RECEIVED_GOODS'">待收货</span>
					<span v-if="item.orderStatus=='RECEIVED_GOODS'">待评价</span>
					<span v-if="item.orderStatus=='EVALUATED'">已完成</span>
					<span v-if="item.orderStatus=='PAY'">待发货</span>
					<span v-if="item.orderStatus=='REFUNDED'">退款成功</span>
					<span v-if="item.orderStatus=='WAIT_RETURNED_GOODS'">待退货</span>
					<span v-if="item.orderStatus=='RETURNED_GOODS'">退款成功</span>
				</view>
				<view class="details" @tap='goorderdetails(item)'>
					<view class="detailslist">
						<image :src="baseurl+item.attributePitureUrl" mode=""></image>
						<view class="model">
							<view class="top">
								<span>{{item.goodsName}}</span>
								<span>￥{{item.goodsPrice}}</span>
							</view>
							<view class="bottom">
								<span class="box">型号：{{item.goodsAttributeName}}</span>
								<span class="box">×{{item.goodsCount}}</span>
							</view>
							<view class="refund">
								实付款：
								<text class="price">￥{{item.totalPrice}}</text>
							</view>
						</view>
					</view>
				</view>
				<view class="anniu">
					<view class="logistics" v-if="item.orderStatus=='WAIT_RECEIVED_GOODS'" @tap='gologistics(item)'>查看物流
					</view>
					<view class="logistics harvest" v-if="item.orderStatus=='WAIT_PAY'&&item.timestamp>0"
						@tap='buy(item)'>
						去支付</view>
					<view class="logistics harvest" @tap='Receipt(item)' v-if="item.orderStatus=='WAIT_RECEIVED_GOODS'">
						确认收货</view>
					<view class="logistics harvest" @tap='rate(item)' v-if="item.orderStatus=='RECEIVED_GOODS'">
						立即评价</view>
				</view>
			</view>
		</view>
		<view class="noorder" v-else>
			<image src="../../static/noorder.png" mode=""></image>
			<view class="">
				暂无商品订单
			</view>
		</view>
		<!-- 弹框 -->
		<view class="frame">
			<u-popup v-model="show" mode="bottom" length="45%" border-radius="30">
				<view class="payment">
					<span>确认收到货了吗</span>
					<image src="../../static/gb.png" mode="" @tap="show = false"></image>
				</view>
				<view class="chat">
					<view class="image">
						<image :src="baseurl+img" mode=""></image>
						<view class="blackground">共1件</view>
					</view>
					<view class="word">为了保证你的售后权益，请收到商品确认无误后再确认收货</view>
				</view>
				<view class="submits" @tap='Receipts'>确定</view>
			</u-popup>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import {
		ssgoodsOrder,
		confirmReceipt
	} from '@/api/CommodityOrder/index.js'
	import baseurl from '@/api/baseurl.js'
	export default {
		data() {
			return {
				orderNoitem: '',
				title: '商品订单', //导航标题
				baseurl: '', //url
				orderlist: [], //商品订单list
				total: 0, //list长度
				show: false, //确认收获开关
				img: '', //确认收货页面图片
				patientId: '',
				orderStatus: '', //
				goodsOrderId: '', //
				pageSize: 10, //
				pageNum: 1, //
				goodsName: '',
			}
		},
		methods: {
			//评价
			rate(item) {
				uni.navigateTo({
					url: `/pages/goodsorderRate/goodsorderRate?item=${JSON.stringify(item)}`
				})
			},
			//收货
			Receipts() {
				confirmReceipt(this.orderNoitem.goOrderNo).then(res => {
					if (res.code == 200) {
						this.$refs.uToast.show({
							title: '收货成功',
							type: 'success',
							duration: '1000'
						})
						this.show = false
						setTimeout(e => {
							uni.navigateTo({
								url: `/pages/goodsorderRate/goodsorderRate?item=${JSON.stringify(this.orderNoitem)}`
							})
							// uni.navigateTo({
							// 	url: `/pages/orderDetails/orderDetails?goodsOrderId=${this.orderNoitem.goodsOrderId}`
							// })
						}, 1000)
					} else {}
				})
			},
			//支付
			buy(item) {
				let obj = {
					patientId: this.patientId,
					orderNo: item.goOrderNo,
					orderChannel: "WECHAT_APPLET",
					paymentPrice: item.totalPrice,
					payType: "WECHAT_PAY",
					buySource: item.buySource,
				}
				console.log(obj)
			},
			//物流页面
			gologistics(item) {
				uni.navigateTo({
					url: `/pages/logistics/logistics?item=${JSON.stringify(item)}`
				})
			},
			//订单详情页面
			goorderdetails(item) {
				uni.navigateTo({
					url: `/pages/orderDetails/orderDetails?goodsOrderId=${item.goodsOrderId}`
				})
			},
			//商品订单请求
			goodsOrderinfo() {
				ssgoodsOrder(this.patientId, this.orderStatus, this.goodsOrderId, this.pageSize, this.pageNum, this
					.goodsName).then(
					res => {
						this.orderlist = res.rows
						this.total = res.total
						this.orderlist.forEach(e => {
							e.timestamp = null
							var time = new Date(e.orderTime).getTime() / 1000 + (60 * 60 * 24)
							var times = new Date().getTime() / 1000
							e.timestamp = time - times
						})
					})
			},
			//确认收货
			Receipt(item) {
				this.orderNoitem = item
				this.img = item.attributePitureUrl
				this.show = true
			},
		},
		watch: { //监听
			goodsName() {
				this.goodsOrderinfo()
			},
		},
		onReady() { //更改导航栏文字
			uni.setNavigationBarTitle({
				title: this.title,
			});
		},
		onLoad(options) { //开局调用
			let that = this
			try {
				const value = uni.getStorageSync('patientId');
				if (value) {
					that.patientId = value
					that.goodsOrderinfo();
				}
			} catch (e) {}
			this.baseurl = baseurl;
			if (options.orderStatus) {
				this.orderStatus = options.orderStatus
				if (options.orderStatus == 'WAIT_PAY') {
					this.title = '待付款'
				} else if (options.orderStatus == 'WAIT_RECEIVED_GOODS') {
					this.title = '待收货'
				} else if (options.orderStatus == 'RECEIVED_GOODS') {
					this.title = '已完成'
				}
			}
		},
		onReachBottom() { //下滑加载
			if (this.orderlist.length >= this.total) {} else {
				this.pageNum++;
				ssgoodsOrder(this.patientId, this.orderStatus, this.goodsOrderId, this.pageSize, this.pageNum, this
					.goodsName).then(
					res => {
						res.rows.forEach(e => {
							e.timestamp = null
							var time = new Date(e.orderTime).getTime() / 1000 + (60 * 60 * 24)
							var times = new Date().getTime() / 1000
							e.timestamp = time - times
							this.orderlist.push(e)
						})
						this.total = res.total
					})
			}
		},
		onPullDownRefresh() { //下拉刷新
			this.pageNum = 1;
			this.goodsOrderinfo();
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 1000);
		},
	}
</script>

<style lang="scss">
	@import "./CommodityOrder.scss";
</style>