forked from CRM_Production/JTT_CrM
Merge branch 'master' of https://codefirst.iut.uca.fr/git/CRM_Production/JTT_CrM
commit
b05a087af6
@ -0,0 +1,99 @@
|
|||||||
|
import React, {useState} from 'react';
|
||||||
|
import NavigationDashboard from '../components/NavigationDashboard';
|
||||||
|
import axios from 'axios';
|
||||||
|
import Session from 'react-session-api';
|
||||||
|
import { useNavigate } from 'react-router-dom';
|
||||||
|
|
||||||
|
const api = axios.create({
|
||||||
|
baseURL: 'http://localhost:8080'
|
||||||
|
})
|
||||||
|
|
||||||
|
const MailPourAdmin = () => {
|
||||||
|
const [mailError, setMailError] = useState(false);
|
||||||
|
const [objetError, setObjetError] = useState(false);
|
||||||
|
const [descriptionError, setDescriptionError] = useState(false);
|
||||||
|
const [theme, setTheme] = useState("light");
|
||||||
|
const navigate = useNavigate();
|
||||||
|
|
||||||
|
if (localStorage.getItem('theme') && localStorage.getItem("theme") !== '' && localStorage.getItem("theme") !== theme) {
|
||||||
|
setTheme(localStorage.getItem("theme"))
|
||||||
|
}
|
||||||
|
|
||||||
|
function sendMail(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
|
const formData = new FormData(e.currentTarget);
|
||||||
|
const values = Object.fromEntries(formData.entries());
|
||||||
|
|
||||||
|
console.log(values);
|
||||||
|
if (values.objet === '') {
|
||||||
|
setObjetError(true)
|
||||||
|
} else {
|
||||||
|
setObjetError(false)
|
||||||
|
}
|
||||||
|
if (values.raison === '') {
|
||||||
|
setDescriptionError(true)
|
||||||
|
} else {
|
||||||
|
setDescriptionError(false)
|
||||||
|
}
|
||||||
|
if (values.objet === '' || values.raison === '') {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
values.objet = values.objet + "[user id : " + Session.get("idUser") + "]"
|
||||||
|
|
||||||
|
|
||||||
|
api.post('/Mail/Avertir',values).then (function(response) {
|
||||||
|
if (response.data) {
|
||||||
|
navigate('/dashboard')
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
setMailError(true)
|
||||||
|
// e.reset();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<body className={theme}>
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="https://unicons.iconscout.com/release/v4.0.0/css/line.css"></link>
|
||||||
|
|
||||||
|
<div className="page_mailAdmin">
|
||||||
|
<div className="haut_de_page">
|
||||||
|
<h2 className="titre">Avertir un administrateur</h2>
|
||||||
|
<div className="rechLogo">
|
||||||
|
<img className="logo" srcSet="./LogoApp.svg" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="bas_de_page">
|
||||||
|
<NavigationDashboard />
|
||||||
|
<form className="form" onSubmit={sendMail}>
|
||||||
|
<div className="Mail">
|
||||||
|
<div className="object">
|
||||||
|
<p className="name">Objet</p>
|
||||||
|
<input name="objet" type="text" placeholder="Objet de l'alerte" />
|
||||||
|
</div>
|
||||||
|
<div className="value">
|
||||||
|
<p className="name">Raison</p>
|
||||||
|
<textarea name="raison" placeholder="Raison de l'alerte" rows="10" cols="180" />
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<p>{mailError === true?"Le mail n'a pas pu être envoyé":''}</p>
|
||||||
|
<p>{objetError === true?"L'objet est obligatoire":''}</p>
|
||||||
|
<p>{descriptionError === true?"La description est obligatoire":''}</p>
|
||||||
|
<div className="submit">
|
||||||
|
<button className="button" type="submit">
|
||||||
|
Envoyer
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default MailPourAdmin;
|
||||||
@ -0,0 +1,201 @@
|
|||||||
|
|
||||||
|
|
||||||
|
body {
|
||||||
|
|
||||||
|
.page_mailAdmin {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-evenly;
|
||||||
|
width: auto;
|
||||||
|
height: 100vh;
|
||||||
|
|
||||||
|
.haut_de_page {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 50px;
|
||||||
|
width: auto;
|
||||||
|
height: 10%;
|
||||||
|
align-items: center;
|
||||||
|
margin: 10px 10px 5px 10px;
|
||||||
|
|
||||||
|
background: rgba(255, 255, 255, 0.3);
|
||||||
|
border-radius: 15px;
|
||||||
|
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
|
||||||
|
backdrop-filter: blur(3px);
|
||||||
|
-webkit-backdrop-filter: blur(15px);
|
||||||
|
|
||||||
|
.titre {
|
||||||
|
font-size: 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rechLogo {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
display: flex;
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bas_de_page {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: space-between;
|
||||||
|
width: auto;
|
||||||
|
height: 86%;
|
||||||
|
|
||||||
|
.nav_bar_verticale {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
width: 5%;
|
||||||
|
margin: 5px 5px 10px 10px;
|
||||||
|
|
||||||
|
background: rgba(255, 255, 255, 0.3);
|
||||||
|
border-radius: 15px;
|
||||||
|
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
|
||||||
|
backdrop-filter: blur(3px);
|
||||||
|
-webkit-backdrop-filter: blur(15px);
|
||||||
|
|
||||||
|
.parti_one {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
height: 18%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.parti_two {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
height: 35%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.parti_three {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 15px;
|
||||||
|
width: 100%;
|
||||||
|
height: 18%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.parti_four {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
height: 18%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button {
|
||||||
|
display: flex;
|
||||||
|
object-fit: cover;
|
||||||
|
background-color: transparent;
|
||||||
|
border: none;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
.logo_nav_bar{
|
||||||
|
display: flex;
|
||||||
|
margin: 10px;
|
||||||
|
height: 50px;
|
||||||
|
width: 50px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.Mail {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-evenly;
|
||||||
|
width: 94.3%;
|
||||||
|
height: auto;
|
||||||
|
margin: 5px 10px 10px 5px;
|
||||||
|
|
||||||
|
background: rgba(255, 255, 255, 0.3);
|
||||||
|
border-radius: 15px;
|
||||||
|
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
|
||||||
|
backdrop-filter: blur(3px);
|
||||||
|
-webkit-backdrop-filter: blur(15px);
|
||||||
|
|
||||||
|
.object {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-evenly;
|
||||||
|
margin: 13px;
|
||||||
|
width: auto;
|
||||||
|
height: 40%;
|
||||||
|
|
||||||
|
background: rgba(255, 255, 255, 0.1);
|
||||||
|
border-radius: 15px;
|
||||||
|
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
|
||||||
|
backdrop-filter: blur(3px);
|
||||||
|
-webkit-backdrop-filter: blur(15px);
|
||||||
|
|
||||||
|
.input {
|
||||||
|
margin: 13px;
|
||||||
|
width: 65%;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.value {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-evenly;
|
||||||
|
margin-left: 13px;
|
||||||
|
margin-right: 13px;
|
||||||
|
width: auto;
|
||||||
|
height: 40%;
|
||||||
|
|
||||||
|
background: rgba(255, 255, 255, 0.1);
|
||||||
|
border-radius: 15px;
|
||||||
|
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
|
||||||
|
backdrop-filter: blur(3px);
|
||||||
|
-webkit-backdrop-filter: blur(15px);
|
||||||
|
|
||||||
|
.textArea {
|
||||||
|
resize: none;
|
||||||
|
margin: 13px;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.submit {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-evenly;
|
||||||
|
margin: 13px;
|
||||||
|
width: auto;
|
||||||
|
height: 15%;
|
||||||
|
|
||||||
|
background: rgba(255, 255, 255, 0.1);
|
||||||
|
border-radius: 15px;
|
||||||
|
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
|
||||||
|
backdrop-filter: blur(3px);
|
||||||
|
-webkit-backdrop-filter: blur(15px);
|
||||||
|
|
||||||
|
.button {
|
||||||
|
width: 20%;
|
||||||
|
margin: 13px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
Reference in new issue