|
|
@@ -0,0 +1,72 @@
|
|
|
+import React, { Component} from 'react';
|
|
|
+import { Text, ListView } from 'react-native';
|
|
|
+import { connect } from 'react-redux';
|
|
|
+import { Card, CardSection, Input, Button, Spinner } from './common';
|
|
|
+import { propChanged } from '../actions/';
|
|
|
+import { Actions } from 'react-native-router-flux';
|
|
|
+
|
|
|
+class RegisterForm extends Component {
|
|
|
+
|
|
|
+ onRegisterPress() {
|
|
|
+ // Actions.register();
|
|
|
+ }
|
|
|
+
|
|
|
+ renderButton() {
|
|
|
+ if (this.props.loading) {
|
|
|
+ return <Spinner size="large" />;
|
|
|
+ }
|
|
|
+ return (
|
|
|
+ <Button onPress={this.onRegisterPress.bind(this)}>
|
|
|
+ Registrar
|
|
|
+ </Button>
|
|
|
+ );
|
|
|
+ }
|
|
|
+
|
|
|
+ renderItem(item) {
|
|
|
+ console.log("renderitem", item);
|
|
|
+ console.log("this", this);
|
|
|
+ return (
|
|
|
+ <CardSection>
|
|
|
+ <Input
|
|
|
+ label={item.key}
|
|
|
+ placeholder={item.placeholder}
|
|
|
+ value={this.props[item.key]}
|
|
|
+ onChangeText={ () => this.props.propChanged({ key: item.key, val: this.props[item.key] }) }
|
|
|
+ />
|
|
|
+ </CardSection>
|
|
|
+ );
|
|
|
+ }
|
|
|
+ render() {
|
|
|
+ return (
|
|
|
+ <Card>
|
|
|
+ { this.renderItem( {key:"email"}) }
|
|
|
+ { this.renderItem( {key:"nombre"}) }
|
|
|
+ { this.renderItem( {key:"apellido"}) }
|
|
|
+
|
|
|
+ <Text style={styles.errorTextStyle}>
|
|
|
+ {this.props.error}
|
|
|
+ </Text>
|
|
|
+ <CardSection>
|
|
|
+ {this.renderButton()}
|
|
|
+ </CardSection>
|
|
|
+ </Card>
|
|
|
+
|
|
|
+ );
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+const styles = {
|
|
|
+ errorTextStyle: {
|
|
|
+ fontSize: 20,
|
|
|
+ alignSelf: 'center',
|
|
|
+ color: 'red'
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+const mapStateToProps = ({ register }) => {
|
|
|
+ const { email, nombre, password, error, loading } = register;
|
|
|
+ return { email, nombre, password, error, loading };
|
|
|
+};
|
|
|
+
|
|
|
+
|
|
|
+export default connect(mapStateToProps, { propChanged } )(RegisterForm);
|