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',
                    index: undefined,
                    inn: undefined,
                    kpp: undefined,
                    ogrn: undefined,
                    director: undefined,
                    address: undefined,
                    arrList: undefined,
                    nameBack: undefined,
                    addressBack: undefined,
                    directorBack: undefined,
                    innBack: undefined,
                    kppBack: undefined,
                    ogrnBack: undefined
                    };
      this.saveOrganization = this.saveOrganization.bind(this);
    }

    saveOrganization(name, address, director, inn, kpp, ogrn) {
      this.setState({nameBack: name, addressBack: address, directorBack: director, innBack: inn, kppBack: kpp, ogrnBack: ogrn});
      // this.props.getBackData(this.state.nameBack, this.state.addressBack, this.state.directorBack, this.state.innBack, this.state.kppBack, this.state.ogrnBack);
      alert(this.state.nameBack)
    }

    showDetails(arrList, index, name, inn, kpp, ogrn, address, director) {
      this.setState({toggleBlock: "hidden", arrList: arrList, index: index, name: name, inn: inn, kpp: kpp, ogrn: ogrn, address: address, director: director});
      if (this.state.arrList !== undefined) {
        this.setState({arrList: undefined})
      }
    }

    render() {
      let viewDetails = (<OrganizationDetails index={this.state.index} name={this.state.name} inn={this.state.inn} kpp={this.state.kpp} ogrn={this.state.ogrn} address={this.state.address} director={this.state.director} 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;