recette2
cherif 2024-06-23 14:01:57 +02:00
parent 95a92502bc
commit 420fd0caca
1 changed files with 594 additions and 275 deletions

View File

@ -79,12 +79,17 @@ import Module_Session_Planification from "./Module_Session_Planification";
import Module_Session_Evaluation from "./Module_Session_Evaluation";
import AccountTreeIcon from '@mui/icons-material/AccountTree';
import FormGroup from '@mui/material/FormGroup';
import Checkbox from '@mui/material/Checkbox';
const DisplayPartnerSession = (props) => {
const history = useHistory();
const [submenu, setsubmenu] = useState("");
const [rowss, setRows] = useState([]);
const [actionmass_preinsc_val, setactionmass_preinsc_val] = useState();
const [one_SessionstartDateInscription, setone_SessionstartDateInscription] = useState();
const [one_SessionendDateInscription, setone_SessionendDateInscription] = useState();
@ -1323,7 +1328,7 @@ const DisplayPartnerSession = (props) => {
if (String(res.data.status) === String("true")) {
//console.log(" In Getall_TrainingSession res.data.status = " + res.data.status);
//console.log(" In Getall_TrainingSession res.data.message r_class = " + res.data.message);
console.log(" In Getall_TrainingSession res.data.message r_class = " + res.data.message);
setGetall_TrainingSession_api("true");
setGetall_TrainingSession_result(res.data.message);
setRows(res.data.message);
@ -11005,7 +11010,6 @@ const DisplayPartnerSession = (props) => {
const [p_detail_invoice_split_facture_done, setp_detail_invoice_split_facture_done] = useState("");
const [display_session_with_alert, setdisplay_session_with_alert] = useState(false);
const New_Option_Type_split_invoice = [
@ -11014,6 +11018,13 @@ const DisplayPartnerSession = (props) => {
{ "id": "", "label": "", "value": "" },
]
const [display_session_with_alert, setdisplay_session_with_alert] = useState(false);
const handleChange_display_session_with_alert = (event) => {
setSelectionModel([]);
setdisplay_session_with_alert(event.target.checked);
};
return (
<div className="displaypartnersession">
@ -13506,288 +13517,596 @@ const DisplayPartnerSession = (props) => {
<div className="session_data">
<div style={{ textAlign: "right", "width": '100%', 'float': 'left' }}>
<nav style={{ width: '50%', float: 'left' }}> &nbsp; </nav>
<nav style={{ width: '50%', float: 'left' }}>
<FormGroup style={{ float: 'right' }}>
<FormControlLabel control={<Checkbox
checked={display_session_with_alert}
onChange={handleChange_display_session_with_alert}
inputProps={{ 'aria-label': 'controlled' }}
/>} label="Alerte" style={{ color: 'red', fontSize: "10px", fontStyle: 'italic' }} />
</FormGroup>
</nav>
</div>
<div style={{ "border": "None" }}>
<div style={{ height: 550, width: '100%', paddingRight: '5px' }}>
&nbsp;
<Box
sx={{
height: 500,
width: '100%',
paddingRight: '1px',
'& .cell--presentiel': {
backgroundColor: '#a2cf6e',
color: '#1a3e72',
fontWeight: 'bold',
},
'& .cell--distantiel': {
backgroundColor: '#ffac33',
color: '#1a3e72',
fontWeight: 'light',
},
'& .cell--etape--projet': {
backgroundColor: '#E6F7C8',
color: '#1a3e72',
fontWeight: 'light',
},
'& .cell--etape--planification': {
backgroundColor: '#E6CEAA',
color: '#1a3e72',
fontWeight: 'light',
},
'& .cell--etape--planifie': {
backgroundColor: '#F4ECF7',
color: '#1a3e72',
fontWeight: 'light',
},
'& .cell--etape--termine': {
backgroundColor: '#D6EAF8',
color: '#1a3e72',
fontWeight: 'light',
},
'& .cell--etape--facture': {
backgroundColor: '#D5F5E3',
color: '#1a3e72',
fontWeight: 'light',
},
'& .cell--etape--annule': {
backgroundColor: '#566573',
color: '#1a3e72',
fontWeight: 'light',
},
'& .line--etape--projet': {
backgroundColor: 'yellow',
color: 'black',
},
'& .line--etape--planification': {
backgroundColor: 'red',
color: 'black',
},
'& .line--etape--planifie': {
backgroundColor: 'blue',
color: 'black',
},
'& .line--etape--termine': {
backgroundColor: 'orange',
color: 'black',
},
'& .line--etape--facture': {
backgroundColor: '#D5F5E3',
color: 'black',
},
'& .line--etape--annule': {
backgroundColor: '#566573',
color: 'white',
},
"& .MuiDataGrid-columnHeaders": {
backgroundColor: "#c8cfd5",
color: "black",
fontSize: 14
},
'& .line--statut--invoiced': {
backgroundColor: '#EAFAF1',
color: '#239B56',
fontWeight: '700'
},
'& .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_session_From_Line(newSelectionModel);*/
if (newSelectionModel.length !== 1) {
setaddOneParticipant();
setdisplay_detail_insc();
setselected_code_session();
setsubmenu();
}
}}
selectionModel={selectionModel}
localeText={frFR.components.MuiDataGrid.defaultProps.localeText}
rows={rowss.map((item, index) => (
{
id: index,
class_internal_url: JSON.parse(item).class_internal_url,
code_session: JSON.parse(item).code_session,
_id: JSON.parse(item)._id,
date_debut: JSON.parse(item).date_debut,
date_fin: JSON.parse(item).date_fin,
distantiel: JSON.parse(item).distantiel,
presentiel: JSON.parse(item).presentiel,
statut: JSON.parse(item).session_status,
etape: JSON.parse(item).session_etape,
formateur: JSON.parse(item).formateur,
nb_participant: JSON.parse(item).nb_participant,
title: JSON.parse(item).titre,
domaine: JSON.parse(item).domaine,
taux_remplissage: JSON.parse(item).taux_remplissage,
nb_inscrit: JSON.parse(item).nb_inscrit,
nb_preinscrit: JSON.parse(item).nb_preinscrit,
duration: JSON.parse(item).duration_concat,
class_external_code: JSON.parse(item).class_external_code,
prix_session: JSON.parse(item).prix_session,
published: JSON.parse(item).class_published,
session_title: JSON.parse(item).titre,
site_formation_id: JSON.parse(item).site_formation_id,
site_formation_nom: JSON.parse(item).site_formation_code,
invoiced_statut: JSON.parse(item).invoiced_statut,
qty_in_quotation: JSON.parse(item).qty_in_quotation,
qty_in_quotation_list_quotation: JSON.parse(item).qty_in_quotation_list_quotation,
is_session_alert: JSON.parse(item).is_session_alert,
session_alert_message: JSON.parse(item).session_alert_message,
}
))}
columns={columns}
pageSize={10}
className="datagridclass"
onRowDoubleClick={(newSelectionModel) => {
setgridline_id(newSelectionModel.row.id);
setsequence_gridline_id("");
setaddOneSession("0");
setEdite_session("0");
setsessionChanged(false);
//handleClick_edit_session_From_Line(newSelectionModel.row.id);
setselected_session_id(newSelectionModel.row._id);
setsession_selected_row_id(newSelectionModel.row.id);
setDialog_2_message(String(JSON.parse(rowss[newSelectionModel.row.id]).title));
setDialog_2_open(true);
}}
rowsPerPageOptions={[10]}
disableSelectionOnClick
components={{
Toolbar: GridToolbar,
}}
//sx={datagridSx}
getCellClassName={(params) => {
// Traitement du statut "facturé"
if (String(params.row.invoiced_statut) === "2") {
return 'line--statut--invoiced';
}
//field === 'distantiel'
if (params.field === 'distantiel' && String(params.value) === "1") {
return 'cell--distantiel';
}
if (params.field === "presentiel" && String(params.value) == "1") {
return 'cell--presentiel';
}
//field === "etape"
if (params.field === "etape" && String(params.value) == "0") {
return 'cell--etape--projet';
}
if (params.field === "etape" && String(params.value) == "1") {
return 'cell--etape--planification';
}
if (params.field === "etape" && String(params.value) == "2") {
return 'cell--etape--planifie';
}
if (params.field === "etape" && String(params.value) == "3") {
return 'cell--etape--termine';
}
if (params.field === "etape" && String(params.value) == "4") {
return 'cell--etape--facture';
}
if (params.field === "etape" && String(params.value) == "-1") {
return 'cell--etape--annule';
}
// 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';
}
}}
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"}
{(!display_session_with_alert || display_session_with_alert !== true) &&
<div style={{ height: 550, width: '100%', paddingRight: '5px' }}>
&nbsp;
<Box
sx={{
"& .MuiDataGrid-cellContent": {
minHeight: 50,
height: 500,
width: '100%',
paddingRight: '1px',
'& .cell--presentiel': {
backgroundColor: '#a2cf6e',
color: '#1a3e72',
fontWeight: 'bold',
},
[`& .${gridClasses.cell}`]: {
'& .cell--distantiel': {
backgroundColor: '#ffac33',
color: '#1a3e72',
fontWeight: 'light',
},
'& .cell--etape--projet': {
backgroundColor: '#E6F7C8',
color: '#1a3e72',
fontWeight: 'light',
},
'& .cell--etape--planification': {
backgroundColor: '#E6CEAA',
color: '#1a3e72',
fontWeight: 'light',
},
'& .cell--etape--planifie': {
backgroundColor: '#F4ECF7',
color: '#1a3e72',
fontWeight: 'light',
},
'& .cell--etape--termine': {
backgroundColor: '#D6EAF8',
color: '#1a3e72',
fontWeight: 'light',
},
'& .cell--etape--facture': {
backgroundColor: '#D5F5E3',
color: '#1a3e72',
fontWeight: 'light',
},
'& .cell--etape--annule': {
backgroundColor: '#566573',
color: '#1a3e72',
fontWeight: 'light',
},
'& .line--etape--projet': {
backgroundColor: 'yellow',
color: 'black',
},
'& .line--etape--planification': {
backgroundColor: 'red',
color: 'black',
},
'& .line--etape--planifie': {
backgroundColor: 'blue',
color: 'black',
},
'& .line--etape--termine': {
backgroundColor: 'orange',
color: 'black',
},
'& .line--etape--facture': {
backgroundColor: '#D5F5E3',
color: 'black',
},
'& .line--etape--annule': {
backgroundColor: '#566573',
color: 'white',
},
"& .MuiDataGrid-columnHeaders": {
backgroundColor: "#c8cfd5",
color: "black",
fontSize: 14
},
'& .line--statut--invoiced': {
backgroundColor: '#EAFAF1',
color: '#239B56',
fontWeight: '700'
},
'& .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_session_From_Line(newSelectionModel);*/
if (newSelectionModel.length !== 1) {
setaddOneParticipant();
setdisplay_detail_insc();
setselected_code_session();
setsubmenu();
}
}}
selectionModel={selectionModel}
localeText={frFR.components.MuiDataGrid.defaultProps.localeText}
/>
</Box>
<br />
rows={rowss.map((item, index) => (
{
id: index,
class_internal_url: JSON.parse(item).class_internal_url,
code_session: JSON.parse(item).code_session,
_id: JSON.parse(item)._id,
date_debut: JSON.parse(item).date_debut,
date_fin: JSON.parse(item).date_fin,
distantiel: JSON.parse(item).distantiel,
presentiel: JSON.parse(item).presentiel,
statut: JSON.parse(item).session_status,
etape: JSON.parse(item).session_etape,
formateur: JSON.parse(item).formateur,
nb_participant: JSON.parse(item).nb_participant,
title: JSON.parse(item).titre,
domaine: JSON.parse(item).domaine,
taux_remplissage: JSON.parse(item).taux_remplissage,
nb_inscrit: JSON.parse(item).nb_inscrit,
nb_preinscrit: JSON.parse(item).nb_preinscrit,
duration: JSON.parse(item).duration_concat,
class_external_code: JSON.parse(item).class_external_code,
prix_session: JSON.parse(item).prix_session,
published: JSON.parse(item).class_published,
session_title: JSON.parse(item).titre,
</div>
site_formation_id: JSON.parse(item).site_formation_id,
site_formation_nom: JSON.parse(item).site_formation_code,
invoiced_statut: JSON.parse(item).invoiced_statut,
qty_in_quotation: JSON.parse(item).qty_in_quotation,
qty_in_quotation_list_quotation: JSON.parse(item).qty_in_quotation_list_quotation,
is_session_alert: JSON.parse(item).is_session_alert,
session_alert_message: JSON.parse(item).session_alert_message,
}
))}
columns={columns}
pageSize={10}
className="datagridclass"
onRowDoubleClick={(newSelectionModel) => {
setgridline_id(newSelectionModel.row.id);
setsequence_gridline_id("");
setaddOneSession("0");
setEdite_session("0");
setsessionChanged(false);
//handleClick_edit_session_From_Line(newSelectionModel.row.id);
setselected_session_id(newSelectionModel.row._id);
setsession_selected_row_id(newSelectionModel.row.id);
setDialog_2_message(String(JSON.parse(rowss[newSelectionModel.row.id]).title));
setDialog_2_open(true);
}}
rowsPerPageOptions={[10]}
disableSelectionOnClick
components={{
Toolbar: GridToolbar,
}}
//sx={datagridSx}
getCellClassName={(params) => {
// Traitement du statut "facturé"
if (String(params.row.invoiced_statut) === "2") {
return 'line--statut--invoiced';
}
//field === 'distantiel'
if (params.field === 'distantiel' && String(params.value) === "1") {
return 'cell--distantiel';
}
if (params.field === "presentiel" && String(params.value) == "1") {
return 'cell--presentiel';
}
//field === "etape"
if (params.field === "etape" && String(params.value) == "0") {
return 'cell--etape--projet';
}
if (params.field === "etape" && String(params.value) == "1") {
return 'cell--etape--planification';
}
if (params.field === "etape" && String(params.value) == "2") {
return 'cell--etape--planifie';
}
if (params.field === "etape" && String(params.value) == "3") {
return 'cell--etape--termine';
}
if (params.field === "etape" && String(params.value) == "4") {
return 'cell--etape--facture';
}
if (params.field === "etape" && String(params.value) == "-1") {
return 'cell--etape--annule';
}
// 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';
}
}}
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,
},
[`& .${gridClasses.cell}`]: {
py: 1,
},
}}
/>
</Box>
<br />
</div>}
{(display_session_with_alert && display_session_with_alert === true) &&
<div style={{ height: 550, width: '100%', paddingRight: '5px' }}>
&nbsp;
<Box
sx={{
height: 500,
width: '100%',
paddingRight: '1px',
'& .cell--presentiel': {
backgroundColor: '#a2cf6e',
color: '#1a3e72',
fontWeight: 'bold',
},
'& .cell--distantiel': {
backgroundColor: '#ffac33',
color: '#1a3e72',
fontWeight: 'light',
},
'& .cell--etape--projet': {
backgroundColor: '#E6F7C8',
color: '#1a3e72',
fontWeight: 'light',
},
'& .cell--etape--planification': {
backgroundColor: '#E6CEAA',
color: '#1a3e72',
fontWeight: 'light',
},
'& .cell--etape--planifie': {
backgroundColor: '#F4ECF7',
color: '#1a3e72',
fontWeight: 'light',
},
'& .cell--etape--termine': {
backgroundColor: '#D6EAF8',
color: '#1a3e72',
fontWeight: 'light',
},
'& .cell--etape--facture': {
backgroundColor: '#D5F5E3',
color: '#1a3e72',
fontWeight: 'light',
},
'& .cell--etape--annule': {
backgroundColor: '#566573',
color: '#1a3e72',
fontWeight: 'light',
},
'& .line--etape--projet': {
backgroundColor: 'yellow',
color: 'black',
},
'& .line--etape--planification': {
backgroundColor: 'red',
color: 'black',
},
'& .line--etape--planifie': {
backgroundColor: 'blue',
color: 'black',
},
'& .line--etape--termine': {
backgroundColor: 'orange',
color: 'black',
},
'& .line--etape--facture': {
backgroundColor: '#D5F5E3',
color: 'black',
},
'& .line--etape--annule': {
backgroundColor: '#566573',
color: 'white',
},
"& .MuiDataGrid-columnHeaders": {
backgroundColor: "#c8cfd5",
color: "black",
fontSize: 14
},
'& .line--statut--invoiced': {
backgroundColor: '#EAFAF1',
color: '#239B56',
fontWeight: '700'
},
'& .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_session_From_Line(newSelectionModel);*/
if (newSelectionModel.length !== 1) {
setaddOneParticipant();
setdisplay_detail_insc();
setselected_code_session();
setsubmenu();
}
}}
selectionModel={selectionModel}
localeText={frFR.components.MuiDataGrid.defaultProps.localeText}
rows={rowss.filter((data) => (JSON.parse(data)).is_session_alert === "1").map((item, index) => (
{
id: index,
class_internal_url: JSON.parse(item).class_internal_url,
code_session: JSON.parse(item).code_session,
_id: JSON.parse(item)._id,
date_debut: JSON.parse(item).date_debut,
date_fin: JSON.parse(item).date_fin,
distantiel: JSON.parse(item).distantiel,
presentiel: JSON.parse(item).presentiel,
statut: JSON.parse(item).session_status,
etape: JSON.parse(item).session_etape,
formateur: JSON.parse(item).formateur,
nb_participant: JSON.parse(item).nb_participant,
title: JSON.parse(item).titre,
domaine: JSON.parse(item).domaine,
taux_remplissage: JSON.parse(item).taux_remplissage,
nb_inscrit: JSON.parse(item).nb_inscrit,
nb_preinscrit: JSON.parse(item).nb_preinscrit,
duration: JSON.parse(item).duration_concat,
class_external_code: JSON.parse(item).class_external_code,
prix_session: JSON.parse(item).prix_session,
published: JSON.parse(item).class_published,
session_title: JSON.parse(item).titre,
site_formation_id: JSON.parse(item).site_formation_id,
site_formation_nom: JSON.parse(item).site_formation_code,
invoiced_statut: JSON.parse(item).invoiced_statut,
qty_in_quotation: JSON.parse(item).qty_in_quotation,
qty_in_quotation_list_quotation: JSON.parse(item).qty_in_quotation_list_quotation,
is_session_alert: JSON.parse(item).is_session_alert,
session_alert_message: JSON.parse(item).session_alert_message,
}
))}
columns={columns}
pageSize={10}
className="datagridclass"
onRowDoubleClick={(newSelectionModel) => {
setgridline_id(newSelectionModel.row.id);
setsequence_gridline_id("");
setaddOneSession("0");
setEdite_session("0");
setsessionChanged(false);
//handleClick_edit_session_From_Line(newSelectionModel.row.id);
setselected_session_id(newSelectionModel.row._id);
setsession_selected_row_id(newSelectionModel.row.id);
setDialog_2_message(String(JSON.parse(rowss[newSelectionModel.row.id]).title));
setDialog_2_open(true);
}}
rowsPerPageOptions={[10]}
disableSelectionOnClick
components={{
Toolbar: GridToolbar,
}}
//sx={datagridSx}
getCellClassName={(params) => {
// Traitement du statut "facturé"
if (String(params.row.invoiced_statut) === "2") {
return 'line--statut--invoiced';
}
//field === 'distantiel'
if (params.field === 'distantiel' && String(params.value) === "1") {
return 'cell--distantiel';
}
if (params.field === "presentiel" && String(params.value) == "1") {
return 'cell--presentiel';
}
//field === "etape"
if (params.field === "etape" && String(params.value) == "0") {
return 'cell--etape--projet';
}
if (params.field === "etape" && String(params.value) == "1") {
return 'cell--etape--planification';
}
if (params.field === "etape" && String(params.value) == "2") {
return 'cell--etape--planifie';
}
if (params.field === "etape" && String(params.value) == "3") {
return 'cell--etape--termine';
}
if (params.field === "etape" && String(params.value) == "4") {
return 'cell--etape--facture';
}
if (params.field === "etape" && String(params.value) == "-1") {
return 'cell--etape--annule';
}
// 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';
}
}}
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,
},
[`& .${gridClasses.cell}`]: {
py: 1,
},
}}
/>
</Box>
<br />
</div>}
<div className="div_row">