fx-form-widget
Version:
114 lines (112 loc) • 4.14 kB
JavaScript
import _extends from "@babel/runtime/helpers/extends";
import _DatePicker from "antd/es/date-picker";
import _TimePicker from "antd/es/time-picker";
import * as React from 'react';
import dayjs from 'dayjs';
import { disabledDate, isNotNullValue } from './tools';
export var datePickerPickerType = {
enumKeys: ['date', 'week', 'month', 'quarter', 'year'],
enumNames: ['日', '周', '月', '季度', '年']
};
var getDataPick = function getDataPick(data, timeFormatType, picker) {
if (!isNotNullValue(data)) {
return;
}
if (timeFormatType === 'time') {
return dayjs(data, 'HH:mm:ss');
}
if (timeFormatType === 'dateTime') {
return dayjs(data, 'YYYY-MM-DD HH:mm:ss');
}
if (picker === 'week') {
return dayjs(data, 'YYYY-WW');
}
if (picker === 'year') {
return dayjs(data, 'YYYY');
}
if (picker === 'month') {
return dayjs(data, 'YYYY-MM');
}
if (picker === 'quarter') {
return dayjs(data, 'YYYY-Q');
}
return dayjs(data, 'YYYY-MM-DD');
};
var DatePickerWidget = function DatePickerWidget(_ref) {
var _ref$schema = _ref.schema,
schema = _ref$schema === void 0 ? {} : _ref$schema,
_ref$onChange = _ref.onChange,
onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange,
_ref$value = _ref.value,
value = _ref$value === void 0 ? undefined : _ref$value;
var _schema$readonly = schema.readonly,
readonly = _schema$readonly === void 0 ? false : _schema$readonly,
_schema$required = schema.required,
required = _schema$required === void 0 ? false : _schema$required,
_schema$placeholder = schema.placeholder,
placeholder = _schema$placeholder === void 0 ? '' : _schema$placeholder,
_schema$allowClear = schema.allowClear,
allowClear = _schema$allowClear === void 0 ? false : _schema$allowClear,
_schema$picker = schema.picker,
picker = _schema$picker === void 0 ? 'date' : _schema$picker,
_schema$timeFormatTyp = schema.timeFormatType,
timeFormatType = _schema$timeFormatTyp === void 0 ? 'date' : _schema$timeFormatTyp,
_schema$timeChooseSec = schema.timeChooseSection,
timeChooseSection = _schema$timeChooseSec === void 0 ? 1 : _schema$timeChooseSec;
var DefaultWigdet = timeFormatType === 'time' ? _TimePicker : _DatePicker;
var _React$useState = React.useState(),
formatValue = _React$useState[0],
setFormatValue = _React$useState[1];
React.useEffect(function () {
setFormatValue(getDataPick(value, timeFormatType, picker));
}, [value, timeFormatType, picker]);
// 默认值
var defaultOptions = {};
if (schema['ui_options']) {
Object.keys(schema['ui_options']).forEach(function (key) {
defaultOptions[key] = schema['ui_options'][key];
});
}
// 设置placeholder
var pickerName = '请选择' + (timeFormatType === 'time' ? '时间' : datePickerPickerType.enumNames[datePickerPickerType.enumKeys.indexOf(picker)]);
var disabledFunc = function disabledFunc(e) {
switch (timeChooseSection) {
case 1:
// 无限制
return false;
case 2:
// 今天之前(含今天)
return disabledDate(e, 'below', 0);
case 3:
// 今天之后(含今天)
return disabledDate(e, 'above');
}
};
var options = _extends({
disabled: readonly,
required: required,
placeholder: placeholder ? placeholder : pickerName,
allowClear: allowClear,
picker: picker,
disabledDate: disabledFunc,
showTime: timeFormatType === 'time' ? false : timeFormatType === 'dateTime' ? true : false
}, defaultOptions);
var handleChange = function handleChange(date, dateString) {
var chooseValue = dateString;
if (dateString.indexOf('周') !== -1) {
var tempArr = dateString.slice(0, -1).split('-');
chooseValue = tempArr[0] + 'W' + tempArr[1];
}
onChange(chooseValue);
setFormatValue(getDataPick(dateString, timeFormatType, picker));
};
return /*#__PURE__*/React.createElement(DefaultWigdet, _extends({
style: {
width: '100%'
}
}, options, {
value: formatValue,
onChange: handleChange
}));
};
export default DatePickerWidget;