From 34ff8c6f2104a0190750101578b64f4a90c9dcd7 Mon Sep 17 00:00:00 2001
From: rainie <chenyutian0510@gmail.com>
Date: Tue, 10 Apr 2018 11:18:39 +0800
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20=20[feature]=20Add=20characteristic?=
 =?UTF-8?q?s=20of=20set=20a=20time=20step?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 examples/basic/index.js                | 1 +
 lib/DatePicker.js                      | 6 ++++--
 lib/DatePickerItem.js                  | 7 ++++---
 lib/index.js                           | 1 +
 test/functional/DatePickerItem_spec.js | 1 +
 test/functional/DatePicker_spec.js     | 2 ++
 6 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/examples/basic/index.js b/examples/basic/index.js
index 02816b6..e6f8ed6 100644
--- a/examples/basic/index.js
+++ b/examples/basic/index.js
@@ -60,6 +60,7 @@ import DatePicker from '../../lib/index';
                     <DatePicker
                         value={this.state.time}
                         min={new Date(2017, 2, 2)}
+                        dateSteps={[1, 1, 5]}
                         theme={this.state.theme}
                         isOpen={this.state.isOpen}
                         onSelect={this.handleSelect}
diff --git a/lib/DatePicker.js b/lib/DatePicker.js
index e308105..6e8ee28 100644
--- a/lib/DatePicker.js
+++ b/lib/DatePicker.js
@@ -15,6 +15,7 @@ type Props = {
     customHeader?: React.Element<*>,
     showHeader: boolean,
     dateFormat: Array<*>,
+    dateSteps: Array<*>,
     showFormat: string,
     confirmText: string,
     cancelText: string,
@@ -84,12 +85,12 @@ class DatePicker extends Component<void, Props, State> {
      * @return {Object} JSX对象
      */
     render() {
-        const { min, max, theme, dateFormat, confirmText, cancelText, showFormat, showHeader, customHeader } = this.props;
+        const { min, max, theme, dateFormat, confirmText, cancelText, showFormat, showHeader, customHeader, dateSteps } = this.props;
         const value = this.state.value;
         const themeClassName =
             ['default', 'dark', 'ios', 'android', 'android-dark'].indexOf(theme) === -1 ?
             'default' : theme;
-
+     
         return (
             <div
                 className={`datepicker ${themeClassName}`}>
@@ -99,6 +100,7 @@ class DatePicker extends Component<void, Props, State> {
                     {dateFormat.map((format, index) => (
                         <DatePickerItem
                             key={index}
+                            step={dateSteps[index] || 1}
                             value={value}
                             min={min}
                             max={max}
diff --git a/lib/DatePickerItem.js b/lib/DatePickerItem.js
index 661805d..61f830b 100644
--- a/lib/DatePickerItem.js
+++ b/lib/DatePickerItem.js
@@ -45,6 +45,7 @@ type Props = {
     min: Object,
     max: Object,
     format: string,
+    step: number,
     onSelect: Function,
 }
 
@@ -128,7 +129,7 @@ class DatePickerItem extends Component<void, Props, State> {
         const typeName = this.typeName;
         const dates = Array(...Array(DATE_LENGTH))
             .map((value, index) =>
-                TimeUtil[`next${typeName}`](date, index - MIDDLE_INDEX));
+                TimeUtil[`next${typeName}`](date, (index - MIDDLE_INDEX) * this.props.step));
         this.setState({ dates });
     }
 
@@ -140,7 +141,7 @@ class DatePickerItem extends Component<void, Props, State> {
             this.setState({
                 dates: [
                     ...dates.slice(1),
-                    TimeUtil[`next${typeName}`](dates[dates.length - 1], 1),
+                    TimeUtil[`next${typeName}`](dates[dates.length - 1], this.props.step),
                 ],
                 marginTop: (this.currentIndex - MIDDLE_INDEX) * DATE_HEIGHT,
             });
@@ -148,7 +149,7 @@ class DatePickerItem extends Component<void, Props, State> {
             this.currentIndex --;
             this.setState({
                 dates: [
-                    TimeUtil[`next${typeName}`](dates[0], -1),
+                    TimeUtil[`next${typeName}`](dates[0], -this.props.step),
                     ...dates.slice(0, dates.length - 1),
                 ],
                 marginTop: (this.currentIndex - MIDDLE_INDEX) * DATE_HEIGHT,
diff --git a/lib/index.js b/lib/index.js
index c1d3018..bc09e47 100644
--- a/lib/index.js
+++ b/lib/index.js
@@ -49,6 +49,7 @@ ModalDatePicker.defaultProps = {
     max: new Date(2050, 0, 1),
     showHeader: true,
     dateFormat: ['YYYY', 'M', 'D'],
+    dateSteps: [1, 1, 1],
     showFormat: 'YYYY/MM/DD',
     confirmText: '完成',
     cancelText: '取消',
diff --git a/test/functional/DatePickerItem_spec.js b/test/functional/DatePickerItem_spec.js
index 423ed83..1a9779b 100644
--- a/test/functional/DatePickerItem_spec.js
+++ b/test/functional/DatePickerItem_spec.js
@@ -14,6 +14,7 @@ const DEFAULT_PROPS = {
     value: new Date(2010, 3, 7),
     min: new Date(2010, 2, 6),
     max: new Date(2010, 4, 8),
+    step: 1,
     onSelect: () => {},
 }
 
diff --git a/test/functional/DatePicker_spec.js b/test/functional/DatePicker_spec.js
index d040f13..f2003be 100644
--- a/test/functional/DatePicker_spec.js
+++ b/test/functional/DatePicker_spec.js
@@ -16,6 +16,7 @@ const DEFAULT_PROPS = {
     min: new Date(2015, 10, 1),
     max: new Date(2020, 10, 1),
     dateFormat: ['YYYY', 'M', 'D'],
+    dateSteps: [1, 1, 1],
     isOpen: true,
 }
 
@@ -286,6 +287,7 @@ describe('渲染正确的DatepicketItem子组件', () => {
     beforeEach(() => {
         props = {
             value: new Date(2016, 8, 16),
+            dateSteps: [1, 1, 1]
         };
         mountedDatepicker = undefined;
     });