From 9713f00cf5a78d3e15861dd4cde1a06716c0dec5 Mon Sep 17 00:00:00 2001 From: cherif Date: Thu, 3 Aug 2023 19:08:46 +0200 Subject: [PATCH] 03/08/23 - 19h --- src/components/AddPartnerClient.js | 15 +- src/components/Partner_Securite_Data.js | 927 ++++++++++ src/components/UpdatePartnerInfo.js | 1620 +++++++++-------- src/styles/components/_addpartnerclient.scss | 31 +- src/styles/components/_updateparnterinfo.scss | 274 ++- 5 files changed, 2084 insertions(+), 783 deletions(-) create mode 100644 src/components/Partner_Securite_Data.js diff --git a/src/components/AddPartnerClient.js b/src/components/AddPartnerClient.js index 33217b3..7b7d804 100644 --- a/src/components/AddPartnerClient.js +++ b/src/components/AddPartnerClient.js @@ -1803,6 +1803,7 @@ const AddParnerClient = (props) => { Get_List_Contact_Of_client_Part(); setaddcontact("0"); + setdatamodification_contact("") alert(res.data.message); @@ -2524,19 +2525,19 @@ const AddParnerClient = (props) => { {String(submenu).trim() === "submenu_contact" &&
- {String(addcontact) !== "1" &&
-
Ajouter un contact
-
+ {String(addcontact) !== "1" &&
+
Ajouter un contact
+
{Get_List_Contact_Of_client_Part_result && String(Get_List_Contact_Of_client_Part_api) === "true" && Get_List_Contact_Of_client_Part_result.map((client) => (
- {String(JSON.parse(client).prenom)}   {String(JSON.parse(client).nom)}
- fonction = {String(JSON.parse(client).fonction)}
- mail = {String(JSON.parse(client).email)}
- Tel = {String(JSON.parse(client).telephone)}
+ {(JSON.parse(client).nom || JSON.parse(client).prenom) && } + {JSON.parse(client).fonction && } + {JSON.parse(client).email && } + {JSON.parse(client).telephone && }
diff --git a/src/components/Partner_Securite_Data.js b/src/components/Partner_Securite_Data.js new file mode 100644 index 0000000..426562c --- /dev/null +++ b/src/components/Partner_Securite_Data.js @@ -0,0 +1,927 @@ +import React, { useState, useEffect, } 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 EmailIcon from '@mui/icons-material/Email' +import LanguageIcon from '@mui/icons-material/Language'; +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 { ConsoleView } from "react-device-detect"; +import MenuItem from '@mui/material/MenuItem'; + + + + +const Partner_Securite_Data = (props) => { + + const history = useHistory(); + + const [myApiResponse, setmyApiResponse] = useState(""); + const [result, setResult] = useState(""); + const [testval, settestval] = useState(); + const [fields1desabled, setfields1desabled] = useState(true); + const [mailfieldsdesabled, setmailfieldsdesabled] = useState(true); + const [pwdfieldsdesabled, setpwdfieldsdesabled] = useState(true); + + const [values, setValues] = React.useState({ + password: '', + showPassword: false, + }); + + const [valuesPass1, setValuesPass1] = React.useState({ + password1: '', + showPassword1: false, + }); + + const [valuesPass2, setValuesPass2] = React.useState({ + password2: '', + showPassword2: false, + }); + + const [valuesPass3, setValuesPass3] = React.useState({ + password3: '', + showPassword3: false, + }); + + + + const [currentpawdvisible, setcurrentpawdvisible] = useState(false); + const [newpawdvisible, setnewpawdvisible] = useState(false); + const [confpwdvisible, setconfpwdvisible] = useState(false); + const [updatemainmail, setupdatemainmail] = useState(); + const [updatepwd, setupdatepwd] = useState(); + + + function enablesecurtymailfields() { + + + document.getElementsByName("current_email")[0].disabled = false; + document.getElementsByName("current_email")[0].style.backgroundColor = "#FFFFFF"; + + + + document.getElementsByName("new_email")[0].disabled = false; + document.getElementsByName("new_email")[0].style.backgroundColor = "#FFFFFF"; + + document.getElementsByName("conf_new_email")[0].disabled = false; + document.getElementsByName("conf_new_email")[0].style.backgroundColor = "#FFFFFF"; + + + setmailfieldsdesabled(false); + } + + function desablesecurtymailfields() { + document.getElementsByName("current_email")[0].disabled = true; + document.getElementsByName("current_email")[0].style.backgroundColor = "#ECEFF1"; + document.getElementsByName("current_email")[0].value = ""; + + + document.getElementsByName("new_email")[0].disabled = true; + document.getElementsByName("new_email")[0].style.backgroundColor = "#ECEFF1"; + document.getElementsByName("new_email")[0].value = ""; + + + document.getElementsByName("conf_new_email")[0].disabled = true; + document.getElementsByName("conf_new_email")[0].style.backgroundColor = "#ECEFF1"; + document.getElementsByName("conf_new_email")[0].value = ""; + + + setmailfieldsdesabled(true); + } + + const handleMouseDownPassword = (event) => { + event.preventDefault(); + }; + + // recuperation et gestion du token utilisateur + const stored_user = getCookie('tokenmysypart'); + if (!stored_user || stored_user.length <= 0) { + history.push("/PartnerLogin"); + } + + const handleClickShowPassword_current_pwd = () => { + var filtre2_value = document.getElementsByName("current_pwd")[0].value; + + if (currentpawdvisible == false) { + document.getElementsByName("current_pwd")[0].type = "text"; + setcurrentpawdvisible(true); + } + else if (currentpawdvisible == true) { + document.getElementsByName("current_pwd")[0].type = "password"; + setcurrentpawdvisible(false); + } + + }; + + + const handleClickShowPassword_new_pwd = () => { + if (newpawdvisible == false) { + document.getElementsByName("new_pwd")[0].type = "text"; + setnewpawdvisible(true); + } + else if (newpawdvisible == true) { + document.getElementsByName("new_pwd")[0].type = "password"; + setnewpawdvisible(false); + } + }; + + + const handleClickShowPassword_new_pwd_conf = () => { + if (confpwdvisible == false) { + document.getElementsByName("new_pwd_conf")[0].type = "text"; + setconfpwdvisible(true); + } + else if (confpwdvisible == true) { + document.getElementsByName("new_pwd_conf")[0].type = "password"; + setconfpwdvisible(false); + } + + }; + + function handleChange1(prop) { + return (event) => { + setValuesPass1({ ...valuesPass1, [prop]: event.target.value }); + }; + } + + function handleChange2(prop) { + return (event) => { + setValuesPass2({ ...valuesPass2, [prop]: event.target.value }); + }; + } + + function handleChange3(prop) { + return (event) => { + setValuesPass3({ ...valuesPass3, [prop]: event.target.value }); + }; + } + + function UpdatePartnerPwd() { + + //setupdatepwd(false); + const url = process.env.REACT_APP_API_URL + "myclass/api/update_partner_pwd/"; + const formData = new FormData(); + formData.append('token', stored_user); + + // Si le partenaire n'est pas connecté, il est renvoyé vers la page de connexion + if (!stored_user || stored_user.length <= 0) { + history.push("/PartnerLogin"); + } + + var pwd = document.getElementsByName("current_pwd")[0].value; + var new_pwd = document.getElementsByName("new_pwd")[0].value; + var conf_new_pwd = document.getElementsByName("new_pwd_conf")[0].value; + + + formData.append('pwd', pwd); + formData.append('new_pwd', new_pwd); + formData.append('conf_new_pwd', conf_new_pwd); + + document.getElementsByName("identique")[0].style.backgroundColor = "white"; + if (new_pwd !== conf_new_pwd) { + document.getElementsByName("identique")[0].style.backgroundColor = "red"; + return; + } + + document.getElementsByName("caractere")[0].style.backgroundColor = "white"; + if (String(new_pwd).length < 8) { + document.getElementsByName("caractere")[0].style.backgroundColor = "red"; + return + } + + var regex = /\d/g; + document.getElementsByName("nombre")[0].style.backgroundColor = "white"; + if (!regex.test(new_pwd)) { + document.getElementsByName("nombre")[0].style.backgroundColor = "red"; + return + } + + const specialChars = /[`!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?~]/; + document.getElementsByName("special")[0].style.backgroundColor = "white"; + if (!specialChars.test(new_pwd)) { + document.getElementsByName("special")[0].style.backgroundColor = "red"; + return + } + + fetch( + url, + { + method: 'POST', + body: formData, + } + ) + .then((response) => response.json()) + .then((result) => { + //console.log('Success:', result['message'], "result['status'] = ", result['status']); + setmyApiResponse(result['status']); + setResult(result['message']); + if (String(result['status']) == String("true")) { + setupdatepwd(true); + } + + }) + .catch((error) => { + console.error('Error:', error); + setmyApiResponse("false"); + setupdatepwd(false); + }); + } + + + function UpdatePartnerMail() { + + setupdatemainmail(false); + const url = process.env.REACT_APP_API_URL + "myclass/api/update_partner_main_mail/"; + const formData = new FormData(); + formData.append('token', stored_user); + + // Si le partenaire n'est pas connecté, il est renvoyé vers la page de connexion + if (!stored_user || stored_user.length <= 0) { + history.push("/PartnerLogin"); + } + + var mail = document.getElementsByName("current_email")[0].value; + var new_mail = document.getElementsByName("new_email")[0].value; + var conf_new_mail = document.getElementsByName("conf_new_email")[0].value; + + + formData.append('mail', mail); + formData.append('new_mail', new_mail); + formData.append('conf_new_mail', conf_new_mail); + + + fetch( + url, + { + method: 'POST', + body: formData, + } + ) + .then((response) => response.json()) + .then((result) => { + //console.log('Success:', result['message'], "result['status'] = ", result['status']); + setmyApiResponse(result['status']); + setResult(result['message']); + if (String(result['status']) == String("true")) { + setupdatemainmail(true); + } + + }) + .catch((error) => { + console.error('Error:', error); + setmyApiResponse("false"); + setupdatemainmail(false); + }); + + + + } + + function desablesecurtypwdfields() { + document.getElementsByName("current_pwd")[0].disabled = true; + document.getElementsByName("current_pwd")[0].style.backgroundColor = "#ECEFF1"; + document.getElementsByName("current_pwd")[0].value = ""; + + document.getElementsByName("new_pwd")[0].disabled = true; + document.getElementsByName("new_pwd")[0].style.backgroundColor = "#ECEFF1"; + document.getElementsByName("new_pwd")[0].value = ""; + + document.getElementsByName("new_pwd_conf")[0].disabled = true; + document.getElementsByName("new_pwd_conf")[0].style.backgroundColor = "#ECEFF1"; + document.getElementsByName("new_pwd_conf")[0].value = ""; + + + setpwdfieldsdesabled(true); + } + + + + function enablesecurtypwdfields() { + + document.getElementsByName("current_pwd")[0].disabled = false; + document.getElementsByName("current_pwd")[0].style.backgroundColor = "#FFFFFF"; + + document.getElementsByName("new_pwd")[0].disabled = false; + document.getElementsByName("new_pwd")[0].style.backgroundColor = "#FFFFFF"; + + document.getElementsByName("new_pwd_conf")[0].disabled = false; + document.getElementsByName("new_pwd_conf")[0].style.backgroundColor = "#FFFFFF"; + + setpwdfieldsdesabled(false); + } + + + + function enablesecurtypwdfields() { + + document.getElementsByName("current_pwd")[0].disabled = false; + document.getElementsByName("current_pwd")[0].style.backgroundColor = "#FFFFFF"; + + document.getElementsByName("new_pwd")[0].disabled = false; + document.getElementsByName("new_pwd")[0].style.backgroundColor = "#FFFFFF"; + + document.getElementsByName("new_pwd_conf")[0].disabled = false; + document.getElementsByName("new_pwd_conf")[0].style.backgroundColor = "#FFFFFF"; + + setpwdfieldsdesabled(false); + } + + const [valuesconf_new_insert_key, setvaluesconf_new_insert_key] = React.useState({ + password_insertconf_new_key: '', + showpassword_insertconf_new_key: false, + }); + + const [conf_new_insert_key_visible, setconf_new_insert_key_visible] = useState(false); + + function handleChangeconf_new_insert_key(prop) { + return (event) => { + setvaluesconf_new_insert_key({ ...conf_new_insert_key_visible, [prop]: event.target.value }); + }; + } + + function desablesecurtyInsertKeyfields() { + + setinsert_key_updated(); + document.getElementsByName("current_insert_key")[0].disabled = true; + document.getElementsByName("current_insert_key")[0].style.backgroundColor = "#ECEFF1"; + document.getElementsByName("current_insert_key")[0].value = ""; + + document.getElementsByName("new_insert_key")[0].disabled = true; + document.getElementsByName("new_insert_key")[0].style.backgroundColor = "#ECEFF1"; + document.getElementsByName("new_insert_key")[0].value = ""; + + document.getElementsByName("conf_new_insert_key")[0].disabled = true; + document.getElementsByName("conf_new_insert_key")[0].style.backgroundColor = "#ECEFF1"; + document.getElementsByName("conf_new_insert_key")[0].value = ""; + + + setinsert_keyfieldsdesabled(true); + } + + + function UpdatePartnerInsertKey() { + + setinsert_key_updated(); + const url = process.env.REACT_APP_API_URL + "myclass/api/update_partner_insert_key/"; + const formData = new FormData(); + formData.append('token', stored_user); + + // Si le partenaire n'est pas connecté, il est renvoyé vers la page de connexion + if (!stored_user || stored_user.length <= 0) { + history.push("/PartnerLogin"); + } + + var current_key = document.getElementsByName("current_insert_key")[0].value; + var new_key = document.getElementsByName("new_insert_key")[0].value; + var conf_new_key = document.getElementsByName("conf_new_insert_key")[0].value; + + + + document.getElementsByName("identique_insert_key")[0].style.backgroundColor = "white"; + if (new_key !== conf_new_key) { + document.getElementsByName("identique_insert_key")[0].style.backgroundColor = "red"; + return; + } + + document.getElementsByName("caractere_insert_key")[0].style.backgroundColor = "white"; + if (String(new_key).length < 8) { + document.getElementsByName("caractere_insert_key")[0].style.backgroundColor = "red"; + return + } + + var regex = /\d/g; + document.getElementsByName("nombre_insert_key")[0].style.backgroundColor = "white"; + if (!regex.test(new_key)) { + document.getElementsByName("nombre_insert_key")[0].style.backgroundColor = "red"; + return + } + + const specialChars = /[`!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?~]/; + document.getElementsByName("special_insert_key")[0].style.backgroundColor = "white"; + if (!specialChars.test(new_key)) { + document.getElementsByName("special_insert_key")[0].style.backgroundColor = "red"; + return + } + + + formData.append('current_insert_key', current_key); + formData.append('new_insert_key', new_key); + formData.append('conf_insert_key', conf_new_key); + + + + fetch( + url, + { + method: 'POST', + body: formData, + } + ) + .then((response) => response.json()) + .then((result) => { + //console.log('Success:', result['message'], "result['status'] = ", result['status']); + setinsert_key_api(result['status']); + setinsert_key_api_message(result['message']); + if (String(result['status']) === String("true")) { + desablesecurtyInsertKeyfields(); + document.getElementsByName("current_insert_key")[0].value = new_key; + setinsert_key_updated(true); + } else if (String(result['status']) === String("Err_Connexion")) { + alert('Erreur: ' + result['message']); + history.push("/Connexion"); + } + + + }) + .catch((error) => { + console.error('Error:', error); + setinsert_key_api("false"); + setinsert_key_updated(false); + }); + } + + function enablesecurtyInsertKeyfields() { + + setinsert_key_updated(); + document.getElementsByName("current_insert_key")[0].disabled = false; + document.getElementsByName("current_insert_key")[0].style.backgroundColor = "#FFFFFF"; + + + document.getElementsByName("new_insert_key")[0].disabled = false; + document.getElementsByName("new_insert_key")[0].style.backgroundColor = "#FFFFFF"; + + document.getElementsByName("conf_new_insert_key")[0].disabled = false; + document.getElementsByName("conf_new_insert_key")[0].style.backgroundColor = "#FFFFFF"; + + setinsert_keyfieldsdesabled(false); + } + + const handleClickconf_new_insert_key = () => { + if (conf_new_insert_key_visible == false) { + document.getElementsByName("conf_new_insert_key")[0].type = "text"; + setconf_new_insert_key_visible(true); + } + else if (conf_new_insert_key_visible == true) { + document.getElementsByName("conf_new_insert_key")[0].type = "password"; + setconf_new_insert_key_visible(false); + } + }; + + const [insert_key_api, setinsert_key_api] = useState(""); + const [insert_key_api_message, setinsert_key_api_message] = useState(""); + const [insert_key_updated, setinsert_key_updated] = useState(); + + const [insert_keyfieldsdesabled, setinsert_keyfieldsdesabled] = useState(true); + + // Gestion champs caché : Current_Insertion_Key + const [values_current_insert_key, setvalues_current_insert_key] = React.useState({ + current_insert_key: '', + showCurrent_insert_key: false, + }); + + + const [valuescurrent_insert_key, setvaluescurrent_insert_key] = React.useState({ + password_insert_current_key: '', + showpassword_insert_current_key: false, + }); + + const [current_insert_key_visible, setcurrent_insert_key_visible] = useState(false); + + function handleChange_current_insert_key(prop) { + return (event) => { + setvaluescurrent_insert_key({ ...current_insert_key_visible, [prop]: event.target.value }); + }; + } + + const handleClickcurrent_insert_key = () => { + if (current_insert_key_visible == false) { + document.getElementsByName("current_insert_key")[0].type = "text"; + setcurrent_insert_key_visible(true); + } + else if (current_insert_key_visible == true) { + document.getElementsByName("current_insert_key")[0].type = "password"; + setcurrent_insert_key_visible(false); + } + }; + // FIN Gestion champs caché : Current_Insertion_Key + + // Gestion champs caché : new_Insertion_Key + const [values_new_insert_key, setvalues_new_insert_key] = React.useState({ + new_insert_key: '', + shownew_insert_key: false, + }); + + + const [valuesnew_insert_key, setvaluesnew_insert_key] = React.useState({ + password_insert_new_key: '', + showpassword_insert_new_key: false, + }); + + const [new_insert_key_visible, setnew_insert_key_visible] = useState(false); + + function handleChange_new_insert_key(prop) { + return (event) => { + setvaluesnew_insert_key({ ...new_insert_key_visible, [prop]: event.target.value }); + }; + } + + const handleClicknew_insert_key = () => { + if (new_insert_key_visible == false) { + document.getElementsByName("new_insert_key")[0].type = "text"; + setnew_insert_key_visible(true); + } + else if (new_insert_key_visible == true) { + document.getElementsByName("new_insert_key")[0].type = "password"; + setnew_insert_key_visible(false); + } + }; + + + useEffect(() => { + + desablesecurtymailfields(); + desablesecurtypwdfields(); + desablesecurtyInsertKeyfields(); + + }, []) + + + return ( + +
+
 
+ +
+
Mot de passe
+ {updatepwd == false &&
+ Erreur mise à jour. +
+ } + + {updatepwd == true &&
+ La mise à jour été faite +
+ } + :not(style)': { m: 1 } }}> + + + + + + + {currentpawdvisible ? : } + + + } + + /> + + + + + + + + + {newpawdvisible ? : } + + + } + + /> + + + + + + + + {confpwdvisible ? : } + + + } + + /> + +
+ Créez un mot de passe contenant au moins : +
    +
  • + 8 caractères +
  • +
  • + 1 nombre +
  • +
  • + 1 caractère spécial p. ex., $, !, @, %, & +
  • + +
  • + Identiques +
  • +
+
+ +
+ + {pwdfieldsdesabled == false &&
+
+ +
+
+ +
+
+ } + {pwdfieldsdesabled == true && + + } +
+ + +
+
+ + + +
+
Emails contact
+ {updatemainmail === false &&
+ Erreur mise à jour. +
+ } + + {updatemainmail === true &&
+ La mise à jour été faite +
+ } + + + + + ), + }} + variant="standard" + /> +
+ + + + ), + }} + variant="standard" + /> +
+ + + + ), + }} + variant="standard" + /> +
+   +
    +
  • +   +
  • +
  • +   +
  • +
  • +   +
  • + +
  • +   +
  • +
+
+ {mailfieldsdesabled == false &&
+
+ +
+
+ +
+
+ } + {mailfieldsdesabled == true &&
+ +
+ } + + + + +
+
 
+ +
+
+
Clé de rattachement
+ {insert_key_updated === false &&
+ Erreur mise à jour {setinsert_key_api_message} +
+ } + + {insert_key_updated === true &&
+ La clé a été correctement mise à jour +
+ } + + + :not(style)': { m: 1 } }} > + + + + + + + {current_insert_key_visible ? : } + + + } + + /> + + + + + + + + {new_insert_key_visible ? : } + + + } + + /> + + + + + + + + {conf_new_insert_key_visible ? : } + + + } + + /> + +
+ Créez un mot de passe contenant au moins : +
    +
  • + 8 caractères +
  • +
  • + 1 nombre +
  • +
  • + 1 caractère spécial p. ex., $, !, @, %, & +
  • + +
  • + Identiques +
  • +
+
+ +
+ + + {insert_keyfieldsdesabled == false &&
+ +
+ +
+ +
+ +
+
+ } + {insert_keyfieldsdesabled == true && + + } +
+ + +
+
+
+   + +
+
+ +
+ ) +} + + +export default Partner_Securite_Data; diff --git a/src/components/UpdatePartnerInfo.js b/src/components/UpdatePartnerInfo.js index 71c8b77..b9f82bc 100644 --- a/src/components/UpdatePartnerInfo.js +++ b/src/components/UpdatePartnerInfo.js @@ -25,6 +25,9 @@ import axios from "axios"; import { ConsoleView } from "react-device-detect"; import MenuItem from '@mui/material/MenuItem'; +import Partner_Securite_Data from "./Partner_Securite_Data"; + + function UpdateParnterInfo() { const history = useHistory(); const [myApiResponse, setmyApiResponse] = useState(""); @@ -81,9 +84,9 @@ function UpdateParnterInfo() { useEffect(() => { getCurrentUserData(); - desablesecurtymailfields(); - desablesecurtypwdfields(); - desablesecurtyInsertKeyfields(); + //desablesecurtymailfields(); + //desablesecurtypwdfields(); + //desablesecurtyInsertKeyfields(); getPartnerImages(); }, []) @@ -619,7 +622,7 @@ function UpdateParnterInfo() { } - function desablesecurtymailfields() { + function desablesecurtymailfields() {/* document.getElementsByName("current_email")[0].disabled = true; document.getElementsByName("current_email")[0].style.backgroundColor = "#ECEFF1"; document.getElementsByName("current_email")[0].value = ""; @@ -635,7 +638,7 @@ function UpdateParnterInfo() { document.getElementsByName("conf_new_email")[0].value = ""; - setmailfieldsdesabled(true); + setmailfieldsdesabled(true);*/ } @@ -661,20 +664,20 @@ function UpdateParnterInfo() { function desablesecurtypwdfields() { - document.getElementsByName("current_pwd")[0].disabled = true; - document.getElementsByName("current_pwd")[0].style.backgroundColor = "#ECEFF1"; - document.getElementsByName("current_pwd")[0].value = ""; - - document.getElementsByName("new_pwd")[0].disabled = true; - document.getElementsByName("new_pwd")[0].style.backgroundColor = "#ECEFF1"; - document.getElementsByName("new_pwd")[0].value = ""; - - document.getElementsByName("new_pwd_conf")[0].disabled = true; - document.getElementsByName("new_pwd_conf")[0].style.backgroundColor = "#ECEFF1"; - document.getElementsByName("new_pwd_conf")[0].value = ""; - - - setpwdfieldsdesabled(true); + /* document.getElementsByName("current_pwd")[0].disabled = true; + document.getElementsByName("current_pwd")[0].style.backgroundColor = "#ECEFF1"; + document.getElementsByName("current_pwd")[0].value = ""; + + document.getElementsByName("new_pwd")[0].disabled = true; + document.getElementsByName("new_pwd")[0].style.backgroundColor = "#ECEFF1"; + document.getElementsByName("new_pwd")[0].value = ""; + + document.getElementsByName("new_pwd_conf")[0].disabled = true; + document.getElementsByName("new_pwd_conf")[0].style.backgroundColor = "#ECEFF1"; + document.getElementsByName("new_pwd_conf")[0].value = ""; + + + setpwdfieldsdesabled(true);*/ } @@ -773,11 +776,15 @@ function UpdateParnterInfo() { // Recuperation de l'image logo & de l'image du cachet - formData.append('file_logo', isimgclassSelected); - formData.append('file_logo_recid', isimgclassSelected_recid); + if (String(userimgclassprofilchanged) === "1") { + formData.append('file_logo', isimgclassSelected); + formData.append('file_logo_recid', isimgclassSelected_recid); + } - formData.append('file_cachet', isimgcachetSelected); - formData.append('file_cachet_recid', isimgcachetSelected_recid); + if (String(isimgcachetchanged) === "1") { + formData.append('file_cachet', isimgcachetSelected); + formData.append('file_cachet_recid', isimgcachetSelected_recid); + } @@ -794,11 +801,14 @@ function UpdateParnterInfo() { //console.log('Success:', result['message'], "result['status'] = ", result['status']); setmyApiResponse(result['status']); setResult(result['message']); - if (String(result['status']) == String("true")) { + if (String(result['status']) === String("true")) { settestval(true); desablefield1(); setdatamodification(); - + getPartnerImages(); + } else if (String(result['status']) === String("Err_Connexion")) { + alert('Erreur: ' + result['message']); + history.push("/Connexion"); } }) @@ -838,15 +848,19 @@ function UpdateParnterInfo() { if (String(res.data.status) === "true") { setgetPartnerImages_api("true"); - var partner_logo_img = "data:image/png;base64," + JSON.parse(res.data.message).logo_img; - setisimgclassSelected(partner_logo_img); - setuserimgclassprofil(partner_logo_img); - setisimgclassSelected_recid(JSON.parse(res.data.message).logo_img_recid); + if (JSON.parse(res.data.message).logo_img) { + var partner_logo_img = "data:image/png;base64," + JSON.parse(res.data.message).logo_img; + setisimgclassSelected(partner_logo_img); + setuserimgclassprofil(partner_logo_img); + setisimgclassSelected_recid(JSON.parse(res.data.message).logo_img_recid); + } - var partner_cachet_img = "data:image/png;base64," + JSON.parse(res.data.message).cachet_img; - setisimgcachet(partner_cachet_img); - setisimgcachetSelected(partner_cachet_img); - setisimgcachetSelected_recid(JSON.parse(res.data.message).cachet_img_recid); + if (JSON.parse(res.data.message).cachet_img) { + var partner_cachet_img = "data:image/png;base64," + JSON.parse(res.data.message).cachet_img; + setisimgcachet(partner_cachet_img); + setisimgcachetSelected(partner_cachet_img); + setisimgcachetSelected_recid(JSON.parse(res.data.message).cachet_img_recid); + } } else if (String(res.data.status) === String("Err_Connexion")) { @@ -1269,6 +1283,110 @@ function UpdateParnterInfo() { } + + + function removeRecodedLogoImage() { + if (!isimgclassSelected_recid || String(isimgclassSelected_recid).length < 3) { + alert(" Image incorrecte. Impossible de la supprimer "); + return; + } + + var form = new FormData(); + + const stored_cookie = getCookie('tokenmysypart'); + form.append("token", stored_cookie); + form.append("image_recid", isimgclassSelected_recid); + + fetch( + process.env.REACT_APP_API_URL + "myclass/api/DeleteClassImage_v2/", + { + method: 'POST', + body: form, + } + ).then((response) => response.json()) + .then((result) => { + + console.log(' removeRecodedClassImage : status:', result['status']); + console.log('removeRecodedClassImage : Success:', result['message']); + + + if (String(result['status']) === String("true")) { + setisimgclassSelected(""); + setisimgclassSelected_recid(""); + setisimgclassSelectedfile(""); + setuserimgclassprofil(""); + getPartnerImages(); + + } + else if (String(result['status']) === String("Err_Connexion")) { + alert('Erreur: ' + result['message']); + history.push("/Connexion"); + return; + } + + else { + alert(result['message']); + } + + }) + .catch((error) => { + console.error('Error:', error); + alert(" Impossible de supprimer l'image "); + }); + + } + + function removeRecodedCachetImage() { + if (!isimgcachetSelected_recid || String(isimgcachetSelected_recid).length < 3) { + alert(" Image incorrecte. Impossible de la supprimer "); + return; + } + + var form = new FormData(); + + const stored_cookie = getCookie('tokenmysypart'); + form.append("token", stored_cookie); + form.append("image_recid", isimgcachetSelected_recid); + + fetch( + process.env.REACT_APP_API_URL + "myclass/api/DeleteClassImage_v2/", + { + method: 'POST', + body: form, + } + ).then((response) => response.json()) + .then((result) => { + + + if (String(result['status']) === String("true")) { + console.log(' removeRecodedClassImage : status:', result['status']); + console.log('removeRecodedClassImage : Success:', result['message']); + setisimgcachetSelected(""); + setisimgcachetSelected_recid(""); + setisimgcachetSelectedfile(""); + setisimgcachet(""); + getPartnerImages(); + + } + else if (String(result['status']) === String("Err_Connexion")) { + alert('Erreur: ' + result['message']); + history.push("/Connexion"); + return; + } + + else { + alert(result['message']); + } + + }) + .catch((error) => { + console.error('Error:', error); + alert(" Impossible de supprimer l'image "); + }); + + + } + const [isimgclassSaved, setisimgclassSaved] = useState(""); const [isimgclassSaved_message, setisimgclassSaved_message] = useState(""); function sendClassImage(e) { @@ -1390,745 +1508,651 @@ function UpdateParnterInfo() { const [isimgcachetSaved, setisimgcachetSaved] = useState(""); const [isimgcachetSaved_message, setisimgcachetSaved_message] = useState(""); + const [submenu, setsubmenu] = useState("submenu_donnee_entreprise"); + + async function submenu_donnee_entreprise() { + setsubmenu("submenu_donnee_entreprise"); + } + + async function submenu_donnee_facturation() { + setsubmenu("submenu_donnee_facturation"); + } + + async function submenu_donnee_securite() { + setsubmenu("submenu_donnee_securite"); + } + + async function submenu_contact() { + setsubmenu("submenu_contact"); + } + + return (
-
Données personnelles
- - - {testval == true &&
- Les données ont été mises à jour. +
+ + + +
- } - {testval == false &&
- Erreur mise à jour. -
- } + {String(submenu).trim() === "submenu_donnee_securite" &&
+ + +
} + + {String(submenu).trim() === "submenu_donnee_facturation" &&
+ +
} + + {String(submenu).trim() === "submenu_contact" &&
+ +
} - :not(style)': { m: 1 }, width: '100%', }} onChange={DataUpdated}> + {String(submenu).trim() === "submenu_donnee_entreprise" &&
- - - - ), - }} - variant="standard" - /> - - - - - ), - }} - variant="standard" - /> +
Données personnelles
- - - - - - ), - }} - variant="standard" - /> - - - - - - ), - }} - variant="standard" - /> - - - - - ), - }} - variant="standard" - /> - - -
- - - - - ), - }} - variant="standard" - /> - - - - - - ), - }} - variant="standard" - /> - - - - - - ), - }} - variant="standard" - /> -
- - - - ), - }} - variant="standard" - /> -
- - - - ), - }} - variant="standard" - /> - - - - - ), - }} - variant="standard" - /> -
- - - - ), - }} - variant="standard" - /> - -
 
-
-
Votre logo
-
-
-
- -
-
-
- {String(userformedited) === "1" && } - - {/*isimgclassSelected && */} - {isimgclassdeleted && String(isimgclassdeleted) === "1" && } - {isimgclassdeleted && String(isimgclassdeleted) === "0" && } - {isimgclassSelected && String(isimgclassSaved) === "0" && } -
- -
-
-
  • - L'image doit etre carrée. -
  • -
  • - Les formats autorisés sont : ['jpg', 'jpeg', 'png', 'jpe', 'webp'] -
  • -
  • - Les dimensions recommandées: 128pixels X 128pixels -- 144pixels X 144pixels -- 168pixels X 168pixels
    - Les dimensions maximales sont de 256pixels X 256pixels -
  • -
  • - La taille de l'image ne doit pas depasser 1 mega octet -
  • -
    - + {testval == true &&
    + Les données ont été mises à jour.
    + } -
    -
    Votre cachet
    -
    -
    -
    - -
    -
    -
    - {String(userformedited) === "1" && } - {/*isimgclassSelected && */} - {isimgcachetdeleted && String(isimgcachetdeleted) === "1" && } - {isimgcachetdeleted && String(isimgcachetdeleted) === "0" && } - {isimgcachetSelected && String(isimgcachetSaved) === "0" && } -
    - -
    -
    -
  • - L'image doit etre carrée. -
  • -
  • - Les formats autorisés sont : ['jpg', 'jpeg', 'png', 'jpe', 'webp'] -
  • -
  • - Les dimensions recommandées: 128pixels X 128pixels -- 144pixels X 144pixels -- 168pixels X 168pixels
    - Les dimensions maximales sont de 256pixels X 256pixels -
  • -
  • - La taille de l'image ne doit pas depasser 1 mega octet -
  • -
    - - -
    - -
     
    -
    Certification
    - - - - ), - }} - variant="standard" - /> - - - {qualiopi.map((option) => ( - - {option.label}  
    -
    - ))} -
    - - {datadock.map((option) => ( - - {option.label}  
    -
    - ))} -
    - - {/*} {certitrace.map((option) => ( - - {option.label}  
    -
    - ))} -
    - - {bureaucertitrace.map((option) => ( - - {option.label}  
    -
    - ))} -
    */} - - {certifvoltaire.map((option) => ( - - {option.label}  
    -
    - ))} -
    - - - -
    - - - -
     
    -
    Info Contact
    - - - - - ), - }} - variant="standard" - /> - - - - - ), - }} - variant="standard" - /> -
    - - - - ), - }} - variant="standard" - /> - - - - ), - }} - variant="standard" - /> - - - {fields1desabled == false && String(datamodification) === String("1") &&
    -
    /!\ Pensez à enregistrer les modifications
    -
    } - -
    - {fields1desabled == false &&
    -
    - -
    -
    - -
    -
    - - } - {fields1desabled == true && - - } - -
    - - -
     
    - -
    -
    Mot de passe
    - {updatepwd == false &&
    + {testval == false &&
    Erreur mise à jour.
    } - {updatepwd == true &&
    - La mise à jour été faite -
    - } - :not(style)': { m: 1 } }}> - - - - - - {currentpawdvisible ? : } - + :not(style)': { m: 1 }, width: '100%', }} onChange={DataUpdated}> + + + - } + ), + }} + + /> - /> - - - - - - - - - {newpawdvisible ? : } - + + - } + ), + }} - /> - + /> - - - - - - {confpwdvisible ? : } - + + + + + - } + ), + }} + + /> - /> - -
    - Créez un mot de passe contenant au moins : -
      -
    • - 8 caractères -
    • -
    • - 1 nombre -
    • -
    • - 1 caractère spécial p. ex., $, !, @, %, & -
    • -
    • - Identiques + + + + ), + }} + + /> + + + + + ), + }} + + /> + + + + + ), + }} + + /> + + + + + + ), + }} + + /> + + + + + + ), + }} + + /> + + + + ), + }} + + /> + + + + + ), + }} + + /> + + + + + ), + }} + + /> + + + + + ), + }} + + /> + +
       
      +
      +
      Votre logo
      +
      +
      +
      + +
      +
      +
      + {String(userformedited) === "1" && } + + {/*isimgclassSelected && */} + {isimgclassdeleted && String(isimgclassdeleted) === "1" && } + {isimgclassdeleted && String(isimgclassdeleted) === "0" && } + {isimgclassSelected && String(isimgclassSaved) === "0" && } +
      + +
      +
      +
    • + L'image doit etre carrée.
    • -
    +
  • + Les formats autorisés sont : ['jpg', 'jpeg', 'png', 'jpe', 'webp'] +
  • +
  • + Les dimensions recommandées: 128pixels X 128pixels -- 144pixels X 144pixels -- 168pixels X 168pixels
    + Les dimensions maximales sont de 256pixels X 256pixels +
  • +
  • + La taille de l'image ne doit pas depasser 1 mega octet +
  • +
    +
    -
    +
    +
    Votre cachet
    +
    +
    +
    - {pwdfieldsdesabled == false &&
    +
    +
    +
    + {String(userformedited) === "1" && } + {/*isimgclassSelected && */} + {isimgcachetdeleted && String(isimgcachetdeleted) === "1" && } + {isimgcachetdeleted && String(isimgcachetdeleted) === "0" && } + {isimgcachetSelected && String(isimgcachetSaved) === "0" && } +
    + +
    +
    +
  • + L'image doit etre carrée. +
  • +
  • + Les formats autorisés sont : ['jpg', 'jpeg', 'png', 'jpe', 'webp'] +
  • +
  • + Les dimensions recommandées: 128pixels X 128pixels -- 144pixels X 144pixels -- 168pixels X 168pixels
    + Les dimensions maximales sont de 256pixels X 256pixels +
  • +
  • + La taille de l'image ne doit pas depasser 1 mega octet +
  • +
    + + +
    + +
     
    +
    Certification
    +
    + + + + + + ), + }} + + /> + + {fields1desabled == true && String(mydatadock) !== "1" && + + + + } + + {fields1desabled == true && String(mydatadock) === "1" && + + + + } + + {fields1desabled !== true && + {qualiopi.map((option) => ( + + {option.label}  
    +
    + ))} +
    + } +
    +
    + + + + + {fields1desabled == true && String(mydatadock) !== "1" && + + + + } + + {fields1desabled == true && String(mydatadock) === "1" && + + + + } + + {fields1desabled !== true && + {datadock.map((option) => ( + + {option.label}  
    +
    + ))} +
    + } + + {fields1desabled == true && String(mycertifvoltaire) !== "1" && + + + + } + + {fields1desabled == true && String(mycertifvoltaire) === "1" && + + + + } + + + {fields1desabled !== true && + {certifvoltaire.map((option) => ( + + {option.label}  
    +
    + ))} +
    + } +
    + +
     
    +
    Info Contact
    + + + + + ), + }} + + /> + + + + + ), + }} + + /> + + + + + ), + }} + + /> + + + + ), + }} + + /> + + {fields1desabled == false && String(datamodification) === String("1") &&
    +
    /!\ Pensez à enregistrer les modifications
    +
    } + +
    + {fields1desabled == false &&
    - +
    - +
    + } - {pwdfieldsdesabled == true && - + {fields1desabled == true && + } +
    - - -
    + {/*
     
    - -
    -
    Emails contact
    - {updatemainmail === false &&
    - Erreur mise à jour. -
    - } - - {updatemainmail === true &&
    - La mise à jour été faite -
    - } - - - - - ), - }} - variant="standard" - /> -
    - - - - ), - }} - variant="standard" - /> -
    - - - - ), - }} - variant="standard" - /> -
    -   -
      -
    • -   -
    • -
    • -   -
    • -
    • -   -
    • - -
    • -   -
    • -
    -
    - {mailfieldsdesabled == false &&
    -
    - -
    -
    - -
    -
    - } - {mailfieldsdesabled == true &&
    - -
    - } - - - - -
    -
     
    - -
    -
    -
    Clé de rattachement
    - {insert_key_updated === false &&
    - Erreur mise à jour {setinsert_key_api_message} +
    +
    Mot de passe
    + {updatepwd == false &&
    + Erreur mise à jour.
    } - {insert_key_updated === true &&
    - La clé a été correctement mise à jour + {updatepwd == true &&
    + La mise à jour été faite
    } - - - :not(style)': { m: 1 } }} > + :not(style)': { m: 1 } }}> - + - {current_insert_key_visible ? : } + {currentpawdvisible ? : } + + + } + + /> + + + + + + + + + {newpawdvisible ? : } } @@ -2137,46 +2161,23 @@ function UpdateParnterInfo() { - + - {new_insert_key_visible ? : } - - - } - - /> - - - - - - - - {conf_new_insert_key_visible ? : } + {confpwdvisible ? : } } @@ -2186,49 +2187,138 @@ function UpdateParnterInfo() {
    Créez un mot de passe contenant au moins :
      -
    • +
    • 8 caractères
    • -
    • +
    • 1 nombre
    • -
    • +
    • 1 caractère spécial p. ex., $, !, @, %, &
    • -
    • +
    • Identiques
    -
    - - - {insert_keyfieldsdesabled == false &&
    +
    + {pwdfieldsdesabled == false &&
    - +
    -
    - +
    } - {insert_keyfieldsdesabled == true && - + {pwdfieldsdesabled == true && + }
    -
    -   + +
    +
    Emails contact
    + {updatemainmail === false &&
    + Erreur mise à jour. +
    + } + + {updatemainmail === true &&
    + La mise à jour été faite +
    + } + + + + + ), + }} + variant="standard" + /> +
    + + + + ), + }} + variant="standard" + /> +
    + + + + ), + }} + variant="standard" + /> +
    +   +
      +
    • +   +
    • +
    • +   +
    • +
    • +   +
    • + +
    • +   +
    • +
    +
    + {mailfieldsdesabled == false &&
    +
    + +
    +
    + +
    +
    + } + {mailfieldsdesabled == true &&
    + +
    + } + + +
    -
    +
     
    */} + + + + + +
    }
    Supppression de compte
    diff --git a/src/styles/components/_addpartnerclient.scss b/src/styles/components/_addpartnerclient.scss index bf69b58..8929e00 100644 --- a/src/styles/components/_addpartnerclient.scss +++ b/src/styles/components/_addpartnerclient.scss @@ -183,6 +183,14 @@ background-color: #104277; color: white; } + + .scroll_mysy { + overflow-y: auto; + max-height: 20rem; + overflow-y: visible; + overflow-y: scroll; + padding-right: 1rem !important; + } } @@ -191,30 +199,37 @@ margin-left: 10px !important; display: grid; height: 200px; - //grid-template: repeat(2, 1fr) / repeat(2, 1fr); grid-template-columns: auto auto auto auto; gap: 20px 10px; } .contact_grid>div { display: inline-block; - color: #444; border: 1px solid #CCC; - background: #DDD; + background: #1976d2; box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 15%); cursor: pointer; vertical-align: middle; - padding: 5px; + padding: 10px; text-align: left; + color: #fff; + border-radius: 10px; + font-size: small; + } + + .grid_title { + font-weight: bold; + font-size: small; + letter-spacing: 2px; } .contact_grid>div:hover { - box-shadow: 5px 1px 5px 1px rgb(0 0 0 / 25%); + box-shadow: 5px 1px 5px 1px rgb(0 0 0 / 50%); } .detail_activite { - + display: inline-block; color: #444; border: 1px solid #CCC; @@ -243,4 +258,8 @@ padding-left: 5px !important; padding-right: 5px !important; } + + .css-1jy569b-MuiFormLabel-root-MuiInputLabel-root { + margin-left: 0px !important; + } } \ No newline at end of file diff --git a/src/styles/components/_updateparnterinfo.scss b/src/styles/components/_updateparnterinfo.scss index cdd8d95..23035b3 100644 --- a/src/styles/components/_updateparnterinfo.scss +++ b/src/styles/components/_updateparnterinfo.scss @@ -127,6 +127,82 @@ width: 100%; text-align: center; } + + .div_row_gauche_image { + float: left; + //border:0px solid black; + border-width: 0.01rem; + border-radius: 1rem; + text-align: left; + } + + .div_row_droite_image { + float: left; + //border:0px solid black; + border-width: 0.01rem; + border-radius: 1rem; + text-align: left; + font-family: "verdana", "Quicksand", "Signika", sans-serif; + font-size: small; + padding-left: 0.2rem; + } + + .tips_img_class { + font-size: smaller; + font-style: italic; + margin-left: 1rem !important; + text-align: left; + float: left; + width: 100%; + padding-right: 10px; + } + + .img_class_logo { + display: block; + width: 128px; + height: 128px; + border-radius: 10px !important; + border: 1px solid black; + float: left; + } + + .bton_supprime_image_class { + font-size: small; + text-align: center; + margin-left: 0px; + box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 15%); + padding: 5px; + padding-left: 10px; + padding-right: 10px; + border: 1px solid rgb(194, 186, 186); + border-radius: 10px; + background: white; + color: red; + margin-top: 0.5rem; + width: 10rem; + cursor: pointer; + } + + .bton_supprime_image_class:hover { + box-shadow: 5px 1px 5px 1px rgb(0 0 0 / 25%); + } + + .bton_image_class { + font-size: small; + text-align: center; + margin-left: 0px; + box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 15%); + padding: 5px; + padding-left: 10px; + padding-right: 10px; + border: 1px solid rgb(194, 186, 186); + border-radius: 10px; + width: 10rem; + } + + .bton_image_class:hover { + box-shadow: 5px 1px 5px 1px rgb(0 0 0 / 25%); + } } @media only screen and (min-width: 601px) and (max-width: 991px) { @@ -237,7 +313,7 @@ float: left; //border:0px solid black; border-width: 0.01rem; - width: 48%; + width: 100%; border-radius: 1rem; //border-right: solid; border-radius: 0%; @@ -246,7 +322,82 @@ .div_row_droite { float: right; border-width: 0.01rem; - width: 48%; + width: 100%; + } + + .div_row_gauche_image { + float: left; + //border:0px solid black; + border-width: 0.01rem; + border-radius: 1rem; + text-align: left; + } + + .div_row_droite_image { + float: left; + //border:0px solid black; + border-width: 0.01rem; + border-radius: 1rem; + text-align: left; + font-family: "verdana", "Quicksand", "Signika", sans-serif; + font-size: small; + padding-left: 0.2rem; + } + + .tips_img_class { + font-size: small; + font-style: italic; + margin-left: 1rem !important; + text-align: left; + float: left; + width: 100%; + } + + .img_class_logo { + display: block; + width: 168px; + height: 168px; + border-radius: 10px !important; + border: 1px solid black; + float: left; + } + + .bton_supprime_image_class { + font-size: small; + text-align: center; + margin-left: 0px; + box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 15%); + padding: 5px; + padding-left: 10px; + padding-right: 10px; + border: 1px solid rgb(194, 186, 186); + border-radius: 10px; + background: white; + color: red; + margin-top: 0.5rem; + width: 15rem; + cursor: pointer; + } + + .bton_supprime_image_class:hover { + box-shadow: 5px 1px 5px 1px rgb(0 0 0 / 25%); + } + + .bton_image_class { + font-size: small; + text-align: center; + margin-left: 0px; + box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 15%); + padding: 5px; + padding-left: 10px; + padding-right: 10px; + border: 1px solid rgb(194, 186, 186); + border-radius: 10px; + width: 15rem; + } + + .bton_image_class:hover { + box-shadow: 5px 1px 5px 1px rgb(0 0 0 / 25%); } } @@ -357,7 +508,7 @@ float: left; //border:0px solid black; border-width: 0.01rem; - width: 48%; + width: 46%; border-radius: 1rem; //border-right: solid; border-radius: 0%; @@ -366,7 +517,82 @@ .div_row_droite { float: right; border-width: 0.01rem; - width: 48%; + width: 46%; + } + + .div_row_gauche_image { + float: left; + //border:0px solid black; + border-width: 0.01rem; + border-radius: 1rem; + text-align: left; + } + + .div_row_droite_image { + float: left; + //border:0px solid black; + border-width: 0.01rem; + border-radius: 1rem; + text-align: left; + font-family: "verdana", "Quicksand", "Signika", sans-serif; + font-size: small; + padding-left: 0.2rem; + } + + .tips_img_class { + font-size: small; + font-style: italic; + margin-left: 1rem !important; + text-align: left; + float: left; + width: 100%; + } + + .img_class_logo { + display: block; + width: 168px; + height: 168px; + border-radius: 10px !important; + border: 1px solid black; + float: left; + } + + .bton_supprime_image_class { + font-size: small; + text-align: center; + margin-left: 0px; + box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 15%); + padding: 5px; + padding-left: 10px; + padding-right: 10px; + border: 1px solid rgb(194, 186, 186); + border-radius: 10px; + background: white; + color: red; + margin-top: 0.5rem; + width: 15rem; + cursor: pointer; + } + + .bton_supprime_image_class:hover { + box-shadow: 5px 1px 5px 1px rgb(0 0 0 / 25%); + } + + .bton_image_class { + font-size: small; + text-align: center; + margin-left: 0px; + box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 15%); + padding: 5px; + padding-left: 10px; + padding-right: 10px; + border: 1px solid rgb(194, 186, 186); + border-radius: 10px; + width: 15rem; + } + + .bton_image_class:hover { + box-shadow: 5px 1px 5px 1px rgb(0 0 0 / 25%); } } @@ -384,6 +610,7 @@ font-family: "verdana", "Quicksand", "Signika", sans-serif; margin: 0.4rem !important; margin-top: 0px !important; + margin-bottom: 1.5rem !important; } .texte_area_adress { @@ -392,6 +619,7 @@ font-size: x-small !important; font-family: "verdana", "Quicksand", "Signika", sans-serif; margin: 0.4rem !important; + margin-bottom: 1.5rem !important; } .texte_area_passwd { @@ -400,6 +628,7 @@ font-size: x-small !important; font-family: "verdana", "Quicksand", "Signika", sans-serif; margin: 0.4rem !important; + margin-bottom: 1.5rem !important; } @@ -407,7 +636,6 @@ font-family: "Quicksand", "Signika", sans-serif; font-size: medium; text-align: center; - margin-bottom: 0.3rem; color: white; cursor: pointer; font-style: italic; @@ -415,6 +643,8 @@ font-weight: normal; float: left; width: 100%; + margin-bottom: 1.5rem; + } .semi_hr_gauche { @@ -581,6 +811,40 @@ box-shadow: 5px 1px 5px 1px rgb(0 0 0 / 25%); } + // added on 03/08/23 + .detail_submenu { + background: #d8edfc; + border-radius: 15px; + margin-right: 1rem; + padding: 0.3rem; + margin-bottom: 0.5rem; + min-width: 10rem; + text-align: center; + border: 1px solid #9cf; + color: #3b3e40; + font-family: "verdana", "Quicksand", "Signika", sans-serif; + font-size: small; + letter-spacing: 0.1rem; + font-weight: normal; + } + + + .detail_submenu:hover, + .detail_submenu:focus, + .detail_submenu:active, + .detail_submenu:checked { + background-color: #104277; + color: white; + } + + .scroll_mysy { + overflow-y: auto; + max-height: 20rem; + overflow-y: visible; + overflow-y: scroll; + padding-right: 1rem !important; + } + } .css-mnn31 {