@hi-ui/time-picker 4.0.10 → 4.0.11
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 +15 -0
- package/lib/cjs/@types/index.js +0 -4
- package/lib/cjs/Input.js +33 -63
- package/lib/cjs/Panel.js +21 -45
- package/lib/cjs/PopContent.js +46 -77
- package/lib/cjs/Selector.js +22 -44
- package/lib/cjs/TimePicker.js +80 -132
- package/lib/cjs/hooks/useFilter.js +0 -8
- package/lib/cjs/index.js +0 -5
- package/lib/cjs/styles/index.scss.js +1 -4
- package/lib/cjs/utils/analysisFormat.js +1 -8
- package/lib/cjs/utils/disposeInputValue.js +12 -19
- package/lib/cjs/utils/generateSelectorData.js +5 -16
- package/lib/cjs/utils/getFormatDefault.js +0 -5
- package/lib/cjs/utils/getNowString.js +0 -8
- package/lib/cjs/utils/getRange.js +0 -9
- package/lib/cjs/utils/valueChecker.js +8 -23
- package/lib/esm/@types/index.js +0 -2
- package/lib/esm/Input.js +28 -39
- package/lib/esm/Panel.js +16 -22
- package/lib/esm/PopContent.js +43 -53
- package/lib/esm/Selector.js +16 -22
- package/lib/esm/TimePicker.js +70 -92
- package/lib/esm/hooks/useFilter.js +0 -4
- package/lib/esm/styles/index.scss.js +1 -3
- package/lib/esm/utils/analysisFormat.js +1 -4
- package/lib/esm/utils/disposeInputValue.js +12 -15
- package/lib/esm/utils/generateSelectorData.js +5 -12
- package/lib/esm/utils/getFormatDefault.js +0 -1
- package/lib/esm/utils/getNowString.js +0 -3
- package/lib/esm/utils/getRange.js +0 -5
- package/lib/esm/utils/valueChecker.js +8 -18
- package/package.json +10 -10
@@ -9,48 +9,41 @@
|
|
9
9
|
*/
|
10
10
|
'use strict';
|
11
11
|
|
12
|
-
Object.defineProperty(exports, '__esModule', {
|
13
|
-
value: true
|
14
|
-
});
|
15
|
-
|
16
12
|
var disposeInputValue = function disposeInputValue(format, original) {
|
17
|
-
var inputMaxLength = format.length;
|
18
|
-
|
19
|
-
var rough = original.trim().replace(/[\uff1a]/g, ':').replace(/[^0-9:]/g, '').slice(0, inputMaxLength);
|
20
|
-
|
13
|
+
var inputMaxLength = format.length;
|
14
|
+
// 初步处理(去除前后空格,兼容中文:,去除无效字符,不允许超过长度)
|
15
|
+
var rough = original.trim().replace(/[\uff1a]/g, ':').replace(/[^0-9:]/g, '').slice(0, inputMaxLength);
|
16
|
+
// 兼容直接在为空情况下输入 : 的情况
|
21
17
|
if (rough === ':') {
|
22
18
|
return '';
|
23
19
|
}
|
24
|
-
|
25
20
|
if (/:{2}$/.test(rough)) {
|
26
21
|
return rough.slice(0, rough.length - 1);
|
27
|
-
}
|
28
|
-
|
29
|
-
|
22
|
+
}
|
23
|
+
// 已经输入两个数字了,现在新输入的一个字符不是 : 号
|
30
24
|
if (/[0-9]{2}[^:]$/.test(rough)) {
|
31
25
|
// 字符串已经到达最长长度,代表,此时,字符串是一个错乱的,直接忽略新输入的字符
|
32
26
|
if (rough.length === inputMaxLength) {
|
33
27
|
return rough.slice(0, rough.length - 1);
|
34
|
-
}
|
28
|
+
}
|
29
|
+
// 字符串还有添加空间,则自动添加:在新字符前方
|
35
30
|
else {
|
36
31
|
return rough.slice(0, rough.length - 1) + ':' + rough.slice(rough.length - 1);
|
37
32
|
}
|
38
|
-
}
|
39
|
-
|
40
|
-
|
33
|
+
}
|
34
|
+
// 在某个部分只输入了一个数字,然后输入 : 想要结束这个部分
|
41
35
|
if (/:[0-9]:$/.test(rough) || /^[0-9]:$/.test(rough)) {
|
42
36
|
// 已经达到最大输入了,则此时输入的 : 是无效的
|
43
37
|
// 自动转换,去除:,添加 0 在数字前
|
44
38
|
if (rough.length === inputMaxLength) {
|
45
39
|
return rough.slice(0, rough.length - 2) + '0' + rough.slice(rough.length - 2, rough.length - 1);
|
46
|
-
}
|
40
|
+
}
|
41
|
+
// 输入没有达到最大,则,此时输入 : 是有效的
|
47
42
|
// 自动补充此章节,添加 0
|
48
43
|
else {
|
49
44
|
return rough.slice(0, rough.length - 2) + '0' + rough.slice(rough.length - 2, rough.length);
|
50
45
|
}
|
51
46
|
}
|
52
|
-
|
53
47
|
return rough;
|
54
48
|
};
|
55
|
-
|
56
49
|
exports.disposeInputValue = disposeInputValue;
|
@@ -9,28 +9,20 @@
|
|
9
9
|
*/
|
10
10
|
'use strict';
|
11
11
|
|
12
|
-
Object.defineProperty(exports, '__esModule', {
|
13
|
-
value: true
|
14
|
-
});
|
15
|
-
|
16
12
|
var index = require('../@types/index.js');
|
17
|
-
|
18
13
|
var generateSelectorData = function generateSelectorData(info) {
|
19
14
|
var _disabledMap, _rangeMap, _stepMap;
|
20
|
-
|
21
15
|
var type = info.type,
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
16
|
+
filter = info.filter,
|
17
|
+
step = info.step,
|
18
|
+
separateValue = info.separateValue,
|
19
|
+
panelType = info.panelType,
|
20
|
+
selectorTypes = info.selectorTypes;
|
27
21
|
var result = [];
|
28
|
-
|
29
22
|
var getMatchTypeValue = function getMatchTypeValue(selectorType) {
|
30
23
|
var matchIndex = selectorTypes.indexOf(selectorType);
|
31
24
|
return matchIndex >= 0 ? separateValue[matchIndex] : -1;
|
32
25
|
};
|
33
|
-
|
34
26
|
var disabledMap = (_disabledMap = {}, _disabledMap[index.TimePickerSelectorType.hour] = function () {
|
35
27
|
return filter.disabledHours(panelType);
|
36
28
|
}, _disabledMap[index.TimePickerSelectorType.minute] = function () {
|
@@ -42,7 +34,6 @@ var generateSelectorData = function generateSelectorData(info) {
|
|
42
34
|
var rangeMap = (_rangeMap = {}, _rangeMap[index.TimePickerSelectorType.hour] = [0, 23], _rangeMap[index.TimePickerSelectorType.minute] = [0, 59], _rangeMap[index.TimePickerSelectorType.second] = [0, 59], _rangeMap);
|
43
35
|
var range = rangeMap[type];
|
44
36
|
var stepMap = (_stepMap = {}, _stepMap[index.TimePickerSelectorType.hour] = step.hourStep, _stepMap[index.TimePickerSelectorType.minute] = step.minuteStep, _stepMap[index.TimePickerSelectorType.second] = step.secondStep, _stepMap);
|
45
|
-
|
46
37
|
for (var index$1 = range[0]; index$1 <= range[1]; index$1 += stepMap[type]) {
|
47
38
|
result.push({
|
48
39
|
title: String(index$1).padStart(2, '0'),
|
@@ -50,8 +41,6 @@ var generateSelectorData = function generateSelectorData(info) {
|
|
50
41
|
id: String(index$1)
|
51
42
|
});
|
52
43
|
}
|
53
|
-
|
54
44
|
return result;
|
55
45
|
};
|
56
|
-
|
57
46
|
exports.generateSelectorData = generateSelectorData;
|
@@ -9,12 +9,7 @@
|
|
9
9
|
*/
|
10
10
|
'use strict';
|
11
11
|
|
12
|
-
Object.defineProperty(exports, '__esModule', {
|
13
|
-
value: true
|
14
|
-
});
|
15
|
-
|
16
12
|
var getFormatDefault = function getFormatDefault(format) {
|
17
13
|
return format.replace(/[Hms]/g, '0');
|
18
14
|
};
|
19
|
-
|
20
15
|
exports.getFormatDefault = getFormatDefault;
|
@@ -9,17 +9,10 @@
|
|
9
9
|
*/
|
10
10
|
'use strict';
|
11
11
|
|
12
|
-
Object.defineProperty(exports, '__esModule', {
|
13
|
-
value: true
|
14
|
-
});
|
15
|
-
|
16
12
|
var index = require('../@types/index.js');
|
17
|
-
|
18
13
|
var analysisFormat = require('./analysisFormat.js');
|
19
|
-
|
20
14
|
var getNowString = function getNowString(formatString) {
|
21
15
|
var _timeMap;
|
22
|
-
|
23
16
|
var format = analysisFormat.analysisFormat(formatString);
|
24
17
|
var now = new Date();
|
25
18
|
var timeMap = (_timeMap = {}, _timeMap[index.TimePickerSelectorType.hour] = String(now.getHours()).padStart(2, '0'), _timeMap[index.TimePickerSelectorType.minute] = String(now.getMinutes()).padStart(2, '0'), _timeMap[index.TimePickerSelectorType.second] = String(now.getSeconds()).padStart(2, '0'), _timeMap);
|
@@ -27,5 +20,4 @@ var getNowString = function getNowString(formatString) {
|
|
27
20
|
return timeMap[item];
|
28
21
|
}).join(':');
|
29
22
|
};
|
30
|
-
|
31
23
|
exports.getNowString = getNowString;
|
@@ -9,26 +9,17 @@
|
|
9
9
|
*/
|
10
10
|
'use strict';
|
11
11
|
|
12
|
-
Object.defineProperty(exports, '__esModule', {
|
13
|
-
value: true
|
14
|
-
});
|
15
|
-
|
16
12
|
var getRange = function getRange(min, max) {
|
17
13
|
var result = [];
|
18
|
-
|
19
14
|
if (min > max) {
|
20
15
|
return [];
|
21
16
|
}
|
22
|
-
|
23
17
|
if (min < 0 || max < 0) {
|
24
18
|
return [];
|
25
19
|
}
|
26
|
-
|
27
20
|
for (var counter = min; counter <= max; counter++) {
|
28
21
|
result.push(counter);
|
29
22
|
}
|
30
|
-
|
31
23
|
return result;
|
32
24
|
};
|
33
|
-
|
34
25
|
exports.getRange = getRange;
|
@@ -9,22 +9,15 @@
|
|
9
9
|
*/
|
10
10
|
'use strict';
|
11
11
|
|
12
|
-
Object.defineProperty(exports, '__esModule', {
|
13
|
-
value: true
|
14
|
-
});
|
15
|
-
|
16
12
|
var index = require('../@types/index.js');
|
17
|
-
|
18
13
|
var analysisFormat = require('./analysisFormat.js');
|
19
|
-
|
20
14
|
var valueChecker = function valueChecker(info) {
|
21
15
|
var _checkerMap, _disabledMap, _stepMap;
|
22
|
-
|
23
16
|
var value = info.value,
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
17
|
+
format = info.format,
|
18
|
+
filter = info.filter,
|
19
|
+
panelType = info.panelType,
|
20
|
+
step = info.step;
|
28
21
|
var selectorTypes = analysisFormat.analysisFormat(format);
|
29
22
|
var checkerMap = (_checkerMap = {}, _checkerMap[index.TimePickerSelectorType.hour] = function (e) {
|
30
23
|
return e >= 0 && e <= 23;
|
@@ -32,31 +25,26 @@ var valueChecker = function valueChecker(info) {
|
|
32
25
|
return e >= 0 && e <= 59;
|
33
26
|
}, _checkerMap[index.TimePickerSelectorType.second] = function (e) {
|
34
27
|
return e >= 0 && e <= 59;
|
35
|
-
}, _checkerMap);
|
36
|
-
|
28
|
+
}, _checkerMap);
|
29
|
+
// 允许为空的情况
|
37
30
|
if (value === '') {
|
38
31
|
return true;
|
39
32
|
}
|
40
|
-
|
41
33
|
if (!value) {
|
42
34
|
return false;
|
43
35
|
}
|
44
|
-
|
45
36
|
var separateParts = value.split(':').filter(function (item) {
|
46
37
|
return !!item && item.length === 2;
|
47
38
|
}).map(function (item) {
|
48
39
|
return Number(item);
|
49
40
|
});
|
50
|
-
|
51
41
|
if (separateParts.length !== selectorTypes.length) {
|
52
42
|
return false;
|
53
43
|
}
|
54
|
-
|
55
44
|
var getMatchTypeValue = function getMatchTypeValue(selectorType) {
|
56
45
|
var matchIndex = selectorTypes.indexOf(selectorType);
|
57
46
|
return matchIndex >= 0 ? separateParts[matchIndex] : -1;
|
58
47
|
};
|
59
|
-
|
60
48
|
var disabledMap = (_disabledMap = {}, _disabledMap[index.TimePickerSelectorType.hour] = function () {
|
61
49
|
return filter.disabledHours(panelType);
|
62
50
|
}, _disabledMap[index.TimePickerSelectorType.minute] = function () {
|
@@ -65,22 +53,19 @@ var valueChecker = function valueChecker(info) {
|
|
65
53
|
return filter.disabledSeconds(getMatchTypeValue(index.TimePickerSelectorType.hour), getMatchTypeValue(index.TimePickerSelectorType.minute), panelType);
|
66
54
|
}, _disabledMap);
|
67
55
|
var stepMap = (_stepMap = {}, _stepMap[index.TimePickerSelectorType.hour] = step.hourStep, _stepMap[index.TimePickerSelectorType.minute] = step.minuteStep, _stepMap[index.TimePickerSelectorType.second] = step.secondStep, _stepMap);
|
68
|
-
|
69
56
|
for (var counter = 0; counter < separateParts.length; counter++) {
|
70
57
|
var type = selectorTypes[counter];
|
71
58
|
var stepNumber = stepMap[type];
|
72
59
|
var disabledNumbers = disabledMap[type]();
|
73
60
|
var checker = checkerMap[type];
|
74
|
-
var checkNumber = separateParts[counter];
|
61
|
+
var checkNumber = separateParts[counter];
|
62
|
+
// 不符合要求的数字
|
75
63
|
// 被禁用的数字
|
76
64
|
// 不符合 step 的数字
|
77
|
-
|
78
65
|
if (!checker(checkNumber) || disabledNumbers.includes(checkNumber) || checkNumber % stepNumber !== 0) {
|
79
66
|
return false;
|
80
67
|
}
|
81
68
|
}
|
82
|
-
|
83
69
|
return true;
|
84
70
|
};
|
85
|
-
|
86
71
|
exports.valueChecker = valueChecker;
|
package/lib/esm/@types/index.js
CHANGED
@@ -8,11 +8,9 @@
|
|
8
8
|
* LICENSE file in the root directory of this source tree.
|
9
9
|
*/
|
10
10
|
var TimePickerSelectorType;
|
11
|
-
|
12
11
|
(function (TimePickerSelectorType) {
|
13
12
|
TimePickerSelectorType[TimePickerSelectorType["hour"] = 1] = "hour";
|
14
13
|
TimePickerSelectorType[TimePickerSelectorType["minute"] = 2] = "minute";
|
15
14
|
TimePickerSelectorType[TimePickerSelectorType["second"] = 3] = "second";
|
16
15
|
})(TimePickerSelectorType || (TimePickerSelectorType = {}));
|
17
|
-
|
18
16
|
export { TimePickerSelectorType };
|
package/lib/esm/Input.js
CHANGED
@@ -14,42 +14,39 @@ import { disposeInputValue } from './utils/disposeInputValue.js';
|
|
14
14
|
import { useLocaleContext } from '@hi-ui/core';
|
15
15
|
var Input = /*#__PURE__*/forwardRef(function (props, ref) {
|
16
16
|
var _cx;
|
17
|
-
|
18
17
|
var prefix = props.prefix,
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
18
|
+
value = props.value,
|
19
|
+
format = props.format,
|
20
|
+
hourStep = props.hourStep,
|
21
|
+
minuteStep = props.minuteStep,
|
22
|
+
secondStep = props.secondStep,
|
23
|
+
disabledHours = props.disabledHours,
|
24
|
+
disabledMinutes = props.disabledMinutes,
|
25
|
+
disabledSeconds = props.disabledSeconds,
|
26
|
+
type = props.type,
|
27
|
+
placeholders = props.placeholders,
|
28
|
+
_onChange = props.onChange,
|
29
|
+
_onFocus = props.onFocus,
|
30
|
+
disabled = props.disabled,
|
31
|
+
onValidChange = props.onValidChange,
|
32
|
+
isFitContent = props.isFitContent,
|
33
|
+
size = props.size;
|
35
34
|
var i18n = useLocaleContext();
|
36
35
|
var toText = i18n.get('timePicker.to');
|
37
36
|
var componentClass = useMemo(function () {
|
38
37
|
return prefix + "__input";
|
39
38
|
}, [prefix]);
|
40
|
-
|
41
39
|
var _useState = useState(value),
|
42
|
-
|
43
|
-
|
44
|
-
|
40
|
+
cacheValue = _useState[0],
|
41
|
+
setCacheValue = _useState[1];
|
45
42
|
var getPanelType = useCallback(function (index) {
|
46
43
|
if (type === 'single') {
|
47
44
|
return 'single';
|
48
45
|
} else {
|
49
46
|
return index === 0 ? 'range-start' : 'range-end';
|
50
47
|
}
|
51
|
-
}, [type]);
|
52
|
-
|
48
|
+
}, [type]);
|
49
|
+
// 检查值是否合规
|
53
50
|
var validChecker = useCallback(function (checkValue, panelType) {
|
54
51
|
return valueChecker({
|
55
52
|
value: checkValue,
|
@@ -66,16 +63,14 @@ var Input = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
66
63
|
},
|
67
64
|
panelType: panelType
|
68
65
|
});
|
69
|
-
}, [hourStep, minuteStep, secondStep, disabledHours, disabledMinutes, disabledSeconds, format]);
|
70
|
-
|
66
|
+
}, [hourStep, minuteStep, secondStep, disabledHours, disabledMinutes, disabledSeconds, format]);
|
67
|
+
// 缓存同步外部
|
71
68
|
useEffect(function () {
|
72
69
|
setCacheValue(function (pre) {
|
73
70
|
var result = value.slice(0, type === 'single' ? 1 : 2);
|
74
|
-
|
75
71
|
if (result.join('') !== pre.join('')) {
|
76
72
|
return result;
|
77
73
|
}
|
78
|
-
|
79
74
|
return pre;
|
80
75
|
});
|
81
76
|
}, [value, type]);
|
@@ -83,7 +78,6 @@ var Input = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
83
78
|
var valueValid = disposeValue.every(function (item, index) {
|
84
79
|
return validChecker(item, getPanelType(index));
|
85
80
|
});
|
86
|
-
|
87
81
|
if (type === 'range' && valueValid) {
|
88
82
|
// 数据格式正确,检查范围数据
|
89
83
|
// 全为空字符串,则认为是合法的(还未选择)
|
@@ -91,9 +85,8 @@ var Input = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
91
85
|
return item === '';
|
92
86
|
})) {
|
93
87
|
return true;
|
94
|
-
}
|
95
|
-
|
96
|
-
|
88
|
+
}
|
89
|
+
// 结束时间要>开始时间
|
97
90
|
return disposeValue[1] > disposeValue[0];
|
98
91
|
} else {
|
99
92
|
return valueValid;
|
@@ -104,26 +97,22 @@ var Input = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
104
97
|
if (needValid === void 0) {
|
105
98
|
needValid = true;
|
106
99
|
}
|
107
|
-
|
108
100
|
var newValue = disposeInputValue(format, disposeValue);
|
109
101
|
var result = [].concat(cacheValue);
|
110
102
|
result[index] = newValue;
|
111
|
-
setCacheValue(result);
|
112
|
-
|
103
|
+
setCacheValue(result);
|
104
|
+
// 合法,则通知外部
|
113
105
|
if (!needValid || validChecker(newValue, getPanelType(index))) {
|
114
106
|
return [].concat(result);
|
115
107
|
}
|
116
|
-
|
117
108
|
return undefined;
|
118
109
|
};
|
119
|
-
|
120
110
|
return /*#__PURE__*/React.createElement("div", {
|
121
111
|
className: componentClass + "__wrapper"
|
122
112
|
}, /*#__PURE__*/React.createElement("input", {
|
123
113
|
className: componentClass + "__interact-area",
|
124
114
|
onChange: function onChange(e) {
|
125
115
|
var result = dispose(e.target.value);
|
126
|
-
|
127
116
|
if (result) {
|
128
117
|
_onChange(result);
|
129
118
|
}
|
@@ -137,8 +126,8 @@ var Input = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
137
126
|
}), /*#__PURE__*/React.createElement("div", {
|
138
127
|
className: componentClass + "__shadow-text"
|
139
128
|
}, matchValue || placeholders[index]));
|
140
|
-
}, [componentClass, disabled, placeholders, isFitContent, format, cacheValue, validChecker, getPanelType, _onChange, _onFocus]);
|
141
|
-
|
129
|
+
}, [componentClass, disabled, placeholders, isFitContent, format, cacheValue, validChecker, getPanelType, _onChange, _onFocus]);
|
130
|
+
// 通知外部,输入框内容合法性变更
|
142
131
|
useEffect(function () {
|
143
132
|
onValidChange(judgeIsValid(cacheValue));
|
144
133
|
}, [judgeIsValid, cacheValue, onValidChange]);
|
package/lib/esm/Panel.js
CHANGED
@@ -12,19 +12,18 @@ import { analysisFormat } from './utils/analysisFormat.js';
|
|
12
12
|
import { generateSelectorData } from './utils/generateSelectorData.js';
|
13
13
|
import { cx } from '@hi-ui/classname';
|
14
14
|
import { Selector, SelectorPosition } from './Selector.js';
|
15
|
-
|
16
15
|
var Panel = function Panel(props) {
|
17
16
|
var hourStep = props.hourStep,
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
17
|
+
secondStep = props.secondStep,
|
18
|
+
minuteStep = props.minuteStep,
|
19
|
+
disabledHours = props.disabledHours,
|
20
|
+
disabledMinutes = props.disabledMinutes,
|
21
|
+
disabledSeconds = props.disabledSeconds,
|
22
|
+
prefix = props.prefix,
|
23
|
+
format = props.format,
|
24
|
+
value = props.value,
|
25
|
+
panel = props.panel,
|
26
|
+
_onChange = props.onChange;
|
28
27
|
var componentPrefix = useMemo(function () {
|
29
28
|
return prefix + "__panel";
|
30
29
|
}, [prefix]);
|
@@ -55,7 +54,8 @@ var Panel = function Panel(props) {
|
|
55
54
|
selectorTypes: selectorTypes,
|
56
55
|
separateValue: separateValue
|
57
56
|
});
|
58
|
-
}, [disabledHours, disabledMinutes, disabledSeconds, secondStep, hourStep, minuteStep, panel, selectorTypes, separateValue]);
|
57
|
+
}, [disabledHours, disabledMinutes, disabledSeconds, secondStep, hourStep, minuteStep, panel, selectorTypes, separateValue]);
|
58
|
+
// const renderHeader = useCallback(() => {
|
59
59
|
// return (
|
60
60
|
// <div className={`${componentPrefix}__header`}>
|
61
61
|
// {selectorTypes.map((item) => (
|
@@ -66,21 +66,17 @@ var Panel = function Panel(props) {
|
|
66
66
|
// </div>
|
67
67
|
// )
|
68
68
|
// }, [selectorTypes, componentPrefix])
|
69
|
-
|
70
69
|
var renderSelectors = useCallback(function () {
|
71
70
|
return /*#__PURE__*/React.createElement("div", {
|
72
71
|
className: componentPrefix + "__selector-container"
|
73
72
|
}, selectorTypes.map(function (type, index) {
|
74
73
|
var _cx;
|
75
|
-
|
76
74
|
var position = selectorTypes.length === 1 ? SelectorPosition.single : SelectorPosition.middle;
|
77
|
-
|
78
75
|
if (selectorTypes.length > 1 && index === 0) {
|
79
76
|
position = SelectorPosition.left;
|
80
77
|
} else if (selectorTypes.length > 1 && index === selectorTypes.length - 1) {
|
81
78
|
position = SelectorPosition.right;
|
82
79
|
}
|
83
|
-
|
84
80
|
return /*#__PURE__*/React.createElement("div", {
|
85
81
|
className: componentPrefix + "__selector-content",
|
86
82
|
key: type
|
@@ -91,15 +87,13 @@ var Panel = function Panel(props) {
|
|
91
87
|
// itemHeight={itemHeight}
|
92
88
|
// fullDisplayItemNumber={fullDisplayItemNumber}
|
93
89
|
onChange: function onChange(e) {
|
94
|
-
var result = [].concat(separateValue).slice(0, selectorTypes.length);
|
90
|
+
var result = [].concat(separateValue).slice(0, selectorTypes.length);
|
91
|
+
// 如果 value = '',则代表为空值
|
95
92
|
// 此时选择任意项,其他项直接视作 0
|
96
|
-
|
97
93
|
if (value === '') {
|
98
94
|
result = [0, 0, 0].slice(0, selectorTypes.length);
|
99
95
|
}
|
100
|
-
|
101
96
|
result[index] = Number(e.id);
|
102
|
-
|
103
97
|
_onChange(result.map(function (item) {
|
104
98
|
return String(item).padStart(2, '0');
|
105
99
|
}).join(':'));
|
@@ -109,12 +103,12 @@ var Panel = function Panel(props) {
|
|
109
103
|
className: cx(componentPrefix + "__indicator", (_cx = {}, _cx[componentPrefix + "__indicator--left"] = index === 0, _cx[componentPrefix + "__indicator--right"] = index === selectorTypes.length - 1, _cx))
|
110
104
|
}));
|
111
105
|
}));
|
112
|
-
}, [selectorTypes, componentPrefix, prefix, getSelectorData, _onChange, separateValue,
|
106
|
+
}, [selectorTypes, componentPrefix, prefix, getSelectorData, _onChange, separateValue,
|
107
|
+
// itemHeight,
|
113
108
|
// fullDisplayItemNumber,
|
114
109
|
value]);
|
115
110
|
return /*#__PURE__*/React.createElement("div", {
|
116
111
|
className: componentPrefix
|
117
112
|
}, renderSelectors());
|
118
113
|
};
|
119
|
-
|
120
114
|
export { Panel };
|