Ela_Front/src/components/Inscription_Information.js

1077 lines
42 KiB
JavaScript

import React, { useState, useEffect, useRef } from "react";
import { useForm } from "react-hook-form";
import { getCookie, setCookie } from 'react-use-cookie';
import Box from '@mui/material/Box';
import InputLabel from '@mui/material/InputLabel';
import InputAdornment from '@mui/material/InputAdornment';
import FormControl from '@mui/material/FormControl';
import TextField from '@mui/material/TextField';
import AccountCircle from '@mui/icons-material/AccountCircle';
import PhoneIcon from '@mui/icons-material/Phone'
import HomeWorkIcon from '@mui/icons-material/HomeWork';
import EmailIcon from '@mui/icons-material/Email'
import HomeIcon from '@mui/icons-material/Home'
import { Button, Form, FormGroup, Label } from "reactstrap";
import PasswordIcon from '@mui/icons-material/Password'
import Visibility from '@mui/icons-material/Visibility';
import VisibilityOff from '@mui/icons-material/VisibilityOff';
import IconButton from '@mui/material/IconButton';
import OutlinedInput from '@mui/material/OutlinedInput';
import { useHistory } from "react-router-dom";
import TwitterIcon from '@mui/icons-material/Twitter';
import FacebookIcon from '@mui/icons-material/Facebook';
import LinkedInIcon from '@mui/icons-material/LinkedIn';
import axios from "axios";
import MenuItem from '@mui/material/MenuItem';
import { Redirect } from 'react-router-dom'
import { Editor } from '@tinymce/tinymce-react';
import SendIcon from '@mui/icons-material/Send';
import { IoAddCircleOutline, IoCloseCircleOutline } from "react-icons/io5";
import Rating from '@mui/material/Rating';
import parse from 'html-react-parser'
function Inscription_Information(props) {
const [action, setaction] = useState(props.action);
const [class_internal_url, setclass_internal_url] = useState(props.internal_url);
const modefinancement = [
{
value: 'cpf',
label: 'CPF',
},
{
value: 'perso',
label: 'Fonds Propres',
},
{
value: 'entreprise',
label: 'Votre entreprise',
},
{
value: 'mixte_cpf_perso',
label: 'CPF & Fonds Propres',
},
{
value: 'autre',
label: 'Autre',
},
];
const opco = [
{
value: 'opco Paris',
label: 'paris',
},
{
value: 'opco Nanterre',
label: 'Nanterre',
},
{
value: 'inconnu',
label: 'inconnu',
},
];
const [myopco, setmyopco] = useState("");
function handleChangeOpco(event) {
setmyopco(event.target.value);
};
const [mysession, setmysession] = useState("");
const [monfinancement, setmonfinancement] = useState("");
function handleChangeSession(event) {
setmysession(event.target.value);
};
function handleChangeFinancement(event) {
setmonfinancement(event.target.value);
};
const [RecordData_api, setRecordData_api] = useState("");
const [RecordData_status, setRecordData_status] = useState("");
const [RecordData_message, setRecordData_message] = useState("");
function RecordData() {
const formData = new FormData();
const url = process.env.REACT_APP_API_URL + "myclass/api/AddStagiairetoClass/";
var nom = document.getElementsByName("nom")[0].value;
if (String(nom).trim().length <= 0) {
document.getElementsByName("nom")[0].style.borderColor = "red";
alert(" Le nom d'utilisateur est obligatoire ");
return;
}
var prenom = document.getElementsByName("prenom")[0].value;
if (String(prenom).trim().length <= 0) {
document.getElementsByName("telephone")[0].style.borderColor = "red";
alert(" Le prenom d'utilisateur est obligatoire ");
return;
}
var telephone = document.getElementsByName("telephone")[0].value;
if (String(telephone).trim().length < 10) {
document.getElementsByName("telephone")[0].style.borderColor = "red";
alert(" Le numero de telephone doit comporter 10 chiffres ");
return;
}
var email = document.getElementsByName("email")[0].value;
var re2 = /\S+@\S+\.\S+/;
if (re2.test(email) === false) {
alert("L'email est incorrect ");
document.getElementsByName("email")[0].style.borderColor = "red";
return;
}
var modefinancement = document.getElementById('modefinancement').value;
if (String(modefinancement).trim().length <= 0) {
alert("Vous devez choisir une mode de financement ");
return;
}
var opco = "inconnu"
if (document.getElementById('opco') && document.getElementById('opco').value) {
opco = document.getElementById('opco').value;
if (String(opco).trim().length <= 0) {
alert("Vous devez choisir un centre Opco ");
return;
}
}
var session = mysession;
if (String(nom).trim().length <= 0) {
alert(" Le nom d'utilisateur est obligatoire ");
return;
}
var employeur = ""
if (document.getElementById('employeur') && document.getElementById('employeur').value) {
employeur = document.getElementById('employeur').value;
}
// var class_internal_url = document.getElementsByName("adr_country")[0].value;
formData.append('nom', nom);
formData.append('employeur', employeur);
formData.append('prenom', prenom);
formData.append('telephone', telephone);
formData.append('email', email);
formData.append('modefinancement', modefinancement);
formData.append('opco', opco);
formData.append('session_id', session);
formData.append('class_internal_url', props.internal_url);
fetch(
url,
{
method: 'POST',
body: formData,
}
)
.then((response) => response.json())
.then((result) => {
console.log('Success:', result['message'], "result['status'] = ", result['status']);
setRecordData_api(result['status']);
setRecordData_status(result['status']);
setRecordData_message(result['message']);
})
.catch((error) => {
console.error('Error:', error);
setRecordData_api("false");
setRecordData_status("false");
setRecordData_message();
});
};
const [GetListOpco_api, setGetListOpco_api] = useState();
const [GetListOpco_message, setGetListOpco_message] = useState();
const [GetListOpco_result, setGetListOpco_result] = useState();
function GetListOpco(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/GetListOpco/";
fetch(myurl,
{
method: 'POST',
body: form,
})
.then((data) => data.json())
.then((data) => {
//console.log(' GetListOpco Success:', data['message'], "data['status'] = ", data['status']);
if (String(data['status']) === String("false")) {
//console.log("erreur rrrr:" + data['status'])
setGetListOpco_api("false");
setGetListOpco_message(data['message'])
}
else {
setGetListOpco_api("true");
setGetListOpco_result(data['message']);
}
}).catch((error) => {
console.error('Error:', error);
setGetListOpco_api("false");
});
}
const [closeform, setcloseform] = useState("");
function close_inscription_form() {
window.location.reload();
}
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("token","K3cw63eKokKSbV4spjQ48SUNnfy80yrXfA");
const stored_cookie = getCookie('tokenmysych');
form.append("class_internal_url", props.internal_url);
var myurl = process.env.REACT_APP_API_URL + "myclass/api/GetActiveSessionFormation_List/";
axios.post(myurl, form).then(res => {
if (String(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("")
})
}
useEffect(() => {
if (String(props.action).toLocaleLowerCase() !== "inscription" &&
String(props.action).toLocaleLowerCase() !== "information") {
CheckEvaluationToken();
}
GetCurrentClass_trainingsession();
GetListOpco();
}, []);
// Cette fonction verifier si le token de l'evaluation est valide
//si $action != 'information' et 'inscription', alors la valeur est forcement celle d'un token.
const [tokenEval_api, settokenEval_api] = useState();
const [tokenEval_message, settokenEval_message] = useState();
const [tokenEval_result, settokenEval_result] = useState();
function CheckEvaluationToken() {
var form = new FormData();
//form.append("token","K3cw63eKokKSbV4spjQ48SUNnfy80yrXfA");
const stored_cookie = getCookie('tokenmysych');
form.append("eval_token", props.action);
form.append("class_internal_url", props.internal_url);
var myurl = process.env.REACT_APP_API_URL + "myclass/api/ckeckEvaluationToken/";
axios.post(myurl, form).then(res => {
if (String(res.data.status) !== "false") {
console.log(" In tokenEval_trainingsession res.data.status = " + res.data.status);
console.log(" In tokenEval_trainingsession res.data.message r_class = " + res.data.message);
settokenEval_api("true");
settokenEval_result(res.data.message);
}
else {
settokenEval_api("false");
settokenEval_message(res.data.message);
}
}).catch((error) => {
console.warn('Not good man :( CheckEvaluationToken = ', error);
settokenEval_api("false");
//setmyApimyApiMessage("")
})
}
function clearfileds() {
if (document.getElementsByName("nom")[0]) {
document.getElementsByName("nom")[0].value = "";
}
if (document.getElementsByName("prenom")[0]) {
document.getElementsByName("prenom")[0].value = "";
}
if (document.getElementsByName("email")[0]) {
document.getElementsByName("email")[0].value = "";
}
if (document.getElementsByName("telephone")[0]) {
document.getElementsByName("telephone")[0].value = "";
}
if (document.getElementsByName("employeur")[0]) {
document.getElementsByName("employeur")[0].value = "";
}
}
function clearfileds_info() {
if (document.getElementsByName("nom_info")[0]) {
document.getElementsByName("nom_info")[0].value = "";
}
if (document.getElementsByName("prenom_info")[0]) {
document.getElementsByName("prenom_info")[0].value = "";
}
if (document.getElementsByName("email_info")[0]) {
document.getElementsByName("email_info")[0].value = "";
}
if (document.getElementsByName("telephone_info")[0]) {
document.getElementsByName("telephone_info")[0].value = "";
}
if (document.getElementsByName("employeur_info")[0]) {
document.getElementsByName("employeur_info")[0].value = "";
}
}
const [AnnulerFction_status, setAnnulerFction_status] = useState("");
function AnnulerFction() {
clearfileds();
setRecordData_status("false");
setmysession("");
}
const [AnnulerFction_info_status, setAnnulerFction_info_status] = useState("");
function AnnulerFction_info() {
clearfileds_info();
setAnnulerFction_info_status("false");
}
const editorRef_description = useRef(null);
const [field_description, setfield_description] = useState("");
const [editor_tochange, seteditor_tochange] = useState("");
function editor_keyup() {
seteditor_tochange("1");
}
const editorRef_evaluation = useRef(null);
const [field_evaluation, setfield_evaluation] = useState("");
const [editor_evaluation_tochange, seteditor_evaluation_tochange] = useState("");
function editor_evalution_keyup() {
seteditor_evaluation_tochange("1");
}
const [datamodification, setdatamodification] = useState("0");
function DataUpdated() {
setdatamodification("1");
}
const [SendInformationRequest_api, setSendInformationRequest_api] = useState("");
const [SendInformationRequest_status, setSendInformationRequest_status] = useState("");
const [SendInformationRequest_message, setSendInformationRequest_message] = useState("");
function SendInformationRequest() {
const formData = new FormData();
const url = process.env.REACT_APP_API_URL + "myclass/api/RenseignementClass/";
var nom = document.getElementsByName("nom_info")[0].value;
if (String(nom).trim().length <= 0) {
document.getElementsByName("nom_info")[0].style.borderColor = "red";
alert(" Le nom d'utilisateur est obligatoire ");
return;
}
var prenom = document.getElementsByName("prenom_info")[0].value;
if (String(prenom).trim().length <= 0) {
document.getElementsByName("telephone_info")[0].style.borderColor = "red";
alert(" Le prenom d'utilisateur est obligatoire ");
return;
}
var telephone = document.getElementsByName("telephone_info")[0].value;
if (String(telephone).trim().length < 10) {
document.getElementsByName("telephone_info")[0].style.borderColor = "red";
alert(" Le numero de telephone doit comporter 10 chiffres ");
return;
}
var email = document.getElementsByName("email_info")[0].value;
var re2 = /\S+@\S+\.\S+/;
if (re2.test(email) === false) {
alert("L'email est incorrect ");
document.getElementsByName("email_info")[0].style.borderColor = "red";
return;
}
var employeur = ""
if (document.getElementById('employeur_info') && document.getElementById('employeur_info').value) {
employeur = document.getElementById('employeur_info').value;
}
var message = "";
if (editorRef_description.current) {
message = editorRef_description.current.getContent();
}
formData.append('nom', nom);
formData.append('employeur', employeur);
formData.append('prenom', prenom);
formData.append('telephone', telephone);
formData.append('email', email);
formData.append('message', message);
formData.append('class_internal_url', props.internal_url);
fetch(
url,
{
method: 'POST',
body: formData,
}
)
.then((response) => response.json())
.then((result) => {
console.log('Success:', result['message'], "result['status'] = ", result['status']);
setSendInformationRequest_api(result['status']);
setSendInformationRequest_status(result['status']);
setSendInformationRequest_message(result['message']);
})
.catch((error) => {
console.error('Error:', error);
setSendInformationRequest_api("false");
setSendInformationRequest_status("false");
setSendInformationRequest_message();
});
};
const [SendEvaluationClass_api, setSendEvaluationClass_api] = useState("");
const [SendEvaluationClass_status, setSendEvaluationClass_status] = useState("");
const [SendEvaluationClass_message, setSendEvaluationClass_message] = useState("");
function SendEvaluationClass() {
const formData = new FormData();
const url = process.env.REACT_APP_API_URL + "myclass/api/Evaluation_Class/";
var message = "";
if (editorRef_evaluation.current) {
message = editorRef_evaluation.current.getContent();
}
var pedagogie = "";
var ele = document.getElementsByName('pedagogie');
for (let i = 0; i < ele.length; i++) {
if (ele[i].checked)
pedagogie = ele[i].value;
}
var logistique = "";
ele = document.getElementsByName('log');
for (let i = 0; i < ele.length; i++) {
if (ele[i].checked)
logistique = ele[i].value;
}
formData.append('inscription_id', props.eval_token);
formData.append('eval_note', RatingValue);
formData.append('eval_eval', message);
formData.append('eval_pedagogie', pedagogie);
fetch(
url,
{
method: 'POST',
body: formData,
}
)
.then((response) => response.json())
.then((result) => {
//console.log('Success:', result['message'], "result['status'] = ", result['status']);
if (String(result['status']) === "true") {
setSendEvaluationClass_api("true");
} else if (String(result['status']) === "false") {
setSendEvaluationClass_api("false");
setSendEvaluationClass_message(result['message']);
}
})
.catch((error) => {
console.error('Error:', error);
setSendEvaluationClass_api("false");
});
};
const [RatingValue, setRatingValue] = useState();
return (
<div className='inscription'>
{String(RecordData_status) === "true" &&
String(action).toLocaleLowerCase() === "inscription" &&
<div className="okUpdateData">
Votre inscription bien été prise en compte.
Vous allez recevoir une email de confirmation dans votre boite email.
Merci.
</div>}
{String(SendInformationRequest_status) === "true" &&
String(action).toLocaleLowerCase() === "information" &&
<div className="okUpdateData">
Votre demande d'information été prise en compte.<br />
Merci.
</div>}
{(String(RecordData_status) === "false" ||
String(RecordData_status).length === 0) &&
String(action).toLocaleLowerCase() === "inscription" &&
String(AnnulerFction_status) !== "1" && <div>
<Box alignItems="left" sx={{ '& > :not(style)': { m: 1 }, width: '100%', }}>
{String(RecordData_status) === "false" && <div className="koUpdateData">
{RecordData_message}
</div>}
<div className="select-container">
<div className="titre1_aide_finance"> Je m'inscris</div>
<div style={{ "float": "left", "width": "40%", "textAlign": "left" }}>
Choisir une session : &nbsp;
</div>
<div style={{ "float": "right", "width": "60%", "textAlign": "right" }}>
<select value={mysession} onChange={handleChangeSession} className="selectsession">
<option value="">Choisir</option>
{GetCurrentClass_result && GetCurrentClass_result.map((formation) => (
<option value={JSON.parse(formation).formation_session_id}>
{(JSON.parse(formation).date_debut).substring(0, 10)} au {(JSON.parse(formation).date_fin).substring(0, 10)} -
{(JSON.parse(formation).distantiel) === "1" && " A Distance - "}
{(JSON.parse(formation).presentiel) === "1" && " En Présentiel - "+(JSON.parse(formation).adresse)+" "+(JSON.parse(formation).code_postal)}
</option>
))}
</select>
{/* {GetCurrentClass_result && <select value={mysession} onChange={handleChangeSession} className="selectsession">
<option value="">Choisir</option>
{
JSON.parse(GetCurrentClass_result).map((session) => <option value={session.session_id}>
{session.date_debut} - {session.date_fin} à </option>)
}
</select>} */}
</div>
</div>
</Box>
{mysession && <Box alignItems="left" sx={{ '& > :not(style)': { m: 1 }, width: '100%', }}>
<TextField
required
label="Nom"
name="nom"
className="texte_area"
sx={{ m: 1, width: '48%' }}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<AccountCircle />
</InputAdornment>
),
}}
variant="standard"
/>
<TextField
required
label="Prénom(s)"
name="prenom"
className="texte_area"
sx={{ m: 1, width: '48%' }}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<AccountCircle />
</InputAdornment>
),
}}
variant="standard"
/>
<TextField
required
name="email"
label="Adresse mail"
className="texte_area"
sx={{ m: 1, width: '48%' }}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<EmailIcon />
</InputAdornment>
),
}}
variant="standard"
/>
<TextField
required
name="telephone"
label="Téléphone"
className="texte_area"
sx={{ m: 1, width: '48%' }}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<PhoneIcon />
</InputAdornment>
),
}}
variant="standard"
/>
<TextField
name="employeur"
id="employeur"
label="Employeur"
className="texte_area"
sx={{ m: 1, width: '48%' }}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<HomeWorkIcon />
</InputAdornment>
),
}}
variant="standard"
/>
<div style={{ "width": "10%" }}> &nbsp;</div>
<div className="titre1_aide_finance"> Nous vous aidons à financer la formation</div>
<Box alignItems="left" sx={{ '& > :not(style)': { m: 1 }, width: '100%', }}>
<div className="select-container" style={{ "marginBottom": "1rem" }}>
<div className="field_gauche">
Choisir le mode financement : &nbsp;
</div>
<div className="field_droite">
<select id="modefinancement" value={monfinancement} onChange={handleChangeFinancement} className="selectsession">
<option value="">Choisir </option>
{modefinancement.map((option) => (
<option value={option.value}>{option.label}</option>
))}
</select>
</div>
</div>
</Box>
<div style={{ "width": "100%" }}> &nbsp;</div>
{monfinancement && String(monfinancement) !== "perso" &&
<Box alignItems="left" sx={{ '& > :not(style)': { m: 1 }, width: '100%', }}>
<div className="select-container">
<div className="field_gauche">
Choisir votre centre de rattachement
</div>
<div className="field_droite">
<select id="opco" value={myopco} onChange={handleChangeOpco} className="selectsession">
<option value="">Choisir </option>
{GetListOpco_result.map((option) => (
<option value={(JSON.parse(option).idcc_code)}>{(JSON.parse(option).idcc_code)} </option>
))}
</select>
</div>
<div className="okUpdateData"><i> *Choisir "00-Inconnu" si vous ne le connaissez pas. </i>
</div>
</div>
</Box>}
<div className="div_row22">
{<div className="div_row">
<div className="div_row_droite" style={{ "textAlign": "right" }}>
<Button variant="contained" color="success" style={{
'borderRadius': "5px",
"fontSize": "small", "padding": "0.3rem",
"width": "60%",
"backgroundColor": "#81BC3A",
}}
onClick={RecordData}>Se pré-inscrire &nbsp; &nbsp; {<SendIcon />}</Button>
</div>
</div>
}
</div>
</Box>}
</div>}
{/* Gestion de la note/evaluation */}
{(String(RecordData_status) === "false" ||
String(RecordData_status).length === 0) &&
String(action).toLocaleLowerCase() === "evaluation" &&
String(AnnulerFction_status) !== "1" &&
String(SendEvaluationClass_api) === "true" && <div className="survey_page">
<div className="okUpdateData">
OKKKKK
</div>
</div>}
{(String(RecordData_status) === "false" ||
String(RecordData_status).length === 0) &&
String(action).toLocaleLowerCase() === "evaluation" &&
String(AnnulerFction_status) !== "1" &&
String(SendEvaluationClass_api) !== "true" && <div className="survey_page">
{String(SendEvaluationClass_api) === "false" && <div className="survey_page">
<div className="koUpdateData">
{SendEvaluationClass_message}
</div>
</div>}
<h3> Demande d'evaluation </h3>
<div className="div_row22">
<Rating name="half-rating-read"
defaultValue={0}
precision={0.5}
onChange={(event, newValue) => {
setRatingValue(newValue);
}} /> <br />
</div>
<div className="div_row22 survey_block">
<fieldset>
<nav className="survey_title"> 1 .pedagogie </nav>
<nav className="survey_desc"> Satisfaction globale</nav>
<div class="some-class">
<input type="radio" class="radio" name="pedagogie" value="un_peu" id="pedagogie" />
<label for="pedagogie">Un peu</label> &nbsp;&nbsp;
<input type="radio" class="radio" name="pedagogie" value="bonne" id="pedagogie" />
<label for="pedagogie">Bonne</label>&nbsp;&nbsp;
<input type="radio" class="radio" name="pedagogie" value="excellent" id="pedagogie" />
<label for="pedagogie">Excellent</label>&nbsp;&nbsp;
</div>
</fieldset>
</div>
<div className="div_row22 survey_block">
<fieldset>
<nav className="survey_title"> 2 .La logistique </nav>
<nav className="survey_desc"> Satisfaction globale</nav>
<div class="some-class">
<input type="radio" class="radio" name="log" value="log_un_peu" id="log" />
<label for="log">Un peu</label> &nbsp;&nbsp;
<input type="radio" class="radio" name="log" value="log_bonne" id="log" />
<label for="log">Bcp</label>&nbsp;&nbsp;
<input type="radio" class="radio" name="log" value="log_excellente" id="log" />
<label for="log">Tres</label>&nbsp;&nbsp;
</div>
</fieldset>
</div>
<div className="div_row22 survey_block">
<fieldset style={{ "maxHeight": '200px' }}>
<nav className="survey_title"> 3 .Votre avis general</nav>
<Editor
onInit={(evt, editor) => editorRef_evaluation.current = editor}
initialValue={field_evaluation}
onKeyUp={editor_keyup}
onEditorChange={(newValue, editor) => {
if (String(editor_evaluation_tochange) === "1") {
seteditor_evaluation_tochange("");
}
}}
init={{
resize: false,
height: 100,
menubar: false,
plugins: [
'advlist autolink lists link image charmap print preview anchor',
'searchreplace visualblocks code fullscreen',
'insertdatetime media table paste code help wordcount'
],
toolbar: false,
content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:14px; }'
}}
/>
</fieldset>
</div>
<div className="div_row22">
{<div className="div_row">
<div className="div_row_droite" style={{ "textAlign": "right", "marginTop": "0.5rem" }}>
<Button variant="contained" className="bton_envoyer"
onClick={SendEvaluationClass}
startIcon={<SendIcon />}>Envoyer evaluation&nbsp; &nbsp; {<SendIcon />}</Button>
</div>
{/* <div className="div_row_droite" style={{ "textAlign": "right" }}>
<Button variant="contained" color="success" className="bton_fermer"
onClick={AnnulerFction_info}>Fermer &nbsp; &nbsp;{<IoCloseCircleOutline />}</Button>
</div>*/}
</div>
}
</div>
</div>}
{/* Gestion des demandes d'information */}
{(String(SendInformationRequest_status) === "false" ||
String(SendInformationRequest_status).length === 0) &&
String(action).toLocaleLowerCase() === "information" &&
String(AnnulerFction_info_status) !== "false" && <div>
<div className="div_info_gauche">
{String(RecordData_status) === "false" && <div className="koUpdateData">
{RecordData_message}
</div>}
<div className="select-container">
<div className="titre1_aide_finance"> Je m'informe</div>
</div>
<TextField
required
label="Nom"
name="nom_info"
className="texte_area"
sx={{ m: 1, width: '90%' }}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<AccountCircle />
</InputAdornment>
),
}}
variant="standard"
/>
<TextField
required
label="Prénom(s)"
name="prenom_info"
className="texte_area"
sx={{ m: 1, width: '90%' }}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<AccountCircle />
</InputAdornment>
),
}}
variant="standard"
/>
<TextField
required
name="email_info"
label="Adresse mail"
className="texte_area"
sx={{ m: 1, width: '90%' }}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<EmailIcon />
</InputAdornment>
),
}}
variant="standard"
/>
<TextField
required
name="telephone_info"
label="Téléphone"
className="texte_area"
sx={{ m: 1, width: '90%' }}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<PhoneIcon />
</InputAdornment>
),
}}
variant="standard"
/>
<TextField
name="employeur_info"
id="employeur_info"
label="Employeur"
className="texte_area"
sx={{ m: 1, width: '90%' }}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<HomeWorkIcon />
</InputAdornment>
),
}}
variant="standard"
/>
</div>
<div className="div_info_droite">
<div className="titre1_aide_finance"> Dites nous en plus sur votre besoin :)</div>
Votre message <br />
<Editor
onInit={(evt, editor) => editorRef_description.current = editor}
initialValue={field_description}
onKeyUp={editor_keyup}
onEditorChange={(newValue, editor) => {
if (String(editor_tochange) === "1") {
//alert(" change");
DataUpdated()
seteditor_tochange("");
}
}}
init={{
resize: false,
height: 300,
menubar: false,
plugins: [
'advlist autolink lists link image charmap print preview anchor',
'searchreplace visualblocks code fullscreen',
'insertdatetime media table paste code help wordcount'
],
toolbar: false,
content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:14px; }'
}}
/>
</div>
<div> &nbsp;</div>
<div className="div_row22">
{<div className="div_row">
<div className="div_row_droite" style={{ "textAlign": "right", "marginTop": "0.5rem" }}>
<Button variant="contained" className="bton_envoyer"
onClick={SendInformationRequest}
startIcon={<SendIcon />}>Envoyer &nbsp; &nbsp; {<SendIcon />}</Button>
</div>
{/* <div className="div_row_droite" style={{ "textAlign": "right" }}>
<Button variant="contained" color="success" className="bton_fermer"
onClick={AnnulerFction_info}>Fermer &nbsp; &nbsp;{<IoCloseCircleOutline />}</Button>
</div>*/}
</div>
}
</div>
</div>}
</div>
);
}
export default Inscription_Information;