@gdjiami/jm-mrc-components
Version:
移动端可复用组件库
63 lines (62 loc) • 2.79 kB
JavaScript
import { __assign, __extends, __rest } from "tslib";
/**
* 日期选择器
*/
import Modal from 'antd-mobile/es/modal';
import React from 'react';
import { Today } from '../calendar';
import DatePickerInner from './DatePickerInner';
var DatePicker = /** @class */ (function (_super) {
__extends(DatePicker, _super);
function DatePicker() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.state = {
visible: false,
value: _this.props.value,
};
_this.handleChange = function (value) {
_this.setState({ value: value });
};
_this.handleOk = function () {
_this.setState({ visible: false });
setTimeout(function () {
if (_this.props.onChange) {
_this.props.onChange(_this.state.value);
}
}, 400);
};
_this.handleCancel = function () {
_this.setState({ visible: false });
_this.reset();
};
_this.handleShow = function () {
_this.setState({ visible: true });
};
return _this;
}
DatePicker.prototype.componentDidUpdate = function (preProps) {
if (preProps.value !== this.props.value) {
this.setState({ value: this.props.value });
}
};
DatePicker.prototype.render = function () {
var _a = this.props, children = _a.children, title = _a.title, other = __rest(_a, ["children", "title"]);
var _b = this.state, visible = _b.visible, value = _b.value;
return (React.createElement(React.Fragment, null,
children(other.value || Today, this.handleShow, visible),
React.createElement(Modal, { transparent: true, maskClosable: false, visible: !!visible, className: "jm-date-picker", wrapClassName: "jm-date-picker__wrapper" },
React.createElement("div", { className: "jm-date-picker__header-bar" },
React.createElement("div", { className: "jm-date-picker__action", onClick: this.handleCancel }, "\u53D6\u6D88"),
React.createElement("div", { className: "jm-date-picker__title" }, title),
React.createElement("div", { className: "jm-date-picker__action", onClick: this.handleOk }, "\u786E\u5B9A")),
React.createElement(DatePickerInner, __assign({}, other, { onChange: this.handleChange, value: value })))));
};
DatePicker.prototype.reset = function () {
this.setState({ value: this.props.value });
};
DatePicker.defaultProps = {
title: '选择日期',
};
return DatePicker;
}(React.PureComponent));
export default DatePicker;