diff options
author | MG12 <wuzhao.mail@gmail.com> | 2015-11-17 22:16:15 +0800 |
---|---|---|
committer | MG12 <wuzhao.mail@gmail.com> | 2015-11-17 22:16:15 +0800 |
commit | 4acbf95c7d2693d73b0c8c021ad892b6529d4c06 (patch) | |
tree | 1e1780ba90895d8f5901472a7c67a77186741a4f /src/TimePanel.jsx | |
parent | 78637ac02ce6a469d2021736d3cb12e98c5edbe7 (diff) | |
download | time-picker-4acbf95c7d2693d73b0c8c021ad892b6529d4c06.tar.gz time-picker-4acbf95c7d2693d73b0c8c021ad892b6529d4c06.tar.zst time-picker-4acbf95c7d2693d73b0c8c021ad892b6529d4c06.zip |
Diffstat (limited to 'src/TimePanel.jsx')
-rw-r--r-- | src/TimePanel.jsx | 121 |
1 files changed, 0 insertions, 121 deletions
diff --git a/src/TimePanel.jsx b/src/TimePanel.jsx deleted file mode 100644 index 110ca1e..0000000 --- a/src/TimePanel.jsx +++ /dev/null | |||
@@ -1,121 +0,0 @@ | |||
1 | import React, {PropTypes} from 'react'; | ||
2 | import classnames from 'classnames'; | ||
3 | import CommonMixin from './mixin/CommonMixin'; | ||
4 | import Header from './module/Header'; | ||
5 | import Combobox from './module/Combobox'; | ||
6 | |||
7 | function noop() { | ||
8 | } | ||
9 | |||
10 | function generateOptions(length) { | ||
11 | return Array.apply(null, {length: length}).map((item, index) => { | ||
12 | return index; | ||
13 | }); | ||
14 | } | ||
15 | |||
16 | const TimePanel = React.createClass({ | ||
17 | propTypes: { | ||
18 | prefixCls: PropTypes.string, | ||
19 | defaultValue: PropTypes.object, | ||
20 | locale: PropTypes.object, | ||
21 | placeholder: PropTypes.string, | ||
22 | formatter: PropTypes.object, | ||
23 | hourOptions: PropTypes.array, | ||
24 | minuteOptions: PropTypes.array, | ||
25 | secondOptions: PropTypes.array, | ||
26 | onChange: PropTypes.func, | ||
27 | onClear: PropTypes.func, | ||
28 | }, | ||
29 | |||
30 | mixins: [CommonMixin], | ||
31 | |||
32 | getDefaultProps() { | ||
33 | return { | ||
34 | hourOptions: generateOptions(24), | ||
35 | minuteOptions: generateOptions(60), | ||
36 | secondOptions: generateOptions(60), | ||
37 | onChange: noop, | ||
38 | onClear: noop, | ||
39 | }; | ||
40 | }, | ||
41 | |||
42 | getInitialState() { | ||
43 | return { | ||
44 | value: this.props.defaultValue, | ||
45 | }; | ||
46 | }, | ||
47 | |||
48 | componentWillMount() { | ||
49 | const formatter = this.props.formatter; | ||
50 | const pattern = formatter.originalPattern; | ||
51 | if (pattern === 'HH:mm') { | ||
52 | this.showSecond = false; | ||
53 | } else if (pattern === 'mm:ss') { | ||
54 | this.showHour = false; | ||
55 | } | ||
56 | }, | ||
57 | |||
58 | onChange(newValue) { | ||
59 | this.setState({ value: newValue }); | ||
60 | this.props.onChange(newValue); | ||
61 | }, | ||
62 | |||
63 | onClear() { | ||
64 | this.props.onClear(); | ||
65 | }, | ||
66 | |||
67 | getPlaceholder(placeholder) { | ||
68 | if (placeholder) { | ||
69 | return placeholder; | ||
70 | } | ||
71 | |||
72 | const { locale } = this.props; | ||
73 | if (!this.showHour) { | ||
74 | return locale.placeholdermmss; | ||
75 | } else if (!this.showSecond) { | ||
76 | return locale.placeholderHHmm; | ||
77 | } | ||
78 | return locale.placeholderHHmmss; | ||
79 | }, | ||
80 | |||
81 | showHour: true, | ||
82 | showSecond: true, | ||
83 | |||
84 | render() { | ||
85 | const { locale, prefixCls, defaultValue, placeholder, hourOptions, minuteOptions, secondOptions } = this.props; | ||
86 | const value = this.state.value || defaultValue; | ||
87 | const cls = classnames({ 'narrow': !this.showHour || !this.showSecond }); | ||
88 | |||
89 | return ( | ||
90 | <div className={`${prefixCls}-panel ${cls}`}> | ||
91 | <Header | ||
92 | prefixCls={prefixCls} | ||
93 | gregorianTimePickerLocale={defaultValue.locale} | ||
94 | locale={locale} | ||
95 | value={value} | ||
96 | formatter={this.getFormatter()} | ||
97 | placeholder={this.getPlaceholder(placeholder)} | ||
98 | hourOptions={hourOptions} | ||
99 | minuteOptions={minuteOptions} | ||
100 | secondOptions={secondOptions} | ||
101 | onChange={this.onChange} | ||
102 | onClear={this.onClear} | ||
103 | showClear | ||
104 | /> | ||
105 | <Combobox | ||
106 | prefixCls={prefixCls} | ||
107 | value={value} | ||
108 | formatter={this.getFormatter()} | ||
109 | onChange={this.onChange} | ||
110 | showHour={this.showHour} | ||
111 | showSecond={this.showSecond} | ||
112 | hourOptions={hourOptions} | ||
113 | minuteOptions={minuteOptions} | ||
114 | secondOptions={secondOptions} | ||
115 | /> | ||
116 | </div> | ||
117 | ); | ||
118 | }, | ||
119 | }); | ||
120 | |||
121 | export default TimePanel; | ||