import React, { Component } from 'react';
import {StyleSheet,View} from 'react-native';
import CalendarPicker from 'react-native-calendar-picker';


export default class Calendario extends Component {
  constructor(props) {
    super(props);
    this.state = {
      selectedStartDate: null,
      interpreter_id : this.props.route.params.Intereprete_id,
      mapflag : this.props.route.params.Flag,
      i_token: this.props.route.params.I_Token,
      u_token: this.props.route.params.U_Token
    };
    this.onDateChange = this.onDateChange.bind(this);
    
  }

  onDateChange(date) {
    this.setState({
      selectedStartDate: date,
    });
    console.log(date)
    console.log(this.props.route.params.Flag)
    
    if(this.state.mapflag == false){
      this.props.navigation.navigate('StateTime', {Appointment_Date: date._d, int_id : this.state.interpreter_id, Flag: this.state.mapflag, I_Token: this.state.i_token, U_Token: this.state.u_token});
    }
    else{
      this.props.navigation.navigate('Map', {Appointment_Date: date._d, int_id : this.state.interpreter_id, Flag: this.state.mapflag, I_Token: this.state.i_token, U_Token: this.state.u_token});
    }
  }
  
  render() {
    const { selectedStartDate } = this.state;
    const today = new Date();
    console.log(today)
    const appointment = selectedStartDate ? selectedStartDate.toString() : '';
    console.log(this.props.route.params)
    return (
      <View style = {styles.container}>
        <CalendarPicker
          minDate={today}
          onDateChange={this.onDateChange}
          selectionMode="singleDay"
          scrollMode="oneMonth"
          monthsAfter={24}
          
        />
        
        </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#FFFFFF',
    marginTop: 100,
  },
});