import React, { Component } from 'react';
import { Switch, Route, Redirect, NavLink } from 'react-router-dom';
import PublicCarList from './PublicCarList';
import PublicCarApply from './PublicCarApply';
import styles from './style.css';

class PublicCar extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showFooter: true,
    };
  }

  componentDidMount() {
    let screenHeight = document.body.offsetHeight;
    window.onresize = () => {
      let nowHeight = document.body.offsetHeight;
      if (nowHeight < screenHeight) {
        this.setState({
          showFooter: false,
        });
      } else {
        this.setState({
          showFooter: true,
        });
      }
    };
  }
  render() {
    const { showFooter } = this.state;
    return (
      <div className="Content-Wrap">
        <div className="RepairContent">
          <Switch>
            <Route
              path="/publicCar/PublicCarApply"
              component={PublicCarApply}
            />
            <Route path="/publicCar/PublicCarList" component={PublicCarList} />
            <Route render={() => <Redirect to="/publicCar/PublicCarApply" />} />
          </Switch>
        </div>
        {showFooter && (
          <div className={styles.footer}>
            <NavLink
              className={styles['footer-item']}
              to="/publicCar/PublicCarApply"
              replace
            >
              约车服务
            </NavLink>
            <span className={styles.line} />
            <NavLink
              className={styles['footer-item']}
              to="/publicCar/PublicCarList"
              replace
            >
              约车记录
            </NavLink>
          </div>
        )}
      </div>
    );
  }
}

export default PublicCar;
