Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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