From 15d0601bbcd73d9b3cc0bba57b51bb563a916cac Mon Sep 17 00:00:00 2001 From: liyang105 Date: Tue, 10 Sep 2019 23:03:26 +0800 Subject: [PATCH 1/3] liyang105 add selfdefined shortcuts --- src/components/DatePicker.tsx | 48 +++++++++++++++++++++++++++++++---- 1 file changed, 43 insertions(+), 5 deletions(-) diff --git a/src/components/DatePicker.tsx b/src/components/DatePicker.tsx index 9d12df209..f4a9a31f9 100644 --- a/src/components/DatePicker.tsx +++ b/src/components/DatePicker.tsx @@ -677,6 +677,31 @@ const availableShortcuts: {[propName: string]: any} = { } }; +const selfDefinedShortcuts = [ + { + regexp: /^(\d+)dayslater$/, + func: function(_,days) { + return { + label: `${days}天后`, + date: (now: moment.Moment) => { + return now.add(days, 'days'); + } + }; + } + }, + { + regexp: /^(\d+)weekslater$/, + func: function(_,weeks) { + return { + label: `${weeks}周后`, + date: (now: moment.Moment) => { + return now.add(weeks * 7, 'days'); + } + }; + } + } +] + export interface DateProps { viewMode: 'years' | 'months' | 'days' | 'time'; className?: string; @@ -854,6 +879,14 @@ export class DatePicker extends React.Component { this.dom = ref; }; + getAvailableShortcuts(key:string) { + if (availableShortcuts[key]) { + return availableShortcuts[key]; + } + let ele = selfDefinedShortcuts.filter(item => item.regexp.test(key)).shift(); + return ele ? ele.func(...key.match(ele.regexp)) : ""; + } + render() { const { classPrefix: ns, @@ -930,16 +963,21 @@ export class DatePicker extends React.Component { ? shortcuts : [] ) - .filter(key => !!availableShortcuts[key]) - .map(key => ( + .filter(key => { + return !!this.getAvailableShortcuts(key); + }) + .map(key => { + const shortCut = this.getAvailableShortcuts(key); + return (
  • this.selectRannge(availableShortcuts[key])} + onClick={() => this.selectRannge(shortCut)} key={key} > - {availableShortcuts[key].label} + {shortCut.label}
    • - ))} + ); + })} ) : null} From c4ee9e52b34358203782f67de1a9b6bfb98a48cc Mon Sep 17 00:00:00 2001 From: liyang105 Date: Wed, 11 Sep 2019 17:45:14 +0800 Subject: [PATCH 2/3] =?UTF-8?q?=E6=97=A5=E6=9C=9F=E6=8E=A7=E4=BB=B6?= =?UTF-8?q?=E6=96=B0=E5=A2=9E=E4=BB=BB=E6=84=8F=E5=A4=A9=E6=95=B0/?= =?UTF-8?q?=E5=91=A8=E6=95=B0/=E6=9C=88=E6=95=B0/=E5=AD=A3=E5=BA=A6?= =?UTF-8?q?=E6=95=B0=E4=B9=8B=E5=89=8D=E6=88=96=E4=B9=8B=E5=90=8E=E6=98=BE?= =?UTF-8?q?=E7=A4=BA=E6=97=B6=E9=97=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/DatePicker.tsx | 88 ++++++++++++++++++++++++++++++----- 1 file changed, 77 insertions(+), 11 deletions(-) diff --git a/src/components/DatePicker.tsx b/src/components/DatePicker.tsx index f4a9a31f9..b7de3c076 100644 --- a/src/components/DatePicker.tsx +++ b/src/components/DatePicker.tsx @@ -679,8 +679,19 @@ const availableShortcuts: {[propName: string]: any} = { const selfDefinedShortcuts = [ { - regexp: /^(\d+)dayslater$/, - func: function(_,days) { + 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) => { @@ -690,17 +701,72 @@ const selfDefinedShortcuts = [ } }, { - regexp: /^(\d+)weekslater$/, - func: function(_,weeks) { + 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 * 7, 'days'); + 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'; @@ -883,8 +949,8 @@ export class DatePicker extends React.Component { if (availableShortcuts[key]) { return availableShortcuts[key]; } - let ele = selfDefinedShortcuts.filter(item => item.regexp.test(key)).shift(); - return ele ? ele.func(...key.match(ele.regexp)) : ""; + let shortcutResolver = selfDefinedShortcuts.filter((item: object) => item.regexp.test(key))[0]; + return shortcutResolver ? shortcutResolver.resolve(...key.match(shortcutResolver.regexp)) : {}; } render() { @@ -967,14 +1033,14 @@ export class DatePicker extends React.Component { return !!this.getAvailableShortcuts(key); }) .map(key => { - const shortCut = this.getAvailableShortcuts(key); + const shortcut = this.getAvailableShortcuts(key); return (
  • this.selectRannge(shortCut)} + onClick={() => this.selectRannge(shortcut)} key={key} > - {shortCut.label} + {shortcut.label}
    • ); })} From 657f7636bc659d02d8cd55b4891e767e4fec3789 Mon Sep 17 00:00:00 2001 From: liyang105 Date: Wed, 11 Sep 2019 17:50:19 +0800 Subject: [PATCH 3/3] =?UTF-8?q?=E6=97=A5=E6=9C=9F=E6=8E=A7=E4=BB=B6?= =?UTF-8?q?=E6=96=B0=E5=A2=9E=E4=BB=BB=E6=84=8F=E5=A4=A9=E6=95=B0/?= =?UTF-8?q?=E5=91=A8=E6=95=B0/=E6=9C=88=E6=95=B0/=E5=AD=A3=E5=BA=A6?= =?UTF-8?q?=E6=95=B0=E4=B9=8B=E5=89=8D=E6=88=96=E4=B9=8B=E5=90=8E=E6=98=BE?= =?UTF-8?q?=E7=A4=BA=E6=97=B6=E9=97=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/DatePicker.tsx | 114 ++++++++++++++++++++++++++++++++-- 1 file changed, 109 insertions(+), 5 deletions(-) diff --git a/src/components/DatePicker.tsx b/src/components/DatePicker.tsx index 9d12df209..2dd3082f3 100644 --- a/src/components/DatePicker.tsx +++ b/src/components/DatePicker.tsx @@ -677,6 +677,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; @@ -854,6 +945,14 @@ export class DatePicker extends React.Component { 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, @@ -930,16 +1029,21 @@ export class DatePicker extends React.Component { ? shortcuts : [] ) - .filter(key => !!availableShortcuts[key]) - .map(key => ( + .filter(key => { + return !!this.getAvailableShortcuts(key); + }) + .map(key => { + const shortcut = this.getAvailableShortcuts(key); + return (
  • this.selectRannge(availableShortcuts[key])} + onClick={() => this.selectRannge(shortcut)} key={key} > - {availableShortcuts[key].label} + {shortcut.label}
    • - ))} + ); + })} ) : null}