import React from 'react';

import { connect } from 'react-redux';
import { Redirect } from 'react-router-dom';
import PageLoading from '@ant-design/pro-layout';
import { getBaseName } from '../utils/utils';

class SecurityLayout extends React.Component {
  state = {
    isReady: false,
  };

  componentDidMount() {
    this.setState({
      isReady: true,
    });
  }

  render() {
    const { isReady } = this.state;
    const { children, global, loading } = this.props;
    const isLogin =
      global.token !== null ||
      ((global.qrcodeData &&
        global.qrcodeData.state !== '' &&
        global.qrcodeData.code !== '') ||
        !global.userInfo);

    // eslint-disable-next-line no-undef
    // if(Cookie.get("token")==="") {
    //   return (
    //     <Redirect to={`/user/login?client=${global.client}`} />
    //   );
    // }
    if((!isLogin && loading) || !isReady) {
      return <PageLoading/>
    }
    if (
      !isLogin &&
      window.location.pathname !== `/${getBaseName()}/user/login`
    ) {
      this.props.updateCurrentIndex && this.props.updateCurrentIndex(0);
      return <Redirect to={`/user/login?client=${global.client}`} />;
    }
    return children;
  }
}

const mapStateToProps = state => ({
  global: state.getIn(['global', 'globalConfig']),
});
export default connect(
  mapStateToProps,
  null,
)(SecurityLayout);
