@momo-kits/date-picker 0.0.65-beta.21 → 0.0.65-beta.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/datePicker/DatePicker.js +13 -8
  2. package/datePicker/DatePickerInput.js +120 -117
  3. package/datePicker/ListPicker.js +174 -185
  4. package/datePicker/WheelPicker.js +305 -286
  5. package/datePicker/helper/DatePickerHelper.js +22 -58
  6. package/package.json +15 -15
package/datePicker/ListPicker.js CHANGED
@@ -1,208 +1,197 @@
1
- import React, {Component} from 'react';
2
- import {Dimensions, StyleSheet, View} from 'react-native';
1
+ import React, { Component } from 'react';
2
+ import { Dimensions, StyleSheet, View } from 'react-native';
3
3
  import {
4
- Button,
5
- IconSource,
6
- TouchableOpacity,
7
- Text,
8
- Colors,
9
- Image,
10
- DeviceUtils,
11
- SwitchLanguage,
12
- } from '@momo-kits/core-v2';
4
+ Button,
5
+ IconSource,
6
+ TouchableOpacity,
7
+ Text,
8
+ Colors,
9
+ Image,
10
+ DeviceUtils,
11
+ SwitchLanguage,
12
+ } from '@momo-kits/core';
13
13
  import WheelPicker from './WheelPicker';
14
14
 
15
- const {isIphoneX} = DeviceUtils;
15
+ const { isIphoneX } = DeviceUtils;
16
16
 
17
17
  const widthScreen = Dimensions.get('window').width;
18
18
 
19
19
  export default class ListPicker extends Component {
20
- constructor(props) {
21
- super(props);
22
- this.data = 0;
23
- }
24
-
25
- hide = () => {
26
- const {onClose, requestClose} = this.props;
27
- if (requestClose && typeof requestClose === 'function') {
28
- requestClose(() => {
29
- if (onClose && typeof onClose === 'function') {
30
- onClose();
31
- }
32
- });
33
- }
34
- };
35
-
36
- onBeginDrag = () => {
37
- if (this.refs.picker) {
38
- this.refs.picker.setScrollEnabled(false);
39
- }
40
- };
41
-
42
- onEndDrag = () => {
43
- if (this.refs.picker) {
44
- this.refs.picker.setScrollEnabled(true);
20
+ constructor(props) {
21
+ super(props);
22
+ this.data = 0;
45
23
  }
46
- };
47
24
 
48
- onChangeValue = value => {
49
- const {callback} = this.props;
50
- if (typeof callback === 'function') {
51
- callback(value);
52
- }
53
- };
25
+ hide = () => {
26
+ const { onClose, requestClose } = this.props;
27
+ if (requestClose && typeof requestClose === 'function') {
28
+ requestClose(() => {
29
+ if (onClose && typeof onClose === 'function') {
30
+ onClose();
31
+ }
32
+ });
33
+ }
34
+ };
54
35
 
55
- onPressClear = () => {
56
- this.hide();
57
- };
36
+ onBeginDrag = () => {
37
+ if (this.refs.picker) {
38
+ this.refs.picker.setScrollEnabled(false);
39
+ }
40
+ };
58
41
 
59
- onPressChoose = () => {
60
- this.onChangeValue(this.data);
61
- this.hide();
62
- };
42
+ onEndDrag = () => {
43
+ if (this.refs.picker) {
44
+ this.refs.picker.setScrollEnabled(true);
45
+ }
46
+ };
63
47
 
64
- renderRight = () => (
65
- <TouchableOpacity onPress={this.onPressChoose}>
66
- <Text.Paragraph
67
- style={{
68
- fontWeight: 'bold',
69
- color: Colors.pink_05,
70
- }}>
71
- {SwitchLanguage.save}
72
- </Text.Paragraph>
73
- </TouchableOpacity>
74
- );
48
+ onChangeValue = (value) => {
49
+ const { callback } = this.props;
50
+ if (typeof callback === 'function') {
51
+ callback(value);
52
+ }
53
+ };
75
54
 
76
- renderLeftIcon = () => (
77
- <TouchableOpacity onPress={() => this.hide()}>
78
- <Image
79
- source={IconSource.ic_close_x_24}
80
- style={{
81
- width: 25,
82
- height: 25,
83
- tintColor: Colors.black_17,
84
- }}
85
- />
86
- </TouchableOpacity>
87
- );
55
+ onPressClear = () => {
56
+ this.hide();
57
+ };
88
58
 
89
- renderHeader() {
90
- const {title = ''} = this.props;
91
- return (
92
- <View style={styles.header}>
93
- {this.renderLeftIcon()}
94
- <Text style={styles.title}>{title}</Text>
95
- {this.props.typeStyle === 'aboveAction' ? (
96
- this.renderRight()
97
- ) : (
98
- <View style={{width: 25}} />
99
- )}
100
- </View>
101
- );
102
- }
59
+ onPressChoose = () => {
60
+ this.onChangeValue(this.data);
61
+ this.hide();
62
+ };
103
63
 
104
- renderContent() {
105
- const {arrData = [], stylePicker, initValue} = this.props;
106
- return (
107
- <View style={styles.contentStyle}>
108
- <WheelPicker
109
- stylePicker={stylePicker}
110
- bottomOffset={1}
111
- value={initValue}
112
- key="picker"
113
- ref="picker"
114
- arrayValue={arrData}
115
- onBeginDrag={this.onBeginDrag}
116
- onEndDrag={this.onEndDrag}
117
- onValueChange={value => {
118
- this.data = value;
119
- }}
120
- />
121
- </View>
64
+ renderRight = () => (
65
+ <TouchableOpacity onPress={this.onPressChoose}>
66
+ <Text.Title style={{ fontWeight: 'bold', color: Colors.pink_05 }}>
67
+ {SwitchLanguage.save}
68
+ </Text.Title>
69
+ </TouchableOpacity>
122
70
  );
123
- }
124
71
 
125
- render() {
126
- return (
127
- <View style={styles.view}>
128
- {this.renderHeader()}
129
- {this.renderContent()}
130
- {this.props.typeStyle === 'aboveAction' ? null : (
131
- <View style={styles.btnView}>
132
- <Button
133
- style={{flex: 1}}
134
- title={SwitchLanguage.cancel}
135
- buttonStyle={{
136
- backgroundColor: Colors.second_text_color,
137
- }}
138
- onPress={this.onPressClear}
139
- />
140
- <Button
141
- style={{
142
- flex: 1,
143
- marginLeft: 15,
144
- }}
145
- title={SwitchLanguage.choose}
146
- type="primary"
147
- onPress={this.onPressChoose}
72
+ renderLeftIcon = () => (
73
+ <TouchableOpacity onPress={() => this.hide()}>
74
+ <Image
75
+ source={IconSource.ic_close_x_24}
76
+ style={{ width: 25, height: 25, tintColor: Colors.black_17 }}
148
77
  />
149
- </View>
150
- )}
151
- </View>
78
+ </TouchableOpacity>
152
79
  );
153
- }
80
+
81
+ renderHeader() {
82
+ const { title = '' } = this.props;
83
+ return (
84
+ <View style={styles.header}>
85
+ {this.renderLeftIcon()}
86
+ <Text style={styles.title}>{title}</Text>
87
+ {this.props.typeStyle === 'aboveAction' ? (
88
+ this.renderRight()
89
+ ) : (
90
+ <View style={{ width: 25 }} />
91
+ )}
92
+ </View>
93
+ );
94
+ }
95
+
96
+ renderContent() {
97
+ const { arrData = [], stylePicker, initValue } = this.props;
98
+ return (
99
+ <View style={styles.contentStyle}>
100
+ <WheelPicker
101
+ stylePicker={stylePicker}
102
+ bottomOffset={1}
103
+ value={initValue}
104
+ key="picker"
105
+ ref="picker"
106
+ arrayValue={arrData}
107
+ onBeginDrag={this.onBeginDrag}
108
+ onEndDrag={this.onEndDrag}
109
+ onValueChange={(value) => {
110
+ this.data = value;
111
+ }}
112
+ />
113
+ </View>
114
+ );
115
+ }
116
+
117
+ render() {
118
+ return (
119
+ <View style={styles.view}>
120
+ {this.renderHeader()}
121
+ {this.renderContent()}
122
+ {this.props.typeStyle === 'aboveAction' ? null : (
123
+ <View style={styles.btnView}>
124
+ <Button
125
+ style={{ flex: 1 }}
126
+ title={SwitchLanguage.cancel}
127
+ buttonStyle={{
128
+ backgroundColor: Colors.second_text_color,
129
+ }}
130
+ onPress={this.onPressClear}
131
+ />
132
+ <Button
133
+ style={{ flex: 1, marginLeft: 15 }}
134
+ title={SwitchLanguage.choose}
135
+ type="primary"
136
+ onPress={this.onPressChoose}
137
+ />
138
+ </View>
139
+ )}
140
+ </View>
141
+ );
142
+ }
154
143
  }
155
144
 
156
145
  const styles = StyleSheet.create({
157
- container: {
158
- flexDirection: 'row',
159
- width: widthScreen,
160
- alignItems: 'center',
161
- justifyContent: 'center',
162
- },
163
- contentStyle: {
164
- height: 230,
165
- },
166
- column: {
167
- borderWidth: 2,
168
- borderColor: 'red',
169
- },
170
- header: {
171
- flexDirection: 'row',
172
- height: 50,
173
- width: widthScreen,
174
- paddingHorizontal: 16,
175
- alignItems: 'center',
176
- justifyContent: 'space-between',
177
- backgroundColor: '#fff',
178
- borderBottomWidth: 1,
179
- borderColor: '#DADADA',
180
- },
181
- view: {
182
- backgroundColor: 'white',
183
- paddingBottom: 10 + (isIphoneX() ? 10 : 0),
184
- },
185
- title: {
186
- fontWeight: 'bold',
187
- color: Colors.black_17,
188
- flex: 1,
189
- fontSize: 16,
190
- textAlign: 'center',
191
- },
192
- titleCancel: {
193
- fontSize: 17,
194
- color: '#4A90E2',
195
- },
196
- titleConfirm: {
197
- fontSize: 17,
198
- color: '#4A90E2',
199
- textAlign: 'right',
200
- },
201
- btnView: {
202
- flexDirection: 'row',
203
- justifyContent: 'space-between',
204
- marginHorizontal: 15,
205
- height: 60,
206
- alignItems: 'center',
207
- },
146
+ container: {
147
+ flexDirection: 'row',
148
+ width: widthScreen,
149
+ alignItems: 'center',
150
+ justifyContent: 'center',
151
+ },
152
+ contentStyle: {
153
+ height: 230,
154
+ },
155
+ column: {
156
+ borderWidth: 2,
157
+ borderColor: 'red',
158
+ },
159
+ header: {
160
+ flexDirection: 'row',
161
+ height: 50,
162
+ width: widthScreen,
163
+ paddingHorizontal: 16,
164
+ alignItems: 'center',
165
+ justifyContent: 'space-between',
166
+ backgroundColor: '#fff',
167
+ borderBottomWidth: 1,
168
+ borderColor: '#DADADA',
169
+ },
170
+ view: {
171
+ backgroundColor: 'white',
172
+ paddingBottom: 10 + (isIphoneX() ? 10 : 0),
173
+ },
174
+ title: {
175
+ fontWeight: 'bold',
176
+ color: Colors.black_17,
177
+ flex: 1,
178
+ fontSize: 16,
179
+ textAlign: 'center',
180
+ },
181
+ titleCancel: {
182
+ fontSize: 17,
183
+ color: '#4A90E2',
184
+ },
185
+ titleConfirm: {
186
+ fontSize: 17,
187
+ color: '#4A90E2',
188
+ textAlign: 'right',
189
+ },
190
+ btnView: {
191
+ flexDirection: 'row',
192
+ justifyContent: 'space-between',
193
+ marginHorizontal: 15,
194
+ height: 60,
195
+ alignItems: 'center',
196
+ },
208
197
  });