RequestStats.js
4.22 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
'use strict';
import React, {Component} from 'react';
import FixedHeaderList from './FixedHeaderList';
import {
StyleSheet,
View,
DatePickerIOS,
Dimensions,
TouchableHighlight,
Text,
} from 'react-native';
import {getLastDay} from '../utils/dateTool';
export default class RequestStats extends Component {
constructor(props) {
super (props);
this._onDateChanged = this._onDateChanged.bind(this);
this._generateDatePicker = this._generateDatePicker.bind(this);
this._cancel = this._cancel.bind(this);
this._confirm = this._confirm.bind(this);
this.selectedDate = '';
}
render() {
let showDatePickerIOS = this._generateDatePicker();
return (
<View style={styles.container}>
<FixedHeaderList section={this.props.section}
currentStartDate={this.props.currentStartDate}
currentEndDate={this.props.currentEndDate}
maxDate={this.props.maxDate}
newDatePicked={this.props.newDatePicked}
showDatePickerIOS={this.props.showDatePickerIOS}
isFetching={this.props.isFetching}
reachEnd={this.props.reachEnd}
hideLoadingFooter={this.props.hideLoadingFooter}
requestData={this.props.requestData} />
{showDatePickerIOS}
</View>
);
}
_onDateChanged(date) {
this.selectedDate = date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate();
this.props.selectedDateIOS(this.selectedDate, this.props.isStartDate);
}
_generateDatePicker() {
// if (Platform.OS === 'android') {
// return (<View />);
// }
if (this.props.isShowDatePickerIOS) {
let currentDate = this.props.isStartDate ? this.props.currentStartDate : this.props.currentEndDate;
let currentDateArr = currentDate.split('-');
this.selectedDate = currentDate;
let minDate = this.props.isStartDate ? '2000-1-1' : this.props.currentStartDate;
let minDateArr = minDate.split('-');
let maxDate = this.props.isStartDate ? this.props.currentEndDate : getLastDay();
let maxDateArr = maxDate.split('-');
return (
<View style={styles.dateContainer}>
<View style={styles.btnContainer}>
<TouchableHighlight underlayColor={'white'} onPress={this._cancel}>
<Text style={styles.btnText}>取消</Text>
</TouchableHighlight>
<TouchableHighlight underlayColor={'white'} onPress={this._confirm}>
<Text style={styles.btnText}>确定</Text>
</TouchableHighlight>
</View>
<DatePickerIOS
mode='date'
date={new Date(currentDateArr[0], (currentDateArr[1] - 1), currentDateArr[2])}
minimumDate={new Date(minDateArr[0], (minDateArr[1] - 1), minDateArr[2])}
maximumDate={new Date(maxDateArr[0], (maxDateArr[1] - 1), maxDateArr[2])}
onDateChange={this._onDateChanged} />
</View>
);
} else {
return (<View />);
}
}
_cancel() {
this.props.showDatePickerIOS(false, this.props.isStartDate);
}
_confirm() {
this.props.newDatePicked(this.selectedDate, this.props.isStartDate);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
},
btnContainer: {
flexDirection: 'row',
backgroundColor: '#F0F0F0',
justifyContent: 'space-between',
alignItems: 'center',
width: Dimensions.get('window').width,
paddingTop: 10,
paddingBottom: 10,
paddingLeft: 15,
paddingRight: 15,
},
dateContainer: {
justifyContent: 'center',
alignItems: 'center',
backgroundColor: 'white',
borderTopColor: '#CCCCCC',
borderTopWidth: 1,
},
btnText: {
fontSize: 14,
color: '#444444',
textAlign: 'center',
},
});