@gdjiami/jm-mrc-components
Version:
移动端可复用组件库
59 lines (58 loc) • 2.87 kB
JavaScript
import { __extends, __read } from "tslib";
import React from 'react';
import MultiPicker from '@gdjiami/rmc-picker/es/MultiPicker';
import Picker from '@gdjiami/rmc-picker/es/Picker';
import Modal from 'antd-mobile/es/modal';
import { ChineseWeekDay } from '../calendar';
var list = [];
for (var i = 0; i < 7; i++) {
list.push(i);
}
var WeekDayPicker = /** @class */ (function (_super) {
__extends(WeekDayPicker, _super);
function WeekDayPicker() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.state = {
visible: false,
};
_this.handleSelectChange = function (_a) {
var _b = __read(_a, 1), weekday = _b[0];
if (_this.props.onChange) {
_this.props.onChange(weekday);
}
};
_this.handleOk = function () {
_this.setState({ visible: false });
};
_this.handleCancel = function () {
_this.setState({ visible: false });
if (_this.props.onChange) {
_this.props.onChange(_this.state.lastValue);
}
};
_this.handleShow = function () {
_this.setState({ visible: true, lastValue: _this.props.value });
};
return _this;
}
WeekDayPicker.prototype.render = function () {
var _a = this.props, children = _a.children, _b = _a.value, value = _b === void 0 ? 0 : _b, title = _a.title;
var visible = this.state.visible;
return (React.createElement(React.Fragment, null,
children(value, this.handleShow),
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(MultiPicker, { className: "jm-date-picker__body", selectedValue: [value], onValueChange: this.handleSelectChange },
React.createElement(Picker, { className: "jm-date-picker__date" }, list.map(function (i) { return (React.createElement(Picker.Item, { value: i, key: i },
"\u661F\u671F ",
ChineseWeekDay[i])); }))))));
};
WeekDayPicker.defaultProps = {
title: '选择星期',
};
return WeekDayPicker;
}(React.PureComponent));
export default WeekDayPicker;