Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 341 | Rev 344 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
306 geraldo 1
import React from "react";
2
import Section from "./section/Section";
3
import Spinner from "../../../shared/loading-spinner/Spinner";
4
 
5
const Test = (props) => {
6
 
7
    // get props
340 geraldo 8
    const { backendVars, test, loading, setTest, action  } = props;
306 geraldo 9
 
340 geraldo 10
 
11
    /**
12
     * Send form data
13
     */
14
    const handleSubmit = async () => {
15
        if (validateForm()) {
341 geraldo 16
            await axios.post(action, test).then((response) => {
340 geraldo 17
                if (response.data.success) {
18
                    console.info('Formulario almacenado');
19
                    setTest(null);
336 geraldo 20
                }
340 geraldo 21
            });
22
        }
23
    }
24
    /**
25
     * Update question answer
26
     * @param {*} slug_section
27
     * @param {*} slug_question
28
     * @param {*} answer
29
     */
30
    const handleAnswer = (slug_section, slug_question, answer) => {
31
        test.content.filter((section) => {
32
            if (section.slug_section == slug_section) {
33
                section.questions.map((question) => {
34
                    if (question.slug_question == slug_question) {
35
                        question.answer = answer;
36
                    }
37
                })
38
            }
343 geraldo 39
        });
40
        console.log(test);
340 geraldo 41
        setTest(test);
42
    }
43
    /**
44
     * Check if there are questions to answer
45
     * @returns
46
     */
47
    const validateForm = () => {
48
        let formValid = true;
49
        test.content.map((section) => {
50
            section.questions.map((question) => {
51
                if (!question.answer) {
52
                    console.error(`Debe ingresar una respuesta en la pregunta ${question.position + 1} de la sección ${section.name}`);
53
                    formValid = false;
54
                }
336 geraldo 55
            })
56
        })
340 geraldo 57
 
58
        return formValid;
306 geraldo 59
    }
60
 
340 geraldo 61
 
306 geraldo 62
    return (
63
        <div>
64
            {loading ? (
65
                <div className="row">
66
                    <Spinner />
67
                </div>
68
            ) : (
311 geraldo 69
                <div className="row test-section">
340 geraldo 70
                    <div className="col-md-12 col-sm-12 col-xs-12">
71
                        <div className="company-title">
72
                            <div className="section_admin_title_buttons">
73
                                <h1 className="title">{test.name}</h1>
307 geraldo 74
                            </div>
306 geraldo 75
                        </div>
340 geraldo 76
                        <div
77
                            dangerouslySetInnerHTML={{ __html: test.text }}
78
                            className="description company-title"
79
                        ></div>
80
                    </div>
81
                    <div className="col-md-12 col-sm-12 col-xs-12">
82
                        <div className="company-title">
83
                            {test.content.map((section, key) => {
84
                                return <Section
85
                                    section={section}
86
                                    key={key}
87
                                    backendVars={backendVars}
88
                                    handleAnswer={handleAnswer}
89
                                />
90
                            })}
306 geraldo 91
                        </div>
340 geraldo 92
                    </div>
93
                    <div className="col-md-12 col-sm-12 col-xs-12">
94
                        <div className="company-title">
95
                            <button type="button" className="btn btn-danger" onClick={() => setTest(null)}>{backendVars.LBL_CANCEL}</button>
96
                            <button type="buttton" className="btn btn-success" onClick={() => handleSubmit()}>{backendVars.LBL_SAVE}</button>
307 geraldo 97
                        </div>
340 geraldo 98
                    </div>
306 geraldo 99
                </div>
100
            )}
101
        </div>
102
    )
103
}
104
 
105
export default Test;