import React from 'react';
import {observer, inject} from 'mobx-react';
import bind from 'bind-decorator';
import {
  Card,
  CardActions,
  CardHeader,
  CardMedia,
  CardTitle,
  AutoComplete,
  CardText,
  FlatButton,
  Divider,
  RaisedButton,
  Toolbar,
  DatePicker,
  FontIcon,
  SelectField,
  MenuItem,
  ToolbarGroup,
  FloatingActionButton,
  ToolbarSeparator,
  IconButton,
  ToolbarTitle,
  RadioButton, RadioButtonGroup,DropDownMenu,
  Tabs, Tab,
} from 'material-ui';
import {withRouter} from 'react-router';
import {BrowserRouter as Router, Route} from 'react-router-dom';
import StarBorder from 'material-ui/svg-icons/toggle/star-border';
import ContentAdd from 'material-ui/svg-icons/content/add';

import '../style.scss';
import {appConfig} from "../../../config/app";
import CheckSchedule from "./CheckSchedule";
import ListAirlines from "./ListAirlines";
import FormBook from './FormBook';
import SnackbarMessage from '../SnackbarMessage';
import Review from './Review';
@inject('appstate')
@observer
export default class AirlinesINTL extends React.Component {
  constructor(props) {
    super(props);
    this.props = props;
    this.state = {
      value : 0,
      openSnackbar : false,
    };
    this.defaultState = Object.assign({}, this.state);
    this.http = props.appstate.http;
    this.authStore = props.appstate.auth;
    this.airlinesDomestic = props.appstate.airlinesDomestic;
  }

  componentDidMount() {
    console.log('Profile loaded!');

    this.airlinesDomestic.setOneway();
  }

  handleClickFind = ()=>{
    this.setState({
      value : 1
    })
  };

  handleClickBack = ()=>{
    this.airlinesDomestic.setOneway();
    this.setState({
      value : 0
    })
  };

  handleClickProceed = ()=>{
    this.setState({
      value : 3
    })
  };

  handleBackForm = ()=>{
    this.setState({
      value : 1
    })
  };

  handleBackReview = ()=>{
    this.setState({
      value : 2
    })
  };

  handleChooseFlight=(flight)=>{
    this.setState({
        value:2,
        flightData : flight,
    })
    console.log(flight);
  };

  getData = (object)=>{
      this.setState({
        passangerData : object
      })
      console.log(object);
  };

  handleBookNow = ()=>{
    this.setState({
      value : 0,
      openSnackbar : true,
    })
  };

  handleCloseSnackbar = () =>{
    this.setState({
      openSnackbar : false
    })
  };




  render() {

    const styles = {

      radioButton: {
        marginBottom: 16,
      },
    };


    return (
      <div>
        {/*{(this.state.value === 0)? <FormBook flightData={{*/}
          {/*desc: {*/}
            {/*departure: {},*/}
            {/*destination: {}*/}
          {/*}*/}
        {/*}} passengerData={{*/}
          {/*adult: 1,*/}
          {/*children: 0,*/}
          {/*infant: 0*/}
        {/*}} onClickBack={this.handleBackForm} onClickProceed={this.handleClickProceed}/>:''}*/}
        {(this.state.value === 0)? <CheckSchedule onClickFind={this.handleClickFind} getData={this.getData}/>:''}
        {(this.state.value === 1)? <ListAirlines passangerData={this.state.passangerData} onClickBack={this.handleClickBack} onClickSubmit={this.handleChooseFlight}/>:''}
        {(this.state.value === 2)? <FormBook flightData={this.state.flightData} passangerData={this.state.passangerData} onClickBack={this.handleBackForm} onClickProceed={this.handleClickProceed}/>:''}
        {(this.state.value === 3)? <Review flightData={this.state.flightData} passangerData={this.state.passangerData} onClickBack={this.handleBackReview} onClickBook={this.handleBookNow}/>:''}
        <SnackbarMessage message='Booking Succeed' open={this.state.openSnackbar} closeSnackbar={this.handleCloseSnackbar}/>
      </div>
    )
  }
}
