19/05/2024 - 22h15

recette2
cherif 2024-05-19 22:15:08 +02:00
parent 8f1a903e07
commit 4ad155a6d4
4 changed files with 1646 additions and 105 deletions

View File

@ -2449,6 +2449,7 @@ const DisplayPartnerSession = (props) => {
const [selectionModel_insc, setSelectionModel_insc] = React.useState([]); const [selectionModel_insc, setSelectionModel_insc] = React.useState([]);
const [rowss_insc, setRows_insc] = useState([]); const [rowss_insc, setRows_insc] = useState([]);
const [rowss_preinsc, setRows_preinsc] = useState([]); const [rowss_preinsc, setRows_preinsc] = useState([]);
const [GetListePreinscrit_insc_api, setGetListePreinscrit_insc_api] = useState(); const [GetListePreinscrit_insc_api, setGetListePreinscrit_insc_api] = useState();
const [GetListePreinscrit_insc_meassage, setGetListePreinscrit_insc_meassage] = useState(); const [GetListePreinscrit_insc_meassage, setGetListePreinscrit_insc_meassage] = useState();
const [GetListePreinscrit_insc_result, setGetListePreinscrit_insc_result] = useState([]) const [GetListePreinscrit_insc_result, setGetListePreinscrit_insc_result] = useState([])

View File

@ -83,6 +83,23 @@ const Module_Selection_Evaluation_Apprenants = (props) => {
const [rowss, setRows] = useState([]); const [rowss, setRows] = useState([]);
var date_today_90j = new Date();
date_today_90j.setDate(date_today_90j.getDate() + 90);
const [p_filtre1, setp_filtre1] = useState("Inscrit ");
const [p_filtre1_value, setp_filtre1_value] = useState("");
const [p_filtre2, setp_filtre2] = useState("Type de groupe");
const [p_filtre2_value, setp_filtre2_value] = useState("");
const [p_filtre3, setp_filtre3] = useState("");
const [p_filtre3_value, setp_filtre3_value] = useState("");
const [p_filtre4, setp_filtre4] = useState("");
const [p_filtre4_value, setp_filtre4_value] = useState("");
function ExpandableCell_50({ value }) { function ExpandableCell_50({ value }) {
const [expanded, setExpanded] = React.useState(false); const [expanded, setExpanded] = React.useState(false);
@ -112,7 +129,101 @@ const Module_Selection_Evaluation_Apprenants = (props) => {
); );
} }
const columns_participants = [
{ field: '_id', headerName: '_id', hide: true, Width: 0 },
{ field: 'id', headerName: 'id', hide: true, Width: 0 },
{ field: 'email', headerName: 'email', flex: 1, hide: false, minWidth: 180, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{ field: 'nom', headerName: 'nom', flex: 1, hide: false, minWidth: 180, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{ field: 'prenom', headerName: 'prenom', flex: 1, hide: false, minWidth: 180, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{ field: 'groupe', headerName: 'groupe', flex: 1, hide: false, minWidth: 180, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{
field: "Detail", headerName: 'Voir detail',
renderCell: (cellValues) => {
return (
<Button
onClick={(event) => {
//handleClick_edit_evaluation_From_Line(cellValues.row.id);
}}
>
<FcViewDetails />
</Button>
);
}
},
{
field: "delete", headerName: 'Supprimer',
renderCell: (cellValues) => {
return (
<Popup
trigger={<Button
onClick={(event) => {
// handleClick_delete(event, cellValues);
}}
>
<CiTrash />
</Button>}
modal
nested
position="center center"
>
{close => (
<div>
<button className="gest_close" onClick={close}>
&times;
</button>
<div className="gest_header"> MySy Information </div>
<div className="gest_content">
{' '}
En confirmant cette opération, l'employé sera <i><font color="red"> définitivement supprimé</font></i>. <br />
</div>
<div className="gest_actions">
<div style={{ "width": "45%", "float": "left" }}>
<button className="gest_bton_popup" onClick={(event) => {
//handleClick_delete(event, cellValues);
//console.log('modal closed ');
close();
}}> Valider </button>
</div>
<div style={{ "width": "45%", "float": "right" }}>
<button
className="gest_bton_popup"
onClick={() => {
//console.log('modal closed ');
close();
}}
>
Annuler
</button>
</div>
</div>
</div>
)}
</Popup>
);
}
}
]
const [selectionModel_participants, setselectionModel_participants] = React.useState([]);
const [selected_id, setselected_id] = React.useState("");
function Display_Colunm_text({ value }) { function Display_Colunm_text({ value }) {
@ -126,23 +237,558 @@ const Module_Selection_Evaluation_Apprenants = (props) => {
const [isLoading, setLoading] = useState(); const [isLoading, setLoading] = useState();
const New_Option_Filter = [
{ "id": "user", "label": "Lié a la Formation (code externe) ", "value": "class_external_code" },
{ "id": "user_group", "label": "Lié a la Classe (code Classe) ", "value": "code_session" },
{ "id": "ty", "label": "Lié a l'UE (code UE) ", "value": "code_ue" },
{ "id": "", "label": "", "value": "" },
{ "id": "1", "label": "", "value": "1" }, // Cette ligne pour couvrir l'ajout d'une ligne de filter. C'est fait expres.
]
const New_Option_type_user = [
{ "id": "user", "label": "Personnes Inscrites", "value": "user" },
{ "id": "user_group", "label": "Groupe ", "value": "user_group" },
{ "id": "", "label": "", "value": "" },
]
const New_Option_type_goupe = [
{ "id": "td", "label": "Groupe TD", "value": "td" },
{ "id": "tp", "label": "Groupe TP", "value": "tp" },
{ "id": "", "label": "", "value": "" },
]
const [GetListePreinscrit_insc_api, setGetListePreinscrit_insc_api] = useState();
const [GetListePreinscrit_insc_meassage, setGetListePreinscrit_insc_meassage] = useState();
const [GetListePreinscrit_insc_result, setGetListePreinscrit_insc_result] = useState([])
function GetListeInscrit() {
var form = new FormData();
//form.append("token","K3cw63eKokKSbV4spjQ48SUNnfy80yrXfA");
const stored_cookie = getCookie('tokenmysypart');
form.append("token", stored_cookie);
form.append("session_id", props.session_id);
setLoading(true);
var myurl = process.env.REACT_APP_API_URL + "myclass/api/Get_Accepted_Insription_From_Session_id_Reduice_Fields/";
fetch(myurl,
{
method: 'POST',
body: form,
})
.then((data) => data.json())
.then((data) => {
setLoading(false);
console.log(' GetListeInscrit : Success:', data['message'], "data['status'] = ", data['status']);
setGetListePreinscrit_insc_result(data['message']);
if (String(data['status']) === String("true")) {
//console.log("erreur rrrr:" + data['status'])
setGetListePreinscrit_insc_api("true");
// setnb_stagiaire_Inscrit(data['message'].length);
//console.log(" ### setnb_stagiaire_Inscrit = ", data['message'].length);
} else if (String(data['status']) === String("Err_Connexion")) {
alert('Erreur: ' + data['message']);
history.push("/Connexion");
}
else {
setGetListePreinscrit_insc_api("false");
}
}).catch((error) => {
setLoading(false);
console.error('Error:', error);
setGetListePreinscrit_insc_api("false");
});
}
const myRef_head = useRef(null);
function get_attendee_list_data() {
if (String(p_filtre1_value) === "user") {
GetListeInscrit();
}
}
const [gridline_id, setgridline_id] = useState("");
const New_Option_PreInscription = [
{ "id": "inscr", "label": "Inscrire", "value": "inscr" },
]
const [actionmass_preinsc_val, setactionmass_preinsc_val] = useState();
function GetSelectedRows_PreInsc_Ids() {
var tab_tmp = []
for (var i = 0; i < selectionModel_participants.length; i++) {
//console.log(" ### selectionModel_insc[i] = ", selectionModel_insc[i]);
var myid = parseInt(String(selectionModel_participants[i]));
//var line = JSON.parse(rowss[myid]);
tab_tmp.push(myid);
}
return tab_tmp;
}
async function actionmass_preinsc_Traitemet() {
var liste_preinscr_id = GetSelectedRows_PreInsc_Ids();
//console.log(" liste_preinscr_id = ", liste_preinscr_id);
var tab_mongo_preins_ids = [];
for (var i = 0; i < liste_preinscr_id.length; i++) {
var line = GetListePreinscrit_insc_result[liste_preinscr_id[i]]
var line_json = JSON.parse(line)
//console.log(" line_json['prenom'] = ", line_json['prenom']);
//console.log(" line_json['_id'] = ", line_json['_id']);
tab_mongo_preins_ids.push(line_json['_id'])
}
if (String(actionmass_preinsc_val) === String("inscr")) {
Record_Inscrit_To_Evaluation(tab_mongo_preins_ids);
}
}
const [Record_Inscrit_To_Evaluation_api, setRecord_Inscrit_To_Evaluation_api] = useState();
const [Record_Inscrit_To_Evaluation_message, setRecord_Inscrit_To_Evaluation_message] = useState();
const [Record_Inscrit_To_Evaluation_result, setRecord_Inscrit_To_Evaluation_result] = useState();
function Record_Inscrit_To_Evaluation(list_inscription_id) {
var form = new FormData();
const stored_cookie = getCookie('tokenmysypart');
form.append("token", stored_cookie);
form.append("evaluation_id", props.evaluation_selected_id);
form.append("tab_inscription_id", list_inscription_id);
form.append("tab_group_inscription_id", "");
setLoading(true);
var myurl = process.env.REACT_APP_API_URL + "myclass/api/Record_Participant_To_Evaluation/";
axios.post(myurl, form).then(res => {
if (String(res.data.status) === String("true")) {
setLoading(false);
//console.log(" In UpdateStagiaireData res.data.status = " + res.data.status);
//console.log(" In UpdateStagiaireData res.data.message r_class = " + res.data.message);
setRecord_Inscrit_To_Evaluation_api("true");
setRecord_Inscrit_To_Evaluation_result(res.data.message);
setselectionModel_participants([]);
setactionmass_preinsc_val("");
alert(res.data.message);
} else if (String(res.data.status) === String("Err_Connexion")) {
setLoading(false);
alert('Erreur: ' + res.data.message);
history.push("/Connexion");
}
else {
setLoading(false);
setRecord_Inscrit_To_Evaluation_api("false");
setRecord_Inscrit_To_Evaluation_message(res.data.message);
alert(res.data.message);
}
}).catch((error) => {
setLoading(false);
console.warn('Record_Inscrit_To_Evaluation : Not good man :( mysearchtext = ' + error);
setRecord_Inscrit_To_Evaluation_api("false");
alert(" Impossible de faire les inscriptions ");
})
}
return ( return (
<div className="moduleselectionevaluationapprenants"> <div className="moduleselectionevaluationapprenants">
{isLoading && <div className="loader-container"> {isLoading && <div className="loader-container">
<div className="mysy_spinner"> <img src={img_loading_spin} /> </div> <div className="mysy_spinner"> <img src={img_loading_spin} /> </div>
</div>} </div>}
<nav style={{ "border": "None", "fontSize": "22px", "fontWeight": "600", "paddingTop": "10px", "paddingLeft": "5px" }}> Selection des Apprenants & Groupe d'apprenants </nav>
<div className="div_row">
<div className="titre1"> Utilisez les filtres !</div>
<div className="div_row" style={{ "marginBottom": "5px" }}>
<div className="div_row_gauche texte_area_filter" >
<TextField
sx={{ '& legend': { display: 'none' }, '& fieldset': { top: 0 }, }}
required
name="filtre1"
id="filtre1"
InputLabelProps={{
shrink: true,
}}
disabled={false}
className="disabled_style"
value={p_filtre1}
/>
</div>
<div className="div_row_droite texte_area_filter_value" >
{p_filtre1 && New_Option_type_user && New_Option_type_user.length > 0 &&
<Autocomplete
disablePortal
name="filtre1_value"
id="filtre1_value"
className="disabled_style"
value={New_Option_type_user.filter((data) => (data).value === String(p_filtre1_value))[0].label}
options={New_Option_type_user}
onChange={(event, value) => {
if (value && value.value) {
setp_filtre1_value(value.value);
} else {
setp_filtre1_value("");
}
}}
renderInput={(params) => <TextField {...params} label="" placeholder="Choisir une option"
inputProps={{ ...params.inputProps, style: { fontSize: 12, height: "1.4rem" } }}
/>
}
/>
}
</div>
</div>
{p_filtre1_value && String(p_filtre1_value) === "user_group" &&
<div className="div_row" style={{ "marginBottom": "5px" }}>
<div className="div_row_gauche texte_area_filter">
<TextField
sx={{ '& legend': { display: 'none' }, '& fieldset': { top: 0 }, }}
required
name="filtre2"
id="filtre2"
InputLabelProps={{
shrink: true,
}}
disabled={false}
className="disabled_style"
value={p_filtre2}
/>
</div>
<div className="div_row_droite texte_area_filter_value" style={{ "marginTop": "0.5rem" }}>
{p_filtre1_value && String(p_filtre1_value) === "user_group" &&
<Autocomplete
disablePortal
name="filtre2_value"
id="filtre2_value"
className="disabled_style"
value={New_Option_type_goupe.filter((data) => (data).value === String(p_filtre2_value))[0].label}
options={New_Option_type_goupe}
onChange={(event, value) => {
if (value && value.value) {
setp_filtre2_value(value.value);
} else {
setp_filtre2_value("");
}
}}
renderInput={(params) => <TextField {...params} label="" placeholder="Choisir une option"
inputProps={{ ...params.inputProps, style: { fontSize: 12, height: "1.4rem" } }}
/>
}
/>
}
</div>
</div>
}
<div className="div_row" ref={myRef_head} id="myRef_head" style={{ "border": "None", "color": "orange", "textAlign": "center" }}>
<div className="div_row_gauche" style={{ "textAlign": 'left', 'marginLeft': '15px' }}>
<Button variant="contained" className="bton_enreg" onClick={get_attendee_list_data}>Rechercher
</Button>
</div>
<div className="div_row_droite" style={{ "textAlign": 'right', 'marginRight': '15px' }}>
<Button variant="contained" className="bton_annule" onClick={"clean_all_filters"}>Annuler
</Button>
</div>
</div>
<br />
</div>
<nav style={{ "border": "None", "fontSize": "22px", "fontWeight": "600", "paddingTop": "10px", "paddingLeft": "5px" }}> Selection des Apprenant & Groupe d'apprenants </nav> <nav style={{ "border": "None", "fontSize": "22px", "fontWeight": "600", "paddingTop": "10px", "paddingLeft": "5px" }}> Selection des Apprenant & Groupe d'apprenants </nav>
<div style={{ height: 550, width: '100%', paddingRight: '5px' }}> <div style={{ height: 550, width: '100%', paddingRight: '5px' }}>
Les critère de selection : <br/>
- Formation : avec valeur par default <br/>
- classe / session : Avec critères par default <br/> <div className="div_row" style={{ paddingRight: '10px' }}>
- type de groupe : [groupe TD, groupe TP, groupe Autre, etc]
- Incrit : Choisir par mis les types <br /> <div className="session_data">
&nbsp; <div style={{ "border": "None" }}>
<div style={{ height: 550, width: '100%', paddingRight: '5px' }}>
&nbsp;
<Box
sx={{
height: 500,
width: '100%',
paddingRight: '1px',
/*"& .MuiDataGrid-virtualScrollerRenderZone": {
"& .MuiDataGrid-row": {
"&:nth-child(2n)": { backgroundColor: "rgba(235, 235, 235, .7)" }
}
},*/
"& .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_participants(newSelectionModel);
/*if (newSelectionModel.length === 1)
handleClick_edit_employee_From_Line(newSelectionModel);*/
if (newSelectionModel.length !== 1) {
/* setsubmenu();
setdisplay_detail_employe();
setadd_One_Employee();*/
}
}}
selectionModel={selectionModel_participants}
localeText={frFR.components.MuiDataGrid.defaultProps.localeText}
rows={GetListePreinscrit_insc_result.map((item, index) => (
{
id: index,
_id: JSON.parse(item)._id,
code: JSON.parse(item).code,
email: JSON.parse(item).apprenant_email,
nom: JSON.parse(item).apprenant_nom,
prenom: JSON.parse(item).apprenant_prenom,
groupe: JSON.parse(item).groupe,
}
))}
columns={columns_participants}
pageSize={10}
className="datagridclass"
onRowDoubleClick={(newSelectionModel) => {
setselected_id(newSelectionModel.row._id);
setgridline_id(newSelectionModel.row.id);
//handleClick_edit_evaluation_From_Line(newSelectionModel.row.id);
}}
rowsPerPageOptions={[10]}
disableSelectionOnClick
components={{
Toolbar: GridToolbar,
}}
//sx={datagridSx}
getCellClassName={(params) => {
}}
getRowClassName={(params) => {
// Pour la gestion de la couleur de zone double cliquée
if (String(params.row.id) === String(gridline_id)) {
return 'line--statut--selected';
}
else if (parseInt(String(params.row.id)) % 2 === 0) {
return 'line--statut--pair';
}
else if (parseInt(String(params.row.id)) % 2 !== 0) {
return 'line--statut--impair';
}
}}
getEstimatedRowHeight={() => 200}
getRowHeight={() => "auto"}
sx={{
"& .MuiDataGrid-cellContent": {
minHeight: 50,
}
}}
/>
</Box>
{selectionModel_participants && selectionModel_participants.length >= 1 &&
<div className="div_row" style={{ "border": "none", "marginLeft": "10px" }}>
<div className="block_en_mass">
<nav className='traitement_mass'>Traitement en masse</nav>
&nbsp;
<Autocomplete
disablePortal
id="combo-box-demo"
className="block_en_mass_select"
fullWidth
options={New_Option_PreInscription}
onChange={(event, value) => {
if (value && value.value) {
if (String(value.value) === "inscr") {
setactionmass_preinsc_val(value.value);
}
else {
setactionmass_preinsc_val("");
}
}
else {
setactionmass_preinsc_val("");
}
}}
renderInput={(params) => <TextField {...params} label="" placeholder="Choisir une option"
inputProps={{ ...params.inputProps, style: { fontSize: 12, height: "1.4rem" } }}
/>
}
/>
&nbsp;
{actionmass_preinsc_val && String(actionmass_preinsc_val).length > 1 && <nav className='block_en_mass_bton_action'>
<Popup
trigger={<Button className="bton_enreg" style={{ "width": "90%" }}>
<FcAcceptDatabase /> Traiter
</Button>}
modal
nested
position="center center"
>
{close => (
<div>
<button className="gest_close" onClick={close}>
&times;
</button>
<div className="gest_header"> MySy Information </div>
<div className="gest_content">
{' '}
{String(actionmass_preinsc_val) === "inscr" &&
<font> Confirmer la <b> validation des inscriptions </b> en masse pour {selectionModel_participants.length} lignes.
</font>}
</div>
<div className="gest_actions">
<div style={{ "width": "45%", "float": "left" }}>
<button className="gest_bton_popup" onClick={(event) => {
actionmass_preinsc_Traitemet();
close();
}}> Valider </button>
</div>
<div style={{ "width": "45%", "float": "right" }}>
<button
className="gest_bton_popup"
onClick={() => {
//console.log('modal closed ');
close();
}}
>
Annuler
</button>
</div>
</div>
</div>
)}
</Popup>
</nav>
}
<br />
</div>
</div>}
<br />
</div>
</div>
</div>
<div className="div_row" style={{ "border": "None" }}>
<div className="div_row_gauche div_row_gauche_etendu" style={{ "textAlign": "left", "paddingLeft": "5px" }}>
<Button variant="outlined" onClick={"planifier_one_evaluation"}
className="detail_class_submenu bton_add_session"
id='menu_import_participant' name='menu_import_participant'>Ajout 1 participant &nbsp;
<IoAddCircleOutline style={{ "fontSize": "x-large", "color": "green" }} />
</Button>
</div>
</div>
</div>
</div> </div>
</div > </div >

File diff suppressed because it is too large Load Diff

View File

@ -248,7 +248,7 @@ function UpdateAttendeeList() {
// params = la nouvelle lignes // params = la nouvelle lignes
console.log(" ### zzz params = ", params); //console.log(" ### zzz params = ", params);
var num_line = params.id; // ==> Id de la ligne changé var num_line = params.id; // ==> Id de la ligne changé
var colomn = params.field; // ==> colonne de la ligne changé var colomn = params.field; // ==> colonne de la ligne changé
@ -344,7 +344,7 @@ function UpdateAttendeeList() {
const new_attende_dat_JSON = JSON.stringify(New_Getall_TrainingParticipant_result); const new_attende_dat_JSON = JSON.stringify(New_Getall_TrainingParticipant_result);
console.log(" Record_New_Attendee_Data New_Getall_TrainingParticipant_result = ", New_Getall_TrainingParticipant_result); // console.log(" Record_New_Attendee_Data New_Getall_TrainingParticipant_result = ", New_Getall_TrainingParticipant_result);
const stored_cookie = getCookie('tokenmysypart'); const stored_cookie = getCookie('tokenmysypart');
form.append("client_id", client_id); form.append("client_id", client_id);
@ -512,8 +512,6 @@ function UpdateAttendeeList() {
<br /> <br />
<div className="div_row_gauche" style={{ "textAlign": 'left', 'marginLeft': '15px' }}> <div className="div_row_gauche" style={{ "textAlign": 'left', 'marginLeft': '15px' }}>
<Popup <Popup
trigger={ trigger={