@nutui/nutui-react 2.7.8 → 2.7.10
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 +22 -6
- package/dist/esm/Calendar/style/index.js +3 -1
- package/dist/esm/Calendar/style/style.css +1 -1
- package/dist/esm/Calendar.js +267 -10
- package/dist/esm/CalendarCard.js +1 -1
- package/dist/esm/CalendarItem.js +119 -42
- package/dist/esm/ImagePreview/style/style.css +1 -1
- package/dist/esm/Swiper/style/style.css +1 -1
- package/dist/esm/Swiper.js +5 -6
- package/dist/esm/configprovider2.js +4 -0
- package/dist/esm/date.js +7 -80
- package/dist/esm/utils.js +125 -0
- package/dist/locales/base.d.ts +4 -0
- package/dist/locales/base.js +1 -1
- package/dist/locales/en-US.js +5 -1
- package/dist/locales/id-ID.js +5 -1
- package/dist/locales/tr-TR.js +5 -1
- package/dist/locales/zh-CN.js +5 -1
- package/dist/locales/zh-TW.js +5 -1
- package/dist/locales/zh-UG.js +5 -1
- package/dist/nutui.react.es.js +562 -120
- package/dist/nutui.react.umd.js +562 -120
- package/dist/packages/calendar/calendar.scss +24 -0
- package/dist/packages/calendar/calendarviewmode.scss +181 -0
- package/dist/packages/swiper/swiper.scss +11 -0
- package/dist/style.css +1 -1
- package/dist/styles/variables.scss +4 -0
- package/dist/types/locales/base.d.ts +4 -0
- package/dist/types/packages/calendar/calendar.d.ts +4 -0
- package/dist/types/packages/calendar/calendar.taro.d.ts +4 -0
- package/dist/types/packages/calendar/calendarviewmodeitem.d.ts +20 -0
- package/dist/types/packages/calendar/calendarviewmodeitem.taro.d.ts +20 -0
- package/dist/types/packages/calendar/types.d.ts +27 -0
- package/dist/types/packages/calendar/utils.d.ts +40 -0
- package/dist/types/packages/calendaritem/calendaritem.d.ts +1 -0
- package/dist/types/packages/calendaritem/calendaritem.taro.d.ts +1 -0
- package/dist/types/packages/calendaritem/utils.d.ts +17 -0
- package/dist/types/packages/configprovider/types.d.ts +1 -1
- package/dist/types/utils/date.d.ts +0 -17
- package/dist/types/utils/get-system-info.d.ts +19 -0
- package/package.json +1 -1
package/dist/esm/CalendarItem.js
CHANGED
|
@@ -1,46 +1,118 @@
|
|
|
1
1
|
import React__default, { useState, useRef, useEffect } from "react";
|
|
2
2
|
import classNames from "classnames";
|
|
3
3
|
import { C as ComponentDefaults } from "./typings.js";
|
|
4
|
-
import {
|
|
4
|
+
import { g as getNumTwoBit, b as getMonthDays, c as getMonthPreDay, d as date2Str, e as getWhatDay, a as getDateString, f as compareDate, i as isEqual } from "./date.js";
|
|
5
5
|
import { r as requestAniFrame } from "./raf.js";
|
|
6
6
|
import { useConfig } from "./ConfigProvider.js";
|
|
7
7
|
import { u as usePropsValue } from "./use-props-value.js";
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
if (days.length > 0) {
|
|
14
|
-
return days.some((item) => {
|
|
15
|
-
return isEqual(item, day);
|
|
16
|
-
});
|
|
8
|
+
import { s as splitDate, e as getCurrDate, i as isStart, f as isEnd, h as isMultiple, j as isCurrDay, k as isStartAndEnd } from "./utils.js";
|
|
9
|
+
const getCurrMonthData = (type, year, month) => {
|
|
10
|
+
{
|
|
11
|
+
month === 12 && (year += 1);
|
|
12
|
+
month = month === 12 ? 1 : ++month;
|
|
17
13
|
}
|
|
18
|
-
return
|
|
14
|
+
return [year, getNumTwoBit(month), getMonthDays(String(year), String(month))];
|
|
19
15
|
};
|
|
20
|
-
const
|
|
21
|
-
|
|
22
|
-
return
|
|
16
|
+
const getDaysStatus = (type, year, month) => {
|
|
17
|
+
let days = getMonthDays(`${year}`, `${month}`);
|
|
18
|
+
return Array.from(Array(days), (v, k) => {
|
|
19
|
+
return {
|
|
20
|
+
day: k + 1,
|
|
21
|
+
type,
|
|
22
|
+
year,
|
|
23
|
+
month
|
|
24
|
+
};
|
|
25
|
+
});
|
|
23
26
|
};
|
|
24
|
-
const
|
|
25
|
-
|
|
27
|
+
const getPreMonthDates = (type, year, month, firstDayOfWeek) => {
|
|
28
|
+
let preMonth = +month - 1;
|
|
29
|
+
let preYear = year;
|
|
30
|
+
if (preMonth <= 0) {
|
|
31
|
+
preMonth = 12;
|
|
32
|
+
preYear += 1;
|
|
33
|
+
}
|
|
34
|
+
let days = getMonthPreDay(+year, +month);
|
|
35
|
+
days -= firstDayOfWeek;
|
|
36
|
+
if (days >= 7) {
|
|
37
|
+
days -= 7;
|
|
38
|
+
}
|
|
39
|
+
const preDates = getMonthDays(`${preYear}`, `${preMonth}`);
|
|
40
|
+
const months = Array.from(Array(preDates), (v, k) => {
|
|
41
|
+
return {
|
|
42
|
+
day: k + 1,
|
|
43
|
+
type,
|
|
44
|
+
preYear,
|
|
45
|
+
preMonth
|
|
46
|
+
};
|
|
47
|
+
});
|
|
48
|
+
return months.slice(preDates - days);
|
|
26
49
|
};
|
|
27
|
-
const
|
|
28
|
-
|
|
50
|
+
const getWeekDate = (year, month, date, firstDayOfWeek = 0) => {
|
|
51
|
+
const dateNow = new Date(Number(year), parseInt(month) - 1, Number(date));
|
|
52
|
+
const nowTime = dateNow.getTime();
|
|
53
|
+
let day = dateNow.getDay();
|
|
54
|
+
if (firstDayOfWeek === 0) {
|
|
55
|
+
const oneDayTime2 = 24 * 60 * 60 * 1e3;
|
|
56
|
+
const SundayTime2 = nowTime - day * oneDayTime2;
|
|
57
|
+
const SaturdayTime = nowTime + (6 - day) * oneDayTime2;
|
|
58
|
+
const sunday2 = date2Str(new Date(SundayTime2));
|
|
59
|
+
const saturday = date2Str(new Date(SaturdayTime));
|
|
60
|
+
return [sunday2, saturday];
|
|
61
|
+
}
|
|
62
|
+
day = day === 0 ? 7 : day;
|
|
63
|
+
const oneDayTime = 24 * 60 * 60 * 1e3;
|
|
64
|
+
const MondayTime = nowTime - (day - 1) * oneDayTime;
|
|
65
|
+
const SundayTime = nowTime + (7 - day) * oneDayTime;
|
|
66
|
+
const monday = date2Str(new Date(MondayTime));
|
|
67
|
+
const sunday = date2Str(new Date(SundayTime));
|
|
68
|
+
return [monday, sunday];
|
|
29
69
|
};
|
|
30
|
-
const
|
|
31
|
-
|
|
70
|
+
const formatResultDate = (date) => {
|
|
71
|
+
const [year, month, day] = [...date.split("-")];
|
|
72
|
+
const formatterDay = getNumTwoBit(Number(day));
|
|
73
|
+
const formatterDate = `${year}-${month}-${day}`;
|
|
74
|
+
const dayOfWeek = getWhatDay(Number(year), Number(month), Number(day));
|
|
75
|
+
return [year, month, formatterDay, formatterDate, dayOfWeek];
|
|
32
76
|
};
|
|
33
|
-
const
|
|
34
|
-
|
|
77
|
+
const getWeekOfYearByYMD = (year, month, date, firstDayOfWeek = 0) => {
|
|
78
|
+
const MILLISECONDS_PER_DAY = 864e5;
|
|
79
|
+
const dateNow = new Date(year, month - 1, date);
|
|
80
|
+
const dateFirst = new Date(year, 0, 1);
|
|
81
|
+
const dayOfYear = Math.round((dateNow.valueOf() - dateFirst.valueOf()) / MILLISECONDS_PER_DAY);
|
|
82
|
+
const DAYS_OF_FIRST_WEEK = 3;
|
|
83
|
+
let dayOfWeek = dateNow.getDay();
|
|
84
|
+
let remainder = 6 - dayOfWeek - DAYS_OF_FIRST_WEEK;
|
|
85
|
+
if (firstDayOfWeek !== 0) {
|
|
86
|
+
dayOfWeek = dayOfWeek === 0 ? 7 : dayOfWeek;
|
|
87
|
+
remainder = 7 - dayOfWeek - DAYS_OF_FIRST_WEEK;
|
|
88
|
+
}
|
|
89
|
+
let weekNo = Math.ceil((dayOfYear + remainder + 1) / 7);
|
|
90
|
+
if (weekNo === 0) {
|
|
91
|
+
weekNo = getWeekOfYearByYMD(year - 1, 12, 31, firstDayOfWeek);
|
|
92
|
+
} else if (weekNo === 53) {
|
|
93
|
+
const remainder2 = 7 - dayOfWeek - DAYS_OF_FIRST_WEEK;
|
|
94
|
+
weekNo = remainder2 > 0 ? 1 : weekNo;
|
|
95
|
+
}
|
|
96
|
+
return weekNo;
|
|
97
|
+
};
|
|
98
|
+
const getWeekNosOfYear = (year, month, firstDayOfWeek) => {
|
|
99
|
+
const startWeekNo = getWeekOfYearByYMD(year, month, 1, firstDayOfWeek);
|
|
100
|
+
const endWeekNo = getWeekOfYearByYMD(year, month, getMonthDays(`${year}`, `${month}`), firstDayOfWeek);
|
|
101
|
+
return Array.from({
|
|
102
|
+
length: (endWeekNo === 1 ? 53 : endWeekNo) - (startWeekNo === 53 || startWeekNo === 52 ? 0 : startWeekNo) + 1
|
|
103
|
+
}, (_, i) => {
|
|
104
|
+
const lastIndex = (endWeekNo === 1 ? 53 : endWeekNo) - startWeekNo;
|
|
105
|
+
return `${endWeekNo === 1 && i === lastIndex ? 1 : ((startWeekNo === 53 || startWeekNo === 52) && i !== 0 ? 0 : startWeekNo) + i}`;
|
|
106
|
+
});
|
|
35
107
|
};
|
|
36
|
-
const defaultProps = Object.assign(Object.assign({}, ComponentDefaults), { type: "single", autoBackfill: false, popup: true, title: "", startDate: getDateString(0), endDate: getDateString(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) => {
|
|
108
|
+
const defaultProps = Object.assign(Object.assign({}, ComponentDefaults), { type: "single", autoBackfill: false, popup: true, title: "", startDate: getDateString(0), endDate: getDateString(365), showToday: true, startText: "", endText: "", confirmText: "", showTitle: true, showSubTitle: true, showMonthNumber: false, scrollAnimation: true, firstDayOfWeek: 0, disableDate: (date) => false, renderHeaderButtons: void 0, renderDay: void 0, renderDayTop: void 0, renderDayBottom: void 0, onConfirm: (data) => {
|
|
37
109
|
}, onUpdate: () => {
|
|
38
110
|
}, onDayClick: (data) => {
|
|
39
111
|
}, onPageChange: (data) => {
|
|
40
112
|
} });
|
|
41
113
|
const CalendarItem = React__default.forwardRef((props, ref) => {
|
|
42
114
|
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, renderBottomButton, renderDay, renderDayTop, renderDayBottom,
|
|
115
|
+
const { style, className, children, popup, type, autoBackfill, title, value, defaultValue, startDate, endDate, showToday, startText, endText, confirmText, showTitle, showSubTitle, showMonthNumber, scrollAnimation, firstDayOfWeek, disableDate, renderHeaderButtons, renderBottomButton, renderDay, renderDayTop, renderDayBottom, onConfirm, onUpdate, onDayClick, onPageChange } = Object.assign(Object.assign({}, defaultProps), props);
|
|
44
116
|
const classPrefix = "nut-calendar";
|
|
45
117
|
const dayPrefix = "nut-calendar-day";
|
|
46
118
|
const weekdays = locale.calendaritem.weekdays;
|
|
@@ -65,7 +137,7 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
|
|
|
65
137
|
if (defaultValue || Array.isArray(defaultValue) && defaultValue.length > 0) {
|
|
66
138
|
return type !== "single" ? [...defaultValue] : defaultValue;
|
|
67
139
|
}
|
|
68
|
-
return
|
|
140
|
+
return type === "single" ? "" : [];
|
|
69
141
|
};
|
|
70
142
|
const [currentDate, setCurrentDate] = usePropsValue({
|
|
71
143
|
value,
|
|
@@ -91,15 +163,16 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
|
|
|
91
163
|
...getPreMonthDates("prev", y, m, firstDayOfWeek),
|
|
92
164
|
...getDaysStatus("active", y, m)
|
|
93
165
|
];
|
|
94
|
-
const cssHeight = 39 + (days.length > 35 ? 384 : 320);
|
|
95
166
|
let scrollTop = 0;
|
|
96
167
|
if (monthData.length > 0) {
|
|
97
168
|
const monthEle = monthData[monthData.length - 1];
|
|
98
169
|
scrollTop = monthEle.scrollTop + monthEle.cssHeight;
|
|
99
170
|
}
|
|
171
|
+
const cssHeight = 39 + (days.length > 35 ? 384 : 320);
|
|
100
172
|
const monthInfo = {
|
|
101
173
|
curData: date,
|
|
102
174
|
title: monthTitle(y, m),
|
|
175
|
+
weekNo: getWeekNosOfYear(y, m, firstDayOfWeek),
|
|
103
176
|
monthData: days,
|
|
104
177
|
cssHeight,
|
|
105
178
|
scrollTop
|
|
@@ -116,7 +189,7 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
|
|
|
116
189
|
if (currentMonthsData.title === yearMonthTitle)
|
|
117
190
|
return;
|
|
118
191
|
const [year, month] = currentMonthsData.curData;
|
|
119
|
-
onPageChange
|
|
192
|
+
onPageChange === null || onPageChange === void 0 ? void 0 : onPageChange([year, month, `${year}-${month}`]);
|
|
120
193
|
setYearMonthTitle(currentMonthsData.title);
|
|
121
194
|
};
|
|
122
195
|
const setDefaultRange = (monthNum, current) => {
|
|
@@ -220,9 +293,8 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
|
|
|
220
293
|
const index = monthsData.findIndex((item) => {
|
|
221
294
|
return +item.curData[0] === year && +item.curData[1] === month;
|
|
222
295
|
});
|
|
223
|
-
if (index > -1)
|
|
296
|
+
if (index > -1)
|
|
224
297
|
current = index;
|
|
225
|
-
}
|
|
226
298
|
}
|
|
227
299
|
return {
|
|
228
300
|
current,
|
|
@@ -270,12 +342,10 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
|
|
|
270
342
|
const getMonthNum = () => {
|
|
271
343
|
let monthNum = Number(endDates[1]) - Number(startDates[1]);
|
|
272
344
|
const yearNum = Number(endDates[0]) - Number(startDates[0]);
|
|
273
|
-
if (yearNum > 0)
|
|
345
|
+
if (yearNum > 0)
|
|
274
346
|
monthNum += 12 * yearNum;
|
|
275
|
-
|
|
276
|
-
if (monthNum <= 0) {
|
|
347
|
+
if (monthNum <= 0)
|
|
277
348
|
monthNum = 1;
|
|
278
|
-
}
|
|
279
349
|
setMonthsNum(monthNum);
|
|
280
350
|
return monthNum;
|
|
281
351
|
};
|
|
@@ -298,7 +368,7 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
|
|
|
298
368
|
initData();
|
|
299
369
|
};
|
|
300
370
|
useEffect(() => {
|
|
301
|
-
setCurrentDate(resetDefaultValue()
|
|
371
|
+
setCurrentDate(resetDefaultValue());
|
|
302
372
|
}, [defaultValue]);
|
|
303
373
|
useEffect(() => {
|
|
304
374
|
popup && resetRender();
|
|
@@ -461,7 +531,7 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
|
|
|
461
531
|
state.currDateArray = [...days];
|
|
462
532
|
}
|
|
463
533
|
if (!isFirst) {
|
|
464
|
-
onDayClick
|
|
534
|
+
onDayClick === null || onDayClick === void 0 ? void 0 : onDayClick(state.currDateArray);
|
|
465
535
|
if (autoBackfill || !popup) {
|
|
466
536
|
confirm();
|
|
467
537
|
}
|
|
@@ -471,9 +541,9 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
|
|
|
471
541
|
const confirm = () => {
|
|
472
542
|
if (type === "range" && state.currDateArray.length === 2 || type !== "range") {
|
|
473
543
|
const chooseData = state.currDateArray.slice(0);
|
|
474
|
-
onConfirm
|
|
544
|
+
onConfirm === null || onConfirm === void 0 ? void 0 : onConfirm(chooseData);
|
|
475
545
|
if (popup) {
|
|
476
|
-
onUpdate
|
|
546
|
+
onUpdate === null || onUpdate === void 0 ? void 0 : onUpdate();
|
|
477
547
|
}
|
|
478
548
|
}
|
|
479
549
|
};
|
|
@@ -498,7 +568,7 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
|
|
|
498
568
|
showTitle && React__default.createElement("div", { className: `${classPrefix}-title` }, title || locale.calendaritem.title),
|
|
499
569
|
renderHeaderButtons && React__default.createElement("div", { className: `${classPrefix}-header-buttons` }, renderHeaderButtons()),
|
|
500
570
|
showSubTitle && React__default.createElement("div", { className: `${classPrefix}-sub-title` }, yearMonthTitle),
|
|
501
|
-
React__default.createElement("div", { className: `${classPrefix}-weeks`, ref: weeksPanel }, weeks.map((item) => React__default.createElement("div", { className: `${classPrefix}-week-item`, key: item }, item)))
|
|
571
|
+
React__default.createElement("div", { className: `${classPrefix}-weeks ${showMonthNumber ? `${classPrefix}-weeks-shrink` : ""}`, ref: weeksPanel }, weeks.map((item) => React__default.createElement("div", { className: `${classPrefix}-week-item`, key: item }, item)))
|
|
502
572
|
);
|
|
503
573
|
};
|
|
504
574
|
const renderItem = (month, day, index) => {
|
|
@@ -507,12 +577,14 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
|
|
|
507
577
|
const noStartNorEnd = !startTip && !endTip;
|
|
508
578
|
return React__default.createElement(
|
|
509
579
|
"div",
|
|
510
|
-
{ className:
|
|
580
|
+
{ className: classNames("nut-calendar-day", getClasses(day, month)), onClick: () => handleDayClick(day, month, false), key: index },
|
|
511
581
|
React__default.createElement("div", { className: `${classPrefix}-day-day` }, renderDay ? renderDay(day) : day.day),
|
|
512
582
|
!startTip && renderDayTop && React__default.createElement("div", { className: `${classPrefix}-day-info-top` }, renderDayTop(day)),
|
|
513
583
|
noStartNorEnd && renderDayBottom && React__default.createElement("div", { className: `${classPrefix}-day-info-bottom` }, renderDayBottom(day)),
|
|
514
584
|
noStartNorEnd && !renderDayBottom && showToday && isCurrDay(month, day.day) && React__default.createElement("div", { className: `${classPrefix}-day-info-curr` }, locale.calendaritem.today),
|
|
515
|
-
startTip && React__default.createElement("div", { className:
|
|
585
|
+
startTip && React__default.createElement("div", { className: classNames("nut-calendar-day-info", {
|
|
586
|
+
"nut-calendar-day-info-top": isStartAndEnd(currentDate)
|
|
587
|
+
}) }, startText || locale.calendaritem.start),
|
|
516
588
|
endTip && React__default.createElement("div", { className: `${classPrefix}-day-info` }, endText || locale.calendaritem.end)
|
|
517
589
|
);
|
|
518
590
|
};
|
|
@@ -521,7 +593,12 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
|
|
|
521
593
|
"div",
|
|
522
594
|
{ className: `${classPrefix}-month`, key },
|
|
523
595
|
React__default.createElement("div", { className: `${classPrefix}-month-title` }, month.title),
|
|
524
|
-
React__default.createElement(
|
|
596
|
+
React__default.createElement(
|
|
597
|
+
"div",
|
|
598
|
+
{ className: `${showMonthNumber ? "shrink" : ""}` },
|
|
599
|
+
showMonthNumber && React__default.createElement("div", { className: `${classPrefix}-weeknumber` }, month.weekNo.map((item, index) => React__default.createElement("div", { className: `${classPrefix}-weeknumber-index`, key: index }, item))),
|
|
600
|
+
React__default.createElement("div", { className: `${classPrefix}-days` }, month.monthData.map((day, i) => renderItem(month, day, i)))
|
|
601
|
+
)
|
|
525
602
|
);
|
|
526
603
|
};
|
|
527
604
|
const renderContent = () => {
|
|
@@ -531,7 +608,7 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
|
|
|
531
608
|
React__default.createElement(
|
|
532
609
|
"div",
|
|
533
610
|
{ className: `${classPrefix}-pannel`, ref: monthsPanel },
|
|
534
|
-
React__default.createElement("div", {
|
|
611
|
+
React__default.createElement("div", { ref: viewAreaRef, style: { transform: `translateY(${translateY}px)` } }, monthsData.slice(monthDefaultRange[0], monthDefaultRange[1]).map((month, key) => {
|
|
535
612
|
return renderPanel(month, key);
|
|
536
613
|
}))
|
|
537
614
|
)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.nut-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--nutui-overlay-bg-color, var(--nutui-black-10, rgba(0, 0, 0, .7)));z-index:var(--nutui-overlay-zIndex, 1000)}.nut-overlay .wrapper .content{background-color:var(--nutui-overlay-content-bg-color, var(--nutui-gray-1, #ffffff));color:var(--nutui-overlay-content-color, var(--nutui-gray-7, #1a1a1a))}[dir=rtl] .nut-overlay,.nut-rtl .nut-overlay{left:auto;right:0}.nut-overflow-hidden{overflow:hidden!important}@keyframes nut-fade-in{0%{opacity:0}1%{opacity:0}to{opacity:1}}@keyframes nut-fade-out{0%{opacity:1}1%{opacity:1}to{opacity:0}}.nut-overlay-slide-enter-active,.nut-overlay-slide-appear-active{animation-fill-mode:both;animation-name:nut-fade-in;animation-duration:var(--nutui-overlay-animation-duration, .3s)}.nut-overlay-slide-exit-active{animation-fill-mode:both;animation-name:nut-fade-out;animation-duration:var(--nutui-overlay-animation-duration, .3s)}.nut-popup{position:fixed;min-height:26%;max-height:100%;overflow-y:auto;background-color:var(--nutui-overlay-content-bg-color, var(--nutui-gray-1, #ffffff));color:var(--nutui-gray-7, #1a1a1a);-webkit-overflow-scrolling:touch;font-size:var(--nutui-font-size-3, 14px)}.nut-popup-title{display:flex;align-items:center;justify-content:center;border-bottom:var(--nutui-popup-title-border-bottom, 0);padding:var(--nutui-popup-title-padding, 16px);position:relative}.nut-popup-title-left{position:absolute;left:var(--nutui-popup-title-padding, 16px)}.nut-popup-title-title{font-weight:var(--nutui-font-weight-bold, 500);font-size:var(--nutui-popup-title-font-size, var(--nutui-font-size-5, 18px))}.nut-popup-title-description{color:var(--nutui-gray-5, #8c8c8c);font-size:var(--nutui-popup-description-font-size, var(--nutui-font-size-1, 10px));font-weight:var(--nutui-font-weight, 400)}.nut-popup-title-right{position:absolute!important;z-index:1;cursor:pointer;width:var(--nutui-popup-icon-size, var(--nutui-font-size-5, 18px));height:var(--nutui-popup-icon-size, var(--nutui-font-size-5, 18px));display:flex;justify-content:center;align-items:center;top:var(--nutui-popup-title-padding, 16px);right:var(--nutui-popup-title-padding, 16px);color:var(--nutui-gray-5, #8c8c8c)}.nut-popup-title-right:active{opacity:.7}.nut-popup-title-right-top-left{top:var(--nutui-popup-title-padding, 16px);left:var(--nutui-popup-title-padding, 16px)}.nut-popup-title-right-bottom-left{bottom:var(--nutui-popup-title-padding, 16px);left:var(--nutui-popup-title-padding, 16px)}.nut-popup-title-right-bottom-right{right:var(--nutui-popup-title-padding, 16px);bottom:var(--nutui-popup-title-padding, 16px)}.nut-popup-center{top:50%;left:50%;min-height:10%;transform:translate(-50%,-50%)}.nut-popup-center.nut-popup-round{border-radius:var(--nutui-popup-border-radius, 24px)}.nut-popup-bottom,.nut-popup-top{max-height:83%}.nut-popup-bottom{bottom:0;left:0;width:100%}.nut-popup-bottom.nut-popup-round{border-radius:var(--nutui-popup-border-radius, 24px) var(--nutui-popup-border-radius, 24px) 0 0}.nut-popup-right{top:0;right:0}.nut-popup-right.nut-popup-round{border-radius:var(--nutui-popup-border-radius, 24px) 0 0 var(--nutui-popup-border-radius, 24px)}.nut-popup-left{top:0;left:0}.nut-popup-left.nut-popup-round{border-radius:0 var(--nutui-popup-border-radius, 24px) var(--nutui-popup-border-radius, 24px) 0}.nut-popup-top{top:0;left:0;width:100%}.nut-popup-top.nut-popup-round{border-radius:0 0 var(--nutui-popup-border-radius, 24px) var(--nutui-popup-border-radius, 24px)}@keyframes popup-scale-fade-in{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes popup-scale-fade-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.8)}}.nut-popup-slide-default-enter-active{animation-fill-mode:both;animation-name:popup-scale-fade-in;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-default-exit-active{animation-fill-mode:both;animation-name:popup-scale-fade-out;animation-duration:var(--nutui-popup-animation-duration, .3s)}@keyframes popup-fade-in{0%{opacity:0}to{opacity:1}}@keyframes popup-fade-out{0%{opacity:1}to{opacity:0}}.nut-popup-slide-center-enter-active{animation-fill-mode:both;animation-name:popup-fade-in;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-center-exit-active{animation-fill-mode:both;animation-name:popup-fade-out;animation-duration:var(--nutui-popup-animation-duration, .3s)}@keyframes popup-slide-top-enter{0%{transform:translate3d(0,-100%,0)}}@keyframes popup-slide-top-exit{to{transform:translate3d(0,-100%,0)}}.nut-popup-slide-top-enter-active,.nut-popup-slide-top-appear-active{transform:translateZ(0);animation-fill-mode:both;animation-name:popup-slide-top-enter;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-top-exit-active{animation-fill-mode:both;animation-name:popup-slide-top-exit;animation-duration:var(--nutui-popup-animation-duration, .3s)}@keyframes popup-slide-right-enter{0%{transform:translate3d(100%,0,0)}}@keyframes popup-slide-right-exit{to{transform:translate3d(100%,0,0)}}.nut-popup-slide-right-enter-active,.nut-popup-slide-right-appear-active{transform:translateZ(0);animation-fill-mode:both;animation-name:popup-slide-right-enter;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-right-exit{animation-fill-mode:both;animation-name:popup-slide-right-exit;animation-duration:var(--nutui-popup-animation-duration, .3s)}@keyframes popup-slide-bottom-enter{0%{transform:translate3d(0,100%,0)}}@keyframes slide-bottom-exit{to{transform:translate3d(0,100%,0)}}.nut-popup-slide-bottom-enter-active,.nut-popup-slide-bottom-appear-active{transform:translate(0);animation-fill-mode:both;animation-name:popup-slide-bottom-enter;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-bottom-exit{animation-fill-mode:both;animation-name:slide-bottom-exit;animation-duration:var(--nutui-popup-animation-duration, .3s)}@keyframes popup-slide-left-enter{0%{transform:translate3d(-100%,0,0)}}@keyframes popup-slide-left-exit{to{transform:translate3d(-100%,0,0)}}.nut-popup-slide-left-enter-active,.nut-popup-slide-left-appear-active{transform:translate(0);animation-fill-mode:both;animation-name:popup-slide-left-enter;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-left-exit-active,.nut-popup-slide-left-exit-done{animation-fill-mode:both;animation-name:popup-slide-left-exit;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-default-exit-done.nut-popup,.nut-popup-slide-center-exit-done.nut-popup,.nut-popup-slide-left-exit-done.nut-popup,.nut-popup-slide-right-exit-done.nut-popup,.nut-popup-slide-top-exit-done.nut-popup,.nut-popup-slide-bottom-exit-done.nut-popup{display:none}.nut-popup .nut-overflow-hidden{overflow:hidden!important}[dir=rtl] .nut-popup-title-left,.nut-rtl .nut-popup-title-left{left:auto;right:var(--nutui-popup-title-padding, 16px)}[dir=rtl] .nut-popup-title-right,.nut-rtl .nut-popup-title-right{right:auto;left:var(--nutui-popup-title-padding, 16px)}[dir=rtl] .nut-popup-title-right-top-left,.nut-rtl .nut-popup-title-right-top-left,[dir=rtl] .nut-popup-title-right-bottom-left,.nut-rtl .nut-popup-title-right-bottom-left{left:auto;right:var(--nutui-popup-title-padding, 16px)}[dir=rtl] .nut-popup-title-right-bottom-right,.nut-rtl .nut-popup-title-right-bottom-right{right:auto;left:var(--nutui-popup-title-padding, 16px)}[dir=rtl] .nut-popup-title .nut-icon-ArrowLeft,.nut-rtl .nut-popup-title .nut-icon-ArrowLeft{transform:rotate(180deg)}[dir=rtl] .nut-popup-center,.nut-rtl .nut-popup-center{left:auto;right:50%;transform:translate(50%,-50%)}[dir=rtl] .nut-popup-bottom,.nut-rtl .nut-popup-bottom,[dir=rtl] .nut-popup-top,.nut-rtl .nut-popup-top{left:auto;right:0}.nut-indicator{display:flex;width:auto;flex-wrap:nowrap;align-items:center}.nut-indicator-dot{display:inline-block;vertical-align:middle;width:var(--nutui-indicator-dot-size, 4px);height:var(--nutui-indicator-dot-size, 4px);border-radius:50%;background-color:var(--nutui-indicator-dot-color, var(--nutui-black-3, rgba(0, 0, 0, .06)));margin:0 var(--nutui-indicator-dot-margin, 2px)}.nut-indicator-dot:first-child{margin-left:0}.nut-indicator-dot:last-child{margin-right:0}.nut-indicator-active{width:var(--nutui-indicator-dot-active-size, 8px);border-radius:var(--nutui-indicator-border-radius, 2px);background:var(--nutui-indicator-color, linear-gradient(135deg, var(--nutui-color-primary-stop-1, #f53d4d) 0%, var(--nutui-color-primary-stop-2, #fa2c19) 100%))}.nut-indicator-vertical{display:flex;flex-direction:column;align-items:center;justify-content:center}.nut-indicator-vertical .nut-indicator-dot{margin:var(--nutui-indicator-dot-margin, 2px) 0}.nut-indicator-vertical .nut-indicator-dot:first-child{margin-top:0}.nut-indicator-vertical .nut-indicator-dot:last-child{margin-bottom:0}.nut-indicator-vertical .nut-indicator-active{width:var(--nutui-indicator-dot-size, 4px);height:var(--nutui-indicator-dot-active-size, 8px)}[dir=rtl] .nut-indicator-dot:first-child,.nut-rtl .nut-indicator-dot:first-child{margin-left:var(--nutui-indicator-dot-margin, 2px);margin-right:0}[dir=rtl] .nut-indicator-dot:last-child,.nut-rtl .nut-indicator-dot:last-child{margin-right:var(--nutui-indicator-dot-margin, 2px);margin-left:0}.nut-swiper{width:100%;height:100%;overflow:hidden;touch-action:none;position:relative}.nut-swiper-indicator{display:flex;position:absolute;left:50%;bottom:var(--nutui-swiper-indicator-bottom, 12px);transform:translate(-50%);z-index:1}.nut-swiper-indicator-vertical{top:50%;left:12px;bottom:auto;flex-direction:column;-webkit-box-orient:vertical;-webkit-box-direction:normal;transform:translateY(-50%);z-index:1}.nut-swiper-inner{width:100%;height:100%;display:flex;position:relative}.nut-swiper-inner-horizontal{transform:translate(var(--swiper-offset))}.nut-swiper-inner-vertical{transform:translateY(var(--swiper-offset));flex-direction:column}.nut-swiper-slide{width:100%;height:100%;position:relative;flex-shrink:0}.nut-swiper-item{width:100%;height:100%}[dir=rtl] .nut-swiper-indicator,.nut-rtl .nut-swiper-indicator{left:auto;right:50%;transform:translate(50%)}[dir=rtl] .nut-swiper-indicator-vertical,.nut-rtl .nut-swiper-indicator-vertical{left:auto;right:12px}.nut-video{width:100%;height:100%;position:relative;display:flex}.nut-video-player{width:100%;background:#000}.nut-video-player:focus{outline:none}.nut-video video{width:100%;height:100%;object-fit:fill}.nut-image{display:block;position:relative}.nut-image .nut-img{display:block;width:100%;height:100%}.nut-image.nut-image-round{border-radius:50%;overflow:hidden}.nut-image .nut-img-loading,.nut-image .nut-img-error{width:100%;height:100%;position:absolute;top:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--nutui-gray-3, #f6f6f6);background-size:100% 100%}[dir=rtl] .nut-image .nut-img-loading,.nut-rtl .nut-image .nut-img-loading,[dir=rtl] .nut-image .nut-img-error,.nut-rtl .nut-image .nut-img-error{left:auto;right:0}.nut-imagepreview{width:100%;height:100%}.nut-imagepreview-swiper{height:100%;width:100vw;background-color:transparent}.nut-imagepreview-index{position:fixed;z-index:2002;top:50px;text-align:center;left:0;right:0;background:transparent;color:#fff}.nut-imagepreview-index .arrow{position:absolute;left:15px;transform:rotate(180deg)}.nut-imagepreview-close{position:fixed;display:flex;align-items:center;justify-content:center;z-index:2002;background:transparent;color:#fff}.nut-imagepreview-close.top-right{top:50px;right:20px}.nut-imagepreview-close.top-left{top:50px;left:20px}.nut-imagepreview-close.bottom{bottom:50px;left:0;right:0;text-align:center}.nut-imagepreview-pop{height:100%;background:transparent!important;display:flex;align-items:center;width:100%}.nut-imagepreview-swiper .nut-imagepreview-swiper-item,.nut-imagepreview-swiper .nut-swiper-item{display:flex;align-items:center;justify-content:center;height:100%}.nut-imagepreview-swiper .nut-imagepreview-swiper-item .nut-image-preview-box,.nut-imagepreview-swiper .nut-swiper-item .nut-image-preview-box{width:100%}.nut-imagepreview-swiper .nut-imagepreview-swiper-item .nut-video video,.nut-imagepreview-swiper .nut-swiper-item .nut-video video{object-fit:contain}[dir=rtl] .nut-imagepreview-index .arrow,.nut-rtl .nut-imagepreview-index .arrow{left:auto;right:15px;transform:rotate(-180deg)}[dir=rtl] .nut-imagepreview-close.top-right,.nut-rtl .nut-imagepreview-close.top-right{right:auto;left:20px}[dir=rtl] .nut-imagepreview-close.top-left,.nut-rtl .nut-imagepreview-close.top-left{left:auto;right:20px}
|
|
1
|
+
.nut-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--nutui-overlay-bg-color, var(--nutui-black-10, rgba(0, 0, 0, .7)));z-index:var(--nutui-overlay-zIndex, 1000)}.nut-overlay .wrapper .content{background-color:var(--nutui-overlay-content-bg-color, var(--nutui-gray-1, #ffffff));color:var(--nutui-overlay-content-color, var(--nutui-gray-7, #1a1a1a))}[dir=rtl] .nut-overlay,.nut-rtl .nut-overlay{left:auto;right:0}.nut-overflow-hidden{overflow:hidden!important}@keyframes nut-fade-in{0%{opacity:0}1%{opacity:0}to{opacity:1}}@keyframes nut-fade-out{0%{opacity:1}1%{opacity:1}to{opacity:0}}.nut-overlay-slide-enter-active,.nut-overlay-slide-appear-active{animation-fill-mode:both;animation-name:nut-fade-in;animation-duration:var(--nutui-overlay-animation-duration, .3s)}.nut-overlay-slide-exit-active{animation-fill-mode:both;animation-name:nut-fade-out;animation-duration:var(--nutui-overlay-animation-duration, .3s)}.nut-popup{position:fixed;min-height:26%;max-height:100%;overflow-y:auto;background-color:var(--nutui-overlay-content-bg-color, var(--nutui-gray-1, #ffffff));color:var(--nutui-gray-7, #1a1a1a);-webkit-overflow-scrolling:touch;font-size:var(--nutui-font-size-3, 14px)}.nut-popup-title{display:flex;align-items:center;justify-content:center;border-bottom:var(--nutui-popup-title-border-bottom, 0);padding:var(--nutui-popup-title-padding, 16px);position:relative}.nut-popup-title-left{position:absolute;left:var(--nutui-popup-title-padding, 16px)}.nut-popup-title-title{font-weight:var(--nutui-font-weight-bold, 500);font-size:var(--nutui-popup-title-font-size, var(--nutui-font-size-5, 18px))}.nut-popup-title-description{color:var(--nutui-gray-5, #8c8c8c);font-size:var(--nutui-popup-description-font-size, var(--nutui-font-size-1, 10px));font-weight:var(--nutui-font-weight, 400)}.nut-popup-title-right{position:absolute!important;z-index:1;cursor:pointer;width:var(--nutui-popup-icon-size, var(--nutui-font-size-5, 18px));height:var(--nutui-popup-icon-size, var(--nutui-font-size-5, 18px));display:flex;justify-content:center;align-items:center;top:var(--nutui-popup-title-padding, 16px);right:var(--nutui-popup-title-padding, 16px);color:var(--nutui-gray-5, #8c8c8c)}.nut-popup-title-right:active{opacity:.7}.nut-popup-title-right-top-left{top:var(--nutui-popup-title-padding, 16px);left:var(--nutui-popup-title-padding, 16px)}.nut-popup-title-right-bottom-left{bottom:var(--nutui-popup-title-padding, 16px);left:var(--nutui-popup-title-padding, 16px)}.nut-popup-title-right-bottom-right{right:var(--nutui-popup-title-padding, 16px);bottom:var(--nutui-popup-title-padding, 16px)}.nut-popup-center{top:50%;left:50%;min-height:10%;transform:translate(-50%,-50%)}.nut-popup-center.nut-popup-round{border-radius:var(--nutui-popup-border-radius, 24px)}.nut-popup-bottom,.nut-popup-top{max-height:83%}.nut-popup-bottom{bottom:0;left:0;width:100%}.nut-popup-bottom.nut-popup-round{border-radius:var(--nutui-popup-border-radius, 24px) var(--nutui-popup-border-radius, 24px) 0 0}.nut-popup-right{top:0;right:0}.nut-popup-right.nut-popup-round{border-radius:var(--nutui-popup-border-radius, 24px) 0 0 var(--nutui-popup-border-radius, 24px)}.nut-popup-left{top:0;left:0}.nut-popup-left.nut-popup-round{border-radius:0 var(--nutui-popup-border-radius, 24px) var(--nutui-popup-border-radius, 24px) 0}.nut-popup-top{top:0;left:0;width:100%}.nut-popup-top.nut-popup-round{border-radius:0 0 var(--nutui-popup-border-radius, 24px) var(--nutui-popup-border-radius, 24px)}@keyframes popup-scale-fade-in{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes popup-scale-fade-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.8)}}.nut-popup-slide-default-enter-active{animation-fill-mode:both;animation-name:popup-scale-fade-in;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-default-exit-active{animation-fill-mode:both;animation-name:popup-scale-fade-out;animation-duration:var(--nutui-popup-animation-duration, .3s)}@keyframes popup-fade-in{0%{opacity:0}to{opacity:1}}@keyframes popup-fade-out{0%{opacity:1}to{opacity:0}}.nut-popup-slide-center-enter-active{animation-fill-mode:both;animation-name:popup-fade-in;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-center-exit-active{animation-fill-mode:both;animation-name:popup-fade-out;animation-duration:var(--nutui-popup-animation-duration, .3s)}@keyframes popup-slide-top-enter{0%{transform:translate3d(0,-100%,0)}}@keyframes popup-slide-top-exit{to{transform:translate3d(0,-100%,0)}}.nut-popup-slide-top-enter-active,.nut-popup-slide-top-appear-active{transform:translateZ(0);animation-fill-mode:both;animation-name:popup-slide-top-enter;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-top-exit-active{animation-fill-mode:both;animation-name:popup-slide-top-exit;animation-duration:var(--nutui-popup-animation-duration, .3s)}@keyframes popup-slide-right-enter{0%{transform:translate3d(100%,0,0)}}@keyframes popup-slide-right-exit{to{transform:translate3d(100%,0,0)}}.nut-popup-slide-right-enter-active,.nut-popup-slide-right-appear-active{transform:translateZ(0);animation-fill-mode:both;animation-name:popup-slide-right-enter;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-right-exit{animation-fill-mode:both;animation-name:popup-slide-right-exit;animation-duration:var(--nutui-popup-animation-duration, .3s)}@keyframes popup-slide-bottom-enter{0%{transform:translate3d(0,100%,0)}}@keyframes slide-bottom-exit{to{transform:translate3d(0,100%,0)}}.nut-popup-slide-bottom-enter-active,.nut-popup-slide-bottom-appear-active{transform:translate(0);animation-fill-mode:both;animation-name:popup-slide-bottom-enter;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-bottom-exit{animation-fill-mode:both;animation-name:slide-bottom-exit;animation-duration:var(--nutui-popup-animation-duration, .3s)}@keyframes popup-slide-left-enter{0%{transform:translate3d(-100%,0,0)}}@keyframes popup-slide-left-exit{to{transform:translate3d(-100%,0,0)}}.nut-popup-slide-left-enter-active,.nut-popup-slide-left-appear-active{transform:translate(0);animation-fill-mode:both;animation-name:popup-slide-left-enter;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-left-exit-active,.nut-popup-slide-left-exit-done{animation-fill-mode:both;animation-name:popup-slide-left-exit;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-default-exit-done.nut-popup,.nut-popup-slide-center-exit-done.nut-popup,.nut-popup-slide-left-exit-done.nut-popup,.nut-popup-slide-right-exit-done.nut-popup,.nut-popup-slide-top-exit-done.nut-popup,.nut-popup-slide-bottom-exit-done.nut-popup{display:none}.nut-popup .nut-overflow-hidden{overflow:hidden!important}[dir=rtl] .nut-popup-title-left,.nut-rtl .nut-popup-title-left{left:auto;right:var(--nutui-popup-title-padding, 16px)}[dir=rtl] .nut-popup-title-right,.nut-rtl .nut-popup-title-right{right:auto;left:var(--nutui-popup-title-padding, 16px)}[dir=rtl] .nut-popup-title-right-top-left,.nut-rtl .nut-popup-title-right-top-left,[dir=rtl] .nut-popup-title-right-bottom-left,.nut-rtl .nut-popup-title-right-bottom-left{left:auto;right:var(--nutui-popup-title-padding, 16px)}[dir=rtl] .nut-popup-title-right-bottom-right,.nut-rtl .nut-popup-title-right-bottom-right{right:auto;left:var(--nutui-popup-title-padding, 16px)}[dir=rtl] .nut-popup-title .nut-icon-ArrowLeft,.nut-rtl .nut-popup-title .nut-icon-ArrowLeft{transform:rotate(180deg)}[dir=rtl] .nut-popup-center,.nut-rtl .nut-popup-center{left:auto;right:50%;transform:translate(50%,-50%)}[dir=rtl] .nut-popup-bottom,.nut-rtl .nut-popup-bottom,[dir=rtl] .nut-popup-top,.nut-rtl .nut-popup-top{left:auto;right:0}.nut-indicator{display:flex;width:auto;flex-wrap:nowrap;align-items:center}.nut-indicator-dot{display:inline-block;vertical-align:middle;width:var(--nutui-indicator-dot-size, 4px);height:var(--nutui-indicator-dot-size, 4px);border-radius:50%;background-color:var(--nutui-indicator-dot-color, var(--nutui-black-3, rgba(0, 0, 0, .06)));margin:0 var(--nutui-indicator-dot-margin, 2px)}.nut-indicator-dot:first-child{margin-left:0}.nut-indicator-dot:last-child{margin-right:0}.nut-indicator-active{width:var(--nutui-indicator-dot-active-size, 8px);border-radius:var(--nutui-indicator-border-radius, 2px);background:var(--nutui-indicator-color, linear-gradient(135deg, var(--nutui-color-primary-stop-1, #f53d4d) 0%, var(--nutui-color-primary-stop-2, #fa2c19) 100%))}.nut-indicator-vertical{display:flex;flex-direction:column;align-items:center;justify-content:center}.nut-indicator-vertical .nut-indicator-dot{margin:var(--nutui-indicator-dot-margin, 2px) 0}.nut-indicator-vertical .nut-indicator-dot:first-child{margin-top:0}.nut-indicator-vertical .nut-indicator-dot:last-child{margin-bottom:0}.nut-indicator-vertical .nut-indicator-active{width:var(--nutui-indicator-dot-size, 4px);height:var(--nutui-indicator-dot-active-size, 8px)}[dir=rtl] .nut-indicator-dot:first-child,.nut-rtl .nut-indicator-dot:first-child{margin-left:var(--nutui-indicator-dot-margin, 2px);margin-right:0}[dir=rtl] .nut-indicator-dot:last-child,.nut-rtl .nut-indicator-dot:last-child{margin-right:var(--nutui-indicator-dot-margin, 2px);margin-left:0}.nut-swiper{width:100%;height:100%;overflow:hidden;touch-action:none;position:relative}.nut-swiper-canmove-horizontal{touch-action:pan-y}.nut-swiper-canmove-vertical{touch-action:pan-x}.nut-swiper-indicator{display:flex;position:absolute;left:50%;bottom:var(--nutui-swiper-indicator-bottom, 12px);transform:translate(-50%);z-index:1}.nut-swiper-indicator-vertical{top:50%;left:12px;bottom:auto;flex-direction:column;-webkit-box-orient:vertical;-webkit-box-direction:normal;transform:translateY(-50%);z-index:1}.nut-swiper-inner{width:100%;height:100%;display:flex;position:relative}.nut-swiper-inner-horizontal{transform:translate(var(--swiper-offset))}.nut-swiper-inner-vertical{transform:translateY(var(--swiper-offset));flex-direction:column}.nut-swiper-slide{width:100%;height:100%;position:relative;flex-shrink:0}.nut-swiper-item{width:100%;height:100%}[dir=rtl] .nut-swiper-indicator,.nut-rtl .nut-swiper-indicator{left:auto;right:50%;transform:translate(50%)}[dir=rtl] .nut-swiper-indicator-vertical,.nut-rtl .nut-swiper-indicator-vertical{left:auto;right:12px}.nut-video{width:100%;height:100%;position:relative;display:flex}.nut-video-player{width:100%;background:#000}.nut-video-player:focus{outline:none}.nut-video video{width:100%;height:100%;object-fit:fill}.nut-image{display:block;position:relative}.nut-image .nut-img{display:block;width:100%;height:100%}.nut-image.nut-image-round{border-radius:50%;overflow:hidden}.nut-image .nut-img-loading,.nut-image .nut-img-error{width:100%;height:100%;position:absolute;top:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--nutui-gray-3, #f6f6f6);background-size:100% 100%}[dir=rtl] .nut-image .nut-img-loading,.nut-rtl .nut-image .nut-img-loading,[dir=rtl] .nut-image .nut-img-error,.nut-rtl .nut-image .nut-img-error{left:auto;right:0}.nut-imagepreview{width:100%;height:100%}.nut-imagepreview-swiper{height:100%;width:100vw;background-color:transparent}.nut-imagepreview-index{position:fixed;z-index:2002;top:50px;text-align:center;left:0;right:0;background:transparent;color:#fff}.nut-imagepreview-index .arrow{position:absolute;left:15px;transform:rotate(180deg)}.nut-imagepreview-close{position:fixed;display:flex;align-items:center;justify-content:center;z-index:2002;background:transparent;color:#fff}.nut-imagepreview-close.top-right{top:50px;right:20px}.nut-imagepreview-close.top-left{top:50px;left:20px}.nut-imagepreview-close.bottom{bottom:50px;left:0;right:0;text-align:center}.nut-imagepreview-pop{height:100%;background:transparent!important;display:flex;align-items:center;width:100%}.nut-imagepreview-swiper .nut-imagepreview-swiper-item,.nut-imagepreview-swiper .nut-swiper-item{display:flex;align-items:center;justify-content:center;height:100%}.nut-imagepreview-swiper .nut-imagepreview-swiper-item .nut-image-preview-box,.nut-imagepreview-swiper .nut-swiper-item .nut-image-preview-box{width:100%}.nut-imagepreview-swiper .nut-imagepreview-swiper-item .nut-video video,.nut-imagepreview-swiper .nut-swiper-item .nut-video video{object-fit:contain}[dir=rtl] .nut-imagepreview-index .arrow,.nut-rtl .nut-imagepreview-index .arrow{left:auto;right:15px;transform:rotate(-180deg)}[dir=rtl] .nut-imagepreview-close.top-right,.nut-rtl .nut-imagepreview-close.top-right{right:auto;left:20px}[dir=rtl] .nut-imagepreview-close.top-left,.nut-rtl .nut-imagepreview-close.top-left{left:auto;right:20px}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.nut-indicator{display:flex;width:auto;flex-wrap:nowrap;align-items:center}.nut-indicator-dot{display:inline-block;vertical-align:middle;width:var(--nutui-indicator-dot-size, 4px);height:var(--nutui-indicator-dot-size, 4px);border-radius:50%;background-color:var(--nutui-indicator-dot-color, var(--nutui-black-3, rgba(0, 0, 0, .06)));margin:0 var(--nutui-indicator-dot-margin, 2px)}.nut-indicator-dot:first-child{margin-left:0}.nut-indicator-dot:last-child{margin-right:0}.nut-indicator-active{width:var(--nutui-indicator-dot-active-size, 8px);border-radius:var(--nutui-indicator-border-radius, 2px);background:var(--nutui-indicator-color, linear-gradient(135deg, var(--nutui-color-primary-stop-1, #f53d4d) 0%, var(--nutui-color-primary-stop-2, #fa2c19) 100%))}.nut-indicator-vertical{display:flex;flex-direction:column;align-items:center;justify-content:center}.nut-indicator-vertical .nut-indicator-dot{margin:var(--nutui-indicator-dot-margin, 2px) 0}.nut-indicator-vertical .nut-indicator-dot:first-child{margin-top:0}.nut-indicator-vertical .nut-indicator-dot:last-child{margin-bottom:0}.nut-indicator-vertical .nut-indicator-active{width:var(--nutui-indicator-dot-size, 4px);height:var(--nutui-indicator-dot-active-size, 8px)}[dir=rtl] .nut-indicator-dot:first-child,.nut-rtl .nut-indicator-dot:first-child{margin-left:var(--nutui-indicator-dot-margin, 2px);margin-right:0}[dir=rtl] .nut-indicator-dot:last-child,.nut-rtl .nut-indicator-dot:last-child{margin-right:var(--nutui-indicator-dot-margin, 2px);margin-left:0}.nut-swiper{width:100%;height:100%;overflow:hidden;touch-action:none;position:relative}.nut-swiper-indicator{display:flex;position:absolute;left:50%;bottom:var(--nutui-swiper-indicator-bottom, 12px);transform:translate(-50%);z-index:1}.nut-swiper-indicator-vertical{top:50%;left:12px;bottom:auto;flex-direction:column;-webkit-box-orient:vertical;-webkit-box-direction:normal;transform:translateY(-50%);z-index:1}.nut-swiper-inner{width:100%;height:100%;display:flex;position:relative}.nut-swiper-inner-horizontal{transform:translate(var(--swiper-offset))}.nut-swiper-inner-vertical{transform:translateY(var(--swiper-offset));flex-direction:column}.nut-swiper-slide{width:100%;height:100%;position:relative;flex-shrink:0}.nut-swiper-item{width:100%;height:100%}[dir=rtl] .nut-swiper-indicator,.nut-rtl .nut-swiper-indicator{left:auto;right:50%;transform:translate(50%)}[dir=rtl] .nut-swiper-indicator-vertical,.nut-rtl .nut-swiper-indicator-vertical{left:auto;right:12px}
|
|
1
|
+
.nut-indicator{display:flex;width:auto;flex-wrap:nowrap;align-items:center}.nut-indicator-dot{display:inline-block;vertical-align:middle;width:var(--nutui-indicator-dot-size, 4px);height:var(--nutui-indicator-dot-size, 4px);border-radius:50%;background-color:var(--nutui-indicator-dot-color, var(--nutui-black-3, rgba(0, 0, 0, .06)));margin:0 var(--nutui-indicator-dot-margin, 2px)}.nut-indicator-dot:first-child{margin-left:0}.nut-indicator-dot:last-child{margin-right:0}.nut-indicator-active{width:var(--nutui-indicator-dot-active-size, 8px);border-radius:var(--nutui-indicator-border-radius, 2px);background:var(--nutui-indicator-color, linear-gradient(135deg, var(--nutui-color-primary-stop-1, #f53d4d) 0%, var(--nutui-color-primary-stop-2, #fa2c19) 100%))}.nut-indicator-vertical{display:flex;flex-direction:column;align-items:center;justify-content:center}.nut-indicator-vertical .nut-indicator-dot{margin:var(--nutui-indicator-dot-margin, 2px) 0}.nut-indicator-vertical .nut-indicator-dot:first-child{margin-top:0}.nut-indicator-vertical .nut-indicator-dot:last-child{margin-bottom:0}.nut-indicator-vertical .nut-indicator-active{width:var(--nutui-indicator-dot-size, 4px);height:var(--nutui-indicator-dot-active-size, 8px)}[dir=rtl] .nut-indicator-dot:first-child,.nut-rtl .nut-indicator-dot:first-child{margin-left:var(--nutui-indicator-dot-margin, 2px);margin-right:0}[dir=rtl] .nut-indicator-dot:last-child,.nut-rtl .nut-indicator-dot:last-child{margin-right:var(--nutui-indicator-dot-margin, 2px);margin-left:0}.nut-swiper{width:100%;height:100%;overflow:hidden;touch-action:none;position:relative}.nut-swiper-canmove-horizontal{touch-action:pan-y}.nut-swiper-canmove-vertical{touch-action:pan-x}.nut-swiper-indicator{display:flex;position:absolute;left:50%;bottom:var(--nutui-swiper-indicator-bottom, 12px);transform:translate(-50%);z-index:1}.nut-swiper-indicator-vertical{top:50%;left:12px;bottom:auto;flex-direction:column;-webkit-box-orient:vertical;-webkit-box-direction:normal;transform:translateY(-50%);z-index:1}.nut-swiper-inner{width:100%;height:100%;display:flex;position:relative}.nut-swiper-inner-horizontal{transform:translate(var(--swiper-offset))}.nut-swiper-inner-vertical{transform:translateY(var(--swiper-offset));flex-direction:column}.nut-swiper-slide{width:100%;height:100%;position:relative;flex-shrink:0}.nut-swiper-item{width:100%;height:100%}[dir=rtl] .nut-swiper-indicator,.nut-rtl .nut-swiper-indicator{left:auto;right:50%;transform:translate(50%)}[dir=rtl] .nut-swiper-indicator-vertical,.nut-rtl .nut-swiper-indicator-vertical{left:auto;right:12px}
|
package/dist/esm/Swiper.js
CHANGED
|
@@ -255,19 +255,18 @@ const Swiper = React__default.forwardRef((props, ref) => {
|
|
|
255
255
|
const y = springs.y.get() / 100 * slideSize;
|
|
256
256
|
return [-x, -y];
|
|
257
257
|
},
|
|
258
|
-
triggerAllEvents: true,
|
|
259
258
|
bounds: () => {
|
|
260
259
|
if (loop)
|
|
261
260
|
return {};
|
|
262
261
|
const slideSize = getSlideSize();
|
|
263
|
-
getSwiperSize();
|
|
264
262
|
if (isVertical) {
|
|
265
263
|
return { top: 0, bottom: (count - 1) * slideSize };
|
|
266
264
|
}
|
|
267
265
|
return { left: 0, right: (count - 1) * slideSize };
|
|
268
266
|
},
|
|
269
|
-
preventDefault: true,
|
|
270
267
|
rubberband: true,
|
|
268
|
+
triggerAllEvents: true,
|
|
269
|
+
preventScroll: isVertical,
|
|
271
270
|
axis: isVertical ? "y" : "x",
|
|
272
271
|
pointer: {
|
|
273
272
|
touch: true
|
|
@@ -314,13 +313,13 @@ const Swiper = React__default.forwardRef((props, ref) => {
|
|
|
314
313
|
};
|
|
315
314
|
const renderSlides = () => {
|
|
316
315
|
return React__default.createElement("div", { ref: stageRef, className: classNames("nut-swiper-inner", {
|
|
317
|
-
|
|
318
|
-
|
|
316
|
+
[`${classPrefix}-inner-vertical`]: isVertical,
|
|
317
|
+
[`${classPrefix}-inner-horizontal`]: !isVertical
|
|
319
318
|
}), style: Object.assign({}, props.slideSize ? { [isVertical ? "height" : "width"]: `${props.slideSize}px` } : {}) }, renderEffect());
|
|
320
319
|
};
|
|
321
320
|
return React__default.createElement(
|
|
322
321
|
"div",
|
|
323
|
-
Object.assign({ className: classNames(
|
|
322
|
+
Object.assign({ className: classNames(classPrefix, `${classPrefix}-canmove-${direction}`, className), style, ref: swiperRef }, bind()),
|
|
324
323
|
renderSlides(),
|
|
325
324
|
renderIndicator()
|
|
326
325
|
);
|
|
@@ -49,6 +49,10 @@ const zhCN = {
|
|
|
49
49
|
start: "开始",
|
|
50
50
|
confirm: "确认",
|
|
51
51
|
title: "日历选择",
|
|
52
|
+
week: "周",
|
|
53
|
+
month: "月",
|
|
54
|
+
year: "年",
|
|
55
|
+
quarter: "季度",
|
|
52
56
|
monthTitle: (year, month) => `${year}年${Number(month) < 10 ? `0${Number(month)}` : month}月`,
|
|
53
57
|
today: "今天",
|
|
54
58
|
loadPreviousMonth: "加载上一个月",
|
package/dist/esm/date.js
CHANGED
|
@@ -62,86 +62,13 @@ const isEqual = (date1, date2) => {
|
|
|
62
62
|
const endTime = new Date(date2.replace(/-/g, "/")).getTime();
|
|
63
63
|
return startTime === endTime;
|
|
64
64
|
};
|
|
65
|
-
const getWeekDate = (year, month, date, firstDayOfWeek = 0) => {
|
|
66
|
-
const dateNow = new Date(Number(year), parseInt(month) - 1, Number(date));
|
|
67
|
-
const nowTime = dateNow.getTime();
|
|
68
|
-
let day = dateNow.getDay();
|
|
69
|
-
if (firstDayOfWeek === 0) {
|
|
70
|
-
const oneDayTime2 = 24 * 60 * 60 * 1e3;
|
|
71
|
-
const SundayTime2 = nowTime - day * oneDayTime2;
|
|
72
|
-
const SaturdayTime = nowTime + (6 - day) * oneDayTime2;
|
|
73
|
-
const sunday2 = date2Str(new Date(SundayTime2));
|
|
74
|
-
const saturday = date2Str(new Date(SaturdayTime));
|
|
75
|
-
return [sunday2, saturday];
|
|
76
|
-
}
|
|
77
|
-
day = day === 0 ? 7 : day;
|
|
78
|
-
const oneDayTime = 24 * 60 * 60 * 1e3;
|
|
79
|
-
const MondayTime = nowTime - (day - 1) * oneDayTime;
|
|
80
|
-
const SundayTime = nowTime + (7 - day) * oneDayTime;
|
|
81
|
-
const monday = date2Str(new Date(MondayTime));
|
|
82
|
-
const sunday = date2Str(new Date(SundayTime));
|
|
83
|
-
return [monday, sunday];
|
|
84
|
-
};
|
|
85
|
-
const formatResultDate = (date) => {
|
|
86
|
-
const [year, month, day] = [...date.split("-")];
|
|
87
|
-
const formatterDay = getNumTwoBit(Number(day));
|
|
88
|
-
const formatterDate = `${year}-${month}-${day}`;
|
|
89
|
-
const dayOfWeek = getWhatDay(Number(year), Number(month), Number(day));
|
|
90
|
-
return [year, month, formatterDay, formatterDate, dayOfWeek];
|
|
91
|
-
};
|
|
92
|
-
const getCurrMonthData = (type, year, month) => {
|
|
93
|
-
{
|
|
94
|
-
month === 12 && (year += 1);
|
|
95
|
-
month = month === 12 ? 1 : ++month;
|
|
96
|
-
}
|
|
97
|
-
return [year, getNumTwoBit(month), getMonthDays(String(year), String(month))];
|
|
98
|
-
};
|
|
99
|
-
const getDaysStatus = (type, year, month) => {
|
|
100
|
-
let days = getMonthDays(`${year}`, `${month}`);
|
|
101
|
-
return Array.from(Array(days), (v, k) => {
|
|
102
|
-
return {
|
|
103
|
-
day: k + 1,
|
|
104
|
-
type,
|
|
105
|
-
year,
|
|
106
|
-
month
|
|
107
|
-
};
|
|
108
|
-
});
|
|
109
|
-
};
|
|
110
|
-
const getPreMonthDates = (type, year, month, firstDayOfWeek) => {
|
|
111
|
-
let preMonth = +month - 1;
|
|
112
|
-
let preYear = year;
|
|
113
|
-
if (preMonth <= 0) {
|
|
114
|
-
preMonth = 12;
|
|
115
|
-
preYear += 1;
|
|
116
|
-
}
|
|
117
|
-
let days = getMonthPreDay(+year, +month);
|
|
118
|
-
days -= firstDayOfWeek;
|
|
119
|
-
if (days >= 7) {
|
|
120
|
-
days -= 7;
|
|
121
|
-
}
|
|
122
|
-
const preDates = getMonthDays(`${preYear}`, `${preMonth}`);
|
|
123
|
-
const months = Array.from(Array(preDates), (v, k) => {
|
|
124
|
-
return {
|
|
125
|
-
day: k + 1,
|
|
126
|
-
type,
|
|
127
|
-
preYear,
|
|
128
|
-
preMonth
|
|
129
|
-
};
|
|
130
|
-
});
|
|
131
|
-
return months.slice(preDates - days);
|
|
132
|
-
};
|
|
133
65
|
export {
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
66
|
+
getDateString as a,
|
|
67
|
+
getMonthDays as b,
|
|
68
|
+
getMonthPreDay as c,
|
|
137
69
|
date2Str as d,
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
isEqual as i,
|
|
143
|
-
getWeekDate as j,
|
|
144
|
-
getWhatDay as k,
|
|
145
|
-
formatResultDate as l,
|
|
146
|
-
getMonthPreDay as m
|
|
70
|
+
getWhatDay as e,
|
|
71
|
+
compareDate as f,
|
|
72
|
+
getNumTwoBit as g,
|
|
73
|
+
isEqual as i
|
|
147
74
|
};
|
|
@@ -0,0 +1,125 @@
|
|
|
1
|
+
import { i as isEqual, d as date2Str, g as getNumTwoBit } from "./date.js";
|
|
2
|
+
const splitDate = (date) => {
|
|
3
|
+
const split = date.indexOf("-") !== -1 ? "-" : "/";
|
|
4
|
+
return date.split(split);
|
|
5
|
+
};
|
|
6
|
+
const isMultiple = (day, days) => {
|
|
7
|
+
if (days.length > 0) {
|
|
8
|
+
return days.some((item) => {
|
|
9
|
+
return isEqual(item, day);
|
|
10
|
+
});
|
|
11
|
+
}
|
|
12
|
+
return false;
|
|
13
|
+
};
|
|
14
|
+
const isCurrDay = (month, day) => {
|
|
15
|
+
const date = `${month.curData[0]}/${month.curData[1]}/${day}`;
|
|
16
|
+
return isEqual(date, date2Str(/* @__PURE__ */ new Date(), "/"));
|
|
17
|
+
};
|
|
18
|
+
const getCurrDate = (day, month) => {
|
|
19
|
+
return `${month.curData[0]}/${month.curData[1]}/${getNumTwoBit(+day.day)}`;
|
|
20
|
+
};
|
|
21
|
+
const isStart = (day, days) => {
|
|
22
|
+
return isEqual(days[0], day);
|
|
23
|
+
};
|
|
24
|
+
const isEnd = (day, days) => {
|
|
25
|
+
return isEqual(days[1], day);
|
|
26
|
+
};
|
|
27
|
+
const isStartAndEnd = (days) => {
|
|
28
|
+
return days.length >= 2 && isEqual(days[0], days[1]);
|
|
29
|
+
};
|
|
30
|
+
const getPreMonths = (type, year, month) => {
|
|
31
|
+
const preMonth = +month - 1;
|
|
32
|
+
const months = Array.from(Array(preMonth), (v, k) => {
|
|
33
|
+
return {
|
|
34
|
+
year,
|
|
35
|
+
month: k + 1,
|
|
36
|
+
yearAndMonth: formatMonth(year, k + 1),
|
|
37
|
+
type
|
|
38
|
+
};
|
|
39
|
+
});
|
|
40
|
+
return months;
|
|
41
|
+
};
|
|
42
|
+
const getMonths = (type, year, month, endMonth = 12) => {
|
|
43
|
+
const nextMonth = endMonth - month + 1;
|
|
44
|
+
const months = Array.from(Array(nextMonth), (v, k) => {
|
|
45
|
+
return {
|
|
46
|
+
year,
|
|
47
|
+
month: k + month,
|
|
48
|
+
yearAndMonth: formatMonth(year, k + month),
|
|
49
|
+
type
|
|
50
|
+
};
|
|
51
|
+
});
|
|
52
|
+
return months;
|
|
53
|
+
};
|
|
54
|
+
const formatMonth = (year, month) => {
|
|
55
|
+
return `${year}-${String(month).padStart(2, "0")}`;
|
|
56
|
+
};
|
|
57
|
+
const formatQuarter = (year, quarter) => {
|
|
58
|
+
return `${year}-Q${quarter}`;
|
|
59
|
+
};
|
|
60
|
+
const getQuarter = (month) => {
|
|
61
|
+
if (month < 1 || month > 12) {
|
|
62
|
+
throw new Error("月份必须在 1 到 12 之间");
|
|
63
|
+
}
|
|
64
|
+
const quarter = Math.floor((month - 1) / 3) + 1;
|
|
65
|
+
return quarter;
|
|
66
|
+
};
|
|
67
|
+
const getQuarters = (type, year, month, endMonth = 12) => {
|
|
68
|
+
const quarters = [];
|
|
69
|
+
const startIndex = month;
|
|
70
|
+
const endIndex = endMonth;
|
|
71
|
+
for (let index = startIndex; index <= endIndex; index += 3) {
|
|
72
|
+
const quarter = getQuarter(index);
|
|
73
|
+
quarters.push({
|
|
74
|
+
year,
|
|
75
|
+
quarter,
|
|
76
|
+
yearAndQuarter: formatQuarter(year, quarter),
|
|
77
|
+
type
|
|
78
|
+
});
|
|
79
|
+
}
|
|
80
|
+
return quarters;
|
|
81
|
+
};
|
|
82
|
+
const getPreQuarters = (type, year, month) => {
|
|
83
|
+
const quarters = [];
|
|
84
|
+
const startIndex = 1;
|
|
85
|
+
const endIndex = month - 3;
|
|
86
|
+
for (let index = startIndex; index <= endIndex; index += 3) {
|
|
87
|
+
const quarter = getQuarter(index);
|
|
88
|
+
quarters.push({
|
|
89
|
+
year,
|
|
90
|
+
quarter,
|
|
91
|
+
yearAndQuarter: formatQuarter(year, quarter),
|
|
92
|
+
type
|
|
93
|
+
});
|
|
94
|
+
}
|
|
95
|
+
return quarters;
|
|
96
|
+
};
|
|
97
|
+
const getNextQuarters = (type, year, month, endMonth = 12) => {
|
|
98
|
+
const quarters = [];
|
|
99
|
+
const startIndex = month + 3;
|
|
100
|
+
const endIndex = endMonth;
|
|
101
|
+
for (let index = startIndex; index <= endIndex; index += 3) {
|
|
102
|
+
const quarter = getQuarter(index);
|
|
103
|
+
quarters.push({
|
|
104
|
+
year,
|
|
105
|
+
quarter,
|
|
106
|
+
yearAndQuarter: formatQuarter(year, quarter),
|
|
107
|
+
type
|
|
108
|
+
});
|
|
109
|
+
}
|
|
110
|
+
return quarters;
|
|
111
|
+
};
|
|
112
|
+
export {
|
|
113
|
+
getMonths as a,
|
|
114
|
+
getPreQuarters as b,
|
|
115
|
+
getQuarters as c,
|
|
116
|
+
getNextQuarters as d,
|
|
117
|
+
getCurrDate as e,
|
|
118
|
+
isEnd as f,
|
|
119
|
+
getPreMonths as g,
|
|
120
|
+
isMultiple as h,
|
|
121
|
+
isStart as i,
|
|
122
|
+
isCurrDay as j,
|
|
123
|
+
isStartAndEnd as k,
|
|
124
|
+
splitDate as s
|
|
125
|
+
};
|
package/dist/locales/base.d.ts
CHANGED
package/dist/locales/base.js
CHANGED