07/04/2024 - 19h19
parent
dd228700f6
commit
1facc7163b
|
@ -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) => <ExpandableCell_50 {...params} />, },
|
||||
{ field: 'nom', headerName: 'nom', 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: 'description', headerName: 'description', flex: 1, hide: true, editable: false, renderCell: (params) => <ExpandableCell_50 {...params} />, },
|
||||
{ field: 'commentaire', headerName: 'commentaire', flex: 1, hide: true, editable: false, renderCell: (params) => <ExpandableCell_50 {...params} />, },
|
||||
|
||||
|
||||
{
|
||||
|
@ -142,12 +146,43 @@ const Partner_Config_Formulaires = (props) => {
|
|||
|
||||
|
||||
|
||||
function ExpandableCell_50({ value }) {
|
||||
const [expanded, setExpanded] = React.useState(false);
|
||||
|
||||
return (
|
||||
<nav>
|
||||
{value && <div style={{ paddingLeft: "5px", paddingRight: "15px", "display": "block", wordBreak: "break-all" }}>
|
||||
|
||||
{expanded ? value : String(value).slice(0, 50)}
|
||||
{value.length > 50 && (
|
||||
// eslint-disable-next-line jsx-a11y/anchor-is-valid
|
||||
<Link
|
||||
type="button"
|
||||
component="button"
|
||||
sx={{ fontSize: 'inherit' }}
|
||||
onClick={() => setExpanded(!expanded)}
|
||||
>
|
||||
{expanded ? <nav> <PiDotsThree />Réduire</nav> : <nav> <PiDotsThree />Voir</nav>}
|
||||
</Link>
|
||||
)}
|
||||
</div>}
|
||||
|
||||
{!value && <div style={{ paddingLeft: "5px", paddingRight: "15px", "display": "block", wordBreak: "break-all" }}>
|
||||
|
||||
</div>
|
||||
}
|
||||
</nav>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
|
||||
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) => <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} />, },
|
||||
|
||||
{
|
||||
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,
|
||||
},
|
||||
|
||||
|
||||
|
||||
}}
|
||||
>
|
||||
<DataGrid
|
||||
checkboxSelection
|
||||
onSelectionModelChange={(newSelectionModel) => {
|
||||
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}
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
{ New_Option_type_Formulaire.length > 0 && <div className="session_caract"> Type <br />
|
||||
|
||||
{New_Option_type_Formulaire.length > 0 && <div className="session_caract"> Type <br />
|
||||
<TextField
|
||||
sx={{ '& legend': { display: 'none' }, '& fieldset': { top: 0 }, }}
|
||||
required
|
||||
|
@ -1676,11 +1706,11 @@ const Partner_Config_Formulaires = (props) => {
|
|||
}}
|
||||
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}
|
||||
/>
|
||||
</div>}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<div className="session_caract"> Nom <br />
|
||||
|
@ -1750,8 +1780,13 @@ const Partner_Config_Formulaires = (props) => {
|
|||
|
||||
|
||||
<div className="div_row" style={{ "padding": "10px" }}>
|
||||
Questionnaire <br />
|
||||
|
||||
|
||||
<div className="div_row" style={{ "textAlign": "right", "marginTop": "0.5rem" }}>
|
||||
<Button className="bton_emarge" style={{ "minWidth": "10rem" }} onClick={(event) => {
|
||||
Ajouter_Question();
|
||||
}}>Ajout 1 Question </Button>
|
||||
</div>
|
||||
|
||||
{p_detail_from_list_question && p_detail_from_list_question.length > 0 && <div style={{ height: 550, width: '100%', paddingRight: '5px' }}>
|
||||
|
||||
|
@ -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) => {
|
|||
</div>
|
||||
|
||||
<div className="div_row" style={{ "padding": "10px" }}>
|
||||
Questionnaire <br />
|
||||
|
||||
|
||||
<div className="div_row" style={{ "textAlign": "right", "marginTop": "0.5rem" }}>
|
||||
|
||||
|
||||
<Button className="bton_emarge" onClick={(event) => {
|
||||
<Button className="bton_emarge" style={{ "minWidth": "10rem" }} onClick={(event) => {
|
||||
Ajouter_Question();
|
||||
}}>Ajouter </Button>
|
||||
}}>Ajout 1 Question </Button>
|
||||
</div>
|
||||
|
||||
{p_detail_from_list_question && p_detail_from_list_question.length > 0 && <div style={{ height: 550, width: '100%', paddingRight: '5px' }}>
|
||||
|
@ -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,
|
||||
},
|
||||
|
||||
}}
|
||||
>
|
||||
|
|
|
@ -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() {
|
|||
|
||||
<div style={{ "width": "80%", "marginLeft": "10%", "background": "#F2F4F4", overflow: "auto", "paddingBottom": "1rem" }}>
|
||||
<br />
|
||||
<div className="question_box_introduction">
|
||||
{JSON.parse(get_Given_Survey_Data_result).message_introduction}
|
||||
</div>
|
||||
|
||||
<br />
|
||||
|
||||
|
||||
<div className="question_box_entete">
|
||||
Formation : {JSON.parse(get_Given_Survey_Data_result).class_title} <br />
|
||||
session_code : {JSON.parse(get_Given_Survey_Data_result).session_code} <br />
|
||||
session_title : {JSON.parse(get_Given_Survey_Data_result).session_title} <br />
|
||||
session_code_date_debut : {JSON.parse(get_Given_Survey_Data_result).session_code_date_debut} <br />
|
||||
session_code_date_fin : {JSON.parse(get_Given_Survey_Data_result).session_code_date_fin} <br />
|
||||
Code Session : {JSON.parse(get_Given_Survey_Data_result).session_code} <br />
|
||||
Titre Session : {JSON.parse(get_Given_Survey_Data_result).session_title} <br />
|
||||
Date début : {JSON.parse(get_Given_Survey_Data_result).session_code_date_debut} <br />
|
||||
Date fin : {JSON.parse(get_Given_Survey_Data_result).session_code_date_fin} <br />
|
||||
</div>
|
||||
|
||||
{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) => (
|
||||
<div>
|
||||
|
||||
<div className="question_box">
|
||||
{question.question} <br />
|
||||
<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" &&
|
||||
|
@ -278,24 +285,36 @@ function SurveyDocument() {
|
|||
</div>
|
||||
}
|
||||
|
||||
{question.type && String(question.type) === "entier" && question.max_note &&
|
||||
|
||||
|
||||
|
||||
{question.type && String(question.type) === "entier" &&
|
||||
<div id={question._id}
|
||||
name={question._id}>
|
||||
name={question._id}>
|
||||
|
||||
|
||||
<TextField
|
||||
margin="dense"
|
||||
fullWidth
|
||||
type="integer"
|
||||
name={question._id}
|
||||
id={question._id}
|
||||
|
||||
type="number"
|
||||
InputLabelProps={{
|
||||
shrink: true,
|
||||
}}
|
||||
inputProps={{ min: "0", step: "1" }}
|
||||
disabled={false}
|
||||
onChange={(e) => {
|
||||
change_survey_data(e.target);
|
||||
}}
|
||||
/>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
}
|
||||
{question.type && String(question.type) === "bool" &&
|
||||
<div id={question._id}
|
||||
name={question._id}>
|
||||
name={question._id}>
|
||||
<FormControl>
|
||||
|
||||
<RadioGroup
|
||||
|
@ -346,7 +365,9 @@ function SurveyDocument() {
|
|||
</div>
|
||||
|
||||
<div className="div_row_droite" style={{ "textAlign": 'right', 'marginRight': '15px' }} >
|
||||
<Button variant="contained" className="bton_annule" onClick={"annule_edit_formulaire"}>Annuler
|
||||
<Button variant="contained" className="bton_annule" onClick={(event) => {
|
||||
history.push("/");
|
||||
}} >Annuler
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue