mobile-more
Version:
基于 antd-mobile v5 扩展移动端 UI 组件
71 lines • 2.97 kB
JavaScript
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
var _excluded = ["datePickerProps", "format", "readOnly", "disabled", "placeholder", "title", "longTermValue", "longTermLabel", "required"];
import * as React from 'react';
import { dayjs } from '../../../utils/dayjs.util';
import BizFormItem from '../FormItem';
import ExpireDatePicker, { DefaultFormat, MaxDate, MinDate } from './ExpireDatePicker';
import getDefaultPopupTitle from '../utils/getDefaultPopupTitle';
import { useConfig } from '../../BizConfigProvider';
var BizFormItemExpireDatePicker = function BizFormItemExpireDatePicker(props) {
var _useConfig = useConfig(),
locale = _useConfig.locale;
var datePickerProps = props.datePickerProps,
_props$format = props.format,
format = _props$format === void 0 ? DefaultFormat : _props$format,
readOnly = props.readOnly,
disabled = props.disabled,
placeholder = props.placeholder,
_props$title = props.title,
title = _props$title === void 0 ? getDefaultPopupTitle(props, locale) : _props$title,
longTermValue = props.longTermValue,
longTermLabel = props.longTermLabel,
required = props.required,
restProps = _objectWithoutProperties(props, _excluded);
var _React$useState = React.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
visible = _React$useState2[0],
setVisible = _React$useState2[1];
var transform = React.useCallback(function (value) {
if (format && value) {
return dayjs(value).format(format);
}
return value;
}, [format]);
return /*#__PURE__*/React.createElement(BizFormItem, _objectSpread(_objectSpread({
trigger: "onConfirm",
validateTrigger: "onConfirm",
arrow: false,
arrowIcon: false,
transform: transform,
disabled: disabled,
rules: [{
required: required,
message: locale.form.common.selectRequired
}],
required: required
}, restProps), {}, {
onClick: function onClick(e, widgetRef) {
var _restProps$onClick;
if (!disabled && !readOnly) {
setVisible(true);
}
restProps === null || restProps === void 0 ? void 0 : (_restProps$onClick = restProps.onClick) === null || _restProps$onClick === void 0 ? void 0 : _restProps$onClick.call(restProps, e, widgetRef);
}
}), /*#__PURE__*/React.createElement(ExpireDatePicker, _objectSpread({
visible: visible,
onClose: function onClose() {
return setVisible(false);
},
placeholder: placeholder,
longTermLabel: longTermLabel,
longTermValue: longTermValue,
readOnly: disabled || readOnly,
format: format,
title: title
}, datePickerProps)));
};
BizFormItemExpireDatePicker.MinDate = MinDate;
BizFormItemExpireDatePicker.MaxDate = MaxDate;
export default BizFormItemExpireDatePicker;