This commit is contained in:
henrydays 2019-03-11 18:29:39 +00:00
commit 1d71783892
4 changed files with 173 additions and 104 deletions

View File

@ -104,7 +104,10 @@ const AppStack = createBottomTabNavigator(
}, },
{ {
initialRouteName: 'Home', //initialRouteName: 'Home',
initialRouteName: 'Eventos',
//initialRouteName: 'Calendário',
tabBarOptions: { tabBarOptions: {
showLabel: true, // hide labels showLabel: true, // hide labels

View File

@ -1,47 +1,96 @@
import * as React from "react"; import * as React from "react";
import { View, StyleSheet, Dimensions, Text, Button } from "react-native"; import {View, StyleSheet, Dimensions, Text, Button, ScrollView} from "react-native";
import { TabView, TabBar, SceneMap } from "react-native-tab-view"; import {TabView, TabBar, SceneMap} from "react-native-tab-view";
const SCREEN_HEIGHT = Dimensions.get("window").height;
const SCREEN_WIDTH = Dimensions.get("window").width;
const FirstRoute = () => ( const FirstRoute = () => (
<View style={[styles.scene, { backgroundColor: "#ff4081" }]} /> <View style={[styles.scene, {backgroundColor: "#ff4081"}]}/>
); );
const SecondRoute = () => ( const SecondRoute = () => (
<View style={[styles.scene, { backgroundColor: "#673ab7" }]} /> <View style={[styles.scene, {backgroundColor: "#673ab7"}]}/>
); );
const ThirdRoute = () => ( const ThirdRoute = () => (
<View style={[styles.scene, { backgroundColor: "#673ab7" }]} /> <View style={[styles.scene, {backgroundColor: "#673ab7"}]}/>
); );
const FourthRoute = () => ( const FourthRoute = () => (
<View style={[styles.scene, { backgroundColor: "#673ab7" }]} /> <View style={[styles.scene, {backgroundColor: "#673ab7"}]}/>
); );
export default class Eventos extends React.Component {
state = {
index: 0,
routes: [
{ key: "first", title: "Festarola" },
{ key: "second", title: "Febrada" },
{ key: "third", title: "Rally" },
{ key: "fourth", title: "Peddy" }
]
};
render() {
return ( export default class Eventos extends React.Component {
<View> state = {
<Button index: 0,
title="Febrada" routes: [
onPress={() => this.props.navigation.navigate("febrada")} {key: "first", title: "Festarola"},
/> {key: "second", title: "Febrada"},
</View> {key: "third", title: "Rally"},
); {key: "fourth", title: "Peddy"}
} ]
};
renderFebrada = () => {
return (
<View>
<Text>Ola mundo</Text>
</View>
);
};
renderRally = () => {
};
renderCaching = () => {
};
render() {
return (
<View style={styles.container}>
<ScrollView styles={styles.scroll}>
<View styles={styles.cardContainer}>
{this.renderFebrada()}
</View>
<View styles={styles.cardContainer}>
</View>
<View styles={styles.cardContainer}>
</View>
</ScrollView>
</View>
);
}
} }
const styles = StyleSheet.create({ const styles = StyleSheet.create({
scene: { container: {
flex: 1 backgroundColor: '#eee',
} flex: 1,
},
scroll: {
flex: 1,
},
cardContainer: {
flex: 1,
padding: 10,
margin: 20,
backgroundColor: 'white',
borderRadius: 5,
height: SCREEN_WIDTH * (1/2),
},
scene: {
flex: 1
}
}); });

View File

@ -45,8 +45,8 @@ class Profile extends Component {
super(props); super(props);
this.state = { this.state = {
name:this.props.user.Name, name: this.props.user.Name,
userDetails:{}, userDetails: {},
token: false, token: false,
tokenData: '', tokenData: '',
loggedIn: false, loggedIn: false,
@ -87,10 +87,10 @@ class Profile extends Component {
}; };
_validateData = (name,jobs, email, phone, address, city) => { _validateData = (name, jobs, email, phone, address, city) => {
let valid = null; let valid = null;
v = Validate('name',name ); v = Validate('name', name);
let v = Validate('email', email); let v = Validate('email', email);
@ -138,29 +138,29 @@ class Profile extends Component {
saveData() { saveData() {
const {name,jobs, email, phone, address, city, formValid} = this.state; const {name, jobs, email, phone, address, city, formValid} = this.state;
this._validateData(name,jobs, email, phone, address, city); this._validateData(name, jobs, email, phone, address, city);
console.log(formValid); console.log(formValid);
if (formValid){ if (formValid) {
console.log("data valid"); console.log("data valid");
this.props.updateUser(this.props.userDetails.token,{ this.props.updateUser(this.props.userDetails.token, {
Name: this.state.name, Name: this.state.name,
// LastName: "Último", // LastName: "Último",
Company: jobs, Company: jobs,
// Job: jobs, // Job: jobs,
Address: address, Address: address,
City: city, City: city,
// PostalCode: "3000-010", // PostalCode: "3000-010",
Mobile: phone, Mobile: phone,
Avatar: "base64" Avatar: "base64"
} ); this.props.getUserInfo(this.props.userDetails.token); });
this.props.getUserInfo(this.props.userDetails.token);
} }
else else
@ -190,7 +190,7 @@ class Profile extends Component {
<TextInput style={styles.userBioText} <TextInput style={styles.userBioText}
onChangeText={(n) => { onChangeText={(n) => {
this.setState({name:n }) this.setState({name: n})
}} }}
value={this.state.name}/> value={this.state.name}/>
</View> </View>
@ -206,7 +206,6 @@ class Profile extends Component {
</View> </View>
<Divider style={{backgroundColor: 'black'}}/> <Divider style={{backgroundColor: 'black'}}/>
<View style={styles.userBioRow}> <View style={styles.userBioRow}>
<Icon name="ios-phone-portrait" style={styles.userBioLogo} size={25}/> <Icon name="ios-phone-portrait" style={styles.userBioLogo} size={25}/>
@ -261,16 +260,16 @@ class Profile extends Component {
</View> </View>
<View style={styles.userBio}> <View style={styles.userBio}>
<View style={styles.userBioRow}> <View style={styles.userBioRow}>
<Text style={styles.userPassText} size={25}> <Text style={styles.userPassText} size={20}>
Old Password: Old Password:
</Text> </Text>
<TextInput style={styles.userBioText} <TextInput style={styles.userBioText}
placeholder='Antiga Password' secureTextEntry={true} placeholder='Antiga Password' secureTextEntry={true}
/> />
</View> </View>
<View style={styles.userBioRow}> <View style={styles.userBioRow}>
<Text style={styles.userPassText} size={25}> <Text style={styles.userPassText} size={20}>
Nova Password: Nova Password:
</Text> </Text>
@ -279,7 +278,7 @@ class Profile extends Component {
/> />
</View> </View>
<View style={styles.userBioRow}> <View style={styles.userBioRow}>
<Text style={styles.userPassText} size={25}> <Text style={styles.userPassText} size={20}>
Repetir Password: Repetir Password:
</Text> </Text>
@ -293,9 +292,14 @@ class Profile extends Component {
</ScrollView> </ScrollView>
<TouchableOpacity onPress={this._logout} style={{ height: 50, justifyContent: 'center', alignItems: 'center', backgroundColor: '#CC1A17'}}> <TouchableOpacity onPress={this._logout} style={{
<Text style={{color:"#fff", fontWeight: 'bold'}}>Logout</Text> height: 50,
</TouchableOpacity> justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#CC1A17'
}}>
<Text style={{color: "#fff", fontWeight: 'bold'}}>Logout</Text>
</TouchableOpacity>
</View> </View>
@ -330,23 +334,27 @@ const styles = StyleSheet.create({
flex: 1, flex: 1,
flexDirection: 'row', flexDirection: 'row',
justifyContent: 'flex-start', justifyContent: 'flex-start',
padding: 10 padding: 10,
borderWidth: 2,
alignItems: 'center',
}, },
userBioText: { userBioText: {
width: SCREEN_WIDTH * 0.50, width: SCREEN_WIDTH * 0.40,
flex: 2,
borderWidth: 2,
}, },
userPassText: { userPassText: {
flex: 1, flex: 1,
flexDirection: 'row', //alignSelf: 'flex-start',
justifyContent: 'flex-start', justifyContent: 'flex-end',
borderWidth: 2,
}, },
userBioLogo: { userBioLogo: {
marginLeft: SCREEN_WIDTH * 0.05, marginLeft: SCREEN_WIDTH * 0.05,
width: SCREEN_WIDTH * 0.15, width: SCREEN_WIDTH * 0.15,
}, },
bottomLogOut: { bottomLogOut: {

View File

@ -49,7 +49,7 @@ const formatObj = (obj) => {
class calendarDetail extends React.Component { class calendarDetail extends React.Component {
static navigationOptions = ({navigation}) => ({ static navigationOptions = ({navigation}) => ({
header: ( header: (
<NavAbsolute <NavAbsolute
@ -103,33 +103,32 @@ class calendarDetail extends React.Component {
renderDescription = (info) => { renderDescription = (info) => {
return ( return (
<View> <View>
<View style={styles.infoRow}> <View style={styles.cardContainer}>
<View style={{flexDirection: "row"}}> <View style={{flexDirection: "row", alignItems: 'center', alignSelf:'center'}}>
<Text style={styles.ramoText}>Onde está o ramo? xD </Text> <Text style={styles.ramoText}>Onde está o ramo? xD </Text>
<View style={styles.timeText}> <View style={styles.timeText}>
<Text style={{color: "#CC1A17", fontSize: 20,}}> <Text style={{color: "#CC1A17", fontSize: 15}}>
{info.time === info.timeEnd ? info.time : `${info.time} - ${info.timeEnd}`} {info.time === info.timeEnd ? info.time : `${info.time} - ${info.timeEnd}`}
</Text> </Text>
</View>
</View> </View>
</View>
<View style={styles.details}> <View style={styles.details}>
<Text style={styles.nameAttendee}>Attendee Name</Text> <Text style={styles.nameAttendee}>Attendee Name</Text>
<Progress.Bar color={'#000000'} progress={info.Enrolled / info.MaxAttendees} height={10} <Progress.Bar color={'#000000'} progress={info.Enrolled / info.MaxAttendees} height={10}
unfilledColor={'white'} width={210}/> unfilledColor={'white'} width={210}/>
<Text style={{alignSelf: "center"}}>{info.Enrolled} / {info.MaxAttendees}</Text> <Text style={{alignSelf: "center"}}>{info.Enrolled} / {info.MaxAttendees}</Text>
</View> </View>
</View> </View>
<View style={styles.infoRow}> <View style={styles.cardContainer}>
<Text style={{fontSize: 30, color: "#CC1A17"}}>Descrição</Text> <Text style={{fontSize: 20, color: "#CC1A17"}}>Descrição</Text>
<Divider style={{backgroundColor: '#000'}}/> <Divider style={{backgroundColor: '#000'}}/>
<View style={{marginTop: 10}}> <View style={{marginTop: 10}}>
<Text style={{fontSize: 15}}> <Text style={{fontSize: 10}}>
{info.description} {info.description}
</Text> </Text>
</View> </View>
</View> </View>
</View> </View>
) )
@ -138,22 +137,22 @@ class calendarDetail extends React.Component {
renderMap = () => { renderMap = () => {
return ( return (
<MapView <MapView
provider={PROVIDER_GOOGLE} provider={PROVIDER_GOOGLE}
style={{flex: 2}} style={{flex: 2}}
region={{ region={{
latitude: 40.19092111672049, latitude: 40.19092111672049,
latitudeDelta: 0.007664297080957283, latitudeDelta: 0.007664297080957283,
longitude: -8.410662319511175, longitude: -8.410662319511175,
longitudeDelta: 0.007551424205303192 longitudeDelta: 0.007551424205303192
}} }}
onRegionChangeComplete={(region) => { onRegionChangeComplete={(region) => {
console.log(region); console.log(region);
}} }}
/> />
) )
}; };
*/ */
@ -205,13 +204,14 @@ class calendarDetail extends React.Component {
<View style={styles.mainViewStyle}> <View style={styles.mainViewStyle}>
<ScrollView style={styles.scroll}> <ScrollView style={styles.scroll}>
<View style={styles.container}> <View style={styles.container}>
<View style={styles.cardContainer}> <View style={styles.headerContainer}>
{this.renderHeader(info)} {this.renderHeader(info)}
</View> </View>
{this.renderDescription(info)} {this.renderDescription(info)}
</View> </View>
<View style={styles.infoRow}> <View style={styles.cardContainer}>
<Text style={{fontSize: 30, color: "#CC1A17"}}>Localização</Text>
<Text style={{fontSize: 20, color: "#CC1A17"}}>Localização</Text>
<Divider style={{backgroundColor: '#000', marginBottom: 10}}/> <Divider style={{backgroundColor: '#000', marginBottom: 10}}/>
</View> </View>
@ -236,7 +236,7 @@ const styles = StyleSheet.create({
}, },
centerRow: { centerRow: {
alignItems: 'flex-start', alignItems: 'center',
backgroundColor: 'transparent', backgroundColor: 'transparent',
flex: 3, flex: 3,
flexDirection: 'column', flexDirection: 'column',
@ -248,7 +248,7 @@ const styles = StyleSheet.create({
flex: 1, flex: 1,
flexDirection: 'row', flexDirection: 'row',
justifyContent: 'flex-start', justifyContent: 'flex-start',
alignSelf: 'center' alignSelf: 'center',
}, },
rightRow: { rightRow: {
alignItems: 'flex-end', alignItems: 'flex-end',
@ -294,7 +294,7 @@ const styles = StyleSheet.create({
timeText: { timeText: {
alignItems: 'flex-end', alignItems: 'flex-end',
flex: 2, flex: 2,
marginBottom: 5, lineHeight: 10,
marginRight: 4, marginRight: 4,
}, },
@ -305,14 +305,23 @@ const styles = StyleSheet.create({
}, },
scroll: { scroll: {
backgroundColor: '#FFF', backgroundColor: '#eee',
flex: 1, flex: 1,
//marginBottom: 55, //marginBottom: 55,
}, },
cardContainer: { cardContainer: {
flex: 1, flex: 1,
padding: 10,
margin: 20,
backgroundColor: 'white',
borderRadius: 5,
}, },
headerContainer: {
flex: 1,
},
container: { container: {
flex: 1, flex: 1,
flexDirection: 'column', flexDirection: 'column',
@ -324,10 +333,10 @@ const styles = StyleSheet.create({
height: Dimensions.get('window').width * (2 / 4), height: Dimensions.get('window').width * (2 / 4),
width: Dimensions.get('window').width, width: Dimensions.get('window').width,
}, },
headerContainer: { /*headerContainer: {
alignItems: 'center', alignItems: 'center',
backgroundColor: '#FFF', backgroundColor: '#FFF',
}, },*/
carreerPathContainer: { carreerPathContainer: {