zarm
Version:
基于 React 的移动端UI库
318 lines (272 loc) • 11.4 kB
JavaScript
import dayjs from 'dayjs';
import isLeapYear from 'dayjs/plugin/isLeapYear';
import isoWeek from 'dayjs/plugin/isoWeek';
import isoWeeksInYear from 'dayjs/plugin/isoWeeksInYear';
import isFunction from 'lodash/isFunction';
import * as React from 'react';
import { ConfigContext } from '../config-provider';
import { COLUMN_TYPE, MERIDIEM } from './interface';
dayjs.extend(isoWeek);
dayjs.extend(isoWeeksInYear);
dayjs.extend(isLeapYear);
export var generateMeridiemHour = function generateMeridiemHour(hour, hasMeridiem) {
if (!hasMeridiem) return hour;
if (hour === 0) hour = 12;
if (hour > 12) hour -= 12;
return hour;
};
export var useRenderLabel = function useRenderLabel(renderLabel) {
var _React$useContext = React.useContext(ConfigContext),
globalLocale = _React$useContext.locale;
var locale = globalLocale === null || globalLocale === void 0 ? void 0 : globalLocale.DatePickerView;
return React.useCallback(function (type, value) {
if (isFunction(renderLabel)) {
return renderLabel(type, value);
}
switch (type) {
case COLUMN_TYPE.YEAR:
return value + locale.year;
case COLUMN_TYPE.MONTH:
return value + locale.month;
case COLUMN_TYPE.WEEK:
return value + locale.week;
case COLUMN_TYPE.WEEK_DAY:
return locale.weeks[value - 1];
case COLUMN_TYPE.DAY:
return value + locale.day;
case COLUMN_TYPE.HOUR:
return value + locale.hour;
case COLUMN_TYPE.MINUTE:
return value + locale.minute;
case COLUMN_TYPE.SECOND:
return value + locale.second;
case COLUMN_TYPE.MERIDIEM:
return value === MERIDIEM.AM ? locale.am : locale.pm;
default:
return value.toString();
}
}, [renderLabel]);
};
export var padZero = function padZero(value) {
var length = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 2;
return String(value).padStart(length, '0');
};
export var generateDatePickerColumns = function generateDatePickerColumns(selectedValue, min, max, columnType, renderLabel, filter) {
var hasMeridiem = columnType.includes(COLUMN_TYPE.MERIDIEM);
var date = dayjs(selectedValue);
var minDate = dayjs(min);
var maxDate = dayjs(max);
var minYear = min.getFullYear();
var minMonth = min.getMonth() + 1;
var minDay = min.getDate();
var minWeek = minDate.isoWeek();
var minWeekday = minDate.isoWeekday();
var minHour = min.getHours();
var minMinute = min.getMinutes();
var minSecond = min.getSeconds();
var maxYear = max.getFullYear();
var maxMonth = max.getMonth() + 1;
var maxDay = max.getDate();
var maxWeek = maxDate.isoWeek();
var maxWeekday = maxDate.isoWeekday();
var maxHour = max.getHours();
var maxMinute = max.getMinutes();
var maxSecond = max.getSeconds();
var selectedYear = date.year();
var selectedMonth = date.month() + 1;
var selectedDay = date.date();
var selectedWeek = date.isoWeek();
var selectedHour = date.hour();
var selectedMinute = date.minute();
var selectedYearWeeks = dayjs("".concat(selectedYear, "/01/01")).isoWeeksInYear();
var isInMinYear = selectedYear === minYear;
var isInMaxYear = selectedYear === maxYear;
var isInMinMonth = isInMinYear && selectedMonth === minMonth;
var isInMaxMonth = isInMaxYear && selectedMonth === maxMonth;
var isInMinDay = isInMinMonth && selectedDay === minDay;
var isInMaxDay = isInMaxMonth && selectedDay === maxDay;
var isInMinWeek = isInMinYear && selectedWeek === minWeek;
var isInMaxWeek = isInMaxYear && selectedWeek === maxWeek;
var isInMinHour = isInMinDay && selectedHour === minHour;
var isInMaxHour = isInMaxDay && selectedHour === maxHour;
var isInMinMinute = isInMinHour && selectedMinute === minMinute;
var isInMaxMinute = isInMaxHour && selectedMinute === maxMinute;
var firstDayInSelectedMonth = dayjs(date).startOf('month');
var generateColumns = function generateColumns(from, to, type, iteratee) {
var options = [];
for (var i = from; i <= to; i++) {
options.push(iteratee(i));
}
if (isFunction(filter)) {
options = options.filter(function (option) {
return filter(type, {
get value() {
return option.value;
},
get date() {
return selectedValue;
}
});
});
}
return options;
};
var generateMeridiemHourColumn = function generateMeridiemHourColumn(hour) {
if (!hasMeridiem) return hour;
if (hour > 12) hour -= 12;
return hour;
};
var columns = [];
columnType === null || columnType === void 0 ? void 0 : columnType.forEach(function (type) {
switch (type) {
case COLUMN_TYPE.YEAR:
columns.push(generateColumns(minYear, maxYear, COLUMN_TYPE.YEAR, function (index) {
return {
value: index,
label: renderLabel(COLUMN_TYPE.YEAR, index)
};
}));
break;
case COLUMN_TYPE.MONTH:
columns.push(generateColumns(isInMinYear ? minMonth : 1, isInMaxYear ? maxMonth : 12, COLUMN_TYPE.MONTH, function (index) {
return {
value: index,
label: renderLabel(COLUMN_TYPE.MONTH, index)
};
}));
break;
case COLUMN_TYPE.WEEK:
columns.push(generateColumns(isInMinYear ? minWeek : 1, isInMaxYear ? maxWeek : selectedYearWeeks, COLUMN_TYPE.WEEK, function (index) {
return {
value: index,
label: renderLabel(COLUMN_TYPE.WEEK, index)
};
}));
break;
case COLUMN_TYPE.WEEK_DAY:
columns.push(generateColumns(isInMinWeek ? minWeekday : 1, isInMaxWeek ? maxWeekday : 7, COLUMN_TYPE.WEEK_DAY, function (index) {
return {
value: index,
label: renderLabel(COLUMN_TYPE.WEEK_DAY, index)
};
}));
break;
case COLUMN_TYPE.DAY:
columns.push(generateColumns(isInMinMonth ? minDay : 1, isInMaxMonth ? maxDay : firstDayInSelectedMonth.daysInMonth(), COLUMN_TYPE.DAY, function (index) {
return {
value: index,
label: renderLabel(COLUMN_TYPE.DAY, index)
};
}));
break;
case COLUMN_TYPE.MERIDIEM:
columns.push(generateColumns(MERIDIEM.AM, MERIDIEM.PM, COLUMN_TYPE.MERIDIEM, function (index) {
return {
value: index,
label: renderLabel(COLUMN_TYPE.MERIDIEM, index)
};
}));
break;
case COLUMN_TYPE.HOUR:
columns.push(generateColumns(generateMeridiemHourColumn(isInMinDay ? minHour : 0), generateMeridiemHourColumn(isInMaxDay ? maxHour : 23), COLUMN_TYPE.HOUR, function (index) {
return {
value: index,
label: renderLabel(COLUMN_TYPE.HOUR, generateMeridiemHour(index, hasMeridiem))
};
}));
break;
case COLUMN_TYPE.MINUTE:
columns.push(generateColumns(isInMinHour ? minMinute : 0, isInMaxHour ? maxMinute : 59, COLUMN_TYPE.MINUTE, function (index) {
return {
value: index,
label: renderLabel(COLUMN_TYPE.MINUTE, index)
};
}));
break;
case COLUMN_TYPE.SECOND:
columns.push(generateColumns(isInMinMinute ? minSecond : 0, isInMaxMinute ? maxSecond : 59, COLUMN_TYPE.SECOND, function (index) {
return {
value: index,
label: renderLabel(COLUMN_TYPE.SECOND, index)
};
}));
break;
}
});
return columns;
};
export var dateToNumberArray = function dateToNumberArray(value, columnType) {
var date = dayjs(value);
var hasWeek = columnType === null || columnType === void 0 ? void 0 : columnType.includes(COLUMN_TYPE.WEEK);
var hasMeridiem = columnType === null || columnType === void 0 ? void 0 : columnType.includes(COLUMN_TYPE.MERIDIEM);
return columnType === null || columnType === void 0 ? void 0 : columnType.map(function (type) {
switch (type) {
case COLUMN_TYPE.YEAR:
return hasWeek ? date.isoWeekYear() : date.year();
case COLUMN_TYPE.MONTH:
return date.month() + 1;
case COLUMN_TYPE.DAY:
return date.date();
case COLUMN_TYPE.WEEK:
return date.isoWeek();
case COLUMN_TYPE.WEEK_DAY:
return date.isoWeekday();
case COLUMN_TYPE.MERIDIEM:
return date.hour() >= 12 ? MERIDIEM.PM : MERIDIEM.AM;
case COLUMN_TYPE.HOUR:
return generateMeridiemHour(date.hour(), hasMeridiem);
case COLUMN_TYPE.MINUTE:
return date.minute();
case COLUMN_TYPE.SECOND:
return date.second();
default:
return undefined;
}
});
};
export var numberArrayToDate = function numberArrayToDate(currentValue, changedPickerValue, columnType, level) {
var _ref, _types$year, _ref2, _types$month, _types$week, _types$weekDay, _ref3, _types$day, _types$hour, _types$minute, _types$second;
var date = dayjs(currentValue);
var types = Object.fromEntries(columnType.map(function (type, index) {
return [type, changedPickerValue[index]];
}));
var currentColumnType = columnType[level];
var getMeridiemHour = function getMeridiemHour(meridiem, hour) {
if (meridiem === MERIDIEM.AM && hour >= 12) {
hour -= 12;
}
if (meridiem === MERIDIEM.PM && hour < 12) {
hour += 12;
}
return hour;
};
var getHour = function getHour(hour) {
var meridiemIndex = columnType === null || columnType === void 0 ? void 0 : columnType.findIndex(function (i) {
return i === COLUMN_TYPE.MERIDIEM;
});
var meridiemValue = changedPickerValue[meridiemIndex];
return getMeridiemHour(meridiemValue, hour);
};
var year = (_ref = (_types$year = types.year) !== null && _types$year !== void 0 ? _types$year : date.isoWeekYear()) !== null && _ref !== void 0 ? _ref : 1900;
var month = (_ref2 = (_types$month = types.month) !== null && _types$month !== void 0 ? _types$month : date.month() + 1) !== null && _ref2 !== void 0 ? _ref2 : 0;
var week = (_types$week = types.week) !== null && _types$week !== void 0 ? _types$week : 1;
var weekDay = (_types$weekDay = types['week-day']) !== null && _types$weekDay !== void 0 ? _types$weekDay : 1;
var day = (_ref3 = (_types$day = types.day) !== null && _types$day !== void 0 ? _types$day : date.date()) !== null && _ref3 !== void 0 ? _ref3 : 1;
var hour = (_types$hour = types.hour) !== null && _types$hour !== void 0 ? _types$hour : 0;
var minute = (_types$minute = types.minute) !== null && _types$minute !== void 0 ? _types$minute : 0;
var second = (_types$second = types.second) !== null && _types$second !== void 0 ? _types$second : 0;
var selectedMonth = month - 1;
var selectedDay = Math.min(day, dayjs(new Date(year, selectedMonth, 1)).daysInMonth());
var selectedHour = getHour(hour);
var selectedDate = dayjs().hour(selectedHour).minute(minute).second(second);
if (columnType.includes(COLUMN_TYPE.WEEK)) {
if (currentColumnType === COLUMN_TYPE.MONTH) {
return selectedDate.year(year).month(selectedMonth).toDate();
}
if (currentColumnType === COLUMN_TYPE.DAY) {
return selectedDate.year(year).isoWeek(week).date(selectedDay).toDate();
}
return selectedDate.year(year).isoWeek(week).isoWeekday(weekDay).toDate();
}
return selectedDate.year(year).month(selectedMonth).date(selectedDay).toDate();
};