09/04/2024 - 15h19

recette2
cherif 2024-04-09 15:28:31 +02:00
parent 63f584336a
commit e5a216d744
3 changed files with 285 additions and 26 deletions

View File

@ -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);

View File

@ -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>
{/*

View File

@ -2693,6 +2693,11 @@
background-color: #FFFFFF;
}
.session_caract_Dialog_icone_bton_add_reduce {
font-size: large;
cursor: pointer;
}
.css-1v4ccyo {