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' import { FcCalendar } from "react-icons/fc"; const Formation_Cartouche_Com = (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: 'Oui', onClick: () => { history.push("/mysy-training-login/training/" + props.formation.internal_url) } }, { label: 'Non', 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 grrr : Not good man :( getClassImage = '); setisclassimage("False"); setuserimgclassprofil(profileimg); }) } 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(); }, []); 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); form.append("token", stored_partner); 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 (
{props.formation.img_url && String(props.formation.img_url).length > 0 && String(isclassimage) === "False" && } {(!props.formation.img_url || String(props.formation.img_url).length <= 0) && String(isclassimage) === "False" && !props.formation.metier && autre} {(!props.formation.img_url || String(props.formation.img_url).length <= 0) && props.formation.metier && String(props.formation.metier).toLocaleLowerCase() === String("it") && String(isclassimage) === "False" && informatique} {(!props.formation.img_url || String(props.formation.img_url).length <= 0) && props.formation.metier && String(props.formation.metier).toLocaleLowerCase() === String("graphisme") && String(isclassimage) === "False" && graphisme} {(!props.formation.img_url || String(props.formation.img_url).length <= 0) && props.formation.metier && String(props.formation.metier).toLocaleLowerCase() === String("management") && String(isclassimage) === "False" && management} {(!props.formation.img_url || String(props.formation.img_url).length <= 0) && props.formation.metier && String(props.formation.metier).toLocaleLowerCase() === String("digital") && String(isclassimage) === "False" && digital} {(!props.formation.img_url || String(props.formation.img_url).length <= 0) && props.formation.metier && String(props.formation.metier).toLocaleLowerCase() === String("office") && String(isclassimage) === "False" && office} {!props.formation.img_url || String(props.formation.img_url).length <= 0 && props.formation.metier && String(props.formation.metier).toLocaleLowerCase() === String("rh") && String(isclassimage) === "False" && ressources humaines} {!props.formation.img_url || String(props.formation.img_url).length <= 0 && props.formation.metier && String(props.formation.metier).toLocaleLowerCase() === String("vente") && String(isclassimage) === "False" && vente} {!props.formation.img_url || String(props.formation.img_url).length <= 0 && props.formation.metier && String(props.formation.metier).toLocaleLowerCase() === String("dev_perso") && String(isclassimage) === "False" && developpement personnel} {String(isclassimage) === "True" && developpement personnel}
{ e.preventDefault(); window.open( "/Display-Detail-formation/" + props.formation.internal_url, '_blank' ); }}>
{props.formation.cpf && String(props.formation.cpf) === String("1") &&
OUI Éligible au CPF  
} {props.formation.cpf && String(props.formation.cpf) !== String("1") &&
NON Éligible au CPF  
} {!props.formation.cpf &&
NON Éligible au CPF  
}

{parse(String(props.formation.title).replace(/(<([^>]+)>)/ig, ''))}

{String(props.formation.price).length == 9 &&
Prix : Non communiqué  
} {String(props.formation.price).length != 9 && String(props.formation.price) === String("0") &&
Gratuit  
} {String(props.formation.price).length != 9 && String(props.formation.price) !== String("0") &&
{props.formation.price} €  HT
}
{parse(String(props.formation.description).replace(/(<([^>]+)>)/ig, '')).substring(0, 200)}...

{!props.formation.extented_search &&
{props.formation.duration_unit &&
Durée :
{String(props.formation.duration_unit) === "heure" &&
{props.formation.duration} hr  
} {String(props.formation.duration_unit) === "heures" &&
{props.formation.duration} hr  
} {String(props.formation.duration_unit) === "jour" &&
{props.formation.duration} jr  
}
} {!props.formation.duration_unit &&
Durée :
{props.formation.duration &&
{props.formation.duration} jrs  
} {!props.formation.duration &&
En traitement  
}
}
Certification :
{props.formation.certif && String(props.formation.certif) === String("1") &&
Oui  
} {props.formation.certif && String(props.formation.certif) !== String("1") &&
Non  
} {!props.formation.certif &&
NC  
}
   
{/*
Type
{props.formation.type}  
Support
{props.formation.support}  
*/} {/*props.formation.zone_diffusion && props.formation.zone_diffusion.country &&
Test : pays
{props.formation.zone_diffusion.country}  
*/} {/*props.formation.zone_diffusion && props.formation.zone_diffusion.city &&
Test : Ville
{props.formation.zone_diffusion.city}  
*/} {/* {props.formation.presentiel && props.formation.presentiel.presentiel &&
Presentiel
{props.formation.presentiel.presentiel}  
} {props.formation.presentiel && props.formation.presentiel.distantiel &&
Distantiel
{props.formation.presentiel.distantiel}  
} */}
}
{String(props.formation.coeur) === String("1") &&
coup de coeur
}
Sur site :
{props.formation.presentiel && props.formation.presentiel.presentiel && String(props.formation.presentiel.presentiel) === String("1") &&
Oui
} {props.formation.presentiel && props.formation.presentiel.presentiel && String(props.formation.presentiel.presentiel) !== String("1") &&
Non
} {!props.formation.presentiel || !props.formation.presentiel.presentiel &&
NC
}
A distance :
{props.formation.presentiel && props.formation.presentiel.distantiel && String(props.formation.presentiel.distantiel) === String("1") &&
Oui
} {props.formation.presentiel && props.formation.presentiel.distantiel && String(props.formation.presentiel.distantiel) !== String("1") &&
Non
} {!props.formation.presentiel || !props.formation.presentiel.distantiel &&
NC
}
Support :
{props.formation.support &&
{props.formation.support}
}
{/*
{!props.formation.extented_search && props.formation.coeur != "1" &&
{GetCurrentClass_result && GetCurrentClass_result.length > 0 && }
}
*/} {/* /!\ : le pavé pour les cartouche */}
{!props.formation.extented_search && props.formation.coeur != "1" &&
}
) } export default Formation_Cartouche_Com;