Proyectos de Subversion LeadersLinked - Antes de SPA

import React, { useState } from "react";
import Option from "../option/Option";

const Question = (props) => {




    // get props
    const { question, backendVars, handleAnswer } = props;
    const [input] = useState(question.value); 

    return (
        <div className="col-md-12 col-sm-12 col-xs-12 np-padding">
            <div className="form-group" >
                <h6>{backendVars.LBL_QUESTION} #{question.position + 1}</h6>
                <div
                    dangerouslySetInnerHTML={{ __html: question.text }}
                    className="title"
                />
            </div>
            {question.type == 'open' &&
                <div className="form-group">
                    {question.multiline == 1 ? (
                        <textarea
                            className="form-control"
                            rows="5"
                            value={input}
                            maxLength={question.maxlength}
                            name={question.slug_question}
                            onChange={e =>
                                handleAnswer(question.slug_section, question.slug_question, e.target.value)
                            }
                        />
                    ) : (
                        <input
                            type="text"
                            className="form-control"
                            value={question.answer}
                            maxLength={question.maxlength}
                            name={question.slug_question}
                            onChange={e =>
                                handleAnswer(question.slug_section, question.slug_question, e.target.value)
                            }
                        />
                    )}
                </div>
            }
            {question.type == 'rating-range' &&
                <div className="form-group">
                    {[...Array(parseInt(question.range))].map((x, i) => {
                        return (
                            <div className="checkbox"
                                key={i}>
                                <input
                                    type="radio"
                                    checked={question.answer == i + 1}
                                    name={question.slug_question}
                                    value={i + 1}
                                    onChange={() =>
                                        handleAnswer(question.slug_section, question.slug_question, i + 1)
                                    }
                                />
                                <div className="option">
                                    {i + 1}
                                </div>
                            </div>
                        )
                    })}
                </div>
            }
            {(question.type == 'simple' || question.type == 'rating-open' || question.type == 'multiple') &&
                <div className="form-group">
                    {question.options.length > 0 &&
                        <Option
                            question={question}
                            handleAnswer={handleAnswer} />
                    }
                </div>
            }
        </div>
    )
}

export default Question;