order.vue 10.9 KB
Newer Older
zhangpeng committed
1
<template>
张成 committed
2
	<view class="pages">
weijiguang committed
3 4
		<view v-show="false">{{userms}}</view>
		<view class="empty" v-show="userms && empty == true">
1  
宋冰琦 committed
5
			<view :style="{'text-align':'center'}">
6
				<image class="empty_icon" src="/static/imgs/wudingdanzhanweitu.png"></image>
1  
宋冰琦 committed
7 8
			</view>
			<view  class="empty_text">——您还未下单,下单品尝一下吧——</view>
9
			<button class="empty_button" @click="goHome">去品尝</button>
weijiguang committed
10
		</view>
11
		<view class="empty_notdl" v-show="!userms">
1  
宋冰琦 committed
12
			<view :style="{'text-align':'center'}">
13
				<image class="empty_icon" src="/static/imgs/weidengluzhanweitu.png"></image>
1  
宋冰琦 committed
14 15
			</view>
			<view  class="empty_text">——您还未登录,请先登录——</view>
songbingqi committed
16
			<button class="empty_button" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">去登录</button>
weijiguang committed
17
		</view>
songbingqi committed
18
		<view class="orders" :style="{'padding-bottom':orderBottom+'rpx'}">
张成 committed
19 20 21
			<view class="order_item" v-for="item in list" :key="item.id" @click="openInfo(item)">
				<view class="order_header">
					<view>
weijiguang committed
22 23
						<view class="order_adrass">{{ item.shop.name }}</view>
						<view class="order_time">{{ item.createdAt }}</view>
张成 committed
24
					</view>
25 26 27 28
					<view class="order_status">
						<text>{{ getStateText(item.state) }}</text>
						<image class="xiaojiantou" src="@/static/imgs/xiaojiantou.png"/>
					</view>
张成 committed
29
				</view>
张成 committed
30
				<div class="order_content">
31
					<view class="order_content_box1">
weijiguang committed
32 33
						<view class="goods_item" v-for="(good,index) in item.orderDetails" :key="good.id">
							<image class="goods_img" v-if="jsonParse(good.goods.pics).thumbnailApplet" :src="jsonParse(good.goods.pics).thumbnailApplet"></image>
张成 committed
34 35 36
							<image v-else class="goods_img" :src="jsonParse(good.goods.pics).thumbnail"></image>

							<view class="goods_text">
37
								<view class="goods_title">{{ good.goodsName }}</view>
张成 committed
38
								<view class="goods_spce">
39 40 41 42 43 44 45 46 47
									<view>
										<span v-for="(rule, index) in jsonParse(good.specRuleDetail)" :key="rule.specId">
											{{ rule.ruleName }}
											<span v-if="index!=jsonParse(good.specRuleDetail).length-1">/</span>
										</span>
									</view>
									<view>
										×{{ good.num }}
									</view>
张成 committed
48
								</view>
张成 committed
49
							</view>
weijiguang committed
50 51 52 53
							<view v-if="index==item.orderDetails.length-1 && (item.state == 2 || item.state == 3 || item.state == 4 || item.state == 5)" class="qr_code">
								<image class="qr_code_img" src="/static/imgs/icon-barcode.png"></image>
								<view class="qr_text">点击二维码取单</view>
							</view>
张成 committed
54 55
						</view>
					</view>
张成 committed
56
				</div>
张成 committed
57 58
				<view class="order_footer">
					<view class="total">
weijiguang committed
59
{{ orderDetailsSize(item.orderDetails) }}件商品 实付<text class="price">{{ Utils.isInteger(item.amount) }}</text>
张成 committed
60
					</view>
weijiguang committed
61
					<a class="btn" @click.stop="PayNow(item)" v-if="item.state == 1" type="primary">立即支付</a>
张成 committed
62
					<a class="btn" v-else @click.stop="oneMoreOrder(item)" type="primary">再来一单</a>
张成 committed
63 64 65
				</view>
			</view>
		</view>
66
		<show-toast ref="toast"/>
songbingqi committed
67
		<taBar select="1"></taBar>
zhangpeng committed
68 69 70 71
	</view>
</template>

<script>
张成 committed
72
import order from '@/request/order'
张成 committed
73 74
import Menu from '@/request/menu';
import Utils from '@/utils/utils'
weijiguang committed
75
import User from '@/request/user'
张成 committed
76 77
import { $EventBus } from "@/utils/EventBus";

张成 committed
78
export default {
79 80 81 82 83 84 85
	onLoad() {
		if(!this.userms){
			User.wxLoginAndGetOpenid(true).then(loginInfo=>{
				this.loginInfo = loginInfo
			})
		}
	},
张成 committed
86 87 88
	name: 'order',
	data() {
		return {
weijiguang committed
89
			empty: false,
90
			list: [],
songbingqi committed
91
			loginInfo:"",
songbingqi committed
92 93
			Utils,
			orderBottom:0
张成 committed
94 95
		}
	},
张成 committed
96
	onShow() {
97 98
		console.log(1)
		this.getList()
张成 committed
99
	},
songbingqi committed
100 101
	mounted() {
		this.orderBottom = uni.getStorageSync('orderBottom')
102
		// this.getList()
songbingqi committed
103
	},	
张成 committed
104 105 106
	computed: {
		userms() {
			return this.$store.getters.Authorization;
weijiguang committed
107
		}
张成 committed
108 109
	},
	methods: {
weijiguang committed
110 111 112 113
		getStateText(state) {
			state = '' + state;
			switch (state) {
				case '1':
weijiguang committed
114
					return '待付款'
weijiguang committed
115 116 117 118 119 120 121 122 123
				case '2':
					return '待制作'
				case '3':
					return '制作中'
				case '4':
					return '待取餐'
				case '5':
					return '取餐中'
				case '6':
1  
weijiguang committed
124
				case '7':
weijiguang committed
125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142
					return '已完成'
				case '8':
				case '9':
				case '10':
				case '11':
					return '已取消'
				case '12':
					return '退款中'
				case '13':
					return '退款失败'
				case '14':
					return '部分退款'
				case '15':
					return '已退款'
				default:
					return '未知状态'
			}
		},
张成 committed
143
		async oneMoreOrder(item) {
144
			// 清空购物车
张成 committed
145 146
			uni.removeStorageSync('shopCarInfo');
			$EventBus.$emit('updateCar');
147
			//
张成 committed
148 149 150
			const numObj = {}
			const { id, shopId, orderDetails } = item;
			orderDetails.forEach(item => {
151
				orderDetails[item.skuId] = Number(item.num)
张成 committed
152 153
			})
			const { data } = await order.moreOrder({ orderId: id, shopId });
154
			if(!data || !data.data){
155
				this.showToast({ title: "该订单中的商品已经售罄了" });
156 157 158 159
				return;
			}
			
			let list = new Array();
张成 committed
160 161 162 163
			data.data.forEach(item => {
				const skuId = item.skus[0].skuId
				const nextData = { ...item, skuId, num: orderDetails[skuId], flag: true, sku: item.skus[0] }
				if (nextData.sku.state == 1) {
164
					list.push(nextData);
张成 committed
165 166
				}
			});
167
			if(!list || list.length<=0) {
168
				this.showToast({ title: "该订单中的商品已经售罄了", icon: 'error' });
169 170 171 172 173 174
				return;
			}
			list.forEach(nextData => {
				Utils.getallNum(nextData);
			})
			uni.switchTab({ url: '/pages/menu/menu' });
张成 committed
175 176 177 178 179
		},
		async getList() {
			if (!this.userms) return
			const { data } = await order.getMyOrder();
			if (data) {
weijiguang committed
180 181 182 183 184 185
				this.list = data.rows;
				if(this.list && this.list.length>0) {
					this.empty = false;
				} else {
					this.empty = true;
				}
张成 committed
186
			} else {
187
				this.showToast({ title: '请登录!', icon: 'error' })
张成 committed
188 189 190 191
			}
		},
		async PayNow({ id }) {
			const orderInfo = await order.payOrder({ orderId: id })
192 193 194 195
			const sendData = {
				orderId:id,
				...orderInfo.data.data
			}
张成 committed
196 197
			if (orderInfo) {
				if (orderInfo && orderInfo.data.code == 200) {
198
					await Menu.requestPayment(sendData);
张成 committed
199 200 201 202
					this.getList()
				}
			}
		},
weijiguang committed
203 204 205 206 207 208
		goHome() {
			uni.switchTab({ url: '/pages/menu/menu' });
		},
		// 手机号授权登录
		getPhoneNumber(e) {
			if (e.detail.errMsg == 'getPhoneNumber:ok') {
209
				e.loginInfo = this.loginInfo
weijiguang committed
210 211
				User.getPhoneNumber(e, this.getList);
			} else if (e.detail.errMsg == "getPhoneNumber:fail user deny") {
212
				this.showToast({ title: '已拒绝手机号授权', icon: 'error' })
weijiguang committed
213 214
			}
		},
张成 committed
215
		openInfo(data) {
216 217
			const { id } = data
			uni.setStorageSync('orderId', id);
张成 committed
218 219
			let url = '/orderSubPackage/pages/orderInfo/index'
			uni.navigateTo({ url })
zhangpeng committed
220
		},
张成 committed
221
		jsonParse(json) {
张成 committed
222 223 224 225 226 227 228 229 230 231
			const data = json || {}
			return JSON.parse(data)
		},
		orderDetailsSize(orderDetails) {
			let size = 0;
			orderDetails.forEach(item => {
				const { num } = item;
				size += Number(num)
			});
			return size
zhangpeng committed
232
		}
张成 committed
233 234


zhangpeng committed
235
	}
张成 committed
236
}
zhangpeng committed
237 238
</script>

张成 committed
239
<style lang="scss" scoped>
weijiguang committed
240 241 242 243 244 245
.empty {
	 position: fixed;
	 /* 居中对齐begin */
	 left: 50%;
	 /* 兼容老版本的方法 */
	 -webkit-transform: translateX(-50%);
1  
宋冰琦 committed
246 247
	 transform: translate(-50%);
	 margin-top: 311rpx;
weijiguang committed
248 249
	
	.empty_icon {
宋冰琦 committed
250 251
		 width: 324rpx;
		 height: 236rpx;
252 253 254
		 
	}
	.empty_text {
weijiguang committed
255
		width: 500rpx;
256

songbingqi committed
257
		margin-top: 32.73rpx;
258 259 260 261 262 263 264 265
		text-align: center;

		font-size: 24rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #999999;
	}
	.empty_button {
songbingqi committed
266
		margin-top: 34.29rpx;
267 268 269 270 271
		width: 167rpx;
		height: 64rpx;
		border-radius: 2rpx;
		font-size: 24rpx;
		font-family: PingFangSC-Regular, PingFang SC;
宋冰琦 committed
272
		background: #0050F6;
273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288
		font-weight: 400;
		color: #FFFFFF;
		line-height: 64rpx;
	}
	.empty_button::after{
		border-radius: 2rpx;
		border: 0rpx;
	}
}
.empty_notdl{
	 position: fixed;
	 /* 居中对齐begin */
	 left: 50%;
	 /* 兼容老版本的方法 */
	 -webkit-transform: translateX(-50%);
	 transform: translate(-50%);
weijiguang committed
289 290
	 margin-top: 352rpx;
	.empty_icon {
宋冰琦 committed
291 292
		 width: 324rpx;
		 height: 236rpx;
weijiguang committed
293 294
	}
	.empty_text {
weijiguang committed
295
		margin-top: 32rpx;
weijiguang committed
296
		text-align: center;
1  
宋冰琦 committed
297 298 299 300 301

		font-size: 24rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #999999;
weijiguang committed
302 303
	}
	.empty_button {
weijiguang committed
304
		margin-top: 36rpx;
1  
宋冰琦 committed
305 306
		width: 167rpx;
		height: 64rpx;
307 308 309
		border-radius: 2rpx;
		font-size: 24rpx;
		font-family: PingFangSC-Regular, PingFang SC;
宋冰琦 committed
310
		background: #0050F6;
311 312 313
		font-weight: 400;
		color: #FFFFFF;
		line-height: 64rpx;
1  
宋冰琦 committed
314 315
	}
	.empty_button::after{
316
		border-radius: 2rpx;
songbingqi committed
317
		border: 0rpx;
weijiguang committed
318 319 320
	}
}

张成 committed
321 322 323 324 325 326
.orders {
	padding: 1rpx;

	.order_item {
		width: 686rpx;
		background: #FFFFFF;
weijiguang committed
327
		margin: 32rpx auto 0;
张成 committed
328
		box-sizing: border-box;
weijiguang committed
329
		padding: 25rpx 30rpx 30rpx 30rpx;
张成 committed
330 331 332 333 334 335 336 337 338

		.order_header {
			display: flex;
			justify-content: space-between;

			.order_adrass {
				font-size: 28rpx;
				font-family: PingFangSC-Medium, PingFang SC;
				font-weight: 500;
339
				color: #333333;
weijiguang committed
340
				line-height: 40rpx;
张成 committed
341 342 343
			}

			.order_time {
344
				font-size: 24rpx;
张成 committed
345
				font-family: ArialMT;
weijiguang committed
346 347
				margin-top: 4rpx;
				line-height: 28rpx;
348
				color: #999999;
张成 committed
349 350 351 352 353
			}

			.order_status {
				font-size: 24rpx;
				font-family: PingFangSC-Regular, PingFang SC;
354 355 356 357 358
				font-weight: 400;
				color: #999999;
				display: flex;
				align-items: baseline;
				justify-content: flex-start;
weijiguang committed
359
				line-height: 34rpx;
360 361 362 363 364
				.xiaojiantou {
					width: 12rpx;
					height: 16rpx;
					margin-left: 5rpx;
				}
张成 committed
365 366 367 368 369
			}

		}

		.order_content {
张成 committed
370 371 372 373
			display: flex;
			justify-content: space-between;
			align-items: center;

374 375 376
			.order_content_box1{
				flex: 1;
			}
张成 committed
377

张成 committed
378
			.goods_item {
weijiguang committed
379
				margin-top: 42rpx;
张成 committed
380
				display: flex;
weijiguang committed
381 382 383 384 385 386 387 388 389 390 391 392
				// align-items: center;

				.qr_code {
					text-align: center;
					margin-right: 10rpx;
					margin-left: 38rpx;

					.qr_code_img {
						vertical-align: bottom;
						width: 76rpx;
						height: 76rpx;
					}
张成 committed
393

weijiguang committed
394 395 396 397 398 399 400 401 402
					.qr_text {
						line-height: 28rpx;
						margin-top: 10rpx;
						font-size: 20rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #999999;
					}
				}
张成 committed
403 404

				.goods_img {
405 406
					height: 96rpx;
					width: 96rpx;
张成 committed
407 408 409 410
					background-color: #eee;
				}

				.goods_text {
411 412
					margin-left: 22rpx;
					flex: 1;
张成 committed
413 414 415

					.goods_title {
						font-size: 28rpx;
416 417 418
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #666666;
weijiguang committed
419 420
						margin-top: 10rpx;
						line-height: 40rpx;
张成 committed
421 422 423
					}

					.goods_spce {
weijiguang committed
424
						margin-top: 2rpx;
张成 committed
425 426 427
						font-size: 24rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
weijiguang committed
428
						line-height: 34rpx;
429 430 431 432
						color: #999999;
						display: flex;
						justify-content: space-between;
						align-items: center;
张成 committed
433 434 435 436 437 438 439 440 441
					}
				}
			}
		}

		.order_footer {
			display: flex;
			align-items: center;
			justify-content: space-between;
weijiguang committed
442
			margin-top: 40rpx;
张成 committed
443 444

			.total {
445
				font-size: 28rpx;
张成 committed
446 447 448 449 450
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #666666;

				.price {
451 452 453 454 455
					font-size: 28rpx;
					font-family: Futura-Medium, Futura;
					font-weight: 500;
					color: #666666;
					letter-spacing: 1rpx;
张成 committed
456 457 458 459
				}
			}

			.btn {
460 461 462 463
				width: 167rpx;
				height: 64rpx;
				line-height: 64rpx;
				font-family: PingFangSC-Regular, PingFang SC;
宋冰琦 committed
464
				background: #0050F6;
张成 committed
465 466 467
				font-size: 24rpx;
				margin: 0;
				color: #fff;
468
				font-weight: 400;
张成 committed
469 470 471 472
				text-align: center;
			}
		}
	}
zhangpeng committed
473

张成 committed
474 475
}
</style>