import React, { useState, useEffect } from "react"; import ReactPlayer from 'react-player' import { FacebookShareButton, LinkedinShareButton, TwitterShareButton } from "react-share"; import { SocialIcon } from 'react-social-icons'; import { Button, } from "reactstrap"; import { useHistory } from "react-router-dom"; import { Helmet } from "react-helmet"; import { useCookies } from "react-cookie"; import { confirmAlert } from 'react-confirm-alert'; import topimg from "../mysy_img/top.png"; import coeurimg from "../mysy_img/coeur.png"; import img_met_program from "../mysy_img/met_programmation.jpg"; import img_met_hotel from "../mysy_img/met_hotel.jpg"; import img_met_graphisme from "../mysy_img/metier_graphisme.jpg"; import img_met_autre from "../mysy_img/met_autre.jpg"; import img_met_digital from "../mysy_img/met_digital.jpg"; import img_met_management from "../mysy_img/met_management.jpg"; import img_met_projet from "../mysy_img/met_projet.jpg"; import img_met_market from "../mysy_img/met_market.jpg"; import img_met_autre2 from "../mysy_img/met_autre2.jpg"; import img_met_dev_perso from "../mysy_img/metier_dev_perso.jpg"; import img_met_rh from "../mysy_img/met_rh.jpg"; import img_met_bureautic from "../mysy_img/met_burautic.jpg"; import img_met_vente from "../mysy_img/met_vente.jpg"; import axios from "axios"; //import { Rating } from 'react-simple-star-rating' import Rating from '@mui/material/Rating'; import parse from 'html-react-parser' const Formation = (props) => { const [userconnected, setuserconnected] = useState("0"); const [partnerconnected, setpartnerconnected] = useState("0"); const [cookie, setCookie, removeCookie] = useCookies(['tokenmysych']); const [cookie_part, setCookie_part, removeCookie_part] = useCookies(['tokenmysypart']); const history = useHistory(); const [myfilter, setmyfilter] = useState(props.formation.price); const [profileimg, setprofileimg] = useState(props.formation.price); // Gestion des Cookies const stored_partner = cookie_part.tokenmysypart; const stored_user = cookie.tokenmysych; function test(val) { if (userconnected === "0" && partnerconnected === "0") { confirmAlert({ title: 'Activer votre session ?', message: 'Merci de vous connecter pour acceder au detail de cette formation', buttons: [ { label: 'Yes', onClick: () => { history.push("/mysy-training-login/training/" + props.formation.internal_url) } }, { label: 'No', onClick: () => { return } } ], closeOnEscape: false, closeOnClickOutside: false, keyCodeForClose: [8, 32], willUnmount: () => { }, afterClose: () => { }, onClickOutside: () => { }, onKeypress: () => { }, onKeypressEscape: () => { }, }); } else { window.open( "/Display-Detail-formation/" + props.formation.internal_url, '_blank' ); } } const [myclassimage, setmyclassimage] = useState(); const [isclassimage, setisclassimage] = useState("False"); const [userimgclassprofil, setuserimgclassprofil] = useState(); function getClassImage(e) { var myurl = process.env.REACT_APP_API_URL + "myclass/api/getRecodedClassImage_from_front/"; var class_external_code = props.formation.external_code; if (class_external_code.length < 3) { //console.log("Le code externe prend au moins 3 caractères"); return; } //console.log(" class_external_code = " + class_external_code); var form = new FormData(); form.append("class_external_code", class_external_code); axios.post(myurl, form).then(res => { if (res.data.status != "False") { //console.log(" getClassImage : In test res.data.status = " + res.data.status); //console.log(" getClassImage: res.data.message.img = " + res.data.message); if (res.data.message.img.length > 0) { setisclassimage("True"); //console.log(" getClassImage : In test res.data.status = " + res.data.status); //console.log(" getClassImage: res.data.message.img = " + res.data.message); var ch_img = "data:image/png;base64," + res.data.message.img; setuserimgclassprofil(ch_img); //console.log("ch_img = "+ch_img); } else { setisclassimage("False"); } } else { //console.log(" In Erreur res.data.status = " + res.data.status); //console.log(" In Erreur res.data.message = " + res.data.message); setisclassimage("False"); setuserimgclassprofil(); //alert("4"); } }).catch((error) => { console.warn('getClassImage : Not good man :( getClassImage = '); setisclassimage("False"); setuserimgclassprofil(profileimg); }) } /* Cette variable accompagne la gestion des images par defaut. idée : si la valeur de "DetailTraining.metier" != "management, digital, office, rh, vente, dev_perso" alors l'utilisateur à créer une formation avec un metier qui n'est pas geré, donc on met une image par defaut */ const [ismetiermanaged, setismetiermanaged] = useState(); const liste_metier = ["management", "digital", "office", "rh", "vente", "dev_perso"]; useEffect(() => { setmyfilter(props.myfil); if (typeof (stored_user) === "undefined" || String(stored_user) === '') { setuserconnected("0"); } else { setuserconnected("1"); } if (typeof (stored_partner) === "undefined" || String(stored_partner) === '') { setpartnerconnected("0"); } else { setpartnerconnected("1"); } getClassImage(); GetCurrentClass_trainingsession(); // Verifier si le metier est geré if (props.formation.metier) { if (!liste_metier.includes(props.formation.metier)) { setismetiermanaged("0"); // j'ai une valeur dans metier, mais qui n'est pas geré } } else { setismetiermanaged("0"); } if (props.formation.img_url && String(props.formation.img_url).length > 0) { setismetiermanaged("1"); } }, []); const [GetCurrentClass_api, setGetCurrentClass_api] = useState(); const [GetCurrentClass_message, setGetCurrentClass_message] = useState(); const [GetCurrentClass_result, setGetCurrentClass_result] = useState(); function GetCurrentClass_trainingsession(event) { var form = new FormData(); form.append("class_internal_url", props.formation.internal_url); var myurl = process.env.REACT_APP_API_URL + "myclass/api/GetActiveSessionFormation_List/"; axios.post(myurl, form).then(res => { if (res.data.status != "false") { //console.log(" In GetCurrentClass_trainingsession res.data.status = " + res.data.status); //console.log(" In GetCurrentClass_trainingsession res.data.message r_class = " + res.data.message); setGetCurrentClass_api("true"); setGetCurrentClass_result(res.data.message); } else { setGetCurrentClass_api("false"); setGetCurrentClass_message(res.data.message); } }).catch((error) => { console.warn('Not good man :( GetCurrentClass_trainingsession = ', error); setGetCurrentClass_api("false"); //setmyApimyApiMessage("") }) } return (
{String(parse(String(props.formation.title).replace(/(<([^>]+)>)/ig, ''))).substring(0, 60)}