components/orderListGoods/index.vue
..
..
@@ -9,8 +9,8 @@
9
9
             </view>
10
10
             <view class='text acea-row row-between'>
11
11
                 <view class="acea-row row-between-wrapper name_box">
12
-                    <view class='name line2'>{{ items.storeName }}</view>
13
-                    <view class="num">{{ items.sku }} x{{ items.cartNum }}</view>
12
+                    <view class='name line2'>{{ items.storeName || '' }}</view>
13
+                    <view class="num">{{ items.sku || '' }} x{{ toNumber(items.cartNum) }}</view>
14
14
                 </view>
15
15
                 <view class='info'></view>
16
16
                 <view class='money'>
..
..
@@ -34,8 +34,8 @@
34
34
                         <view class="gift-tag">赠品</view>
35
35
                     </view>
36
36
                     <view class='text' style="margin-left: 20rpx;">
37
-                        <view class='line1'>{{ gift.giftName }}</view>
38
-                        <view class='infor'>x{{ gift.giftNum }}</view>
37
+                        <view class='line1'>{{ gift.giftName || '' }}</view>
38
+                        <view class='infor'>x{{ toNumber(gift.giftNum) }}</view>
39
39
                     </view>
40
40
                 </view>
41
41
             </view>
 main.js
..
..
@@ -228,16 +228,21 @@
228
228
 Vue.mixin(pageLog);
229
229
 import BigNumber from 'bignumber.js';
230
230
 Vue.prototype.toNumber = function(number) {
231
-	if (isNaN(number)) {
232
-		return number;
233
-	} else {
234
-		return BigNumber(number).toNumber();
231
+	// null / undefined / 空值 / 非数字统一返回 0，避免页面显示 null、undefined、NaN
232
+	if (number === null || number === undefined || number === '' || isNaN(number)) {
233
+		return 0;
235
234
 	}
235
+	const result = BigNumber(number).toNumber();
236
+	return isNaN(result) ? 0 : result;
236
237
 }
237
238
 
238
239
 Vue.prototype.toThousands = function(num) {
239
-	if (num < 1000) return num;
240
-	if (Number.isInteger(num)) {
240
+	// null / undefined / 空值 / 非数字统一返回 0，避免页面显示 null、undefined、NaN
241
+	if (num === null || num === undefined || num === '' || isNaN(num)) {
242
+		return 0;
243
+	}
244
+	if (Number(num) < 1000) return num;
245
+	if (Number.isInteger(Number(num))) {
241
246
 		return String(num).replace(/(?!^)(?=(\d{3})+$)/g, ',')
242
247
 	} else {
243
248
 		return String(num).replace(/(?!^)(?=(\d{3})+\.)/g, ',')
 pages/users/order_list/index.vue
..
..
@@ -37,14 +37,14 @@
37
37
 						<view class='title acea-row row-between-wrapper'>
38
38
 							<view class="acea-row row-middle">
39
39
 								<text class="sign cart-color acea-row row-center-wrapper"
40
-									v-if="item.activityType !== '普通' && item.activityType !== '核销'">{{ item.activityType
41
-									}}</text>
40
+									v-if="item.activityType && item.activityType !== '普通' && item.activityType !== '核销'">{{
41
+										item.activityType }}</text>
42
42
 								<!-- <text class="sign cart-color acea-row row-center-wrapper" v-if="item.bargainId != 0">砍价</text>
43
43
 								<text class="sign cart-color acea-row row-center-wrapper" v-else-if="item.storeOrder.combinationId != 0">拼团</text>
44
44
 								<text class="sign cart-color acea-row row-center-wrapper" v-else-if="item.storeOrder.seckillId != 0">秒杀</text> -->
45
45
 								<view>{{ item.createTime }}</view>
46
46
 							</view>
47
-							<view class='font-color'>{{ item.orderStatus }}</view>
47
+							<view class='font-color'>{{ item.orderStatus || '' }}</view>
48
48
 							<!-- <view v-if="item.status?item.status.type == 0:0" class='font-color'>待付款</view>
49
49
 							<view v-else-if="item.status?item.status.type == 1:0 && item.storeOrder.shippingType==1" class='font-color'>待发货</view>
50
50
 							<view v-else-if="item.status?item.status.type == 2:0 && item.storeOrder.shippingType==1" class='font-color'>待收货</view>
..
..
@@ -54,8 +54,7 @@
54
54
 						</view>
55
55
 						<orderListGoods :orderInfoList="item.orderInfoList"
56
56
 							:zonePromotionList="item.zonePromotionList || []"></orderListGoods>
57
-						<view class='totalPrice'>共{{ item.totalNum + getGiftCount(item.zonePromotionList || [])
58
-							}}件商品，总金额
57
+						<view class='totalPrice'>共{{ getTotalNum(item) }}件商品，总金额
59
58
 							<text class='money font-color' v-if="getPayWay(item.payPrice, item.payCareBean) == 1">
60
59
 								<text class="color-blue">￥{{ toNumber(item.payPrice) }}</text>
61
60
 								<text class="color-blue">+{{ toThousands(toNumber(item.payCareBean)) }}悦养豆</text>
..
..
@@ -254,6 +253,9 @@
254
253
 			});
255
254
 			return count;
256
255
 		},
256
+		getTotalNum(item) {
257
+			return (Number(item.totalNum) || 0) + this.getGiftCount(item.zonePromotionList || []);
258
+		},
257
259
 		getPayWay(price, payCareBean) {
258
260
 			console.log('阿斯顿发送到发送地方', Number(price) > 0 && Number(payCareBean) > 0);
259
261
 			if (Number(price) > 0 && Number(payCareBean) > 0) {
..
..
@@ -312,7 +314,9 @@
312
314
 		getOrderData: function () {
313
315
 			let that = this;
314
316
 			orderData().then(res => {
315
-				that.$set(that, 'orderData', res.data);
317
+				that.$set(that, 'orderData', (res && res.data) || {});
318
+			}).catch(() => {
319
+				that.$set(that, 'orderData', {});
316
320
 			})
317
321
 		},
318
322
 		/**
..
..
@@ -447,7 +451,7 @@
447
451
 				page: that.page,
448
452
 				limit: that.limit,
449
453
 			}).then(res => {
450
-				let list = res.data.list || [];
454
+				let list = (res && res.data && res.data.list) || [];
451
455
 				let loadend = list.length < that.limit;
452
456
 				that.orderList = that.$util.SplitArray(list, that.orderList);
453
457
 				that.$set(that, 'orderList', that.orderList);
 pages/zone/index.vue
..
..
@@ -20,8 +20,9 @@
20
20
 		<view v-else>
21
21
 			<view class="expireTime" v-if="expireTime && expireTime.length">
22
22
 				<text>专区将在</text>
23
-				<text v-for="(val, index) in expireTime" :key="index">
24
-					<text class="num">{{ val }}</text>{{ expireTimeUnit[index] }}
23
+				<text v-for="(item, index) in expireTime" :key="index">
24
+					<text class="num"><text v-for="(char, ci) in item.digits" :key="ci"
25
+							class="digit">{{ char }}</text></text>{{ item.unit }}
25
26
 				</text>
26
27
 				<text>{{ startOrEnd }}</text>
27
28
 			</view>
..
..
@@ -588,7 +589,7 @@
588
589
 			showMenu: false,
589
590
 			selectedMenuArr: [],
590
591
 			expireTime: [],
591
-			expireTimeUnit: [],
592
+			countdownToken: 0,
592
593
 			isPageShow: false,
593
594
 			loginBackFn: null,
594
595
 			errText: '',
..
..
@@ -1295,6 +1296,9 @@
1295
1296
 			})
1296
1297
 		},
1297
1298
 		validAlert(data) {
1299
+			// 每次重新计算前作废旧的倒计时链，避免多条定时器同时刷新导致数字跳动
1300
+			this.countdownToken++
1301
+			const token = this.countdownToken
1298
1302
 			const {
1299
1303
 				startTime,
1300
1304
 				expireTime
..
..
@@ -1313,17 +1317,17 @@
1313
1317
 					let minutes = startTimetamp.getMinutes()
1314
1318
 					minutes = minutes < 10 ? '0' + minutes : minutes;
1315
1319
 
1316
-					this.countdownTimer(startTime.split('-').join('/'), 'start')
1320
+					this.countdownTimer(startTime.split('-').join('/'), 'start', token)
1317
1321
 					this.startOrEnd = "后开启"
1318
1322
 					return
1319
-				}
1320
-			}
1321
-			if (expireTime) {
1322
-				const expireTimetamp = new Date(expireTime.split('-').join('/')).getTime();
1323
-				if (expireTimetamp < nowTimestamp) {
1323
+					}
1324
+					}
1325
+					if (expireTime) {
1326
+					const expireTimetamp = new Date(expireTime.split('-').join('/')).getTime();
1327
+					if (expireTimetamp < nowTimestamp) {
1324
1328
 					return
1325
-				}
1326
-				this.countdownTimer(expireTime.split('-').join('/'), 'end')
1329
+					}
1330
+					this.countdownTimer(expireTime.split('-').join('/'), 'end', token)
1327
1331
 				this.startOrEnd = "后结束"
1328
1332
 			}
1329
1333
 		},
..
..
@@ -1461,7 +1465,7 @@
1461
1465
 						that.homeTop = that.getHomeTop(0.4)
1462
1466
 					}
1463
1467
 					that.expireTime = [];
1464
-					that.expireTimeUnit = [];
1468
+					that.countdownToken++;
1465
1469
 					that.where.page = 1;
1466
1470
 					that.getGoodList()
1467
1471
 					that.validAlert(res.data)
..
..
@@ -1487,8 +1491,9 @@
1487
1491
 				}
1488
1492
 			});
1489
1493
 		},
1490
-		countdownTimer(expireTime, type) {
1494
+		countdownTimer(expireTime, type, token) {
1491
1495
 			if (!expireTime) return
1496
+			if (token !== undefined && token !== this.countdownToken) return
1492
1497
 			let that = this;
1493
1498
 			// 结束时间的时间戳（需传入一个有效的日期对象或时间戳）
1494
1499
 			const endTimestamp = new Date(expireTime).getTime();
..
..
@@ -1500,56 +1505,56 @@
1500
1505
 			if (type == 'end') {
1501
1506
 				if (diff <= 0) {
1502
1507
 					this.expireTime = []
1503
-					this.expireTimeUnit = []
1504
1508
 					return
1505
1509
 				} else { }
1506
1510
 			} else if (type == 'start') {
1507
1511
 				if (diff <= 0) {
1508
1512
 					this.expireTime = []
1509
-					this.expireTimeUnit = []
1510
1513
 					const expireTime2 = that.info.expireTime
1511
1514
 					if (expireTime2) {
1512
1515
 						const expireTimetamp = new Date(expireTime2.split('-').join('/')).getTime();
1513
1516
 						if (expireTimetamp < nowTimestamp) {
1514
1517
 							return
1515
1518
 						}
1516
-						this.countdownTimer(expireTime2.split('-').join('/'), 'end')
1519
+						this.countdownTimer(expireTime2.split('-').join('/'), 'end', token)
1517
1520
 						this.startOrEnd = "后结束"
1518
1521
 					}
1519
1522
 					return
1520
1523
 				}
1521
1524
 			}
1525
+			const pad = num => (num < 10 ? '0' + num : String(num))
1522
1526
 			const res = []
1523
-			const unit = []
1524
1527
 			const days = Math.floor(diff / (1000 * 60 * 60 * 24))
1525
1528
 			diff %= (1000 * 60 * 60 * 24)
1526
-			if (days > 0) {
1527
-				res.push(days);
1528
-				unit.push('日')
1529
-			}
1530
1529
 			// 转换为小时、分钟、秒
1531
1530
 			const hours = Math.floor(diff / (1000 * 60 * 60));
1532
1531
 			diff %= (1000 * 60 * 60); // 剩余毫秒数
1533
-			if (hours > 0) {
1534
-				res.push(hours < 10 ? '0' + hours : hours);
1535
-				unit.push('时')
1536
-			}
1537
1532
 			const minutes = Math.floor(diff / (1000 * 60));
1538
-			if (minutes > 0) {
1539
-				res.push(minutes < 10 ? '0' + minutes : minutes);
1540
-				unit.push('分')
1541
-			}
1542
1533
 			diff %= (1000 * 60); // 剩余毫秒数
1543
1534
 			const seconds = Math.floor(diff / 1000);
1544
-			if (seconds > 0) {
1545
-				res.push(seconds < 10 ? '0' + seconds : seconds);
1546
-				unit.push('秒')
1535
+			// 天数为 0 时不展示，时/分/秒始终展示（补 0），保证倒计时长度稳定
1536
+			if (days > 0) {
1537
+				res.push({
1538
+					digits: pad(days).split(''),
1539
+					unit: '日'
1540
+				})
1547
1541
 			}
1542
+			res.push({
1543
+				digits: pad(hours).split(''),
1544
+				unit: '时'
1545
+			})
1546
+			res.push({
1547
+				digits: pad(minutes).split(''),
1548
+				unit: '分'
1549
+			})
1550
+			res.push({
1551
+				digits: pad(seconds).split(''),
1552
+				unit: '秒'
1553
+			})
1548
1554
 			this.expireTime = res
1549
-			this.expireTimeUnit = unit
1550
1555
 			if (this.isPageShow) {
1551
1556
 				setTimeout(() => {
1552
-					that.countdownTimer(expireTime, type)
1557
+					that.countdownTimer(expireTime, type, token)
1553
1558
 				}, 1000)
1554
1559
 			}
1555
1560
 		},
..
..
@@ -2082,11 +2087,22 @@
2082
2087
 	padding: 15rpx;
2083
2088
 	padding-left: 30rpx;
2084
2089
 	color: #979797;
2090
+	font-size: 26rpx;
2085
2091
 
2086
2092
 	.num {
2093
+		display: inline-block;
2087
2094
 		color: #000000;
2088
2095
 		background: #FFE20E;
2089
-		padding: 0 10rpx;
2096
+		padding: 0 6rpx;
2097
+		margin: 0 4rpx;
2098
+		vertical-align: middle;
2099
+	}
2100
+
2101
+	/* 每个数字固定宽度，避免倒计时跳动时宽度忽长忽短 */
2102
+	.digit {
2103
+		display: inline-block;
2104
+		width: 19rpx;
2105
+		text-align: center;
2090
2106
 	}
2091
2107
 }
2092
2108
 </style>