25개 이상의 토픽을 선택하실 수 없습니다. Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

TimePickerDialog.js 6.4 KiB

3 년 전
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210
  1. 'use strict';
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. var _extends2 = require('babel-runtime/helpers/extends');
  6. var _extends3 = _interopRequireDefault(_extends2);
  7. var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
  8. var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
  9. var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
  10. var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
  11. var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
  12. var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
  13. var _createClass2 = require('babel-runtime/helpers/createClass');
  14. var _createClass3 = _interopRequireDefault(_createClass2);
  15. var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
  16. var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
  17. var _inherits2 = require('babel-runtime/helpers/inherits');
  18. var _inherits3 = _interopRequireDefault(_inherits2);
  19. var _simpleAssign = require('simple-assign');
  20. var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
  21. var _react = require('react');
  22. var _react2 = _interopRequireDefault(_react);
  23. var _propTypes = require('prop-types');
  24. var _propTypes2 = _interopRequireDefault(_propTypes);
  25. var _reactEventListener = require('react-event-listener');
  26. var _reactEventListener2 = _interopRequireDefault(_reactEventListener);
  27. var _keycode = require('keycode');
  28. var _keycode2 = _interopRequireDefault(_keycode);
  29. var _Clock = require('./Clock');
  30. var _Clock2 = _interopRequireDefault(_Clock);
  31. var _Dialog = require('../Dialog');
  32. var _Dialog2 = _interopRequireDefault(_Dialog);
  33. var _FlatButton = require('../FlatButton');
  34. var _FlatButton2 = _interopRequireDefault(_FlatButton);
  35. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  36. var TimePickerDialog = function (_Component) {
  37. (0, _inherits3.default)(TimePickerDialog, _Component);
  38. function TimePickerDialog() {
  39. var _ref;
  40. var _temp, _this, _ret;
  41. (0, _classCallCheck3.default)(this, TimePickerDialog);
  42. for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
  43. args[_key] = arguments[_key];
  44. }
  45. return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref = TimePickerDialog.__proto__ || (0, _getPrototypeOf2.default)(TimePickerDialog)).call.apply(_ref, [this].concat(args))), _this), _this.state = {
  46. open: false
  47. }, _this.handleRequestClose = function () {
  48. _this.dismiss();
  49. }, _this.handleClickCancel = function () {
  50. _this.dismiss();
  51. }, _this.handleClickOK = function () {
  52. if (_this.props.onAccept) {
  53. _this.props.onAccept(_this.refs.clock.getSelectedTime());
  54. }
  55. _this.setState({
  56. open: false
  57. });
  58. }, _this.handleKeyUp = function (event) {
  59. switch ((0, _keycode2.default)(event)) {
  60. case 'enter':
  61. _this.handleClickOK();
  62. break;
  63. }
  64. }, _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
  65. }
  66. (0, _createClass3.default)(TimePickerDialog, [{
  67. key: 'show',
  68. value: function show() {
  69. if (this.props.onShow && !this.state.open) this.props.onShow();
  70. this.setState({
  71. open: true
  72. });
  73. }
  74. }, {
  75. key: 'dismiss',
  76. value: function dismiss() {
  77. if (this.props.onDismiss && this.state.open) this.props.onDismiss();
  78. this.setState({
  79. open: false
  80. });
  81. }
  82. }, {
  83. key: 'render',
  84. value: function render() {
  85. var _props = this.props,
  86. bodyStyle = _props.bodyStyle,
  87. initialTime = _props.initialTime,
  88. onAccept = _props.onAccept,
  89. format = _props.format,
  90. autoOk = _props.autoOk,
  91. okLabel = _props.okLabel,
  92. cancelLabel = _props.cancelLabel,
  93. style = _props.style,
  94. minutesStep = _props.minutesStep,
  95. other = (0, _objectWithoutProperties3.default)(_props, ['bodyStyle', 'initialTime', 'onAccept', 'format', 'autoOk', 'okLabel', 'cancelLabel', 'style', 'minutesStep']);
  96. var styles = {
  97. root: {
  98. fontSize: 14,
  99. color: this.context.muiTheme.timePicker.clockColor
  100. },
  101. dialogContent: {
  102. width: 280
  103. },
  104. body: {
  105. padding: 0
  106. }
  107. };
  108. var actions = [_react2.default.createElement(_FlatButton2.default, {
  109. key: 0,
  110. label: cancelLabel,
  111. primary: true,
  112. onClick: this.handleClickCancel
  113. }), _react2.default.createElement(_FlatButton2.default, {
  114. key: 1,
  115. label: okLabel,
  116. primary: true,
  117. onClick: this.handleClickOK
  118. })];
  119. var onClockChangeMinutes = autoOk === true ? this.handleClickOK : undefined;
  120. var open = this.state.open;
  121. return _react2.default.createElement(
  122. _Dialog2.default,
  123. (0, _extends3.default)({}, other, {
  124. style: (0, _simpleAssign2.default)(styles.root, style),
  125. bodyStyle: (0, _simpleAssign2.default)(styles.body, bodyStyle),
  126. actions: actions,
  127. contentStyle: styles.dialogContent,
  128. repositionOnUpdate: false,
  129. open: open,
  130. onRequestClose: this.handleRequestClose
  131. }),
  132. open && _react2.default.createElement(_reactEventListener2.default, { target: 'window', onKeyUp: this.handleKeyUp }),
  133. open && _react2.default.createElement(_Clock2.default, {
  134. ref: 'clock',
  135. format: format,
  136. initialTime: initialTime,
  137. onChangeMinutes: onClockChangeMinutes,
  138. minutesStep: minutesStep
  139. })
  140. );
  141. }
  142. }]);
  143. return TimePickerDialog;
  144. }(_react.Component);
  145. TimePickerDialog.defaultProps = {
  146. okLabel: 'OK',
  147. cancelLabel: 'Cancel'
  148. };
  149. TimePickerDialog.contextTypes = {
  150. muiTheme: _propTypes2.default.object.isRequired
  151. };
  152. TimePickerDialog.propTypes = process.env.NODE_ENV !== "production" ? {
  153. autoOk: _propTypes2.default.bool,
  154. bodyStyle: _propTypes2.default.object,
  155. cancelLabel: _propTypes2.default.node,
  156. format: _propTypes2.default.oneOf(['ampm', '24hr']),
  157. initialTime: _propTypes2.default.object,
  158. minutesStep: _propTypes2.default.number,
  159. okLabel: _propTypes2.default.node,
  160. onAccept: _propTypes2.default.func,
  161. onDismiss: _propTypes2.default.func,
  162. onShow: _propTypes2.default.func,
  163. style: _propTypes2.default.object
  164. } : {};
  165. exports.default = TimePickerDialog;