Merge pull request #235 from liyang1234567890/30dayslater

日期控件新增任意天数/周数/月数/季度数之前或之后显示时间

src/components/DatePicker.tsx

@@ -672,6 +672,97 @@ const availableShortcuts: {[propName: string]: any} = {
     }
 };
 
+const selfDefinedShortcuts = [
+    {
+        regexp: /^([1-9]\d*)daysago$/,
+        resolve: (_: string, days: string) => {
+            return {
+                label: `${days}天前`,
+                date: (now: moment.Moment) => {
+                    return now.subtract(days, 'days');
+                }
+            };
+        }
+    },
+    {
+        regexp: /^([1-9]\d*)dayslater$/,
+        resolve: (_: string, days: string) => {
+            return {
+                label: `${days}天后`,
+                date: (now: moment.Moment) => {
+                    return now.add(days, 'days');
+                }
+            };
+        }
+    },
+    {
+        regexp: /^([1-9]\d?)weeksago$/,
+        resolve: (_: string, weeks: string) => {
+            return {
+                label: `${weeks}周前`,
+                date: (now: moment.Moment) => {
+                    return now.subtract(weeks, 'weeks');
+                }
+            };
+        }
+    },
+    {
+        regexp: /^([1-9]\d?)weekslater$/,
+        resolve: (_: string, weeks: string) => {
+            return {
+                label: `${weeks}周后`,
+                date: (now: moment.Moment) => {
+                    return now.add(weeks, 'weeks');
+                }
+            };
+        }
+    },
+    {
+        regexp: /^([1-9])monthsago$/,
+        resolve: (_: string, months: string) => {
+            return {
+                label: `${months}月前`,
+                date: (now: moment.Moment) => {
+                    return now.subtract(months, 'months');
+                }
+            };
+        }
+    },
+    {
+        regexp: /^([1-9])monthslater$/,
+        resolve: (_: string, months: string) => {
+            return {
+                label: `${months}月后`,
+                date: (now: moment.Moment) => {
+                    return now.add(months, 'months');
+                }
+            };
+        }
+    },
+    {
+        regexp: /^([1-9])quartersago$/,
+        resolve: (_: string, quarters: string) => {
+            return {
+                label: `${quarters}季度前`,
+                date: (now: moment.Moment) => {
+                    return now.subtract(quarters, 'quarters');
+                }
+            };
+        }
+    },
+    {
+        regexp: /^([1-9])quarterslater$/,
+        resolve: (_: string, quarters: string) => {
+            return {
+                label: `${quarters}季度后`,
+                date: (now: moment.Moment) => {
+                    return now.add(quarters, 'quarters');
+                }
+            };
+        }
+    }
+];
+
 export interface DateProps {
     viewMode: 'years' | 'months' | 'days' | 'time';
     className?: string;
@@ -853,6 +944,14 @@ export class DatePicker extends React.Component<DateProps, DatePickerState> {
         this.dom = ref;
     };
 
+    getAvailableShortcuts(key:string) {
+        if (availableShortcuts[key]) {
+            return availableShortcuts[key];
+        }
+        let shortcutResolver = selfDefinedShortcuts.filter((item: object) => item.regexp.test(key))[0];
+        return shortcutResolver ? shortcutResolver.resolve(...key.match(shortcutResolver.regexp)) : null;
+    }
+
     render() {
         const {
             classPrefix: ns,
@@ -929,16 +1028,21 @@ export class DatePicker extends React.Component<DateProps, DatePickerState> {
                                         ? shortcuts
                                         : []
                                     )
-                                        .filter(key => !!availableShortcuts[key])
+                                    .filter(key => {
-                                        .map(key => (
+                                        return !!this.getAvailableShortcuts(key);
+                                    })
+                                    .map(key => {
+                                        const shortcut = this.getAvailableShortcuts(key);
+                                        return (
                                             <li
                                                 className={`${ns}DatePicker-shortcut`}
-                                                onClick={() => this.selectRannge(availableShortcuts[key])}
+                                                onClick={() => this.selectRannge(shortcut)}
                                                 key={key}
                                             >
-                                                <a>{availableShortcuts[key].label}</a>
+                                                <a>{shortcut.label}</a>
                                             </li>
-                                        ))}
+                                        );
+                                    })}
                                 </ul>
                             ) : null}