@seafile/seafile-calendar 0.0.29-alpha.4 → 0.0.29-alpha12

package/lib/Calendar.js

@@ -186,7 +186,7 @@ var Calendar = function (_React$Component) {
       key: 'date-input',
       value: value,
       locale: locale,
-      placeholder: dateInputPlaceholder,
+      placeholder: dateInputPlaceholder || this.getFormat()[0],
       showClear: true,
       disabledTime: disabledTime,
       disabledDate: disabledDate,
@@ -196,7 +196,8 @@ var Calendar = function (_React$Component) {
       onChange: this.onDateInputChange,
       onSelect: this.onDateInputSelect,
       clearIcon: clearIcon,
-      inputMode: inputMode
+      inputMode: inputMode,
+      showHourAndMinute: showHourAndMinute
     }) : null;
 
     var children = [];
@@ -278,7 +279,9 @@ var Calendar = function (_React$Component) {
           locale: locale,
           onSelect: this.onDateTableSelect,
           onClickRightPanelTime: onClickRightPanelTime,
-          defaultMinutesTime: this.props.defaultMinutesTime
+          defaultMinutesTime: this.props.defaultMinutesTime,
+          showHourAndMinute: showHourAndMinute,
+          format: this.getFormat()
         })
       )
     ));
@@ -325,7 +328,8 @@ Calendar.propTypes = (0, _extends3['default'])({}, _CalendarMixin.calendarMixinP
   focusablePanel: _propTypes2['default'].bool,
   inputMode: _propTypes2['default'].string,
   onBlur: _propTypes2['default'].func,
-  onClickRightPanelTime: _propTypes2['default'].func
+  onClickRightPanelTime: _propTypes2['default'].func,
+  firstDayOfWeek: _propTypes2['default'].string
 });
 Calendar.defaultProps = (0, _extends3['default'])({}, _CalendarMixin.calendarMixinDefaultProps, _CommonMixin.defaultProp, {
   showToday: true,

package/lib/Picker.js

@@ -195,6 +195,7 @@ var _initialiseProps = function _initialiseProps() {
     if (cause.source === 'keyboard' || cause.source === 'dateInputSelect' || !props.calendar.props.timePicker && cause.source !== 'dateInput' || cause.source === 'todayButton') {
       _this2.close(_this2.focus);
     }
+    console.log('onCalendarSelect', value, cause);
     props.onChange(value);
   };
 

package/lib/calendar/CalendarRightPanel.js

@@ -26,6 +26,8 @@ var _dayjs = require('dayjs');
 
 var _dayjs2 = _interopRequireDefault(_dayjs);
 
+var _util = require('../util');
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
 
 var CalendarRightPanel = function (_React$Component) {
@@ -64,7 +66,8 @@ var CalendarRightPanel = function (_React$Component) {
     };
 
     _this.state = {
-      highlightTime: _this.props.value || null
+      highlightTime: _this.props.value || null,
+      localeFormat: _this.props.format[0]
     };
     _this.timeRef = _react2['default'].createRef();
     _this.times = _this.getTimes();
@@ -87,9 +90,13 @@ var CalendarRightPanel = function (_React$Component) {
     var _props = this.props,
         value = _props.value,
         prefixCls = _props.prefixCls,
-        locale = _props.locale;
+        locale = _props.locale,
+        showHourAndMinute = _props.showHourAndMinute;
 
     var selectedDate = value.format().slice(0, 10);
+    if (showHourAndMinute) {
+      selectedDate = value.format().slice(0, String(value.format()).indexOf('T')).padStart(10, 0);
+    }
     var highlight = this.state.highlightTime;
     var highlightTime = highlight ? highlight.format().slice(11, 16) : null;
     var isZhcn = locale && locale.today === '今天';
@@ -109,6 +116,12 @@ var CalendarRightPanel = function (_React$Component) {
           null,
           this.times.map(function (time) {
             var current = (0, _dayjs2['default'])(selectedDate + ' ' + time);
+            if (showHourAndMinute) {
+              var parts = (0, _util.formatDateLocal)(selectedDate, _this2.state.localeFormat);
+              if (parts[0] && parts[0].length === 4 && (parts[0].slice(0, 3) === '000' || parts[0].slice(0, 2) === '00')) {
+                current.year(parts[0]);
+              }
+            }
             current = isZhcn ? current.locale('zh-cn') : current.locale('en-gb');
             return _react2['default'].createElement(
               'li',
@@ -139,7 +152,9 @@ CalendarRightPanel.propTypes = {
   onSelect: _propTypes2['default'].func,
   onClickRightPanelTime: _propTypes2['default'].func,
   locale: _propTypes2['default'].object,
-  defaultMinutesTime: _propTypes2['default'].string
+  defaultMinutesTime: _propTypes2['default'].string,
+  format: _propTypes2['default'].oneOfType([_propTypes2['default'].string, _propTypes2['default'].arrayOf(_propTypes2['default'].string)]),
+  showHourAndMinute: _propTypes2['default'].bool
 };
 exports['default'] = CalendarRightPanel;
 module.exports = exports['default'];

package/lib/date/DateInput.js

@@ -55,17 +55,19 @@ var DateInput = function (_React$Component) {
     _initialiseProps.call(_this);
 
     var selectedValue = props.selectedValue;
-
+    var formatPrefix = _this.props.format[0];
     _this.state = {
       str: (0, _util.formatDate)(selectedValue, _this.props.format),
-      invalid: false,
-      hasFocus: false
+      hasFocus: false,
+      localeFormat: formatPrefix,
+      delimiter: (0, _util.delimate)(formatPrefix),
+      cananderIput: ''
     };
     return _this;
   }
 
   DateInput.prototype.componentDidUpdate = function componentDidUpdate() {
-    if (dateInputInstance && this.state.hasFocus && !this.state.invalid && !(cachedSelectionStart === 0 && cachedSelectionEnd === 0)) {
+    if (dateInputInstance && this.state.hasFocus && !(cachedSelectionStart === 0 && cachedSelectionEnd === 0)) {
       dateInputInstance.setSelectionRange(cachedSelectionStart, cachedSelectionEnd);
     }
   };
@@ -80,12 +82,31 @@ var DateInput = function (_React$Component) {
     // when popup show, click body will call this, bug!
     var selectedValue = nextProps.selectedValue;
     if (!state.hasFocus) {
-      newState = {
-        str: (0, _util.formatDate)(selectedValue, nextProps.format),
-        invalid: false
-      };
+      var timeStr = (0, _util.formatDate)(selectedValue, nextProps.format).split(' ')[0];
+      var parts = timeStr.split(state.delimiter);
+      var timeParts = (0, _util.formatDate)(selectedValue, nextProps.format).split(' ')[1];
+      if (parts.length === 3) {
+        if (state.localeFormat === _util.DATE_FORMATS.ISO) {
+          newState = { str: parts[0].padStart(4, 0) + '-' + parts[1] + '-' + parts[2] };
+        } else if (state.localeFormat === _util.DATE_FORMATS.ISOAndTime) {
+          newState = {
+            str: parts[0].padStart(4, 0) + '-' + parts[1] + '-' + parts[2] + ' ' + (nextProps.showHourAndMinute ? timeParts : '') // eslint-disable-line max-len
+          };
+        } else if (state.localeFormat === _util.DATE_FORMATS.US) {
+          newState = { str: Number(parts[0]) + '/' + Number(parts[1]) + '/' + parts[2].padStart(4, 0) };
+        } else if (state.localeFormat === _util.DATE_FORMATS.USAndTime) {
+          newState = {
+            str: Number(parts[0]) + '/' + Number(parts[1]) + '/' + parts[2].padStart(4, 0) + ' ' + (nextProps.showHourAndMinute ? timeParts : '') // eslint-disable-line max-len
+          };
+        } else if (state.localeFormat === _util.DATE_FORMATS.European || state.localeFormat === _util.DATE_FORMATS.Germany_Russia_etc) {
+          newState = { str: '' + Number(parts[0]) + state.delimiter + Number(parts[1]) + state.delimiter + parts[2].padStart(4, 0) }; // eslint-disable-line max-len
+        } else if (state.localeFormat === _util.DATE_FORMATS.EuropeanAndTime || state.localeFormat === _util.DATE_FORMATS.Germany_Russia_etcAndTime) {
+          newState = {
+            str: '' + Number(parts[0]) + state.delimiter + Number(parts[1]) + state.delimiter + parts[2].padStart(4, 0) + ' ' + (nextProps.showHourAndMinute ? timeParts : '') // eslint-disable-line max-len
+          };
+        }
+      }
     }
-
     return newState;
   };
 
@@ -95,16 +116,13 @@ var DateInput = function (_React$Component) {
 
   DateInput.prototype.render = function render() {
     var props = this.props;
-    var _state = this.state,
-        invalid = _state.invalid,
-        str = _state.str;
+    var str = this.state.str;
     var locale = props.locale,
         prefixCls = props.prefixCls,
         placeholder = props.placeholder,
         clearIcon = props.clearIcon,
         inputMode = props.inputMode;
 
-    var invalidClass = invalid ? prefixCls + '-input-invalid' : '';
     return _react2['default'].createElement(
       'div',
       { className: prefixCls + '-input-wrap' },
@@ -113,11 +131,11 @@ var DateInput = function (_React$Component) {
         { className: prefixCls + '-date-input-wrap' },
         _react2['default'].createElement('input', {
           ref: this.saveDateInput,
-          className: prefixCls + '-input ' + invalidClass,
+          className: prefixCls + '-input',
           value: str,
           disabled: props.disabled,
           placeholder: placeholder,
-          onChange: this.onInputChange,
+          onChange: this.onInputChangeAll,
           onKeyDown: this.onKeyDown,
           onFocus: this.onFocus,
           onBlur: this.onBlur,
@@ -153,7 +171,8 @@ DateInput.propTypes = {
   onSelect: _propTypes2['default'].func,
   selectedValue: _propTypes2['default'].object,
   clearIcon: _propTypes2['default'].node,
-  inputMode: _propTypes2['default'].string
+  inputMode: _propTypes2['default'].string,
+  showHourAndMinute: _propTypes2['default'].bool
 };
 
 var _initialiseProps = function _initialiseProps() {
@@ -166,55 +185,52 @@ var _initialiseProps = function _initialiseProps() {
     _this2.props.onClear(null);
   };
 
-  this.onInputChange = function (event) {
-    var str = event.target.value;
+  this.onInputChange = function (str) {
+    var cananderStr = (0, _util.normalizeDateInput)(str, _this2.state.localeFormat, _this2.state.delimiter);
     var _props = _this2.props,
         disabledDate = _props.disabledDate,
-        format = _props.format,
         onChange = _props.onChange,
         selectedValue = _props.selectedValue;
 
+    var parts = (0, _util.formatDateLocal)(cananderStr, _this2.state.localeFormat);
     // 没有内容，合法并直接退出
-
     if (!str) {
       onChange(null);
-      _this2.setState({
-        invalid: false,
-        str: str
-      });
+      _this2.setState({ str: str });
       return;
     }
-
     // 不合法直接退出
-    var parsed = (0, _dayjs2['default'])(str, format, true);
-    if (!parsed.isValid()) {
-      _this2.setState({
-        invalid: true,
-        str: str
-      });
-      return;
-    }
-
+    var format = (0, _util.getDateFormatByStr)(cananderStr, _this2.state.localeFormat);
+    var parsed = (0, _dayjs2['default'])(cananderStr, format);
     var value = _this2.props.value.clone();
     value = value.year(parsed.year()).month(parsed.month()).date(parsed.date()).hour(parsed.hour()).minute(parsed.minute()).second(parsed.second());
 
+    if (_this2.state.localeFormat === _util.DATE_FORMATS.ISO || _this2.state.localeFormat === _util.DATE_FORMATS.ISOAndTime) {
+      if (parts[0] && parts[0].length === 4 && (parts[0].slice(0, 3) === '000' || parts[0].slice(0, 2) === '00')) {
+        value.year(parts[0]);
+      }
+    }
+    if (_this2.state.localeFormat === _util.DATE_FORMATS.European || _this2.state.localeFormat === _util.DATE_FORMATS.EuropeanAndTime || _this2.state.localeFormat === _util.DATE_FORMATS.US || _this2.state.localeFormat === _util.DATE_FORMATS.USAndTime || _this2.state.localeFormat === _util.DATE_FORMATS.Germany_Russia_etc || _this2.state.localeFormat === _util.DATE_FORMATS.Germany_Russia_etcAndTime) {
+      if (parts[2] && parts[2].length === 4 && (parts[2].slice(0, 3) === '000' || parts[2].slice(0, 2) === '00')) {
+        value.year(parts[2]);
+      }
+    }
     if (!value || disabledDate && disabledDate(value)) {
-      _this2.setState({
-        invalid: true,
-        str: str
-      });
+      _this2.setState({ str: str });
       return;
     }
 
     if (selectedValue !== value || selectedValue && value && !selectedValue.isSame(value)) {
-      _this2.setState({
-        invalid: false,
-        str: str
-      });
+      _this2.setState({ str: str });
       onChange(value);
     }
   };
 
+  this.onInputChangeAll = function (event) {
+    var str = event.target.value;
+    _this2.onInputChange(str);
+  };
+
   this.onFocus = function () {
     _this2.setState({ hasFocus: true });
   };

package/lib/date/DateTHead.js

@@ -50,8 +50,9 @@ var DateTHead = function (_React$Component) {
     var firstDay = DAY_NAME_TO_INDEX[firstDayName] ? DAY_NAME_TO_INDEX[firstDayName] : 0;
 
     var showWeekNumberEl = void 0;
-    for (var dateColIndex = 0; dateColIndex < DATE_ROW_COLUMN_COUNT.DATE_COL_COUNT; dateColIndex++) {
-      var index = (firstDay + dateColIndex) % DATE_ROW_COLUMN_COUNT.DATE_COL_COUNT;
+    var dateColumnCount = DATE_ROW_COLUMN_COUNT.DATE_COL_COUNT;
+    for (var dateColIndex = 0; dateColIndex < dateColumnCount; dateColIndex++) {
+      var index = (firstDay + dateColIndex) % dateColumnCount;
       veryShortWeekdays[dateColIndex] = allWeekdaysMin[index];
       weekDays[dateColIndex] = allWeekdaysShort[index];
     }