bhd-components 0.9.4 → 0.9.5
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/README.md +2 -1
- package/dist/index.esm.es5.development.css +407 -399
- package/dist/index.esm.es5.development.js +294 -89
- package/dist/index.esm.es5.production.css +1 -1
- package/dist/index.esm.es5.production.js +1 -1
- package/dist/vendor.esm.es5.development.js +2 -2
- package/dist/vendor.esm.es5.production.js +2 -2
- package/es2017/bhdDatePicker/index.d.ts +3 -1
- package/es2017/bhdDatePicker/index.js +291 -86
- package/es2017/bhdDatePicker/index.module.less +37 -13
- package/esm/bhdDatePicker/index.d.ts +3 -1
- package/esm/bhdDatePicker/index.js +293 -89
- package/esm/bhdDatePicker/index.module.less +37 -13
- package/package.json +1 -1
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
|
|
2
2
|
import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
|
|
3
3
|
import { _ as _sliced_to_array } from "@swc/helpers/_/_sliced_to_array";
|
|
4
|
-
import { _ as _type_of } from "@swc/helpers/_/_type_of";
|
|
5
4
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@ice/jsx-runtime/jsx-runtime";
|
|
6
5
|
import * as React from "react";
|
|
7
|
-
import { useState, useEffect, useRef, useCallback } from "react";
|
|
6
|
+
import { useState, useEffect, useRef, useCallback, forwardRef, useImperativeHandle } from "react";
|
|
8
7
|
import styles from "./index.module.less";
|
|
9
8
|
import { ConfigProvider, Button, DatePicker } from "antd";
|
|
10
9
|
import { CustomArrow } from "../icons";
|
|
@@ -27,7 +26,7 @@ var months = [
|
|
|
27
26
|
"十二月"
|
|
28
27
|
];
|
|
29
28
|
//January_February_March_April_May_June_July_August_September_October_November_December
|
|
30
|
-
var BhdDatePicker = function(props) {
|
|
29
|
+
var BhdDatePicker = /*#__PURE__*/ forwardRef(function(props, ref) {
|
|
31
30
|
var lang = ConfigProvider.lang === "en" ? "en_US" : "zh_CN";
|
|
32
31
|
// if (lang === "en_US") {
|
|
33
32
|
// const enUS = require("dayjs/locale/en");
|
|
@@ -66,50 +65,87 @@ var BhdDatePicker = function(props) {
|
|
|
66
65
|
}
|
|
67
66
|
};
|
|
68
67
|
// 自己组件内使用的,或者自己处理的
|
|
69
|
-
var _props_kind = props.kind, kind = _props_kind === void 0 ? "single" : _props_kind, extraItems = props.extraItems, _props_extraReadonly = props.extraReadonly, extraReadonly = _props_extraReadonly === void 0 ? false : _props_extraReadonly, _props_useType = props.useType, useType = _props_useType === void 0 ? "" : _props_useType, _props_open = props.open, open = _props_open === void 0 ? false : _props_open, mode = props.mode, picker = props.picker,
|
|
68
|
+
var _props_kind = props.kind, kind = _props_kind === void 0 ? "single" : _props_kind, extraItems = props.extraItems, _props_extraReadonly = props.extraReadonly, extraReadonly = _props_extraReadonly === void 0 ? false : _props_extraReadonly, _props_useType = props.useType, useType = _props_useType === void 0 ? "" : _props_useType, _props_needConfirm = props.needConfirm, needConfirm = _props_needConfirm === void 0 ? true : _props_needConfirm, _props_open = props.open, open = _props_open === void 0 ? false : _props_open, mode = props.mode, picker = props.picker, value = props.value, _props_format = props.format, format = _props_format === void 0 ? getDefaultFormat() : _props_format, _props_presets = props.presets, presets = _props_presets === void 0 ? [] : _props_presets, className = props.className, popupClassName = props.popupClassName, dropdownClassName = props.dropdownClassName, showTime = props.showTime, _props_showNow = props.showNow, showNow = _props_showNow === void 0 ? true : _props_showNow, _props_showToday = props.showToday, showToday = _props_showToday === void 0 ? true : _props_showToday, _props_allowClear = props.allowClear, allowClear = _props_allowClear === void 0 ? true : _props_allowClear, onClick = props.onClick, onBlur = props.onBlur, onChange = props.onChange, onOk = props.onOk, // onCalendarChange,
|
|
69
|
+
onOpenChange = props.onOpenChange, onPanelChange = props.onPanelChange, disabledDate = props.disabledDate, cellRender = props.cellRender, renderExtraFooter = props.renderExtraFooter;
|
|
70
70
|
var bhdDatePickerRef = useRef(null);
|
|
71
|
+
var pickerRef = useRef(null);
|
|
71
72
|
var _useState = _sliced_to_array(useState(open), 2), panelOpen = _useState[0], setPanelOpen = _useState[1];
|
|
72
73
|
var _useState1 = _sliced_to_array(useState("date"), 2), panelMode = _useState1[0], setPanelMode = _useState1[1];
|
|
73
74
|
var _useState2 = _sliced_to_array(useState([
|
|
74
75
|
"date",
|
|
75
76
|
"date"
|
|
76
77
|
]), 2), rangePanelMode = _useState2[0], setRangePanelMode = _useState2[1];
|
|
77
|
-
var _useState3 = _sliced_to_array(useState(
|
|
78
|
-
var _useState4 = _sliced_to_array(useState(
|
|
79
|
-
var selectedDateRef = useRef(
|
|
80
|
-
var selectedDateStringRef = useRef(
|
|
81
|
-
var _useState5 = _sliced_to_array(useState(
|
|
82
|
-
|
|
83
|
-
|
|
78
|
+
var _useState3 = _sliced_to_array(useState(null), 2), selectedDate = _useState3[0], setSelectedDate = _useState3[1];
|
|
79
|
+
var _useState4 = _sliced_to_array(useState(""), 2), selectedDateString = _useState4[0], setSelectedDateString = _useState4[1];
|
|
80
|
+
var selectedDateRef = useRef(null);
|
|
81
|
+
var selectedDateStringRef = useRef("");
|
|
82
|
+
var _useState5 = _sliced_to_array(useState([
|
|
83
|
+
null,
|
|
84
|
+
null
|
|
85
|
+
]), 2), selectedRangeDate = _useState5[0], setSelectedRangeDate = _useState5[1];
|
|
86
|
+
var _useState6 = _sliced_to_array(useState([
|
|
87
|
+
"",
|
|
88
|
+
""
|
|
89
|
+
]), 2), selectedRangeDateString = _useState6[0], setSelectedRangeDateString = _useState6[1];
|
|
90
|
+
var selectedRangeDateRef = useRef([
|
|
91
|
+
null,
|
|
92
|
+
null
|
|
93
|
+
]);
|
|
94
|
+
var selectedRangeDateStringRef = useRef([
|
|
95
|
+
"",
|
|
96
|
+
""
|
|
97
|
+
]);
|
|
98
|
+
var _useState7 = _sliced_to_array(useState(false), 2), panelOpenChange = _useState7[0], setPanelOpenChange = _useState7[1]; // 用于失去焦点后,判断是否关闭
|
|
84
99
|
var isChange = useRef(false);
|
|
100
|
+
var selectRange = useRef([]);
|
|
101
|
+
useImperativeHandle(ref, function() {
|
|
102
|
+
return {};
|
|
103
|
+
});
|
|
85
104
|
useEffect(function() {
|
|
86
105
|
setDefaultMode();
|
|
87
|
-
if (kind === "range") {
|
|
88
|
-
if (selectedRangeDate[0] && selectedRangeDate[1]) {
|
|
89
|
-
setSelectedRangeDateString([
|
|
90
|
-
selectedRangeDate[0].format(format),
|
|
91
|
-
selectedRangeDate[1].format(format)
|
|
92
|
-
]);
|
|
93
|
-
}
|
|
94
|
-
} else {
|
|
95
|
-
if (selectedDate) {
|
|
96
|
-
setSelectedDateString(function(prevState) {
|
|
97
|
-
selectedDateStringRef.current = selectedDate.format(format);
|
|
98
|
-
return selectedDateStringRef.current;
|
|
99
|
-
});
|
|
100
|
-
}
|
|
101
|
-
}
|
|
102
106
|
return function() {
|
|
103
|
-
var _document_getElementsByClassName__getElementsByClassName, _document_getElementsByClassName_, _document_getElementsByClassName,
|
|
104
|
-
var
|
|
105
|
-
(
|
|
107
|
+
var _document_getElementsByClassName__getElementsByClassName, _document_getElementsByClassName_, _document_getElementsByClassName, _todayBtn, _document_getElementsByClassName__getElementsByClassName1, _document_getElementsByClassName_1, _document_getElementsByClassName1, _nowBtn;
|
|
108
|
+
var todayBtn = (_document_getElementsByClassName = document.getElementsByClassName(id)) === null || _document_getElementsByClassName === void 0 ? void 0 : (_document_getElementsByClassName_ = _document_getElementsByClassName[0]) === null || _document_getElementsByClassName_ === void 0 ? void 0 : (_document_getElementsByClassName__getElementsByClassName = _document_getElementsByClassName_.getElementsByClassName("bhd-picker-today-btn")) === null || _document_getElementsByClassName__getElementsByClassName === void 0 ? void 0 : _document_getElementsByClassName__getElementsByClassName[0];
|
|
109
|
+
(_todayBtn = todayBtn) === null || _todayBtn === void 0 ? void 0 : _todayBtn.removeEventListener("click", todayClick);
|
|
110
|
+
var nowBtn = (_document_getElementsByClassName1 = document.getElementsByClassName(id)) === null || _document_getElementsByClassName1 === void 0 ? void 0 : (_document_getElementsByClassName_1 = _document_getElementsByClassName1[0]) === null || _document_getElementsByClassName_1 === void 0 ? void 0 : (_document_getElementsByClassName__getElementsByClassName1 = _document_getElementsByClassName_1.getElementsByClassName("bhd-picker-now-btn")) === null || _document_getElementsByClassName__getElementsByClassName1 === void 0 ? void 0 : _document_getElementsByClassName__getElementsByClassName1[0];
|
|
111
|
+
(_nowBtn = nowBtn) === null || _nowBtn === void 0 ? void 0 : _nowBtn.removeEventListener("click", todayClick);
|
|
106
112
|
};
|
|
107
113
|
}, []);
|
|
108
114
|
useEffect(function() {
|
|
109
|
-
|
|
115
|
+
if (kind === "range") {
|
|
116
|
+
setSelectedRangeDate(function(prevState) {
|
|
117
|
+
selectedRangeDateRef.current = value || [
|
|
118
|
+
null,
|
|
119
|
+
null
|
|
120
|
+
];
|
|
121
|
+
return selectedRangeDateRef.current;
|
|
122
|
+
});
|
|
123
|
+
setSelectedRangeDateString(function(prevState) {
|
|
124
|
+
var _selectedRangeDateRef_current_, _selectedRangeDateRef_current_1;
|
|
125
|
+
selectedRangeDateStringRef.current = [
|
|
126
|
+
((_selectedRangeDateRef_current_ = selectedRangeDateRef.current[0]) === null || _selectedRangeDateRef_current_ === void 0 ? void 0 : _selectedRangeDateRef_current_.format(format)) || "",
|
|
127
|
+
((_selectedRangeDateRef_current_1 = selectedRangeDateRef.current[1]) === null || _selectedRangeDateRef_current_1 === void 0 ? void 0 : _selectedRangeDateRef_current_1.format(format)) || ""
|
|
128
|
+
];
|
|
129
|
+
return selectedRangeDateStringRef.current;
|
|
130
|
+
});
|
|
131
|
+
} else {
|
|
132
|
+
setSelectedDate(function(prevState) {
|
|
133
|
+
selectedDateRef.current = value || null;
|
|
134
|
+
return selectedDateRef.current;
|
|
135
|
+
});
|
|
136
|
+
setSelectedDateString(function(prevState) {
|
|
137
|
+
var _selectedDateRef_current;
|
|
138
|
+
selectedDateStringRef.current = ((_selectedDateRef_current = selectedDateRef.current) === null || _selectedDateRef_current === void 0 ? void 0 : _selectedDateRef_current.format(format)) || "";
|
|
139
|
+
return selectedDateStringRef.current;
|
|
140
|
+
});
|
|
141
|
+
}
|
|
142
|
+
}, [
|
|
143
|
+
value
|
|
144
|
+
]);
|
|
145
|
+
useEffect(function() {
|
|
146
|
+
setPanelOpen(open);
|
|
110
147
|
}, [
|
|
111
|
-
|
|
112
|
-
selectedRangeDate
|
|
148
|
+
open
|
|
113
149
|
]);
|
|
114
150
|
// 传给 DatePicker 的props参数
|
|
115
151
|
var getConfig = function() {
|
|
@@ -140,6 +176,7 @@ var BhdDatePicker = function(props) {
|
|
|
140
176
|
popupClassName: popupClassName,
|
|
141
177
|
allowClear: allowClear,
|
|
142
178
|
showTime: showTime,
|
|
179
|
+
showToday: showToday,
|
|
143
180
|
cellRender: cellRender,
|
|
144
181
|
renderExtraFooter: selfRenderExtraFooter
|
|
145
182
|
});
|
|
@@ -153,10 +190,19 @@ var BhdDatePicker = function(props) {
|
|
|
153
190
|
delete config.onChange;
|
|
154
191
|
delete config.useType; // 组件自己定义的
|
|
155
192
|
delete config.presets; // 必须删掉,因为预设由官网的左侧换到底部
|
|
156
|
-
delete config.
|
|
193
|
+
delete config.dropdownClassName;
|
|
157
194
|
if (!config.cellRender) {
|
|
158
195
|
config.cellRender = selfCellRender;
|
|
159
196
|
}
|
|
197
|
+
// 判断是否显示今天按钮
|
|
198
|
+
if (!isRenderToday()) {
|
|
199
|
+
config.showToday = false;
|
|
200
|
+
showToday = false;
|
|
201
|
+
}
|
|
202
|
+
// 不显示今天、预设、确定按钮
|
|
203
|
+
if (!isSelfRenderExtraFooter()) {
|
|
204
|
+
delete config.renderExtraFooter;
|
|
205
|
+
}
|
|
160
206
|
// 单选
|
|
161
207
|
if (kind === "single") {
|
|
162
208
|
config.popupClassName = "\n ".concat(styles.bhdDatePickerPopup, " ").concat(styles.singlePicker, " ").concat(popupClassName || "", " ").concat(showTime ? styles.showTime : "", " ").concat(renderExtraFooter ? styles.showExtraFooter : "");
|
|
@@ -174,7 +220,7 @@ var BhdDatePicker = function(props) {
|
|
|
174
220
|
config.allowClear = false; // 日程安排查看时,不显示清除按钮
|
|
175
221
|
}
|
|
176
222
|
}
|
|
177
|
-
config.popupClassName = "".concat(config.popupClassName, " ").concat(id);
|
|
223
|
+
config.popupClassName = "".concat(config.popupClassName, " ").concat(dropdownClassName, " ").concat(needConfirm ? "" : styles.noNeedConfirm, " ").concat(id);
|
|
178
224
|
return config;
|
|
179
225
|
};
|
|
180
226
|
// 设置默认mode
|
|
@@ -249,25 +295,24 @@ var BhdDatePicker = function(props) {
|
|
|
249
295
|
};
|
|
250
296
|
// 渲染底部扩展内容(包括确定按钮、今天按钮、预设、传入的底部扩展)
|
|
251
297
|
var selfRenderExtraFooter = function(mode) {
|
|
252
|
-
var _selectedRangeDate, _selectedRangeDate1;
|
|
298
|
+
var _selectedRangeDate, _selectedRangeDate1, _selectedRangeDate2, _selectedRangeDate3;
|
|
253
299
|
return /*#__PURE__*/ _jsxs(_Fragment, {
|
|
254
300
|
children: [
|
|
255
|
-
renderExtraFooter && /*#__PURE__*/ _jsx("div", {
|
|
256
|
-
className: "bhddatepicker-picker-footer-extra-extend",
|
|
257
|
-
children: renderExtraFooter(mode)
|
|
258
|
-
}),
|
|
259
301
|
!showTime ? /*#__PURE__*/ _jsx(_Fragment, {
|
|
260
|
-
children: /*#__PURE__*/ _jsxs("ul", {
|
|
302
|
+
children: ((picker || "date") === "date" && showToday || presets && presets.length > 0 || needConfirm) && /*#__PURE__*/ _jsxs("ul", {
|
|
261
303
|
className: "bhd-picker-ranges",
|
|
262
304
|
children: [
|
|
263
305
|
selfRenderPresets(),
|
|
264
|
-
renderToday(),
|
|
265
|
-
/*#__PURE__*/ _jsx("li", {
|
|
306
|
+
renderToday(mode),
|
|
307
|
+
needConfirm && /*#__PURE__*/ _jsx("li", {
|
|
266
308
|
className: "bhd-picker-ok",
|
|
267
309
|
children: /*#__PURE__*/ _jsx(Button, {
|
|
268
310
|
type: "primary",
|
|
269
311
|
disabled: kind === "range" ? !(((_selectedRangeDate = selectedRangeDate) === null || _selectedRangeDate === void 0 ? void 0 : _selectedRangeDate[0]) && ((_selectedRangeDate1 = selectedRangeDate) === null || _selectedRangeDate1 === void 0 ? void 0 : _selectedRangeDate1[1])) : !(selectedDate && selectedDateString),
|
|
270
|
-
|
|
312
|
+
className: "".concat((kind === "range" ? !(((_selectedRangeDate2 = selectedRangeDate) === null || _selectedRangeDate2 === void 0 ? void 0 : _selectedRangeDate2[0]) && ((_selectedRangeDate3 = selectedRangeDate) === null || _selectedRangeDate3 === void 0 ? void 0 : _selectedRangeDate3[1])) : !(selectedDate && selectedDateString)) ? "disabled" : ""),
|
|
313
|
+
onClick: function() {
|
|
314
|
+
okClick();
|
|
315
|
+
},
|
|
271
316
|
children: i18Conversion("确定")
|
|
272
317
|
})
|
|
273
318
|
})
|
|
@@ -276,46 +321,92 @@ var BhdDatePicker = function(props) {
|
|
|
276
321
|
}) : /*#__PURE__*/ _jsx("ul", {
|
|
277
322
|
className: "bhd-picker-ranges showPresets ".concat(showNow ? "showNow" : ""),
|
|
278
323
|
children: selfRenderPresets()
|
|
324
|
+
}),
|
|
325
|
+
renderExtraFooter && /*#__PURE__*/ _jsx("div", {
|
|
326
|
+
className: "bhddatepicker-picker-footer-extra-extend",
|
|
327
|
+
children: renderExtraFooter(mode)
|
|
279
328
|
})
|
|
280
329
|
]
|
|
281
330
|
});
|
|
282
331
|
};
|
|
283
|
-
//
|
|
284
|
-
var
|
|
285
|
-
|
|
332
|
+
// 判断是否显示今天按钮、预设、确定按钮、传入的底部扩展
|
|
333
|
+
var isSelfRenderExtraFooter = function() {
|
|
334
|
+
var result = false;
|
|
335
|
+
if (kind === "range") {
|
|
336
|
+
result = presets && presets.length > 0 || renderExtraFooter || needConfirm;
|
|
337
|
+
} else {
|
|
338
|
+
result = isRenderToday() || presets && presets.length > 0 || renderExtraFooter || needConfirm;
|
|
339
|
+
}
|
|
340
|
+
return result;
|
|
341
|
+
};
|
|
342
|
+
//判断是否显示今天按钮
|
|
343
|
+
var isRenderToday = function() {
|
|
286
344
|
if (showToday) {
|
|
287
|
-
|
|
345
|
+
if (kind === "single" && panelMode === "date") {
|
|
346
|
+
return true;
|
|
347
|
+
}
|
|
288
348
|
// 日程安排时: extraItems中今天是否是可选或者已选择状态
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
if (
|
|
295
|
-
return
|
|
296
|
-
className: "bhd-picker-now",
|
|
297
|
-
children: /*#__PURE__*/ _jsx("a", {
|
|
298
|
-
className: "bhd-picker-now-btn",
|
|
299
|
-
style: {
|
|
300
|
-
visibility: "hidden"
|
|
301
|
-
},
|
|
302
|
-
onClick: todayClick,
|
|
303
|
-
children: i18Conversion("今天")
|
|
304
|
-
})
|
|
305
|
-
});
|
|
349
|
+
if (kind === "extra") {
|
|
350
|
+
var _extraItems;
|
|
351
|
+
var hasToday = ((_extraItems = extraItems) === null || _extraItems === void 0 ? void 0 : _extraItems.filter(function(item) {
|
|
352
|
+
return item.status !== "noselectable" && item.date.format("YYYYMMDD") === getToday();
|
|
353
|
+
}).length) > 0;
|
|
354
|
+
if (hasToday && panelMode === "date") {
|
|
355
|
+
return true;
|
|
306
356
|
}
|
|
307
357
|
}
|
|
308
358
|
}
|
|
309
|
-
return
|
|
359
|
+
return false;
|
|
360
|
+
};
|
|
361
|
+
// 渲染今天
|
|
362
|
+
var renderToday = function(mode) {
|
|
363
|
+
// // 显示Today
|
|
364
|
+
// if (showToday) {
|
|
365
|
+
// // 日程安排时: extraItems中今天是否是可选或者已选择状态
|
|
366
|
+
// let hasNow =
|
|
367
|
+
// extraItems?.filter(
|
|
368
|
+
// (item) =>
|
|
369
|
+
// item.status !== "noselectable" &&
|
|
370
|
+
// // item.date.format(format) === dayjs().format(format)
|
|
371
|
+
// item.date.format("YYYYMMDD") === getToday()
|
|
372
|
+
// ).length > 0;
|
|
373
|
+
// if (kind === "single" || (kind === "extra" && hasNow)) {
|
|
374
|
+
// if (mode === "date") {
|
|
375
|
+
// return (
|
|
376
|
+
// <li className="bhd-picker-now">
|
|
377
|
+
// <a
|
|
378
|
+
// className="bhd-picker-now-btn"
|
|
379
|
+
// style={{ visibility: "hidden" }}
|
|
380
|
+
// onClick={todayClick}
|
|
381
|
+
// >
|
|
382
|
+
// {i18Conversion("今天")}
|
|
383
|
+
// </a>
|
|
384
|
+
// </li>
|
|
385
|
+
// );
|
|
386
|
+
// }
|
|
387
|
+
// }
|
|
388
|
+
// }
|
|
389
|
+
// return null;
|
|
390
|
+
return isRenderToday() ? /*#__PURE__*/ _jsx("li", {
|
|
391
|
+
className: "bhd-picker-now",
|
|
392
|
+
children: /*#__PURE__*/ _jsx("a", {
|
|
393
|
+
className: "bhd-picker-now-btn",
|
|
394
|
+
style: {
|
|
395
|
+
visibility: "hidden"
|
|
396
|
+
},
|
|
397
|
+
onClick: todayClick,
|
|
398
|
+
children: i18Conversion("今天")
|
|
399
|
+
})
|
|
400
|
+
}) : null;
|
|
310
401
|
};
|
|
311
402
|
// 获取到年月日
|
|
312
403
|
var getToday = function() {
|
|
313
404
|
var date = new Date();
|
|
314
|
-
return date.getFullYear().toString() + date.getMonth().toString().padStart(2, "0") + date.
|
|
405
|
+
return date.getFullYear().toString() + (date.getMonth() + 1).toString().padStart(2, "0") + date.getDate().toString().padStart(2, "0");
|
|
315
406
|
};
|
|
316
407
|
// 渲染预设
|
|
317
408
|
var selfRenderPresets = function() {
|
|
318
|
-
return /*#__PURE__*/ _jsx("li", {
|
|
409
|
+
return presets && presets.length > 0 ? /*#__PURE__*/ _jsx("li", {
|
|
319
410
|
className: "bhd-picker-presets",
|
|
320
411
|
children: presets.map(function(item, index) {
|
|
321
412
|
return /*#__PURE__*/ _jsx("a", {
|
|
@@ -326,20 +417,31 @@ var BhdDatePicker = function(props) {
|
|
|
326
417
|
children: item.label
|
|
327
418
|
}, index);
|
|
328
419
|
})
|
|
329
|
-
});
|
|
420
|
+
}) : null;
|
|
330
421
|
};
|
|
331
422
|
// 日期选择确认
|
|
332
423
|
var okClick = function() {
|
|
333
424
|
if (kind === "range") {
|
|
334
|
-
|
|
335
|
-
|
|
425
|
+
var _selectedRangeDateRef_current, _selectedRangeDateRef_current1, _selectedRangeDateStringRef_current, _selectedRangeDateStringRef_current1;
|
|
426
|
+
if (((_selectedRangeDateRef_current = selectedRangeDateRef.current) === null || _selectedRangeDateRef_current === void 0 ? void 0 : _selectedRangeDateRef_current[0]) && ((_selectedRangeDateRef_current1 = selectedRangeDateRef.current) === null || _selectedRangeDateRef_current1 === void 0 ? void 0 : _selectedRangeDateRef_current1[1]) && ((_selectedRangeDateStringRef_current = selectedRangeDateStringRef.current) === null || _selectedRangeDateStringRef_current === void 0 ? void 0 : _selectedRangeDateStringRef_current[0]) && ((_selectedRangeDateStringRef_current1 = selectedRangeDateStringRef.current) === null || _selectedRangeDateStringRef_current1 === void 0 ? void 0 : _selectedRangeDateStringRef_current1[1])) {
|
|
427
|
+
if (isChange.current) {
|
|
428
|
+
onChange && onChange(selectedRangeDateRef.current, selectedRangeDateStringRef.current);
|
|
429
|
+
isChange.current = false;
|
|
430
|
+
// if (pickerRef.current) {
|
|
431
|
+
// pickerRef.current.blur();
|
|
432
|
+
// }
|
|
433
|
+
}
|
|
336
434
|
setPanelOpen(false);
|
|
337
|
-
} else {
|
|
338
|
-
setPanelOpen(true);
|
|
339
435
|
}
|
|
340
436
|
} else {
|
|
341
437
|
if (selectedDateRef.current && selectedDateStringRef.current) {
|
|
342
|
-
|
|
438
|
+
if (isChange.current) {
|
|
439
|
+
onChange && onChange(selectedDateRef.current, selectedDateStringRef.current);
|
|
440
|
+
isChange.current = false;
|
|
441
|
+
// if (pickerRef.current) {
|
|
442
|
+
// pickerRef.current.blur();
|
|
443
|
+
// }
|
|
444
|
+
}
|
|
343
445
|
setPanelOpen(false);
|
|
344
446
|
}
|
|
345
447
|
}
|
|
@@ -364,17 +466,36 @@ var BhdDatePicker = function(props) {
|
|
|
364
466
|
}
|
|
365
467
|
}
|
|
366
468
|
};
|
|
469
|
+
var nowClickEventListener = function(value) {
|
|
470
|
+
if (!value) return;
|
|
471
|
+
if (showTime) {
|
|
472
|
+
var _document_getElementsByClassName__getElementsByClassName, _document_getElementsByClassName_, _document_getElementsByClassName;
|
|
473
|
+
var btn = (_document_getElementsByClassName = document.getElementsByClassName(id)) === null || _document_getElementsByClassName === void 0 ? void 0 : (_document_getElementsByClassName_ = _document_getElementsByClassName[0]) === null || _document_getElementsByClassName_ === void 0 ? void 0 : (_document_getElementsByClassName__getElementsByClassName = _document_getElementsByClassName_.getElementsByClassName("bhd-picker-now-btn")) === null || _document_getElementsByClassName__getElementsByClassName === void 0 ? void 0 : _document_getElementsByClassName__getElementsByClassName[0];
|
|
474
|
+
if (value) {
|
|
475
|
+
var _btn, _btn1;
|
|
476
|
+
(_btn = btn) === null || _btn === void 0 ? void 0 : _btn.removeEventListener("click", todayClick);
|
|
477
|
+
(_btn1 = btn) === null || _btn1 === void 0 ? void 0 : _btn1.addEventListener("click", todayClick, {
|
|
478
|
+
once: true
|
|
479
|
+
});
|
|
480
|
+
}
|
|
481
|
+
}
|
|
482
|
+
};
|
|
367
483
|
//预设点击
|
|
368
484
|
var presetClick = function(info) {
|
|
369
|
-
console.log(_type_of(info.value));
|
|
370
485
|
var value = typeof info.value === "function" ? info.value() : info.value;
|
|
371
486
|
if (kind === "range") {
|
|
372
487
|
var valueString = [
|
|
373
488
|
value[0].format(format),
|
|
374
489
|
value[1].format(format)
|
|
375
490
|
];
|
|
376
|
-
setSelectedRangeDate(
|
|
377
|
-
|
|
491
|
+
setSelectedRangeDate(function(prevState) {
|
|
492
|
+
selectedRangeDateRef.current = value;
|
|
493
|
+
return selectedRangeDateRef.current;
|
|
494
|
+
});
|
|
495
|
+
setSelectedRangeDateString(function(prevState) {
|
|
496
|
+
selectedRangeDateStringRef.current = valueString;
|
|
497
|
+
return selectedRangeDateStringRef.current;
|
|
498
|
+
});
|
|
378
499
|
onChange && onChange(value, valueString);
|
|
379
500
|
setPanelOpen(false);
|
|
380
501
|
} else {
|
|
@@ -397,6 +518,7 @@ var BhdDatePicker = function(props) {
|
|
|
397
518
|
children: [
|
|
398
519
|
(kind === "single" || kind === "extra") && /*#__PURE__*/ _jsx(_Fragment, {
|
|
399
520
|
children: /*#__PURE__*/ _jsx(DatePicker, _object_spread_props(_object_spread({}, getConfig()), {
|
|
521
|
+
ref: pickerRef,
|
|
400
522
|
id: id,
|
|
401
523
|
value: selectedDate,
|
|
402
524
|
mode: panelMode,
|
|
@@ -407,10 +529,12 @@ var BhdDatePicker = function(props) {
|
|
|
407
529
|
onPanelChange && onPanelChange(value, mode);
|
|
408
530
|
},
|
|
409
531
|
onOpenChange: function(value) {
|
|
532
|
+
setPanelOpenChange(value);
|
|
410
533
|
// 打开设置默认mode
|
|
411
534
|
if (value) {
|
|
412
535
|
setDefaultMode();
|
|
413
536
|
todayClickEventListener(value);
|
|
537
|
+
nowClickEventListener(value);
|
|
414
538
|
}
|
|
415
539
|
onOpenChange && onOpenChange(value);
|
|
416
540
|
},
|
|
@@ -423,6 +547,12 @@ var BhdDatePicker = function(props) {
|
|
|
423
547
|
selectedDateStringRef.current = dateString;
|
|
424
548
|
return selectedDateStringRef.current;
|
|
425
549
|
});
|
|
550
|
+
isChange.current = true;
|
|
551
|
+
if (!needConfirm) {
|
|
552
|
+
setTimeout(function() {
|
|
553
|
+
okClick();
|
|
554
|
+
}, 0);
|
|
555
|
+
}
|
|
426
556
|
},
|
|
427
557
|
onOk: function(date) {
|
|
428
558
|
if (showTime) {
|
|
@@ -438,14 +568,27 @@ var BhdDatePicker = function(props) {
|
|
|
438
568
|
onClick && onClick(e);
|
|
439
569
|
},
|
|
440
570
|
onBlur: function(e) {
|
|
441
|
-
|
|
442
|
-
|
|
571
|
+
if (needConfirm) {
|
|
572
|
+
var _e_relatedTarget_classList, _e_relatedTarget;
|
|
573
|
+
okClick(); // 面板区域内失去焦点时
|
|
574
|
+
if ((_e_relatedTarget = e.relatedTarget) === null || _e_relatedTarget === void 0 ? void 0 : (_e_relatedTarget_classList = _e_relatedTarget.classList) === null || _e_relatedTarget_classList === void 0 ? void 0 : _e_relatedTarget_classList.value.includes("bhd-picker-panel")) {
|
|
575
|
+
if (pickerRef.current) {
|
|
576
|
+
pickerRef.current.focus();
|
|
577
|
+
}
|
|
578
|
+
setPanelOpen(true);
|
|
579
|
+
} else {
|
|
580
|
+
setPanelOpen(false);
|
|
581
|
+
}
|
|
582
|
+
} else {
|
|
583
|
+
setPanelOpen(false);
|
|
584
|
+
}
|
|
443
585
|
onBlur && onBlur(e);
|
|
444
586
|
}
|
|
445
587
|
}))
|
|
446
588
|
}),
|
|
447
589
|
kind === "range" && /*#__PURE__*/ _jsx(_Fragment, {
|
|
448
590
|
children: /*#__PURE__*/ _jsx(RangePicker, _object_spread_props(_object_spread({}, getConfig()), {
|
|
591
|
+
ref: pickerRef,
|
|
449
592
|
value: selectedRangeDate,
|
|
450
593
|
mode: rangePanelMode,
|
|
451
594
|
open: panelOpen,
|
|
@@ -455,31 +598,92 @@ var BhdDatePicker = function(props) {
|
|
|
455
598
|
onPanelChange && onPanelChange(value, mode);
|
|
456
599
|
},
|
|
457
600
|
onOpenChange: function(value) {
|
|
601
|
+
setPanelOpenChange(value);
|
|
458
602
|
if (value) {
|
|
459
603
|
setDefaultMode();
|
|
460
604
|
}
|
|
461
605
|
if (showTime) {
|
|
462
606
|
setPanelOpen(value);
|
|
463
607
|
}
|
|
464
|
-
setRangeOpenChange(value);
|
|
465
608
|
onOpenChange && onOpenChange(value);
|
|
466
609
|
},
|
|
467
610
|
onClick: function(e) {
|
|
468
611
|
setPanelOpen(true);
|
|
612
|
+
selectRange.current = [];
|
|
469
613
|
onClick && onClick(e);
|
|
470
614
|
},
|
|
615
|
+
onChange: function(dates, dateStrings) {
|
|
616
|
+
// 清空的时候
|
|
617
|
+
if (dates === null) {
|
|
618
|
+
setSelectedRangeDate(function(prevState) {
|
|
619
|
+
selectedRangeDateRef.current = [
|
|
620
|
+
null,
|
|
621
|
+
null
|
|
622
|
+
];
|
|
623
|
+
return selectedRangeDateRef.current;
|
|
624
|
+
});
|
|
625
|
+
setSelectedRangeDateString(function(prevState) {
|
|
626
|
+
selectedRangeDateStringRef.current = [
|
|
627
|
+
"",
|
|
628
|
+
""
|
|
629
|
+
];
|
|
630
|
+
return selectedRangeDateStringRef.current;
|
|
631
|
+
});
|
|
632
|
+
setPanelOpen(false);
|
|
633
|
+
onChange && onChange([
|
|
634
|
+
null,
|
|
635
|
+
null
|
|
636
|
+
], [
|
|
637
|
+
"",
|
|
638
|
+
""
|
|
639
|
+
]);
|
|
640
|
+
}
|
|
641
|
+
},
|
|
471
642
|
onCalendarChange: function(dates, dateStrings, info) {
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
643
|
+
var _dates, _dates1;
|
|
644
|
+
setSelectedRangeDate(function(prevState) {
|
|
645
|
+
selectedRangeDateRef.current = dates;
|
|
646
|
+
return selectedRangeDateRef.current;
|
|
647
|
+
});
|
|
648
|
+
setSelectedRangeDateString(function(prevState) {
|
|
649
|
+
selectedRangeDateStringRef.current = dateStrings;
|
|
650
|
+
return selectedRangeDateStringRef.current;
|
|
651
|
+
});
|
|
652
|
+
if (!selectRange.current.includes(info.range)) {
|
|
653
|
+
selectRange.current.push(info.range);
|
|
654
|
+
}
|
|
655
|
+
if (((_dates = dates) === null || _dates === void 0 ? void 0 : _dates[0]) && ((_dates1 = dates) === null || _dates1 === void 0 ? void 0 : _dates1[1])) {
|
|
656
|
+
//不用确认自动提交
|
|
657
|
+
if (!needConfirm) {
|
|
658
|
+
if (selectRange.current.includes("start") && selectRange.current.includes("end")) {
|
|
659
|
+
isChange.current = true;
|
|
660
|
+
setTimeout(function() {
|
|
661
|
+
okClick();
|
|
662
|
+
}, 0);
|
|
663
|
+
}
|
|
664
|
+
} else {
|
|
665
|
+
isChange.current = true;
|
|
666
|
+
}
|
|
667
|
+
}
|
|
475
668
|
},
|
|
476
669
|
onBlur: function(e) {
|
|
477
|
-
|
|
478
|
-
if (
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
670
|
+
console.log(panelOpenChange);
|
|
671
|
+
if (needConfirm) {
|
|
672
|
+
var _selectedRangeDateRef_current, _selectedRangeDateRef_current1, _selectedRangeDateRef_current2, _selectedRangeDateRef_current3;
|
|
673
|
+
if (((_selectedRangeDateRef_current = selectedRangeDateRef.current) === null || _selectedRangeDateRef_current === void 0 ? void 0 : _selectedRangeDateRef_current[0]) && ((_selectedRangeDateRef_current1 = selectedRangeDateRef.current) === null || _selectedRangeDateRef_current1 === void 0 ? void 0 : _selectedRangeDateRef_current1[1])) {
|
|
674
|
+
if (needConfirm && !panelOpenChange && isChange.current) {
|
|
675
|
+
okClick();
|
|
676
|
+
} else {
|
|
677
|
+
setPanelOpen(panelOpenChange);
|
|
678
|
+
}
|
|
679
|
+
if (!isChange.current) {
|
|
680
|
+
setPanelOpen(false);
|
|
681
|
+
}
|
|
682
|
+
} else if (!((_selectedRangeDateRef_current2 = selectedRangeDateRef.current) === null || _selectedRangeDateRef_current2 === void 0 ? void 0 : _selectedRangeDateRef_current2[0]) || !((_selectedRangeDateRef_current3 = selectedRangeDateRef.current) === null || _selectedRangeDateRef_current3 === void 0 ? void 0 : _selectedRangeDateRef_current3[1])) {
|
|
683
|
+
setPanelOpen(panelOpenChange);
|
|
684
|
+
}
|
|
685
|
+
} else {
|
|
686
|
+
setPanelOpen(panelOpenChange);
|
|
483
687
|
}
|
|
484
688
|
onBlur && onBlur(e);
|
|
485
689
|
}
|
|
@@ -487,5 +691,5 @@ var BhdDatePicker = function(props) {
|
|
|
487
691
|
})
|
|
488
692
|
]
|
|
489
693
|
});
|
|
490
|
-
};
|
|
694
|
+
});
|
|
491
695
|
export default BhdDatePicker;
|