recette2
cherif 2024-07-09 15:17:55 +02:00
parent 672b8a964e
commit 2f624a32f7
2 changed files with 681 additions and 3 deletions

View File

@ -445,7 +445,8 @@ const DisplayPartnerSession = (props) => {
<div style={{ paddingLeft: "5px", paddingRight: "10px", "display": "block", wordBreak: "break-all" }}> <div style={{ paddingLeft: "5px", paddingRight: "10px", "display": "block", wordBreak: "break-all" }}>
{New_civilite && New_civilite.length > 0 && cellValues.row.civilite && {New_civilite && New_civilite.length > 0 && cellValues.row.civilite &&
<nav> <nav>
{New_civilite.filter((data) => (data).id === String(cellValues.row.civilite))[0].label}
{New_civilite.filter((data) => (data).id === String(cellValues.row.civilite).toLowerCase())[0].label}
</nav> </nav>
} }

View File

@ -54,6 +54,9 @@ import Link from '@mui/material/Link';
import { PiDotsThree } from "react-icons/pi"; import { PiDotsThree } from "react-icons/pi";
import { IoAddCircleOutline, IoCloseCircleOutline } from "react-icons/io5"; import { IoAddCircleOutline, IoCloseCircleOutline } from "react-icons/io5";
import Rating from '@mui/material/Rating'; import Rating from '@mui/material/Rating';
import { BarChart } from '@mui/x-charts';
import { axisClasses } from '@mui/x-charts';
import { LineChart } from '@mui/x-charts/LineChart';
const Employes = (props) => { const Employes = (props) => {
const history = useHistory(); const history = useHistory();
@ -104,6 +107,14 @@ const Employes = (props) => {
date_today_90j.setDate(date_today_90j.getDate() + 90); date_today_90j.setDate(date_today_90j.getDate() + 90);
var date_today_30j = new Date();
date_today_30j.setDate(date_today_30j.getDate() + 30);
var date_today_minus_180j = new Date();
date_today_minus_180j.setDate(date_today_minus_180j.getDate() - 180);
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("");
@ -3099,6 +3110,14 @@ const Employes = (props) => {
document.getElementById("evaluation").style.backgroundColor = "#d8edfc"; document.getElementById("evaluation").style.backgroundColor = "#d8edfc";
document.getElementById("evaluation").style.color = "black"; document.getElementById("evaluation").style.color = "black";
} }
if (document.getElementById("statistiques")) {
document.getElementById("statistiques").style.backgroundColor = "#d8edfc";
document.getElementById("statistiques").style.color = "black";
}
//console.log(" ### employee_data_edit_mode = ", employee_data_edit_mode); //console.log(" ### employee_data_edit_mode = ", employee_data_edit_mode);
if (String(employee_data_edit_mode) !== "1") if (String(employee_data_edit_mode) !== "1")
disable_Employee_DetailFields(); disable_Employee_DetailFields();
@ -3156,6 +3175,13 @@ const Employes = (props) => {
document.getElementById("evaluation").style.backgroundColor = "#d8edfc"; document.getElementById("evaluation").style.backgroundColor = "#d8edfc";
document.getElementById("evaluation").style.color = "black"; document.getElementById("evaluation").style.color = "black";
} }
if (document.getElementById("statistiques")) {
document.getElementById("statistiques").style.backgroundColor = "#d8edfc";
document.getElementById("statistiques").style.color = "black";
}
} }
async function submenu_contrat() { async function submenu_contrat() {
@ -3199,6 +3225,11 @@ const Employes = (props) => {
document.getElementById("evaluation").style.color = "black"; document.getElementById("evaluation").style.color = "black";
} }
if (document.getElementById("statistiques")) {
document.getElementById("statistiques").style.backgroundColor = "#d8edfc";
document.getElementById("statistiques").style.color = "black";
}
} }
@ -3243,6 +3274,65 @@ const Employes = (props) => {
document.getElementById("piece_jointe").style.color = "black"; document.getElementById("piece_jointe").style.color = "black";
} }
if (document.getElementById("statistiques")) {
document.getElementById("statistiques").style.backgroundColor = "#d8edfc";
document.getElementById("statistiques").style.color = "black";
}
}
async function submenu_statistiques() {
setsubmenu("statistiques");
await sleep(5);
if (document.getElementById("statistiques")) {
document.getElementById("statistiques").style.backgroundColor = "#104277";
document.getElementById("statistiques").style.color = "white";
}
if (document.getElementById("evaluation")) {
document.getElementById("evaluation").style.backgroundColor = "#d8edfc";
document.getElementById("evaluation").style.color = "black";
}
if (document.getElementById("contrat")) {
document.getElementById("contrat").style.backgroundColor = "#d8edfc";
document.getElementById("contrat").style.color = "black";
}
if (document.getElementById("affectation")) {
document.getElementById("affectation").style.backgroundColor = "#d8edfc";
document.getElementById("affectation").style.color = "black";
}
if (document.getElementById("detail_employe")) {
document.getElementById("detail_employe").style.backgroundColor = "#d8edfc";
document.getElementById("detail_employe").style.color = "black";
}
if (document.getElementById("droit_acces")) {
document.getElementById("droit_acces").style.backgroundColor = "#d8edfc";
document.getElementById("droit_acces").style.color = "black";
}
if (document.getElementById("competence")) {
document.getElementById("competence").style.backgroundColor = "#d8edfc";
document.getElementById("competence").style.color = "black";
}
if (document.getElementById("piece_jointe")) {
document.getElementById("piece_jointe").style.backgroundColor = "#d8edfc";
document.getElementById("piece_jointe").style.color = "black";
}
Getall_Employee_Statistic_Question_List();
} }
@ -3289,6 +3379,14 @@ const Employes = (props) => {
document.getElementById("evaluation").style.color = "black"; document.getElementById("evaluation").style.color = "black";
} }
if (document.getElementById("statistiques")) {
document.getElementById("statistiques").style.backgroundColor = "#d8edfc";
document.getElementById("statistiques").style.color = "black";
}
setSelectionModel_affectations([]); setSelectionModel_affectations([]);
setdisplay_affectation("0"); setdisplay_affectation("0");
setAdd_new_affectation(""); setAdd_new_affectation("");
@ -3332,6 +3430,13 @@ const Employes = (props) => {
document.getElementById("droit_acces").style.color = "black"; document.getElementById("droit_acces").style.color = "black";
} }
if (document.getElementById("statistiques")) {
document.getElementById("statistiques").style.backgroundColor = "#d8edfc";
document.getElementById("statistiques").style.color = "black";
}
Getall_Partner_Competence_List(); Getall_Partner_Competence_List();
} }
@ -3376,6 +3481,11 @@ const Employes = (props) => {
document.getElementById("evaluation").style.color = "black"; document.getElementById("evaluation").style.color = "black";
} }
if (document.getElementById("statistiques")) {
document.getElementById("statistiques").style.backgroundColor = "#d8edfc";
document.getElementById("statistiques").style.color = "black";
}
} }
@ -3510,6 +3620,87 @@ const Employes = (props) => {
}) })
} }
const [New_Getall_Employee_Statistic_Question_List_result, setNew_Getall_Employee_Statistic_Question_List_result] = useState([]);
const [Getall_Employee_Statistic_Question_List_api, setGetall_Employee_Statistic_Question_List_api] = useState();
const [Getall_Employee_Statistic_Question_List_message, setGetall_Employee_Statistic_Question_List_message] = useState();
const [Getall_Employee_Statistic_Question_List_result, setGetall_Employee_Statistic_Question_List_result] = useState([]);
function Getall_Employee_Statistic_Question_List(event) {
var form = new FormData();
const stored_cookie = getCookie('tokenmysypart');
form.append("token", stored_cookie);
form.append("related_collection", "ressource_humaine");
form.append("related_collection_id", selected_id);
var myurl = process.env.REACT_APP_API_URL + "myclass/api/Get_Entity_Question_List_With_Stat_For_Given_related_collection_id/";
setLoading(true);
axios.post(myurl, form).then(res => {
setLoading(false);
if (String(res.data.status) === String("true")) {
//console.log(" In Getall_Employee_Statistic_Question_List res.data.status = " + res.data.status);
//console.log(" In Getall_Employee_Statistic_Question_List res.data.message r_class = " + res.data.message);
setGetall_Employee_Statistic_Question_List_api("true");
setGetall_Employee_Statistic_Question_List_result(res.data.message);
var new_data2 = [];
const new_data = res.data.message.map((x) => {
//---
var localid = JSON.parse(x).id;
var local_id = JSON.parse(x).question_id;
var local_question_id = JSON.parse(x).question_id;
var local_question_question = JSON.parse(x).question_question;
//---
var node = {
"_id": local_id,
"id": localid,
"question_id": local_question_id,
"label": local_question_question,
"question_question": local_question_question,
};
new_data2.push(node);
});
//---
var node = {
"_id": "",
"id": "",
"question_id": "",
"label": "",
"question_question": "",
};
new_data2.push(node);
if (new_data2.length > 0)
setNew_Getall_Employee_Statistic_Question_List_result(new_data2);
}
else {
setGetall_Employee_Statistic_Question_List_api("false");
setGetall_Employee_Statistic_Question_List_message(res.data.message);
alert(res.data.message);
}
}).catch((error) => {
setLoading(false);
console.warn('Not good man :( Getall_Employee_Statistic_Question_List = ', error);
setGetall_Employee_Statistic_Question_List_api("false");
alert(" Impossible de recuperer la liste des questions ");
//setmyApimyApiMessage("")
})
}
const New_Option_Oui_Non = [ const New_Option_Oui_Non = [
{ {
value: '1', value: '1',
@ -5414,6 +5605,128 @@ const Employes = (props) => {
}) })
} }
const [Dialog_1_open_statistique, setDialog_1_open_statistique] = React.useState(false);
const [Dialog_1_message_statistique, setDialog_1_message_statistique] = React.useState("Gestion Statistique");
const Dialog_1_handleClose_buton_statistique = () => {
setDialog_1_open_statistique(false);
};
const [selected_statistic_question_id, setselected_statistic_question_id] = useState("");
const [p_filter_date_from, setp_filter_date_from] = useState(date_today_minus_180j.toLocaleDateString('fr-FR'));
const [p_filter_date_to, setp_filter_date_to] = useState(date_today_30j.toLocaleDateString('fr-FR'));
const [Getall_Qry_Survey_Data_result_JSON, setGetall_Qry_Survey_Data_result_JSON] = useState([]);
const [Getall_Qry_Survey_Data_api, setGetall_Qry_Survey_Data_api] = useState();
const [Getall_Qry_Survey_Data_message, setGetall_Qry_Survey_Data_message] = useState();
const [Getall_Qry_Survey_Data_result, setGetall_Qry_Survey_Data_result] = useState([]);
function Getall_Qry_Survey_Data(event) {
var form = new FormData();
const stored_cookie = getCookie('tokenmysypart');
var date_from = "";
if (p_filter_date_from) {
date_from = p_filter_date_from;
}
var date_to = "";
if (p_filter_date_to) {
date_to = p_filter_date_to;
}
form.append("token", stored_cookie);
form.append("periode_start_date", date_from);
form.append("periode_end_date", date_to);
form.append("related_collection", "ressource_humaine");
form.append("related_collection_id", selected_id);
form.append("question_id", selected_statistic_question_id);
var myurl = process.env.REACT_APP_API_URL + "myclass/api/Get_Survey_Stat_Data_For_Given_related_collection_id/";
setLoading(true);
axios.post(myurl, form).then(res => {
setLoading(false);
if (String(res.data.status) === String("true")) {
//console.log(" In Getall_Qry_Survey_Data res.data.status = " + res.data.status);
//console.log(" In Getall_Qry_Survey_Data res.data.message r_class = " + res.data.message);
var jsonObj = JSON.parse('[' + res.data.message + ']');
var jsonObj0 = jsonObj[0]
var new_data2 = [];
const new_data = jsonObj0.map((x) => {
var month_year = (x).month_year;
var label = (x).label;
var value = (x).value;
var count = (x).count;
var nb_question_response = parseFloat((x).nb_question_response);
var somme_question_response = parseFloat((x).somme_question_response);
var moyenne_question_response = parseFloat((x).moyenne_question_response);
//---
var node = {
"month_year": month_year,
"label": label,
"value": value,
"count": count,
"nb_question_response": parseInt(String(nb_question_response)),
"somme_question_response": parseFloat(String(somme_question_response)),
"moyenne_question_response": parseFloat(String(moyenne_question_response)),
};
new_data2.push(node);
});
setGetall_Qry_Survey_Data_result_JSON(new_data2);
//setGetall_Qry_Survey_Data_result_JSON(JSON.parse('[' + res.data.message + ']'));
setGetall_Qry_Survey_Data_api("true");
setGetall_Qry_Survey_Data_result(res.data.message);
}
else {
setGetall_Qry_Survey_Data_api("false");
setGetall_Qry_Survey_Data_message(res.data.message);
alert(res.data.message)
}
}).catch((error) => {
setLoading(false);
console.warn('Not good man :( Getall_Qry_Survey_Data = ', error);
setGetall_Qry_Survey_Data_api("false");
alert("Impossible de récuperer les données demandées")
//setmyApimyApiMessage("")
})
}
const otherSetting = {
height: 300,
yAxis: [{ label: 'rainfall (mm)' }],
grid: { horizontal: true },
sx: {
[`& .${axisClasses.left} .${axisClasses.label}`]: {
transform: 'translateX(-10px)',
},
},
};
const valueFormatter = (value) => `${value}`;
return ( return (
<div className="employes"> <div className="employes">
@ -5422,6 +5735,192 @@ const Employes = (props) => {
<div className="mysy_spinner"> <img src={img_loading_spin} /> </div> <div className="mysy_spinner"> <img src={img_loading_spin} /> </div>
</div>} </div>}
{/*** GESTION STATISTIQUE */}
<Dialog
open={Dialog_1_open_statistique}
onClose={Dialog_1_handleClose_buton_statistique}
className="displaypartnersession"
>
<DialogTitle>MySy Information</DialogTitle>
<DialogContent className="DialogContent_width" style={{ "minHeight": "20rem" }}>
<div className="session_caract_Dialog" > Choisir une question
{New_Getall_Employee_Statistic_Question_List_result && New_Getall_Employee_Statistic_Question_List_result.length > 0 &&
<Autocomplete
disablePortal
id="competence_nom"
name="competence_nom"
fullWidth
options={New_Getall_Employee_Statistic_Question_List_result}
value={New_Getall_Employee_Statistic_Question_List_result.filter((data) => (data)._id === String(selected_statistic_question_id))[0].label}
onChange={(event, value) => {
if (value && value._id) {
setselected_statistic_question_id(value.question_id);
} else {
setselected_statistic_question_id("");
}
}}
renderInput={(params) => <TextField {...params} label="" placeholder="Choisir une option"
inputProps={{ ...params.inputProps, style: { fontSize: 12, height: "1.4rem" } }}
/>
}
/>}
{selected_statistic_question_id && String(selected_statistic_question_id) !== "d" && <div>
<div className="session_caract_Dialog">
Date Debut
<DatePicker
name="one_sessiondatedebut"
id="one_sessiondatedebut"
selected={new Date(moment(p_filter_date_from, "DD/MM/YYYY"))}
onChange={(date) => {
setp_filter_date_from(format(date, 'dd/MM/yyyy'));
}
}
showTimeSelect={false}
dateFormat="dd/MM/yyyy"
className="disabled_style session_caract_Dialog_DatePicker"
locale='fr-FR'
/>
</div>
<div className="session_caract_Dialog">
Date Fin
<DatePicker
name="one_sessiondatefin"
id="one_sessiondatefin"
selected={new Date(moment(p_filter_date_to, "DD/MM/YYYY"))}
onChange={(date) => {
setp_filter_date_to(format(date, 'dd/MM/yyyy'));
}
}
showTimeSelect={false}
dateFormat="dd/MM/yyyy"
className="disabled_style session_caract_Dialog_DatePicker"
/>
</div>
<br />
</div>}
</div>
<div style={{ "height": "25rem" }}>
<Box style={{ "color": "black", "height": "30rem" }}>
&nbsp;
<div className="session_data" style={{ paddingLeft: "2rem" }}>
{Getall_Qry_Survey_Data_result_JSON && Getall_Qry_Survey_Data_result_JSON.length > 0 &&
Getall_Qry_Survey_Data_result_JSON &&
<BarChart
dataset={Getall_Qry_Survey_Data_result_JSON}
xAxis={[{
scaleType: 'band', dataKey: 'month_year', tickPlacement: 'middle',
valueFormatter: (month, context) =>
context.location === 'tick'
? `${month.slice(0, 2)}` + "\n" + `${month.slice(3, 7)}`
: `${month}`,
}]}
series={[
{ dataKey: 'nb_question_response', label: 'NB', valueFormatter },
{ dataKey: 'somme_question_response', label: 'Somme', color: '#FA7070', valueFormatter },
{ dataKey: 'moyenne_question_response', label: 'Moyenne', color: '#FA7070', valueFormatter },
]}
{...otherSetting}
margin={{ right: 15, left: 100 }}
/>}
</div>
</Box>
<br />
</div>
<div style={{ "height": "25rem" }}>
<Box style={{ "color": "black", "height": "30rem" }}>
&nbsp;
<div className="session_data" style={{ paddingLeft: "2rem", height: '20rem' }}>
{Getall_Qry_Survey_Data_result_JSON && Getall_Qry_Survey_Data_result_JSON.length > 0 &&
Getall_Qry_Survey_Data_result_JSON &&
<LineChart
dataset={Getall_Qry_Survey_Data_result_JSON}
xAxis={[{
scaleType: 'band', dataKey: 'month_year', tickPlacement: 'middle',
valueFormatter: (month, context) =>
context.location === 'tick'
? `${month.slice(0, 2)}` + " \n" + `${month.slice(3, 7)}`
: `${month}`,
}]}
series={[
{ dataKey: 'nb_question_response', label: 'NB', valueFormatter: (value) => (value == null ? 'NaN' : value.toString()), },
{ dataKey: 'somme_question_response', label: 'Somme', color: '#FA7070', valueFormatter: (value) => (value == null ? 'NaN' : value.toString()), },
{ dataKey: 'moyenne_question_response', label: 'Moyenne', color: '#FA7070', valueFormatter: (value) => (value == null ? 'NaN' : value.toString()), },
]}
margin={{ right: 15, left: 100 }}
/>
}
</div>
</Box>
<br />
</div>
</DialogContent>
<DialogActions>
<div className="div_row">
{String(selected_statistic_question_id) !== "" && <div className="div_row_gauche"> <Button onClick={Getall_Qry_Survey_Data} className="bton_enreg_dialog"> Afficher</Button> </div>}
<div className="div_row_droite" style={{ "textAlign": 'center' }}>
<Button onClick={Dialog_1_handleClose_buton_statistique} className="bton_annule_dialog" >Fermer</Button>
</div>
</div>
</DialogActions>
</Dialog>
{/*** FIN GESTION STATISTIQUE */}
{/*** GESTION COMPETENCES */} {/*** GESTION COMPETENCES */}
<Dialog <Dialog
open={Dialog_1_open_competence} open={Dialog_1_open_competence}
@ -6796,7 +7295,7 @@ const Employes = (props) => {
<Button variant="outlined" onClick={submenu_affectation} className="detail_class_submenu" id='affectation' name='affectation'>Affectation </Button> <Button variant="outlined" onClick={submenu_affectation} className="detail_class_submenu" id='affectation' name='affectation'>Affectation </Button>
<Button variant="outlined" onClick={submenu_contrat} className="detail_class_submenu" id='affectation' name='contrat'>Contrat </Button> <Button variant="outlined" onClick={submenu_contrat} className="detail_class_submenu" id='affectation' name='contrat'>Contrat </Button>
<Button variant="outlined" onClick={submenu_evaluation} className="detail_class_submenu" id='evaluation' name='evaluation'>Evaluation </Button> <Button variant="outlined" onClick={submenu_evaluation} className="detail_class_submenu" id='evaluation' name='evaluation'>Evaluation </Button>
<Button variant="outlined" onClick={submenu_statistiques} className="detail_class_submenu" id='statistiques' name='statistiques'>Statistiques </Button>
</div> </div>
<nav style={{ "border": "None", "fontSize": "22px", "fontWeight": "600" }}> Détail Employé </nav> <nav style={{ "border": "None", "fontSize": "22px", "fontWeight": "600" }}> Détail Employé </nav>
@ -9537,7 +10036,7 @@ const Employes = (props) => {
</div>} </div>}
{String(submenu) === "competence" && <div className="div_row" style={{ paddingRight: '10px' }}> {String(submenu) === "competence" && <div className="div_row" style={{ pInitialiseraddingRight: '10px' }}>
<div className="div_row"> <div className="div_row">
<Button variant="outlined" onClick={submenu_detail_employe} className="detail_class_submenu" id='detail_employe' name='detail_employe'>Détail employé</Button> <Button variant="outlined" onClick={submenu_detail_employe} className="detail_class_submenu" id='detail_employe' name='detail_employe'>Détail employé</Button>
<Button variant="outlined" onClick={submenu_competence} className="detail_class_submenu" id='competence' name='contrat'>Compétences </Button> <Button variant="outlined" onClick={submenu_competence} className="detail_class_submenu" id='competence' name='contrat'>Compétences </Button>
@ -9627,6 +10126,8 @@ const Employes = (props) => {
</div> </div>
<nav style={{ "border": "None", "fontSize": "22px", "fontWeight": "600" }}> Les evaluations </nav> <nav style={{ "border": "None", "fontSize": "22px", "fontWeight": "600" }}> Les evaluations </nav>
<div className="session_data" style={{ "minHeight": '15rem', "paddingLeft": "10px", "paddingRight": "10px" }}> <div className="session_data" style={{ "minHeight": '15rem', "paddingLeft": "10px", "paddingRight": "10px" }}>
<div className="titre1"> Evaluation par les apprenants </div> <div className="titre1"> Evaluation par les apprenants </div>
Evaluation <br /> Evaluation <br />
@ -9761,9 +10262,185 @@ const Employes = (props) => {
</div>} </div>}
{String(submenu) === "statistiques" && <div className="div_row" style={{ paddingRight: '10px' }}>
<div className="div_row">
<Button variant="outlined" onClick={submenu_detail_employe} className="detail_class_submenu" id='detail_employe' name='detail_employe'>Détail employé</Button>
<Button variant="outlined" onClick={submenu_competence} className="detail_class_submenu" id='competence' name='contrat'>Compétences </Button>
<Button variant="outlined" onClick={submenu_piece_jointe} className="detail_class_submenu" id='piece_jointe' name='contrat'>Pièces Jointes </Button>
<Button variant="outlined" onClick={submenu_droit_acces} className="detail_class_submenu" id='droit_acces' name='droit_acces'>Droits d'accès </Button>
<Button variant="outlined" onClick={submenu_affectation} className="detail_class_submenu" id='affectation' name='affectation'>Affectation </Button>
<Button variant="outlined" onClick={submenu_contrat} className="detail_class_submenu" id='affectation' name='contrat'>Contrat </Button>
<Button variant="outlined" onClick={submenu_evaluation} className="detail_class_submenu" id='evaluation' name='evaluation'>Evaluation </Button>
<Button variant="outlined" onClick={submenu_statistiques} className="detail_class_submenu" id='statistiques' name='statistiques'>Statistiques </Button>
</div>
<nav style={{ "border": "None", "fontSize": "22px", "fontWeight": "600" }}> Les Statitiques </nav>
<div className="div_row" >
Choisir une question
{New_Getall_Employee_Statistic_Question_List_result && New_Getall_Employee_Statistic_Question_List_result.length > 0 &&
<Autocomplete
disablePortal
id="competence_nom"
name="competence_nom"
fullWidth
options={New_Getall_Employee_Statistic_Question_List_result}
value={New_Getall_Employee_Statistic_Question_List_result.filter((data) => (data)._id === String(selected_statistic_question_id))[0].label}
onChange={(event, value) => {
if (value && value._id) {
setselected_statistic_question_id(value.question_id);
} else {
setselected_statistic_question_id("");
}
}}
renderInput={(params) => <TextField {...params} label="" placeholder="Choisir une option"
inputProps={{ ...params.inputProps, style: { fontSize: 12, height: "1.4rem" } }}
/>
}
/>}
{selected_statistic_question_id && String(selected_statistic_question_id) !== "d" && <div>
<div className="session_caract_Dialog">
Date Debut
<DatePicker
name="one_sessiondatedebut"
id="one_sessiondatedebut"
selected={new Date(moment(p_filter_date_from, "DD/MM/YYYY"))}
onChange={(date) => {
setp_filter_date_from(format(date, 'dd/MM/yyyy'));
}
}
showTimeSelect={false}
dateFormat="dd/MM/yyyy"
className="disabled_style session_caract_Dialog_DatePicker"
locale='fr-FR'
/>
</div>
<div className="session_caract_Dialog">
Date Fin
<DatePicker
name="one_sessiondatefin"
id="one_sessiondatefin"
selected={new Date(moment(p_filter_date_to, "DD/MM/YYYY"))}
onChange={(date) => {
setp_filter_date_to(format(date, 'dd/MM/yyyy'));
}
}
showTimeSelect={false}
dateFormat="dd/MM/yyyy"
className="disabled_style session_caract_Dialog_DatePicker"
/>
</div>
<br />
</div>}
</div>
<div className="div_row">
{String(selected_statistic_question_id) !== "" && <div className="div_row_gauche"> <Button onClick={Getall_Qry_Survey_Data} className="bton_enreg_dialog"> Afficher</Button> </div>}
<div className="div_row_droite" style={{ "textAlign": 'center' }}>
<Button onClick={Dialog_1_handleClose_buton_statistique} className="bton_annule_dialog" >Fermer</Button>
</div>
</div>
<div style={{ "height": "25rem" }}>
<Box style={{ "color": "black", "height": "30rem" }}>
&nbsp;
<div className="session_data" style={{ paddingLeft: "2rem" }}>
{Getall_Qry_Survey_Data_result_JSON && Getall_Qry_Survey_Data_result_JSON.length > 0 &&
Getall_Qry_Survey_Data_result_JSON &&
<BarChart
dataset={Getall_Qry_Survey_Data_result_JSON}
xAxis={[{
scaleType: 'band', dataKey: 'month_year', tickPlacement: 'middle',
valueFormatter: (month, context) =>
context.location === 'tick'
? `${month.slice(0, 2)}` + "\n" + `${month.slice(3, 7)}`
: `${month}`,
}]}
series={[
{ dataKey: 'nb_question_response', label: 'NB', valueFormatter },
{ dataKey: 'somme_question_response', label: 'Somme', color: '#FA7070', valueFormatter },
{ dataKey: 'moyenne_question_response', label: 'Moyenne', color: '#FA7070', valueFormatter },
]}
{...otherSetting}
margin={{ right: 15, left: 100 }}
/>}
</div>
</Box>
<br />
</div>
<div style={{ "height": "25rem" }}>
<Box style={{ "color": "black", "height": "30rem" }}>
&nbsp;
<div className="session_data" style={{ paddingLeft: "2rem", height: '20rem' }}>
{Getall_Qry_Survey_Data_result_JSON && Getall_Qry_Survey_Data_result_JSON.length > 0 &&
Getall_Qry_Survey_Data_result_JSON &&
<LineChart
dataset={Getall_Qry_Survey_Data_result_JSON}
xAxis={[{
scaleType: 'band', dataKey: 'month_year', tickPlacement: 'middle',
valueFormatter: (month, context) =>
context.location === 'tick'
? `${month.slice(0, 2)}` + " \n" + `${month.slice(3, 7)}`
: `${month}`,
}]}
series={[
{ dataKey: 'nb_question_response', label: 'NB', valueFormatter: (value) => (value == null ? 'NaN' : value.toString()), },
{ dataKey: 'somme_question_response', label: 'Somme', color: '#FA7070', valueFormatter: (value) => (value == null ? 'NaN' : value.toString()), },
{ dataKey: 'moyenne_question_response', label: 'Moyenne', color: '#FA7070', valueFormatter: (value) => (value == null ? 'NaN' : value.toString()), },
]}
margin={{ right: 15, left: 100 }}
/>
}
</div>
</Box>
<br />
</div>
</div>}
</div > </div >
); );
} }