import React, {Component} from 'react';
import {connect} from 'react-redux';
import moment from 'moment';
import {Row, Col, Popover, PopoverBody} from 'reactstrap';
import '../../style/InstallationScheduling.css';
import InstallationSchedulingPerPackage from './InstallationSchedulingPerPackage.jsx';
import {orderTexts} from '../../../../constants/ordersConstants';
import {setDialogContent, setDialogOpenFlag} from '../../../../actions/dialog/dialogActions';

class InstallationSchedulingForPackages extends Component {
    constructor(props) {
        super(props);

        this.state = {
            popoverOpen: false
        }

        this.toggle = this.toggle.bind(this);
        this.setContentDialog = this.setContentDialog.bind(this);
        this.openDialogInstallContent = this.openDialogInstallContent.bind(this);
    }

    setContentDialog(installationParams) {
        return {
            class: 'installation-scheduling',
            hasCloseIcon: true,
            header: orderTexts.labels.INSTALLATION_SCHEDULE_HEADER,
            TagName: InstallationSchedulingPerPackage,
            params: {installationParams, openDialogInstallContent: this.openDialogInstallContent}
        };
    }

    openDialogInstallContent(installationParams) {
        const dialogContent = this.setContentDialog(installationParams);

        this.props.dispatch(setDialogOpenFlag(true));
        this.props.dispatch(setDialogContent(dialogContent));
    }

    toggle() {
        this.setState({
          popoverOpen: !this.state.popoverOpen
        });
    }

    render() {
        const {orderPackage, areComponentsDisabled, isInstallationSet, isInstallationInPackage, noOfPackages, installCompanies, isComponentDisabled, earliestInstallDate, confirmationDates, areAllShippingDatesConfirmed} = this.props;
        const idOrder = orderPackage ? orderPackage.idOrder : 0;
        const idOrderPackagePair = orderPackage ? idOrder + '-' + orderPackage.idPackage : '';
        const acceptedDate = {};
        const proposedDate = {};
        const installationCompany = {};
        const availableCompanies = {};
        const selectedCompanies = {};
        const isPreliminaryInstallationDate = {};

        if(confirmationDates && confirmationDates[idOrderPackagePair]) {
            const packageDates = confirmationDates[idOrderPackagePair];
            const accepted = Object.keys(packageDates).find(installDate => {return packageDates[installDate].lastStatus === 'accepted'});
            acceptedDate[idOrderPackagePair] = accepted ? moment(accepted).format('Do MMM, YYYY') : '';
            const proposed = Object.keys(packageDates).find(installDate => {return packageDates[installDate].lastStatus === 'proposed'});
            proposedDate[idOrderPackagePair] = proposed ? moment(proposed).format('Do MMM, YYYY') : '';
        }

        if(installCompanies) {
            availableCompanies[idOrderPackagePair] = idOrderPackagePair in installCompanies.available ? installCompanies.available[idOrderPackagePair] : [];
            selectedCompanies[idOrderPackagePair] = idOrderPackagePair in installCompanies.selected ? installCompanies.selected[idOrderPackagePair] : {};
            if (idOrderPackagePair in selectedCompanies && Object.keys(selectedCompanies[idOrderPackagePair]).length > 0) {
                installationCompany[idOrderPackagePair] = selectedCompanies[idOrderPackagePair];
            }
        }

        isPreliminaryInstallationDate[idOrderPackagePair] = areAllShippingDatesConfirmed && orderPackage.idOrder in areAllShippingDatesConfirmed ? !areAllShippingDatesConfirmed[orderPackage.idOrder] : true;
        const isSchedulingDisabled = (idOrder in areComponentsDisabled && areComponentsDisabled[idOrder]) || (isInstallationSet && !isInstallationSet[idOrderPackagePair]);

        const installationParams = {
            idOrder,
            idOrderPackagePair,
            orderPackage,
            installCompanies,
            isComponentDisabled,
            earliestInstallDate,
            confirmationDates,
            isThisComponentDisabled: areComponentsDisabled[idOrder],
            availableCompanies,
            selectedCompanies,
            installationCompany,
            isSchedulingDisabled,
            isInstallationSet,
            isPreliminaryInstallationDate,
            acceptedDate,
            proposedDate
        };

        return (
            <span id="installation-scheduler-container">
                { noOfPackages === 1
                    ? this.openDialogInstallContent(installationParams)
                    : <Row className="package-installation-row">
                        <Col xl="7" id={"package-name-" + orderPackage.idOrder + '-' + orderPackage.idPackage}>
                            {orderPackage.packageName}
                        </Col>
                        <Col xl="5">
                            <div className="subtitle">
                            {
                                isInstallationInPackage && isInstallationInPackage[idOrderPackagePair] === false
                                ? <span>{orderTexts.labels.INSTALLATION_NOT_REQUIRED}</span>
                                : isPreliminaryInstallationDate[idOrderPackagePair]
                                    ? <span>{orderTexts.labels.PRELIMINARY_INSTALLATION_DATE_LABEL}: </span>
                                    : <span>{orderTexts.labels.INSTALLATION_DATE}: </span>
                            }
                            </div>
                            <div id={"installation-scheduler-container-" + idOrderPackagePair} className="install-date-text">
                                {
                                    isSchedulingDisabled
                                    ? acceptedDate[idOrderPackagePair]
                                        ? acceptedDate[idOrderPackagePair]
                                        : proposedDate[idOrderPackagePair]
                                            ? proposedDate[idOrderPackagePair]
                                            : (isInstallationInPackage[idOrderPackagePair] && !proposedDate[idOrderPackagePair] && !acceptedDate[idOrderPackagePair]) && orderTexts.labels.NOT_SET
                                    : <span className="check-installation-dates"
                                        onClick={() => this.openDialogInstallContent(installationParams)}>
                                        {
                                            acceptedDate[idOrderPackagePair]
                                                ? acceptedDate[idOrderPackagePair]
                                                : proposedDate[idOrderPackagePair]
                                                    ? proposedDate[idOrderPackagePair]
                                                    : (isInstallationInPackage[idOrderPackagePair] && !proposedDate[idOrderPackagePair] && !acceptedDate[idOrderPackagePair]) && orderTexts.labels.NOT_SET
                                        }
                                    </span>
                                }
                                {
                                    isInstallationInPackage[idOrderPackagePair] &&
                                    <span>
                                        <i className="scheduled-date-btn fa fa-info-circle"
                                            id={'scheduled-date-' + idOrderPackagePair}
                                            onClick={this.toggle}></i>
                                        <Popover placement="bottom"
                                                isOpen={this.state.popoverOpen}
                                                target={'scheduled-date-' + idOrderPackagePair}
                                                container={"installation-scheduler-container-" + idOrderPackagePair}
                                                className="scheduled-date-popover"
                                                toggle={this.toggle}>
                                           <PopoverBody>
                                           {
                                               isPreliminaryInstallationDate[idOrderPackagePair]
                                                    ? acceptedDate[idOrderPackagePair]
                                                        ? orderTexts.labels.PRELIMINARY_INSTALLATION_DATE
                                                        : orderTexts.labels.INSTALLATION_DATE_NOT_SET
                                                    : acceptedDate[idOrderPackagePair]
                                                        ? orderTexts.labels.INSTALLATION_DATE_ACCEPTED
                                                        : orderTexts.labels.INSTALLATION_DATE_NOT_SET
                                            }
                                           </PopoverBody>
                                        </Popover>
                                    </span>
                                }
                            </div>
                        </Col>
                    </Row>
                }
            </span>
        );
    }
}

const mapStateToProps = (state) => ({
    isNextStepWanted: state.processReducer.isNextStepWanted,
    isComponentDisabled: state.processReducer.isComponentDisabled,
    earliestInstallDate: state.processReducer.earliestInstallDate,
    confirmationDates: state.processReducer.confirmationDates,
    installCompanies: state.processReducer.installCompanies
});

export default connect(mapStateToProps)(InstallationSchedulingForPackages);
