@nutui/nutui-react 2.3.12-beta.0 → 2.3.12
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 +18 -0
- package/dist/esm/ActionSheet.js +30 -76
- package/dist/esm/Address.js +80 -171
- package/dist/esm/Animate.js +21 -49
- package/dist/esm/AnimatingNumbers.js +47 -120
- package/dist/esm/Audio.js +88 -159
- package/dist/esm/Avatar.js +44 -91
- package/dist/esm/AvatarCropper.js +149 -268
- package/dist/esm/AvatarGroup.js +13 -44
- package/dist/esm/BackTop.js +34 -75
- package/dist/esm/Barrage.js +49 -83
- package/dist/esm/Calendar.js +27 -119
- package/dist/esm/CalendarCard.js +180 -291
- package/dist/esm/CalendarItem.js +253 -314
- package/dist/esm/Card.js +38 -72
- package/dist/esm/Cell.js +27 -62
- package/dist/esm/CellGroup.js +16 -45
- package/dist/esm/CheckboxGroup.js +49 -85
- package/dist/esm/CircleProgress.js +42 -93
- package/dist/esm/Col.js +17 -48
- package/dist/esm/Collapse.js +18 -49
- package/dist/esm/ConfigProvider.js +3 -2
- package/dist/esm/CountDown.js +62 -101
- package/dist/esm/DatePicker.js +87 -127
- package/dist/esm/Dialog.js +116 -196
- package/dist/esm/Divider.js +16 -36
- package/dist/esm/Drag.js +32 -76
- package/dist/esm/Elevator.js +93 -133
- package/dist/esm/Ellipsis.js +71 -92
- package/dist/esm/Empty.js +31 -70
- package/dist/esm/FixedNav.js +32 -81
- package/dist/esm/Form.js +28 -61
- package/dist/esm/Grid.js +27 -51
- package/dist/esm/Image.js +47 -102
- package/dist/esm/ImagePreview.js +82 -135
- package/dist/esm/InfiniteLoading.js +77 -159
- package/dist/esm/Input.js +57 -125
- package/dist/esm/InputNumber.js +66 -96
- package/dist/esm/Layout.js +4 -28
- package/dist/esm/Loading.js +13 -40
- package/dist/esm/Menu.js +51 -105
- package/dist/esm/NavBar.js +46 -85
- package/dist/esm/NoticeBar.js +153 -226
- package/dist/esm/Notify.js +87 -178
- package/dist/esm/NumberKeyboard.js +84 -150
- package/dist/esm/Pagination.js +58 -97
- package/dist/esm/Picker.js +215 -276
- package/dist/esm/Popover.js +111 -159
- package/dist/esm/Price.js +23 -60
- package/dist/esm/Progress.js +47 -77
- package/dist/esm/PullToRefresh.js +94 -201
- package/dist/esm/RadioGroup.js +23 -53
- package/dist/esm/Range.js +113 -177
- package/dist/esm/Rate.js +48 -95
- package/dist/esm/Row.js +19 -43
- package/dist/esm/SearchBar.js +52 -119
- package/dist/esm/ShortPassword.js +58 -106
- package/dist/esm/SideNavBar.js +34 -59
- package/dist/esm/SideNavBarItem.js +7 -36
- package/dist/esm/Signature.js +49 -84
- package/dist/esm/Skeleton.js +31 -68
- package/dist/esm/Space.js +7 -34
- package/dist/esm/Step.js +35 -64
- package/dist/esm/Steps.js +16 -40
- package/dist/esm/Sticky.js +64 -108
- package/dist/esm/SubSideNavBar.js +42 -71
- package/dist/esm/Swipe.js +79 -143
- package/dist/esm/Swiper.js +136 -183
- package/dist/esm/SwiperItem.js +13 -38
- package/dist/esm/Switch.js +20 -53
- package/dist/esm/TabPane.js +6 -30
- package/dist/esm/Tabbar.js +29 -59
- package/dist/esm/Table.js +92 -141
- package/dist/esm/Tag.js +30 -74
- package/dist/esm/TextArea.js +37 -82
- package/dist/esm/TimeDetail.js +20 -58
- package/dist/esm/TimeSelect.js +57 -95
- package/dist/esm/Toast.js +110 -197
- package/dist/esm/Tour.js +88 -132
- package/dist/esm/TrendArrow.js +32 -74
- package/dist/esm/Uploader.js +226 -346
- package/dist/esm/UserContext.js +1 -1
- package/dist/esm/Video.js +34 -67
- package/dist/esm/VirtualList.js +127 -160
- package/dist/esm/WaterMark.js +24 -68
- package/dist/esm/badge2.js +23 -53
- package/dist/esm/button2.js +30 -63
- package/dist/esm/can-use-dom.js +1 -1
- package/dist/esm/cascader2.js +307 -536
- package/dist/esm/checkbox2.js +59 -96
- package/dist/esm/collapseitem2.js +48 -86
- package/dist/esm/configprovider2.js +43 -1003
- package/dist/esm/context.js +1 -1
- package/dist/esm/context2.js +1 -1
- package/dist/esm/context3.js +1 -1
- package/dist/esm/context4.js +1 -1
- package/dist/esm/context5.js +8 -8
- package/dist/esm/date.js +88 -66
- package/dist/esm/formitem2.js +236 -1510
- package/dist/esm/get-scroll-parent.js +8 -10
- package/dist/esm/griditem2.js +34 -52
- package/dist/esm/index.js +5 -12
- package/dist/esm/indicator2.js +13 -42
- package/dist/esm/menuitem2.js +81 -124
- package/dist/esm/overlay2.js +39 -78
- package/dist/esm/pad-zero.js +3 -4
- package/dist/esm/popup2.js +79 -124
- package/dist/esm/px-check.js +2 -2
- package/dist/esm/radio2.js +48 -79
- package/dist/esm/raf.js +5 -3
- package/dist/esm/render.js +17 -54
- package/dist/esm/safearea2.js +3 -5
- package/dist/esm/supports-passive.js +3 -3
- package/dist/esm/tabbaritem2.js +42 -58
- package/dist/esm/tabs2.js +82 -120
- package/dist/esm/tslib.es6.js +47 -0
- package/dist/esm/types/src/packages/button/demos/h5/demo1.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/h5/demo2.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/h5/demo3.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/h5/demo4.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/h5/demo5.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/h5/demo6.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/h5/demo7.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/h5/demo8.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/h5/demo9.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/taro/demo1.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/taro/demo10.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/taro/demo2.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/taro/demo3.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/taro/demo4.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/taro/demo5.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/taro/demo6.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/taro/demo7.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/taro/demo8.d.ts +3 -0
- package/dist/esm/types/src/packages/button/demos/taro/demo9.d.ts +3 -0
- package/dist/esm/types/src/packages/configprovider/configprovider.d.ts +1 -0
- package/dist/esm/types/src/packages/configprovider/configprovider.taro.d.ts +1 -0
- package/dist/esm/types/src/packages/configprovider/index.d.ts +2 -2
- package/dist/esm/types/src/packages/configprovider/index.taro.d.ts +2 -2
- package/dist/esm/types/src/packages/inputnumber/inputnumber.taro.d.ts +2 -0
- package/dist/esm/typings.js +1 -1
- package/dist/esm/use-click-away.js +9 -13
- package/dist/esm/use-client-rect.js +4 -4
- package/dist/esm/use-props-value.js +10 -15
- package/dist/esm/use-refs.js +5 -7
- package/dist/esm/use-touch.js +16 -20
- package/dist/locales/base.js +1 -1
- package/dist/locales/en-US.js +1 -1
- package/dist/locales/id-ID.js +1 -1
- package/dist/locales/tr-TR.js +1 -1
- package/dist/locales/zh-CN.js +1 -1
- package/dist/locales/zh-TW.js +1 -1
- package/dist/locales/zh-UG.js +1 -1
- package/dist/nutui.react.es.js +242 -284
- package/dist/nutui.react.umd.js +239 -281
- package/dist/style.mjs +1 -1
- package/dist/styles/variables-jmapp.scss +4 -0
- package/dist/types/packages/button/demos/h5/demo1.d.ts +3 -0
- package/dist/types/packages/button/demos/h5/demo2.d.ts +3 -0
- package/dist/types/packages/button/demos/h5/demo3.d.ts +3 -0
- package/dist/types/packages/button/demos/h5/demo4.d.ts +3 -0
- package/dist/types/packages/button/demos/h5/demo5.d.ts +3 -0
- package/dist/types/packages/button/demos/h5/demo6.d.ts +3 -0
- package/dist/types/packages/button/demos/h5/demo7.d.ts +3 -0
- package/dist/types/packages/button/demos/h5/demo8.d.ts +3 -0
- package/dist/types/packages/button/demos/h5/demo9.d.ts +3 -0
- package/dist/types/packages/button/demos/taro/demo1.d.ts +3 -0
- package/dist/types/packages/button/demos/taro/demo10.d.ts +3 -0
- package/dist/types/packages/button/demos/taro/demo2.d.ts +3 -0
- package/dist/types/packages/button/demos/taro/demo3.d.ts +3 -0
- package/dist/types/packages/button/demos/taro/demo4.d.ts +3 -0
- package/dist/types/packages/button/demos/taro/demo5.d.ts +3 -0
- package/dist/types/packages/button/demos/taro/demo6.d.ts +3 -0
- package/dist/types/packages/button/demos/taro/demo7.d.ts +3 -0
- package/dist/types/packages/button/demos/taro/demo8.d.ts +3 -0
- package/dist/types/packages/button/demos/taro/demo9.d.ts +3 -0
- package/dist/types/packages/configprovider/configprovider.d.ts +1 -0
- package/dist/types/packages/configprovider/configprovider.taro.d.ts +1 -0
- package/dist/types/packages/configprovider/index.d.ts +2 -2
- package/dist/types/packages/configprovider/index.taro.d.ts +2 -2
- package/dist/types/packages/empty/empty.d.ts +15 -3
- package/dist/types/packages/inputnumber/inputnumber.taro.d.ts +2 -0
- package/dist/types/packages/rate/rate.d.ts +1 -1
- package/package.json +5 -1
package/dist/esm/CalendarItem.js
CHANGED
|
@@ -1,27 +1,3 @@
|
|
|
1
|
-
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
|
-
import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
|
|
3
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
4
|
-
function ownKeys(e, r) {
|
|
5
|
-
var t = Object.keys(e);
|
|
6
|
-
if (Object.getOwnPropertySymbols) {
|
|
7
|
-
var o = Object.getOwnPropertySymbols(e);
|
|
8
|
-
r && (o = o.filter(function(r2) {
|
|
9
|
-
return Object.getOwnPropertyDescriptor(e, r2).enumerable;
|
|
10
|
-
})), t.push.apply(t, o);
|
|
11
|
-
}
|
|
12
|
-
return t;
|
|
13
|
-
}
|
|
14
|
-
function _objectSpread(e) {
|
|
15
|
-
for (var r = 1; r < arguments.length; r++) {
|
|
16
|
-
var t = null != arguments[r] ? arguments[r] : {};
|
|
17
|
-
r % 2 ? ownKeys(Object(t), true).forEach(function(r2) {
|
|
18
|
-
_defineProperty(e, r2, t[r2]);
|
|
19
|
-
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function(r2) {
|
|
20
|
-
Object.defineProperty(e, r2, Object.getOwnPropertyDescriptor(t, r2));
|
|
21
|
-
});
|
|
22
|
-
}
|
|
23
|
-
return e;
|
|
24
|
-
}
|
|
25
1
|
import React__default, { useState, useRef, useEffect } from "react";
|
|
26
2
|
import classNames from "classnames";
|
|
27
3
|
import { C as ComponentDefaults } from "./typings.js";
|
|
@@ -29,125 +5,105 @@ import { U as Utils, g as getPreMonthDates, a as getDaysStatus, b as getCurrMont
|
|
|
29
5
|
import { r as requestAniFrame } from "./raf.js";
|
|
30
6
|
import { u as useConfig } from "./configprovider2.js";
|
|
31
7
|
import { u as usePropsValue } from "./use-props-value.js";
|
|
32
|
-
|
|
33
|
-
|
|
8
|
+
const splitDate = (date) => {
|
|
9
|
+
const split = date.indexOf("-") !== -1 ? "-" : "/";
|
|
34
10
|
return date.split(split);
|
|
35
11
|
};
|
|
36
|
-
|
|
12
|
+
const isMultiple = (day, days) => {
|
|
37
13
|
if (days.length > 0) {
|
|
38
|
-
return days.some(
|
|
14
|
+
return days.some((item) => {
|
|
39
15
|
return Utils.isEqual(item, day);
|
|
40
16
|
});
|
|
41
17
|
}
|
|
42
18
|
return false;
|
|
43
19
|
};
|
|
44
|
-
|
|
45
|
-
|
|
20
|
+
const isCurrDay = (month, day) => {
|
|
21
|
+
const date = `${month.curData[0]}/${month.curData[1]}/${day}`;
|
|
46
22
|
return Utils.isEqual(date, Utils.date2Str(/* @__PURE__ */ new Date(), "/"));
|
|
47
23
|
};
|
|
48
|
-
|
|
49
|
-
return
|
|
24
|
+
const getCurrDate = (day, month) => {
|
|
25
|
+
return `${month.curData[0]}/${month.curData[1]}/${Utils.getNumTwoBit(+day.day)}`;
|
|
50
26
|
};
|
|
51
|
-
|
|
27
|
+
const isStart = (day, days) => {
|
|
52
28
|
return Utils.isEqual(days[0], day);
|
|
53
29
|
};
|
|
54
|
-
|
|
30
|
+
const isEnd = (day, days) => {
|
|
55
31
|
return Utils.isEqual(days[1], day);
|
|
56
32
|
};
|
|
57
|
-
|
|
33
|
+
const isStartAndEnd = (days) => {
|
|
58
34
|
return days.length >= 2 && Utils.isEqual(days[0], days[1]);
|
|
59
35
|
};
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
showToday
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
onUpdate: function onUpdate() {
|
|
85
|
-
},
|
|
86
|
-
onDayClick: function onDayClick(data) {
|
|
87
|
-
},
|
|
88
|
-
onPageChange: function onPageChange(data) {
|
|
89
|
-
}
|
|
90
|
-
});
|
|
91
|
-
var CalendarItem = React__default.forwardRef(function(props, ref) {
|
|
92
|
-
var _useConfig = useConfig(), locale = _useConfig.locale;
|
|
93
|
-
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), style = _defaultProps$props.style, className = _defaultProps$props.className, children = _defaultProps$props.children, popup = _defaultProps$props.popup, type = _defaultProps$props.type, autoBackfill = _defaultProps$props.autoBackfill, title = _defaultProps$props.title, defaultValue = _defaultProps$props.defaultValue, startDate = _defaultProps$props.startDate, endDate = _defaultProps$props.endDate, showToday = _defaultProps$props.showToday, startText = _defaultProps$props.startText, endText = _defaultProps$props.endText, confirmText = _defaultProps$props.confirmText, showTitle = _defaultProps$props.showTitle, showSubTitle = _defaultProps$props.showSubTitle, scrollAnimation = _defaultProps$props.scrollAnimation, firstDayOfWeek = _defaultProps$props.firstDayOfWeek, disableDate2 = _defaultProps$props.disableDate, renderHeaderButtons = _defaultProps$props.renderHeaderButtons, renderDay = _defaultProps$props.renderDay, renderDayTop = _defaultProps$props.renderDayTop, renderDayBottom = _defaultProps$props.renderDayBottom, onConfirm2 = _defaultProps$props.onConfirm, onUpdate2 = _defaultProps$props.onUpdate, onDayClick2 = _defaultProps$props.onDayClick, onPageChange2 = _defaultProps$props.onPageChange;
|
|
94
|
-
var weekdays = locale.calendaritem.weekdays;
|
|
95
|
-
var weeks = [].concat(_toConsumableArray(weekdays.slice(firstDayOfWeek, 7)), _toConsumableArray(weekdays.slice(0, firstDayOfWeek)));
|
|
96
|
-
var monthTitle = locale.calendaritem.monthTitle;
|
|
97
|
-
var _useState = useState(""), _useState2 = _slicedToArray(_useState, 2), yearMonthTitle = _useState2[0], setYearMonthTitle = _useState2[1];
|
|
98
|
-
var _useState3 = useState([]), _useState4 = _slicedToArray(_useState3, 2), monthsData = _useState4[0], setMonthsData = _useState4[1];
|
|
99
|
-
var _useState5 = useState(0), _useState6 = _slicedToArray(_useState5, 2), monthsNum = _useState6[0], setMonthsNum = _useState6[1];
|
|
100
|
-
var _useState7 = useState(0), _useState8 = _slicedToArray(_useState7, 2), translateY = _useState8[0], setTranslateY = _useState8[1];
|
|
101
|
-
var _useState9 = useState([]), _useState10 = _slicedToArray(_useState9, 2), monthDefaultRange = _useState10[0], setMonthDefaultRange = _useState10[1];
|
|
102
|
-
var propStartDate = startDate || Utils.getDay(0);
|
|
103
|
-
var propEndDate = endDate || Utils.getDay(365);
|
|
104
|
-
var startDates = splitDate(propStartDate);
|
|
105
|
-
var endDates = splitDate(propEndDate);
|
|
106
|
-
var _useState11 = useState({
|
|
36
|
+
const defaultProps = Object.assign(Object.assign({}, ComponentDefaults), { type: "single", autoBackfill: false, popup: true, title: "", startDate: Utils.getDay(0), endDate: Utils.getDay(365), showToday: true, startText: "", endText: "", confirmText: "", showTitle: true, showSubTitle: true, scrollAnimation: true, firstDayOfWeek: 0, disableDate: (date) => false, renderHeaderButtons: void 0, renderDay: void 0, renderDayTop: void 0, renderDayBottom: void 0, onConfirm: (data) => {
|
|
37
|
+
}, onUpdate: () => {
|
|
38
|
+
}, onDayClick: (data) => {
|
|
39
|
+
}, onPageChange: (data) => {
|
|
40
|
+
} });
|
|
41
|
+
const CalendarItem = React__default.forwardRef((props, ref) => {
|
|
42
|
+
const { locale } = useConfig();
|
|
43
|
+
const { style, className, children, popup, type, autoBackfill, title, defaultValue, startDate, endDate, showToday, startText, endText, confirmText, showTitle, showSubTitle, scrollAnimation, firstDayOfWeek, disableDate, renderHeaderButtons, renderDay, renderDayTop, renderDayBottom, onConfirm, onUpdate, onDayClick, onPageChange } = Object.assign(Object.assign({}, defaultProps), props);
|
|
44
|
+
const weekdays = locale.calendaritem.weekdays;
|
|
45
|
+
const weeks = [
|
|
46
|
+
...weekdays.slice(firstDayOfWeek, 7),
|
|
47
|
+
...weekdays.slice(0, firstDayOfWeek)
|
|
48
|
+
];
|
|
49
|
+
const monthTitle = locale.calendaritem.monthTitle;
|
|
50
|
+
const [yearMonthTitle, setYearMonthTitle] = useState("");
|
|
51
|
+
const [monthsData, setMonthsData] = useState([]);
|
|
52
|
+
const [monthsNum, setMonthsNum] = useState(0);
|
|
53
|
+
const [translateY, setTranslateY] = useState(0);
|
|
54
|
+
const [monthDefaultRange, setMonthDefaultRange] = useState([]);
|
|
55
|
+
const propStartDate = startDate || Utils.getDay(0);
|
|
56
|
+
const propEndDate = endDate || Utils.getDay(365);
|
|
57
|
+
const startDates = splitDate(propStartDate);
|
|
58
|
+
const endDates = splitDate(propEndDate);
|
|
59
|
+
const [state] = useState({
|
|
107
60
|
currDateArray: []
|
|
108
|
-
})
|
|
109
|
-
|
|
61
|
+
});
|
|
62
|
+
const getMonthsPanel = () => {
|
|
110
63
|
return monthsPanel.current;
|
|
111
64
|
};
|
|
112
|
-
|
|
65
|
+
const getMonthsRef = () => {
|
|
113
66
|
return monthsRef.current;
|
|
114
67
|
};
|
|
115
|
-
|
|
68
|
+
const resetDefaultValue = () => {
|
|
116
69
|
if (defaultValue || Array.isArray(defaultValue) && defaultValue.length > 0) {
|
|
117
|
-
return type !== "single" ?
|
|
70
|
+
return type !== "single" ? [...defaultValue] : defaultValue;
|
|
118
71
|
}
|
|
119
72
|
return void 0;
|
|
120
73
|
};
|
|
121
|
-
|
|
74
|
+
const [currentDate, setCurrentDate] = usePropsValue({
|
|
122
75
|
value: props.value,
|
|
123
76
|
defaultValue: resetDefaultValue(),
|
|
124
77
|
finalValue: [],
|
|
125
|
-
onChange:
|
|
78
|
+
onChange: (val) => {
|
|
126
79
|
}
|
|
127
|
-
})
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
80
|
+
});
|
|
81
|
+
const weeksPanel = useRef(null);
|
|
82
|
+
const monthsRef = useRef(null);
|
|
83
|
+
const monthsPanel = useRef(null);
|
|
84
|
+
const viewAreaRef = useRef(null);
|
|
85
|
+
const [avgHeight, setAvgHeight] = useState(0);
|
|
86
|
+
let viewHeight = 0;
|
|
87
|
+
const classPrefix = "nut-calendar";
|
|
88
|
+
const dayPrefix = "nut-calendar-day";
|
|
89
|
+
const getMonthData = (curData, monthNum, type2) => {
|
|
90
|
+
let i = 0;
|
|
91
|
+
let date = curData;
|
|
92
|
+
const monthData = monthsData;
|
|
140
93
|
do {
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
94
|
+
const y = parseInt(date[0], 10);
|
|
95
|
+
const m = parseInt(date[1], 10);
|
|
96
|
+
const days = [
|
|
97
|
+
...getPreMonthDates("prev", y, m, firstDayOfWeek),
|
|
98
|
+
...getDaysStatus("active", y, m)
|
|
99
|
+
];
|
|
100
|
+
const cssHeight = 39 + (days.length > 35 ? 384 : 320);
|
|
101
|
+
let scrollTop = 0;
|
|
146
102
|
if (monthData.length > 0) {
|
|
147
|
-
|
|
103
|
+
const monthEle = monthData[monthData.length - 1];
|
|
148
104
|
scrollTop = monthEle.scrollTop + monthEle.cssHeight;
|
|
149
105
|
}
|
|
150
|
-
|
|
106
|
+
const monthInfo = {
|
|
151
107
|
curData: date,
|
|
152
108
|
title: monthTitle(y, m),
|
|
153
109
|
monthData: days,
|
|
@@ -155,27 +111,27 @@ var CalendarItem = React__default.forwardRef(function(props, ref) {
|
|
|
155
111
|
scrollTop
|
|
156
112
|
};
|
|
157
113
|
if (type2 === "next") {
|
|
158
|
-
if (!endDates || !Utils.compareDate(
|
|
114
|
+
if (!endDates || !Utils.compareDate(`${endDates[0]}/${endDates[1]}/${Utils.getMonthDays(endDates[0], endDates[1])}`, `${curData[0]}/${curData[1]}/${curData[2]}`)) {
|
|
159
115
|
monthData.push(monthInfo);
|
|
160
116
|
}
|
|
161
|
-
} else if (!startDates || !Utils.compareDate(
|
|
117
|
+
} else if (!startDates || !Utils.compareDate(`${curData[0]}/${curData[1]}/${curData[2]}`, `${startDates[0]}/${startDates[1]}/01`)) {
|
|
162
118
|
monthData.unshift(monthInfo);
|
|
163
119
|
}
|
|
164
120
|
date = getCurrMonthData("next", y, m);
|
|
165
121
|
} while (i++ < monthNum);
|
|
166
122
|
setMonthsData(monthData);
|
|
167
123
|
};
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
124
|
+
const setReachedYearMonthInfo = (current) => {
|
|
125
|
+
const currentMonthsData = monthsData[current];
|
|
126
|
+
const [year, month] = currentMonthsData.curData;
|
|
171
127
|
if (currentMonthsData.title === yearMonthTitle)
|
|
172
128
|
return;
|
|
173
|
-
|
|
129
|
+
onPageChange && onPageChange([year, month, `${year}-${month}`]);
|
|
174
130
|
setYearMonthTitle(currentMonthsData.title);
|
|
175
131
|
};
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
132
|
+
const setDefaultRange = (monthNum, current) => {
|
|
133
|
+
let start = 0;
|
|
134
|
+
let end = 0;
|
|
179
135
|
if (monthNum >= 3) {
|
|
180
136
|
if (current > 0 && current < monthNum) {
|
|
181
137
|
start = current - 1;
|
|
@@ -195,9 +151,9 @@ var CalendarItem = React__default.forwardRef(function(props, ref) {
|
|
|
195
151
|
setTranslateY(monthsData[start].scrollTop);
|
|
196
152
|
setReachedYearMonthInfo(current);
|
|
197
153
|
};
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
154
|
+
const getMonthNum = () => {
|
|
155
|
+
let monthNum = Number(endDates[1]) - Number(startDates[1]);
|
|
156
|
+
const yearNum = Number(endDates[0]) - Number(startDates[0]);
|
|
201
157
|
if (yearNum > 0) {
|
|
202
158
|
monthNum += 12 * yearNum;
|
|
203
159
|
}
|
|
@@ -207,8 +163,8 @@ var CalendarItem = React__default.forwardRef(function(props, ref) {
|
|
|
207
163
|
setMonthsNum(monthNum);
|
|
208
164
|
return monthNum;
|
|
209
165
|
};
|
|
210
|
-
|
|
211
|
-
|
|
166
|
+
const setDefaultDate = () => {
|
|
167
|
+
let defaultData = [];
|
|
212
168
|
if (type === "range" && Array.isArray(currentDate)) {
|
|
213
169
|
if (currentDate.length > 0) {
|
|
214
170
|
if (propStartDate && Utils.compareDate(currentDate[0], propStartDate)) {
|
|
@@ -217,13 +173,16 @@ var CalendarItem = React__default.forwardRef(function(props, ref) {
|
|
|
217
173
|
if (propEndDate && Utils.compareDate(propEndDate, currentDate[1])) {
|
|
218
174
|
currentDate.splice(1, 1, propEndDate);
|
|
219
175
|
}
|
|
220
|
-
defaultData = [
|
|
176
|
+
defaultData = [
|
|
177
|
+
...splitDate(currentDate[0]),
|
|
178
|
+
...splitDate(currentDate[1])
|
|
179
|
+
];
|
|
221
180
|
}
|
|
222
181
|
} else if (type === "multiple" && Array.isArray(currentDate)) {
|
|
223
182
|
if (currentDate.length > 0) {
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
currentDate.forEach(
|
|
183
|
+
const defaultArr = [];
|
|
184
|
+
const obj = {};
|
|
185
|
+
currentDate.forEach((item) => {
|
|
227
186
|
if (propStartDate && !Utils.compareDate(item, propStartDate) && propEndDate && !Utils.compareDate(propEndDate, item)) {
|
|
228
187
|
if (!Object.hasOwnProperty.call(obj, item)) {
|
|
229
188
|
defaultArr.push(item);
|
|
@@ -231,30 +190,33 @@ var CalendarItem = React__default.forwardRef(function(props, ref) {
|
|
|
231
190
|
}
|
|
232
191
|
}
|
|
233
192
|
});
|
|
234
|
-
currentDate.splice(0) && currentDate.push
|
|
235
|
-
defaultData =
|
|
193
|
+
currentDate.splice(0) && currentDate.push(...defaultArr);
|
|
194
|
+
defaultData = [...splitDate(defaultArr[0])];
|
|
236
195
|
}
|
|
237
196
|
} else if (type === "week" && Array.isArray(currentDate)) {
|
|
238
197
|
if (currentDate.length > 0) {
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
currentDate.splice(0) && currentDate.push
|
|
198
|
+
const [y, m, d] = splitDate(currentDate[0]);
|
|
199
|
+
const weekArr = Utils.getWeekDate(y, m, d, firstDayOfWeek);
|
|
200
|
+
currentDate.splice(0) && currentDate.push(...weekArr);
|
|
242
201
|
if (propStartDate && Utils.compareDate(currentDate[0], propStartDate)) {
|
|
243
202
|
currentDate.splice(0, 1, propStartDate);
|
|
244
203
|
}
|
|
245
204
|
if (propEndDate && Utils.compareDate(propEndDate, currentDate[1])) {
|
|
246
205
|
currentDate.splice(1, 1, propEndDate);
|
|
247
206
|
}
|
|
248
|
-
defaultData = [
|
|
207
|
+
defaultData = [
|
|
208
|
+
...splitDate(currentDate[0]),
|
|
209
|
+
...splitDate(currentDate[1])
|
|
210
|
+
];
|
|
249
211
|
}
|
|
250
212
|
} else if (currentDate) {
|
|
251
213
|
if (currentDate.length > 0) {
|
|
252
214
|
if (propStartDate && Utils.compareDate(currentDate, propStartDate)) {
|
|
253
|
-
defaultData =
|
|
215
|
+
defaultData = [...splitDate(propStartDate)];
|
|
254
216
|
} else if (propEndDate && !Utils.compareDate(currentDate, propEndDate)) {
|
|
255
|
-
defaultData =
|
|
217
|
+
defaultData = [...splitDate(propEndDate)];
|
|
256
218
|
} else {
|
|
257
|
-
defaultData =
|
|
219
|
+
defaultData = [...splitDate(currentDate)];
|
|
258
220
|
}
|
|
259
221
|
} else {
|
|
260
222
|
defaultData = [];
|
|
@@ -262,25 +224,25 @@ var CalendarItem = React__default.forwardRef(function(props, ref) {
|
|
|
262
224
|
}
|
|
263
225
|
return defaultData;
|
|
264
226
|
};
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
227
|
+
const getCurrentIndex = (defaultData) => {
|
|
228
|
+
let current = 0;
|
|
229
|
+
let lastCurrent = 0;
|
|
268
230
|
if (defaultData.length > 0) {
|
|
269
|
-
monthsData.forEach(
|
|
231
|
+
monthsData.forEach((item, index) => {
|
|
270
232
|
if (item.title === monthTitle(defaultData[0], defaultData[1])) {
|
|
271
|
-
current =
|
|
233
|
+
current = index;
|
|
272
234
|
}
|
|
273
235
|
if (type === "range" || type === "week") {
|
|
274
236
|
if (item.title === monthTitle(defaultData[3], defaultData[4])) {
|
|
275
|
-
lastCurrent =
|
|
237
|
+
lastCurrent = index;
|
|
276
238
|
}
|
|
277
239
|
}
|
|
278
240
|
});
|
|
279
241
|
} else {
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
242
|
+
const date = /* @__PURE__ */ new Date();
|
|
243
|
+
const year = date.getFullYear();
|
|
244
|
+
const month = date.getMonth() + 1;
|
|
245
|
+
const index = monthsData.findIndex((item) => {
|
|
284
246
|
return +item.curData[0] === year && +item.curData[1] === month;
|
|
285
247
|
});
|
|
286
248
|
if (index > -1) {
|
|
@@ -292,96 +254,81 @@ var CalendarItem = React__default.forwardRef(function(props, ref) {
|
|
|
292
254
|
lastCurrent
|
|
293
255
|
};
|
|
294
256
|
};
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
257
|
+
const renderCurrentDate = () => {
|
|
258
|
+
const defaultData = setDefaultDate();
|
|
259
|
+
const current = getCurrentIndex(defaultData);
|
|
298
260
|
if (defaultData.length > 0) {
|
|
299
261
|
if (type === "range") {
|
|
300
|
-
chooseDay({
|
|
301
|
-
|
|
302
|
-
type: "active"
|
|
303
|
-
}, monthsData[current.current], true);
|
|
304
|
-
chooseDay({
|
|
305
|
-
day: defaultData[5],
|
|
306
|
-
type: "active"
|
|
307
|
-
}, monthsData[current.lastCurrent], true);
|
|
262
|
+
chooseDay({ day: defaultData[2], type: "active" }, monthsData[current.current], true);
|
|
263
|
+
chooseDay({ day: defaultData[5], type: "active" }, monthsData[current.lastCurrent], true);
|
|
308
264
|
} else if (props.type === "week") {
|
|
309
|
-
chooseDay({
|
|
310
|
-
day: defaultData[2],
|
|
311
|
-
type: "curr"
|
|
312
|
-
}, monthsData[current.current], true);
|
|
265
|
+
chooseDay({ day: defaultData[2], type: "curr" }, monthsData[current.current], true);
|
|
313
266
|
} else if (type === "multiple") {
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
monthsData.forEach(
|
|
267
|
+
[...currentDate].forEach((item) => {
|
|
268
|
+
const dateArr = splitDate(item);
|
|
269
|
+
let currentIndex = current.current;
|
|
270
|
+
monthsData.forEach((item2, index) => {
|
|
318
271
|
if (item2.title === monthTitle(dateArr[0], dateArr[1])) {
|
|
319
272
|
currentIndex = index;
|
|
320
273
|
}
|
|
321
274
|
});
|
|
322
|
-
chooseDay({
|
|
323
|
-
day: dateArr[2],
|
|
324
|
-
type: "active"
|
|
325
|
-
}, monthsData[currentIndex], true);
|
|
275
|
+
chooseDay({ day: dateArr[2], type: "active" }, monthsData[currentIndex], true);
|
|
326
276
|
});
|
|
327
277
|
} else {
|
|
328
|
-
chooseDay({
|
|
329
|
-
day: defaultData[2],
|
|
330
|
-
type: "active"
|
|
331
|
-
}, monthsData[current.current], true);
|
|
278
|
+
chooseDay({ day: defaultData[2], type: "active" }, monthsData[current.current], true);
|
|
332
279
|
}
|
|
333
280
|
}
|
|
334
281
|
return current.current;
|
|
335
282
|
};
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
requestAniFrame(
|
|
283
|
+
const requestAniFrameFunc = (current, monthNum) => {
|
|
284
|
+
const lastItem = monthsData[monthsData.length - 1];
|
|
285
|
+
const containerHeight = lastItem.cssHeight + lastItem.scrollTop;
|
|
286
|
+
requestAniFrame(() => {
|
|
340
287
|
if (monthsRef && monthsPanel && viewAreaRef) {
|
|
341
288
|
viewHeight = getMonthsRef().clientHeight;
|
|
342
|
-
getMonthsPanel().style.height =
|
|
289
|
+
getMonthsPanel().style.height = `${containerHeight}px`;
|
|
343
290
|
getMonthsRef().scrollTop = monthsData[current].scrollTop;
|
|
344
291
|
}
|
|
345
292
|
});
|
|
346
293
|
setAvgHeight(Math.floor(containerHeight / (monthNum + 1)));
|
|
347
294
|
};
|
|
348
|
-
|
|
349
|
-
|
|
295
|
+
const initData = () => {
|
|
296
|
+
const monthNum = getMonthNum();
|
|
350
297
|
getMonthData(startDates, monthNum, "next");
|
|
351
|
-
|
|
298
|
+
const current = renderCurrentDate();
|
|
352
299
|
setDefaultRange(monthNum, current);
|
|
353
300
|
requestAniFrameFunc(current, monthNum);
|
|
354
301
|
};
|
|
355
|
-
useEffect(
|
|
302
|
+
useEffect(() => {
|
|
356
303
|
initData();
|
|
357
304
|
}, []);
|
|
358
|
-
|
|
305
|
+
const resetRender = () => {
|
|
359
306
|
state.currDateArray.splice(0);
|
|
360
307
|
monthsData.splice(0);
|
|
361
308
|
initData();
|
|
362
309
|
};
|
|
363
|
-
useEffect(
|
|
310
|
+
useEffect(() => {
|
|
364
311
|
setCurrentDate(resetDefaultValue() || []);
|
|
365
312
|
popup && resetRender();
|
|
366
313
|
}, [defaultValue]);
|
|
367
|
-
|
|
314
|
+
const scrollToDate = (date) => {
|
|
368
315
|
if (Utils.compareDate(date, propStartDate)) {
|
|
369
316
|
date = propStartDate;
|
|
370
317
|
} else if (!Utils.compareDate(date, propEndDate)) {
|
|
371
318
|
date = propEndDate;
|
|
372
319
|
}
|
|
373
|
-
|
|
374
|
-
monthsData.forEach(
|
|
320
|
+
const dateArr = splitDate(date);
|
|
321
|
+
monthsData.forEach((item, index) => {
|
|
375
322
|
if (item.title === monthTitle(dateArr[0], dateArr[1])) {
|
|
376
|
-
|
|
323
|
+
const currTop = monthsData[index].scrollTop;
|
|
377
324
|
if (monthsRef.current) {
|
|
378
|
-
|
|
325
|
+
const distance = currTop - monthsRef.current.scrollTop;
|
|
379
326
|
if (scrollAnimation) {
|
|
380
|
-
|
|
381
|
-
|
|
327
|
+
let flag = 0;
|
|
328
|
+
const interval = setInterval(() => {
|
|
382
329
|
flag++;
|
|
383
330
|
if (monthsRef.current) {
|
|
384
|
-
|
|
331
|
+
const offset = distance / 10;
|
|
385
332
|
monthsRef.current.scrollTop += offset;
|
|
386
333
|
}
|
|
387
334
|
if (flag >= 10) {
|
|
@@ -398,16 +345,16 @@ var CalendarItem = React__default.forwardRef(function(props, ref) {
|
|
|
398
345
|
}
|
|
399
346
|
});
|
|
400
347
|
};
|
|
401
|
-
|
|
348
|
+
const monthsViewScroll = (e) => {
|
|
402
349
|
if (monthsData.length <= 1) {
|
|
403
350
|
return;
|
|
404
351
|
}
|
|
405
|
-
|
|
406
|
-
|
|
352
|
+
const scrollTop = e.target.scrollTop;
|
|
353
|
+
let current = Math.floor(scrollTop / avgHeight);
|
|
407
354
|
if (!monthsData[current + 1])
|
|
408
355
|
return;
|
|
409
|
-
|
|
410
|
-
|
|
356
|
+
const nextTop = monthsData[current + 1].scrollTop;
|
|
357
|
+
const nextHeight = monthsData[current + 1].cssHeight;
|
|
411
358
|
if (current === 0) {
|
|
412
359
|
if (scrollTop >= nextTop) {
|
|
413
360
|
current += 1;
|
|
@@ -420,7 +367,7 @@ var CalendarItem = React__default.forwardRef(function(props, ref) {
|
|
|
420
367
|
current -= 1;
|
|
421
368
|
}
|
|
422
369
|
} else {
|
|
423
|
-
|
|
370
|
+
const viewPosition = Math.round(scrollTop + viewHeight);
|
|
424
371
|
if (current + 1 <= monthsNum && viewPosition >= nextTop + nextHeight) {
|
|
425
372
|
current += 1;
|
|
426
373
|
}
|
|
@@ -430,194 +377,186 @@ var CalendarItem = React__default.forwardRef(function(props, ref) {
|
|
|
430
377
|
}
|
|
431
378
|
setDefaultRange(monthsNum, current);
|
|
432
379
|
};
|
|
433
|
-
React__default.useImperativeHandle(ref,
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
var getClasses = function getClasses2(day, month) {
|
|
439
|
-
var dateStr = getCurrDate(day, month);
|
|
380
|
+
React__default.useImperativeHandle(ref, () => ({
|
|
381
|
+
scrollToDate
|
|
382
|
+
}));
|
|
383
|
+
const getClasses = (day, month) => {
|
|
384
|
+
const dateStr = getCurrDate(day, month);
|
|
440
385
|
if (day.type === "active") {
|
|
441
386
|
if (propStartDate && Utils.compareDate(dateStr, propStartDate) || propEndDate && Utils.compareDate(propEndDate, dateStr)) {
|
|
442
|
-
return
|
|
387
|
+
return `${dayPrefix}-disabled`;
|
|
443
388
|
}
|
|
444
389
|
if (type === "range" || type === "week") {
|
|
445
390
|
if (isStart(dateStr, currentDate) || isEnd(dateStr, currentDate)) {
|
|
446
|
-
return
|
|
391
|
+
return `${dayPrefix}-active ${isStart(dateStr, currentDate) ? "active-start" : ""} ${isEnd(dateStr, currentDate) ? "active-end" : ""}`;
|
|
447
392
|
}
|
|
448
393
|
if (Array.isArray(currentDate) && Object.values(currentDate).length === 2 && Utils.compareDate(currentDate[0], dateStr) && Utils.compareDate(dateStr, currentDate[1])) {
|
|
449
|
-
if (
|
|
450
|
-
return
|
|
394
|
+
if (disableDate(day)) {
|
|
395
|
+
return `${dayPrefix}-choose-disabled`;
|
|
451
396
|
}
|
|
452
|
-
return
|
|
397
|
+
return `${dayPrefix}-choose`;
|
|
453
398
|
}
|
|
454
399
|
} else if (type === "multiple" && isMultiple(dateStr, currentDate) || !Array.isArray(currentDate) && Utils.isEqual(currentDate, dateStr)) {
|
|
455
|
-
return
|
|
400
|
+
return `${dayPrefix}-active`;
|
|
456
401
|
}
|
|
457
|
-
if (
|
|
458
|
-
return
|
|
402
|
+
if (disableDate(day)) {
|
|
403
|
+
return `${dayPrefix}-disabled`;
|
|
459
404
|
}
|
|
460
405
|
return null;
|
|
461
406
|
}
|
|
462
|
-
return
|
|
407
|
+
return `${dayPrefix}-disabled`;
|
|
463
408
|
};
|
|
464
|
-
|
|
465
|
-
if (getClasses(day, month) ===
|
|
409
|
+
const chooseDay = (day, month, isFirst) => {
|
|
410
|
+
if (getClasses(day, month) === `${dayPrefix}-disabled`) {
|
|
466
411
|
return;
|
|
467
412
|
}
|
|
468
|
-
|
|
469
|
-
|
|
413
|
+
const days = [...month.curData];
|
|
414
|
+
const [y, m] = month.curData;
|
|
470
415
|
days[2] = typeof day.day === "number" ? Utils.getNumTwoBit(day.day) : day.day;
|
|
471
|
-
days[3] =
|
|
416
|
+
days[3] = `${days[0]}/${days[1]}/${days[2]}`;
|
|
472
417
|
days[4] = Utils.getWhatDay(+days[0], +days[1], +days[2]);
|
|
473
418
|
if (type === "multiple") {
|
|
474
419
|
if (currentDate.length > 0) {
|
|
475
|
-
|
|
476
|
-
currentDate.forEach(
|
|
420
|
+
let hasIndex = "";
|
|
421
|
+
currentDate.forEach((item, index) => {
|
|
477
422
|
if (item === days[3]) {
|
|
478
423
|
hasIndex = index;
|
|
479
424
|
}
|
|
480
425
|
});
|
|
481
426
|
if (isFirst) {
|
|
482
|
-
state.currDateArray.push(
|
|
427
|
+
state.currDateArray.push([...days]);
|
|
483
428
|
} else if (hasIndex !== "") {
|
|
484
429
|
currentDate.splice(hasIndex, 1);
|
|
485
430
|
state.currDateArray.splice(hasIndex, 1);
|
|
486
431
|
} else {
|
|
487
432
|
currentDate.push(days[3]);
|
|
488
|
-
state.currDateArray.push(
|
|
433
|
+
state.currDateArray.push([...days]);
|
|
489
434
|
}
|
|
490
435
|
} else {
|
|
491
436
|
currentDate.push(days[3]);
|
|
492
|
-
state.currDateArray = [
|
|
437
|
+
state.currDateArray = [[...days]];
|
|
493
438
|
}
|
|
494
439
|
} else if (type === "range") {
|
|
495
|
-
|
|
440
|
+
const curDataLength = Object.values(currentDate).length;
|
|
496
441
|
if (curDataLength === 2 || curDataLength === 0) {
|
|
497
442
|
Array.isArray(currentDate) && currentDate.splice(0) && currentDate.push(days[3]);
|
|
498
|
-
state.currDateArray = [
|
|
443
|
+
state.currDateArray = [[...days]];
|
|
499
444
|
} else if (Utils.compareDate(currentDate[0], days[3])) {
|
|
500
445
|
Array.isArray(currentDate) && currentDate.push(days[3]);
|
|
501
|
-
state.currDateArray = [
|
|
446
|
+
state.currDateArray = [...state.currDateArray, [...days]];
|
|
502
447
|
} else {
|
|
503
448
|
Array.isArray(currentDate) && currentDate.unshift(days[3]);
|
|
504
|
-
state.currDateArray = [
|
|
449
|
+
state.currDateArray = [[...days], ...state.currDateArray];
|
|
505
450
|
}
|
|
506
451
|
} else if (type === "week") {
|
|
507
|
-
|
|
452
|
+
const weekArr = Utils.getWeekDate(y, m, `${day.day}`, firstDayOfWeek);
|
|
508
453
|
if (propStartDate && Utils.compareDate(weekArr[0], propStartDate)) {
|
|
509
454
|
weekArr.splice(0, 1, propStartDate);
|
|
510
455
|
}
|
|
511
456
|
if (propEndDate && Utils.compareDate(propEndDate, weekArr[1])) {
|
|
512
457
|
weekArr.splice(1, 1, propEndDate);
|
|
513
458
|
}
|
|
514
|
-
Array.isArray(currentDate) && currentDate.splice(0) && currentDate.push
|
|
515
|
-
state.currDateArray = [
|
|
459
|
+
Array.isArray(currentDate) && currentDate.splice(0) && currentDate.push(...weekArr);
|
|
460
|
+
state.currDateArray = [
|
|
461
|
+
Utils.formatResultDate(weekArr[0]),
|
|
462
|
+
Utils.formatResultDate(weekArr[1])
|
|
463
|
+
];
|
|
516
464
|
} else {
|
|
517
465
|
setCurrentDate(days[3]);
|
|
518
|
-
state.currDateArray =
|
|
466
|
+
state.currDateArray = [...days];
|
|
519
467
|
}
|
|
520
468
|
if (!isFirst) {
|
|
521
|
-
|
|
469
|
+
onDayClick && onDayClick(state.currDateArray);
|
|
522
470
|
if (autoBackfill || !popup) {
|
|
523
471
|
confirm();
|
|
524
472
|
}
|
|
525
473
|
}
|
|
526
474
|
setMonthsData(monthsData.slice());
|
|
527
475
|
};
|
|
528
|
-
|
|
476
|
+
const confirm = () => {
|
|
529
477
|
if (type === "range" && state.currDateArray.length === 2 || type !== "range") {
|
|
530
|
-
|
|
531
|
-
|
|
478
|
+
const chooseData = state.currDateArray.slice(0);
|
|
479
|
+
onConfirm && onConfirm(chooseData);
|
|
532
480
|
if (popup) {
|
|
533
|
-
|
|
481
|
+
onUpdate && onUpdate();
|
|
534
482
|
}
|
|
535
483
|
}
|
|
536
484
|
};
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
|
|
485
|
+
const classes = classNames({
|
|
486
|
+
[`${classPrefix}-title`]: !popup,
|
|
487
|
+
[`${classPrefix}-nofooter`]: !!autoBackfill
|
|
488
|
+
}, classPrefix, className);
|
|
489
|
+
const headerClasses = classNames({
|
|
490
|
+
[`${classPrefix}-header`]: true,
|
|
491
|
+
[`${classPrefix}-header-title`]: !popup
|
|
492
|
+
});
|
|
493
|
+
const isStartTip = (day, month) => {
|
|
540
494
|
return (type === "range" || type === "week") && day.type === "active" && isStart(getCurrDate(day, month), currentDate);
|
|
541
495
|
};
|
|
542
|
-
|
|
496
|
+
const isEndTip = (day, month) => {
|
|
543
497
|
return currentDate.length >= 2 && (type === "range" || type === "week") && day.type === "active" && isEnd(getCurrDate(day, month), currentDate);
|
|
544
498
|
};
|
|
545
|
-
|
|
546
|
-
return React__default.createElement(
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
}, yearMonthTitle), React__default.createElement("div", {
|
|
555
|
-
className: "".concat(classPrefix, "-weeks"),
|
|
556
|
-
ref: weeksPanel
|
|
557
|
-
}, weeks.map(function(item) {
|
|
558
|
-
return React__default.createElement("div", {
|
|
559
|
-
className: "".concat(classPrefix, "-week-item"),
|
|
560
|
-
key: item
|
|
561
|
-
}, item);
|
|
562
|
-
})));
|
|
499
|
+
const renderHeader = () => {
|
|
500
|
+
return React__default.createElement(
|
|
501
|
+
"div",
|
|
502
|
+
{ className: headerClasses },
|
|
503
|
+
showTitle && React__default.createElement("div", { className: `${classPrefix}-title` }, title || locale.calendaritem.title),
|
|
504
|
+
renderHeaderButtons && React__default.createElement("div", { className: `${classPrefix}-header-buttons` }, renderHeaderButtons()),
|
|
505
|
+
showSubTitle && React__default.createElement("div", { className: `${classPrefix}-sub-title` }, yearMonthTitle),
|
|
506
|
+
React__default.createElement("div", { className: `${classPrefix}-weeks`, ref: weeksPanel }, weeks.map((item) => React__default.createElement("div", { className: `${classPrefix}-week-item`, key: item }, item)))
|
|
507
|
+
);
|
|
563
508
|
};
|
|
564
|
-
|
|
565
|
-
return React__default.createElement(
|
|
566
|
-
|
|
567
|
-
onScroll: monthsViewScroll,
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
}, renderDay ? renderDay(day) : day.day), !isStartTip(day, month) && renderDayTop && React__default.createElement("div", {
|
|
596
|
-
className: "".concat(classPrefix, "-day-info-top")
|
|
597
|
-
}, renderDayTop(day)), !isStartTip(day, month) && !isEndTip(day, month) && renderDayBottom && React__default.createElement("div", {
|
|
598
|
-
className: "".concat(classPrefix, "-day-info-bottom")
|
|
599
|
-
}, renderDayBottom(day)), !isStartTip(day, month) && !isEndTip(day, month) && !renderDayBottom && showToday && isCurrDay(month, day.day) && React__default.createElement("div", {
|
|
600
|
-
className: "".concat(classPrefix, "-day-info-curr")
|
|
601
|
-
}, locale.calendaritem.today), isStartTip(day, month) && React__default.createElement("div", {
|
|
602
|
-
className: "".concat(classPrefix, "-day-info ").concat(isStartAndEnd(currentDate) ? "".concat(classPrefix, "-day-info-top") : "")
|
|
603
|
-
}, startText || locale.calendaritem.start), isEndTip(day, month) && React__default.createElement("div", {
|
|
604
|
-
className: "".concat(classPrefix, "-day-info")
|
|
605
|
-
}, endText || locale.calendaritem.end));
|
|
606
|
-
})));
|
|
607
|
-
}))));
|
|
509
|
+
const renderContent = () => {
|
|
510
|
+
return React__default.createElement(
|
|
511
|
+
"div",
|
|
512
|
+
{ className: `${classPrefix}-content`, onScroll: monthsViewScroll, ref: monthsRef },
|
|
513
|
+
React__default.createElement(
|
|
514
|
+
"div",
|
|
515
|
+
{ className: `${classPrefix}-pannel`, ref: monthsPanel },
|
|
516
|
+
React__default.createElement("div", { className: "viewArea", ref: viewAreaRef, style: { transform: `translateY(${translateY}px)` } }, monthsData.slice(monthDefaultRange[0], monthDefaultRange[1]).map((month, key) => {
|
|
517
|
+
return React__default.createElement(
|
|
518
|
+
"div",
|
|
519
|
+
{ className: `${classPrefix}-month`, key },
|
|
520
|
+
React__default.createElement("div", { className: `${classPrefix}-month-title` }, month.title),
|
|
521
|
+
React__default.createElement("div", { className: `${classPrefix}-days` }, month.monthData.map((day, i) => React__default.createElement(
|
|
522
|
+
"div",
|
|
523
|
+
{ className: [
|
|
524
|
+
`${classPrefix}-day`,
|
|
525
|
+
getClasses(day, month)
|
|
526
|
+
].join(" "), onClick: () => {
|
|
527
|
+
chooseDay(day, month);
|
|
528
|
+
}, key: i },
|
|
529
|
+
React__default.createElement("div", { className: `${classPrefix}-day-day` }, renderDay ? renderDay(day) : day.day),
|
|
530
|
+
!isStartTip(day, month) && renderDayTop && React__default.createElement("div", { className: `${classPrefix}-day-info-top` }, renderDayTop(day)),
|
|
531
|
+
!isStartTip(day, month) && !isEndTip(day, month) && renderDayBottom && React__default.createElement("div", { className: `${classPrefix}-day-info-bottom` }, renderDayBottom(day)),
|
|
532
|
+
!isStartTip(day, month) && !isEndTip(day, month) && !renderDayBottom && showToday && isCurrDay(month, day.day) && React__default.createElement("div", { className: `${classPrefix}-day-info-curr` }, locale.calendaritem.today),
|
|
533
|
+
isStartTip(day, month) && React__default.createElement("div", { className: `${classPrefix}-day-info ${isStartAndEnd(currentDate) ? `${classPrefix}-day-info-top` : ""}` }, startText || locale.calendaritem.start),
|
|
534
|
+
isEndTip(day, month) && React__default.createElement("div", { className: `${classPrefix}-day-info` }, endText || locale.calendaritem.end)
|
|
535
|
+
)))
|
|
536
|
+
);
|
|
537
|
+
}))
|
|
538
|
+
)
|
|
539
|
+
);
|
|
608
540
|
};
|
|
609
|
-
|
|
610
|
-
return React__default.createElement(
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
onClick: confirm
|
|
615
|
-
|
|
541
|
+
const renderFooter = () => {
|
|
542
|
+
return React__default.createElement(
|
|
543
|
+
"div",
|
|
544
|
+
{ className: "nut-calendar-footer" },
|
|
545
|
+
children,
|
|
546
|
+
React__default.createElement("div", { className: "calendar-confirm-btn", onClick: confirm }, confirmText || locale.confirm)
|
|
547
|
+
);
|
|
616
548
|
};
|
|
617
|
-
return React__default.createElement(
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
549
|
+
return React__default.createElement(
|
|
550
|
+
React__default.Fragment,
|
|
551
|
+
null,
|
|
552
|
+
React__default.createElement(
|
|
553
|
+
"div",
|
|
554
|
+
{ className: classes, style },
|
|
555
|
+
renderHeader(),
|
|
556
|
+
renderContent(),
|
|
557
|
+
popup && !autoBackfill ? renderFooter() : ""
|
|
558
|
+
)
|
|
559
|
+
);
|
|
621
560
|
});
|
|
622
561
|
CalendarItem.defaultProps = defaultProps;
|
|
623
562
|
CalendarItem.displayName = "NutCalendarItem";
|