import React from 'react';
import './NewOrganization.scss';
import Search from '../search/Search';
import OrganizationDetails from '../organization-details/OrganizationDetails';

class NewOrganization extends React.Component {
    constructor(props) {
      super(props);
      this.showDetails = this.showDetails.bind(this);
      this.state = {toggleBlock: 'small-block',
                    organization: undefined
                    };
      this.saveOrganization = this.saveOrganization.bind(this);
    }
    saveOrganization(organization) {
      this.setState({organization});
      this.props.getBackData(organization);
    }

    showDetails(arrList, organization) {
      this.setState({toggleBlock: "hidden", arrList: arrList, organization: organization});
      if (this.state.arrList !== undefined) {
        this.setState({arrList: undefined})
      }
    }

    render() {
      let viewDetails = (<OrganizationDetails organization={this.organization} saveOrganization={this.saveOrganization}/>);
      if (this.state.index === undefined) {
        viewDetails = undefined;
      }

        return (
          <div>
            <div className="main-block">
            <Search showDetails={this.showDetails}/>
              {viewDetails}
              <div className= {this.state.toggleBlock}>
                <i className="fas fa-plus-circle"></i>
                <div className="small-block__text">Для добавления новой организации введите ее название, ИНН или адрес</div>
              </div>
            </div>
          </div>
        )
    }
}

export default NewOrganization;