zmiguel
/
ENEI2019-Public
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

novo perfil

This commit is contained in:
henrydays 2019-02-16 22:16:41 +00:00
parent b219013ac5
commit 4fc96107f3
12 changed files with 479 additions and 122 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
App/android/app/build.gradle
View File

@ -149,6 +149,7 @@ android {
}
dependencies {
compile project(':react-native-material-shadows')
compile project(':react-native-linear-gradient')
compile project(':react-native-camera')
compile project(':react-native-vector-icons')

2
App/android/app/src/main/java/com/app/MainApplication.java
View File

@ -3,6 +3,7 @@ package com.app;
import android.app.Application;
import com.facebook.react.ReactApplication;
import ui.materialshadows.RNMaterialShadowsPackage;
import com.BV.LinearGradient.LinearGradientPackage;
import org.reactnative.camera.RNCameraPackage;
import com.oblador.vectoricons.VectorIconsPackage;
@ -27,6 +28,7 @@ public class MainApplication extends Application implements ReactApplication {
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage(),
new RNMaterialShadowsPackage(),
new LinearGradientPackage(),
new RNCameraPackage(),
new VectorIconsPackage(),

2
App/android/settings.gradle
View File

@ -1,4 +1,6 @@
rootProject.name = 'app'
include ':react-native-material-shadows'
project(':react-native-material-shadows').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-material-shadows/android')
include ':react-native-linear-gradient'
project(':react-native-linear-gradient').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-linear-gradient/android')
include ':react-native-camera'

3
App/app/App.js
View File

@ -14,7 +14,8 @@ import {
ImageBackground,
LinearGradient,
TouchableOpacity,
TextInput
TextInput,
} from 'react-native';

BIN
App/app/assets/img/bg_3.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 155 KiB

62
App/app/components/Email.js Executable file
View File

@ -0,0 +1,62 @@
import React from 'react'
import { StyleSheet, Text, TouchableOpacity, View } from 'react-native'
import { Icon } from 'react-native-elements'
const styles = StyleSheet.create({
container: {
flexDirection: 'row',
justifyContent: 'flex-start',
marginBottom: 25,
marginTop: 25,
},
emailColumn: {
flexDirection: 'row',
justifyContent: 'flex-start',
marginBottom: 5,
},
emailIcon: {
color: '#CC6666',
fontSize: 30,
},
emailNameText: {
color: 'gray',
fontSize: 14,
fontWeight: '200',
},
emailRow: {
flex: 8,
flexDirection: 'column',
justifyContent: 'center',
},
emailText: {
fontSize: 16,
},
iconRow: {
flex: 2,
justifyContent: 'center',
},
});
const Email = ({ containerStyle, onPressEmail, name, email, key}) => (
<TouchableOpacity onPress={() => onPressEmail(email)}>
<View style={[styles.container, containerStyle]}>
<View style={styles.iconRow}>
<Icon
name="email"
underlayColor="transparent"
iconStyle={styles.emailIcon}
onPress={() => onPressEmail()}
/>
</View>
<View style={styles.emailRow}>
<View style={styles.emailColumn}>
<Text style={styles.emailText}>{email}</Text>
</View>
</View>
</View>
</TouchableOpacity>
)
export default Email

27
App/app/components/Separator.js Executable file
View File

@ -0,0 +1,27 @@
import React from 'react'
import { StyleSheet, View } from 'react-native'
const styles = StyleSheet.create({
container: {
flexDirection: 'row',
},
separatorOffset: {
flex: 2,
flexDirection: 'row',
},
separator: {
flex: 8,
flexDirection: 'row',
borderColor: '#EDEDED',
borderWidth: 0.8,
},
})
const Separator = () => (
<View style={styles.container}>
<View style={styles.separatorOffset} />
<View style={styles.separator} />
</View>
)
export default Separator

91
App/app/components/Telephone.js Executable file
View File

@ -0,0 +1,91 @@
import React from 'react'
import {StyleSheet, Text, TouchableOpacity, View} from 'react-native'
import {Icon} from 'react-native-elements'
const styles = StyleSheet.create({
container: {
flexDirection: 'row',
justifyContent: 'flex-start',
marginBottom: 25,
marginTop: 25,
},
iconRow: {
flex: 2,
justifyContent: 'center',
},
smsIcon: {
color: 'gray',
fontSize: 30,
},
smsRow: {
flex: 2,
justifyContent: 'flex-start',
},
telIcon: {
color: '#CC6666',
fontSize: 30,
},
telNameColumn: {
flexDirection: 'row',
justifyContent: 'flex-start',
},
telNameText: {
color: 'gray',
fontSize: 14,
fontWeight: '200',
},
telNumberColumn: {
flexDirection: 'row',
justifyContent: 'flex-start',
marginBottom: 5,
},
telNumberText: {
fontSize: 16,
},
telRow: {
flex: 6,
flexDirection: 'column',
justifyContent: 'center',
},
})
const Tel = ({
containerStyle,
name,
number,
onPressSms,
onPressTel,
}) => {
return (
<TouchableOpacity onPress={() => onPressTel(number)}>
<View style={[styles.container, containerStyle]}>
<View style={styles.iconRow}>
<Icon
name="call"
underlayColor="transparent"
iconStyle={styles.telIcon}
onPress={() => onPressTel(number)}
/>
</View>
<View style={styles.telRow}>
<View style={styles.telNumberColumn}>
<Text style={styles.telNumberText}>{number}</Text>
</View>
</View>
<View style={styles.smsRow}>
<Icon
name="textsms"
underlayColor="transparent"
iconStyle={styles.smsIcon}
onPress={() => onPressSms(number)}
/>
</View>
</View>
</TouchableOpacity>
)
};
export default Tel

236
App/app/screens/Home.js
View File

@ -1,8 +1,20 @@
import React, {Component} from 'react';
import {Button, View, Text, TouchableOpacity, FlatList, ActivityIndicator} from 'react-native';
import {
Button,
View,
Text,
TouchableOpacity,
FlatList,
ActivityIndicator,
Dimensions,
StyleSheet,
Image,
ImageBackground
} from 'react-native';
import {Shadow} from 'react-native-shadow'
import Icon from "react-native-vector-icons/Ionicons"
import {
RkButton,
RkTheme
@ -14,12 +26,29 @@ import {connect} from 'react-redux';
import {bindActionCreators} from 'redux';
import * as Actions from '../store/actions'; //Import your actionss
import ImageOverlay from "react-native-image-overlay";
import {createStore} from 'redux';
import {Provider} from 'react-redux'
import { ScrollView } from 'react-native-gesture-handler';
const SCREEN_HEIGHT = Dimensions.get("window").height;
const SCREEN_WIDTH = Dimensions.get("window").width;
import {Card, Divider} from 'react-native-elements'
import RNMaterialShadows from 'react-native-material-shadows';
const shadowOpt = {
width:100,
height:100,
color:"#000",
border:2,
radius:3,
opacity:0.2,
x:0,
y:3,
style:{marginVertical:5}
}
class Home extends Component {
@ -34,8 +63,6 @@ class Home extends Component {
onHold: true,
user: {Name: ''}
};
}
componentDidMount() {
@ -78,36 +105,12 @@ class Home extends Component {
// this.props.logout();
this.props.logoutUser();
}
update = () => {
this.setState({user: this.props.user});
var o = [];
for (var key in this.props.user.Sessions) {
o.push({
time: this.props.user.Sessions[key].SessionStart.substr(11, 16),
timeEnd: this.props.user.Sessions[key].SessionEnd.substr(11, 16),
lineColor: '#009688',
imageUrl: 'https://d2v9y0dukr6mq2.cloudfront.net/video/thumbnail/Vjkyj2hBg/welcome-white-sign-with-falling-colorful-confetti-animation-on-white-background_sglmmh3qm__F0013.png',
description: this.props.user.Sessions[key].Description,
name: this.props.user.Sessions[key].Name,
})
}
console.log(this.props.user.Sessions);
}
render() {
const {navigate} = this.props.navigation;
if (this.props.onHold) {
return (
@ -117,21 +120,83 @@ class Home extends Component {
</View>
)
}
if (this.props.logged) {
return (
<ScrollView style={{backgroundColor:'#eeeeee'}}>
<View>
<ImageBackground
opacity={0.9}
source={require('../assets/img/bg_3.jpg')}
style={{
width: '100%',
// marginTop:150,
backgroundColor: 'rgba(255,255,255,1)' ,
shadowOffset:{ width: 10, height: 10, },
shadowColor: 'black',
shadowOpacity: 1.0
}
}>
<View style={styles.homeHeader}>
<View style={styles.userImageContainer}>
<Image style={styles.userImage} source={{uri: 'https://i.imgur.com/XXJ7LxV.jpg'}}/>
</View>
<Text style={styles.userText}>{this.props.user.Name}</Text>
<Text style={styles.userTextSub}>{this.props.user.Company}</Text>
</View>
</ImageBackground>
<View style={styles.userBio}>
<View style={styles.userBioRow}>
<Icon name="ios-laptop" style={styles.userBioLogo} size={25}/>
<Text style={styles.userBioText}>{this.props.user.Job}</Text>
</View>
<Divider style={{ backgroundColor: 'black' }} />
<View style={styles.userBioRow}>
<Icon name="ios-mail" style={styles.userBioLogo} size={25}/>
<Text style={styles.userBioText}>{this.props.user.Email}</Text>
</View>
<Divider style={{ backgroundColor: 'black' }} />
<View style={styles.userBioRow}>
<Icon name="ios-phone-portrait" style={styles.userBioLogo} size={25}/>
<Text style={styles.userBioText}>{this.props.user.Mobile}</Text>
</View>
<Divider style={{ backgroundColor: 'black' }} />
<View style={styles.userBioRow}>
<Icon name="ios-map" style={styles.userBioLogo} size={25}/>
<Text style={styles.userBioText}>{this.props.user.Address}, {this.props.user.City}</Text>
</View>
<Divider style={{ backgroundColor: 'black' }} />
<View style={styles.userBioRow}>
<Icon name="ios-person" style={styles.userBioLogo} size={25}/>
<TouchableOpacity><Text style={styles.userCurriculum}>O meu Curriculo</Text></TouchableOpacity>
</View>
</View>
<View style={styles.userStats}>
</View>
<Button onPress={this._logout} title="LOGOUT"/>
<Button onPress={this.update} title="update"/>
<Button onPress={this.bClick} title="Parse"/>
<Text> Nomess: {this.props.user.Name}</Text>
<Text> city: {this.props.user.City}</Text>
<Text> phone: {this.props.user.Mobile}</Text>
</View>
</ScrollView>
);
}
else {
@ -146,24 +211,91 @@ class Home extends Component {
}
renderItem({item, index}) {
return (
<View>
<Text>
{(parseInt(index) + 1)}{". "}{item.title}
</Text>
<Text>
{item.description}
</Text>
</View>
)
}
}
const styles = StyleSheet.create({
userCurriculum:{
paddingTop:5,
color:'red',
fontWeight:'bold',
fontSize:15
},
userBioRow:{
flex:1,
flexDirection:'row',
padding:10,
},
userBioText:{
},
userBioLogo:{
marginLeft: SCREEN_WIDTH*0.05,
width: SCREEN_WIDTH*0.15,
},
userTextSub:{
backgroundColor: 'rgba(0,0,0,0.7)' ,
color:'white',
},
userText:{
backgroundColor: 'rgba(0,0,0,0.7)' ,
color:'white',
fontWeight:'bold',
fontSize:20,
},
homeHeader:{
flex:1,
height: SCREEN_HEIGHT*0.3,
justifyContent: 'center',
alignItems:'center' ,
},
userImage:{
width:110,
height:110,
borderWidth: 1,
borderRadius: 5,
borderWidth:2,
borderColor: 'white',
},
userBio:{
flex:1,
padding:10,
margin:9,
backgroundColor:'white',
// height: SCREEN_HEIGHT*0.20,
color:'black',
borderRadius:5,
},
userStats:{
backgroundColor:'#CC1A17',
height: SCREEN_HEIGHT*0.2,
padding:10,
margin:9,
borderRadius:5,
marginTop:0,
},
userImageContainer:{
alignSelf: 'center',
// transform: [{ rotate: '-15deg'}],
}
});
function mapStateToProps(state, props) {
return {

147
App/app/screens/Profile.js
View File

@ -16,12 +16,16 @@ import PropTypes from 'prop-types';
import {connect, Provider} from "react-redux";
import {bindActionCreators} from "redux";
import * as Actions from "../store/actions";
import {createStore} from 'redux';
import Email from '../components/Email';
import Separator from '../components/Separator';
import Tel from '../components/Telephone';
class Profile extends Component {
@ -37,50 +41,32 @@ class Profile extends Component {
user: {}
};
}
/*
state = {
telDS: new ListView.DataSource({
rowHasChanged: (r1, r2) => r1 !== r2,
}).cloneWithRows(this.props.tels),
emailDS: new ListView.DataSource({
rowHasChanged: (r1, r2) => r1 !== r2,
}).cloneWithRows(this.props.emails),
};
*/
onPressPlace = () => {
console.log('place')
};
onPressTel = number => {
Linking.openURL(`tel://${number}`).catch(err =>
console.log('Error:', err))
};
onPressSms = () => {
console.log('sms')
onPressSms = number => {
Linking.openURL(`sms:${number}`).catch(err =>
console.log('Error:', err))
};
onPressEmail = email => {
Linking.openURL(`mailto:${email}-+`).catch(err =>
Linking.openURL(`mailto:${email}`).catch(err =>
console.log('Error:', err)
)
};
renderHeader = () => {
/* const {
avatar,
avatarBackground,
name,
address: {city, country},
} = this.props;*/
return (
<View style={styles.header}>
<View style={styles.headerContent}>
<Image style={styles.avatar}
source={{uri: `${this.props.user.Avatar}`}}/>
<View style={styles.avatarSquare}>
<Image style={styles.avatar}
source={{uri: `${this.props.user.Avatar}`}} resizeMode='contain'/>
</View>
<Text style={styles.name}> {this.props.user.Name} {this.props.user.LastName}</Text>
<Text style={styles.userInfo}> {this.props.user.City} </Text>
@ -90,54 +76,39 @@ class Profile extends Component {
};
renderTel = () => {
return (
<View style={styles.telContainer}>
<TouchableOpacity onPress={() => this.onPressTel(`${this.props.user.Mobile}`)}>
<Text>{this.props.user.Mobile}</Text>
</TouchableOpacity>
</View>
<Tel
name={this.props.user.Name}
number={this.props.user.Mobile}
onPressSms={this.onPressSms}
onPressTel={this.onPressTel}
/>
)
};
/* <ListView
contentContainerStyle={styles.telContainer}
/*dataSource={this.state.telDS}
renderRow = {({id, name, number}, _, k)
=>
{
}
}
/>}*/
};
renderEmail = () => {
return (
<View styles={styles.emailContainer}>
<TouchableOpacity onPress={() => this.onPressEmail(`${this.props.user.Email}`)}>
<Text>{this.props.user.Email} </Text>
</TouchableOpacity>
</View>
<Email
key={`${this.props.user}`}
name={this.props.user.Name}
email={this.props.user.Email}
onPressEmail={this.onPressEmail}
/>
)
/* <ListView
contentContainerStyle={styles.emailContainer}
/*dataSource={this.state.emailDS}
renderRow={({email, id, name}, _, k) => {
}}
/>*/
};
render() {
return (
<ScrollView style={styles.scroll}>
<View style={styles.container}>
{this.renderHeader()}
<View style={styles.body}>
<Card containerStyle={styles.cardContainer}>
{this.renderHeader()}
{this.renderTel()}
{Separator()}
{this.renderEmail()}
</View>
</Card>
</View>
</ScrollView>
)
@ -149,42 +120,80 @@ const styles = StyleSheet.create({
scroll: {
backgroundColor: '#FFF',
},
emailContainer: {
backgroundColor: '#FFF',
container: {
flex: 1,
},
cardContainer: {
backgroundColor: '#FFF',
borderWidth: 0,
flex: 1,
margin: 0,
padding: 0,
},
emailContainer: {
color: '#000',
paddingTop: 30,
alignItems: 'center',
},
telContainer: {
backgroundColor: '#FFF',
flex: 1,
color: '#000',
paddingTop: 30,
alignItems: 'center',
},
contact_container: {
backgroundColor: '#FFF',
margin: 20,
//height: 150,
},
header: {
backgroundColor: "#DCDCDC",
backgroundColor: '#CC6666',
},
headerContent: {
padding: 30,
alignItems: 'center',
},
avatar: {
/* borderWidth: 4,*/
transform: [{rotateZ: '20deg'}],
/*borderColor: "#000",
marginBottom: 50,*/
flex: 1,
alignItems: 'center',
},
avatarSquare: {
width: 130,
height: 130,
borderRadius: 63,
transform: [{rotateZ: '-20deg'}],
borderWidth: 4,
borderColor: "white",
marginBottom: 10,
borderColor: "#000",
marginBottom: 50,
backgroundColor: '#fff',
},
userInfo: {
fontSize: 16,
color: "#778899",
fontWeight: '600',
},
data_content: {
backgroundColor: '#777',
},
});
mapStateToProps = (state, props) => {
mapStateToProps = (state, props) => {
return {

26
App/package-lock.json generated
View File

@ -7797,6 +7797,14 @@
"react-native-status-bar-height": "^2.2.0"
}
},
"react-native-fit-image": {
"version": "1.5.4",
"resolved": "https://registry.npmjs.org/react-native-fit-image/-/react-native-fit-image-1.5.4.tgz",
"integrity": "sha512-wNHlGdDWsUU31qlM5SsvZrMH4eXBZt586FQNXFRFuOiXVqdA++6Xait7aiZ+5vxglgqLf+zzSnoICn0NEvDfrw==",
"requires": {
"prop-types": "^15.5.10"
}
},
"react-native-gesture-handler": {
"version": "1.0.15",
"resolved": "https://registry.npmjs.org/react-native-gesture-handler/-/react-native-gesture-handler-1.0.15.tgz",
@ -7814,6 +7822,14 @@
}
}
},
"react-native-image-overlay": {
"version": "0.1.2",
"resolved": "https://registry.npmjs.org/react-native-image-overlay/-/react-native-image-overlay-0.1.2.tgz",
"integrity": "sha512-0bM8Zc8/GZWvvbGccADPmw1onhE9ZVrq/brOSoNIoJU0Kp+8G7lJ2w5+7Us3wIVKHi6Syji/KNypS91svCH8gA==",
"requires": {
"prop-types": "^15.6.1"
}
},
"react-native-ionicons": {
"version": "4.5.5",
"resolved": "https://registry.npmjs.org/react-native-ionicons/-/react-native-ionicons-4.5.5.tgz",
@ -7833,6 +7849,11 @@
"version": "github:expo/react-native-maps#e6f98ff7272e5d0a7fe974a41f28593af2d77bb2",
"from": "github:expo/react-native-maps#v0.22.1-exp.0"
},
"react-native-material-shadows": {
"version": "0.0.2",
"resolved": "https://registry.npmjs.org/react-native-material-shadows/-/react-native-material-shadows-0.0.2.tgz",
"integrity": "sha512-igZWUvc9qCHk6vN0sR4bktBixrSHMwmy8n/sNQC9EqxoOcp0ChWF82hujPp9XqbVii7ZX0E3FGiYCWFtGfPHVA=="
},
"react-native-modal": {
"version": "7.0.2",
"resolved": "https://registry.npmjs.org/react-native-modal/-/react-native-modal-7.0.2.tgz",
@ -7906,6 +7927,11 @@
"resolved": "https://registry.npmjs.org/react-native-screens/-/react-native-screens-1.0.0-alpha.19.tgz",
"integrity": "sha512-+a7GdwzLWYWYVUJMg+XuyBoRFGD8GdGyBfebuTNBY+xwUZpTXCaK/GlLGL6EE3h0iBHZu83do7zViEailWRNyA=="
},
"react-native-shadow": {
"version": "1.2.2",
"resolved": "https://registry.npmjs.org/react-native-shadow/-/react-native-shadow-1.2.2.tgz",
"integrity": "sha512-kwTmqRKmPEML9KbJi0uvvKd+67rOJQcr3IyNp9bg+qi/H+Wnwev/Mr8sUiUZlYEJ433ii2iNwpjc1ERMjHtMWw=="
},
"react-native-status-bar-height": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/react-native-status-bar-height/-/react-native-status-bar-height-2.2.0.tgz",

4
App/package.json
View File

@ -18,13 +18,17 @@
"react-native-camera": "^1.9.2",
"react-native-confirmation-code-input": "^1.0.4",
"react-native-elements": "^1.0.0",
"react-native-fit-image": "^1.5.4",
"react-native-gesture-handler": "^1.0.15",
"react-native-image-overlay": "^0.1.2",
"react-native-ionicons": "^4.5.5",
"react-native-linear-gradient": "^2.5.3",
"react-native-loader": "^1.2.1",
"react-native-material-shadows": "0.0.2",
"react-native-modal": "^7.0.2",
"react-native-progress": "^3.5.0",
"react-native-qrcode-scanner": "^1.1.2",
"react-native-shadow": "^1.2.2",
"react-native-swiper": "^1.5.14",
"react-native-timeline-feed": "^1.0.1",
"react-native-timeline-listview": "^0.2.3",