recette2
cherif 2024-08-09 13:17:13 +02:00
parent 5ac928d0e4
commit 2de6c2e331
3 changed files with 286 additions and 111 deletions

View File

@ -60,7 +60,36 @@ import Module_Selection_Apprenants from "./Module_Selection_Apprenants";
import { FcAlarmClock, FcMultipleSmartphones, FcWorkflow } from "react-icons/fc"; import { FcAlarmClock, FcMultipleSmartphones, FcWorkflow } from "react-icons/fc";
import { makeStyles } from "@material-ui/core/styles";
import CancelPresentationIcon from '@mui/icons-material/CancelPresentation';
import { IconButton } from '@material-ui/core';
import Paper from '@material-ui/core/Paper';
import Draggable from 'react-draggable';
const useStyles = makeStyles((theme) => ({
dialog: {
position: 'fixed',
// left: 10,
top: 400
},
paper: {
overflowY: 'unset',
},
customizedButton: {
position: 'absolute',
left: '95%',
top: '-9%',
backgroundColor: 'lightgray',
color: 'gray',
},
}));
const Groupe_Apprenant = (props) => { const Groupe_Apprenant = (props) => {
const classes = useStyles();
const history = useHistory(); const history = useHistory();
const [submenu, setsubmenu] = useState(""); const [submenu, setsubmenu] = useState("");
const [rowss, setRows] = useState([]); const [rowss, setRows] = useState([]);
@ -71,6 +100,8 @@ const Groupe_Apprenant = (props) => {
date_today_90j.setDate(date_today_90j.getDate() + 90); date_today_90j.setDate(date_today_90j.getDate() + 90);
const [p_filtre1, setp_filtre1] = useState(""); const [p_filtre1, setp_filtre1] = useState("");
const [p_filtre1_value, setp_filtre1_value] = useState(""); const [p_filtre1_value, setp_filtre1_value] = useState("");
@ -939,7 +970,7 @@ const Groupe_Apprenant = (props) => {
} }
if (file_1_name && file_1_name.name) { if (file_1_name && file_1_name.name) {
console.log(" ### Traitement de : ", file_1_name.name); //console.log(" ### Traitement de : ", file_1_name.name);
const formData = new FormData(); const formData = new FormData();
formData.append('File', file_1_name); formData.append('File', file_1_name);
@ -1867,14 +1898,12 @@ const Groupe_Apprenant = (props) => {
alert(res.data.message); alert(res.data.message);
if (document.getElementById('myRef')) {
// myRef.current.scrollIntoView({ behavior: "smooth" }); window.scrollTo({
var divh = document.getElementById('myRef').offsetTop; top: 0,
window.scrollTo({ behavior: "smooth",
top: divh, });
behavior: "smooth",
});
}
} }
else { else {
@ -1908,10 +1937,14 @@ const Groupe_Apprenant = (props) => {
form.append("split_type", p_detail_split_type_auto); form.append("split_type", p_detail_split_type_auto);
form.append("class_id", p_detail_class_id_auto); form.append("class_id", p_detail_class_id_auto);
form.append("session_id", p_detail_session_id_auto); form.append("session_id", p_detail_session_id_auto);
form.append("type_groupe_code", p_detail_type_groupe_code_auto);
var myurl = process.env.REACT_APP_API_URL + "myclass/api/Automatic_Split_Member_Inscrit_To_Grps/"; var myurl = process.env.REACT_APP_API_URL + "myclass/api/Automatic_Split_Member_Inscrit_To_Grps/";
setLoading(true); setLoading(true);
axios.post(myurl, form).then(res => { axios.post(myurl, form).then(res => {
//console.log(" In Automatic_Split_Membre_No_Grp_Creation res.data.status = " + res.data.status); //console.log(" In Automatic_Split_Membre_No_Grp_Creation res.data.status = " + res.data.status);
@ -1928,20 +1961,17 @@ const Groupe_Apprenant = (props) => {
setgrp_apprenant_data_edit_mode(""); setgrp_apprenant_data_edit_mode("");
setSelectionModel([]); setSelectionModel([]);
clear_DetailFieds(); clear_DetailFieds();
// Dialog_GRP_AUTOMATIC_handleClose_buton(); Dialog_GRP_AUTOMATIC_handleClose_buton();
Getall_Partner_Groupe_Inscrit(); Getall_Partner_Groupe_Inscrit();
alert(res.data.message); alert(res.data.message);
if (document.getElementById('myRef')) { window.scrollTo({
// myRef.current.scrollIntoView({ behavior: "smooth" }); top: 0,
var divh = document.getElementById('myRef').offsetTop; behavior: "smooth",
window.scrollTo({ });
top: divh,
behavior: "smooth",
});
}
} }
else { else {
@ -2076,6 +2106,10 @@ const Groupe_Apprenant = (props) => {
setsubmenu_grp_dialog("update"); setsubmenu_grp_dialog("update");
} }
const handleClose = () => {
//setOpen(false);
};
return ( return (
<div className="groupe_apprenant"> <div className="groupe_apprenant">
{isLoading && <div className="loader-container"> {isLoading && <div className="loader-container">
@ -2092,6 +2126,23 @@ const Groupe_Apprenant = (props) => {
static static
onClose={() => null} onClose={() => null}
PaperProps={{
className: classes.paper, // Apply the paper style
style: {
overflowY: 'unset',
position: 'absolute',
//top: '5rem'
},
}}
hideBackdrop={true}
disableScrollLock
classes={{
paper: classes.dialog
}}
> >
<DialogTitle> Création automatique des groupes </DialogTitle> <DialogTitle> Création automatique des groupes </DialogTitle>
@ -2180,6 +2231,43 @@ const Groupe_Apprenant = (props) => {
</div> </div>
<div className="session_caract_Dialog" ><b>Type de Groupe </b> <br />
{New_Getall_Groupe_Apprenant_Type_result && New_Getall_Groupe_Apprenant_Type_result.length > 0 &&
<Autocomplete
disablePortal
name="detail_type_grp"
id="detail_type_grp"
fullWidth
options={New_Getall_Groupe_Apprenant_Type_result}
value={New_Getall_Groupe_Apprenant_Type_result.filter((data) => (data).code === String(p_detail_type_groupe_code_auto))[0].label}
onChange={(event, value) => {
if (value && value.code) {
setp_detail_type_groupe_code_auto(value.code);
setgrp_apprenant_data_changed("1");
} else {
setp_detail_type_groupe_code_auto("");
setgrp_apprenant_data_changed("1");
}
}}
renderInput={(params) => <TextField {...params} label="" placeholder="Choisir une option"
inputProps={{ ...params.inputProps, style: { fontSize: 12, height: "1.4rem" } }}
/>
}
/>
}
</div>
<div className="session_caract_Dialog" > <b> Grouper les inscrits par </b> <div className="session_caract_Dialog" > <b> Grouper les inscrits par </b>
<Autocomplete <Autocomplete
disablePortal disablePortal
@ -2225,43 +2313,6 @@ const Groupe_Apprenant = (props) => {
</div> </div>
<div className="session_caract_Dialog" ><b>Type de Groupe </b> <br />
{New_Getall_Groupe_Apprenant_Type_result && New_Getall_Groupe_Apprenant_Type_result.length > 0 &&
<Autocomplete
disablePortal
name="detail_type_grp"
id="detail_type_grp"
fullWidth
options={New_Getall_Groupe_Apprenant_Type_result}
value={New_Getall_Groupe_Apprenant_Type_result.filter((data) => (data).code === String(p_detail_type_groupe_code_auto))[0].label}
onChange={(event, value) => {
if (value && value.code) {
setp_detail_type_groupe_code_auto(value.code);
setgrp_apprenant_data_changed("1");
} else {
setp_detail_type_groupe_code_auto("");
setgrp_apprenant_data_changed("1");
}
}}
renderInput={(params) => <TextField {...params} label="" placeholder="Choisir une option"
inputProps={{ ...params.inputProps, style: { fontSize: 12, height: "1.4rem" } }}
/>
}
/>
}
</div>
<div className="session_caract_Dialog" > Racine <div className="session_caract_Dialog" > Racine
<TextField <TextField
sx={{ '& legend': { display: 'none' }, '& fieldset': { top: 0 }, }} sx={{ '& legend': { display: 'none' }, '& fieldset': { top: 0 }, }}
@ -2289,11 +2340,13 @@ const Groupe_Apprenant = (props) => {
<div className="div_row"> <div className="div_row">
<div className="div_row_gauche"> <div className="div_row_gauche">
&nbsp; <Button onClick={Automatic_Split_Membre_No_Grp_Creation} className="bton_enreg_dialog">Mettre à jour Membres</Button>
</div> </div>
<div className="div_row_droite" style={{ "textAlign": 'center' }}> <div className="div_row_droite" style={{ "textAlign": 'center' }}>
<Button onClick={Automatic_Split_Membre_No_Grp_Creation} className="bton_enreg_dialog">Mettre à jour Membres</Button> <Button onClick={Dialog_GRP_AUTOMATIC_handleClose_buton} className="bton_annule_dialog" >Fermer</Button>
</div> </div>
</div> </div>
@ -2314,10 +2367,37 @@ const Groupe_Apprenant = (props) => {
<div className="div_row_droite" style={{ "textAlign": 'center' }}> <div className="div_row_droite" style={{ "textAlign": 'center' }}>
<Button onClick={Dialog_GRP_AUTOMATIC_handleClose_buton} className="bton_annule_dialog" >Fermer</Button> <Button onClick={Dialog_GRP_AUTOMATIC_handleClose_buton} className="bton_annule_dialog" >Fermer</Button>
</div> </div>
</div> </div>
<IconButton
autoFocus
onClick={Dialog_GRP_AUTOMATIC_handleClose_buton}
color="primary"
className={classes.customizedButton}
>
<CancelPresentationIcon />
</IconButton>
</DialogActions>} </DialogActions>}
{String(submenu_grp_dialog) !== "create" && <DialogActions>
<IconButton
autoFocus
onClick={Dialog_GRP_AUTOMATIC_handleClose_buton}
color="primary"
className={classes.customizedButton}
>
<CancelPresentationIcon />
</IconButton>
</DialogActions>}
</Dialog> </Dialog>
@ -2843,14 +2923,20 @@ const Groupe_Apprenant = (props) => {
</div> </div>
<div className="div_row" style={{ "border": "None" }}> <div className="div_row" style={{ "border": "None" }} id="bton_gestion_grp" name="bton_gestion_grp">
<div className="div_row_gauche div_row_gauche_etendu" style={{ "textAlign": "left", "paddingLeft": "5px" }}> <div className="div_row_gauche div_row_gauche_etendu" style={{ "textAlign": "left", "paddingLeft": "5px" }}>
<Button variant="outlined" <Button variant="outlined"
className="detail_class_submenu bton_add_session bton_add_session_create_automatic" style={{ "width": "40%" }} className="detail_class_submenu bton_add_session bton_add_session_create_automatic" style={{ "width": "40%" }}
id='menu_import_participant' name='menu_import_participant' onClick={(event) => { id='menu_import_participant' name='menu_import_participant' onClick={(event) => {
setDialog_GRP_AUTOMATIC_open(true); setDialog_GRP_AUTOMATIC_open(true);
submenu_create_grp();
Annule_Add_One_Evaluaton_DetailFields();
}} > Gestion automatique }} > Gestion automatique
&nbsp; <FcMultipleSmartphones /> &nbsp; <FcMultipleSmartphones />
</Button> </Button>

View File

@ -40,6 +40,12 @@ import Module_Editique from "./Module_Editique";
import Module_Attestation_Formation from "./Module_Attestation_Formation"; import Module_Attestation_Formation from "./Module_Attestation_Formation";
import Module_Email_Management from "./Module_Email_Management"; import Module_Email_Management from "./Module_Email_Management";
import Paper from '@material-ui/core/Paper';
import { makeStyles } from '@material-ui/core/styles';
import CancelPresentationIcon from '@mui/icons-material/CancelPresentation';
import { IconButton } from '@material-ui/core';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom';
import Draggable from 'react-draggable'; import Draggable from 'react-draggable';
@ -47,6 +53,32 @@ import Draggable from 'react-draggable';
import SignatureCanvas from 'react-signature-canvas'; import SignatureCanvas from 'react-signature-canvas';
const useStyles = makeStyles((theme) => ({
paper: {
overflowY: 'unset',
},
customizedButton: {
position: 'absolute',
left: '95%',
top: '-9%',
backgroundColor: 'lightgray',
color: 'gray',
},
}));
function PaperComponent(props) {
return (
<Draggable
handle="#draggable-dialog-title"
cancel={'[class*="MuiDialogContent-root"]'}
>
<Paper {...props} />
</Draggable>
);
}
const locales = { const locales = {
'en-US': enUS, 'en-US': enUS,
} }
@ -611,7 +643,16 @@ const TestUrl_New = (props) => {
} }
const classes = useStyles();
const [open1, setOpen1] = React.useState(false);
const handleClickOpen1 = () => {
setOpen1(true);
};
const handleClose1 = () => {
setOpen1(false);
};
return ( return (
<div className="testurl_new"> <div className="testurl_new">
@ -655,16 +696,25 @@ const TestUrl_New = (props) => {
{ /********* Dialog email */} { /********* Dialog email */}
<Dialog <Dialog
onClose={() => null}
onClose={Dialog_1_handleClose} //onClose={Dialog_1_handleClose}
className="module_email_management" className="module_email_management"
PaperProps={{ PaperProps={{
sx: { sx: {
width: "100%", width: "100%",
maxWidth: "920px!important", maxWidth: "920px!important",
}, },
className: classes.paper, // Apply the paper style
style: {
overflowY: 'unset',
position: 'absolute',
top: '5rem'
},
}} }}
open={Dialog_1_open} open={Dialog_1_open}
hideBackdrop={true}
disableScrollLock
> >
@ -674,25 +724,24 @@ const TestUrl_New = (props) => {
</DialogContentText> </DialogContentText>
<Module_Email_Management father_close_function={Dialog_1_handleClose} email_destinataire={"mysy1000formation+02@gmail.com,mysytraining+apprenant3@gmail.com"} <Module_Email_Management father_close_function={Dialog_1_handleClose} email_destinataire={"mysy1000formation+02@gmail.com,mysytraining+apprenant3@gmail.com"}
related_collection ={"inscription"}/> related_collection={"inscription"} />
</DialogContent> </DialogContent>
{/* <DialogActions> <DialogActions>
<div className="div_row"> <IconButton
<div className="div_row_gauche"> autoFocus
<Button onClick={"Update_One_Agenda_Event"} className="bton_enreg_dialog">Mettre à jour</Button> onClick={Dialog_1_handleClose}
color="primary"
className={classes.customizedButton}
>
<CancelPresentationIcon />
</IconButton>
</div> </DialogActions>
<div className="div_row_droite" style={{ "textAlign": 'center' }}>
<Button onClick={Dialog_1_handleClose} className="bton_annule_dialog" >Fermer</Button>
</div>
</div>
</DialogActions>*/}
</Dialog> </Dialog>
{ /********* Fin Dialog email */} { /********* Fin Dialog email */}
@ -703,21 +752,49 @@ const TestUrl_New = (props) => {
<h3> Page de test * testurl_new </h3> <h3> Page de test * testurl_new </h3>
parametres courseid = {courseid}, tabid = {tabid} parametres courseid = {courseid}, tabid = {tabid}
<br /> <br />
<h3> Signature padd </h3>
<SignatureCanvas ref={signatureCanvasRef} style={{ "border": "solid 1px red" }} penColor="green"
canvasProps={{
width: 315,
height: 200,
style: { border: "1px solid black", borderRadius: "10px" },
}} />
<button onClick={checkIfEmpty}>Check if Empty</button>
<button onClick={clearCanvas}>Clear Canvas</button>
<hr /> <div>
image signé : <Button variant="outlined" color="primary" onClick={handleClickOpen1}>
<img src={pad_signature_img} /> Open form dialog laa
</Button>
<Dialog
open={open1}
onClose={handleClose1}
// PaperComponent={PaperComponent}
aria-labelledby="draggable-dialog-title"
<h3> FIN Signature padd </h3> PaperProps={{
className: classes.paper, // Apply the paper style
style: {
overflowY: 'unset',
},
}}
>
<DialogTitle style={{ cursor: 'move' }} id="draggable-dialog-title">
Subscribe
</DialogTitle>
<DialogContent>
<DialogContentText>
To subscribe to this website, please enter your email address here.
We will send updates occasionally.
</DialogContentText>
</DialogContent>
<DialogActions>
<IconButton
autoFocus
onClick={handleClose1}
color="primary"
className={classes.customizedButton}
>
<CancelPresentationIcon />
</IconButton>
<Button onClick={handleClose} color="primary">
Subscribe
</Button>
</DialogActions>
</Dialog>
</div>
<Draggable > <Draggable >
<div style={{ cursor: 'pointer', border: "1px solid" }}>I can now be moved around!</div> <div style={{ cursor: 'pointer', border: "1px solid" }}>I can now be moved around!</div>
@ -735,7 +812,7 @@ const TestUrl_New = (props) => {
}}>Envoie email</button> }}>Envoie email</button>
zzz
</div> </div>

View File

@ -3,10 +3,10 @@
.tooltip_css { .tooltip_css {
background: #81BC3A; background: #81BC3A;
z-index: 9999; z-index: 9999;
} }
.css-1bp1ao6{ .css-1bp1ao6 {
height: 3.5rem !important; height: 3.5rem !important;
} }
@ -23,7 +23,7 @@
top: 0px; top: 0px;
opacity: 80%; opacity: 80%;
left: 0px; left: 0px;
} }
.spinner { .spinner {
width: 20rem; width: 20rem;
@ -938,7 +938,7 @@
height: 2rem !important; height: 2rem !important;
} }
.bton_import_excel { .bton_import_excel {
background: #c8cfd5; background: #c8cfd5;
@ -1456,7 +1456,7 @@
margin-right: 1rem; margin-right: 1rem;
padding: 0.3rem; padding: 0.3rem;
margin-bottom: 0.5rem; margin-bottom: 0.5rem;
// width: 11rem; // width: 11rem;
text-align: center; text-align: center;
border: 1px solid #9cf; border: 1px solid #9cf;
color: #3b3e40; color: #3b3e40;
@ -1616,10 +1616,11 @@
width: 40%; width: 40%;
height: 2rem !important; height: 2rem !important;
} }
.bton_add_session_create_automatic { .bton_add_session_create_automatic {
background: #c8cfd5; background: #c8cfd5;
color: black; color: black;
width:60% !important; width: 60% !important;
height: 2rem !important; height: 2rem !important;
} }
@ -2247,7 +2248,7 @@
} }
.bton_traiter_en_mass:hover{ .bton_traiter_en_mass:hover {
border-radius: 5px; border-radius: 5px;
font-size: small; font-size: small;
padding: 0.3rem; padding: 0.3rem;
@ -2258,8 +2259,8 @@
color: white !important; color: white !important;
} }
.bton_fermer { .bton_fermer {
border-radius: 5px; border-radius: 5px;
@ -2648,7 +2649,7 @@
top: -13px; top: -13px;
} }
.img_class_logo_mini { .img_class_logo_mini {
display: block; display: block;
@ -2669,25 +2670,25 @@
width: 900px !important; width: 900px !important;
max-width: none !important; max-width: none !important;
} }
.planification_Dialog_DatePicker_row{ .planification_Dialog_DatePicker_row {
float: left; float: left;
width: 100%; width: 100%;
} }
.planification_Dialog_DatePicker{ .planification_Dialog_DatePicker {
background-color: #FFFFFF; background-color: #FFFFFF;
width: 50% !important; width: 50% !important;
float: left; float: left;
} }
} }
// end media // end media
.DialogContent_width_for_week_model { .DialogContent_width_for_week_model {
width: 900px !important; width: 900px !important;
max-width: none !important; max-width: none !important;
@ -2697,7 +2698,7 @@
width: 80% !important; width: 80% !important;
} }
.disabled_style_with_visualiser_icone{ .disabled_style_with_visualiser_icone {
float: left; float: left;
text-align: center; text-align: center;
width: 100%; width: 100%;
@ -2705,20 +2706,20 @@
padding-top: 10px; padding-top: 10px;
} }
.disabled_style_left_text_with_visualiser_icone{ .disabled_style_left_text_with_visualiser_icone {
width: 80% !important; width: 80% !important;
float: left; float: left;
} }
.disabled_style_right_bton_visualiser{ .disabled_style_right_bton_visualiser {
width: 9% !important; width: 9% !important;
float: left; float: left;
cursor: pointer; cursor: pointer;
} }
.css-md26zr-MuiInputBase-root-MuiOutlinedInput-root{
.css-md26zr-MuiInputBase-root-MuiOutlinedInput-root {
height: 3rem !important; height: 3rem !important;
} }
@ -2789,16 +2790,27 @@
.MuiMenu-paper { .MuiMenu-paper {
max-width: 30% !important; max-width: 30% !important;
} }
.MuiPaper-root{ .MuiPaper-root {
border-radius: 10px !important; border-radius: 10px !important;
background: #FFFFFF !important; background: #FFFFFF !important;
max-width: none !important; max-width: none !important;
} }
.MuiModal-root {
position: absolute !important;
}
.css-zw3mfo-MuiModal-root-MuiDialog-root {
position: absolute !important;
}
}
.MuiModal-root {
position: absolute !important;
} }
.MuiMenu-paper { .MuiMenu-paper {