import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { Nav, NavItem, IndexNavItem,Connect } from 'amos-framework';


const eventConnect = Connect.eventConnect;

class SysExtend extends Component {
  static propTypes = {
    showText: PropTypes.bool,
    extendSystem: PropTypes.array
  };

  constructor(props) {
    super(props);
    this.state = {

    };
  }

  componentWillMount() {

  }
  componentDidMount() {
    const { extendSystem } = this.props;
    if ( extendSystem[0].children && extendSystem[0].children.length > 0 ){
      let isSub = window.sessionStorage.getItem('sub');
      if (isSub === null) {
        window.open(extendSystem[0].children[0].path);
        window.sessionStorage.setItem('sub','use');
      }
    }
  }
  componentDidUpdate(prevProps, prevState) {

  }
  componentWillUnmount() {

  }

  onClick = sbm => {
    window.localStorage.setItem('submenu',JSON.stringify(sbm.children));
  };
  redirect(){

  }
  renderNavItem = () => {
    const { showText, extendSystem } = this.props;
    return extendSystem.map((sbm,index) => {
      if (index === 0) {
        return <IndexNavItem key={sbm.sequenceNbr} onClick={e => this.onClick(sbm)} icon={sbm.icon} title={showText ? sbm.permissionName : ''} href={sbm.path} />;
      } else {
        return <NavItem key={sbm.sequenceNbr} onClick={e => this.onClick(sbm)} icon={sbm.icon} title={showText ? sbm.permissionName : ''} href={sbm.path} />;
      }
    });
  };

  renderSelectItem = () => {};

  render() {
    const navItem = this.renderNavItem();
    return (
      <div className="sys-extend">
        <Nav direction="horizontal" href="/">
          {navItem}
        </Nav>
      </div>
    );
  }
}
SysExtend.propTypes = {
  add: PropTypes.func,
  subscribe: PropTypes.any,
  extendSystem: PropTypes.array
};
export default eventConnect(SysExtend);
