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