import React from "react";
import Head from 'next/head';
import Image from 'next/image';
import Link from "next/link";
import cookie from 'cookie';
import numeral from "numeral";
import pluralize from 'pluralize-ru';
import { SpinnerCircular } from 'spinners-react';
import Select from 'react-select';
import { connect } from "react-redux";
import { withRouter } from 'next/router';
import { get as _get } from 'lodash';

import QuestionnaireForm from "../QuestionnaireForm";
import CalendarDatePicker from '../../../CalendarDatePicker';
import FilesList from "../FilesList";
import Modal from "../../../../pages/components/Modal/modal";
import countries from "../../../../lib/countries.json";
import citizenships from "../../../../lib/citizenships.json";
import { reduxWrapper } from '../../../../store';
import moment from "moment";
import AddressSuggests from "../../AddressSuggests";
import InputMask from 'react-input-mask';
import SuggestsInput from "../../SuggestsInput";
import { getCitizenshipTitleByCode } from "../../../../utils/citizenship";

class Form_3_Signer extends QuestionnaireForm
{
	constructor(props)
	{
		super(props);
		this.state = {
			main: {
				title: "", 
				inn: "", 
				kpp: "", 
				email: "", 
				telephone: "", 
				websiteurl: "", 
				financial_loan: "", 
				is_individual_executive: false, 
				individual_executive_inn: "", 
				individual_executive_kpp: "", 
				individual_executive_oop: "", 
				individual_executive_docnum: "", 
				individual_executive_docdate: "", 
				high_level: "", 
				board_of_directors: "", 
				collective_executive: "", 
				individual_executive: "", 
				other_control: "", 
			}, 
			head_person: {
				lastname: "", 
				firstname: "", 
				middlename: "", 
				no_middle_name: false, 
				jobtitle: "Генеральный директор", 
				telephone: "", 
				email: "", 
				identity_document: {
					doctype: "", 
					seria: "", 
					docnumber: "", 
					issuedate: "", 
					code: "", 
					issueby: "", 
					issueby_search_dadata: "", 
					placebirth: "", 
					citizenship: {
						title: "", 
						code: "", 
					}, 
					registration_address: {
						name: "", 
						fias_id: "", 
					}
				}, 
				evo_assignment_date: "", 
				evo_credentials_dateend: "", 
				evo_indefinite: false, 
			}, 
			signatory_person: {
				not_head_person: false, 
				lastname: "", 
				firstname: "", 
				middlename: "", 
				no_middle_name: false, 
				jobtitle: "", 
				signer_rule_basis: "", 
				signer_rule_basis_add: "", 
				docdate: "", 
				docnumber: "", 
				delegation_agreement: false, 
				telephone: "", 
				email: "", 
				identity_document: {
					docype: "", 
					seria: "", 
					docnumber: "", 
					issuedate: "", 
					icode: "", 
					issueby: "", 
					issueby_search_dadata: "", 
					placebirth: "", 
					citizenship: {
						title: "", 
						code: "", 
					}, 
					registration_address: {
						name: "", 
						fias_id: "", 
					}
				}
			}, 
			individual_executive_files: [], 
			head_person_files: [], 
			signatory_person_files: [], 

			personal_data_consent: false, 
			loading: false, 
			modal_show_personal_data: false, 
		};
	}

	static getDerivedStateFromProps(nextProps, prevState)
	{
		return {
			main: nextProps.questionnaire.main, 
			head_person: nextProps.questionnaire.head_person, 
			head_person_files: nextProps.questionnaire.head_person_files, 
			individual_executive_files: nextProps.questionnaire.individual_executive_files, 
			signatory_person: nextProps.questionnaire.signatory_person, 
			signatory_person_files: nextProps.questionnaire.signatory_person_files, 
		};
	}

	componentDidMount()
	{
	}

	_handle_onCitizenshipChange = (name, value) => 
	{
		console.log("_handle_onCitizenshipChange", value);
		let citizenship = getCitizenshipTitleByCode(value);

		this._handle_onFieldChange(name, {
			title: citizenship, 
			code: value, 
		});
	}

	_handle_onIndefiniteChange = () => 
	{
		const { head_person } = this.state;
		const indefinite = !head_person.evo_indefinite ? true : false;
		this._handle_onCheckboxFieldChange("head_person.evo_indefinite", indefinite);

		if(!indefinite)
		{
			setTimeout(() => 
			{
				this._handle_onCheckboxFieldChange("head_person.evo_credentials_dateend", "");
			}, 10);
		}
	}

	_handle_onFormSubmit = (event) => 
	{
		event.preventDefault();
		console.log("Form_3_Signer", "_handle_onFormSubmit");

		this._handle_onCheckboxFieldChange("step", 4);
		setTimeout(() => 
		{
			this.props.onNextStep("shareholders");
		}, 10);
	}

	_checkDisabled = () => 
	{
		const { main, head_person, signatory_person, } = this.state;

		const head_person_check = [
			"lastname", 
			"firstname", 
			"jobtitle", 
			"telephone", 
			"email", 
			"identity_document.seria", 
			"identity_document.docnumber", 
			"identity_document.issuedate", 
			"identity_document.code", 
			"identity_document.issueby", 
			"identity_document.placebirth", 
			"identity_document.citizenship_code", 
			"identity_document.registration_address.title", 
			"evo_assignment_date", 
		];

		for(let i in head_person_check)
		{
			if(_get(head_person, head_person_check[i]) === "")
			{
				console.log("DISABLED", "head_person", head_person_check[i]);
				return true;
			}
		}

		console.log("head_person.evo_indefinite", head_person.evo_indefinite, "head_person.evo_credentials_dateend", head_person.evo_credentials_dateend);

		if(!head_person.evo_indefinite)
		{
			if(head_person.evo_credentials_dateend === "")
			{
				console.log("DISABLED", "head_person.evo_credentials_dateend === ''");
				return true;
			}
		}

		//переданы
		console.log("main.not_head_personmain.not_head_personmain.not_head_personmain.not_head_person", main.not_head_person);
		if(signatory_person.not_head_person)
		{
			const main_check = [
				"individual_executive_inn", 
				"individual_executive_kpp", 
				"individual_executive_oop", 
				"individual_executive_docnum", 
				"individual_executive_docdate", 
			];

			for(let i in main_check)
			{
				if(_get(main, main_check[i]) === "")
				{
					console.log("DISABLED", "main", main_check[i]);
					return true;
				}
			}	
		}

		//иной подписант
		if(signatory_person.delegation_agreement)
		{
			const signatory_person_check = [
				"lastname", 
				"firstname", 
				"jobtitle", 
				"signer_rule_basis", 
				"signer_rule_basis_add", 
				"docdate", 
				"docnumber", 
				"telephone", 
				"email", 
				"identity_document.seria", 
				"identity_document.docnumber", 
				"identity_document.issuedate", 
				"identity_document.icode", 
				"identity_document.issueby", 
				"identity_document.placebirth", 
				"identity_document.citizenship.code", 
				"identity_document.registration_address.title", 
			];

			for(let i in signatory_person_check)
			{
				if(_get(signatory_person, signatory_person_check[i]) === "")
				{
					console.log("DISABLED", "signatory_person", signatory_person_check[i]);
					return true;
				}
			}	
		}

		return false;
	}

	/*
	_checkDisabled = () => 
	{
		const { main } = this.state;
		const check = ["high_level", "board_of_directors", "collective_executive", "individual_executive"];

		for(let i in check)
		{
			if(main[check[i]] === "")
			{
				return true;
			}
		}

		if(!main.accept)
		{
			return true;
		}

		return false;
	}
	*/

	render()
	{
		const { checking } = this.props;
		const {
			personal_data_consent, 
			head_person_files, 
			signatory_person_files, 
			individual_executive_files, 
			modal_show_personal_data, 
		} = this.state;

		console.log("individual_executive_files", individual_executive_files);

		const { loading, } = this.state;
		const { main, head_person, signatory_person } = this.state;

		let head_person_citizenship = { label: getCitizenshipTitleByCode(head_person.identity_document.citizenship.code), code: head_person.identity_document.citizenship.code };
		let signatory_person_citizenship = { label: getCitizenshipTitleByCode(signatory_person.identity_document.citizenship.code), code: signatory_person.identity_document.citizenship.code };

		return (
			<React.Fragment>
				<form onSubmit={ this._handle_onFormSubmit } className={`questionnaire questionnaire_3 ${ checking && "disabled" }`}>
					<p className="title">3. Информация о единоличном исполнительном органе, подписанте договора лизинга</p>
					<div className="form_field">
						<label>Фамилия</label>
						<SuggestsInput 
							type="lastname" 
							id="head_person.lastname" 
							name="head_person.lastname" 
							value={ head_person.lastname } 
							placeholder="Введите фамилию" 
							onChange={ (value) => this._handle_onTextFieldChange("head_person.lastname", value) } 
							required={ true } 
							disabled={ checking } 
						/>
						{/*}
						<input type="text" 
							id="head_person.lastname" 
							name="head_person.lastname" 
							value={ head_person.lastname } 
							placeholder="Введите фамилию" 
							onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
							required={ true } 
							disabled={ checking } 
						/>
						{*/}
					</div>
					<div className="form_field">
						<label>Имя</label>
						<SuggestsInput 
							type="firstname" 
							id="head_person.firstname" 
							name="head_person.firstname" 
							value={ head_person.firstname } 
							placeholder="Введите имя" 
							onChange={ (value) => this._handle_onTextFieldChange("head_person.firstname", value) } 
							required={ true } 
							disabled={ checking } 
						/>
						{/*}
						<input type="text" 
							id="head_person.firstname" 
							name="head_person.firstname" 
							value={ head_person.firstname } 
							placeholder="Введите имя" 
							onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
							required={ true } 
							disabled={ checking } 
						/>
						{*/}
					</div>
					<div className="form_field">
						<label>Отчество <small>если имеется</small></label>
						<SuggestsInput 
							type="middlename"  
							id="head_person.middlename" 
							name="head_person.middlename" 
							value={ head_person.middlename } 
							placeholder="Введите отчество" 
							onChange={ (value) => this._handle_onTextFieldChange("head_person.middlename", value) } 
							required={ true } 
							disabled={ checking } 
						/>
						{/*}
						<input type="text" 
							id="head_person.middlename" 
							name="head_person.middlename" 
							value={ head_person.middlename } 
							placeholder="Введите отчество" 
							onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
							disabled={ checking } 
						/>
						{*/}
					</div>
					<div className="formgroup">

						<div className="form_field">
							<label>Серия паспорта</label>
							<InputMask 
								mask='9999' 
								id="head_person.identity_document.seria" 
								name="head_person.identity_document.seria" 
								value={ head_person.identity_document.seria } 
								placeholder="Введите серию" 
								onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
								required={ true } 
								disabled={ checking }>
							</InputMask>
						</div>
						<div className="form_field">
							<label>Номер паспорта</label>
							<InputMask 
								mask='999999' 
								id="head_person.identity_document.docnumber" 
								name="head_person.identity_document.docnumber" 
								value={ head_person.identity_document.docnumber } 
								placeholder="Введите номер" 
								onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
								required={ true } 
								disabled={ checking }>
							</InputMask>
						</div>

					</div>
					<div className="formgroup">
						<div className="form_field">
							<label>Дата выдачи</label>
							<CalendarDatePicker 
								placeholder="ДД.ММ.ГГГГ" 
								id={ "head_person.identity_document.issuedate" } 
								value={ head_person.identity_document.issuedate !== "" ? head_person.identity_document.issuedate : null } 
								onChange={ (date) => this._handle_onTextFieldChange("head_person.identity_document.issuedate", date) } 
								required={ true } 
								disabled={ checking } 
							/>
						</div>
						<div className="form_field">
							<label>Код подразделения</label> 
							<InputMask 
								mask='999-999' 
								id="head_person.identity_document.code" 
								name="head_person.identity_document.code" 
								value={ head_person.identity_document.code } 
								placeholder="Введите код" 
								onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
								required={ true } 
								disabled={ checking } 
							/>
							{/*}
							<input type="text" 
								id="head_person.identity_document.code" 
								name="head_person.identity_document.code" 
								value={ head_person.identity_document.code } 
								placeholder="Введите номер" 
								onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
								required={ true } 
								disabled={ checking } 
							/>
							{*/}
						</div>
					</div>
					<div className="form_field">
						<label>Кем выдан</label>
						<input type="text"  
							id="head_person.identity_document.issueby" 
							name="head_person.identity_document.issueby" 
							value={ head_person.identity_document.issueby } 
							placeholder="Введите наименование подразделения выдавшего документ" 
							onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
							required={ true } 
							disabled={ checking } 
						/>
					</div>
					<div className="form_field">
						<label>Место рождения</label>
						<AddressSuggests 
							id={ "head_person.identity_document.placebirth" } 
							value={ head_person.identity_document.placebirth } 
							placeholder="Укажите место рождения" 
							onChange={ (data) => this._handle_onTextFieldChange("head_person.identity_document.placebirth", data.title) } 
							required={ true } 
							disabled={ checking } 
						/>
					</div>
					<div className="form_field">
						<label>Гражданство</label>
						<Select 
							id="head_person.identity_document.citizenship" 
							name="head_person.identity_document.citizenship" 
							options={ citizenships } 
							placeholder="Выберите страну" 
							noOptionsMessage={ ({ inputValue }) => !inputValue ? noOptionsText :"Ничего не найдено" } 
							isSearchable={ true } 
							className="autocomlete" 
							classNamePrefix="react-select" 
							value={ head_person_citizenship } 
							onChange={ (element) => this._handle_onCitizenshipChange(`head_person.identity_document.citizenship`, element.value) } 
							required={ true } 
							isDisabled={ checking } 
						/>
					</div>
					<div className="form_field">
						<label>Адрес регистрации</label>
						<AddressSuggests
							value={ head_person.identity_document.registration_address.name } 
							fias={ head_person.identity_document.registration_address.fias_id } 
							placeholder="Укажите адрес регистрации" 
							onChange={ (data) => this._handle_onTextFieldChange("head_person.identity_document.registration_address", data) } 
							required={ true } 
							disabled={ checking } 
						/>
					</div>
					<div className="form_field">
						<label>Должность</label>
						<input type="text" 
							id="head_person.jobtitle" 
							name="head_person.jobtitle" 
							value={ head_person.jobtitle } 
							placeholder="Укажите должность" 
							onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
							required={ true } 
							disabled={ checking } 
						/>
					</div>
					
					<div className="form_field">
						<label>Телефон</label>
						<InputMask 
							mask='+7 (999) 999 99 99' 
							id={ "head_person.telephone" } 
							name={ "head_person.telephone" } 
							value={ head_person.telephone } 
							placeholder="Введите номер телефона" 
							onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
							required={ true } 
							disabled={ checking } >
							</InputMask>
					</div>

					<div className="form_field">
						<label>Адрес E-mail</label>
						<input type="text" 
							id={ "head_person.email" } 
							name={ "head_person.email" } 
							value={ head_person.email } 
							placeholder="Введите E-mail" 
							onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
							required={ true } 
							disabled={ checking } 
						/>
					</div>

					<div className="form_field picker">
						<label>Дата назначения</label>
						<div style={{ display: "flex", flexWrap: "wrap", width: "calc(100% - 198px)"}}>
							<CalendarDatePicker 
								placeholder="ДД.ММ.ГГГГ" 
								id={ "head_person.evo_assignment_date" } 
								value={ head_person.evo_assignment_date !== "" ? head_person.evo_assignment_date : null } 
								onChange={ (date) => this._handle_onTextFieldChange("head_person.evo_assignment_date", date) } 
								required={ true } 
								disabled={ checking } 
								style={{maxWidth: "320px"}}
							/>
							<div className="form_field checkbox" style={{width: "auto", marginLeft: "28px"}}>
								<input type="checkbox" 
									hidden="" 
									id="head_person.evo_indefinite" 
									name="head_person.evo_indefinite" 
									checked={ head_person.evo_indefinite } 
									onChange={ (event) => this._handle_onIndefiniteChange() } 
									disabled={ checking } 
								/>
								<label htmlFor="head_person.evo_indefinite" className="unselectable">Полномочия бессрочны</label>
							</div>
						</div>
					</div>
					{ !head_person.evo_indefinite && (
						<div className="form_field picker">
							<label>Дата окончания полномочий</label>
							<div style={{ display: "flex", flexWrap: "wrap", width: "calc(100% - 198px)" }}>
								<CalendarDatePicker 
									placeholder="ДД.ММ.ГГГГ" 
									id={ "head_person.evo_credentials_dateend" } 
									value={ head_person.evo_credentials_dateend !== "" ? head_person.evo_credentials_dateend : null } 
									onChange={ (date) => { console.log("date", date); this._handle_onTextFieldChange("head_person.evo_credentials_dateend", date) } } 
									required={ true } 
									disabled={ checking } 
									style={{maxWidth: "320px"}}
								/>
							</div>
						</div>
					) }

					<FilesList 
						//group="head_person" 
						name="head_person_files" 
						files={ head_person_files } 
						onAddFile={ this._handle_onAddFile } 
						onRemoveFile={ this._handle_onRemoveFile } 
						checking={ checking } 
						title="Прикрепить скан паспорта единоличного исполнительного органа" 
					/>

					<div className="form_field">
						<div className="form_field checkbox">
							<input type="checkbox" 
								hidden="" 
								id="signatory_person.not_head_person" 
								name="signatory_person.not_head_person" 
								checked={ signatory_person.not_head_person } 
								onChange={ (event) => this._handle_onCheckboxFieldChange(event.target.name, !signatory_person.not_head_person ? true : false) } 
								disabled={ checking } 
							/>
							<label htmlFor="signatory_person.not_head_person" className="unselectable">Полномочия единоличного исполнительного органа переданы управляющей организации или управляющему</label>
						</div>
					</div>

					{ signatory_person.not_head_person && (
						<React.Fragment>
							<p className="title">Информация об управляющей организации или управляющем</p>
							<p>Организационно-правовая форма и полное наименование управляющей организации или управляющего</p>
							<div className="form_field">
								<input type="text" 
									style={{ width: "100%" }} 
									id="main.individual_executive_oop" 
									name="main.individual_executive_oop" 
									value={ main.individual_executive_oop } 
									placeholder="Укажите управляющую организацию" 
									onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
									required={ true } 
									disabled={ checking } 
								/>
							</div>

							<div className="formgroup" style={{ width: "100%" }}>
								<div className="form_field" style={{ flexDirection: "row", flexWrap: "nowrap" }}>
									<label>ИНН</label>
									<input type="text" 
										style={{ width: "100%" }} 
										id="main.individual_executive_inn" 
										name="main.individual_executive_inn" 
										value={ main.individual_executive_inn } 
										placeholder="Введите ИНН" 
										onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
										required={ true } 
										disabled={ checking } 
									/>
								</div>

								<div className="form_field" style={{ flexDirection: "row", flexWrap: "nowrap" }}>
									<label>КПП</label>
									<input type="text" 
										style={{ width: "100%" }} 
										id="main.individual_executive_kpp" 
										name="main.individual_executive_kpp" 
										value={ main.individual_executive_kpp } 
										placeholder="Введите КПП" 
										onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
										required={ true } 
										disabled={ checking } 
									/>
								</div>
							</div>

							<div className="formgroup" style={{ width: "100%", }}>
								<div className="form_field">
									<label style={{ width: "100%", marginBottom: "12px" }}>Номер договора о передаче полномочий управляющей организации /управляющему</label>
									<input type="text" 
										style={{ width: "100%" }} 
										id="main.individual_executive_docnum" 
										name="main.individual_executive_docnum" 
										value={ main.individual_executive_docnum } 
										placeholder="Номер договора" 
										onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
										disabled={ checking } 
									/>
								</div>

								<div className="form_field" style={{ alignItems: "flex-end" }}>
									<label style={{ width: "100%", alignSelf: "flex-start" }}>Дата договора</label>
									{/*}
									<input type="text" 
										style={{ width: "100%", }} 
										id="main.individual_executive_docdate" 
										name="main.individual_executive_docdate" 
										value={ main.individual_executive_docdate } 
										placeholder="Дата" 
										onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
										required={ true }
									/>
									{*/}
									<CalendarDatePicker 
										style={{ width: "100%", }} 
										placeholder="ДД.ММ.ГГГГ" 
										id={ "main.individual_executive_docdate" } 
										value={ main.individual_executive_docdate !== "" ? main.individual_executive_docdate : null } 
										onChange={ (date) => this._handle_onTextFieldChange("main.individual_executive_docdate", date) } 
										required={ true } 
										disabled={ checking } 
									/>
								</div>
							</div>

							<FilesList 
								//group="individual_executive" 
								name="individual_executive_files" 
								files={ individual_executive_files } 
								onAddFile={ this._handle_onAddFile } 
								onRemoveFile={ this._handle_onRemoveFile } 
								checking={ checking } 
							/>

						</React.Fragment>
					) }

					<div className="form_field">
						<div className="form_field checkbox">
							<input type="checkbox" 
								hidden="" 
								id="signatory_person.delegation_agreement" 
								name="signatory_person.delegation_agreement" 
								checked={ signatory_person.delegation_agreement } 
								onChange={ (event) => this._handle_onCheckboxFieldChange(event.target.name, !signatory_person.delegation_agreement ? true : false) } 
								disabled={ checking } 
							/>
							<label htmlFor="signatory_person.delegation_agreement" className="unselectable">Подписант отличается от единоличного исполнительного органа</label>
						</div>
					</div>

					{ signatory_person.delegation_agreement && (
						<React.Fragment>
							<p className="title">Информация о подписанте <small>(заполняется если подписант договора лизинга отличается от единоличного исполнительного органа)</small></p>

							<div className="form_field">
								<label>Фамилия</label>
								<input type="text" 
									id="signatory_person.lastname" 
									name="signatory_person.lastname" 
									value={ signatory_person.lastname } 
									placeholder="Введите фамилию" 
									onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
									required={ true } 
									disabled={ checking } 
								/>
							</div>

							<div className="form_field">
								<label>Имя</label>
								<input type="text" 
									id="signatory_person.firstname" 
									name="signatory_person.firstname" 
									value={ signatory_person.firstname } 
									placeholder="Введите имя" 
									onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
									required={ true } 
									disabled={ checking } 
								/>
							</div>

							<div className="form_field">
								<label>Отчество <small>если имеется</small></label>
								<input type="text" 
									id="signatory_person.middlename" 
									name="signatory_person.middlename" 
									value={ signatory_person.middlename } 
									placeholder="Введите отчество" 
									onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
									disabled={ checking } 
								/>
							</div>

							<div className="formgroup">
								<div className="form_field">
									<label>Серия паспорта</label>
									<input type="text" 
										id="signatory_person.identity_document.seria" 
										name="signatory_person.identity_document.seria" 
										value={ signatory_person.identity_document.seria } 
										placeholder="Введите серию" 
										onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
										required={ true } 
										disabled={ checking } 
									/>
								</div>

								<div className="form_field">
									<label>Номер паспорта</label>
									<input type="text" 
										id="signatory_person.identity_document.docnumber" 
										name="signatory_person.identity_document.docnumber" 
										value={ signatory_person.identity_document.docnumber } 
										placeholder="Введите номер" 
										onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
										required={ true } 
										disabled={ checking } 
									/>
								</div>
							</div>

							<div className="formgroup">
								<div className="form_field">
									<label>Дата выдачи</label>
									<CalendarDatePicker 
										style={{ width: "calc(100% - 198px)" }} 
										placeholder="ДД.ММ.ГГГГ" 
										id={ "signatory_person.identity_document.issuedate" } 
										value={ signatory_person.identity_document.issuedate !== "" ? signatory_person.identity_document.issuedate : null } 
										onChange={ (date) => this._handle_onTextFieldChange("signatory_person.identity_document.issuedate", date) } 
										required={ true } 
										disabled={ checking } 
									/>
								</div>

								<div className="form_field">
									<label>Код подразделения</label>
									<input type="text" 
										id="signatory_person.identity_document.icode" 
										name="signatory_person.identity_document.icode" 
										value={ signatory_person.identity_document.icode } 
										placeholder="Введите номер" 
										onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
										required={ true } 
										disabled={ checking } 
									/>
								</div>
							</div>

							<div className="form_field">
								<label>Кем выдан</label>
								<input type="text" 
									id="signatory_person.identity_document.issueby" 
									name="signatory_person.identity_document.issueby" 
									value={ signatory_person.identity_document.issueby } 
									placeholder="Введите наименование подразделения выдавшего документ" 
									onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
									required={ true } 
									disabled={ checking } 
								/>
							</div>

							<div className="form_field">
								<label>Место рождения</label>
								<AddressSuggests 
									id={ "signatory_person.identity_document.placebirth" } 
									value={ signatory_person.identity_document.placebirth } 
									placeholder="Укажите место рождения" 
									onChange={ (data) => this._handle_onTextFieldChange("signatory_person.identity_document.placebirth", data.name) } 
									required={ true } 
									disabled={ checking } 
								/>
							</div>

							<div className="form_field">
								<label>Гражданство</label>
								<Select 
									id="signatory_person.identity_document.citizenship" 
									name="signatory_person.identity_document.citizenship" 
									options={ citizenships } 
									placeholder="Выберите страну" 
									noOptionsMessage={ ({ inputValue }) => !inputValue ? noOptionsText :"Ничего не найдено" } 
									isSearchable={ true } 
									className="autocomlete" 
									classNamePrefix="react-select" 
									value={ signatory_person_citizenship } 
									onChange={ (element) => this._handle_onCitizenshipChange(`signatory_person.identity_document.citizenship`, element.value) } 
									required={ true } 
									isDisabled={ checking } 
								/>
							</div>

							<div className="form_field">
								<label>Адрес регистрации</label>
								<AddressSuggests 
									value={ signatory_person.identity_document.registration_address.name } 
									fias={ signatory_person.identity_document.registration_address.fias_id } 
									onChange={ (data) => this._handle_onTextFieldChange("signatory_person.identity_document.registration_address", data) } 
									required={ true } 
									disabled={ checking } 
								/>

								{/*}
								<input type="text" 
									id="signatory_person.identity_document.registration_address.title" 
									name="signatory_person.identity_document.registration_address.title" 
									value={ signatory_person.identity_document.registration_address.title } 
									placeholder="Введите адрес" 
									onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
									required={ true } 
								/>
								{*/}
							</div>

							<div className="form_field">
								<label>Должность</label>
								<input type="text" 
									id="signatory_person.jobtitle" 
									name="signatory_person.jobtitle" 
									value={ signatory_person.jobtitle } 
									placeholder="Укажите должность" 
									onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
									required={ true } 
									disabled={ checking } 
								/>
							</div>

							<div className="formgroup">
								<div className="form_field">
									<label>Телефон</label>
									<input type="text" 
										id="signatory_person.telephone" 
										name="signatory_person.telephone" 
										value={ signatory_person.telephone } 
										placeholder="Телефон" 
										onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
										required={ true } 
										disabled={ checking } 
									/>
								</div>

								<div className="form_field">
									<label>E-mail</label>
									<input type="text" 
										id="signatory_person.email" 
										name="signatory_person.email" 
										value={ signatory_person.email } 
										placeholder="E-mail" 
										onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
										required={ true } 
										disabled={ checking } 
									/>
								</div>
							</div>

							<p><b>Реквизиты документа подтверждающие полномочия на подписание договора лизинга</b></p>

							<div className="form_field">
								<label>Вид документа</label>
								<input type="text" 
									id="signatory_person.signer_rule_basis" 
									name="signatory_person.signer_rule_basis" 
									value={ signatory_person.signer_rule_basis } 
									placeholder="Вид документа" 
									onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
									required={ true } 
									disabled={ checking } 
								/>
							</div>

							<div className="form_field">
								<label>Наименование документа</label>
								<input type="text" 
									id="signatory_person.signer_rule_basis_add" 
									name="signatory_person.signer_rule_basis_add" 
									value={ signatory_person.signer_rule_basis_add } 
									placeholder="Наименование документа" 
									onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
									required={ true } 
									disabled={ checking } 
								/>
							</div>

							<div className="formgroup">
								<div className="form_field">
									<label>Номер документа</label>
									<input type="text" 
										id="signatory_person.docnumber" 
										name="signatory_person.docnumber" 
										value={ signatory_person.docnumber } 
										placeholder="Номер документа" 
										onChange={ (event) => this._handle_onTextFieldChange(event.target.name, event.target.value) } 
										required={ true } 
										disabled={ checking } 
									/>
								</div>

								<div className="form_field">
									<label>Дата</label>
									<CalendarDatePicker 
										style={{ width: "calc(100% - 198px)" }} 
										placeholder="ДД.ММ.ГГГГ" 
										id={ "signatory_person.docdate" } 
										value={ signatory_person.docdate !== "" ? signatory_person.docdate : null } 
										onChange={ (date) => this._handle_onTextFieldChange("signatory_person.docdate", date) } 
										required={ true } 
										disabled={ checking } 
									/>
								</div>
							</div>

							<FilesList 
								//group="signatory_person" 
								name="signatory_person_files" 
								files={ signatory_person_files } 
								onAddFile={ this._handle_onAddFile } 
								onRemoveFile={ this._handle_onRemoveFile } 
								checking={ checking } 
							/>

							{/*}
							<div className="dosc_list medium-icon">
								<div className="row">
								<p className="doc_name i-pdf extension">№ 01/20/2020 (.PDF)<span style={{width: "100%"}}>Постановление</span></p>
								</div>
							</div>
							{*/}
						</React.Fragment>
					) }

					{/*}
					<div className="form_field">
						<div className="form_field checkbox">
							<input type="checkbox" 
								hidden="" 
								id="personal_data_consent" 
								name="personal_data_consent" 
								checked={ personal_data_consent } 
								onChange={ (event) => this._handle_onCheckboxFieldChange(event.target.name, !personal_data_consent ? true : false) } 
								disabled={ checking } 
							/>
							<label htmlFor="personal_data_consent" className="unselectable">Даю согласие на&nbsp;<a style={{ cursor: "pointer", }} onClick={ () => { this.setState({ modal_show_personal_data: true, }) } }>обработку персональных данных</a></label>
						</div>
					</div>
					{*/}
					{ !checking && (
						<div className="action">
							<button type="submit" className="button button-blue" disabled={ this._checkDisabled() }>
								{ loading ? (
									<SpinnerCircular size={24} thickness={100} speed={100} color="rgba(255, 255, 255, 1)" secondaryColor="rgba(255, 255, 255, 0.5)" style={{ marginTop: "4px" }}/>
									) : "Продолжить" }
							</button>
						</div>
					) }
				</form>
			</React.Fragment>
		)
	}
}

function mapStateToProps(state, ownProps)
{
	return {
		questionnaire: state.questionnaire, 
	}
}

export const getServerSideProps = reduxWrapper.getServerSideProps(store => 
	async ({ req, res, query }) => 
	{
    }
);

export default connect(mapStateToProps)(Form_3_Signer);