|
@@ -1,8 +1,8 @@
|
1
|
1
|
// @flow
|
2
|
2
|
|
3
|
3
|
import * as React from 'react';
|
4
|
|
-import {ScrollView, StyleSheet} from "react-native";
|
5
|
|
-import {Avatar, Card, Paragraph, withTheme} from 'react-native-paper';
|
|
4
|
+import {FlatList, StyleSheet} from "react-native";
|
|
5
|
+import {Avatar, Button, Card, Paragraph, RadioButton, withTheme} from 'react-native-paper';
|
6
|
6
|
import AuthenticatedScreen from "../../components/Amicale/AuthenticatedScreen";
|
7
|
7
|
import {stringToDate} from "../../utils/Planning";
|
8
|
8
|
|
|
@@ -37,11 +37,15 @@ const FAKE_TEAMS = {
|
37
|
37
|
],
|
38
|
38
|
};
|
39
|
39
|
|
40
|
|
-type State = {}
|
|
40
|
+type State = {
|
|
41
|
+ selectedTeam: string,
|
|
42
|
+}
|
41
|
43
|
|
42
|
44
|
class VoteScreen extends React.Component<Props, State> {
|
43
|
45
|
|
44
|
|
- state = {};
|
|
46
|
+ state = {
|
|
47
|
+ selectedTeam: "0",
|
|
48
|
+ };
|
45
|
49
|
|
46
|
50
|
colors: Object;
|
47
|
51
|
|
|
@@ -52,14 +56,30 @@ class VoteScreen extends React.Component<Props, State> {
|
52
|
56
|
|
53
|
57
|
today: Date;
|
54
|
58
|
|
|
59
|
+ mainFlatListData: Array<Object>;
|
|
60
|
+
|
55
|
61
|
constructor(props) {
|
56
|
62
|
super(props);
|
57
|
63
|
this.colors = props.theme.colors;
|
58
|
64
|
this.hasVoted = false;
|
59
|
65
|
this.teams = null;
|
60
|
66
|
this.today = new Date();
|
|
67
|
+
|
|
68
|
+ this.mainFlatListData = [
|
|
69
|
+ {key: 'main'},
|
|
70
|
+ {key: 'info'},
|
|
71
|
+ ]
|
61
|
72
|
}
|
62
|
73
|
|
|
74
|
+ mainRenderItem = ({item}: Object) => {
|
|
75
|
+ if (item.key === 'info')
|
|
76
|
+ return this.getTitleCard();
|
|
77
|
+ else if (item.key === 'main' && this.isVoteAvailable())
|
|
78
|
+ return this.getContent();
|
|
79
|
+ else
|
|
80
|
+ return null;
|
|
81
|
+ };
|
|
82
|
+
|
63
|
83
|
getScreen = (data: Array<Object>) => {
|
64
|
84
|
data[0] = FAKE_TEAMS;
|
65
|
85
|
data[1] = FAKE_DATE;
|
|
@@ -72,16 +92,12 @@ class VoteScreen extends React.Component<Props, State> {
|
72
|
92
|
this.generateDateObject();
|
73
|
93
|
console.log(this.teams);
|
74
|
94
|
console.log(this.datesString);
|
75
|
|
- console.log(this.dates);
|
76
|
95
|
return (
|
77
|
|
- <ScrollView>
|
78
|
|
- {
|
79
|
|
- this.isVoteAvailable()
|
80
|
|
- ? this.getContent()
|
81
|
|
- : null
|
82
|
|
- }
|
83
|
|
- {this.getTitleCard()}
|
84
|
|
- </ScrollView>
|
|
96
|
+ <FlatList
|
|
97
|
+ data={this.mainFlatListData}
|
|
98
|
+ extraData={this.state.selectedTeam}
|
|
99
|
+ renderItem={this.mainRenderItem}
|
|
100
|
+ />
|
85
|
101
|
);
|
86
|
102
|
};
|
87
|
103
|
|
|
@@ -156,6 +172,14 @@ class VoteScreen extends React.Component<Props, State> {
|
156
|
172
|
);
|
157
|
173
|
}
|
158
|
174
|
|
|
175
|
+ onVoteSelectionChange = (team: string) => {
|
|
176
|
+ this.setState({selectedTeam: team})
|
|
177
|
+ };
|
|
178
|
+
|
|
179
|
+ onVotePress = () => {
|
|
180
|
+ console.log("vote sent");
|
|
181
|
+ };
|
|
182
|
+
|
159
|
183
|
/**
|
160
|
184
|
* The user has not voted yet, and the votes are open
|
161
|
185
|
*/
|
|
@@ -163,17 +187,45 @@ class VoteScreen extends React.Component<Props, State> {
|
163
|
187
|
return (
|
164
|
188
|
<Card style={styles.card}>
|
165
|
189
|
<Card.Title
|
166
|
|
- title={"getVoteCard"}
|
167
|
|
- subtitle={"getVoteCard"}
|
|
190
|
+ title={"VOTE OPEN"}
|
|
191
|
+ subtitle={"VOTE NOW"}
|
|
192
|
+ left={(props) => <Avatar.Icon
|
|
193
|
+ {...props}
|
|
194
|
+ icon={"alert-decagram"}
|
|
195
|
+ />}
|
168
|
196
|
/>
|
169
|
197
|
<Card.Content>
|
170
|
|
- <Paragraph>TEAM1</Paragraph>
|
171
|
|
- <Paragraph>TEAM2</Paragraph>
|
|
198
|
+ <RadioButton.Group
|
|
199
|
+ onValueChange={this.onVoteSelectionChange}
|
|
200
|
+ value={this.state.selectedTeam}
|
|
201
|
+ >
|
|
202
|
+ <FlatList
|
|
203
|
+ data={this.teams}
|
|
204
|
+ keyExtractor={this.voteKeyExtractor}
|
|
205
|
+ extraData={this.state.selectedTeam}
|
|
206
|
+ renderItem={this.voteRenderItem}
|
|
207
|
+ />
|
|
208
|
+ </RadioButton.Group>
|
172
|
209
|
</Card.Content>
|
|
210
|
+ <Card.Actions>
|
|
211
|
+ <Button
|
|
212
|
+ icon="send"
|
|
213
|
+ mode="contained"
|
|
214
|
+ onPress={this.onVotePress}
|
|
215
|
+ style={{marginLeft: 'auto'}}>
|
|
216
|
+ SEND VOTE
|
|
217
|
+ </Button>
|
|
218
|
+ </Card.Actions>
|
173
|
219
|
</Card>
|
174
|
220
|
);
|
175
|
221
|
}
|
176
|
222
|
|
|
223
|
+ voteKeyExtractor = (item: Object) => item.id.toString();
|
|
224
|
+
|
|
225
|
+ voteRenderItem = ({item}: Object) => {
|
|
226
|
+ return <RadioButton.Item label={item.name} value={item.id.toString()}/>
|
|
227
|
+ };
|
|
228
|
+
|
177
|
229
|
/**
|
178
|
230
|
* Votes have ended, results can be displayed
|
179
|
231
|
*/
|