From 29da61b65a1887b294be41816256de62b960b70b Mon Sep 17 00:00:00 2001 From: Cherif Date: Fri, 13 Jun 2025 20:39:51 +0200 Subject: [PATCH] qsd --- src/components/DisplayPartnerPromotion.js | 26911 ++++++++++++++++++++ src/components/DisplayPartnerSession.js | 129 + src/components/Employes.js | 32 +- src/components/Partner.js | 94 +- 4 files changed, 27146 insertions(+), 20 deletions(-) create mode 100644 src/components/DisplayPartnerPromotion.js diff --git a/src/components/DisplayPartnerPromotion.js b/src/components/DisplayPartnerPromotion.js new file mode 100644 index 0000000..91d0a0a --- /dev/null +++ b/src/components/DisplayPartnerPromotion.js @@ -0,0 +1,26911 @@ +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 { Editor } from '@tinymce/tinymce-react'; +import { FcViewDetails, FcDisapprove, FcInfo, FcExpired, FcTimeline } from "react-icons/fc"; +import 'react-tooltip/dist/react-tooltip.css' +import { Tooltip } from 'react-tooltip' +import TextareaAutosize from '@mui/material/TextareaAutosize'; +import excel_icone from "../mysy_img/excel_icone.png"; +import participants from "../mysy_img/participants.png"; +import fileDownload from 'js-file-download' +import Popup from 'reactjs-popup'; +import 'reactjs-popup/dist/index.css'; +import { FcSearch } from "react-icons/fc"; +import { FcAlarmClock, FcMultipleSmartphones, FcWorkflow, FcComments } from "react-icons/fc"; +import DatePicker from "react-datepicker"; +import "react-datepicker/dist/react-datepicker.css"; +import { format } from 'date-fns' +import moment from "moment"; +import 'moment/locale/fr'; +import { useCookies } from "react-cookie"; +import InputAdornment from '@mui/material/InputAdornment'; +import { AiFillCloseCircle } from "react-icons/ai"; +import Box from '@mui/material/Box'; +import { Typography, LinearProgress } from '@mui/material'; +import styled from 'styled-components'; +import { CiTrash } from "react-icons/ci"; +import { MdAddCircleOutline, MdRemoveCircleOutline } from "react-icons/md"; +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 { Fab } from "@material-ui/core"; +import { IoMdAddCircle, IoIosRemoveCircleOutline } from "react-icons/io"; +import { AiTwotoneSave } from "react-icons/ai"; +import ToggleSwitch from "./ToggleSwitch"; +import Module_Historique_Action from "./Module_Historique_Action"; +import Module_Session_Notes_Classement from "./Module_Session_Notes_Classement"; + +import Autocomplete from '@mui/material/Autocomplete'; +import { FcOpenedFolder } from "react-icons/fc"; +import { gridClasses } from '@mui/x-data-grid'; +import Link from '@mui/material/Link'; +import { PiDotsThree } from "react-icons/pi"; +import Module_Editique from "./Module_Editique"; +import Module_Attestation_Formation from "./Module_Attestation_Formation"; +import Module_Evaluation_Positionnement from "./Module_Evaluation_Positionnement"; +import { IoAddCircleOutline } from "react-icons/io5"; +import { FcApproval, FcAcceptDatabase, FcPrint, FcPlanner } from "react-icons/fc"; +import { CiBoxList } from "react-icons/ci"; +import FullCalendar from "@fullcalendar/react"; +import daygridPlugin from "@fullcalendar/daygrid"; +import interactionPlugin from "@fullcalendar/interaction"; +import timeGridPlugin from "@fullcalendar/timegrid"; + +import Radio from '@mui/material/Radio'; +import RadioGroup from '@mui/material/RadioGroup'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import FormControl from '@mui/material/FormControl'; +import FormLabel from '@mui/material/FormLabel'; +import { FaUserPen } from "react-icons/fa6"; +import allLocales from '@fullcalendar/core/locales-all'; + +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'; + +import { + GridToolbarContainer, GridToolbarExport, GridToolbarColumnsButton, + GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext, + gridFilteredSortedRowIdsSelector, + gridVisibleColumnFieldsSelector, + +} from '@mui/x-data-grid'; +import * as XLSX from 'xlsx'; + +import { makeStyles } from "@material-ui/core/styles"; +import Paper from '@material-ui/core/Paper'; +import Draggable from 'react-draggable'; +import { IconButton } from '@material-ui/core'; +import CancelPresentationIcon from '@mui/icons-material/CancelPresentation'; + +import { DataGridPro } from '@mui/x-data-grid-pro'; + +import { useCallback, } from "react"; +import { DndProvider, useDrag } from "react-dnd"; +import { useDrop } from 'react-dnd' + +import { HTML5Backend } from "react-dnd-html5-backend"; +import update from "immutability-helper"; +import Module_Alert_Confirmation from "./Module_Alert_Confirmation"; +import MoreVertIcon from '@mui/icons-material/MoreVert'; +import Menu from '@mui/material/Menu'; +import 'moment/locale/fr'; +import Timeline, { + TimelineHeaders, + SidebarHeader, + DateHeader, + TimelineMarkers, + CustomMarker, + TodayMarker, + CursorMarker +} from 'react-calendar-timeline'; + +import ArrowForwardIosIcon from '@mui/icons-material/ArrowForwardIos'; +import ArrowBackIosNewIcon from '@mui/icons-material/ArrowBackIosNew'; + + +import randomColor from "randomcolor"; + +function PaperComponent(props) { + return ( + + + + ); +} + + +const useStyles = makeStyles((theme) => ({ + + dialog: { + position: 'absolute', + // left: 10, + top: 400 + }, + + paper: { + overflowY: 'unset', + }, + customizedButton: { + position: 'absolute', + left: '98%', + top: '-3%', + backgroundColor: 'lightgray', + color: 'gray', + }, +})); + + +const DisplayPartnerPromotion = (props) => { + + const stored_cookie_session_display_view = getCookie('mysy_session_display_view'); + const stored_cookie_session_data_row_grouped_by = getCookie('mysy_session_data_row_grouped_by'); + + const classes = useStyles(); + + 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(); + const [one_SessionendDate, setone_SessionendDate] = useState(); + const [one_SessionstartDate, setone_SessionstartDate] = useState(); + const [one_urlpreview_certif, setone_urlpreview_certif] = useState(); + const [one_field_contenu_ftion, setone_field_contenu_ftion] = useState(""); + + const filters = [ + { value: 'code_session', label: 'Code Promotion' }, + { value: 'class_title', label: 'Titre Formation' }, + { value: 'certif', label: 'Certification' } + ] + + const [selectedfilt1, setselectedfilt1] = useState(""); + const [selectedfilt2, setselectedfilt2] = useState(""); + const [selectedfilt3, setselectedfilt3] = useState(""); + const [reftrainingtoupdate, setreftrainingtoupdate] = useState(); + const [externalcodetraining_toupdate, setexternalcodetraining_toupdate] = useState(); + + + const [is_recherche, setis_recherche] = useState("0"); + + + const [selectedtraining, setselectedtraining] = useState([]) + + const BorderLinearProgress = styled(LinearProgress)(() => ({ + height: "20px", + width: "60px", + borderRadius: "2px", + backgroundColor: " #ebf5fb", + "& .MuiLinearProgress-bar": { + backgroundColor: "#1bd900", + transition: "none", + transformOrigin: "left", + }, + })); + + function ExpandableCell_50({ value }) { + const [expanded, setExpanded] = React.useState(false); + + return ( + + ); + } + + + + function Display_Colunm_text({ value }) { + + return ( +
+ {value}  + +
+ ); + } + + + const [datagrid_columns_size_model1, setdatagrid_columns_size_model1] = useState(200); + const [datagrid_columns_size_model2, setdatagrid_columns_size_model2] = useState(100); + + + const ITEM_HEIGHT_PROMO = 48; + const ITEM_HEIGHT = 48; + + + const [anchorEl_promo, setanchorEl_promo] = React.useState(null); + const [anchorEl, setAnchorEl] = React.useState(null); + + const open_promo = Boolean(anchorEl_promo); + const open = Boolean(anchorEl); + + const options_menu_vertical_promotion = [ + 'Archiver/Désarch.', + 'Supprimer', + ]; + + const options_menu_vertical = [ + 'Renvoyer Conf.', + 'Annuler Insc.', + ]; + + + + const handleClick_option_button_vertical_promo = (event) => { + setanchorEl_promo(event.currentTarget); + }; + const handleClick_option_button_vertical = (event) => { + setAnchorEl(event.currentTarget); + }; + + + const handleClose_option_button_vertical_promo = (event, value) => { + setanchorEl_promo(null); + }; + const handleClose_option_button_vertical = (event, value) => { + setAnchorEl(null); + }; + + + + const columns = [ + { field: 'id', headerName: 'id', hide: true, disableExport: true, }, + { field: '_id', headerName: '_id', hide: true, disableExport: true, }, + { field: 'class_id', headerName: 'class_id', hide: true, disableExport: true, }, + { field: 'class_lms_class_code', headerName: 'class_lms_class_code', hide: true, disableExport: true, }, + { field: 'is_bpf', headerName: 'is_bpf', hide: true, }, + + { field: 'session_alert_message', headerName: 'session_alert_message', hide: true }, + { field: 'class_internal_url', headerName: 'class_internal_url', hide: true }, + + { + field: 'is_session_alert', headerName: '', hide: false, Width: 50, flex: 1, + renderCell: (cellValues) => { + return ( +
+ {cellValues.row.is_session_alert && String(cellValues.row.is_session_alert) === "1" && } + {cellValues.row.is_session_alert && String(cellValues.row.is_session_alert) !== "1" && ""} + +
+ + ); + } + + }, + + { field: 'code_session', headerName: 'Code Promo', hide: false, minWidth: 200, flex: 1, renderCell: (params) => , }, + { field: 'session_title', headerName: 'Titre', hide: false, flex: 1, minWidth: 250, renderCell: (params) => , }, + + { + field: 'statut', headerName: 'Statut', hide: true, width: datagrid_columns_size_model2, + renderCell: (cellValues) => { + return ( + +
+ {String(cellValues.row.distantiel) === "1" && "Actif"}  + {String(cellValues.row.distantiel) !== "1" && "Inactif"}  + +
+ + ); + }, + + }, + + { + field: 'etape', headerName: 'Etape', hide: false, width: datagrid_columns_size_model2, renderCell: (params) => , + + }, + + { + field: 'archive', headerName: 'Archivé', hide: true, Width: 50, editable: false, renderCell: (cellValues) => { + return ( +
+ {String(cellValues.row.archive) === "1" && "Oui"}  + {String(cellValues.row.archive) !== "1" && "Non"}  + +
+ + ); + }, + }, + + + + { field: 'class_external_code', headerName: 'Code Formation', align: "center", hideable: true, flex: 1, hide: true, minWidth: 150, renderCell: (params) => , }, + { field: 'date_debut', headerName: 'Debut', hide: false, minWidth: 150, renderCell: (params) => , }, + { field: 'date_fin', headerName: 'Fin', minWidth: 150, renderCell: (params) => , }, + + { + field: 'mode_animation', headerName: 'Mode', width: datagrid_columns_size_model2, + renderCell: (cellValues) => { + return ( + +
+ {String(cellValues.row.mode_animation) === "0" && "Prés."}  + {String(cellValues.row.mode_animation) === "1" && "Dist."}  + {String(cellValues.row.mode_animation) === "2" && "Hybr."}  + +
+ + ); + }, + }, + + + { field: 'formateur', headerName: 'Formateur', minWidth: datagrid_columns_size_model1, hide: true, hideable: true, renderCell: (params) => , }, + { field: 'nb_participant', headerName: 'Nb Parti.', minWidth: datagrid_columns_size_model2, align: "center", hide: false, renderCell: (params) => , }, + { + field: 'taux_remplissage', headerName: 'Remplissage', align: "center", flex: 1, minWidth: 100, maxWidth: 150, flex: 1, + align: "left", + renderCell: (params) => { + return ( + <> + + {`${(params?.row.taux_remplissage * 100).toFixed(0)}%`} + + ); + }, + }, + { field: 'nb_inscrit', headerName: 'Insc', minWidth: 20, align: "center", hide: true, hideable: true, renderCell: (params) => , }, + { field: 'nb_preinscrit', headerName: 'Preinsc.', minWidth: 20, align: "center", hide: false, hideable: true, renderCell: (params) => , }, + { + field: 'prix_session', headerName: 'Prix', minWidth: 20, align: "center", + renderCell: (params) => , + }, + { field: 'title', headerName: 'Formation', minWidth: 250, flex: 1, align: "center", hide: true, hideable: true, renderCell: (params) => , }, + { field: 'domaine', headerName: 'Domaine', minWidth: datagrid_columns_size_model1, align: "center", hide: true, renderCell: (params) => , }, + { field: 'published', headerName: 'publié', minWidth: datagrid_columns_size_model1, align: "center", hide: true, renderCell: (params) => , }, + + { field: 'site_formation_id', headerName: 'site_formation_id', with: 0, align: "center", hide: true, disableExport: true, }, + + + { field: 'qty_in_quotation', headerName: 'Place Non validé ', with: 150, align: "center", hide: false, renderCell: (params) => , }, + { field: 'qty_in_quotation_list_quotation', headerName: 'List Devis ', with: 150, align: "center", hide: false, renderCell: (params) => , }, + + { field: 'site_formation_nom', headerName: 'Site Ftion', with: 150, align: "center", hide: true, renderCell: (params) => , }, + + { + field: 'invoiced_statut', headerName: 'Facturé', minWidth: 100, flex: 1, maxWidth: 150, hide: false, editable: false, + renderCell: (cellValues) => { + return ( +
+ {String(cellValues.row.invoiced_statut) === "2" && "Oui"} + {String(cellValues.row.invoiced_statut) === "1" && "Part."} + {String(cellValues.row.invoiced_statut) !== "1" && String(cellValues.row.invoiced_statut) !== "2" && "Non"} +
+ ); + }, + }, + + { field: 'duration', headerName: 'Durée', minWidth: datagrid_columns_size_model2, align: "center", hide: true, renderCell: (params) => , }, + /* { + field: "Detail", headerName: 'Voir détail', disableExport: true, + renderCell: (cellValues) => { + return ( + + ); + } + },*/ + + /* { + field: "delete", headerName: 'Supprimer', disableExport: true, + renderCell: (cellValues) => { + return ( + + { + //handleClick_delete_Session_Formation(event, cellValues); + }} + > + + + } + modal + nested + position="center center" + > + {close => ( +
+ +
MySy Information
+
+ {' '} + + En confirmant cette opération, la promotion de formation sera définitivement supprimée.
+ +
+
+
+ + +
+
+ +
+
+
+ )} +
+ + + ); + } + },*/ + { + field: 'bton_vertif', headerName: 'Gestion', minWidth: 50, flex: 1, maxWidth: 100, hideable: true, hide: false, editable: false, align: "center", + renderCell: (cellValues) => { + return ( +
+ + +
+ ); + }, + }, + + + ] + + const [promo_archive_status, setpromo_archive_status] = React.useState(''); + + const [working_cellValues_promo, setworking_cellValues_promo] = useState(false); + const [dialogOpen_supp_promo, setdialogOpen_supp_promo] = useState(false); + const Dialog_menuitem_close_supp_prmo = () => { + setdialogOpen_supp_promo(false) + }; + + + const [dialogOpen_archive, setdialogOpen_archive] = useState(false); + const Dialog_menuitem_close_archive = () => { + setdialogOpen_archive(false) + }; + + const options_menu_vertical_preinsc = [ + '', + 'Mise à jour', + 'Valider Insc.', + 'Refuser Insc.', + 'Supprimer', + + ]; + const [working_cellValues_preisnc, setworking_cellValues_preisnc] = useState(false); + const [anchorEl_preinsc, setAnchorEl_preinsc] = React.useState(null); + const open_preinsc = Boolean(anchorEl_preinsc); + const handleClick_option_button_vertical_preinsc = (event) => { + setAnchorEl_preinsc(event.currentTarget); + }; + const handleClose_option_button_vertical_preinsc = (event, value) => { + setAnchorEl_preinsc(null); + }; + + + const [dialogOpen_refus_inscription, setdialogOpen_refus_inscription] = useState(false); + const Dialog_menuitem_close_refus_inscription = () => { + setdialogOpen_refus_inscription(false) + }; + + + const [dialogOpen_suppr_preinscription, setdialogOpen_suppr_preinscription] = useState(false); + const Dialog_menuitem_suppr_preinscription = () => { + setdialogOpen_suppr_preinscription(false) + }; + + const columns_preinscrit = [ + { field: 'id', headerName: 'id', hide: true }, + { field: '_id', headerName: '_id', hide: true }, + + { + field: 'civilite', headerName: 'Civ.', minWidth: 90, flex: 1, maxWidth: 100, hide: false, editable: false, editable: false, + + renderCell: (cellValues) => { + return ( + +
+ {New_civilite && New_civilite.length > 0 && cellValues.row.civilite && + + } + +
+ + ); + }, + }, + + { field: 'nom', headerName: 'nom', minWidth: 200, flex: 1, hide: false, editable: true, renderCell: (params) => , }, + { field: 'prenom', headerName: 'prenom', minWidth: 200, flex: 1, hide: false, editable: true, renderCell: (params) => , }, + { field: 'email', headerName: 'email', minWidth: 200, flex: 1, flex: 1, renderCell: (params) => , }, + { field: 'client_rattachement_nom', headerName: 'Client', minWidth: 150, flex: 1, hide: false, editable: true, renderCell: (params) => , }, + { field: 'client_rattachement_id', headerName: 'Client_id', Width: 0, hide: true, editable: true, }, + + { + field: 'client_facture', headerName: 'Client Fact.', minWidth: 200, flex: 1, hide: false, editable: false, + + renderCell: (cellValues) => { + return ( +
+ {New_Get_List_Partner_Clients_result && New_Get_List_Partner_Clients_result.length > 0 && } +
+ + ); + } + }, + + { field: 'employeur', headerName: 'Employeur', minWidth: 150, flex: 1, maxWidth: 200, hide: true, editable: true, renderCell: (params) => , }, + { field: 'opco', headerName: 'Centre Opco', minWidth: 100, flex: 1, maxWidth: 150, hide: true, editable: true }, + { + field: 'modefinancement', headerName: 'Financement', minWidth: 100, flex: 1, maxWidth: 150, hide: true, editable: true, + renderCell: (cellValues) => { + return ( + +
+ {New_Financement && New_Financement.length > 0 && cellValues.row.modefinancement && + + } + +
+ + ); + }, + }, + { field: 'amount', headerName: 'Montant Formation', minWidth: 100, flex: 1, maxWidth: 150, type: 'number', flex: 1, editable: true, renderCell: (params) => , }, + { + field: "update", headerName: 'Mise à jour', + renderCell: (cellValues) => { + return ( + + { + handleClick_accept(event, cellValues); + }} + > + + + } + modal + nested + position="center center" + > + {close => ( +
+ +
MySy Information
+
+ {' '} + + Confirmer la mise à jour des informations du stagiaire +
+
+
+ + +
+
+ +
+
+
+ )} +
+ + ); + } + }, + + + { + field: 'bton_vertif', headerName: 'Gestion', minWidth: 50, flex: 1, maxWidth: 100, hideable: true, hide: false, editable: false, align: "center", + renderCell: (cellValues) => { + return ( +
+ +