diff --git a/public/index.html b/public/index.html
index a0de11a..2dce941 100644
--- a/public/index.html
+++ b/public/index.html
@@ -7,9 +7,7 @@
-
-
+
-
diff --git a/src/components/Article.js b/src/components/Article.js
index a46c886..589b6ed 100644
--- a/src/components/Article.js
+++ b/src/components/Article.js
@@ -42,8 +42,50 @@ import { MdDeleteForever } from "react-icons/md";
import { AddCircleOutline } from "@mui/icons-material";
import Popup from 'reactjs-popup';
import 'reactjs-popup/dist/index.css';
+import TextField from '@mui/material/TextField';
+
+import CancelPresentationIcon from '@mui/icons-material/CancelPresentation';
+import { IconButton } from '@material-ui/core';
+import { makeStyles } from "@material-ui/core/styles";
+import Paper from '@material-ui/core/Paper';
+import Draggable from 'react-draggable';
+
+function PaperComponent(props) {
+ return (
+
+
+
+ );
+}
+
+
+const useStyles = makeStyles((theme) => ({
+
+ dialog: {
+ position: 'absolute',
+ // left: 10,
+ top: 400
+ },
+
+ paper: {
+ overflowY: 'unset',
+ },
+ customizedButton: {
+ position: 'absolute',
+ left: '98%',
+ top: '-3%',
+ backgroundColor: 'lightgray',
+ color: 'gray',
+ },
+}));
+
const Article = (props) => {
+
+ const classes = useStyles();
const history = useHistory();
const [isLoading, setLoading] = useState();
@@ -106,7 +148,7 @@ const Article = (props) => {
setLoading(false);
if (String(res.data.status) === "true") {
//console.log(" In Get_Partner_Article_Avis_Data res.data.status = " + res.data.status);
- //console.log(" In Get_Partner_Article_Avis_Data res.data.message r_class = " + res.data.message);
+ // console.log(" In Get_Partner_Article_Avis_Data res.data.message r_class = " + res.data.message);
setGet_Partner_Article_Avis_Data_api("true");
setGet_Partner_Article_Avis_Data_result(res.data.message);
@@ -142,6 +184,15 @@ const Article = (props) => {
if (mylocal_document.img_path) {
setarticle_avis_img_path(mylocal_document.img_path);
+ } else {
+ setarticle_avis_img_path("");
+ }
+
+
+ if (mylocal_document.meta_description) {
+ setarticle_avis_meta_description(mylocal_document.meta_description);
+ } else {
+ setarticle_avis_meta_description("");
}
@@ -258,6 +309,7 @@ const Article = (props) => {
const [article_avis_internal_url, setarticle_avis_internal_url] = React.useState("");
const [article_avis_display_header_img, setarticle_avis_display_header_img] = React.useState(false);
const [article_avis_img_path, setarticle_avis_img_path] = React.useState("");
+ const [article_avis_meta_description, setarticle_avis_meta_description] = React.useState("");
function Add_Update_Article_Avis() {
@@ -270,6 +322,17 @@ const Article = (props) => {
form.append("qualite", "");
form.append("note", "");
+
+ if (img_img_article_file2) {
+ form.append('File', img_img_article_file2);
+ form.append('img_file_name', img_img_article_file2.name);
+ }
+ else {
+ form.append('File', "");
+ form.append('img_file_name', "");
+ }
+
+
if (!article_avis_img_path || String(article_avis_img_path).trim() === "") {
alert(" Vous devez saisir une image à afficher avec l'article ");
return;
@@ -302,8 +365,18 @@ const Article = (props) => {
form.append("user_longitude", longitude);
form.append("user_state", state);
+ // Si une balise meta description n'est pas fourni, alors on lui donne le titre
+ var local_meta_description = "";
+ if (article_avis_meta_description) {
+ local_meta_description = String(article_avis_meta_description).trim().toLocaleLowerCase().substring(0, 154);
+ } else {
+ local_meta_description = String(article_avis_title_formation).trim().toLocaleLowerCase().substring(0, 154);
+ }
+ form.append("meta_description", local_meta_description);
- //console.log(" ## form = ", form);
+
+
+ console.log(" ## form = ", form);
var myurl = "";
if (selected_id && String(selected_id).length > 3) {
@@ -378,7 +451,229 @@ const Article = (props) => {
}
+ /**** Gestion image de l'article */
+ const [logo_file_name, setlogo_file_name] = useState();
+ const hiddenFileInput_logo = React.useRef(null);
+
+ const [GetLms_Themes_img_article_Img, setGetLms_Themes_img_article_Img] = useState("");
+
+ const [handleSubmission_img_article_api, sethandleSubmission_img_article_api] = useState();
+ const [handleSubmission_img_article_result, sethandleSubmission_img_article_result] = useState();
+ const [handleSubmission_img_article_message, sethandleSubmission_img_article_message] = useState();
+
+
+ const [img_img_article_file, setimg_img_article_file] = useState();
+ const [img_bg_file, setimg_bg_file] = useState();
+
+ const [img_img_article_file2, setimg_img_article_file2] = useState();
+ const [img_bg_file2, setimg_bg_file2] = useState();
+
+ const handleSubmission_logo = event => {
+ clear_message();
+
+
+ const fileUploaded = event.target.files[0];
+ let file_size = event.target.files[0].size;
+ let file_type = event.target.files[0].type;
+
+ //console.log("file_size = ", file_size, " file_type = ", file_type);
+ //console.log(" fileUploaded = ", fileUploaded);
+ if (file_size > 1000000) {
+ alert("Le fichier ne doit pas dépasser un 1 Méga octets");
+ return;
+ }
+
+ //image/png
+ if (String(file_type) !== "image/png") {
+ alert("Le fichier n'est pas au format PNG");
+ return;
+ }
+
+ setLoading(true);
+
+ var _URL = window.URL || window.webkitURL;
+ var file, img;
+ var img_height, img_width;
+
+ if ((file = event.target.files[0])) {
+ img = new Image();
+ var objectUrl = _URL.createObjectURL(file);
+ img.onload = function () {
+ img_height = this.height;
+ img_width = this.width;
+ _URL.revokeObjectURL(objectUrl);
+ console.log(" img_width = ", img_width, " img_height = ", img_height)
+
+ if (parseFloat(img_width) > 130 && parseFloat(img_width) < 1000 &&
+ parseFloat(img_height) > 130 && parseFloat(img_height) < 1000) {
+ //console.log(" img_height est = ", img_height, " < à 1500 ");
+
+ // Verification que le nom du fichier est alpha numerique
+ /*var regExp = /^[A-Za-z0-9]+$/;
+ if (!regExp.test(event.target.files[0].name)) {
+ sethandleSubmission_img_article_message(" Le nom de l'image comporte des caractères non alphanumériques");
+ sethandleSubmission_img_article_api("false");
+ setLoading(false);
+
+ return
+ }*/
+
+
+ if (String(event.target.files[0].name).length > 50) {
+ sethandleSubmission_img_article_message(" Le nom du fichier est trop long. il doit faire moins de 50 caractère");
+ sethandleSubmission_img_article_api("false");
+ setLoading(false);
+
+ return
+ }
+
+ setlogo_file_name(event.target.files[0].name);
+ setimg_img_article_file(URL.createObjectURL(event.target.files[0]));
+ setimg_img_article_file2(event.target.files[0]);
+
+ } else {
+ sethandleSubmission_img_article_message(" La taille de l'image est incorrecte. Larg = " + String(img_width) + " px Long = " + String(img_height) + " px");
+ sethandleSubmission_img_article_api("false");
+ setLoading(false);
+ return;
+ }
+
+ //console.log(" after img_width = ", img_width, " after img_height = ", img_height)
+ };
+ img.src = objectUrl;
+
+ }
+ setLoading(false);
+ };
+
+ function clear_message() {
+ sethandleSubmission_img_article_message();
+ sethandleSubmission_img_article_api();
+ }
+
+
+ const [Send_img_article_Img_api, setSend_img_article_Img_api] = useState();
+ const [Send_img_article_Img_result, setSend_img_article_Img_result] = useState();
+ const [Send_img_article_Img_message, setSend_img_article_Img_message] = useState();
+ function Send_img_article_Img() {
+ clear_message();
+ setLoading(true);
+ const formData = new FormData();
+ formData.append('File', img_img_article_file2);
+ //formData.append('token', 'K3cw63eKokKSbV4spjQ48SUNnfy80yrXfA');
+ const stored_cookie = getCookie('tokenmysypart');
+ formData.append("token", stored_cookie);
+
+ console.log(" ## le nom du fichier est : ", img_img_article_file2.name);
+
+ fetch(
+ process.env.REACT_APP_API_URL + "myclass/api/Blog_Img_Store_Article_Image/",
+ {
+ method: 'POST',
+ body: formData,
+ }
+ )
+ .then((response) => response.json())
+ .then((result) => {
+ //console.log('Success:', result['message']);
+
+ if (String(result['status']) === String("true")) {
+ setSend_img_article_Img_api("true");
+ alert(" La mise à jour du logo a été correctement effectuée. ");
+
+ } else if (String(result['status']) === String("Err_Connexion")) {
+ alert('Erreur: ' + result['message']);
+ history.push("/Connexion");
+ }
+
+ else {
+ setSend_img_article_Img_api("false");
+ setSend_img_article_Img_message(result['message']);
+ }
+ setLoading(false);
+
+ })
+ .catch((error) => {
+ console.error('Error:', error);
+ setSend_img_article_Img_api("false");
+
+ setLoading(false);
+ });
+
+ }
+
+
+ const [Delete_img_article_Img_api, setDelete_img_article_Img_api] = useState();
+ const [Delete_img_article_Img_result, setDelete_img_article_Img_result] = useState();
+ const [Delete_img_article_Img_message, setDelete_img_article_Img_message] = useState();
+ function Delete_img_article_Img() {
+ clear_message();
+
+
+ setLoading(true);
+
+
+ const formData = new FormData();
+
+ //formData.append('token', 'K3cw63eKokKSbV4spjQ48SUNnfy80yrXfA');
+ const stored_cookie = getCookie('tokenmysypart');
+ formData.append("token", stored_cookie);
+
+
+ fetch(
+ process.env.REACT_APP_API_URL + "myclass/api/Lms_Delete_img_article_File/",
+ {
+ method: 'POST',
+ body: formData,
+ }
+ )
+ .then((response) => response.json())
+ .then((result) => {
+ //console.log('Success:', result['message']);
+
+ if (String(result['status']) === String("true")) {
+ setDelete_img_article_Img_api("true");
+ setGetLms_Themes_img_article_Img('');
+ alert(" Le logo a été correctement supprimé ");
+
+ } else if (String(result['status']) === String("Err_Connexion")) {
+ alert('Erreur: ' + result['message']);
+ history.push("/Connexion");
+ }
+
+ else {
+ setDelete_img_article_Img_api("false");
+ setDelete_img_article_Img_message(result['message']);
+ }
+ setLoading(false);
+
+ })
+ .catch((error) => {
+ console.error('Error:', error);
+ setDelete_img_article_Img_api("false");
+ setDelete_img_article_Img_message(" Impossible de supprimer le fichier logo");
+ setLoading(false);
+ });
+
+ }
+
+ const changeHandler2_logo = (event) => {
+ clear_message();
+ hiddenFileInput_logo.current.click();
+ };
+
+ function Annule_img_article_img() {
+ clear_message();
+ setimg_img_article_file();
+ setimg_img_article_file2();
+ sethandleSubmission_img_article_message();
+ setSend_img_article_Img_api();
+ setSend_img_article_Img_message();
+ setlogo_file_name();
+ }
+
+ /***** Fin gestion de l'image de l'article */
return (
@@ -388,8 +683,30 @@ const Article = (props) => {
{/*** GESTION article */}