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

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 +8 -13
  2. package/datePicker/DatePickerInput.js +117 -120
  3. package/datePicker/ListPicker.js +185 -174
  4. package/datePicker/WheelPicker.js +286 -305
  5. package/datePicker/helper/DatePickerHelper.js +58 -22
  6. package/package.json +15 -15
package/datePicker/ListPicker.js CHANGED
@@ -1,197 +1,208 @@
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';
4
+ Button,
5
+ IconSource,
6
+ TouchableOpacity,
7
+ Text,
8
+ Colors,
9
+ Image,
10
+ DeviceUtils,
11
+ SwitchLanguage,
12
+ } from '@momo-kits/core-v2';
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
- }
20
+ constructor(props) {
21
+ super(props);
22
+ this.data = 0;
23
+ }
24
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
- });
25
+ hide = () => {
26
+ const {onClose, requestClose} = this.props;
27
+ if (requestClose && typeof requestClose === 'function') {
28
+ requestClose(() => {
29
+ if (onClose && typeof onClose === 'function') {
30
+ onClose();
33
31
  }
34
- };
32
+ });
33
+ }
34
+ };
35
35
 
36
- onBeginDrag = () => {
37
- if (this.refs.picker) {
38
- this.refs.picker.setScrollEnabled(false);
39
- }
40
- };
36
+ onBeginDrag = () => {
37
+ if (this.refs.picker) {
38
+ this.refs.picker.setScrollEnabled(false);
39
+ }
40
+ };
41
41
 
42
- onEndDrag = () => {
43
- if (this.refs.picker) {
44
- this.refs.picker.setScrollEnabled(true);
45
- }
46
- };
42
+ onEndDrag = () => {
43
+ if (this.refs.picker) {
44
+ this.refs.picker.setScrollEnabled(true);
45
+ }
46
+ };
47
47
 
48
- onChangeValue = (value) => {
49
- const { callback } = this.props;
50
- if (typeof callback === 'function') {
51
- callback(value);
52
- }
53
- };
48
+ onChangeValue = value => {
49
+ const {callback} = this.props;
50
+ if (typeof callback === 'function') {
51
+ callback(value);
52
+ }
53
+ };
54
54
 
55
- onPressClear = () => {
56
- this.hide();
57
- };
55
+ onPressClear = () => {
56
+ this.hide();
57
+ };
58
58
 
59
- onPressChoose = () => {
60
- this.onChangeValue(this.data);
61
- this.hide();
62
- };
59
+ onPressChoose = () => {
60
+ this.onChangeValue(this.data);
61
+ this.hide();
62
+ };
63
63
 
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>
70
- );
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
+ );
71
75
 
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 }}
77
- />
78
- </TouchableOpacity>
79
- );
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
+ );
80
88
 
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
- }
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
+ }
95
103
 
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
- }
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>
122
+ );
123
+ }
116
124
 
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
- }
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}
148
+ />
149
+ </View>
150
+ )}
151
+ </View>
152
+ );
153
+ }
143
154
  }
144
155
 
145
156
  const styles = StyleSheet.create({
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
- },
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
+ },
197
208
  });