UNPKG

vxe-table-demonic

Version:

一个基于 vue 的 PC 端表单/表格组件,支持增删改查、虚拟列表、虚拟树、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、弹窗、自定义模板、渲染器、JSON 配置式...

1,133 lines 107 kB
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) { if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) { if (ar || !(i in from)) { if (!ar) ar = Array.prototype.slice.call(from, 0, i); ar[i] = from[i]; } } return to.concat(ar || Array.prototype.slice.call(from)); }; import { defineComponent, h, Teleport, ref, computed, reactive, inject, nextTick, watch, onUnmounted } from 'vue'; import XEUtils, { toNumber } from 'xe-utils'; import GlobalConfig from '../../v-x-e-table/src/conf'; import { useSize } from '../../hooks/size'; import { getFuncText, getLastZIndex, nextZIndex } from '../../tools/utils'; import { hasClass, getAbsolutePos, getEventTargetNode } from '../../tools/dom'; import { GlobalEvent, hasEventKey, EVENT_KEYS } from '../../tools/event'; import { toStringTimeDate, getDateQuarter } from './date'; import { handleNumber, toFloatValueFixed } from './number'; var yearSize = 12; var monthSize = 20; var quarterSize = 8; export default defineComponent({ name: 'VxeInput', props: { modelValue: [String, Number, Date], immediate: { type: Boolean, default: true }, name: String, type: { type: String, default: 'text' }, clearable: { type: Boolean, default: function () { return GlobalConfig.input.clearable; } }, readonly: Boolean, disabled: Boolean, placeholder: { type: String }, maxlength: [String, Number], autocomplete: { type: String, default: 'off' }, align: String, form: String, className: String, size: { type: String, default: function () { return GlobalConfig.input.size || GlobalConfig.size; } }, multiple: Boolean, // text showWordCount: Boolean, countMethod: Function, // number、integer、float min: { type: [String, Number], default: null }, max: { type: [String, Number], default: null }, step: [String, Number], exponential: { type: Boolean, default: function () { return GlobalConfig.input.exponential; } }, // number、integer、float、password controls: { type: Boolean, default: function () { return GlobalConfig.input.controls; } }, // float digits: { type: [String, Number], default: function () { return GlobalConfig.input.digits; } }, // date、week、month、quarter、year startDate: { type: [String, Number, Date], default: function () { return GlobalConfig.input.startDate; } }, endDate: { type: [String, Number, Date], default: function () { return GlobalConfig.input.endDate; } }, minDate: [String, Number, Date], maxDate: [String, Number, Date], // 已废弃 startWeek,被 startDay 替换 startWeek: Number, startDay: { type: [String, Number], default: function () { return GlobalConfig.input.startDay; } }, labelFormat: { type: String, default: function () { return GlobalConfig.input.labelFormat; } }, valueFormat: { type: String, default: function () { return GlobalConfig.input.valueFormat; } }, editable: { type: Boolean, default: true }, festivalMethod: { type: Function, default: function () { return GlobalConfig.input.festivalMethod; } }, disabledMethod: { type: Function, default: function () { return GlobalConfig.input.disabledMethod; } }, // week selectDay: { type: [String, Number], default: function () { return GlobalConfig.input.selectDay; } }, prefixIcon: String, suffixIcon: String, placement: String, transfer: { type: Boolean, default: function () { return GlobalConfig.input.transfer; } } }, emits: [ 'update:modelValue', 'input', 'change', 'keydown', 'keyup', 'wheel', 'click', 'focus', 'blur', 'clear', 'search-click', 'toggle-visible', 'prev-number', 'next-number', 'prefix-click', 'suffix-click', 'date-prev', 'date-today', 'date-next' ], setup: function (props, context) { var slots = context.slots, emit = context.emit; var $xeform = inject('$xeform', null); var $xeformiteminfo = inject('$xeformiteminfo', null); var xID = XEUtils.uniqueId(); var computeSize = useSize(props); var reactData = reactive({ inited: false, panelIndex: 0, showPwd: false, visiblePanel: false, animatVisible: false, panelStyle: null, panelPlacement: '', isActivated: false, inputValue: props.modelValue, datetimePanelValue: null, datePanelValue: null, datePanelLabel: '', datePanelType: 'day', selectMonth: null, currentDate: null }); var refElem = ref(); var refInputTarget = ref(); var refInputPanel = ref(); var refInputTimeBody = ref(); var refMaps = { refElem: refElem, refInput: refInputTarget }; var $xeinput = { xID: xID, props: props, context: context, reactData: reactData, getRefMaps: function () { return refMaps; } }; var inputMethods = {}; var parseDate = function (value, format) { var type = props.type; if (type === 'time') { return toStringTimeDate(value); } return XEUtils.toStringDate(value, format); }; var computeIsDateTimeType = computed(function () { var type = props.type; return type === 'time' || type === 'datetime'; }); var computeIsNumType = computed(function () { return ['number', 'integer', 'float'].indexOf(props.type) > -1; }); var computeInputCount = computed(function () { return XEUtils.getSize(reactData.inputValue); }); var computeIsCountError = computed(function () { var inputCount = computeInputCount.value; return props.maxlength && inputCount > XEUtils.toNumber(props.maxlength); }); var computeIsDatePickerType = computed(function () { var isDateTimeType = computeIsDateTimeType.value; return isDateTimeType || ['date', 'week', 'month', 'quarter', 'year'].indexOf(props.type) > -1; }); var computeIsPawdType = computed(function () { return props.type === 'password'; }); var computeIsSearchType = computed(function () { return props.type === 'search'; }); var computeDigitsValue = computed(function () { return XEUtils.toInteger(props.digits) || 1; }); var computeStepValue = computed(function () { var type = props.type; var digitsValue = computeDigitsValue.value; var step = props.step; if (type === 'integer') { return XEUtils.toInteger(step) || 1; } else if (type === 'float') { return XEUtils.toNumber(step) || (1 / Math.pow(10, digitsValue)); } return XEUtils.toNumber(step) || 1; }); var computeIsClearable = computed(function () { var type = props.type; var isNumType = computeIsNumType.value; var isDatePickerType = computeIsDatePickerType.value; var isPawdType = computeIsPawdType.value; return props.clearable && (isPawdType || isNumType || isDatePickerType || type === 'text' || type === 'search'); }); var computeDateStartTime = computed(function () { return props.startDate ? XEUtils.toStringDate(props.startDate) : null; }); var computeDateEndTime = computed(function () { return props.endDate ? XEUtils.toStringDate(props.endDate) : null; }); var computeSupportMultiples = computed(function () { return ['date', 'week', 'month', 'quarter', 'year'].includes(props.type); }); var computeDateListValue = computed(function () { var modelValue = props.modelValue, multiple = props.multiple; var isDatePickerType = computeIsDatePickerType.value; var dateValueFormat = computeDateValueFormat.value; if (multiple && modelValue && isDatePickerType) { return XEUtils.toValueString(modelValue).split(',').map(function (item) { var date = parseDate(item, dateValueFormat); if (XEUtils.isValidDate(date)) { return date; } return null; }); } return []; }); var computeDateMultipleValue = computed(function () { var dateListValue = computeDateListValue.value; var dateValueFormat = computeDateValueFormat.value; return dateListValue.map(function (date) { return XEUtils.toDateString(date, dateValueFormat); }); }); var computeDateMultipleLabel = computed(function () { var dateListValue = computeDateListValue.value; var dateLabelFormat = computeDateLabelFormat.value; return dateListValue.map(function (date) { return XEUtils.toDateString(date, dateLabelFormat); }).join(', '); }); var computeDateValueFormat = computed(function () { var type = props.type; return type === 'time' ? 'HH:mm:ss' : (props.valueFormat || (type === 'datetime' ? 'yyyy-MM-dd HH:mm:ss' : 'yyyy-MM-dd')); }); var computeDateValue = computed(function () { var modelValue = props.modelValue; var isDatePickerType = computeIsDatePickerType.value; var dateValueFormat = computeDateValueFormat.value; var val = null; if (modelValue && isDatePickerType) { var date = parseDate(modelValue, dateValueFormat); if (XEUtils.isValidDate(date)) { val = date; } } return val; }); var computeIsDisabledPrevDateBtn = computed(function () { var dateStartTime = computeDateStartTime.value; var selectMonth = reactData.selectMonth; if (selectMonth && dateStartTime) { return selectMonth <= dateStartTime; } return false; }); var computeIsDisabledNextDateBtn = computed(function () { var dateEndTime = computeDateEndTime.value; var selectMonth = reactData.selectMonth; if (selectMonth && dateEndTime) { return selectMonth >= dateEndTime; } return false; }); var computeDateTimeLabel = computed(function () { var datetimePanelValue = reactData.datetimePanelValue; if (datetimePanelValue) { return XEUtils.toDateString(datetimePanelValue, 'HH:mm:ss'); } return ''; }); var computeDateHMSTime = computed(function () { var dateValue = computeDateValue.value; var isDateTimeType = computeIsDateTimeType.value; return dateValue && isDateTimeType ? (dateValue.getHours() * 3600 + dateValue.getMinutes() * 60 + dateValue.getSeconds()) * 1000 : 0; }); var computeDateLabelFormat = computed(function () { var isDatePickerType = computeIsDatePickerType.value; if (isDatePickerType) { return props.labelFormat || GlobalConfig.i18n("vxe.input.date.labelFormat.".concat(props.type)); } return null; }); var computeYearList = computed(function () { var selectMonth = reactData.selectMonth, currentDate = reactData.currentDate; var years = []; if (selectMonth && currentDate) { var currFullYear = currentDate.getFullYear(); var selectFullYear = selectMonth.getFullYear(); var startYearDate = new Date(selectFullYear - selectFullYear % yearSize, 0, 1); for (var index = -4; index < yearSize + 4; index++) { var date = XEUtils.getWhatYear(startYearDate, index, 'first'); var itemFullYear = date.getFullYear(); years.push({ date: date, isCurrent: true, isPrev: index < 0, isNow: currFullYear === itemFullYear, isNext: index >= yearSize, year: itemFullYear }); } } return years; }); var computeSelectDatePanelLabel = computed(function () { var isDatePickerType = computeIsDatePickerType.value; if (isDatePickerType) { var datePanelType = reactData.datePanelType, selectMonth = reactData.selectMonth; var yearList = computeYearList.value; var year = ''; var month = void 0; if (selectMonth) { year = selectMonth.getFullYear(); month = selectMonth.getMonth() + 1; } if (datePanelType === 'quarter') { return GlobalConfig.i18n('vxe.input.date.quarterLabel', [year]); } else if (datePanelType === 'month') { return GlobalConfig.i18n('vxe.input.date.monthLabel', [year]); } else if (datePanelType === 'year') { return yearList.length ? "".concat(yearList[0].year, " - ").concat(yearList[yearList.length - 1].year) : ''; } return GlobalConfig.i18n('vxe.input.date.dayLabel', [year, month ? GlobalConfig.i18n("vxe.input.date.m".concat(month)) : '-']); } return ''; }); var computeFirstDayOfWeek = computed(function () { var startDay = props.startDay, startWeek = props.startWeek; return XEUtils.toNumber(XEUtils.isNumber(startDay) || XEUtils.isString(startDay) ? startDay : startWeek); }); var computeWeekDatas = computed(function () { var weeks = []; var isDatePickerType = computeIsDatePickerType.value; if (isDatePickerType) { var sWeek = computeFirstDayOfWeek.value; weeks.push(sWeek); for (var index = 0; index < 6; index++) { if (sWeek >= 6) { sWeek = 0; } else { sWeek++; } weeks.push(sWeek); } } return weeks; }); var computeDateHeaders = computed(function () { var isDatePickerType = computeIsDatePickerType.value; if (isDatePickerType) { var weekDatas = computeWeekDatas.value; return weekDatas.map(function (day) { return { value: day, label: GlobalConfig.i18n("vxe.input.date.weeks.w".concat(day)) }; }); } return []; }); var computeWeekHeaders = computed(function () { var isDatePickerType = computeIsDatePickerType.value; if (isDatePickerType) { var dateHeaders = computeDateHeaders.value; return [{ label: GlobalConfig.i18n('vxe.input.date.weeks.w') }].concat(dateHeaders); } return []; }); var computeYearDatas = computed(function () { var yearList = computeYearList.value; return XEUtils.chunk(yearList, 4); }); var computeQuarterList = computed(function () { var selectMonth = reactData.selectMonth, currentDate = reactData.currentDate; var quarters = []; if (selectMonth && currentDate) { var currFullYear = currentDate.getFullYear(); var currQuarter = getDateQuarter(currentDate); var firstYear = XEUtils.getWhatYear(selectMonth, 0, 'first'); var selFullYear = firstYear.getFullYear(); for (var index = -2; index < quarterSize - 2; index++) { var date = XEUtils.getWhatQuarter(firstYear, index); var itemFullYear = date.getFullYear(); var itemQuarter = getDateQuarter(date); var isPrev = itemFullYear < selFullYear; quarters.push({ date: date, isPrev: isPrev, isCurrent: itemFullYear === selFullYear, isNow: itemFullYear === currFullYear && itemQuarter === currQuarter, isNext: !isPrev && itemFullYear > selFullYear, quarter: itemQuarter }); } } return quarters; }); var computeQuarterDatas = computed(function () { var quarterList = computeQuarterList.value; return XEUtils.chunk(quarterList, 2); }); var computeMonthList = computed(function () { var selectMonth = reactData.selectMonth, currentDate = reactData.currentDate; var months = []; if (selectMonth && currentDate) { var currFullYear = currentDate.getFullYear(); var currMonth = currentDate.getMonth(); var selFullYear = XEUtils.getWhatYear(selectMonth, 0, 'first').getFullYear(); for (var index = -4; index < monthSize - 4; index++) { var date = XEUtils.getWhatYear(selectMonth, 0, index); var itemFullYear = date.getFullYear(); var itemMonth = date.getMonth(); var isPrev = itemFullYear < selFullYear; months.push({ date: date, isPrev: isPrev, isCurrent: itemFullYear === selFullYear, isNow: itemFullYear === currFullYear && itemMonth === currMonth, isNext: !isPrev && itemFullYear > selFullYear, month: itemMonth }); } } return months; }); var computeMonthDatas = computed(function () { var monthList = computeMonthList.value; return XEUtils.chunk(monthList, 4); }); var computeDayList = computed(function () { var selectMonth = reactData.selectMonth, currentDate = reactData.currentDate; var days = []; if (selectMonth && currentDate) { var dateHMSTime = computeDateHMSTime.value; var weekDatas = computeWeekDatas.value; var currFullYear = currentDate.getFullYear(); var currMonth = currentDate.getMonth(); var currDate = currentDate.getDate(); var selFullYear = selectMonth.getFullYear(); var selMonth = selectMonth.getMonth(); var selDay = selectMonth.getDay(); var prevOffsetDate = -weekDatas.indexOf(selDay); var startDayDate = new Date(XEUtils.getWhatDay(selectMonth, prevOffsetDate).getTime() + dateHMSTime); for (var index = 0; index < 42; index++) { var date = XEUtils.getWhatDay(startDayDate, index); var itemFullYear = date.getFullYear(); var itemMonth = date.getMonth(); var itemDate = date.getDate(); var isPrev = date < selectMonth; days.push({ date: date, isPrev: isPrev, isCurrent: itemFullYear === selFullYear && itemMonth === selMonth, isNow: itemFullYear === currFullYear && itemMonth === currMonth && itemDate === currDate, isNext: !isPrev && selMonth !== itemMonth, label: itemDate }); } } return days; }); var computeDayDatas = computed(function () { var dayList = computeDayList.value; return XEUtils.chunk(dayList, 7); }); var computeWeekDates = computed(function () { var dayDatas = computeDayDatas.value; var firstDayOfWeek = computeFirstDayOfWeek.value; return dayDatas.map(function (list) { var firstItem = list[0]; var item = { date: firstItem.date, isWeekNumber: true, isPrev: false, isCurrent: false, isNow: false, isNext: false, label: XEUtils.getYearWeek(firstItem.date, firstDayOfWeek) }; return [item].concat(list); }); }); var computeHourList = computed(function () { var list = []; var isDateTimeType = computeIsDateTimeType.value; if (isDateTimeType) { for (var index = 0; index < 24; index++) { list.push({ value: index, label: ('' + index).padStart(2, '0') }); } } return list; }); var computeMinuteList = computed(function () { var list = []; var isDateTimeType = computeIsDateTimeType.value; if (isDateTimeType) { for (var index = 0; index < 60; index++) { list.push({ value: index, label: ('' + index).padStart(2, '0') }); } } return list; }); var computeSecondList = computed(function () { var minuteList = computeMinuteList.value; return minuteList; }); var computeInpReadonly = computed(function () { var type = props.type, readonly = props.readonly, editable = props.editable, multiple = props.multiple; return readonly || multiple || !editable || type === 'week' || type === 'quarter'; }); var computeInputType = computed(function () { var type = props.type; var showPwd = reactData.showPwd; var isNumType = computeIsNumType.value; var isDatePickerType = computeIsDatePickerType.value; var isPawdType = computeIsPawdType.value; if (isDatePickerType || isNumType || (isPawdType && showPwd) || type === 'number') { return 'text'; } return type; }); var computeInpPlaceholder = computed(function () { var placeholder = props.placeholder; if (placeholder) { return getFuncText(placeholder); } return ''; }); var computeInpMaxlength = computed(function () { var maxlength = props.maxlength; var isNumType = computeIsNumType.value; // 数值最大长度限制 16 位,包含小数 return isNumType && !XEUtils.toNumber(maxlength) ? 16 : maxlength; }); var computeInpImmediate = computed(function () { var type = props.type, immediate = props.immediate; return immediate || !(type === 'text' || type === 'number' || type === 'integer' || type === 'float'); }); var computeNumValue = computed(function () { var type = props.type; var inputValue = reactData.inputValue; var isNumType = computeIsNumType.value; if (isNumType) { return type === 'integer' ? XEUtils.toInteger(handleNumber(inputValue)) : XEUtils.toNumber(handleNumber(inputValue)); } return 0; }); var computeIsDisabledSubtractNumber = computed(function () { var min = props.min; var inputValue = reactData.inputValue; var isNumType = computeIsNumType.value; var numValue = computeNumValue.value; // 当有值时再进行判断 if ((inputValue || inputValue === 0) && isNumType && min !== null) { return numValue <= XEUtils.toNumber(min); } return false; }); var computeIsDisabledAddNumber = computed(function () { var max = props.max; var inputValue = reactData.inputValue; var isNumType = computeIsNumType.value; var numValue = computeNumValue.value; // 当有值时再进行判断 if ((inputValue || inputValue === 0) && isNumType && max !== null) { return numValue >= XEUtils.toNumber(max); } return false; }); var getNumberValue = function (val) { var type = props.type, exponential = props.exponential; var inpMaxlength = computeInpMaxlength.value; var digitsValue = computeDigitsValue.value; var restVal = (type === 'float' ? toFloatValueFixed(val, digitsValue) : XEUtils.toValueString(val)); if (exponential && (val === restVal || XEUtils.toValueString(val).toLowerCase() === XEUtils.toNumber(restVal).toExponential())) { return val; } return restVal.slice(0, inpMaxlength); }; var triggerEvent = function (evnt) { var inputValue = reactData.inputValue; inputMethods.dispatchEvent(evnt.type, { value: inputValue }, evnt); }; var emitModel = function (value, evnt) { reactData.inputValue = value; var realValue = (value !== undefined && value !== null && ['number', 'integer', 'float'].includes(props.type) ? toNumber(value) : value); emit('update:modelValue', realValue); inputMethods.dispatchEvent('input', { value: value }, evnt); if (props.modelValue !== realValue) { inputMethods.dispatchEvent('change', { value: value }, evnt); // 自动更新校验状态 if ($xeform && $xeformiteminfo) { $xeform.triggerItemEvent(evnt, $xeformiteminfo.itemConfig.field, value); } } }; var emitInputEvent = function (value, evnt) { var isDatePickerType = computeIsDatePickerType.value; var inpImmediate = computeInpImmediate.value; reactData.inputValue = value; if (!isDatePickerType) { if (inpImmediate) { emitModel(value, evnt); } else { inputMethods.dispatchEvent('input', { value: value }, evnt); } } }; var inputEvent = function (evnt) { var inputElem = evnt.target; var value = inputElem.value; emitInputEvent(value, evnt); }; var changeEvent = function (evnt) { var inpImmediate = computeInpImmediate.value; if (!inpImmediate) { triggerEvent(evnt); } }; var focusEvent = function (evnt) { reactData.isActivated = true; var isDatePickerType = computeIsDatePickerType.value; if (isDatePickerType) { datePickerOpenEvent(evnt); } triggerEvent(evnt); }; var clickPrefixEvent = function (evnt) { var disabled = props.disabled; if (!disabled) { var inputValue = reactData.inputValue; inputMethods.dispatchEvent('prefix-click', { value: inputValue }, evnt); } }; var hidePanelTimeout; var hidePanel = function () { return new Promise(function (resolve) { var _a; reactData.visiblePanel = false; reactData.isActivated = false; (_a = refInputTarget.value) === null || _a === void 0 ? void 0 : _a.blur(); hidePanelTimeout = window.setTimeout(function () { reactData.animatVisible = false; resolve(); }, 350); }); }; var clearValueEvent = function (evnt, value) { var type = props.type; var isNumType = computeIsNumType.value; var isDatePickerType = computeIsDatePickerType.value; if (isDatePickerType) { hidePanel(); } if (isNumType || ['text', 'search', 'password'].indexOf(type) > -1) { focus(); } inputMethods.dispatchEvent('clear', { value: value }, evnt); }; var clickSuffixEvent = function (evnt) { var disabled = props.disabled; if (!disabled) { if (hasClass(evnt.currentTarget, 'is--clear')) { var newValue = computeIsNumType.value ? null : ''; emitModel(newValue, evnt); clearValueEvent(evnt, newValue); } else { var inputValue = reactData.inputValue; inputMethods.dispatchEvent('suffix-click', { value: inputValue }, evnt); } } }; var dateParseValue = function (value) { var type = props.type; var valueFormat = props.valueFormat; var dateLabelFormat = computeDateLabelFormat.value; var firstDayOfWeek = computeFirstDayOfWeek.value; var dValue = null; var dLabel = ''; if (value) { dValue = parseDate(value, valueFormat); } if (XEUtils.isValidDate(dValue)) { dLabel = XEUtils.toDateString(dValue, dateLabelFormat, { firstDay: firstDayOfWeek }); // 由于年份和第几周是冲突的行为,所以需要特殊处理,判断是否跨年 if (dateLabelFormat && type === 'week') { var firstWeekDate = XEUtils.getWhatWeek(dValue, 0, firstDayOfWeek, firstDayOfWeek); if (firstWeekDate.getFullYear() < dValue.getFullYear()) { var yyIndex = dateLabelFormat.indexOf('yyyy'); if (yyIndex > -1) { var yyNum = Number(dLabel.substring(yyIndex, yyIndex + 4)); if (yyNum && !isNaN(yyNum)) { dLabel = dLabel.replace("".concat(yyNum), "".concat(yyNum - 1)); } } } } } else { dValue = null; } reactData.datePanelValue = dValue; reactData.datePanelLabel = dLabel; }; /** * 值变化时处理 */ var changeValue = function () { var isDatePickerType = computeIsDatePickerType.value; var inputValue = reactData.inputValue; if (isDatePickerType) { dateParseValue(inputValue); reactData.inputValue = props.multiple ? computeDateMultipleLabel.value : reactData.datePanelLabel; } }; /** * 检查初始值 */ var initValue = function () { var type = props.type; var inputValue = reactData.inputValue; var isDatePickerType = computeIsDatePickerType.value; var digitsValue = computeDigitsValue.value; if (isDatePickerType) { changeValue(); } else if (type === 'float') { if (inputValue) { var validValue = toFloatValueFixed(inputValue, digitsValue); if (inputValue !== validValue) { emitModel(validValue, { type: 'init' }); } } } }; var vaildMaxNum = function (num) { return props.max === null || XEUtils.toNumber(num) <= XEUtils.toNumber(props.max); }; var vaildMinNum = function (num) { return props.min === null || XEUtils.toNumber(num) >= XEUtils.toNumber(props.min); }; var dateRevert = function () { reactData.inputValue = props.multiple ? computeDateMultipleLabel.value : reactData.datePanelLabel; }; var dateCheckMonth = function (date) { var month = XEUtils.getWhatMonth(date, 0, 'first'); if (!XEUtils.isEqual(month, reactData.selectMonth)) { reactData.selectMonth = month; } }; var dateChange = function (date) { var modelValue = props.modelValue, multiple = props.multiple; var datetimePanelValue = reactData.datetimePanelValue; var isDateTimeType = computeIsDateTimeType.value; var dateValueFormat = computeDateValueFormat.value; var firstDayOfWeek = computeFirstDayOfWeek.value; if (props.type === 'week') { var sWeek = XEUtils.toNumber(props.selectDay); date = XEUtils.getWhatWeek(date, 0, sWeek, firstDayOfWeek); } else if (isDateTimeType) { date.setHours(datetimePanelValue.getHours()); date.setMinutes(datetimePanelValue.getMinutes()); date.setSeconds(datetimePanelValue.getSeconds()); } var inpVal = XEUtils.toDateString(date, dateValueFormat, { firstDay: firstDayOfWeek }); dateCheckMonth(date); if (multiple) { // 如果为多选 var dateMultipleValue = computeDateMultipleValue.value; if (isDateTimeType) { // 如果是datetime特殊类型 var dateListValue = __spreadArray([], computeDateListValue.value, true); var datetimeRest_1 = []; var eqIndex = XEUtils.findIndexOf(dateListValue, function (val) { return XEUtils.isDateSame(date, val, 'yyyyMMdd'); }); if (eqIndex === -1) { dateListValue.push(date); } else { dateListValue.splice(eqIndex, 1); } dateListValue.forEach(function (item) { if (item) { item.setHours(datetimePanelValue.getHours()); item.setMinutes(datetimePanelValue.getMinutes()); item.setSeconds(datetimePanelValue.getSeconds()); datetimeRest_1.push(item); } }); emitModel(datetimeRest_1.map(function (date) { return XEUtils.toDateString(date, dateValueFormat); }).join(','), { type: 'update' }); } else { // 如果是日期类型 if (dateMultipleValue.some(function (val) { return XEUtils.isEqual(val, inpVal); })) { emitModel(dateMultipleValue.filter(function (val) { return !XEUtils.isEqual(val, inpVal); }).join(','), { type: 'update' }); } else { emitModel(dateMultipleValue.concat([inpVal]).join(','), { type: 'update' }); } } } else { // 如果为单选 if (!XEUtils.isEqual(modelValue, inpVal)) { emitModel(inpVal, { type: 'update' }); } } }; var afterCheckValue = function () { var type = props.type, min = props.min, max = props.max, exponential = props.exponential; var inputValue = reactData.inputValue, datetimePanelValue = reactData.datetimePanelValue; var isNumType = computeIsNumType.value; var isDatePickerType = computeIsDatePickerType.value; var dateLabelFormat = computeDateLabelFormat.value; var inpReadonly = computeInpReadonly.value; if (!inpReadonly) { if (isNumType) { if (inputValue) { var inpNumVal = type === 'integer' ? XEUtils.toInteger(handleNumber(inputValue)) : XEUtils.toNumber(handleNumber(inputValue)); if (!vaildMinNum(inpNumVal)) { inpNumVal = min; } else if (!vaildMaxNum(inpNumVal)) { inpNumVal = max; } if (exponential) { var inpStringVal = XEUtils.toValueString(inputValue).toLowerCase(); if (inpStringVal === XEUtils.toNumber(inpNumVal).toExponential()) { inpNumVal = inpStringVal; } } emitModel(getNumberValue(inpNumVal), { type: 'check' }); } } else if (isDatePickerType) { if (inputValue) { var inpDateVal = parseDate(inputValue, dateLabelFormat); if (XEUtils.isValidDate(inpDateVal)) { if (type === 'time') { inpDateVal = XEUtils.toDateString(inpDateVal, dateLabelFormat); if (inputValue !== inpDateVal) { emitModel(inpDateVal, { type: 'check' }); } reactData.inputValue = inpDateVal; } else { var isChange = false; var firstDayOfWeek = computeFirstDayOfWeek.value; if (type === 'datetime') { var dateValue = computeDateValue.value; if (inputValue !== XEUtils.toDateString(dateValue, dateLabelFormat) || inputValue !== XEUtils.toDateString(inpDateVal, dateLabelFormat)) { isChange = true; datetimePanelValue.setHours(inpDateVal.getHours()); datetimePanelValue.setMinutes(inpDateVal.getMinutes()); datetimePanelValue.setSeconds(inpDateVal.getSeconds()); } } else { isChange = true; } reactData.inputValue = XEUtils.toDateString(inpDateVal, dateLabelFormat, { firstDay: firstDayOfWeek }); if (isChange) { dateChange(inpDateVal); } } } else { dateRevert(); } } else { emitModel('', { type: 'check' }); } } } }; var blurEvent = function (evnt) { var inputValue = reactData.inputValue; var inpImmediate = computeInpImmediate.value; if (!inpImmediate) { emitModel(inputValue, evnt); } afterCheckValue(); if (!reactData.visiblePanel) { reactData.isActivated = false; } inputMethods.dispatchEvent('blur', { value: inputValue }, evnt); }; // 密码 var passwordToggleEvent = function (evnt) { var readonly = props.readonly, disabled = props.disabled; var showPwd = reactData.showPwd; if (!disabled && !readonly) { reactData.showPwd = !showPwd; } inputMethods.dispatchEvent('toggle-visible', { visible: reactData.showPwd }, evnt); }; // 密码 // 搜索 var searchEvent = function (evnt) { inputMethods.dispatchEvent('search-click', {}, evnt); }; // 搜索 // 数值 var numberChange = function (isPlus, evnt) { var min = props.min, max = props.max, type = props.type; var inputValue = reactData.inputValue; var stepValue = computeStepValue.value; var numValue = type === 'integer' ? XEUtils.toInteger(handleNumber(inputValue)) : XEUtils.toNumber(handleNumber(inputValue)); var newValue = isPlus ? XEUtils.add(numValue, stepValue) : XEUtils.subtract(numValue, stepValue); var restNum; if (!vaildMinNum(newValue)) { restNum = min; } else if (!vaildMaxNum(newValue)) { restNum = max; } else { restNum = newValue; } emitInputEvent(getNumberValue(restNum), evnt); }; var downbumTimeout; var numberNextEvent = function (evnt) { var readonly = props.readonly, disabled = props.disabled; var isDisabledSubtractNumber = computeIsDisabledSubtractNumber.value; clearTimeout(downbumTimeout); if (!disabled && !readonly && !isDisabledSubtractNumber) { numberChange(false, evnt); } inputMethods.dispatchEvent('next-number', {}, evnt); }; var numberDownNextEvent = function (evnt) { downbumTimeout = window.setTimeout(function () { numberNextEvent(evnt); numberDownNextEvent(evnt); }, 60); }; var numberPrevEvent = function (evnt) { var readonly = props.readonly, disabled = props.disabled; var isDisabledAddNumber = computeIsDisabledAddNumber.value; clearTimeout(downbumTimeout); if (!disabled && !readonly && !isDisabledAddNumber) { numberChange(true, evnt); } inputMethods.dispatchEvent('prev-number', {}, evnt); }; var numberKeydownEvent = function (evnt) { var isUpArrow = hasEventKey(evnt, EVENT_KEYS.ARROW_UP); var isDwArrow = hasEventKey(evnt, EVENT_KEYS.ARROW_DOWN); if (isUpArrow || isDwArrow) { evnt.preventDefault(); if (isUpArrow) { numberPrevEvent(evnt); } else { numberNextEvent(evnt); } } }; var keydownEvent = function (evnt) { var exponential = props.exponential, controls = props.controls; var isNumType = computeIsNumType.value; if (isNumType) { var isCtrlKey = evnt.ctrlKey; var isShiftKey = evnt.shiftKey; var isAltKey = evnt.altKey; var keyCode = evnt.keyCode; if (!isCtrlKey && !isShiftKey && !isAltKey && (hasEventKey(evnt, EVENT_KEYS.SPACEBAR) || ((!exponential || keyCode !== 69) && (keyCode >= 65 && keyCode <= 90)) || (keyCode >= 186 && keyCode <= 188) || keyCode >= 191)) { evnt.preventDefault(); } if (controls) { numberKeydownEvent(evnt); } } triggerEvent(evnt); }; var keyupEvent = function (evnt) { triggerEvent(evnt); }; // 数值 var numberStopDown = function () { clearTimeout(downbumTimeout); }; var numberDownPrevEvent = function (evnt) { downbumTimeout = window.setTimeout(function () { numberPrevEvent(evnt); numberDownPrevEvent(evnt); }, 60); }; var numberMousedownEvent = function (evnt) { numberStopDown(); if (evnt.button === 0) { var isPrevNumber_1 = hasClass(evnt.currentTarget, 'is--prev'); if (isPrevNumber_1) { numberPrevEvent(evnt); } else { numberNextEvent(evnt); } downbumTimeout = window.setTimeout(function () { if (isPrevNumber_1) { numberDownPrevEvent(evnt); } else { numberDownNextEvent(evnt); } }, 500); } }; var wheelEvent = function (evnt) { var isNumType = computeIsNumType.value; if (isNumType && props.controls) { if (reactData.isActivated) { var delta = evnt.deltaY; if (delta > 0) { numberNextEvent(evnt); } else if (delta < 0) { numberPrevEvent(evnt); } evnt.preventDefault(); } } triggerEvent(evnt); }; // 日期 var dateMonthHandle = function (date, offsetMonth) { reactData.selectMonth = XEUtils.getWhatMonth(date, offsetMonth, 'first'); }; var dateNowHandle = function () { var currentDate = XEUtils.getWhatDay(Date.now(), 0, 'first'); reactData.currentDate = currentDate; dateMonthHandle(currentDate, 0); }; var dateToggleTypeEvent = function () { var datePanelType = reactData.datePanelType; if (datePanelType === 'month' || datePanelType === 'quarter') { datePanelType = 'year'; } else { datePanelType = 'month'; } reactData.datePanelType = datePanelType; }; var datePrevEvent = function (evnt) { var type = props.type; var datePanelType = reactData.datePanelType, selectMonth = reactData.selectMonth; var isDisabledPrevDateBtn = computeIsDisabledPrevDateBtn.value; if (!isDisabledPrevDateBtn) { if (type === 'year') { reactData.selectMonth = XEUtils.getWhatYear(selectMonth, -yearSize, 'first'); } else if (type === 'month' || type === 'quarter') { if (datePanelType === 'year') { reactData.selectMonth = XEUtils.getWhatYear(selectMonth, -yearSize, 'first'); } else { reactData.selectMonth = XEUtils.getWhatYear(selectMonth, -1, 'first'); } } else { if (datePanelType === 'year') { reactData.selectMonth = XEUtils.getWhatYear(selectMonth, -yearSize, 'first'); } else if (datePanelType === 'month') { reactData.selectMonth = XEUtils.getWhatYear(selectMonth, -1, 'first'); } else { reactData.selectMonth = XEUtils.getWhatMonth(selectMonth, -1, 'first'); } } inputMethods.dispatchEvent('date-prev', { type: type }, evnt); } }; var dateTodayMonthEvent = function (evnt) { dateNowHandle(); if (!props.multiple) { dateChange(reactData.currentDate); hidePanel(); } inputMethods.dispatchEvent('date-today', { type: props.type }, evnt); }; var dateNextEvent = function (evnt) { var type = props.type; var datePanelType = reactData.datePanelType, selectMonth = reactData.selectMonth; var isDisabledNextDateBtn = computeIsDisabledNextDateBtn.value; if (!isDisabledNextDateBtn) { if (type === 'year') { reactData.selectMonth = XEUtils.getWhatYear(selectMonth, yearSize, 'first'); } else if (type === 'month' || type === 'quarter') { if (datePanelType === 'year') { reactData.selectMonth = XEUtils.getWhatYear(selectMonth, yearSize, 'first'); } else { reactData.selectMonth = XEUtils.getWhatYear(selectMonth, 1, 'first'); } } else { if (datePanelType === 'year') { reactData.selectMonth = XEUtils.getWhatYear(selectMonth,