calendar
This commit is contained in:
parent
4d10f614ac
commit
f2e613a081
|
@ -1,409 +1,415 @@
|
||||||
import * as React from 'react';
|
import * as React from "react";
|
||||||
import {View, StyleSheet, Dimensions, Image, ScrollView, Text, Button, TouchableOpacity, Animated} from 'react-native';
|
|
||||||
import {TabView, TabBar, SceneMap} from 'react-native-tab-view';
|
|
||||||
import {
|
import {
|
||||||
RkButton, RkCard, RkText,
|
View,
|
||||||
RkTheme
|
StyleSheet,
|
||||||
} from 'react-native-ui-kitten';
|
Dimensions,
|
||||||
import Timeline from 'react-native-timeline-feed'
|
Image,
|
||||||
|
ScrollView,
|
||||||
|
Text,
|
||||||
|
Button,
|
||||||
|
TouchableOpacity,
|
||||||
|
Animated
|
||||||
|
} from "react-native";
|
||||||
|
import { TabView, TabBar, SceneMap } from "react-native-tab-view";
|
||||||
|
import { RkButton, RkCard, RkText, RkTheme } from "react-native-ui-kitten";
|
||||||
|
import Timeline from "react-native-timeline-feed";
|
||||||
|
|
||||||
import * as Progress from 'react-native-progress';
|
import * as Progress from "react-native-progress";
|
||||||
|
|
||||||
|
import { connect } from "react-redux";
|
||||||
|
|
||||||
import {connect} from 'react-redux';
|
import { bindActionCreators } from "redux";
|
||||||
|
|
||||||
import {bindActionCreators} from 'redux';
|
import * as Actions from "../store/actions"; //Import your actionss
|
||||||
|
|
||||||
import * as Actions from '../store/actions'; //Import your actionss
|
const formatObj = obj => {
|
||||||
|
let a = {};
|
||||||
|
|
||||||
|
a.push({});
|
||||||
|
|
||||||
const formatObj = (obj) => {
|
return a;
|
||||||
|
|
||||||
let a = {};
|
|
||||||
|
|
||||||
a.push({})
|
|
||||||
|
|
||||||
return a
|
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
const ThirdRoute = () => (
|
|
||||||
<View style={[styles.scene, {backgroundColor: '#efc44a'}]}/>
|
|
||||||
);
|
|
||||||
|
|
||||||
|
|
||||||
const FourthRoute = () => (
|
|
||||||
<View style={[styles.scene, {backgroundColor: '#49ef97'}]}/>
|
|
||||||
);
|
|
||||||
|
|
||||||
|
|
||||||
class Calendar extends React.Component {
|
class Calendar extends React.Component {
|
||||||
|
state = {
|
||||||
state = {
|
index: 0,
|
||||||
index: 0,
|
routes: [
|
||||||
routes: [
|
{ key: "first", weekDay: "sex", day: 12 },
|
||||||
{key: 'first', weekDay: 'sex', day:12},
|
{ key: "second", weekDay: "sab", day: 13 },
|
||||||
{key: 'second', weekDay: 'sab',day:13},
|
{ key: "third", weekDay: "dom", day: 14 },
|
||||||
{key: 'third', weekDay: 'dom', day:14},
|
{ key: "fourth", weekDay: "seg", day: 15 }
|
||||||
{key: 'fourth', weekDay: 'seg', day:15},
|
],
|
||||||
|
CP: "SEM",
|
||||||
|
cpColor: "white",
|
||||||
|
careerPath: { name: "", color: "" }
|
||||||
|
};
|
||||||
|
|
||||||
],
|
componentDidMount() {
|
||||||
CP:'SEM',
|
this.props.getEvents(this.props.user);
|
||||||
cpColor:'white',
|
|
||||||
careerPath:{name:'', color:''}
|
|
||||||
};
|
|
||||||
|
|
||||||
componentDidMount() {
|
this.props.getSessions(this.props.userDetails.token);
|
||||||
|
}
|
||||||
|
|
||||||
this.props.getEvents(this.props.user);
|
_openDetails = () => {
|
||||||
|
console.log("los");
|
||||||
|
};
|
||||||
|
|
||||||
this.props.getSessions(this.props.userDetails.token)
|
renderDetail = ({ item, index }) => {
|
||||||
|
const { navigate } = this.props.navigation;
|
||||||
|
// <Image source={{ uri:item.imageUrl, width:'100%' , height:100 }} style={{borderRadius:0}}/>
|
||||||
}
|
return (
|
||||||
|
<TouchableOpacity
|
||||||
_openDetails=()=>{
|
onPress={() => navigate("calendarDetail", { info: item })}
|
||||||
|
>
|
||||||
console.log("los");
|
<View style={styles.event}>
|
||||||
}
|
<View style={styles.titleContainer}>
|
||||||
|
<Text style={[styles.title]}>{item.name}</Text>
|
||||||
renderDetail = ({item, index}) => {
|
<Text style={{ color: "black" }}>Local: 1</Text>
|
||||||
const {navigate} = this.props.navigation;
|
|
||||||
// <Image source={{ uri:item.imageUrl, width:'100%' , height:100 }} style={{borderRadius:0}}/>
|
|
||||||
return (
|
|
||||||
<TouchableOpacity onPress={() => navigate('calendarDetail', { info: item })} >
|
|
||||||
|
|
||||||
<View style={styles.event}>
|
|
||||||
<View style={styles.titleContainer}>
|
|
||||||
<Text style={[styles.title]}>{item.name}</Text>
|
|
||||||
<Text style={{color:'black'}}>Local: 1</Text>
|
|
||||||
</View>
|
|
||||||
|
|
||||||
<View>
|
|
||||||
|
|
||||||
|
|
||||||
<Text style={styles.description}>{item.description}</Text>
|
|
||||||
<View style={styles.details}>
|
|
||||||
<Progress.Bar color={'#000000'} progress={item.Enrolled/item.MaxAttendees} unfilledColor={'white'} width={210}/>
|
|
||||||
<Text>{item.Enrolled} / {item.MaxAttendees}</Text>
|
|
||||||
</View>
|
|
||||||
|
|
||||||
</View>
|
|
||||||
|
|
||||||
</View>
|
|
||||||
</TouchableOpacity>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
_update = () => {
|
|
||||||
this.setState({user: this.props.user});
|
|
||||||
console.log(this.props.events);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
_renderTabBar = props => {
|
|
||||||
const inputRange = props.navigationState.routes.map((x, i) => i);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<View style={styles.tabBar}>
|
|
||||||
{props.navigationState.routes.map((route, i) => {
|
|
||||||
const bgcolor = props.position.interpolate({
|
|
||||||
inputRange,
|
|
||||||
outputRange: inputRange.map(
|
|
||||||
inputIndex => (inputIndex === i ? '#CC1A17' : 'rgba(0,0,0,0)')
|
|
||||||
),
|
|
||||||
});
|
|
||||||
const color = props.position.interpolate({
|
|
||||||
inputRange,
|
|
||||||
outputRange: inputRange.map(
|
|
||||||
inputIndex => (inputIndex === i ? 'white' : 'black')
|
|
||||||
),
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
return (
|
|
||||||
<TouchableOpacity
|
|
||||||
style={styles.tabItem}
|
|
||||||
onPress={() => this.setState({ index: i })}>
|
|
||||||
|
|
||||||
<Animated.Text style={{ color :'#7A7B7B' }}>{route.weekDay}</Animated.Text>
|
|
||||||
<Animated.Text style={{ backgroundColor: bgcolor, borderRadius:90 , padding:10, marginTop:5, color:color, fontSize:15}}>{route.day}</Animated.Text>
|
|
||||||
|
|
||||||
</TouchableOpacity>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</View>
|
</View>
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
|
<View>
|
||||||
|
<Text style={styles.description}>{item.description}</Text>
|
||||||
constructor() {
|
<View style={styles.details}>
|
||||||
|
<Progress.Bar
|
||||||
super()
|
color={"#000000"}
|
||||||
|
progress={item.Enrolled / item.MaxAttendees}
|
||||||
const archeryImgSource = require('../assets/img/archery.png');
|
unfilledColor={"white"}
|
||||||
const badmintonImgSource = require('../assets/img/badminton.png');
|
width={210}
|
||||||
const lunchImgSource = require('../assets/img/lunch.png');
|
/>
|
||||||
const soccerImgSource = require('../assets/img/soccer.png');
|
<Text>
|
||||||
const dumbbellImgSource = require('../assets/img/dumbbell.png');
|
{item.Enrolled} / {item.MaxAttendees}
|
||||||
|
</Text>
|
||||||
const ArcheryImage = (props) => <Image source={archeryImgSource} {...props} />;
|
|
||||||
const BadmintonImage = (props) => <Image source={badmintonImgSource} {...props} />;
|
|
||||||
const LunchImage = (props) => <Image source={lunchImgSource} {...props} />;
|
|
||||||
const SoccerImage = (props) => <Image source={soccerImgSource} {...props} />;
|
|
||||||
const DumbbellImage = (props) => <Image source={dumbbellImgSource} {...props} />;
|
|
||||||
const VectorIconImage = (props) => <Image source={vectorIconImgSource} {...props} />;
|
|
||||||
|
|
||||||
this.data = [
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
]
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
|
||||||
|
|
||||||
const FirstRoute = () => (
|
|
||||||
|
|
||||||
<ScrollView contentContainerStyle={styles.contentContainer}>
|
|
||||||
|
|
||||||
<Timeline
|
|
||||||
|
|
||||||
data={this.props.events}
|
|
||||||
|
|
||||||
timeContainerStyle={{ marginTop: 0}}
|
|
||||||
|
|
||||||
timeStyle={{
|
|
||||||
|
|
||||||
textAlign: 'center',
|
|
||||||
// backgroundColor: 'red',
|
|
||||||
|
|
||||||
height:100,
|
|
||||||
color:"#CC1A17",
|
|
||||||
padding: 5,
|
|
||||||
//marginTop:10,
|
|
||||||
// fontWeight:'bold',
|
|
||||||
fontSize:23,
|
|
||||||
|
|
||||||
//borderRadius: 13
|
|
||||||
}}
|
|
||||||
|
|
||||||
descriptionStyle={{color: 'red'}}
|
|
||||||
|
|
||||||
renderDetail={this.renderDetail}
|
|
||||||
|
|
||||||
lineColor='rgba(0,0,0,0)'
|
|
||||||
lineWidth={1}
|
|
||||||
separator={false}
|
|
||||||
flatListProps={{
|
|
||||||
style: {
|
|
||||||
|
|
||||||
margin: 15
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
}}
|
|
||||||
circleSize={0}
|
|
||||||
dotColor={'#CC1A17'}
|
|
||||||
keyExtractor={(item, index) => index.toString()}
|
|
||||||
|
|
||||||
|
|
||||||
/>
|
|
||||||
|
|
||||||
|
|
||||||
</ScrollView>
|
|
||||||
|
|
||||||
)
|
|
||||||
const SecondRoute = () => (
|
|
||||||
|
|
||||||
<ScrollView contentContainerStyle={styles.contentContainer}>
|
|
||||||
|
|
||||||
<Timeline
|
|
||||||
|
|
||||||
data={this.props.events}
|
|
||||||
|
|
||||||
timeContainerStyle={{ marginTop: 0}}
|
|
||||||
|
|
||||||
timeStyle={{
|
|
||||||
|
|
||||||
textAlign: 'center',
|
|
||||||
// backgroundColor: 'red',
|
|
||||||
|
|
||||||
height:100,
|
|
||||||
color:"#CC1A17",
|
|
||||||
padding: 5,
|
|
||||||
//marginTop:10,
|
|
||||||
// fontWeight:'bold',
|
|
||||||
fontSize:23,
|
|
||||||
|
|
||||||
//borderRadius: 13
|
|
||||||
}}
|
|
||||||
|
|
||||||
descriptionStyle={{color: 'red'}}
|
|
||||||
|
|
||||||
renderDetail={this.renderDetail}
|
|
||||||
|
|
||||||
lineColor='rgba(0,0,0,0)'
|
|
||||||
lineWidth={1}
|
|
||||||
separator={false}
|
|
||||||
flatListProps={{
|
|
||||||
style: {
|
|
||||||
|
|
||||||
margin: 15
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
}}
|
|
||||||
keyExtractor={(item, index) => index.toString()}
|
|
||||||
|
|
||||||
|
|
||||||
/>
|
|
||||||
|
|
||||||
|
|
||||||
</ScrollView>
|
|
||||||
|
|
||||||
)
|
|
||||||
|
|
||||||
|
|
||||||
return (
|
|
||||||
<View style={{flex:1}}>
|
|
||||||
<View>
|
|
||||||
{ this.props.careerPath!=undefined &&
|
|
||||||
<Text style={{
|
|
||||||
backgroundColor:this.props.careerPath.color,
|
|
||||||
color:'white',
|
|
||||||
fontWeight:'bold',
|
|
||||||
fontSize:15,
|
|
||||||
textAlign:'center',
|
|
||||||
|
|
||||||
}}>{this.props.careerPath.name}
|
|
||||||
</Text>
|
|
||||||
}
|
|
||||||
</View>
|
|
||||||
<TabView
|
|
||||||
navigationState={this.state}
|
|
||||||
renderScene={SceneMap({
|
|
||||||
first: FirstRoute,
|
|
||||||
second: SecondRoute,
|
|
||||||
third: ThirdRoute,
|
|
||||||
fourth: FourthRoute
|
|
||||||
})}
|
|
||||||
renderTabBar={this._renderTabBar}
|
|
||||||
useNativeDriver={true}
|
|
||||||
onIndexChange={index => this.setState({index})}
|
|
||||||
initialLayout={{width: Dimensions.get('window').width, height: Dimensions.get('window').height}}
|
|
||||||
style={{backgroundColor:"#F2F2F2"}}
|
|
||||||
indicatorStyle={{ backgroundColor: 'pink' }}
|
|
||||||
/>
|
|
||||||
</View>
|
</View>
|
||||||
);
|
</View>
|
||||||
}
|
</View>
|
||||||
|
</TouchableOpacity>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
_update = () => {
|
||||||
|
this.setState({ user: this.props.user });
|
||||||
|
console.log(this.props.events);
|
||||||
|
};
|
||||||
|
|
||||||
|
_renderTabBar = props => {
|
||||||
|
const inputRange = props.navigationState.routes.map((x, i) => i);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<View style={styles.tabBar}>
|
||||||
|
{props.navigationState.routes.map((route, i) => {
|
||||||
|
const bgcolor = props.position.interpolate({
|
||||||
|
inputRange,
|
||||||
|
outputRange: inputRange.map(inputIndex =>
|
||||||
|
inputIndex === i ? "#CC1A17" : "rgba(0,0,0,0)"
|
||||||
|
)
|
||||||
|
});
|
||||||
|
const color = props.position.interpolate({
|
||||||
|
inputRange,
|
||||||
|
outputRange: inputRange.map(inputIndex =>
|
||||||
|
inputIndex === i ? "white" : "black"
|
||||||
|
)
|
||||||
|
});
|
||||||
|
|
||||||
|
return (
|
||||||
|
<TouchableOpacity
|
||||||
|
style={styles.tabItem}
|
||||||
|
onPress={() => this.setState({ index: i })}
|
||||||
|
>
|
||||||
|
<Text style={{ color: "#7A7B7B" }}>
|
||||||
|
{route.weekDay}
|
||||||
|
</Text>
|
||||||
|
<Animated.Text
|
||||||
|
style={{
|
||||||
|
backgroundColor: bgcolor,
|
||||||
|
borderRadius: 0,
|
||||||
|
padding: 10,
|
||||||
|
marginTop: 5,
|
||||||
|
color: color,
|
||||||
|
fontSize: 15
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{route.day}
|
||||||
|
</Animated.Text>
|
||||||
|
</TouchableOpacity>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
super();
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const ThirdRoute = () => (
|
||||||
|
<ScrollView contentContainerStyle={styles.contentContainer}>
|
||||||
|
{this.props.events != undefined && (
|
||||||
|
<Timeline
|
||||||
|
data={this.props.c}
|
||||||
|
timeContainerStyle={{ marginTop: 0 }}
|
||||||
|
timeStyle={{
|
||||||
|
textAlign: "center",
|
||||||
|
height: 100,
|
||||||
|
color: "#CC1A17",
|
||||||
|
padding: 5,
|
||||||
|
fontSize: 23
|
||||||
|
}}
|
||||||
|
descriptionStyle={{ color: "red" }}
|
||||||
|
renderDetail={this.renderDetail}
|
||||||
|
lineColor="rgba(0,0,0,0)"
|
||||||
|
lineWidth={1}
|
||||||
|
separator={false}
|
||||||
|
flatListProps={{
|
||||||
|
style: {
|
||||||
|
margin: 15
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
circleSize={0}
|
||||||
|
dotColor={"#CC1A17"}
|
||||||
|
keyExtractor={(item, index) => index.toString()}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</ScrollView>
|
||||||
|
);
|
||||||
|
|
||||||
|
const FourthRoute = () => (
|
||||||
|
<ScrollView contentContainerStyle={styles.contentContainer}>
|
||||||
|
{this.props.events != undefined && (
|
||||||
|
<Timeline
|
||||||
|
data={this.props.d}
|
||||||
|
timeContainerStyle={{ marginTop: 0 }}
|
||||||
|
timeStyle={{
|
||||||
|
textAlign: "center",
|
||||||
|
// backgroundColor: 'red',
|
||||||
|
|
||||||
|
height: 100,
|
||||||
|
color: "#CC1A17",
|
||||||
|
padding: 5,
|
||||||
|
//marginTop:10,
|
||||||
|
// fontWeight:'bold',
|
||||||
|
fontSize: 23
|
||||||
|
|
||||||
|
//borderRadius: 13
|
||||||
|
}}
|
||||||
|
descriptionStyle={{ color: "red" }}
|
||||||
|
renderDetail={this.renderDetail}
|
||||||
|
lineColor="rgba(0,0,0,0)"
|
||||||
|
lineWidth={1}
|
||||||
|
separator={false}
|
||||||
|
flatListProps={{
|
||||||
|
style: {
|
||||||
|
margin: 15
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
circleSize={0}
|
||||||
|
dotColor={"#CC1A17"}
|
||||||
|
keyExtractor={(item, index) => index.toString()}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</ScrollView>
|
||||||
|
);
|
||||||
|
const FirstRoute = () => (
|
||||||
|
<ScrollView contentContainerStyle={styles.contentContainer}>
|
||||||
|
{this.props.events != undefined && (
|
||||||
|
<Timeline
|
||||||
|
data={this.props.a}
|
||||||
|
timeContainerStyle={{ marginTop: 0 }}
|
||||||
|
timeStyle={{
|
||||||
|
textAlign: "center",
|
||||||
|
height: 100,
|
||||||
|
color: "#CC1A17",
|
||||||
|
padding: 5,
|
||||||
|
fontSize: 23
|
||||||
|
}}
|
||||||
|
descriptionStyle={{ color: "red" }}
|
||||||
|
renderDetail={this.renderDetail}
|
||||||
|
lineColor="rgba(0,0,0,0)"
|
||||||
|
lineWidth={1}
|
||||||
|
separator={false}
|
||||||
|
flatListProps={{
|
||||||
|
style: {
|
||||||
|
margin: 15
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
circleSize={0}
|
||||||
|
dotColor={"#CC1A17"}
|
||||||
|
keyExtractor={(item, index) => index.toString()}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</ScrollView>
|
||||||
|
);
|
||||||
|
const SecondRoute = () => (
|
||||||
|
<ScrollView contentContainerStyle={styles.contentContainer}>
|
||||||
|
{this.props.events != undefined && (
|
||||||
|
<Timeline
|
||||||
|
data={this.props.b}
|
||||||
|
timeContainerStyle={{ marginTop: 0 }}
|
||||||
|
timeStyle={{
|
||||||
|
textAlign: "center",
|
||||||
|
|
||||||
|
height: 100,
|
||||||
|
color: "#CC1A17",
|
||||||
|
padding: 5,
|
||||||
|
|
||||||
|
fontSize: 23
|
||||||
|
|
||||||
|
//borderRadius: 13
|
||||||
|
}}
|
||||||
|
descriptionStyle={{ color: "red" }}
|
||||||
|
renderDetail={this.renderDetail}
|
||||||
|
lineColor="rgba(0,0,0,0)"
|
||||||
|
lineWidth={1}
|
||||||
|
separator={false}
|
||||||
|
flatListProps={{
|
||||||
|
style: {
|
||||||
|
margin: 15
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
circleSize={0}
|
||||||
|
dotColor={"#CC1A17"}
|
||||||
|
keyExtractor={(item, index) => index.toString()}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</ScrollView>
|
||||||
|
);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<View style={{ flex: 1 }}>
|
||||||
|
<View>
|
||||||
|
{this.props.careerPath != undefined && (
|
||||||
|
<Text
|
||||||
|
style={{
|
||||||
|
backgroundColor: this.props.careerPath.color,
|
||||||
|
color: "white",
|
||||||
|
fontWeight: "bold",
|
||||||
|
fontSize: 15,
|
||||||
|
textAlign: "center",
|
||||||
|
padding:15
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{this.props.careerPath.name}
|
||||||
|
</Text>
|
||||||
|
)}
|
||||||
|
</View>
|
||||||
|
<TabView
|
||||||
|
navigationState={this.state}
|
||||||
|
renderScene={SceneMap({
|
||||||
|
first: FirstRoute,
|
||||||
|
second: SecondRoute,
|
||||||
|
third: ThirdRoute,
|
||||||
|
fourth: FourthRoute
|
||||||
|
})}
|
||||||
|
renderTabBar={this._renderTabBar}
|
||||||
|
useNativeDriver={false}
|
||||||
|
onIndexChange={index => this.setState({ index })}
|
||||||
|
initialLayout={{
|
||||||
|
width: Dimensions.get("window").width,
|
||||||
|
height: Dimensions.get("window").height
|
||||||
|
}}
|
||||||
|
style={{ backgroundColor: "#F2F2F2" }}
|
||||||
|
indicatorStyle={{ backgroundColor: "pink" }}
|
||||||
|
/>
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const styles = StyleSheet.create({
|
const styles = StyleSheet.create({
|
||||||
tabBar: {
|
tabBar: {
|
||||||
flexDirection: 'row',
|
flexDirection: "row",
|
||||||
paddingTop:0,
|
paddingTop: 0,
|
||||||
marginTop:0,
|
marginTop: 0,
|
||||||
backgroundColor:'white',
|
backgroundColor: "white",
|
||||||
borderWidth: 1,
|
borderWidth: 1,
|
||||||
borderRadius: 2,
|
borderRadius: 2,
|
||||||
borderColor: '#ddd',
|
borderColor: "#ddd",
|
||||||
borderBottomWidth: 0,
|
borderBottomWidth: 0,
|
||||||
shadowColor: '#000',
|
shadowColor: "#000",
|
||||||
shadowOffset: { width: 0, height: 2 },
|
shadowOffset: { width: 0, height: 2 },
|
||||||
shadowOpacity: 0.8,
|
shadowOpacity: 0.8,
|
||||||
shadowRadius: 2,
|
shadowRadius: 2,
|
||||||
elevation: 2,
|
elevation: 2
|
||||||
|
},
|
||||||
|
tabItem: {
|
||||||
},
|
flex: 1,
|
||||||
tabItem: {
|
alignItems: "center",
|
||||||
flex: 1,
|
padding: 10
|
||||||
alignItems: 'center',
|
},
|
||||||
padding: 10,
|
details: {
|
||||||
},
|
backgroundColor: "#FFFFFF",
|
||||||
details: {
|
borderBottomRightRadius: 10,
|
||||||
backgroundColor: "#FFFFFF",
|
borderBottomLeftRadius: 10,
|
||||||
borderBottomRightRadius: 10,
|
padding: 10,
|
||||||
borderBottomLeftRadius: 10,
|
paddingTop: 0
|
||||||
padding: 10,
|
},
|
||||||
paddingTop:0
|
description: {
|
||||||
|
padding: 10,
|
||||||
},
|
paddingLeft: 0,
|
||||||
description: {
|
paddingTop: 0
|
||||||
padding: 10,
|
},
|
||||||
paddingLeft:0,
|
title: {
|
||||||
paddingTop:0
|
color: "#212121",
|
||||||
|
fontWeight: "bold",
|
||||||
},
|
fontSize: 15
|
||||||
title: {
|
},
|
||||||
color: '#212121',
|
titleContainer: {
|
||||||
fontWeight: 'bold',
|
padding: 10
|
||||||
fontSize: 15,
|
},
|
||||||
|
event: {
|
||||||
},
|
borderRadius: 5,
|
||||||
titleContainer:{
|
backgroundColor: "#FFFFFF",
|
||||||
padding: 10
|
marginLeft: -25,
|
||||||
},
|
|
||||||
event: {
|
|
||||||
borderRadius: 5,
|
|
||||||
backgroundColor: "#FFFFFF",
|
|
||||||
marginLeft:-25,
|
|
||||||
|
|
||||||
shadowColor: "#000",
|
shadowColor: "#000",
|
||||||
shadowOffset: { width: 0, height: 2,},
|
shadowOffset: { width: 0, height: 2 },
|
||||||
shadowOpacity: 0.25,
|
shadowOpacity: 0.25,
|
||||||
shadowRadius: 1,
|
shadowRadius: 1,
|
||||||
elevation: 2,
|
elevation: 2,
|
||||||
marginRight:2
|
marginRight: 2
|
||||||
|
},
|
||||||
|
scene: {
|
||||||
},
|
flex: 1
|
||||||
scene: {
|
},
|
||||||
flex: 1,
|
contentContainer: {
|
||||||
},
|
//paddingVertical: 20,
|
||||||
contentContainer: {
|
backgroundColor: "#F2F2F2"
|
||||||
//paddingVertical: 20,
|
}
|
||||||
backgroundColor:'#F2F2F2'
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
RkTheme.setType('RkCard', 'story', {
|
RkTheme.setType("RkCard", "story", {
|
||||||
img: {
|
img: {
|
||||||
height: 100,
|
height: 100,
|
||||||
opacity: 0.7
|
opacity: 0.7
|
||||||
},
|
},
|
||||||
header: {
|
header: {
|
||||||
alignSelf: 'center'
|
alignSelf: "center"
|
||||||
},
|
},
|
||||||
content: {
|
content: {
|
||||||
alignSelf: 'center'
|
alignSelf: "center"
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
function mapStateToProps(state, props) {
|
function mapStateToProps(state, props) {
|
||||||
|
return {
|
||||||
return {
|
token: state.apiReducer.token,
|
||||||
|
user: state.apiReducer.user,
|
||||||
token: state.apiReducer.token,
|
logged: state.apiReducer.logged,
|
||||||
user: state.apiReducer.user,
|
events: state.apiReducer.events,
|
||||||
logged: state.apiReducer.logged,
|
userDetails: state.apiReducer.userDetails,
|
||||||
events: state.apiReducer.events,
|
sessions: state.apiReducer.sessions,
|
||||||
userDetails: state.apiReducer.userDetails,
|
careerPath: state.apiReducer.careerPath,
|
||||||
sessions: state.apiReducer.sessions,
|
a: state.apiReducer.a,
|
||||||
careerPath: state.apiReducer.careerPath
|
b: state.apiReducer.b,
|
||||||
|
c: state.apiReducer.c,
|
||||||
}
|
d: state.apiReducer.d
|
||||||
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
function mapDispatchToProps(dispatch) {
|
function mapDispatchToProps(dispatch) {
|
||||||
|
return bindActionCreators(Actions, dispatch);
|
||||||
return bindActionCreators(Actions, dispatch);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export default connect(mapStateToProps, mapDispatchToProps)(Calendar);
|
export default connect(
|
||||||
|
mapStateToProps,
|
||||||
|
mapDispatchToProps
|
||||||
|
)(Calendar);
|
||||||
|
|
|
@ -287,9 +287,8 @@ class choosePath extends React.Component {
|
||||||
</Picker>
|
</Picker>
|
||||||
</View>
|
</View>
|
||||||
<View style={{ width: SCREEN_WIDTH }}>
|
<View style={{ width: SCREEN_WIDTH }}>
|
||||||
{ this.state.guest==0 && <View><Text>chosse one</Text><View>}
|
|
||||||
|
{!this.props.changingGuest && (
|
||||||
{!this.props.changingGuest && this.state.guest!=0 && (
|
|
||||||
<FlatList
|
<FlatList
|
||||||
data={this.props.Blocks}
|
data={this.props.Blocks}
|
||||||
renderItem={({ item, index }) => (
|
renderItem={({ item, index }) => (
|
||||||
|
|
|
@ -424,9 +424,10 @@ export function getEvents(user) {
|
||||||
return dispatch => {
|
return dispatch => {
|
||||||
let events = [];
|
let events = [];
|
||||||
console.log("chegou aqui");
|
console.log("chegou aqui");
|
||||||
|
var i=0
|
||||||
for (let key in user.Sessions) {
|
for (let key in user.Sessions) {
|
||||||
events.push({
|
events.push({
|
||||||
|
key:i++,
|
||||||
time: moment(user.Sessions[key].SessionStart).format("HH:mm"),
|
time: moment(user.Sessions[key].SessionStart).format("HH:mm"),
|
||||||
timeEnd: moment(user.Sessions[key].SessionEnd).format("HH:mm"),
|
timeEnd: moment(user.Sessions[key].SessionEnd).format("HH:mm"),
|
||||||
//lineColor:'#009688',
|
//lineColor:'#009688',
|
||||||
|
@ -435,13 +436,87 @@ export function getEvents(user) {
|
||||||
description: user.Sessions[key].Description,
|
description: user.Sessions[key].Description,
|
||||||
name: user.Sessions[key].Name,
|
name: user.Sessions[key].Name,
|
||||||
Enrolled: user.Sessions[key].Enrolled,
|
Enrolled: user.Sessions[key].Enrolled,
|
||||||
MaxAttendees: user.Sessions[key].MaxAttendees
|
MaxAttendees: user.Sessions[key].MaxAttendees,
|
||||||
|
day: moment(user.Sessions[key].SessionStart).format("DD")
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
const result = flow(
|
||||||
|
groupBy("day")
|
||||||
|
|
||||||
|
)(events);
|
||||||
|
|
||||||
|
|
||||||
|
var cenas=[];
|
||||||
|
for (let key in result) {
|
||||||
|
cenas.push(result[key]);
|
||||||
|
console.log();
|
||||||
|
}
|
||||||
|
console.log(".--------")
|
||||||
|
console.log(cenas);
|
||||||
|
console.log(".--------")
|
||||||
|
|
||||||
|
var a=[], b=[],c=[],d=[]
|
||||||
|
|
||||||
|
for (let key in cenas[0]) {
|
||||||
|
a.push({
|
||||||
|
time:cenas[0][key].time ,
|
||||||
|
timeEnd: cenas[0][key].timeEnd,
|
||||||
|
imageUrl:cenas[0][key].imageUrl,
|
||||||
|
description: cenas[0][key].description,
|
||||||
|
name:cenas[0][key].name,
|
||||||
|
Enrolled: cenas[0][key].Enrolled,
|
||||||
|
MaxAttendees: cenas[0][key].MaxAttendees,
|
||||||
|
day: cenas[0][key].day
|
||||||
|
});
|
||||||
|
}
|
||||||
|
for (let key in cenas[1]) {
|
||||||
|
b.push({
|
||||||
|
time:cenas[1][key].time ,
|
||||||
|
timeEnd: cenas[1][key].timeEnd,
|
||||||
|
imageUrl:cenas[1][key].imageUrl,
|
||||||
|
description: cenas[1][key].description,
|
||||||
|
name:cenas[1][key].name,
|
||||||
|
Enrolled: cenas[1][key].Enrolled,
|
||||||
|
MaxAttendees: cenas[1][key].MaxAttendees,
|
||||||
|
day: cenas[1][key].day
|
||||||
|
});
|
||||||
|
}
|
||||||
|
for (let key in cenas[2]) {
|
||||||
|
c.push({
|
||||||
|
time:cenas[2][key].time ,
|
||||||
|
timeEnd: cenas[2][key].timeEnd,
|
||||||
|
imageUrl:cenas[2][key].imageUrl,
|
||||||
|
description: cenas[2][key].description,
|
||||||
|
name:cenas[2][key].name,
|
||||||
|
Enrolled: cenas[2][key].Enrolled,
|
||||||
|
MaxAttendees: cenas[2][key].MaxAttendees,
|
||||||
|
day: cenas[2][key].day
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
for (let key in cenas[3]) {
|
||||||
|
d.push({
|
||||||
|
time:cenas[3][key].time ,
|
||||||
|
timeEnd: cenas[3][key].timeEnd,
|
||||||
|
imageUrl:cenas[3][key].imageUrl,
|
||||||
|
description: cenas[3][key].description,
|
||||||
|
name:cenas[3][key].name,
|
||||||
|
Enrolled: cenas[3][key].Enrolled,
|
||||||
|
MaxAttendees: cenas[3][key].MaxAttendees,
|
||||||
|
day: cenas[3][key].day
|
||||||
|
});
|
||||||
|
}
|
||||||
dispatch({
|
dispatch({
|
||||||
|
|
||||||
type: GET_EVENTS,
|
type: GET_EVENTS,
|
||||||
events: events
|
events:a,
|
||||||
|
day1:a,
|
||||||
|
day2:b,
|
||||||
|
day3:c,
|
||||||
|
day4:d
|
||||||
|
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
|
@ -40,6 +40,10 @@ let apiState = {
|
||||||
Blocks: {},
|
Blocks: {},
|
||||||
onHoldBlocks: true,
|
onHoldBlocks: true,
|
||||||
careerPath:{name:'Sem Career Path', color:'#eeeeee'},
|
careerPath:{name:'Sem Career Path', color:'#eeeeee'},
|
||||||
|
a:{},
|
||||||
|
b:{},
|
||||||
|
c:{},
|
||||||
|
d:{}
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -138,7 +142,7 @@ const apiReducer = (state = apiState, action) => {
|
||||||
return state;
|
return state;
|
||||||
|
|
||||||
case GET_EVENTS:
|
case GET_EVENTS:
|
||||||
state = Object.assign({}, state, { events: action.events });
|
state = Object.assign({}, state, { events: action.events , a:action.day1, b:action.day2, c:action.day3, d:action.day4});
|
||||||
|
|
||||||
return state;
|
return state;
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue