import React, { useRef, useState, useEffect } from "react";
import TextField from '@mui/material/TextField';
import MenuItem from '@mui/material/MenuItem';
import 'react-confirm-alert/src/react-confirm-alert.css'; // Import css
import Button from '@mui/material/Button';
import axios from "axios";
import { getCookie, setCookie } from 'react-use-cookie';
import { useHistory } from "react-router-dom";
import { DataGrid, GridToolbar, frFR } from '@mui/x-data-grid';
import "react-draft-wysiwyg/dist/react-draft-wysiwyg.css";
import 'react-tooltip/dist/react-tooltip.css'
import 'reactjs-popup/dist/index.css';
import { FcCancel, FcApproval, FcPlanner } from "react-icons/fc";
import DatePicker from "react-datepicker";
import "react-datepicker/dist/react-datepicker.css";
import moment from "moment";
import Box from '@mui/material/Box';
import { CiBoxList } from "react-icons/ci";
import Dialog from '@mui/material/Dialog';
import DialogActions from '@mui/material/DialogActions';
import DialogContent from '@mui/material/DialogContent';
import DialogContentText from '@mui/material/DialogContentText';
import DialogTitle from '@mui/material/DialogTitle';
import img_loading_spin from "./../mysy_img/mysy_spin_loading.gif";
import FullCalendar from "@fullcalendar/react";
import daygridPlugin from "@fullcalendar/daygrid";
import interactionPlugin from "@fullcalendar/interaction";
import timeGridPlugin from "@fullcalendar/timegrid";
import allLocales from '@fullcalendar/core/locales-all'
import ToggleSwitch from "./ToggleSwitch";
import { IoAddCircleOutline, IoCloseCircleOutline } from "react-icons/io5";
const Module_Absence = (props) => {
const myconntected_employee_id = props.conntected_employee_id;
const attendee_email = props.attendee_email;
const [selected_employee_id, setselected_employee_id] = useState(props.conntected_employee_id);
const [selected_attendee_email, setselected_attendee_email] = useState(props.attendee_email);
const [selected_related_collection, setselected_related_collection] = useState(props.related_collection);
const history = useHistory();
const [isLoading, setLoading] = useState();
const columns = [
{ field: '_id', headerName: '_id', hide: true },
{ field: 'id', headerName: 'id', hide: true },
{ field: 'event_type', headerName: 'Type', flex: 1, hide: false, editable: false },
{ field: 'event_title', headerName: 'Titre', flex: 1, hide: false, editable: false, },
{
field: 'event_start', headerName: 'Debut', flex: 1, hide: false, editable: false,
valueFormatter: (params) => {
return moment(params.value).format('D/MM/YYYY - H:mm');
},
},
{
field: 'event_end', headerName: 'Fin', flex: 1, hide: false, editable: false,
valueFormatter: (params) => {
return moment(params.value).format('D/MM/YYYY - H:mm');
},
},
{
field: 'justified', headerName: 'Justifié', flex: 1, hide: false, editable: false,
renderCell: (params) => {
if (String(params.value) === "true")
return
{eventInfo.event.title}
>
)
};
const handleEventClick = (arg) => {
if (String(selected_attendee_email).length < 2) {
alert(" Vous devez choisir un stagiaire");
return;
}
setp_detail_title(arg.event.title)
setp_detail_start(arg.event.start)
setp_detail_end(arg.event.end)
setp_detail_event_id(arg.event.id);
if (arg.event.extendedProps.comment) {
setp_detail_comment(arg.event.extendedProps.comment);
}
else
setp_detail_comment("");
if (arg.event.extendedProps.justified) {
if (String(arg.event.extendedProps.justified) === "true")
setp_detail_justified(true);
else
setp_detail_justified(false);
}
else
setp_detail_justified(false);
if (arg.event.extendedProps.type) {
setp_detail_event_type(arg.event.extendedProps.type);
}
else
setp_detail_event_type("");
setStartDate(arg.event.start);
setendDate(arg.event.end);
setDialog_1_open(true);
}
const handleEventClick_from_list = (selected_row_id) => {
var line = JSON.parse(mysy_list_event_for_map[selected_row_id]);
if (String(selected_attendee_email).length < 2) {
alert(" Vous devez choisir un stagiaire");
return;
}
setp_detail_title(line.event_title)
setp_detail_start(line.event_start)
setp_detail_end(line.event_end)
setp_detail_event_id(line._id);
if (line.comment) {
setp_detail_comment(line.comment);
}
else
setp_detail_comment("");
if (line.justified) {
if (String(line) === "true")
setp_detail_justified(true);
else
setp_detail_justified(false);
}
else
setp_detail_justified(false);
if (line.type) {
setp_detail_event_type(line.type);
}
else
setp_detail_event_type("");
console.log(" (line.event_start =", line.event_start);
var new_start_date = new Date(moment(line.event_start, "YYYY/MM/DD HH:mm"));
var new_end_date = new Date(moment(line.event_end, "YYYY/MM/DD HH:mm"));
setStartDate(new_start_date);
setendDate(new_end_date);
setDialog_1_open(true);
}
function Close_Dialog_Detail_Event_open() {
setp_detail_title("Nouvelle")
setp_detail_start()
setp_detail_end()
setp_detail_comment("");
setp_detail_event_id("");
setp_detail_justified(false);
setp_detail_event_type("");
setDialog_1_open(false);
}
const [Partner_Debut_Journee, setPartner_Debut_Journee] = useState("7:00");
const [Partner_Fin_Journee, setPartner_Fin_Journee] = useState("20:00");
const [Get_Partner_Debut_Fin_Journee_api, setGet_Partner_Debut_Fin_Journee_api] = useState();
const [Get_Partner_Debut_Fin_Journee_message, setGet_Partner_Debut_Fin_Journee_message] = useState();
const [Get_Partner_Debut_Fin_Journee_result, setGet_Partner_Debut_Fin_Journee_result] = useState();
function Get_Partner_Debut_Fin_Journee(event) {
var form = new FormData();
const stored_cookie = getCookie('tokenmysypart');
form.append("token", stored_cookie);
var myurl = process.env.REACT_APP_API_URL + "myclass/api/Get_Default_Debut_Fin_journee_Modele_Journee/";
setLoading(true);
axios.post(myurl, form).then(res => {
//console.log(" In Get_Partner_Debut_Fin_Journee res.data.status = " + res.data.status);
//console.log(" In Get_Partner_Debut_Fin_Journee res.data.message r_class = " + res.data.message);
setLoading(false);
if (String(res.data.status) === String("true")) {
setGet_Partner_Debut_Fin_Journee_api("true");
setGet_Partner_Debut_Fin_Journee_result(res.data.message);
var val_json = JSON.parse(res.data.message);
if (JSON.parse(res.data.message).planning_debut_journee)
setPartner_Debut_Journee(String(JSON.parse(res.data.message).planning_debut_journee))
if (JSON.parse(res.data.message).planning_fin_journee)
setPartner_Fin_Journee(String(JSON.parse(res.data.message).planning_fin_journee))
}
else if (String(res.data.status) === String("Err_Connexion")) {
alert('Erreur: ' + res.data.message);
history.push("/Connexion");
}
else {
setGet_Partner_Debut_Fin_Journee_api("false");
setGet_Partner_Debut_Fin_Journee_message(res.data.message);
}
}).catch((error) => {
setLoading(false);
console.warn('Not good man :( Get_Partner_Debut_Fin_Journee = ', error);
setGet_Partner_Debut_Fin_Journee_api("false");
//setmyApimyApiMessage("")
})
}
useEffect(() => {
Get_Connected_User_List_Agenda_Events();
Get_Partner_Debut_Fin_Journee();
//Getall_Training_Employee_No_Filter();
//Getall_Training_Materiel_No_Filter();
}, [attendee_email])
const [p_detail_event_id, setp_detail_event_id] = useState();
const [p_detail_title, setp_detail_title] = useState();
const [p_detail_start, setp_detail_start] = useState();
const [p_detail_end, setp_detail_end] = useState();
const [p_detail_comment, setp_detail_comment] = useState();
const [p_detail_justified, setp_detail_justified] = useState(false);
const [p_detail_event_type, setp_detail_event_type] = useState();
const [startDate, setStartDate] = useState(new Date());
const [endDate, setendDate] = useState(new Date());
const [Update_One_Agenda_Event_api, setUpdate_One_Agenda_Event_api] = useState();
const [Update_One_Agenda_Event_message, setUpdate_One_Agenda_Event_message] = useState();
const [Update_One_Agenda_Event_result, setUpdate_One_Agenda_Event_result] = useState();
const Update_One_Agenda_Event = event => {
var local_related_collection = p_filtre1;
if (String(selected_attendee_email).length < 2) {
alert(" Vous devez un stagiaire");
return;
}
if (moment(endDate) <= moment(startDate)) {
alert(" Les dates de début et de fin sont incohérentes");
return;
}
var new_title = p_detail_title;
var new_start_date = moment(startDate).format();
var new_end_date = moment(endDate).format();
var event_id = p_detail_event_id
//console.log(" ### new event = ", new_title, " -- ", new_start_date, " --- ", new_end_date, " : setp_detail_event_id = ", p_detail_event_id);
var form = new FormData();
//form.append("token","K3cw63eKokKSbV4spjQ48SUNnfy80yrXfA");
const stored_cookie = getCookie('tokenmysypart');
form.append("token", stored_cookie);
form.append("_id", p_detail_event_id);
form.append("inscription_id", props.inscription_id);
form.append("related_collection", props.related_collection);
form.append("event_title", new_title);
form.append("event_start", new_start_date);
form.append("event_end", new_end_date);
form.append("related_collection_email", selected_attendee_email);
form.append("comment", p_detail_comment);
form.append("event_type", p_detail_event_type);
form.append("justified", p_detail_justified);
//console.log(" form == ", form);
var myurl = process.env.REACT_APP_API_URL + "myclass/api/Add_Update_Agenda_Event_Stagiaire/";
setLoading(true);
axios.post(myurl, form).then(res => {
//console.log(" In Update_One_Agenda_Event res.data.status = " + res.data.status);
//console.log(" In Update_One_Agenda_Event res.data.message r_class = " + res.data.message);
setLoading(false);
if (String(res.data.status) === String("true")) {
setUpdate_One_Agenda_Event_api("true");
setUpdate_One_Agenda_Event_result(res.data.message);
Get_List_Agenda_Events_For_Given_User(selected_attendee_email);
setp_detail_event_id();
setp_detail_title();
setp_detail_start();
setp_detail_end();
setp_detail_comment();
setp_detail_justified(false);
setp_detail_event_type();
alert(res.data.message);
Close_Dialog_Detail_Event_open();
}
else {
setUpdate_One_Agenda_Event_api("false");
setUpdate_One_Agenda_Event_message(res.data.message);
alert(res.data.message);
}
}).catch((error) => {
setLoading(false);
console.warn('UpdateStagiaireData : Not good man :( Update_One_Agenda_Event = ' + error);
setUpdate_One_Agenda_Event_api("false");
alert(" Impossible de mettre à jour l'événement ");
})
}
const [Delete_One_Agenda_Event_api, setDelete_One_Agenda_Event_api] = useState();
const [Delete_One_Agenda_Event_message, setDelete_One_Agenda_Event_message] = useState();
const [Delete_One_Agenda_Event_result, setDelete_One_Agenda_Event_result] = useState();
function Delete_One_Agenda_Event() {
var event_id = p_detail_event_id
var form = new FormData();
//form.append("token","K3cw63eKokKSbV4spjQ48SUNnfy80yrXfA");
const stored_cookie = getCookie('tokenmysypart');
form.append("token", stored_cookie);
form.append("_id", p_detail_event_id);
var myurl = process.env.REACT_APP_API_URL + "myclass/api/Delete_Agenda_Event/";
setLoading(true);
axios.post(myurl, form).then(res => {
//console.log(" In Delete_One_Agenda_Event res.data.status = " + res.data.status);
//console.log(" In Delete_One_Agenda_Event res.data.message r_class = " + res.data.message);
setLoading(false);
if (String(res.data.status) === String("true")) {
setDelete_One_Agenda_Event_api("true");
setDelete_One_Agenda_Event_result(res.data.message);
Get_List_Agenda_Events();
setp_detail_event_id();
setp_detail_title();
setp_detail_start();
setp_detail_end();
setp_detail_comment();
setp_detail_justified(false);
setp_detail_event_type();
alert(res.data.message);
Close_Dialog_Detail_Event_open();
}
else {
setDelete_One_Agenda_Event_api("false");
setDelete_One_Agenda_Event_message(res.data.message);
alert(res.data.message);
}
}).catch((error) => {
setLoading(false);
console.warn('UpdateStagiaireData : Not good man :( Delete_One_Agenda_Event = ' + error);
setDelete_One_Agenda_Event_api("false");
alert(" Impossible de supprimer l'événement ");
})
}
const [display_other_agenda, setdisplay_other_agenda] = useState();
const [agenda_owner_name, setagenda_owner_name] = useState("Mon Planning");
const [agenda_owner_type, setagenda_owner_type] = useState("Employe");
const [display_view, setdisplay_view] = useState("planning");
function func_display_planning_view() {
setdisplay_view("planning");
}
function func_display_list_view() {
setdisplay_view("list");
}
return (