fix: - 修复 范围选择不能动态赋值的 bug

- 修复 范围选择的初始时间在一个月内时，造成无法选择的bug

Author: Fasttian

pages/nvue/datetime-picker/datetime-picker.nvue

@@ -31,8 +31,7 @@
 		</view>
 		<uni-section :title="'日期范围用法：' + '[' + range + ']'" type="line"></uni-section>
 		<view class="example-body">
-			<uni-datetime-picker v-model="range" type="daterange" start="2021-3-20" end="2021-5-20"
-				rangeSeparator="至" />
+			<uni-datetime-picker v-model="range" type="daterange" rangeSeparator="至" />
 		</view>
 		<uni-section :title="'日期时间范围用法：' + '[' + datetimerange + ']' " type="line"></uni-section>
 		<view class="example-body">
@@ -47,8 +46,8 @@
 			return {
 				single: '2021-04-3',
 				datetimesingle: '2021-04-3',
-				range: ['2021-03-8', '2021-4-20'],
-				datetimerange: ['2021-03-20 20:10:10', '2021-05-10 10:10:10'],
+				range: ['2021-02-1', '2021-2-28'],
+				datetimerange: [],
 			}
 		},
 
@@ -67,6 +66,7 @@
 			setTimeout(() => {
 				this.datetimesingle = '2021-5-1'
 				this.single = '2021-5-1'
+				this.datetimerange = ["2021-07-08 0:00:00", "2021-08-08 23:59:59"]
 			},1000)
 		},
 

pages/vue/datetime-picker/datetime-picker.vue

@@ -31,8 +31,7 @@
 		</view>
 		<uni-section :title="'日期范围用法：' + '[' + range + ']'" type="line"></uni-section>
 		<view class="example-body">
-			<uni-datetime-picker v-model="range" type="daterange" start="2021-3-20" end="2021-5-20"
-				rangeSeparator="至" />
+			<uni-datetime-picker v-model="range" type="daterange" rangeSeparator="至" />
 		</view>
 		<uni-section :title="'日期时间范围用法：' + '[' + datetimerange + ']' " type="line"></uni-section>
 		<view class="example-body">
@@ -47,8 +46,8 @@
 			return {
 				single: '2021-04-3',
 				datetimesingle: '2021-04-3',
-				range: ['2021-03-8', '2021-4-20'],
-				datetimerange: ['2021-03-20 20:10:10', '2021-05-10 10:10:10'],
+				range: ['2021-02-1', '2021-2-28'],
+				datetimerange: [],
 			}
 		},
 
@@ -67,6 +66,7 @@
 			setTimeout(() => {
 				this.datetimesingle = '2021-5-1'
 				this.single = '2021-5-1'
+				this.datetimerange = ["2021-07-08 0:00:00", "2021-08-08 23:59:59"]
 			},1000)
 		},
 

uni_modules/uni-datetime-picker/changelog.md

@@ -1,3 +1,7 @@
+## 2.0.13（2021-07-08）
+- 修复 范围选择不能动态赋值的 bug
+## 2.0.12（2021-07-08）
+- 修复 范围选择的初始时间在一个月内时，造成无法选择的bug
 ## 2.0.11（2021-07-08）
 - 优化 弹出层在超出视窗边缘定位不准确的问题
 ## 2.0.10（2021-07-08）

uni_modules/uni-datetime-picker/components/uni-datetime-picker/uni-datetime-picker.vue

@@ -247,13 +247,26 @@
 							this.time = defTime
 						}
 					} else {
-						if (oldVal) return // 只初始默认值
+						// if (oldVal) return // 只初始默认值
 						const [before, after] = newVal
 						if (!before && !after) return
 						const defBefore = this.parseDate(before)
-						const defAfter = this.parseDate(after)
-						this.range.startDate = this.tempRange.startDate = defBefore.defDate
-						this.range.endDate = this.tempRange.endDate = defAfter.defDate
+						const defAfter = this.parseDate(after)
+						const startDate = defBefore.defDate
+						const endDate = defAfter.defDate
+						this.range.startDate = this.tempRange.startDate = startDate
+						this.range.endDate = this.tempRange.endDate = endDate
+
+						setTimeout(() => {
+							if(startDate && endDate){
+								if (this.diffDate(startDate, endDate) < 30){
+									this.$refs.right.next()
+								}
+							} else {
+								this.$refs.right.next()
+								this.$refs.right.cale.lastHover = false
+							}
+						}, 100)
 
 						if (this.hasTime) {
 							this.range.startDate = defBefore.defDate + ' ' + defBefore.defTime
@@ -332,18 +345,8 @@
 				// todo
 				return this.isRange ? 653 : 301
 			}
-		},
-		mounted() {
-			if (this.isRange) {
-				if (!Array.isArray(this.value)) return
-				const [before, after] = this.value
-				if (before && after) return
-				setTimeout(() => {
-					this.$refs.right.next()
-					this.$refs.right.cale.lastHover = false
-				}, 20)
-			}
-		},
+		},
+		
 		methods: {
 			updateLeftCale(e) {
 				// console.log('----updateStartCale:', e);
@@ -359,9 +362,7 @@
 				right.cale.setHoverMultiple(e.after)
 				right.setDate(this.$refs.right.nowDate.fullDate)
 			},
-			getRef() {
-				this.$refs.left.pre()
-			},
+
 			show(event) {
 				if (this.disabled) {
 					return
@@ -546,6 +547,18 @@
 				} else {
 					return false
 				}
+			},
+
+			/**
+			 * 比较时间差
+			 */
+			diffDate(startDate, endDate) {
+				// 计算截止时间
+				startDate = new Date(startDate.replace('-', '/').replace('-', '/'))
+				// 计算详细项的截止时间
+				endDate = new Date(endDate.replace('-', '/').replace('-', '/'))
+				const diff = (endDate - startDate) / (24 * 60 * 60 * 1000)
+				return Math.abs(diff)
 			},
 
 			clear() {

uni_modules/uni-datetime-picker/package.json

@@ -1,7 +1,7 @@
 {
   "id": "uni-datetime-picker",
   "displayName": "uni-datetime-picker 日期选择器",
-  "version": "2.0.11",
+  "version": "2.0.13",
   "description": "uni-datetime-picker 日期时间选择器，支持日历，支持范围选择",
   "keywords": [
     "uni-datetime-picker",