uview-plus 3.8.42 → 3.8.49
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/changelog.md +44 -0
- package/components/u-calendar/calendar.js +4 -3
- package/components/u-calendar/props.js +5 -0
- package/components/u-calendar/u-calendar.vue +14 -2
- package/components/u-datetime-picker/datetimePicker.js +2 -0
- package/components/u-datetime-picker/props.js +15 -5
- package/components/u-datetime-picker/u-datetime-picker.vue +117 -42
- package/components/u-number-box/u-number-box.vue +8 -5
- package/components/u-tabbar-item/u-tabbar-item.vue +2 -2
- package/components/u-tooltip/props.js +5 -0
- package/components/u-tooltip/tooltip.js +2 -1
- package/components/u-tooltip/u-tooltip.vue +26 -13
- package/package.json +1 -1
- package/types/comps/calendar.d.ts +5 -0
- package/types/comps/datetimePicker.d.ts +15 -5
package/changelog.md
CHANGED
|
@@ -1,3 +1,47 @@
|
|
|
1
|
+
## 3.8.49(2026-06-05)
|
|
2
|
+
fix(datetime-picker): 修复hasInput模式下点击遮罩无法关闭弹窗的问题
|
|
3
|
+
|
|
4
|
+
- 在close()方法中补充将showByClickInput置为false的逻辑,
|
|
5
|
+
- 与cancel()和confirm()的处理保持一致,修复issue #759
|
|
6
|
+
|
|
7
|
+
## 3.8.48(2026-06-04)
|
|
8
|
+
feat(calendar): 新增区间模式返回值格式配置
|
|
9
|
+
|
|
10
|
+
- 新增 rangeResultMode 配置项,支持 range 模式在 confirm 时返回全部区间日期或仅返回起止日期。
|
|
11
|
+
- 本次改动覆盖默认配置、组件 props、确认回调返回逻辑与 TypeScript 类型声明,默认值为 all 以保持现有行为兼容。
|
|
12
|
+
|
|
13
|
+
## 3.8.47(2026-06-03)
|
|
14
|
+
扩展 u-datetime-picker 支持小时与秒级时间选择
|
|
15
|
+
|
|
16
|
+
- 新增 datehour、timesecond、datetimesecond 三种模式,覆盖年月日时与秒级场景\n- 增加 minSecond/maxSecond 配置,并同步列生成、边界计算、回显与变更事件处理\n- 更新 TypeScript 类型定义,确保新模式和秒级属性在项目中可被正确约束
|
|
17
|
+
|
|
18
|
+
## 3.8.46(2026-06-02)
|
|
19
|
+
fix: 修复DatetimePicker在pageInline模式下无法滚动到默认值问题 #941
|
|
20
|
+
|
|
21
|
+
pageInline模式下picker-view原生组件常驻显示,Android/HarmonyOS端
|
|
22
|
+
原生组件尚未完成初始化时已渲染为索引0位置,后续更新无法可靠触发滚动。
|
|
23
|
+
|
|
24
|
+
- updateColumnValue改用$nextTick+条件延时:pageInline时等待100ms
|
|
25
|
+
- mounted新增pageInline兜底:200ms后再次设置索引确保原生组件就绪
|
|
26
|
+
|
|
27
|
+
## 3.8.45(2026-06-01)
|
|
28
|
+
fix: 修复NumberBox最小值限制导致无法输入新值问题 #914
|
|
29
|
+
|
|
30
|
+
## 3.8.44(2026-05-31)
|
|
31
|
+
fix: 修复up-tooltip未暴露open/close方法及manual模式失效问题 #1021
|
|
32
|
+
|
|
33
|
+
- 新增 show prop,支持 triggerMode="manual" 时通过 :show 控制显示
|
|
34
|
+
- 新增 open() / close() 方法并对外暴露
|
|
35
|
+
- 监听 show prop 变化,manual 模式下自动调用 open/close
|
|
36
|
+
- 新增 open / close emit 事件,u-popover 的 @open @close 监听可正常工作
|
|
37
|
+
- 统一内部显示/隐藏逻辑均走 open()/close() 方法
|
|
38
|
+
|
|
39
|
+
## 3.8.43(2026-05-30)
|
|
40
|
+
fix: 修复小程序中 tabbar midButton 模式图标不显示问题
|
|
41
|
+
|
|
42
|
+
- 使用 :deep() 选择器替代普通后代选择器,解决 virtualHost:true 导致
|
|
43
|
+
- 父组件 scoped 样式无法传播到子组件根元素的问题。
|
|
44
|
+
|
|
1
45
|
## 3.8.42(2026-05-29)
|
|
2
46
|
feat: 新增单行日历组件并支持下拉展开完整月历及修复签名组件 clear 方法实现
|
|
3
47
|
|
|
@@ -35,12 +35,13 @@ export default {
|
|
|
35
35
|
showConfirm: true,
|
|
36
36
|
maxRange: Number.MAX_SAFE_INTEGER, // Infinity
|
|
37
37
|
rangePrompt: '',
|
|
38
|
-
showRangePrompt: true,
|
|
39
|
-
allowSameDay: false,
|
|
40
|
-
round: 0,
|
|
38
|
+
showRangePrompt: true,
|
|
39
|
+
allowSameDay: false,
|
|
40
|
+
round: 0,
|
|
41
41
|
monthNum: 3,
|
|
42
42
|
monthSwitch: false,
|
|
43
43
|
showToday: true,
|
|
44
|
+
rangeResultMode: 'all',
|
|
44
45
|
weekText: [t("up.week.one"), t("up.week.two"), t("up.week.three"), t("up.week.four"), t("up.week.five"), t("up.week.six"), t("up.week.seven")],
|
|
45
46
|
forbidDays: [],
|
|
46
47
|
forbidDaysToast: t("up.calendar.disabled"),
|
|
@@ -132,6 +132,11 @@ export const props = defineMixin({
|
|
|
132
132
|
allowSameDay: {
|
|
133
133
|
type: Boolean,
|
|
134
134
|
default: () => defProps.calendar.allowSameDay
|
|
135
|
+
},
|
|
136
|
+
// 区间模式下确认返回值格式,all-返回区间内所有日期,boundary-仅返回起止日期
|
|
137
|
+
rangeResultMode: {
|
|
138
|
+
type: String,
|
|
139
|
+
default: () => defProps.calendar.rangeResultMode
|
|
135
140
|
},
|
|
136
141
|
// 圆角值
|
|
137
142
|
round: {
|
|
@@ -158,6 +158,7 @@ import { t } from '../../libs/i18n'
|
|
|
158
158
|
* @property {String} rangePrompt 范围选择超过最多可选天数时的提示文案,mode = range时有效
|
|
159
159
|
* @property {Boolean} showRangePrompt 范围选择超过最多可选天数时,是否展示提示文案,mode = range时有效 (默认 true )
|
|
160
160
|
* @property {Boolean} allowSameDay 是否允许日期范围的起止时间为同一天,mode = range时有效 (默认 false )
|
|
161
|
+
* @property {String} rangeResultMode 区间模式下确认返回值格式,all-返回区间内所有日期,boundary-仅返回起止日期 (默认 'all' )
|
|
161
162
|
* @property {Number|String} round 圆角值,默认无圆角 (默认 0 )
|
|
162
163
|
* @property {Number|String} monthNum 最多展示的月份数量 (默认 3 )
|
|
163
164
|
* @property {Boolean} monthSwitch 是否启用非滚动的单月切换模式 (默认 false )
|
|
@@ -307,6 +308,17 @@ export default {
|
|
|
307
308
|
emits: ["confirm", "close"],
|
|
308
309
|
methods: {
|
|
309
310
|
addUnit,
|
|
311
|
+
getConfirmValue(selected = this.selected) {
|
|
312
|
+
if (
|
|
313
|
+
this.mode === 'range' &&
|
|
314
|
+
this.rangeResultMode === 'boundary' &&
|
|
315
|
+
selected.length >= 2
|
|
316
|
+
) {
|
|
317
|
+
const len = selected.length - 1
|
|
318
|
+
return [selected[0], selected[len]]
|
|
319
|
+
}
|
|
320
|
+
return selected
|
|
321
|
+
},
|
|
310
322
|
// 在微信小程序中,不支持将函数当做props参数,故只能通过ref形式调用
|
|
311
323
|
setFormatter(e) {
|
|
312
324
|
this.innerFormatter = e
|
|
@@ -325,7 +337,7 @@ export default {
|
|
|
325
337
|
return
|
|
326
338
|
}
|
|
327
339
|
if( scene === 'tap') {
|
|
328
|
-
this.$emit('confirm', this.
|
|
340
|
+
this.$emit('confirm', this.getConfirmValue())
|
|
329
341
|
}
|
|
330
342
|
}
|
|
331
343
|
}
|
|
@@ -355,7 +367,7 @@ export default {
|
|
|
355
367
|
// 点击确定按钮
|
|
356
368
|
confirm() {
|
|
357
369
|
if (!this.buttonDisabled) {
|
|
358
|
-
this.$emit('confirm', this.
|
|
370
|
+
this.$emit('confirm', this.getConfirmValue())
|
|
359
371
|
}
|
|
360
372
|
},
|
|
361
373
|
// 获得两个日期之间的月份数
|
|
@@ -72,7 +72,7 @@ export const props = defineMixin({
|
|
|
72
72
|
type: String,
|
|
73
73
|
default: () => defProps.datetimePicker.title
|
|
74
74
|
},
|
|
75
|
-
//
|
|
75
|
+
// 展示格式,支持date、time、year-month、datetime、datehour、timesecond、datetimesecond
|
|
76
76
|
mode: {
|
|
77
77
|
type: String,
|
|
78
78
|
default: () => defProps.datetimePicker.mode
|
|
@@ -89,26 +89,36 @@ export const props = defineMixin({
|
|
|
89
89
|
// 最小默认值为前10年
|
|
90
90
|
default: () => defProps.datetimePicker.minDate
|
|
91
91
|
},
|
|
92
|
-
// 可选的最小小时,仅mode=time有效
|
|
92
|
+
// 可选的最小小时,仅mode=time/timesecond有效
|
|
93
93
|
minHour: {
|
|
94
94
|
type: Number,
|
|
95
95
|
default: () => defProps.datetimePicker.minHour
|
|
96
96
|
},
|
|
97
|
-
// 可选的最大小时,仅mode=time有效
|
|
97
|
+
// 可选的最大小时,仅mode=time/timesecond有效
|
|
98
98
|
maxHour: {
|
|
99
99
|
type: Number,
|
|
100
100
|
default: () => defProps.datetimePicker.maxHour
|
|
101
101
|
},
|
|
102
|
-
// 可选的最小分钟,仅mode=time有效
|
|
102
|
+
// 可选的最小分钟,仅mode=time/timesecond有效
|
|
103
103
|
minMinute: {
|
|
104
104
|
type: Number,
|
|
105
105
|
default: () => defProps.datetimePicker.minMinute
|
|
106
106
|
},
|
|
107
|
-
// 可选的最大分钟,仅mode=time有效
|
|
107
|
+
// 可选的最大分钟,仅mode=time/timesecond有效
|
|
108
108
|
maxMinute: {
|
|
109
109
|
type: Number,
|
|
110
110
|
default: () => defProps.datetimePicker.maxMinute
|
|
111
111
|
},
|
|
112
|
+
// 可选的最小秒,仅mode=timesecond有效
|
|
113
|
+
minSecond: {
|
|
114
|
+
type: Number,
|
|
115
|
+
default: () => defProps.datetimePicker.minSecond
|
|
116
|
+
},
|
|
117
|
+
// 可选的最大秒,仅mode=timesecond有效
|
|
118
|
+
maxSecond: {
|
|
119
|
+
type: Number,
|
|
120
|
+
default: () => defProps.datetimePicker.maxSecond
|
|
121
|
+
},
|
|
112
122
|
// 选项过滤函数
|
|
113
123
|
filter: {
|
|
114
124
|
type: [Function, null],
|
|
@@ -72,13 +72,15 @@
|
|
|
72
72
|
* @property {Boolean} showToolbar 是否显示顶部的操作栏 ( 默认 true )
|
|
73
73
|
* @property {String | Number} modelValue 绑定值
|
|
74
74
|
* @property {String} title 顶部标题
|
|
75
|
-
* @property {String} mode 展示格式 mode=date为日期选择,mode=time为时间选择,mode=year-month为年月选择,mode=datetime
|
|
75
|
+
* @property {String} mode 展示格式 mode=date为日期选择,mode=time为时间选择,mode=year-month为年月选择,mode=datetime为日期时间选择,mode=datehour为日期小时选择,mode=timesecond为时分秒选择,mode=datetimesecond为日期时分秒选择 ( 默认 ‘datetime )
|
|
76
76
|
* @property {Number} maxDate 可选的最大时间 默认值为后10年
|
|
77
77
|
* @property {Number} minDate 可选的最小时间 默认值为前10年
|
|
78
|
-
* @property {Number} minHour 可选的最小小时,仅mode=time有效 ( 默认 0 )
|
|
79
|
-
* @property {Number} maxHour 可选的最大小时,仅mode=time有效 ( 默认 23 )
|
|
80
|
-
* @property {Number} minMinute 可选的最小分钟,仅mode=time有效 ( 默认 0 )
|
|
81
|
-
* @property {Number} maxMinute 可选的最大分钟,仅mode=time有效 ( 默认 59 )
|
|
78
|
+
* @property {Number} minHour 可选的最小小时,仅mode=time/timesecond有效 ( 默认 0 )
|
|
79
|
+
* @property {Number} maxHour 可选的最大小时,仅mode=time/timesecond有效 ( 默认 23 )
|
|
80
|
+
* @property {Number} minMinute 可选的最小分钟,仅mode=time/timesecond有效 ( 默认 0 )
|
|
81
|
+
* @property {Number} maxMinute 可选的最大分钟,仅mode=time/timesecond有效 ( 默认 59 )
|
|
82
|
+
* @property {Number} minSecond 可选的最小秒,仅mode=timesecond有效 ( 默认 0 )
|
|
83
|
+
* @property {Number} maxSecond 可选的最大秒,仅mode=timesecond有效 ( 默认 59 )
|
|
82
84
|
* @property {Function} filter 选项过滤函数
|
|
83
85
|
* @property {Function} formatter 选项格式化函数
|
|
84
86
|
* @property {Boolean} loading 是否显示加载中状态 ( 默认 false )
|
|
@@ -143,7 +145,7 @@
|
|
|
143
145
|
computed: {
|
|
144
146
|
// 如果以下这些变量发生了变化,意味着需要重新初始化各列的值
|
|
145
147
|
propsChange() {
|
|
146
|
-
return [this.mode, this.maxDate, this.minDate, this.minHour, this.maxHour, this.minMinute, this.maxMinute, this.filter, this.modelValue]
|
|
148
|
+
return [this.mode, this.maxDate, this.minDate, this.minHour, this.maxHour, this.minMinute, this.maxMinute, this.minSecond, this.maxSecond, this.filter, this.modelValue]
|
|
147
149
|
},
|
|
148
150
|
resolvedMaskStyle() {
|
|
149
151
|
if (this.upHasProp('maskStyle')) {
|
|
@@ -169,6 +171,13 @@
|
|
|
169
171
|
},
|
|
170
172
|
mounted() {
|
|
171
173
|
this.init()
|
|
174
|
+
// pageInline模式下picker-view常驻显示,在原生端(Android/HarmonyOS)需要
|
|
175
|
+
// 等待原生picker-view组件完成初始化后再重新设置选中值,否则滚动位置可能不生效
|
|
176
|
+
if (this.pageInline) {
|
|
177
|
+
setTimeout(() => {
|
|
178
|
+
this.updateIndexs(this.innerValue)
|
|
179
|
+
}, 200)
|
|
180
|
+
}
|
|
172
181
|
},
|
|
173
182
|
// #ifdef VUE3
|
|
174
183
|
emits: ['close', 'cancel', 'confirm', 'change', 'update:modelValue'],
|
|
@@ -193,7 +202,7 @@
|
|
|
193
202
|
this.inputValue = ''
|
|
194
203
|
return
|
|
195
204
|
}
|
|
196
|
-
if (this.mode
|
|
205
|
+
if (this.mode === 'time' || this.mode === 'timesecond') {
|
|
197
206
|
this.inputValue = newValue
|
|
198
207
|
} else {
|
|
199
208
|
if (this.format) {
|
|
@@ -213,9 +222,15 @@
|
|
|
213
222
|
case 'datetime':
|
|
214
223
|
format = 'YYYY-MM-DD HH:mm'
|
|
215
224
|
break;
|
|
225
|
+
case 'datetimesecond':
|
|
226
|
+
format = 'YYYY-MM-DD HH:mm:ss'
|
|
227
|
+
break;
|
|
216
228
|
case 'time':
|
|
217
229
|
format = 'HH:mm'
|
|
218
230
|
break;
|
|
231
|
+
case 'timesecond':
|
|
232
|
+
format = 'HH:mm:ss'
|
|
233
|
+
break;
|
|
219
234
|
default:
|
|
220
235
|
break;
|
|
221
236
|
}
|
|
@@ -241,6 +256,9 @@
|
|
|
241
256
|
},
|
|
242
257
|
// 关闭选择器
|
|
243
258
|
close() {
|
|
259
|
+
if (this.hasInput) {
|
|
260
|
+
this.showByClickInput = false
|
|
261
|
+
}
|
|
244
262
|
if (this.closeOnClickOverlay) {
|
|
245
263
|
if (this.hasInput) {
|
|
246
264
|
this.showByClickInput = false
|
|
@@ -299,15 +317,21 @@
|
|
|
299
317
|
const { indexs, values } = e
|
|
300
318
|
const safeValues = Array.isArray(values) ? values : []
|
|
301
319
|
let selectValue = ''
|
|
302
|
-
if(this.mode === 'time') {
|
|
320
|
+
if (this.mode === 'time' || this.mode === 'timesecond') {
|
|
303
321
|
// 根据value各列索引,从各列数组中,取出当前时间的选中值
|
|
304
322
|
const hourText = this.safeColumnValue(safeValues, 0, indexs[0], padZero(this.minHour))
|
|
305
323
|
const minuteText = this.safeColumnValue(safeValues, 1, indexs[1], padZero(this.minMinute))
|
|
306
324
|
let hour = this.toInt(this.intercept(hourText), this.minHour)
|
|
307
325
|
let minute = this.toInt(this.intercept(minuteText), this.minMinute)
|
|
326
|
+
let second = this.minSecond
|
|
308
327
|
hour = range(this.minHour, this.maxHour, hour)
|
|
309
328
|
minute = range(this.minMinute, this.maxMinute, minute)
|
|
310
329
|
selectValue = `${padZero(hour)}:${padZero(minute)}`
|
|
330
|
+
if (this.mode === 'timesecond') {
|
|
331
|
+
const secondText = this.safeColumnValue(safeValues, 2, indexs[2], padZero(this.minSecond))
|
|
332
|
+
second = range(this.minSecond, this.maxSecond, this.toInt(this.intercept(secondText), this.minSecond))
|
|
333
|
+
selectValue = `${selectValue}:${padZero(second)}`
|
|
334
|
+
}
|
|
311
335
|
} else {
|
|
312
336
|
const validCurrent = dayjs(this.innerValue).isValid() ? dayjs(this.innerValue) : dayjs(this.minDate)
|
|
313
337
|
const currentYear = validCurrent.year()
|
|
@@ -315,13 +339,14 @@
|
|
|
315
339
|
const currentDate = validCurrent.date()
|
|
316
340
|
const currentHour = validCurrent.hour()
|
|
317
341
|
const currentMinute = validCurrent.minute()
|
|
342
|
+
const currentSecond = validCurrent.second()
|
|
318
343
|
|
|
319
344
|
const yearText = this.safeColumnValue(safeValues, 0, indexs[0], `${currentYear}`)
|
|
320
345
|
const monthText = this.safeColumnValue(safeValues, 1, indexs[1], padZero(currentMonth))
|
|
321
346
|
// 将选择的值转为数值,比如'03'转为数值的3,'2019'转为数值的2019
|
|
322
347
|
let year = this.toInt(this.intercept(yearText, 'year'), currentYear)
|
|
323
348
|
let month = this.toInt(this.intercept(monthText), currentMonth)
|
|
324
|
-
let hour = 0, minute = 0
|
|
349
|
+
let hour = 0, minute = 0, second = 0
|
|
325
350
|
month = range(1, 12, month)
|
|
326
351
|
// 此月份的最大天数
|
|
327
352
|
const maxDate = dayjs(`${year}-${month}`).daysInMonth()
|
|
@@ -333,14 +358,20 @@
|
|
|
333
358
|
}
|
|
334
359
|
// 不允许超过maxDate值
|
|
335
360
|
date = range(1, maxDate, date)
|
|
336
|
-
if (this.mode === 'datetime') {
|
|
361
|
+
if (this.mode === 'datehour' || this.mode === 'datetime' || this.mode === 'datetimesecond') {
|
|
337
362
|
const hourText = this.safeColumnValue(safeValues, 3, indexs[3], padZero(currentHour))
|
|
338
|
-
const minuteText = this.safeColumnValue(safeValues, 4, indexs[4], padZero(currentMinute))
|
|
339
363
|
hour = range(0, 23, this.toInt(this.intercept(hourText), currentHour))
|
|
364
|
+
}
|
|
365
|
+
if (this.mode === 'datetime' || this.mode === 'datetimesecond') {
|
|
366
|
+
const minuteText = this.safeColumnValue(safeValues, 4, indexs[4], padZero(currentMinute))
|
|
340
367
|
minute = range(0, 59, this.toInt(this.intercept(minuteText), currentMinute))
|
|
341
368
|
}
|
|
369
|
+
if (this.mode === 'datetimesecond') {
|
|
370
|
+
const secondText = this.safeColumnValue(safeValues, 5, indexs[5], padZero(currentSecond))
|
|
371
|
+
second = range(0, 59, this.toInt(this.intercept(secondText), currentSecond))
|
|
372
|
+
}
|
|
342
373
|
// 转为时间模式
|
|
343
|
-
selectValue = Number(new Date(year, month - 1, date, hour, minute))
|
|
374
|
+
selectValue = Number(new Date(year, month - 1, date, hour, minute, second))
|
|
344
375
|
if (!Number.isFinite(selectValue)) {
|
|
345
376
|
selectValue = this.correctValue(this.innerValue)
|
|
346
377
|
}
|
|
@@ -364,33 +395,44 @@
|
|
|
364
395
|
this.innerValue = value
|
|
365
396
|
this.updateColumns()
|
|
366
397
|
// 延迟执行,等待u-picker组件列数据更新完后再设置选中值索引
|
|
367
|
-
|
|
368
|
-
this
|
|
369
|
-
|
|
398
|
+
// pageInline模式下picker-view常驻显示,需额外等待原生组件滚动到位
|
|
399
|
+
this.$nextTick(() => {
|
|
400
|
+
setTimeout(() => {
|
|
401
|
+
this.updateIndexs(value)
|
|
402
|
+
}, this.pageInline ? 100 : 0)
|
|
403
|
+
})
|
|
370
404
|
},
|
|
371
405
|
// 更新索引
|
|
372
406
|
updateIndexs(value) {
|
|
373
407
|
let values = []
|
|
374
408
|
const formatter = this.formatter || this.innerFormatter
|
|
375
|
-
if (this.mode === 'time') {
|
|
409
|
+
if (this.mode === 'time' || this.mode === 'timesecond') {
|
|
376
410
|
// 将time模式的时间用:分隔成数组
|
|
377
411
|
const timeArr = value.split(':')
|
|
378
412
|
// 使用formatter格式化方法进行管道处理
|
|
379
413
|
values = [formatter('hour', timeArr[0]), formatter('minute', timeArr[1])]
|
|
414
|
+
if (this.mode === 'timesecond') {
|
|
415
|
+
values.push(formatter('second', timeArr[2]))
|
|
416
|
+
}
|
|
380
417
|
} else {
|
|
381
|
-
const date = new Date(value)
|
|
382
418
|
values = [
|
|
383
419
|
formatter('year', `${dayjs(value).year()}`),
|
|
384
420
|
// 月份补0
|
|
385
421
|
formatter('month', padZero(dayjs(value).month() + 1))
|
|
386
422
|
]
|
|
387
|
-
if (this.mode === 'date') {
|
|
423
|
+
if (this.mode === 'date' || this.mode === 'datehour' || this.mode === 'datetime' || this.mode === 'datetimesecond') {
|
|
388
424
|
// date模式,需要添加天列
|
|
389
425
|
values.push(formatter('day', padZero(dayjs(value).date())))
|
|
390
426
|
}
|
|
391
|
-
if (this.mode === 'datetime') {
|
|
427
|
+
if (this.mode === 'datehour' || this.mode === 'datetime' || this.mode === 'datetimesecond') {
|
|
428
|
+
values.push(formatter('hour', padZero(dayjs(value).hour())))
|
|
429
|
+
}
|
|
430
|
+
if (this.mode === 'datetime' || this.mode === 'datetimesecond') {
|
|
392
431
|
// 数组的push方法,可以写入多个参数
|
|
393
|
-
values.push(formatter('
|
|
432
|
+
values.push(formatter('minute', padZero(dayjs(value).minute())))
|
|
433
|
+
}
|
|
434
|
+
if (this.mode === 'datetimesecond') {
|
|
435
|
+
values.push(formatter('second', padZero(dayjs(value).second())))
|
|
394
436
|
}
|
|
395
437
|
}
|
|
396
438
|
|
|
@@ -438,23 +480,35 @@
|
|
|
438
480
|
},
|
|
439
481
|
// 得出合法的时间
|
|
440
482
|
correctValue(value) {
|
|
441
|
-
const isDateMode = this.mode
|
|
483
|
+
const isDateMode = !['time', 'timesecond'].includes(this.mode)
|
|
442
484
|
// if (isDateMode && !test.date(value)) {
|
|
443
485
|
if (isDateMode && !dayjs.unix(value).isValid()) {
|
|
444
486
|
// 如果是日期类型,但是又没有设置合法的当前时间的话,使用最小时间为当前时间
|
|
445
487
|
value = this.minDate
|
|
446
488
|
} else if (!isDateMode && !value) {
|
|
447
489
|
// 如果是时间类型,而又没有默认值的话,就用最小时间
|
|
448
|
-
value =
|
|
490
|
+
value = this.mode === 'timesecond'
|
|
491
|
+
? `${padZero(this.minHour)}:${padZero(this.minMinute)}:${padZero(this.minSecond)}`
|
|
492
|
+
: `${padZero(this.minHour)}:${padZero(this.minMinute)}`
|
|
449
493
|
}
|
|
450
494
|
// 时间类型
|
|
451
495
|
if (!isDateMode) {
|
|
452
496
|
if (String(value).indexOf(':') === -1) return error('时间错误,请传递如12:24的格式')
|
|
453
|
-
|
|
497
|
+
const timeArr = String(value).split(':')
|
|
498
|
+
let hour = timeArr[0]
|
|
499
|
+
let minute = timeArr[1]
|
|
500
|
+
let second = timeArr[2]
|
|
454
501
|
// 对时间补零,同时控制在最小值和最大值之间
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
502
|
+
const hourNum = Number(hour)
|
|
503
|
+
const minuteNum = Number(minute)
|
|
504
|
+
hour = padZero(range(this.minHour, this.maxHour, Number.isNaN(hourNum) ? this.minHour : hourNum))
|
|
505
|
+
minute = padZero(range(this.minMinute, this.maxMinute, Number.isNaN(minuteNum) ? this.minMinute : minuteNum))
|
|
506
|
+
if (this.mode === 'timesecond') {
|
|
507
|
+
const secondNum = Number(second)
|
|
508
|
+
second = padZero(range(this.minSecond, this.maxSecond, Number.isNaN(secondNum) ? this.minSecond : secondNum))
|
|
509
|
+
return `${hour}:${minute}:${second}`
|
|
510
|
+
}
|
|
511
|
+
return `${hour}:${minute}`
|
|
458
512
|
} else {
|
|
459
513
|
// 如果是日期格式,控制在最小日期和最大日期之间
|
|
460
514
|
value = dayjs(value).isBefore(dayjs(this.minDate)) ? this.minDate : value
|
|
@@ -464,20 +518,27 @@
|
|
|
464
518
|
},
|
|
465
519
|
// 获取每列的最大和最小值
|
|
466
520
|
getRanges() {
|
|
467
|
-
if (this.mode === 'time') {
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
521
|
+
if (this.mode === 'time' || this.mode === 'timesecond') {
|
|
522
|
+
const timeColumns = [
|
|
523
|
+
{
|
|
524
|
+
type: 'hour',
|
|
525
|
+
range: [this.minHour, this.maxHour],
|
|
526
|
+
},
|
|
527
|
+
{
|
|
528
|
+
type: 'minute',
|
|
529
|
+
range: [this.minMinute, this.maxMinute],
|
|
530
|
+
}
|
|
531
|
+
]
|
|
532
|
+
if (this.mode === 'timesecond') {
|
|
533
|
+
timeColumns.push({
|
|
534
|
+
type: 'second',
|
|
535
|
+
range: [this.minSecond, this.maxSecond],
|
|
536
|
+
})
|
|
537
|
+
}
|
|
538
|
+
return timeColumns
|
|
478
539
|
}
|
|
479
|
-
const { maxYear, maxDate, maxMonth, maxHour, maxMinute, } = this.getBoundary('max', this.innerValue);
|
|
480
|
-
const { minYear, minDate, minMonth, minHour, minMinute, } = this.getBoundary('min', this.innerValue);
|
|
540
|
+
const { maxYear, maxDate, maxMonth, maxHour, maxMinute, maxSecond } = this.getBoundary('max', this.innerValue);
|
|
541
|
+
const { minYear, minDate, minMonth, minHour, minMinute, minSecond } = this.getBoundary('min', this.innerValue);
|
|
481
542
|
const result = [
|
|
482
543
|
{
|
|
483
544
|
type: 'year',
|
|
@@ -499,6 +560,10 @@
|
|
|
499
560
|
type: 'minute',
|
|
500
561
|
range: [minMinute, maxMinute],
|
|
501
562
|
},
|
|
563
|
+
{
|
|
564
|
+
type: 'second',
|
|
565
|
+
range: [minSecond, maxSecond],
|
|
566
|
+
},
|
|
502
567
|
];
|
|
503
568
|
// 兜底:防止边界计算异常导致日列出现空范围(快速滚动场景)
|
|
504
569
|
if (result[2] && result[2].type === 'day') {
|
|
@@ -510,9 +575,13 @@
|
|
|
510
575
|
}
|
|
511
576
|
}
|
|
512
577
|
if (this.mode === 'date')
|
|
513
|
-
result.splice(3,
|
|
578
|
+
result.splice(3, 3);
|
|
579
|
+
if (this.mode === 'datehour')
|
|
580
|
+
result.splice(4, 2);
|
|
581
|
+
if (this.mode === 'datetime')
|
|
582
|
+
result.splice(5, 1);
|
|
514
583
|
if (this.mode === 'year-month')
|
|
515
|
-
result.splice(2,
|
|
584
|
+
result.splice(2, 4);
|
|
516
585
|
return result;
|
|
517
586
|
},
|
|
518
587
|
// 根据minDate、maxDate、minHour、maxHour等边界值,判断各列的开始和结束边界值
|
|
@@ -527,12 +596,14 @@
|
|
|
527
596
|
let date = 1
|
|
528
597
|
let hour = 0
|
|
529
598
|
let minute = 0
|
|
599
|
+
let second = 0
|
|
530
600
|
if (type === 'max') {
|
|
531
601
|
month = 12
|
|
532
602
|
// 月份的天数
|
|
533
603
|
date = dayjs(value).daysInMonth()
|
|
534
604
|
hour = 23
|
|
535
605
|
minute = 59
|
|
606
|
+
second = 59
|
|
536
607
|
}
|
|
537
608
|
// 获取边界值,逻辑是:当年达到了边界值(最大或最小年),就检查月允许的最大和最小值,以此类推
|
|
538
609
|
if (dayjs(value).year() === year) {
|
|
@@ -543,6 +614,9 @@
|
|
|
543
614
|
hour = dayjs(boundary).hour()
|
|
544
615
|
if (dayjs(value).hour() === hour) {
|
|
545
616
|
minute = dayjs(boundary).minute()
|
|
617
|
+
if (dayjs(value).minute() === minute) {
|
|
618
|
+
second = dayjs(boundary).second()
|
|
619
|
+
}
|
|
546
620
|
}
|
|
547
621
|
}
|
|
548
622
|
}
|
|
@@ -552,7 +626,8 @@
|
|
|
552
626
|
[`${type}Month`]: month,
|
|
553
627
|
[`${type}Date`]: date,
|
|
554
628
|
[`${type}Hour`]: hour,
|
|
555
|
-
[`${type}Minute`]: minute
|
|
629
|
+
[`${type}Minute`]: minute,
|
|
630
|
+
[`${type}Second`]: second
|
|
556
631
|
}
|
|
557
632
|
},
|
|
558
633
|
onShowByClickInput(){
|
|
@@ -309,8 +309,12 @@
|
|
|
309
309
|
},
|
|
310
310
|
// 输入框失去焦点
|
|
311
311
|
onBlur(event) {
|
|
312
|
-
//
|
|
313
|
-
const
|
|
312
|
+
// 对输入值进行格式化,失焦时强制修正到合法范围(如最小值)
|
|
313
|
+
const raw = event.detail.value
|
|
314
|
+
const value = (raw === '' || raw === null || raw === undefined)
|
|
315
|
+
? this.min
|
|
316
|
+
: this.format(raw)
|
|
317
|
+
this.emitChange(value)
|
|
314
318
|
// 发出blur事件
|
|
315
319
|
this.$emit(
|
|
316
320
|
'blur',{
|
|
@@ -324,10 +328,9 @@
|
|
|
324
328
|
const {
|
|
325
329
|
value = ''
|
|
326
330
|
} = e.detail || {}
|
|
327
|
-
//
|
|
331
|
+
// 为空时不立即修正,等失焦时再处理,允许用户清空后输入新值
|
|
328
332
|
if (value === '') {
|
|
329
|
-
|
|
330
|
-
this.emitChange(this.min)
|
|
333
|
+
this.currentValue = ''
|
|
331
334
|
return
|
|
332
335
|
}
|
|
333
336
|
let formatted = this.filter(value)
|
|
@@ -435,8 +435,8 @@
|
|
|
435
435
|
z-index: 1;
|
|
436
436
|
}
|
|
437
437
|
|
|
438
|
-
.u-tabbar-item__icon--mid-button .u-icon,
|
|
439
|
-
.u-tabbar-item__icon--mid-button .u-badge {
|
|
438
|
+
.u-tabbar-item__icon--mid-button :deep(.u-icon),
|
|
439
|
+
.u-tabbar-item__icon--mid-button :deep(.u-badge) {
|
|
440
440
|
position: relative;
|
|
441
441
|
z-index: 2;
|
|
442
442
|
}
|
|
@@ -164,6 +164,15 @@
|
|
|
164
164
|
async propsChange() {
|
|
165
165
|
await this.getElRect()
|
|
166
166
|
// this.getTooltipStyle();
|
|
167
|
+
},
|
|
168
|
+
show(val) {
|
|
169
|
+
if (this.triggerMode === 'manual') {
|
|
170
|
+
if (val) {
|
|
171
|
+
this.open()
|
|
172
|
+
} else {
|
|
173
|
+
this.close()
|
|
174
|
+
}
|
|
175
|
+
}
|
|
167
176
|
}
|
|
168
177
|
},
|
|
169
178
|
computed: {
|
|
@@ -231,7 +240,7 @@
|
|
|
231
240
|
mounted() {
|
|
232
241
|
this.init()
|
|
233
242
|
},
|
|
234
|
-
emits: ["click"],
|
|
243
|
+
emits: ["click", "open", "close"],
|
|
235
244
|
methods: {
|
|
236
245
|
addStyle,
|
|
237
246
|
addUnit,
|
|
@@ -241,27 +250,34 @@
|
|
|
241
250
|
},
|
|
242
251
|
// 点击触发事件
|
|
243
252
|
async clickHander() {
|
|
244
|
-
// this.getTooltipStyle();
|
|
245
253
|
if (this.triggerMode == 'click') {
|
|
246
|
-
this.
|
|
247
|
-
this.showTooltip = true
|
|
254
|
+
this.open()
|
|
248
255
|
}
|
|
249
256
|
},
|
|
250
257
|
// 长按触发事件
|
|
251
258
|
async longpressHandler() {
|
|
252
|
-
// this.getTooltipStyle();
|
|
253
259
|
if (this.triggerMode == 'longpress') {
|
|
254
|
-
this.
|
|
255
|
-
this.showTooltip = true
|
|
260
|
+
this.open()
|
|
256
261
|
}
|
|
257
262
|
},
|
|
263
|
+
// 打开tooltip
|
|
264
|
+
open() {
|
|
265
|
+
this.tooltipTop = 0
|
|
266
|
+
this.showTooltip = true
|
|
267
|
+
this.$emit('open')
|
|
268
|
+
},
|
|
269
|
+
// 关闭tooltip
|
|
270
|
+
close() {
|
|
271
|
+
this.showTooltip = false
|
|
272
|
+
this.$emit('close')
|
|
273
|
+
},
|
|
258
274
|
// 点击透明遮罩
|
|
259
275
|
overlayClickHandler() {
|
|
260
|
-
this.
|
|
276
|
+
this.close()
|
|
261
277
|
},
|
|
262
278
|
// 点击弹出按钮
|
|
263
279
|
btnClickHandler(index) {
|
|
264
|
-
this.
|
|
280
|
+
this.close()
|
|
265
281
|
// 如果需要展示复制按钮,此处index需要加1,因为复制按钮在第一个位置
|
|
266
282
|
this.$emit('click', this.showCopy ? index + 1 : index)
|
|
267
283
|
},
|
|
@@ -308,7 +324,7 @@
|
|
|
308
324
|
// 复制文本到粘贴板
|
|
309
325
|
setClipboardData() {
|
|
310
326
|
// 关闭组件
|
|
311
|
-
this.
|
|
327
|
+
this.close()
|
|
312
328
|
this.$emit('click', 0)
|
|
313
329
|
uni.setClipboardData({
|
|
314
330
|
// 优先使用copyText字段,如果没有,则默认使用text字段当做复制的内容
|
|
@@ -318,9 +334,6 @@
|
|
|
318
334
|
},
|
|
319
335
|
fail: () => {
|
|
320
336
|
this.showToast && toast('复制失败')
|
|
321
|
-
},
|
|
322
|
-
complete: () => {
|
|
323
|
-
this.showTooltip = false
|
|
324
337
|
}
|
|
325
338
|
})
|
|
326
339
|
}
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"id": "uview-plus",
|
|
3
3
|
"name": "uview-plus",
|
|
4
4
|
"displayName": "零云®uview-plus3.0重磅发布,全面的Vue3鸿蒙跨端移动组件库,组件丰富维护更新稳定。",
|
|
5
|
-
"version": "3.8.
|
|
5
|
+
"version": "3.8.49",
|
|
6
6
|
"description": "零云®uview-plus已兼容vue3支持多语言,120+全面的组件和便捷的工具会让您信手拈来。近期新增拖动排序、条码、图片裁剪、下拉刷新、虚拟列表、签名、Markdown等。",
|
|
7
7
|
"keywords": [
|
|
8
8
|
"uview",
|
|
@@ -124,6 +124,11 @@ declare interface CalendarProps {
|
|
|
124
124
|
* @default false
|
|
125
125
|
*/
|
|
126
126
|
allowSameDay?: boolean
|
|
127
|
+
/**
|
|
128
|
+
* 区间模式下确认返回值格式,`all`返回区间内所有日期,`boundary`仅返回起止日期
|
|
129
|
+
* @default "all"
|
|
130
|
+
*/
|
|
131
|
+
rangeResultMode?: 'all' | 'boundary'
|
|
127
132
|
/**
|
|
128
133
|
* 圆角值,默认无圆角
|
|
129
134
|
* @default 0
|
|
@@ -23,7 +23,7 @@ declare interface DatetimePickerProps {
|
|
|
23
23
|
* 展示格式
|
|
24
24
|
* @default "datetime"
|
|
25
25
|
*/
|
|
26
|
-
mode?: 'datetime' | 'date' | 'time' | 'year-month'
|
|
26
|
+
mode?: 'datetime' | 'date' | 'time' | 'year-month' | 'datehour' | 'timesecond' | 'datetimesecond'
|
|
27
27
|
/**
|
|
28
28
|
* 可选的最大时间(时间戳毫秒)
|
|
29
29
|
* @default 最大默认值为后10年
|
|
@@ -35,25 +35,35 @@ declare interface DatetimePickerProps {
|
|
|
35
35
|
*/
|
|
36
36
|
minDate?: number
|
|
37
37
|
/**
|
|
38
|
-
* 可选的最小小时,仅mode=time有效
|
|
38
|
+
* 可选的最小小时,仅mode=time/timesecond有效
|
|
39
39
|
* @default 0
|
|
40
40
|
*/
|
|
41
41
|
minHour?: number
|
|
42
42
|
/**
|
|
43
|
-
* 可选的最大小时,仅mode=time有效
|
|
43
|
+
* 可选的最大小时,仅mode=time/timesecond有效
|
|
44
44
|
* @default 23
|
|
45
45
|
*/
|
|
46
46
|
maxHour?: number
|
|
47
47
|
/**
|
|
48
|
-
* 可选的最小分钟,仅mode=time有效
|
|
48
|
+
* 可选的最小分钟,仅mode=time/timesecond有效
|
|
49
49
|
* @default 0
|
|
50
50
|
*/
|
|
51
51
|
minMinute?: number
|
|
52
52
|
/**
|
|
53
|
-
* 可选的最大分钟,仅mode=time有效
|
|
53
|
+
* 可选的最大分钟,仅mode=time/timesecond有效
|
|
54
54
|
* @default 59
|
|
55
55
|
*/
|
|
56
56
|
maxMinute?: number
|
|
57
|
+
/**
|
|
58
|
+
* 可选的最小秒,仅mode=timesecond有效
|
|
59
|
+
* @default 0
|
|
60
|
+
*/
|
|
61
|
+
minSecond?: number
|
|
62
|
+
/**
|
|
63
|
+
* 可选的最大秒,仅mode=timesecond有效
|
|
64
|
+
* @default 59
|
|
65
|
+
*/
|
|
66
|
+
maxSecond?: number
|
|
57
67
|
/**
|
|
58
68
|
* 选项过滤函数
|
|
59
69
|
* @default null
|