dss
parent
6059d7abe2
commit
30f51ccdaa
|
@ -40,6 +40,16 @@ import DialogContent from '@mui/material/DialogContent';
|
|||
import DialogContentText from '@mui/material/DialogContentText';
|
||||
import DialogTitle from '@mui/material/DialogTitle';
|
||||
import AttachFileIcon from '@mui/icons-material/AttachFile';
|
||||
import { BarChart } from '@mui/x-charts';
|
||||
import { axisClasses } from '@mui/x-charts';
|
||||
import { LineChart } from '@mui/x-charts/LineChart';
|
||||
import BarChartIcon from '@mui/icons-material/BarChart';
|
||||
import SsidChartIcon from '@mui/icons-material/SsidChart';
|
||||
import { RiFileExcel2Line } from "react-icons/ri";
|
||||
import DatePicker from "react-datepicker";
|
||||
import "react-datepicker/dist/react-datepicker.css";
|
||||
import { format } from 'date-fns'
|
||||
import moment from "moment";
|
||||
|
||||
const AddClassManual = (props) => {
|
||||
const history = useHistory();
|
||||
|
@ -69,6 +79,18 @@ const AddClassManual = (props) => {
|
|||
const [mydistance_label, setmydistance_label] = useState("Non");
|
||||
|
||||
|
||||
var date_today_90j = new Date();
|
||||
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 [importmessage, setimportmessage] = useState("");
|
||||
const [myApiResponse, setmyApiResponse] = useState("");
|
||||
const setText = "coucou";
|
||||
|
@ -3162,6 +3184,13 @@ const AddClassManual = (props) => {
|
|||
}
|
||||
|
||||
|
||||
function submenu_statistiques() {
|
||||
setsubmenu("statistiques");
|
||||
submenu_color_management("statistiques");
|
||||
Getall_Employee_Statistic_Question_List();
|
||||
}
|
||||
|
||||
|
||||
const myRef = useRef(null)
|
||||
|
||||
const [p_detail_external_code, setp_detail_external_code] = useState("");
|
||||
|
@ -3406,6 +3435,281 @@ const AddClassManual = (props) => {
|
|||
|
||||
const [add_ue_evalution, setadd_ue_evalution] = React.useState("");
|
||||
|
||||
|
||||
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", "");
|
||||
form.append("related_collection_id", "");
|
||||
form.append("class_id", selected_class_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 local_question_type = JSON.parse(x).question_type;
|
||||
|
||||
|
||||
//---
|
||||
var node = {
|
||||
"_id": local_id,
|
||||
"id": localid,
|
||||
"question_id": local_question_id,
|
||||
"label": local_question_question,
|
||||
"question_question": local_question_question,
|
||||
"question_type": local_question_type,
|
||||
};
|
||||
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 [selected_statistic_question_id, setselected_statistic_question_id] = useState("");
|
||||
const [selected_statistic_question_type, setselected_statistic_question_type] = 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 [Global_Getall_Qry_Survey_Data_result_JSON, setGlobal_Getall_Qry_Survey_Data_result_JSON] = useState([]);
|
||||
|
||||
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", "");
|
||||
form.append("related_collection_id", "");
|
||||
form.append("question_id", selected_statistic_question_id);
|
||||
form.append("class_id", selected_class_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 json_data = JSON.parse(res.data.message[0]);
|
||||
|
||||
//console.log(" ### json_data = ", json_data);
|
||||
var jsonObj0 = json_data.data
|
||||
|
||||
//console.log(" ### jsonObj0 = ", jsonObj0);
|
||||
|
||||
var new_data2 = [];
|
||||
const new_data = jsonObj0.map((x) => {
|
||||
var month_year = (x).month_year;
|
||||
var type_question = (x).type_question;
|
||||
var label = (x).label;
|
||||
var value = parseFloat((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,
|
||||
"type_question": type_question,
|
||||
"value": parseFloat(String(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 + ']'));
|
||||
|
||||
//console.log(" ### new_data2 011 = ", new_data2);
|
||||
|
||||
|
||||
var jsonObj0_global = json_data.global
|
||||
//console.log(" ### jsonObj0_global= ", jsonObj0_global);
|
||||
setGlobal_Getall_Qry_Survey_Data_result_JSON(jsonObj0_global);
|
||||
|
||||
|
||||
|
||||
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}`;
|
||||
|
||||
const [display_view, setdisplay_view] = useState("line");
|
||||
function func_display_line_view() {
|
||||
setdisplay_view("line");
|
||||
}
|
||||
|
||||
function func_display_bars_view() {
|
||||
setdisplay_view("bars");
|
||||
}
|
||||
|
||||
|
||||
|
||||
function Export_Statistic_to_Excel(local_dashbord_internal_id) {
|
||||
|
||||
const stored_cookie = getCookie('tokenmysypart');
|
||||
|
||||
var date_from = "";
|
||||
if (p_filter_date_from) {
|
||||
date_from = p_filter_date_from;
|
||||
date_from = date_from.replaceAll('/', "-")
|
||||
|
||||
}
|
||||
|
||||
var date_to = "";
|
||||
if (p_filter_date_to) {
|
||||
date_to = p_filter_date_to;
|
||||
date_to = date_to.replaceAll('/', "-")
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
var nom_fichier_cmd_excel = "export_excel.xlsx";
|
||||
var local_related_collection = "inscription";
|
||||
//console.log(" nom_fichier_cmd = ", nom_fichier_cmd, " --- local_dashbord_internal_id = ", local_dashbord_internal_id);
|
||||
|
||||
var url = process.env.REACT_APP_API_URL + "myclass/api/Export_Excel_Survey_Stat_Data_For_Given_related_collection_id/" + stored_cookie + "/" + local_related_collection + "/-/" + date_from + "/" + date_to + "/" + selected_statistic_question_id + "/" + selected_class_id + "/";
|
||||
|
||||
//console.log(" nom_fichier_cmd = ", nom_fichier_cmd, " --- selected_id = ", selected_id, " --- url =", url);
|
||||
|
||||
console.log(" #### url = ", url)
|
||||
|
||||
setLoading(true);
|
||||
axios.get(url, { responseType: 'blob', },)
|
||||
.then((res) => {
|
||||
setLoading(false);
|
||||
//console.log(" In Export_Dashbord_to_CSV res.data = " + res.data);
|
||||
if (String(res.data) === String("false")) {
|
||||
alert("Impossible d'exporter les données (2) ");
|
||||
} else {
|
||||
fileDownload(res.data, nom_fichier_cmd_excel)
|
||||
|
||||
}
|
||||
}).catch((error) => {
|
||||
setLoading(false);
|
||||
console.error('Error:', error);
|
||||
alert(" Impossible d'exporter les données ")
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<div className="addclassmanual">
|
||||
{isLoading && <div className="loader-container">
|
||||
|
@ -3796,8 +4100,9 @@ const AddClassManual = (props) => {
|
|||
|
||||
<Button variant="outlined" onClick={submenu_note_evaluation} className="detail_class_submenu" id='note_evaluation' name='note_evaluation'>Notes & Evaluation </Button>
|
||||
|
||||
|
||||
<Button variant="outlined" onClick={submenu_piece_jointe} className="detail_class_submenu" id='piece_jointe' name='piece_jointe'>Pièces Jointes </Button>
|
||||
|
||||
<Button variant="outlined" onClick={submenu_statistiques} className="detail_class_submenu" id='statistiques' name='statistiques'>Statistiques </Button>
|
||||
</div>}
|
||||
|
||||
{String(props.formation_initiale) !== "1" &&
|
||||
|
@ -4955,7 +5260,6 @@ const AddClassManual = (props) => {
|
|||
{/* -- end champs specifiques **/}
|
||||
|
||||
</div>}
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
@ -5641,6 +5945,219 @@ const AddClassManual = (props) => {
|
|||
|
||||
</div>}
|
||||
|
||||
{submenu && String(submenu) === "statistiques" && <div style={{ height: "80rem", width: '100%', paddingRight: '10px', paddingLeft: '10px' }}>
|
||||
<div>
|
||||
<nav style={{ "border": "None", "fontSize": "22px", "fontWeight": "600" }}> Les Statitiques </nav>
|
||||
|
||||
<div className="div_row" style={{ "border": "None" }} >
|
||||
<div className="session_caract">
|
||||
Choisir une question
|
||||
{New_Getall_Employee_Statistic_Question_List_result && New_Getall_Employee_Statistic_Question_List_result.length > 0 &&
|
||||
<div style={{ width: '100%', }}>
|
||||
|
||||
|
||||
<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);
|
||||
setselected_statistic_question_type(value.question_type);
|
||||
} else {
|
||||
setselected_statistic_question_id("");
|
||||
setselected_statistic_question_type("");
|
||||
}
|
||||
}}
|
||||
|
||||
renderInput={(params) => <TextField {...params} label="" placeholder="Choisir une option"
|
||||
inputProps={{ ...params.inputProps, style: { fontSize: 12, height: "1.4rem" } }}
|
||||
|
||||
/>
|
||||
}
|
||||
/>
|
||||
</div>}
|
||||
</div>
|
||||
|
||||
{selected_statistic_question_id && String(selected_statistic_question_id) !== "d" &&
|
||||
|
||||
<div style={{ width: '100%', marginRight: '1rem', 'float': 'left' }}>
|
||||
|
||||
<div style={{ width: '100%', marginRight: '1rem', 'float': 'left' }}>
|
||||
<div className="session_caract">
|
||||
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>
|
||||
<div style={{ width: '100%', marginRight: '1rem', 'float': 'left' }}>
|
||||
|
||||
<div className="session_caract">
|
||||
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>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>}
|
||||
</div>
|
||||
<div className="session_caract">
|
||||
{String(selected_statistic_question_id) !== "" && <div> <Button onClick={Getall_Qry_Survey_Data} className="bton_enreg_dialog"> Afficher</Button> </div>}
|
||||
|
||||
</div>
|
||||
|
||||
{Getall_Qry_Survey_Data_result_JSON && Getall_Qry_Survey_Data_result_JSON.length > 0 &&
|
||||
Getall_Qry_Survey_Data_result_JSON && <div style={{ "height": "30rem" }}>
|
||||
|
||||
{display_view && String(display_view) === "bars" && <div style={{ "textAlign": "right", "float": "right", "width": "100%" }}>
|
||||
Affichage
|
||||
<nav className="mode_affichage" onClick={Export_Statistic_to_Excel}> <RiFileExcel2Line /> Export </nav>
|
||||
<nav className="mode_affichage" onClick={func_display_line_view}> <SsidChartIcon /> Ligne </nav>
|
||||
<nav className="mode_affichage mode_affichage_selected" onClick={func_display_bars_view}> <BarChartIcon /> Bar </nav>
|
||||
|
||||
|
||||
|
||||
</div>}
|
||||
|
||||
{display_view && String(display_view) === "line" && <div style={{ "textAlign": "right", "float": "right", "width": "100%" }}>
|
||||
Affichage
|
||||
<nav className="mode_affichage" onClick={Export_Statistic_to_Excel}> <RiFileExcel2Line /> Export </nav>
|
||||
<nav className="mode_affichage mode_affichage_selected" onClick={func_display_line_view}> <SsidChartIcon /> Ligne </nav>
|
||||
<nav className="mode_affichage" onClick={func_display_bars_view}> <BarChartIcon /> Bar </nav>
|
||||
</div>}
|
||||
|
||||
|
||||
{display_view && String(display_view) === "bars" && <Box style={{ "color": "black", "height": "30rem" }}>
|
||||
|
||||
|
||||
<div className="session_data" style={{ paddingLeft: "2rem", height: '30rem' }}>
|
||||
|
||||
{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: 'value', label: `${selected_statistic_question_type}`, color: '#FA7070', valueFormatter },
|
||||
|
||||
|
||||
]}
|
||||
{...otherSetting}
|
||||
margin={{ right: 15, left: 100 }}
|
||||
height={450}
|
||||
/>}
|
||||
</div>
|
||||
|
||||
</Box>}
|
||||
|
||||
{display_view && String(display_view) === "line" && <Box style={{ "color": "black", "height": "30rem" }}>
|
||||
|
||||
|
||||
<div className="session_data" style={{ paddingLeft: "2rem", height: '30rem' }}>
|
||||
|
||||
|
||||
{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: 'value', label: `${selected_statistic_question_type}`, color: '#FA7070', valueFormatter: (value) => (value == null ? 'NaN' : value.toString()), },
|
||||
]}
|
||||
|
||||
margin={{ right: 15, left: 100 }}
|
||||
height={450}
|
||||
/>
|
||||
|
||||
|
||||
|
||||
}
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</Box>}
|
||||
|
||||
<br />
|
||||
{Global_Getall_Qry_Survey_Data_result_JSON && <div>
|
||||
|
||||
Nombre total d'enquetes sur la période : {Global_Getall_Qry_Survey_Data_result_JSON['global_nb_question_response']} <br />
|
||||
|
||||
{String(selected_statistic_question_type) === "Somme" &&
|
||||
<nav>
|
||||
Nombre de réponses <b><i> 'Oui' </i></b> sur la période : {Global_Getall_Qry_Survey_Data_result_JSON['global_somme_question_response']} <br />
|
||||
|
||||
</nav>}
|
||||
|
||||
{String(selected_statistic_question_type) === "Moyenne" &&
|
||||
<nav>
|
||||
Somme totale d'enquetes sur la période : {Global_Getall_Qry_Survey_Data_result_JSON['global_somme_question_response']} <br />
|
||||
Moyenne Globale sur la période : {Global_Getall_Qry_Survey_Data_result_JSON['global_moyenne_question_response']} <br />
|
||||
</nav>}
|
||||
|
||||
</div>}
|
||||
</div>}
|
||||
|
||||
</div>
|
||||
</div>}
|
||||
|
||||
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -59,7 +59,7 @@ import { axisClasses } from '@mui/x-charts';
|
|||
import { LineChart } from '@mui/x-charts/LineChart';
|
||||
import BarChartIcon from '@mui/icons-material/BarChart';
|
||||
import SsidChartIcon from '@mui/icons-material/SsidChart';
|
||||
|
||||
import { RiFileExcel2Line } from "react-icons/ri";
|
||||
|
||||
const Employes = (props) => {
|
||||
const history = useHistory();
|
||||
|
@ -3638,6 +3638,7 @@ const Employes = (props) => {
|
|||
form.append("token", stored_cookie);
|
||||
form.append("related_collection", "ressource_humaine");
|
||||
form.append("related_collection_id", selected_id);
|
||||
form.append("class_id", "");
|
||||
|
||||
|
||||
var myurl = process.env.REACT_APP_API_URL + "myclass/api/Get_Entity_Question_List_With_Stat_For_Given_related_collection_id/";
|
||||
|
@ -5625,6 +5626,8 @@ const Employes = (props) => {
|
|||
const [p_filter_date_to, setp_filter_date_to] = useState(date_today_30j.toLocaleDateString('fr-FR'));
|
||||
|
||||
|
||||
const [Global_Getall_Qry_Survey_Data_result_JSON, setGlobal_Getall_Qry_Survey_Data_result_JSON] = useState([]);
|
||||
|
||||
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();
|
||||
|
@ -5653,7 +5656,7 @@ const Employes = (props) => {
|
|||
form.append("related_collection", "ressource_humaine");
|
||||
form.append("related_collection_id", selected_id);
|
||||
form.append("question_id", selected_statistic_question_id);
|
||||
|
||||
form.append("class_id", "");
|
||||
|
||||
|
||||
var myurl = process.env.REACT_APP_API_URL + "myclass/api/Get_Survey_Stat_Data_For_Given_related_collection_id/";
|
||||
|
@ -5663,11 +5666,12 @@ const Employes = (props) => {
|
|||
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);
|
||||
console.log(" In Getall_Qry_Survey_Data res.data.message r_class = " + res.data.message);
|
||||
|
||||
var jsonObj = JSON.parse('[' + res.data.message + ']');
|
||||
var json_data = JSON.parse(res.data.message[0]);
|
||||
|
||||
var jsonObj0 = jsonObj[0]
|
||||
//console.log(" ### json_data = ", json_data);
|
||||
var jsonObj0 = json_data.data
|
||||
|
||||
//console.log(" ### jsonObj0 = ", jsonObj0);
|
||||
|
||||
|
@ -5701,7 +5705,14 @@ const Employes = (props) => {
|
|||
setGetall_Qry_Survey_Data_result_JSON(new_data2);
|
||||
//setGetall_Qry_Survey_Data_result_JSON(JSON.parse('[' + res.data.message + ']'));
|
||||
|
||||
//console.log(" ### new_data2 = ", new_data2);
|
||||
//console.log(" ### new_data2 011 = ", new_data2);
|
||||
|
||||
|
||||
var jsonObj0_global = json_data.global
|
||||
//console.log(" ### jsonObj0_global= ", jsonObj0_global);
|
||||
setGlobal_Getall_Qry_Survey_Data_result_JSON(jsonObj0_global);
|
||||
|
||||
|
||||
|
||||
setGetall_Qry_Survey_Data_api("true");
|
||||
setGetall_Qry_Survey_Data_result(res.data.message);
|
||||
|
@ -5749,6 +5760,58 @@ const Employes = (props) => {
|
|||
|
||||
|
||||
|
||||
function Export_Statistic_to_Excel(local_dashbord_internal_id) {
|
||||
|
||||
const stored_cookie = getCookie('tokenmysypart');
|
||||
|
||||
var date_from = "";
|
||||
if (p_filter_date_from) {
|
||||
date_from = p_filter_date_from;
|
||||
date_from = date_from.replaceAll('/', "-")
|
||||
|
||||
}
|
||||
|
||||
var date_to = "";
|
||||
if (p_filter_date_to) {
|
||||
date_to = p_filter_date_to;
|
||||
date_to = date_to.replaceAll('/', "-")
|
||||
}
|
||||
|
||||
|
||||
|
||||
console.log(" #### question_id = ", selected_statistic_question_id, " ### related_collection_id = ", selected_id)
|
||||
var nom_fichier_cmd_excel = "export_excel.xlsx";
|
||||
//console.log(" nom_fichier_cmd = ", nom_fichier_cmd, " --- local_dashbord_internal_id = ", local_dashbord_internal_id);
|
||||
|
||||
var local_class_id = "-";
|
||||
var local_related_collection = "ressource_humaine";
|
||||
var url = process.env.REACT_APP_API_URL + "myclass/api/Export_Excel_Survey_Stat_Data_For_Given_related_collection_id/" + stored_cookie + "/" +local_related_collection+"/"+ selected_id + "/" + date_from + "/" + date_to + "/" + selected_statistic_question_id + "/"+local_class_id+"/";
|
||||
|
||||
//console.log(" nom_fichier_cmd = ", nom_fichier_cmd, " --- selected_id = ", selected_id, " --- url =", url);
|
||||
|
||||
console.log(" #### url = ", url)
|
||||
|
||||
setLoading(true);
|
||||
axios.get(url, { responseType: 'blob', },)
|
||||
.then((res) => {
|
||||
setLoading(false);
|
||||
//console.log(" In Export_Dashbord_to_CSV res.data = " + res.data);
|
||||
if (String(res.data) === String("false")) {
|
||||
alert("Impossible d'exporter les données (2) ");
|
||||
} else {
|
||||
fileDownload(res.data, nom_fichier_cmd_excel)
|
||||
|
||||
}
|
||||
}).catch((error) => {
|
||||
setLoading(false);
|
||||
console.error('Error:', error);
|
||||
alert(" Impossible d'exporter les données ")
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<div className="employes">
|
||||
|
||||
|
@ -10298,8 +10361,11 @@ const Employes = (props) => {
|
|||
|
||||
|
||||
<div className="div_row" >
|
||||
<div className="session_caract">
|
||||
Choisir une question
|
||||
{New_Getall_Employee_Statistic_Question_List_result && New_Getall_Employee_Statistic_Question_List_result.length > 0 &&
|
||||
<div style={{ width: '100%', }}>
|
||||
|
||||
|
||||
<Autocomplete
|
||||
disablePortal
|
||||
|
@ -10328,10 +10394,16 @@ const Employes = (props) => {
|
|||
|
||||
/>
|
||||
}
|
||||
/>}
|
||||
/>
|
||||
</div>}
|
||||
</div>
|
||||
|
||||
{selected_statistic_question_id && String(selected_statistic_question_id) !== "d" && <div>
|
||||
<div className="session_caract_Dialog">
|
||||
{selected_statistic_question_id && String(selected_statistic_question_id) !== "d" &&
|
||||
|
||||
<div style={{ width: '100%', marginRight: '1rem', 'float': 'left' }}>
|
||||
|
||||
<div style={{ width: '100%', marginRight: '1rem', 'float': 'left' }}>
|
||||
<div className="session_caract">
|
||||
Date Debut
|
||||
<DatePicker
|
||||
name="one_sessiondatedebut"
|
||||
|
@ -10352,7 +10424,10 @@ const Employes = (props) => {
|
|||
|
||||
</div>
|
||||
|
||||
<div className="session_caract_Dialog">
|
||||
</div>
|
||||
<div style={{ width: '100%', marginRight: '1rem', 'float': 'left' }}>
|
||||
|
||||
<div className="session_caract">
|
||||
Date Fin
|
||||
<DatePicker
|
||||
name="one_sessiondatefin"
|
||||
|
@ -10370,29 +10445,42 @@ const Employes = (props) => {
|
|||
|
||||
</div>
|
||||
|
||||
<br />
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</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="session_caract">
|
||||
{String(selected_statistic_question_id) !== "" && <div> <Button onClick={Getall_Qry_Survey_Data} className="bton_enreg_dialog"> Afficher</Button> </div>}
|
||||
|
||||
</div>
|
||||
|
||||
<div style={{ "height": "25rem" }}>
|
||||
{Getall_Qry_Survey_Data_result_JSON && Getall_Qry_Survey_Data_result_JSON.length > 0 &&
|
||||
Getall_Qry_Survey_Data_result_JSON && <div style={{ "height": "30rem" }}>
|
||||
|
||||
<div style={{ "textAlign": "right", "float": "right", "width": "100%" }}>
|
||||
Affichage : <nav className="mode_affichage" onClick={func_display_line_view}> <SsidChartIcon /> Ligne </nav>
|
||||
{display_view && String(display_view) === "bars" && <div style={{ "textAlign": "right", "float": "right", "width": "100%" }}>
|
||||
Affichage
|
||||
<nav className="mode_affichage" onClick={Export_Statistic_to_Excel}> <RiFileExcel2Line /> Export </nav>
|
||||
<nav className="mode_affichage" onClick={func_display_line_view}> <SsidChartIcon /> Ligne </nav>
|
||||
<nav className="mode_affichage mode_affichage_selected" onClick={func_display_bars_view}> <BarChartIcon /> Bar </nav>
|
||||
|
||||
|
||||
|
||||
</div>}
|
||||
|
||||
{display_view && String(display_view) === "line" && <div style={{ "textAlign": "right", "float": "right", "width": "100%" }}>
|
||||
Affichage
|
||||
<nav className="mode_affichage" onClick={Export_Statistic_to_Excel}> <RiFileExcel2Line /> Export </nav>
|
||||
<nav className="mode_affichage mode_affichage_selected" onClick={func_display_line_view}> <SsidChartIcon /> Ligne </nav>
|
||||
<nav className="mode_affichage" onClick={func_display_bars_view}> <BarChartIcon /> Bar </nav>
|
||||
</div>
|
||||
</div>}
|
||||
|
||||
|
||||
{display_view && String(display_view) === "bars" && <Box style={{ "color": "black", "height": "30rem" }}>
|
||||
|
||||
|
||||
<div className="session_data" style={{ paddingLeft: "2rem" }}>
|
||||
<div className="session_data" style={{ paddingLeft: "2rem", height: '30rem' }}>
|
||||
|
||||
{Getall_Qry_Survey_Data_result_JSON && Getall_Qry_Survey_Data_result_JSON.length > 0 &&
|
||||
Getall_Qry_Survey_Data_result_JSON &&
|
||||
|
@ -10408,13 +10496,13 @@ const Employes = (props) => {
|
|||
}]}
|
||||
series={[
|
||||
{ dataKey: 'nb_question_response', label: 'NB', valueFormatter },
|
||||
{ dataKey: 'value', label: `${selected_statistic_question_type}` , color: '#FA7070', valueFormatter },
|
||||
{ dataKey: 'value', label: `${selected_statistic_question_type}`, color: '#FA7070', valueFormatter },
|
||||
|
||||
|
||||
]}
|
||||
{...otherSetting}
|
||||
margin={{ right: 15, left: 100 }}
|
||||
|
||||
height={450}
|
||||
/>}
|
||||
</div>
|
||||
|
||||
|
@ -10423,9 +10511,9 @@ const Employes = (props) => {
|
|||
{display_view && String(display_view) === "line" && <Box style={{ "color": "black", "height": "30rem" }}>
|
||||
|
||||
|
||||
<div className="session_data" style={{ paddingLeft: "2rem", height: '20rem' }}>
|
||||
<div className="session_data" style={{ paddingLeft: "2rem", height: '30rem' }}>
|
||||
|
||||
|
||||
selected_statistic_question_type = {selected_statistic_question_type} <br/>
|
||||
{Getall_Qry_Survey_Data_result_JSON && Getall_Qry_Survey_Data_result_JSON.length > 0 &&
|
||||
Getall_Qry_Survey_Data_result_JSON &&
|
||||
|
||||
|
@ -10445,6 +10533,7 @@ const Employes = (props) => {
|
|||
]}
|
||||
|
||||
margin={{ right: 15, left: 100 }}
|
||||
height={450}
|
||||
/>
|
||||
|
||||
|
||||
|
@ -10452,10 +10541,29 @@ const Employes = (props) => {
|
|||
}
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</Box>}
|
||||
|
||||
<br />
|
||||
</div>
|
||||
{Global_Getall_Qry_Survey_Data_result_JSON && <div>
|
||||
|
||||
Nombre total d'enquetes sur la période : {Global_Getall_Qry_Survey_Data_result_JSON['global_nb_question_response']} <br />
|
||||
|
||||
{String(selected_statistic_question_type) === "Somme" &&
|
||||
<nav>
|
||||
Nombre de réponses <b><i> 'Oui' </i></b> sur la période : {Global_Getall_Qry_Survey_Data_result_JSON['global_somme_question_response']} <br />
|
||||
|
||||
</nav>}
|
||||
|
||||
{String(selected_statistic_question_type) === "Moyenne" &&
|
||||
<nav>
|
||||
Somme totale d'enquetes sur la période : {Global_Getall_Qry_Survey_Data_result_JSON['global_somme_question_response']} <br />
|
||||
Moyenne Globale sur la période : {Global_Getall_Qry_Survey_Data_result_JSON['global_moyenne_question_response']} <br />
|
||||
</nav>}
|
||||
|
||||
</div>}
|
||||
</div>}
|
||||
|
||||
|
||||
|
||||
|
|
|
@ -126,6 +126,7 @@
|
|||
letter-spacing: 0.1rem;
|
||||
font-weight: normal;
|
||||
width: 100%;
|
||||
height: 2rem;
|
||||
}
|
||||
|
||||
.detail_class_submenu:hover:active,
|
||||
|
@ -630,8 +631,9 @@
|
|||
width: 25%;
|
||||
float: right;
|
||||
cursor: pointer;
|
||||
|
||||
} }
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 601px) and (max-width: 991px) {
|
||||
.okUpdateData {
|
||||
|
@ -700,6 +702,7 @@
|
|||
font-size: small;
|
||||
letter-spacing: 0.1rem;
|
||||
font-weight: normal;
|
||||
height: 2rem;
|
||||
}
|
||||
|
||||
.detail_class_submenu:hover:active,
|
||||
|
@ -1237,8 +1240,9 @@
|
|||
width: 15%;
|
||||
float: right;
|
||||
cursor: pointer;
|
||||
|
||||
} }
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 992px) and (max-width: 1199px) {
|
||||
.okUpdateData {
|
||||
|
@ -1333,6 +1337,7 @@
|
|||
font-size: small;
|
||||
letter-spacing: 0.1rem;
|
||||
font-weight: normal;
|
||||
height: 2rem;
|
||||
}
|
||||
|
||||
.detail_class_submenu:hover:active,
|
||||
|
@ -1744,6 +1749,7 @@
|
|||
float: right;
|
||||
cursor: pointer;
|
||||
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -1840,6 +1846,7 @@
|
|||
font-size: small;
|
||||
letter-spacing: 0.1rem;
|
||||
font-weight: normal;
|
||||
height: 2rem;
|
||||
}
|
||||
|
||||
.detail_class_submenu:hover:active,
|
||||
|
@ -2344,7 +2351,12 @@
|
|||
width: 8%;
|
||||
float: right;
|
||||
cursor: pointer;
|
||||
} }
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// end media
|
||||
|
||||
.session_caract_Dialog_comment_2_lines {
|
||||
|
||||
|
@ -2357,7 +2369,20 @@
|
|||
}
|
||||
|
||||
|
||||
// end media
|
||||
|
||||
|
||||
.mode_affichage_selected {
|
||||
|
||||
text-underline-offset: 8px;
|
||||
text-decoration: green wavy underline;
|
||||
text-decoration-color: #F8C471;
|
||||
text-decoration-style: solid;
|
||||
text-decoration-thickness: 5px;
|
||||
background: #F4F6F6;
|
||||
box-shadow: 1px 1px 5px 1px rgba(0, 0, 0, 0.1);
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
|
||||
.MuiDataGrid-cellContent {
|
||||
padding-top: 0.5rem !important;
|
||||
|
|
Loading…
Reference in New Issue