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 { connect } from "react-redux";
import { withRouter } from 'next/router';
import moment from "moment";

import QuestionnaireForm from "../QuestionnaireForm";
import { reduxWrapper } from '../../../../store';
import DigitalSignaturesList from "../DigitalSignaturesList";
import { downloadQuestionnaire } from "../../../../actions";

class Form_8_Signing extends QuestionnaireForm 
{
	constructor(props) 
	{
		super(props);
		this.state = {
			sign_digital: true, 
			address: "",
			phone_check_loading: false,
			phone_number_format_error: false,

			certificates: [], 
		};
	}

	static getDerivedStateFromProps(nextProps, prevState) 
	{
		return {
			observer: nextProps.observer,
			user: nextProps.user,
		};
	}

	componentDidMount() 
	{		
	}

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

	_check_fields_disabled = (values) => 
	{
		for (let i in values) 
		{
			if (values[i] === "") 
			{
				return true;
			}
		}

		return false;
	};

	_download = () => 
	{
		downloadQuestionnaire()
		.then(() => 
		{
			alert("Скачивание сформированного PDF");
		});
	}

	_handle_onChangeSignMehod = () => 
	{
		const { sign_digital } = this.state;
		this.setState({ sign_digital: sign_digital ? false : true }, () => 
		{
			window.scrollTo(0, 0);
		});
	}

	render() 
	{
		const { phone_check_loading, sign_digital, certificates } = this.state;

		return (
			<React.Fragment>
				<form onSubmit={ this._handle_onFormSubmit } className="questionnaire questionnaire_8">
					<p className="title">8. Выбор метода подписания</p>

					<div className="form_field">
						<div style={{ width: "100%" }}>
							<div className="form_field checkbox">
								<input type="radio" hidden="" 
									id="sign_digital" 
									name="sign_digital" 
									checked={ sign_digital } 
									onChange={ this._handle_onChangeSignMehod } 
								/>
								<label htmlFor="sign_digital">
									<b>Подписать онлайн используя ЭЦП</b>
								</label>
							</div>
						</div>
					</div>

					{ sign_digital && (
						<DigitalSignaturesList form={ null }/>
					) }

					<div className="form_field">
						<div style={{ width: "100%" }}>
							<div className="form_field checkbox">
								<input type="radio" hidden="" 
									id="sign_print" 
									name="sign_print" 
									checked={ !sign_digital } 
									onChange={ this._handle_onChangeSignMehod } 
								/>
								<label htmlFor="sign_print">
									<b>Подписать в бумажном виде</b>
								</label>
							</div>
						</div>
					</div>

					{ !sign_digital && (
						<div className="dosc_list medium-icon">
							<div className="row">
								<p className="doc_name i-pdf extension">
									{ moment().format("DD.MM.YYYY HH:mm:ss") } (.PDF)
									<span style={{ width: "100%" }}>Анкета клиента</span>
								</p>
								<a className="button button-blue " onClick={ this._download }>Скачать</a>
							</div>
						</div>
					) }
				</form>
			</React.Fragment>
		);
	}
}

function mapStateToProps(state, ownProps)
{
	return {
		main: state.questionnaire.main, 
		legal_address: state.questionnaire.legal_address, 
		fact_address: state.questionnaire.fact_address, 
		postal_address: state.questionnaire.postal_address, 
		head_person: state.questionnaire.head_person, 
		head_person_files: state.questionnaire.head_person_files, 
		signatory_person: state.questionnaire.signatory_person, 
		signatory_person_files: state.questionnaire.signatory_person_files, 
		founder_persons: state.questionnaire.founder_persons, 
		client_contacts: state.questionnaire.client_contacts, 
		non_profit: state.questionnaire.non_profit, 
	}
}

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

export default connect(mapStateToProps)(Form_8_Signing);