From 1facc7163bc630e734ef36e1b3a3da1e7067bb68 Mon Sep 17 00:00:00 2001 From: cherif Date: Sun, 7 Apr 2024 19:05:54 +0200 Subject: [PATCH] 07/04/2024 - 19h19 --- src/components/Partner_Config_Formulaires.js | 161 +++++++++++-------- src/components/SurveyDocument.js | 51 ++++-- src/styles/components/_surveydocument.scss | 125 ++++++++++++++ 3 files changed, 256 insertions(+), 81 deletions(-) diff --git a/src/components/Partner_Config_Formulaires.js b/src/components/Partner_Config_Formulaires.js index 95c38b4..88d69c7 100644 --- a/src/components/Partner_Config_Formulaires.js +++ b/src/components/Partner_Config_Formulaires.js @@ -41,6 +41,10 @@ import { TransitionProps } from '@mui/material/transitions'; import img_loading_spin from "./../mysy_img/mysy_spin_loading.gif"; import { IoAddCircleOutline, IoCloseCircleOutline } from "react-icons/io5"; 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'; + const Partner_Config_Formulaires = (props) => { @@ -70,11 +74,11 @@ const Partner_Config_Formulaires = (props) => { const columns = [ { field: '_id', headerName: '_id', hide: true }, { field: 'id', headerName: 'id', hide: true }, - { field: 'code', headerName: 'code', flex: 1, hide: false, editable: false }, - { field: 'nom', headerName: 'nom', flex: 1, hide: false, editable: false }, - { field: 'type', headerName: 'Type', flex: 1, hide: false, editable: false }, - { field: 'description', headerName: 'description', flex: 1, hide: true, editable: false }, - { field: 'commentaire', headerName: 'commentaire', flex: 1, hide: true, editable: false }, + { field: 'code', headerName: 'code', flex: 1, hide: false, editable: false , renderCell: (params) => , }, + { field: 'nom', headerName: 'nom', flex: 1, hide: false, editable: false, renderCell: (params) => , }, + { field: 'type', headerName: 'Type', flex: 1, hide: false, editable: false, renderCell: (params) => , }, + { field: 'description', headerName: 'description', flex: 1, hide: true, editable: false, renderCell: (params) => , }, + { field: 'commentaire', headerName: 'commentaire', flex: 1, hide: true, editable: false, renderCell: (params) => , }, { @@ -142,12 +146,43 @@ const Partner_Config_Formulaires = (props) => { + function ExpandableCell_50({ value }) { + const [expanded, setExpanded] = React.useState(false); + + return ( + + ); + } + + + const columns_question = [ { field: '_id', headerName: '_id', hide: true }, { field: 'id', headerName: 'id', hide: true }, - { field: 'question', headerName: 'question', flex: 1, hide: false, editable: false }, - { field: 'type', headerName: 'type', flex: 1, hide: false, editable: false }, - { field: 'max_note', headerName: 'max_note', flex: 1, hide: true, editable: false }, + { field: 'question', headerName: 'question', flex: 1, hide: false, editable: false, renderCell: (params) => , }, + { field: 'type', headerName: 'type', flex: 1, hide: false, editable: false, renderCell: (params) => , }, + { field: 'max_note', headerName: 'max_note', flex: 1, hide: true, editable: false, renderCell: (params) => , }, { field: "delete", headerName: 'Supprimer', @@ -691,7 +726,6 @@ const Partner_Config_Formulaires = (props) => { { "id": "note", "label": "Note ", "value": "note" }, { "id": "bool", "label": "Oui/Non", "value": "bool" }, { "id": "entier", "label": "Entier", "value": "entier" }, - { "id": "qcm", "label": "QCM", "value": "qcm" }, { "id": "", "label": "", "value": "" }, ] @@ -1494,41 +1528,37 @@ const Partner_Config_Formulaires = (props) => { width: '100%', paddingRight: '1px', - // Gestion des cellule "statut" - '& .cell--status--encours': { - backgroundColor: '#E6F7C8', - color: '#1a3e72', - fontWeight: 'light', - }, - '& .cell--status--traite': { - backgroundColor: '#E6CEAA', - color: '#F9E79F', - fontWeight: 'light', - }, - "& .MuiDataGrid-columnHeaders": { backgroundColor: "#c8cfd5", color: "black", fontSize: 14 }, + '& .line--statut--selected': { + backgroundColor: '#FBF2EF', + color: 'black', + }, + + '& .line--statut--pair': { + backgroundColor: 'rgba(235, 235, 235, .7)', + color: 'black', + }, + '& .line--statut--impair': { + backgroundColor: '#FFFFFF', + color: 'black', + }, [`& .${gridClasses.cell}`]: { + py: 1, + }, + + + }} > { setSelectionModel(newSelectionModel); - /* if (newSelectionModel.length === 1) - handleClick_edit_config_From_Line(newSelectionModel); - if (newSelectionModel.length !== 1) { - setp_detail_config_valeur(); - setp_detail_config_point(); - setconfig_data_changed(); - setconfig_data_edit_mode(); - setdisplay_detail_config(); - - - }*/ + }} selectionModel={selectionModel} @@ -1662,9 +1692,9 @@ const Partner_Config_Formulaires = (props) => { value={p_detail_from_code} /> - - { New_Option_type_Formulaire.length > 0 &&
Type
+ + {New_Option_type_Formulaire.length > 0 &&
Type
{ }} disabled={false} className="disabled_style" - value={New_Option_type_Formulaire.filter((data) => (data).value === String(p_detail_from_type))[0].label} + value={New_Option_type_Formulaire.filter((data) => (data).value === String(p_detail_from_type))[0].label} />
} - +
Nom
@@ -1750,8 +1780,13 @@ const Partner_Config_Formulaires = (props) => {
- Questionnaire
+ +
+ +
{p_detail_from_list_question && p_detail_from_list_question.length > 0 &&
  @@ -1761,23 +1796,21 @@ const Partner_Config_Formulaires = (props) => { width: '100%', paddingRight: '1px', - // Gestion des cellule "statut" - '& .cell--status--encours': { - backgroundColor: '#E6F7C8', - color: '#1a3e72', - fontWeight: 'light', - }, - '& .cell--status--traite': { - backgroundColor: '#E6CEAA', - color: '#F9E79F', - fontWeight: 'light', - }, - "& .MuiDataGrid-columnHeaders": { backgroundColor: "#c8cfd5", color: "black", fontSize: 14 }, + '& .line--statut--pair': { + backgroundColor: 'rgba(235, 235, 235, .7)', + color: 'black', + }, + '& .line--statut--impair': { + backgroundColor: '#FFFFFF', + color: 'black', + }, [`& .${gridClasses.cell}`]: { + py: 1, + }, }} > @@ -2012,14 +2045,12 @@ const Partner_Config_Formulaires = (props) => {
- Questionnaire
+
- - - + }}>Ajout 1 Question
{p_detail_from_list_question && p_detail_from_list_question.length > 0 &&
@@ -2030,23 +2061,21 @@ const Partner_Config_Formulaires = (props) => { width: '100%', paddingRight: '1px', - // Gestion des cellule "statut" - '& .cell--status--encours': { - backgroundColor: '#E6F7C8', - color: '#1a3e72', - fontWeight: 'light', - }, - '& .cell--status--traite': { - backgroundColor: '#E6CEAA', - color: '#F9E79F', - fontWeight: 'light', - }, - "& .MuiDataGrid-columnHeaders": { backgroundColor: "#c8cfd5", color: "black", fontSize: 14 }, + '& .line--statut--pair': { + backgroundColor: 'rgba(235, 235, 235, .7)', + color: 'black', + }, + '& .line--statut--impair': { + backgroundColor: '#FFFFFF', + color: 'black', + }, [`& .${gridClasses.cell}`]: { + py: 1, + }, }} > diff --git a/src/components/SurveyDocument.js b/src/components/SurveyDocument.js index 909360f..07094ce 100644 --- a/src/components/SurveyDocument.js +++ b/src/components/SurveyDocument.js @@ -158,14 +158,14 @@ function SurveyDocument() { document.getElementsByName(key)[0].style.backgroundColor = "#FFFFFF"; - if( String(val).length === 0 ){ + if (String(val).length === 0) { document.getElementsByName(key)[0].style.backgroundColor = "#F9E79F"; is_empty_field = 1; } } - if( is_empty_field === 1 ){ + if (is_empty_field === 1) { alert(" Le questionnaire n'est pas correctement rempli"); return; } @@ -231,20 +231,27 @@ function SurveyDocument() {

+
+ {JSON.parse(get_Given_Survey_Data_result).message_introduction} +
+ +
+ +
Formation : {JSON.parse(get_Given_Survey_Data_result).class_title}
- session_code : {JSON.parse(get_Given_Survey_Data_result).session_code}
- session_title : {JSON.parse(get_Given_Survey_Data_result).session_title}
- session_code_date_debut : {JSON.parse(get_Given_Survey_Data_result).session_code_date_debut}
- session_code_date_fin : {JSON.parse(get_Given_Survey_Data_result).session_code_date_fin}
+ Code Session : {JSON.parse(get_Given_Survey_Data_result).session_code}
+ Titre Session : {JSON.parse(get_Given_Survey_Data_result).session_title}
+ Date début : {JSON.parse(get_Given_Survey_Data_result).session_code_date_debut}
+ Date fin : {JSON.parse(get_Given_Survey_Data_result).session_code_date_fin}
{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) => ( + JSON.parse(get_Given_Survey_Data_result).list_questions.map((question, index) => (
- {question.question}
+
{question.type && String(question.type) === "text" && @@ -278,24 +285,36 @@ function SurveyDocument() {
} - {question.type && String(question.type) === "entier" && question.max_note && + + + + {question.type && String(question.type) === "entier" &&
+ name={question._id}> + + { change_survey_data(e.target); }} /> + +
} {question.type && String(question.type) === "bool" &&
+ name={question._id}>
-
diff --git a/src/styles/components/_surveydocument.scss b/src/styles/components/_surveydocument.scss index a4baae2..7314eda 100644 --- a/src/styles/components/_surveydocument.scss +++ b/src/styles/components/_surveydocument.scss @@ -706,6 +706,43 @@ .DialogContent_width { width: 200px !important; } + + .question_box { + box-shadow: 10px 10px 10px 10px rgb(0 0 0 / 15%); + width: 90%; + margin-left: 5%; + border-radius: 5px; + background: white; + padding: 10px; + margin-top: 2rem; + margin-bottom: 1rem; + } + + .question_box_entete { + width: 90%; + margin-left: 5%; + border-radius: 5px; + line-height: 2rem; + font-weight: 700; + letter-spacing: 1px; + padding: 10px; + margin-bottom: 1rem; + text-align: center; + color:#464b5e; + } + + .question_box_introduction { + width: 90%; + margin-left: 5%; + border-radius: 5px; + line-height: 2rem; + font-weight: 700; + letter-spacing: 1px; + padding: 10px; + margin-bottom: 1rem; + text-align: left; + color:#464b5e; + } } @media only screen and (min-width: 601px) and (max-width: 991px) { @@ -1322,6 +1359,43 @@ width: 500px !important; } + .question_box { + box-shadow: 10px 10px 10px 10px rgb(0 0 0 / 15%); + width: 90%; + margin-left: 5%; + border-radius: 5px; + background: white; + padding: 10px; + margin-top: 2rem; + margin-bottom: 1rem; + } + + .question_box_entete { + width: 90%; + margin-left: 5%; + border-radius: 5px; + line-height: 2rem; + font-weight: 700; + letter-spacing: 1px; + padding: 10px; + margin-bottom: 1rem; + text-align: center; + color:#464b5e; + } + + .question_box_introduction { + width: 90%; + margin-left: 5%; + border-radius: 5px; + line-height: 2rem; + font-weight: 700; + letter-spacing: 1px; + padding: 10px; + margin-bottom: 1rem; + text-align: left; + color:#464b5e; + } + } @media only screen and (min-width: 992px) and (max-width: 1199px) { @@ -1843,6 +1917,43 @@ width: 500px !important; } + .question_box { + box-shadow: 10px 10px 10px 10px rgb(0 0 0 / 15%); + width: 90%; + margin-left: 5%; + border-radius: 5px; + background: white; + padding: 10px; + margin-top: 2rem; + margin-bottom: 1rem; + } + + .question_box_entete { + width: 90%; + margin-left: 5%; + border-radius: 5px; + line-height: 2rem; + font-weight: 700; + letter-spacing: 1px; + padding: 10px; + margin-bottom: 1rem; + text-align: center; + color:#464b5e; + } + + .question_box_introduction { + width: 90%; + margin-left: 5%; + border-radius: 5px; + line-height: 2rem; + font-weight: 700; + letter-spacing: 1px; + padding: 10px; + margin-bottom: 1rem; + text-align: left; + color:#464b5e; + } + } @media only screen and (min-width: 1200px) { @@ -2512,6 +2623,20 @@ padding: 10px; margin-bottom: 1rem; text-align: center; + color:#464b5e; + } + + .question_box_introduction { + width: 90%; + margin-left: 5%; + border-radius: 5px; + line-height: 2rem; + font-weight: 700; + letter-spacing: 1px; + padding: 10px; + margin-bottom: 1rem; + text-align: left; + color:#464b5e; } }