09/04/2024 - 15h19
parent
63f584336a
commit
e5a216d744
|
@ -44,10 +44,9 @@ import Autocomplete from '@mui/material/Autocomplete';
|
|||
import { gridClasses } from '@mui/x-data-grid';
|
||||
import { PiDotsThree } from "react-icons/pi";
|
||||
import Link from '@mui/material/Link';
|
||||
import { CiCircleMinus } from "react-icons/ci";
|
||||
import { LiaSave } from "react-icons/lia";
|
||||
|
||||
import { IoMdAddCircleOutline } from "react-icons/io";
|
||||
import { IoMdAddCircleOutline, IoMdRemoveCircleOutline } from "react-icons/io";
|
||||
|
||||
const Partner_Config_Formulaires = (props) => {
|
||||
|
||||
|
@ -184,6 +183,7 @@ const Partner_Config_Formulaires = (props) => {
|
|||
{ field: '_id', headerName: '_id', hide: true },
|
||||
{ field: 'id', headerName: 'id', hide: true },
|
||||
{ field: 'list_choix', headerName: 'list_choix', hide: true },
|
||||
{ field: 'list_case_cocher', headerName: 'list_case_cocher', hide: true },
|
||||
{ field: 'question', headerName: 'question', flex: 1, hide: false, editable: false, renderCell: (params) => <ExpandableCell_50 {...params} />, },
|
||||
{ field: 'type', headerName: 'type', flex: 1, hide: false, editable: false, renderCell: (params) => <ExpandableCell_50 {...params} />, },
|
||||
{ field: 'max_note', headerName: 'max_note', flex: 1, hide: true, editable: false, renderCell: (params) => <ExpandableCell_50 {...params} />, },
|
||||
|
@ -478,6 +478,9 @@ const Partner_Config_Formulaires = (props) => {
|
|||
const [p_detail_from_commentaire, setp_detail_from_commentaire] = useState("");
|
||||
const [p_detail_from_list_question, setp_detail_from_list_question] = useState([]);
|
||||
|
||||
const [p_detail_from_list_check_box, setp_detail_from_list_check_box] = useState([]);
|
||||
|
||||
|
||||
const [p_detail_from_message_intro, setp_detail_from_message_intro] = useState("");
|
||||
const [p_detail_from_type, setp_detail_from_type] = useState("");
|
||||
|
||||
|
@ -551,10 +554,14 @@ const Partner_Config_Formulaires = (props) => {
|
|||
setp_detail_from_message_intro(mylocal_form_data.message_introduction);
|
||||
|
||||
|
||||
setp_detail_from_list_check_box([]);
|
||||
if (mylocal_form_data.list_case_cocher) {
|
||||
setp_detail_from_list_check_box(mylocal_form_data.list_case_cocher);
|
||||
}
|
||||
|
||||
setp_detail_from_list_question([]);
|
||||
if (mylocal_form_data.list_questions) {
|
||||
setp_detail_from_list_question(mylocal_form_data.list_questions);
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
@ -731,6 +738,7 @@ const Partner_Config_Formulaires = (props) => {
|
|||
{ "id": "bool", "label": "Oui/Non", "value": "bool" },
|
||||
{ "id": "entier", "label": "Entier", "value": "entier" },
|
||||
{ "id": "qcm", "label": "Qcm", "value": "qcm" },
|
||||
{ "id": "checkbox", "label": "Case à cocher", "value": "checkbox" },
|
||||
{ "id": "", "label": "", "value": "" },
|
||||
]
|
||||
|
||||
|
@ -957,6 +965,7 @@ const Partner_Config_Formulaires = (props) => {
|
|||
setDialog_Question_open(true);
|
||||
|
||||
settab_qcm_choix([]);
|
||||
settab_checkbox_choix([]);
|
||||
|
||||
}
|
||||
|
||||
|
@ -993,6 +1002,19 @@ const Partner_Config_Formulaires = (props) => {
|
|||
}
|
||||
form.append("list_choix", JSON.stringify(local_list_choix));
|
||||
|
||||
|
||||
var local_list_checkbox = []
|
||||
for (let i = 0; i < tab_checkbox_choix.length; i++) {
|
||||
var choix = "reponse";
|
||||
var val = String(tab_checkbox_choix[i])
|
||||
var node = {};
|
||||
node[choix] = val;
|
||||
local_list_checkbox.push(node);
|
||||
}
|
||||
form.append("list_case_cocher", JSON.stringify(local_list_checkbox));
|
||||
|
||||
|
||||
|
||||
if (String(selected_question_id).length > 2) {
|
||||
form.append("question_id", selected_question_id);
|
||||
}
|
||||
|
@ -1156,6 +1178,31 @@ const Partner_Config_Formulaires = (props) => {
|
|||
}
|
||||
|
||||
|
||||
const [tab_checkbox_choix, settab_checkbox_choix] = useState([]);
|
||||
const [add_new_checkbox_choix, setadd_new_checkbox_choix] = useState("");
|
||||
const [new_checkbox_choix_value, setnew_checkbox_choix_value] = useState("");
|
||||
|
||||
function add_new_list_to_checkbox() {
|
||||
var current_tab_checkbox_choix = tab_checkbox_choix;
|
||||
current_tab_checkbox_choix.push(new_checkbox_choix_value);
|
||||
settab_checkbox_choix(current_tab_checkbox_choix);
|
||||
setnew_checkbox_choix_value("");
|
||||
}
|
||||
|
||||
|
||||
function remove_last_list_to_checkbox() {
|
||||
var current_tab_checkbox_choix = tab_checkbox_choix;
|
||||
|
||||
var new_current_tab_checkbox_choix = [];
|
||||
for (let i = 0; i < current_tab_checkbox_choix.length - 1; i++)
|
||||
new_current_tab_checkbox_choix.push(current_tab_checkbox_choix[i]);
|
||||
|
||||
current_tab_checkbox_choix.pop();
|
||||
setnew_checkbox_choix_value("");
|
||||
settab_checkbox_choix(new_current_tab_checkbox_choix);
|
||||
}
|
||||
|
||||
|
||||
|
||||
return (
|
||||
<div className="partner_configuration_technique">
|
||||
|
@ -1174,7 +1221,7 @@ const Partner_Config_Formulaires = (props) => {
|
|||
>
|
||||
|
||||
<DialogTitle>MySy Information</DialogTitle>
|
||||
<DialogContent className="DialogContent_width" style={{ "minHeight": "20rem" }}>
|
||||
<DialogContent className="DialogContent_width" style={{ "minHeight": "25rem" }}>
|
||||
|
||||
<DialogContentText>
|
||||
{Dialog_Question_message}
|
||||
|
@ -1273,15 +1320,15 @@ const Partner_Config_Formulaires = (props) => {
|
|||
/>
|
||||
</div>
|
||||
))}
|
||||
<nav className="icone_bton_add_reduce" onClick={(event) => {
|
||||
<nav className="session_caract_Dialog_icone_bton_add_reduce" onClick={(event) => {
|
||||
setadd_new_qcm_choix("1")
|
||||
}}>
|
||||
<IoMdAddCircleOutline /> add</nav>
|
||||
<IoMdAddCircleOutline /> Ajouter un choix</nav>
|
||||
|
||||
<nav className="icone_bton_add_reduce" onClick={(event) => {
|
||||
<nav className="session_caract_Dialog_icone_bton_add_reduce" onClick={(event) => {
|
||||
remove_last_list_to_qcm();
|
||||
setadd_new_qcm_choix("");
|
||||
}} > <CiCircleMinus /> remove</nav>
|
||||
}} > <IoMdRemoveCircleOutline /> Supprimer un choix</nav>
|
||||
|
||||
{add_new_qcm_choix && String(add_new_qcm_choix) === "1" &&
|
||||
|
||||
|
@ -1301,16 +1348,79 @@ const Partner_Config_Formulaires = (props) => {
|
|||
}
|
||||
}
|
||||
/>
|
||||
<LiaSave onClick={(event) => {
|
||||
<nav className="session_caract_Dialog_icone_bton_add_reduce" onClick={(event) => {
|
||||
setadd_new_qcm_choix("");
|
||||
add_new_list_to_qcm();
|
||||
}} className="icone_bton_add_reduce"> record </LiaSave>
|
||||
}}> <LiaSave /> Enregistrer
|
||||
</nav>
|
||||
</div>
|
||||
}
|
||||
|
||||
</div>}
|
||||
|
||||
|
||||
|
||||
{String(question_type) === "checkbox" && <div className="session_caract_Dialog" > checkbox
|
||||
|
||||
{tab_checkbox_choix &&
|
||||
tab_checkbox_choix.map((choix) => (
|
||||
<div>
|
||||
|
||||
<TextField
|
||||
|
||||
value={choix}
|
||||
autoFocus
|
||||
margin="dense"
|
||||
id="field_question_checkbox"
|
||||
name="field_question_checkbox"
|
||||
|
||||
fullWidth
|
||||
onChange={(e) => {
|
||||
// setquestion_max_note(e.target.value);
|
||||
|
||||
}
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
<nav className="session_caract_Dialog_icone_bton_add_reduce" onClick={(event) => {
|
||||
setadd_new_checkbox_choix("1")
|
||||
}}>
|
||||
<IoMdAddCircleOutline /> Ajouter un choix</nav>
|
||||
|
||||
<nav className="session_caract_Dialog_icone_bton_add_reduce" onClick={(event) => {
|
||||
remove_last_list_to_checkbox();
|
||||
setadd_new_checkbox_choix("");
|
||||
}} > <IoMdRemoveCircleOutline /> Supprimer un choix</nav>
|
||||
|
||||
{add_new_checkbox_choix && String(add_new_checkbox_choix) === "1" &&
|
||||
|
||||
<div>
|
||||
<TextField
|
||||
autoFocus
|
||||
margin="dense"
|
||||
id="field_question_checkbox_new"
|
||||
name="field_question_checkbox_new"
|
||||
|
||||
fullWidth
|
||||
|
||||
value={new_checkbox_choix_value}
|
||||
onChange={(e) => {
|
||||
setnew_checkbox_choix_value(e.target.value);
|
||||
|
||||
}
|
||||
}
|
||||
/>
|
||||
<nav className="session_caract_Dialog_icone_bton_add_reduce" onClick={(event) => {
|
||||
setadd_new_checkbox_choix("");
|
||||
add_new_list_to_checkbox();
|
||||
}}> <LiaSave /> Enregistrer
|
||||
</nav>
|
||||
</div>
|
||||
}
|
||||
|
||||
</div>}
|
||||
|
||||
</DialogContent>
|
||||
|
||||
<DialogActions>
|
||||
|
@ -1940,6 +2050,7 @@ const Partner_Config_Formulaires = (props) => {
|
|||
type: (item).type,
|
||||
max_note: (item).max_note,
|
||||
list_choix: (item).list_choix,
|
||||
list_case_cocher: (item).list_case_cocher,
|
||||
|
||||
|
||||
}
|
||||
|
@ -1956,12 +2067,24 @@ const Partner_Config_Formulaires = (props) => {
|
|||
setquestion_type(newSelectionModel.row.type);
|
||||
setquestion_max_note(newSelectionModel.row.max_note);
|
||||
|
||||
if (newSelectionModel.row.list_choix) {
|
||||
var tmp_tab = []
|
||||
for (let i = 0; i < newSelectionModel.row.list_choix.length; i++) {
|
||||
tmp_tab.push(newSelectionModel.row.list_choix[i]['reponse_qcm']);
|
||||
}
|
||||
|
||||
settab_qcm_choix(tmp_tab);
|
||||
}
|
||||
|
||||
console.log(" ")
|
||||
if (newSelectionModel.row.list_case_cocher) {
|
||||
var tmp_tab_checkbox = []
|
||||
for (let i = 0; i < newSelectionModel.row.list_case_cocher.length; i++) {
|
||||
tmp_tab_checkbox.push(newSelectionModel.row.list_case_cocher[i]['reponse_checkbox']);
|
||||
|
||||
}
|
||||
|
||||
settab_checkbox_choix(tmp_tab_checkbox);
|
||||
}
|
||||
|
||||
setDialog_Question_open(true);
|
||||
|
||||
|
|
|
@ -53,6 +53,7 @@ import FormControl from '@mui/material/FormControl';
|
|||
import FormLabel from '@mui/material/FormLabel';
|
||||
import Radio from '@mui/material/Radio';
|
||||
import { daDK } from "@mui/material/locale";
|
||||
import Checkbox from '@mui/material/Checkbox';
|
||||
|
||||
function SurveyDocument() {
|
||||
|
||||
|
@ -151,6 +152,10 @@ function SurveyDocument() {
|
|||
|
||||
var is_empty_field = 0;
|
||||
|
||||
console.log(" tab_variable = ", tab_variable);
|
||||
|
||||
|
||||
|
||||
for (let i = 0; i < Object.keys(tab_variable).length; i++) {
|
||||
|
||||
var key = Object.keys(tab_variable)[i];
|
||||
|
@ -211,6 +216,92 @@ function SurveyDocument() {
|
|||
|
||||
}
|
||||
|
||||
const [value, setValue] = React.useState('female');
|
||||
|
||||
const handleChange = (event) => {
|
||||
setValue(event.target.value);
|
||||
};
|
||||
|
||||
|
||||
|
||||
const [selected_qcm_value, setselected_qcm_value] = React.useState('');
|
||||
const handleChange_qcm = (event) => {
|
||||
|
||||
console.log(" event.target.name ", event.target.name);
|
||||
|
||||
document.getElementsByName(event.target.name)[0].value = event.target.value;
|
||||
|
||||
// setselected_qcm_value(event.target.value);
|
||||
change_survey_data(event.target);
|
||||
};
|
||||
|
||||
const [selected_checkbox_value, setselected_checkbox_value] = React.useState('');
|
||||
const handleChange_checkbox = (event) => {
|
||||
var tmp_variable = tab_variable;
|
||||
var tab = String(event.target.name).split(":");
|
||||
|
||||
var al = String(tab[0]);
|
||||
|
||||
if (event.currentTarget.checked) {
|
||||
console.log('checked');
|
||||
if (!tmp_variable[al] || String(tmp_variable[al]) === "") {
|
||||
console.log(" première action ");
|
||||
var t = [];
|
||||
t.push(String(tab[1]));
|
||||
} else {
|
||||
console.log(" PASSS première action ");
|
||||
var t = tmp_variable[al];
|
||||
t.push(String(tab[1]));
|
||||
}
|
||||
|
||||
|
||||
tmp_variable[al] = t;
|
||||
|
||||
console.log(" sortirrr tmp_variable = ", tmp_variable);
|
||||
settab_variable(tmp_variable);
|
||||
|
||||
console.log(" ### sortir settab_variable = ", tab_variable);
|
||||
|
||||
|
||||
}
|
||||
else {
|
||||
console.log('not checked');
|
||||
|
||||
if (!tmp_variable[al] || String(tmp_variable[al]) === "") {
|
||||
console.log(" première action ");
|
||||
|
||||
} else {
|
||||
|
||||
|
||||
|
||||
console.log(" PASSS première action ");
|
||||
|
||||
console.log(" Suppression de ", String(tab[1]));
|
||||
|
||||
var new_variable = []
|
||||
for (let i = 0; i < tmp_variable[al].length; i++) {
|
||||
if (String(tmp_variable[al][i]) !== String(tab[1])) {
|
||||
new_variable.push(String(tmp_variable[al][i]))
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
tmp_variable[al] = new_variable;
|
||||
|
||||
console.log(" tmp_variable ", tmp_variable);
|
||||
|
||||
settab_variable(tmp_variable);
|
||||
console.log(" ### sortir settab_variable = ", tab_variable);
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
console.log(" ### FINNNNNN settab_variable = ", tab_variable);
|
||||
};
|
||||
|
||||
|
||||
|
||||
return (
|
||||
<div className="surveydocument">
|
||||
|
||||
|
@ -249,11 +340,9 @@ function SurveyDocument() {
|
|||
{JSON.parse(get_Given_Survey_Data_result).list_questions && JSON.parse(get_Given_Survey_Data_result).list_questions.length > 0 &&
|
||||
JSON.parse(get_Given_Survey_Data_result).list_questions.map((question, index) => (
|
||||
<div>
|
||||
|
||||
<div className="question_box">
|
||||
<nav style={{ width: "100%", "float": "left" }}> <nav style={{ width: "5%", "float": "left" }}> N° {index + 1}. </nav> <nav style={{ fontSize: '16px', "fontWeight": '600', "float": "left", 'color': '#34495E' }}> {question.question} </nav> </nav><br />
|
||||
|
||||
|
||||
{question.type && String(question.type) === "text" &&
|
||||
<TextField
|
||||
margin="dense"
|
||||
|
@ -331,12 +420,54 @@ function SurveyDocument() {
|
|||
|
||||
</RadioGroup>
|
||||
</FormControl>
|
||||
|
||||
|
||||
</div>
|
||||
}
|
||||
|
||||
|
||||
{question.type && String(question.type) === "qcm" &&
|
||||
<div id={question._id}
|
||||
name={question._id}>
|
||||
<FormControl>
|
||||
|
||||
<RadioGroup
|
||||
aria-labelledby="demo-controlled-radio-buttons-group"
|
||||
name={question._id}
|
||||
//value={selected_qcm_value}
|
||||
onChange={handleChange_qcm}
|
||||
>
|
||||
{question.list_choix &&
|
||||
question.list_choix.map((list_choix, index) => (
|
||||
|
||||
<FormControlLabel value={list_choix.reponse_qcm} control={<Radio />} label={index + ". " + list_choix.reponse_qcm} />
|
||||
))}
|
||||
</RadioGroup>
|
||||
</FormControl>
|
||||
|
||||
|
||||
</div>}
|
||||
|
||||
|
||||
{question.type && String(question.type) === "checkbox" &&
|
||||
<div id={question._id}
|
||||
name={question._id}>
|
||||
<FormControl>
|
||||
|
||||
<RadioGroup
|
||||
aria-labelledby="demo-controlled-radio-buttons-group"
|
||||
|
||||
>
|
||||
{question.list_case_cocher &&
|
||||
question.list_case_cocher.map((case_cocher, index) => (
|
||||
<FormControlLabel control={<Checkbox />} id={question._id + ":" + case_cocher.reponse_checkbox} name={question._id + ":" + case_cocher.reponse_checkbox} onChange={handleChange_checkbox} label={index + ". " + case_cocher.reponse_checkbox} />
|
||||
|
||||
))}
|
||||
</RadioGroup>
|
||||
</FormControl>
|
||||
|
||||
|
||||
</div>}
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
{/*
|
||||
|
|
|
@ -2693,6 +2693,11 @@
|
|||
background-color: #FFFFFF;
|
||||
}
|
||||
|
||||
.session_caract_Dialog_icone_bton_add_reduce {
|
||||
font-size: large;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.css-1v4ccyo {
|
||||
|
|
Loading…
Reference in New Issue