]>
Commit | Line | Data |
---|---|---|
02de449a | 1 | import React, {PropTypes} from 'react'; |
4acbf95c M |
2 | import CommonMixin from '../mixin/CommonMixin'; |
3 | import Header from './Header'; | |
4 | import Combobox from './Combobox'; | |
02de449a | 5 | |
6 | function noop() { | |
7 | } | |
8 | ||
9 | function generateOptions(length) { | |
98275fd8 | 10 | const arr = []; |
11 | for(let i = 0; i < length; i++){ | |
12 | arr.push(i); | |
13 | } | |
14 | return arr; | |
02de449a | 15 | } |
16 | ||
4acbf95c | 17 | const Panel = React.createClass({ |
02de449a | 18 | propTypes: { |
19 | prefixCls: PropTypes.string, | |
9f9f39e4 | 20 | value: PropTypes.object, |
02de449a | 21 | locale: PropTypes.object, |
22 | placeholder: PropTypes.string, | |
8133e8cf | 23 | gregorianCalendarLocale: PropTypes.object, |
02de449a | 24 | formatter: PropTypes.object, |
25 | hourOptions: PropTypes.array, | |
26 | minuteOptions: PropTypes.array, | |
27 | secondOptions: PropTypes.array, | |
28 | onChange: PropTypes.func, | |
8133e8cf | 29 | onEsc: PropTypes.func, |
30 | allowEmpty: PropTypes.bool, | |
31 | showHour: PropTypes.bool, | |
32 | showSecond: PropTypes.bool, | |
02de449a | 33 | onClear: PropTypes.func, |
34 | }, | |
35 | ||
36 | mixins: [CommonMixin], | |
37 | ||
38 | getDefaultProps() { | |
39 | return { | |
40 | hourOptions: generateOptions(24), | |
41 | minuteOptions: generateOptions(60), | |
42 | secondOptions: generateOptions(60), | |
43 | onChange: noop, | |
44 | onClear: noop, | |
45 | }; | |
46 | }, | |
47 | ||
48 | getInitialState() { | |
49 | return { | |
8133e8cf | 50 | value: this.props.value, |
02de449a | 51 | }; |
52 | }, | |
53 | ||
9f9f39e4 | 54 | componentWillReceiveProps(nextProps) { |
55 | const value = nextProps.value; | |
56 | if (value) { | |
57 | this.setState({ | |
58 | value, | |
59 | }); | |
60 | } | |
61 | }, | |
62 | ||
02de449a | 63 | onChange(newValue) { |
64 | this.setState({ value: newValue }); | |
65 | this.props.onChange(newValue); | |
66 | }, | |
67 | ||
68 | onClear() { | |
69 | this.props.onClear(); | |
70 | }, | |
71 | ||
02de449a | 72 | render() { |
8133e8cf | 73 | const { locale, prefixCls, placeholder, hourOptions, minuteOptions, secondOptions, allowEmpty, showHour, showSecond, formatter, gregorianCalendarLocale } = this.props; |
9f9f39e4 | 74 | const value = this.state.value; |
02de449a | 75 | return ( |
8133e8cf | 76 | <div className={`${prefixCls}-inner`}> |
02de449a | 77 | <Header |
78 | prefixCls={prefixCls} | |
8133e8cf | 79 | gregorianCalendarLocale={gregorianCalendarLocale} |
02de449a | 80 | locale={locale} |
81 | value={value} | |
8133e8cf | 82 | onEsc={this.props.onEsc} |
83 | formatter={formatter} | |
63541ed7 | 84 | placeholder={placeholder} |
02de449a | 85 | hourOptions={hourOptions} |
86 | minuteOptions={minuteOptions} | |
87 | secondOptions={secondOptions} | |
88 | onChange={this.onChange} | |
89 | onClear={this.onClear} | |
8133e8cf | 90 | allowEmpty={allowEmpty} |
02de449a | 91 | /> |
92 | <Combobox | |
93 | prefixCls={prefixCls} | |
94 | value={value} | |
8133e8cf | 95 | gregorianCalendarLocale={gregorianCalendarLocale} |
96 | formatter={formatter} | |
02de449a | 97 | onChange={this.onChange} |
8133e8cf | 98 | showHour={showHour} |
99 | showSecond={showSecond} | |
02de449a | 100 | hourOptions={hourOptions} |
101 | minuteOptions={minuteOptions} | |
102 | secondOptions={secondOptions} | |
103 | /> | |
104 | </div> | |
105 | ); | |
106 | }, | |
107 | }); | |
108 | ||
4acbf95c | 109 | export default Panel; |