forked from vergnet/application-amicale
Added club information
This commit is contained in:
parent
d7d6146245
commit
5e40e271b7
1 changed files with 163 additions and 56 deletions
|
|
@ -1,8 +1,10 @@
|
|||
import * as React from 'react';
|
||||
import {ScrollView, StyleSheet} from "react-native";
|
||||
import {FlatList, StyleSheet} from "react-native";
|
||||
import {Avatar, Button, Card, Divider, List, withTheme} from 'react-native-paper';
|
||||
import AuthenticatedScreen from "../../components/AuthenticatedScreen";
|
||||
import {openBrowser} from "../../utils/WebBrowser";
|
||||
import ConnectionManager from "../../managers/ConnectionManager";
|
||||
import HeaderButton from "../../components/HeaderButton";
|
||||
|
||||
type Props = {
|
||||
navigation: Object,
|
||||
|
|
@ -17,71 +19,176 @@ class ProfileScreen extends React.Component<Props, State> {
|
|||
|
||||
colors: Object;
|
||||
|
||||
data: Object;
|
||||
|
||||
flatListData: Array<Object>;
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.colors = props.theme.colors;
|
||||
this.onClickDisconnect = this.onClickDisconnect.bind(this);
|
||||
this.flatListData = [
|
||||
{id: 0},
|
||||
{id: 1},
|
||||
{id: 2},
|
||||
]
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
const rightButton = this.getHeaderButtons.bind(this);
|
||||
this.props.navigation.setOptions({
|
||||
headerRight: rightButton,
|
||||
});
|
||||
}
|
||||
|
||||
getHeaderButtons() {
|
||||
return <HeaderButton icon={'logout'} onPress={this.onClickDisconnect}/>;
|
||||
}
|
||||
|
||||
onClickDisconnect() {
|
||||
ConnectionManager.getInstance().disconnect()
|
||||
.then(() => {
|
||||
this.props.navigation.reset({
|
||||
index: 0,
|
||||
routes: [{name: 'Main'}],
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
getScreen(data: Object) {
|
||||
console.log(data);
|
||||
this.data = data;
|
||||
return (
|
||||
<ScrollView>
|
||||
<Card style={styles.card}>
|
||||
<Card.Title
|
||||
title={data.first_name + ' ' + data.last_name}
|
||||
subtitle={data.email}
|
||||
left={(props) => <Avatar.Icon
|
||||
{...props}
|
||||
icon="account"
|
||||
color={this.colors.primary}
|
||||
style={styles.icon}
|
||||
/>}
|
||||
/>
|
||||
<Card.Content>
|
||||
<Divider/>
|
||||
<List.Section>
|
||||
<List.Subheader>INFORMATIONS PERSONNELLES</List.Subheader>
|
||||
<List.Item
|
||||
title={this.getFieldValue(data.birthday)}
|
||||
left={props => <List.Icon {...props} icon="cake-variant"/>}
|
||||
/>
|
||||
<List.Item
|
||||
title={this.getFieldValue(data.phone)}
|
||||
left={props => <List.Icon {...props} icon="phone"/>}
|
||||
/>
|
||||
<List.Item
|
||||
title={this.getFieldValue(data.email)}
|
||||
left={props => <List.Icon {...props} icon="email"/>}
|
||||
/>
|
||||
<List.Item
|
||||
title={this.getFieldValue(data.branch)}
|
||||
left={props => <List.Icon {...props} icon="school"/>}
|
||||
/>
|
||||
</List.Section>
|
||||
<Divider/>
|
||||
<Card.Actions>
|
||||
<Button
|
||||
icon="account-edit"
|
||||
mode="contained"
|
||||
onPress={() => openBrowser(data.link, this.colors.primary)}
|
||||
style={styles.editButton}>
|
||||
EDITER INFOS
|
||||
</Button>
|
||||
</Card.Actions>
|
||||
</Card.Content>
|
||||
</Card>
|
||||
<Card style={styles.card}>
|
||||
<Card.Content>
|
||||
<List.Section>
|
||||
<List.Subheader>ETAT COTISATION</List.Subheader>
|
||||
{this.getMembershipItem(data.validity)}
|
||||
</List.Section>
|
||||
</Card.Content>
|
||||
</Card>
|
||||
</ScrollView>
|
||||
<FlatList
|
||||
renderItem={item => this.getRenderItem(item)}
|
||||
keyExtractor={item => item.id}
|
||||
data={this.flatListData}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
getRenderItem({item}: Object) {
|
||||
switch (item.id) {
|
||||
case 0:
|
||||
return this.getPersonalCard();
|
||||
case 1:
|
||||
return this.getClubCard();
|
||||
case 2:
|
||||
return this.getMembershipCar();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
getPersonalCard() {
|
||||
return (
|
||||
<Card style={styles.card}>
|
||||
<Card.Title
|
||||
title={this.data.first_name + ' ' + this.data.last_name}
|
||||
subtitle={this.data.email}
|
||||
left={(props) => <Avatar.Icon
|
||||
{...props}
|
||||
icon="account"
|
||||
color={this.colors.primary}
|
||||
style={styles.icon}
|
||||
/>}
|
||||
/>
|
||||
<Card.Content>
|
||||
<Divider/>
|
||||
<List.Section>
|
||||
<List.Subheader>INFORMATIONS PERSONNELLES</List.Subheader>
|
||||
<List.Item
|
||||
title={this.getFieldValue(this.data.birthday)}
|
||||
left={props => <List.Icon {...props} icon="cake-variant"/>}
|
||||
/>
|
||||
<List.Item
|
||||
title={this.getFieldValue(this.data.phone)}
|
||||
left={props => <List.Icon {...props} icon="phone"/>}
|
||||
/>
|
||||
<List.Item
|
||||
title={this.getFieldValue(this.data.email)}
|
||||
left={props => <List.Icon {...props} icon="email"/>}
|
||||
/>
|
||||
<List.Item
|
||||
title={this.getFieldValue(this.data.branch)}
|
||||
left={props => <List.Icon {...props} icon="school"/>}
|
||||
/>
|
||||
</List.Section>
|
||||
<Divider/>
|
||||
<Card.Actions>
|
||||
<Button
|
||||
icon="account-edit"
|
||||
mode="contained"
|
||||
onPress={() => openBrowser(this.data.link, this.colors.primary)}
|
||||
style={styles.editButton}>
|
||||
EDITER INFOS
|
||||
</Button>
|
||||
</Card.Actions>
|
||||
</Card.Content>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
|
||||
getClubCard() {
|
||||
return (
|
||||
<Card style={styles.card}>
|
||||
<Card.Title
|
||||
title="CLUBS"
|
||||
subtitle="LISTE DE VOS CLUBS"
|
||||
left={(props) => <Avatar.Icon
|
||||
{...props}
|
||||
icon="account-group"
|
||||
color={this.colors.primary}
|
||||
style={styles.icon}
|
||||
/>}
|
||||
/>
|
||||
<Card.Content>
|
||||
<Divider/>
|
||||
{this.getClubList(this.data.clubs)}
|
||||
</Card.Content>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
|
||||
getMembershipCar() {
|
||||
return (
|
||||
<Card style={styles.card}>
|
||||
<Card.Title
|
||||
title="ÉTAT COTISATION"
|
||||
subtitle="CA PERMET D'ETRE COOL"
|
||||
left={(props) => <Avatar.Icon
|
||||
{...props}
|
||||
icon="credit-card"
|
||||
color={this.colors.primary}
|
||||
style={styles.icon}
|
||||
/>}
|
||||
/>
|
||||
<Card.Content>
|
||||
<List.Section>
|
||||
{this.getMembershipItem(this.data.validity)}
|
||||
</List.Section>
|
||||
</Card.Content>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
|
||||
getClubList(list: Array<string>) {
|
||||
let dataset = [];
|
||||
for (let i = 0; i < list.length; i++) {
|
||||
dataset.push({name: list[i]});
|
||||
}
|
||||
return (
|
||||
<FlatList
|
||||
renderItem={({item}) =>
|
||||
<List.Item
|
||||
title={item.name}
|
||||
left={props => <List.Icon {...props} icon="chevron-right"/>}
|
||||
/>
|
||||
}
|
||||
keyExtractor={item => item.name}
|
||||
data={dataset}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
getMembershipItem(state: boolean) {
|
||||
return (
|
||||
<List.Item
|
||||
|
|
|
|||
Loading…
Reference in a new issue