12/06/2024 - 21h30

recette2
cherif 2024-06-12 21:27:36 +02:00
parent 07a0041059
commit 45c73645f4
11 changed files with 3750 additions and 26 deletions

25
package-lock.json generated
View File

@ -164,6 +164,7 @@
"state-pool": "^0.6.0", "state-pool": "^0.6.0",
"styled-components": "^5.3.5", "styled-components": "^5.3.5",
"swr": "^1.2.1", "swr": "^1.2.1",
"tinymce": "^7.1.2",
"use-global-state": "^0.1.2", "use-global-state": "^0.1.2",
"victory": "^36.6.6", "victory": "^36.6.6",
"video-react": "^0.15.0", "video-react": "^0.15.0",
@ -7009,6 +7010,11 @@
"react-dom": "^18.0.0 || ^17.0.1 || ^16.7.0" "react-dom": "^18.0.0 || ^17.0.1 || ^16.7.0"
} }
}, },
"node_modules/@tinymce/tinymce-react/node_modules/tinymce": {
"version": "6.8.3",
"resolved": "https://registry.npmjs.org/tinymce/-/tinymce-6.8.3.tgz",
"integrity": "sha512-3fCHKAeqT+xNwBVESf6iDbDV0VNwZNmfrkx9c/6Gz5iB8piMfaO6s7FvoiTrj1hf1gVbfyLTnz1DooI6DhgINQ=="
},
"node_modules/@tootallnate/once": { "node_modules/@tootallnate/once": {
"version": "1.1.2", "version": "1.1.2",
"resolved": "https://registry.npmjs.org/@tootallnate/once/-/once-1.1.2.tgz", "resolved": "https://registry.npmjs.org/@tootallnate/once/-/once-1.1.2.tgz",
@ -31194,9 +31200,9 @@
"integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==" "integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA=="
}, },
"node_modules/tinymce": { "node_modules/tinymce": {
"version": "6.3.1", "version": "7.1.2",
"resolved": "https://registry.npmjs.org/tinymce/-/tinymce-6.3.1.tgz", "resolved": "https://registry.npmjs.org/tinymce/-/tinymce-7.1.2.tgz",
"integrity": "sha512-+oCwXuTxAdJXVJ0130OxQz0JDNsqg3deuzgeUo8X5Vb27EzCJgXwO5eWvCxvkxpQo4oiHMVlM4tUIpTUHufHGQ==" "integrity": "sha512-I/M5WRyEJjwIhyIv6FhkvZS1mWNbb0sIEvDkP8akBnuV1X78mkNhi6Kz9FBBbHzy61U3pmXgzyCSaDZfdQbCSg=="
}, },
"node_modules/tmpl": { "node_modules/tmpl": {
"version": "1.0.5", "version": "1.0.5",
@ -38677,6 +38683,13 @@
"requires": { "requires": {
"prop-types": "^15.6.2", "prop-types": "^15.6.2",
"tinymce": "^6.0.0 || ^5.5.1" "tinymce": "^6.0.0 || ^5.5.1"
},
"dependencies": {
"tinymce": {
"version": "6.8.3",
"resolved": "https://registry.npmjs.org/tinymce/-/tinymce-6.8.3.tgz",
"integrity": "sha512-3fCHKAeqT+xNwBVESf6iDbDV0VNwZNmfrkx9c/6Gz5iB8piMfaO6s7FvoiTrj1hf1gVbfyLTnz1DooI6DhgINQ=="
}
} }
}, },
"@tootallnate/once": { "@tootallnate/once": {
@ -57169,9 +57182,9 @@
"integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==" "integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA=="
}, },
"tinymce": { "tinymce": {
"version": "6.3.1", "version": "7.1.2",
"resolved": "https://registry.npmjs.org/tinymce/-/tinymce-6.3.1.tgz", "resolved": "https://registry.npmjs.org/tinymce/-/tinymce-7.1.2.tgz",
"integrity": "sha512-+oCwXuTxAdJXVJ0130OxQz0JDNsqg3deuzgeUo8X5Vb27EzCJgXwO5eWvCxvkxpQo4oiHMVlM4tUIpTUHufHGQ==" "integrity": "sha512-I/M5WRyEJjwIhyIv6FhkvZS1mWNbb0sIEvDkP8akBnuV1X78mkNhi6Kz9FBBbHzy61U3pmXgzyCSaDZfdQbCSg=="
}, },
"tmpl": { "tmpl": {
"version": "1.0.5", "version": "1.0.5",

View File

@ -159,6 +159,7 @@
"state-pool": "^0.6.0", "state-pool": "^0.6.0",
"styled-components": "^5.3.5", "styled-components": "^5.3.5",
"swr": "^1.2.1", "swr": "^1.2.1",
"tinymce": "^7.1.2",
"use-global-state": "^0.1.2", "use-global-state": "^0.1.2",
"victory": "^36.6.6", "victory": "^36.6.6",
"video-react": "^0.15.0", "video-react": "^0.15.0",

View File

@ -35,7 +35,11 @@
src="https://www.googletagmanager.com/gtag/js?id=UA-37423053-2" src="https://www.googletagmanager.com/gtag/js?id=UA-37423053-2"
></script> ></script>
<script src="https://js.stripe.com/v3/"></script> <script src="https://js.stripe.com/v3/"></script>
<script src="https://cdn.tiny.cloud/1/1e3z9qnqh8jrw2xowh8c3zo8edc333zy5jdt7albegzcv752/tinymce/6/tinymce.min.js" referrerpolicy="origin"></script> <!-- <script src="https://cdn.tiny.cloud/1/1e3z9qnqh8jrw2xowh8c3zo8edc333zy5jdt7albegzcv752/tinymce/6/tinymce.min.js" referrerpolicy="origin"></script> -->
<script src="tinymce/js/tinymce/tinymce.min.js"></script>
<script> <script>
window.dataLayer = window.dataLayer || []; window.dataLayer = window.dataLayer || [];
function gtag() { function gtag() {

View File

@ -49,7 +49,7 @@ import ESign from "./pages/eSigne";
import ESignDiplayDignedDocument from "./pages/edigndiplaydigneddocument"; import ESignDiplayDignedDocument from "./pages/edigndiplaydigneddocument";
import SurveyDocument from "./pages/surveydocument"; import SurveyDocument from "./pages/surveydocument";
import UpdateAttendeeList from "./pages/updateattendeelist"; import UpdateAttendeeList from "./pages/updateattendeelist";
import Emarge_QR_Code from "./pages/emarge_qr_code";
import AutomaticQuotation from "./pages/automaticquotation"; import AutomaticQuotation from "./pages/automaticquotation";
import Maintenance from "./pages/maintenance_page" import Maintenance from "./pages/maintenance_page"
@ -130,6 +130,9 @@ function App() {
<Route path="/OrderConfirmation_3DS/:orderid/:packs" exact component={OrderConfirmation_3DS} /> <Route path="/OrderConfirmation_3DS/:orderid/:packs" exact component={OrderConfirmation_3DS} />
<Route path="/page-inconnue/" exact component={NotFound} /> <Route path="/page-inconnue/" exact component={NotFound} />
<Route path="/formation-inconnue/" exact component={Training_Inactive_Or_Not_Found} /> <Route path="/formation-inconnue/" exact component={Training_Inactive_Or_Not_Found} />
<Route path="/qr_emargement/:session_id/:partner_owner_recid/:my_safe_token" exact component={Emarge_QR_Code} />
<Route path="/E_Signature/:document_id" exact component={ESign} /> <Route path="/E_Signature/:document_id" exact component={ESign} />
<Route path="/E_Document/:document_id/:partner_owner_recid/:secret_key_signature" exact component={ESignDiplayDignedDocument} /> <Route path="/E_Document/:document_id/:partner_owner_recid/:secret_key_signature" exact component={ESignDiplayDignedDocument} />

View File

@ -3084,7 +3084,6 @@ const DisplayPartnerSession = (props) => {
function GetSelectedRows_PreInsc_Ids() { function GetSelectedRows_PreInsc_Ids() {
var tab_tmp = [] var tab_tmp = []
for (var i = 0; i < selectionModel_preinsc.length; i++) { for (var i = 0; i < selectionModel_preinsc.length; i++) {
//console.log(" ### selectionModel_insc[i] = ", selectionModel_insc[i]); //console.log(" ### selectionModel_insc[i] = ", selectionModel_insc[i]);
@ -3204,7 +3203,27 @@ const DisplayPartnerSession = (props) => {
setDialog_FACTURATION_FORMATION_open(true); setDialog_FACTURATION_FORMATION_open(true);
} else { } else if (String(actionmass_insc_val) === "emarg_qr_code") {
var liste_formation = GetSelectedRows_Insc_Ids();
var tab_inscrit = [];
for (var i = 0; i < liste_formation.length; i++) {
var line = JSON.parse(rowss_insc[liste_formation[i]]);
tab_inscrit.push(line._id)
}
setSelectionModel_insc([]);
setactionmass_insc_val();
Export_QR_CODE_Emargement(tab_inscrit);
}
else {
var liste_formation = GetSelectedRows_Insc_Ids(); var liste_formation = GetSelectedRows_Insc_Ids();
for (var i = 0; i < liste_formation.length; i++) { for (var i = 0; i < liste_formation.length; i++) {
@ -8802,6 +8821,7 @@ const DisplayPartnerSession = (props) => {
const New_Option_Emargement_Masse = [ const New_Option_Emargement_Masse = [
{ "id": "demande emargement", "label": "Envoyer demande émargement", "value": "demande emargement" }, { "id": "demande emargement", "label": "Envoyer demande émargement", "value": "demande emargement" },
{ "id": "emarg_qr_code", "label": "Emargement QR CODE", "value": "emarg_qr_code" },
] ]
@ -8843,6 +8863,21 @@ const DisplayPartnerSession = (props) => {
if (String(actionmass_emarg_val) === "demande emargement") { if (String(actionmass_emarg_val) === "demande emargement") {
ActionMassListEmargement(); ActionMassListEmargement();
} }
else if (String(actionmass_emarg_val) === "emarg_qr_code") {
var tab_emargement = [];
for (var i = 0; i < liste_formation.length; i++) {
var line = JSON.parse(rowss_emarg[liste_formation[i]]);
tab_emargement.push(line._id)
}
Export_QR_CODE_Emargement(tab_emargement);
}
setSelectionModel_emarg([]); setSelectionModel_emarg([]);
setactionmass_emarg_val(); setactionmass_emarg_val();
@ -10022,6 +10057,7 @@ const DisplayPartnerSession = (props) => {
{ "id": "impression", "label": "Imprimer fiches", "value": "impression" }, { "id": "impression", "label": "Imprimer fiches", "value": "impression" },
{ "id": "annule inscription", "label": "Annuler inscription", "value": "annule inscription" }, { "id": "annule inscription", "label": "Annuler inscription", "value": "annule inscription" },
{ "id": "facturer", "label": "Facturer", "value": "facturer" }, { "id": "facturer", "label": "Facturer", "value": "facturer" },
] ]
const New_Option_PreInscription = [ const New_Option_PreInscription = [
@ -10669,6 +10705,35 @@ const DisplayPartnerSession = (props) => {
const [planification_ecrase_existing_seq, setplanification_ecrase_existing_seq] = useState("1"); const [planification_ecrase_existing_seq, setplanification_ecrase_existing_seq] = useState("1");
function Export_QR_CODE_Emargement(tab_ids_emargement) {
const stored_cookie = getCookie('tokenmysypart');
var nom_fichier_cmd = "Emargement_QR_Code.png";
var url = process.env.REACT_APP_API_URL + "myclass/api/Create_Emargement_QR_Code_From_Inscription/" + stored_cookie + "/" + selected_session_id + "/" + tab_ids_emargement;
setLoading(true);
axios.get(url, { responseType: 'blob', },)
.then((res) => {
setLoading(false);
//console.log(" In Export_Dashbord_to_CSV res.data = " + res.data);
if (String(res.data) === String("false")) {
alert("Impossible de générer le QR code (2) ");
} else {
fileDownload(res.data, nom_fichier_cmd)
}
}).catch((error) => {
setLoading(false);
console.error('Error:', error);
alert(" Impossible de générer le QR code ")
});
setLoading(false);
}
return ( return (
<div className="displaypartnersession"> <div className="displaypartnersession">
@ -16977,7 +17042,7 @@ const DisplayPartnerSession = (props) => {
onChange={(event, value) => { onChange={(event, value) => {
if (value && value.value) { if (value && value.value) {
if (String(value.value) === "confirmation" || String(value.value) === "impression" || String(value.value) === "annule inscription" || if (String(value.value) === "confirmation" || String(value.value) === "impression" || String(value.value) === "annule inscription" ||
String(value.value) === "facturer") { String(value.value) === "facturer" || String(value.value) === "emarg_qr_code") {
setactionmass_insc_val(value.value); setactionmass_insc_val(value.value);
} }
else { else {
@ -18461,7 +18526,7 @@ const DisplayPartnerSession = (props) => {
options={New_Option_Emargement_Masse} options={New_Option_Emargement_Masse}
onChange={(event, value) => { onChange={(event, value) => {
if (value && value.value) { if (value && value.value) {
if (String(value.value) === "demande emargement") { if ( String(value.value) === "demande emargement" || String(value.value) === "emarg_qr_code") {
setactionmass_emarg_val(value.value); setactionmass_emarg_val(value.value);
@ -18481,14 +18546,7 @@ const DisplayPartnerSession = (props) => {
} }
/> />
{/*<select &nbsp;
id={"actionmassemarg"} name={"actionmassemarg"}
onChange={actionmass_emarg}
className="action_mass">
<option selected value="n/a">Choisir une action</option>
<option value="demande emargement">Demande emargement</option>
</select>*/} &nbsp;
{actionmass_emarg_val && String(actionmass_emarg_val).length > 1 && {actionmass_emarg_val && String(actionmass_emarg_val).length > 1 &&
<Popup <Popup
@ -18513,6 +18571,10 @@ const DisplayPartnerSession = (props) => {
{String(actionmass_emarg_val) === "demande emargement" && <font> {String(actionmass_emarg_val) === "demande emargement" && <font>
Confirmer l'envoi de <b> {selectionModel_emarg.length} </b> demande(s) d'émargement. Confirmer l'envoi de <b> {selectionModel_emarg.length} </b> demande(s) d'émargement.
</font>} </font>}
{String(actionmass_emarg_val) === "emarg_qr_code" && <font>
Confirmer la génération d'un QR Code pour l'émargement pour <b> {selectionModel_emarg.length} </b> ligne(s) .
</font>}
</div> </div>
<div className="gest_actions"> <div className="gest_actions">
<div style={{ "width": "45%", "float": "left" }}> <div style={{ "width": "45%", "float": "left" }}>

View File

@ -0,0 +1,850 @@
import React, { useRef, useState, useEffect } from "react";
import TextField from '@mui/material/TextField';
import MenuItem from '@mui/material/MenuItem';
import 'react-confirm-alert/src/react-confirm-alert.css'; // Import css
import Button from '@mui/material/Button';
import axios from "axios";
import { getCookie, setCookie } from 'react-use-cookie';
import { useHistory } from "react-router-dom";
import CheckOut from "./CheckOut";
import { DataGrid, GridToolbar, frFR } from '@mui/x-data-grid';
import "react-draft-wysiwyg/dist/react-draft-wysiwyg.css";
import { Editor } from '@tinymce/tinymce-react';
import parse from 'html-react-parser';
import { FcViewDetails, FcDisapprove } from "react-icons/fc";
import 'react-tooltip/dist/react-tooltip.css'
import { Tooltip } from 'react-tooltip'
import add_plus from "../mysy_img/plus.png";
import excel_icone from "../mysy_img/excel_icone.png";
import participants from "../mysy_img/participants.png";
import fileDownload from 'js-file-download'
import Autocomplete from '@mui/material/Autocomplete';
import Popup from 'reactjs-popup';
import 'reactjs-popup/dist/index.css';
import img_loading_spin from "./../mysy_img/mysy_spin_loading.gif";
import { FcCancel, FcApproval, FcAcceptDatabase, FcPrint } from "react-icons/fc";
import DatePicker from "react-datepicker";
import "react-datepicker/dist/react-datepicker.css";
import { format } from 'date-fns'
import moment from "moment";
import InputAdornment from '@mui/material/InputAdornment';
import { AiFillCloseCircle } from "react-icons/ai";
import Box from '@mui/material/Box';
import { Typography, LinearProgress } from '@mui/material';
import styled from 'styled-components';
import { CiTrash } from "react-icons/ci";
import { MdAddCircleOutline, MdRemoveCircleOutline } from "react-icons/md";
import Dialog from '@mui/material/Dialog';
import DialogActions from '@mui/material/DialogActions';
import DialogContent from '@mui/material/DialogContent';
import DialogContentText from '@mui/material/DialogContentText';
import DialogTitle from '@mui/material/DialogTitle';
import { TransitionProps } from '@mui/material/transitions';
import { IoAddCircleOutline, IoCloseCircleOutline } from "react-icons/io5";
import { useParams } from 'react-router-dom'
import Header from "./Header";
import Footer from "./Fotter";
import { FcInfo } from "react-icons/fc";
import { Document, Page } from 'react-pdf'
import { gridClasses } from '@mui/x-data-grid';
import Link from '@mui/material/Link';
import { PiDotsThree } from "react-icons/pi";
function Emarge_QR_Code() {
const history = useHistory();
const { session_id, partner_owner_recid, my_safe_token } = useParams();
const [isLoading, setLoading] = useState();
const [selected_emargement_id, setselected_emargement_id] = useState("");
const [get_E_Document_PDF, setget_E_Document_PDF] = useState();
const [selected_e_doc_id, setselected_e_doc_id] = useState();
const [selected_e_doc_email, setselected_e_doc_email] = useState();
const [selected_e_doc_secret, setselected_e_doc_secret] = useState();
const [is_valide_e_document, setis_valide_e_document] = useState(false);
function ExpandableCell_50({ value }) {
const [expanded, setExpanded] = React.useState(false);
return (
<nav>
{value && <div style={{ paddingLeft: "5px", paddingRight: "15px", "display": "block", wordBreak: "break-all" }}>
{expanded ? value : String(value).slice(0, 50)}&nbsp;
{value.length > 50 && (
// eslint-disable-next-line jsx-a11y/anchor-is-valid
<Link
type="button"
component="button"
sx={{ fontSize: 'inherit' }}
onClick={() => setExpanded(!expanded)}
>
{expanded ? <nav> <PiDotsThree />Réduire</nav> : <nav> <PiDotsThree />Voir</nav>}
</Link>
)}
</div>}
{!value && <div style={{ paddingLeft: "5px", paddingRight: "15px", "display": "block", wordBreak: "break-all" }}>
&nbsp;
</div>
}
</nav>
);
}
function Display_Colunm_text({ value }) {
return (
<div style={{ paddingLeft: "5px", paddingRight: "10px", "display": "block", wordBreak: "break-all" }}>
{value}&nbsp;
</div>
);
}
const columns_sequence = [
{ field: 'id', headerName: 'id', hide: true },
{ field: '_id', headerName: '_id', hide: true },
{ field: 'session_id', headerName: 'session_id', hide: true },
{ field: 'class_title', headerName: 'Formation', minWidth: 200, minWidth: 200, flex: 1, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{ field: 'code_session', headerName: 'Session', minWidth: 200, minWidth: 200, flex: 1, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{ field: 'sequence_start', headerName: 'Du', minWidth: 100, minWidth: 200, flex: 1, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{ field: 'sequence_end', headerName: 'Au', minWidth: 100, minWidth: 200, flex: 1, renderCell: (params) => <ExpandableCell_50 {...params} />, },
]
const [selectionModel_sequence, setselectionModel_sequence] = React.useState([]);
const [New_Emargement_Data, setNew_Emargement_Data] = useState([]);
const [get_E_Document_api, setget_E_Document_api] = useState();
const [get_E_Document_message, setget_E_Document_message] = useState();
const [get_E_Document_result, setget_E_Document_result] = useState();
function get_E_Document() {
var myurl = process.env.REACT_APP_API_URL + "myclass/api/Check_Emargement_QR_Code_From_Inscription_No_Token/";
var form = new FormData();
const stored_cookie = getCookie('tokenmysypart');
form.append("partner_owner_recid", partner_owner_recid);
form.append("my_safe_token", my_safe_token);
form.append("session_id", session_id);
form.append("user_email", user_email);
setLoading(true);
axios.post(myurl, form).then(res => {
setLoading(false);
//console.log(" get_E_Document : In test res.data.status = " + res.data.status);
console.log(" get_E_Document: res.data.message.img = " + res.data.message);
if (String(res.data.status) === "true") {
setget_E_Document_api("true");
setis_valide_e_document(true);
setget_E_Document_result(res.data.message);
var new_data2 = [];
const new_data = res.data.message.map((x) => {
//---
var localid = JSON.parse(x).id;
var local_id = JSON.parse(x)._id;
var local_sequence_start = JSON.parse(x).sequence_start;
var local_sequence_end = JSON.parse(x).sequence_end;
var local_email = JSON.parse(x).email;
var local_class_title = JSON.parse(x).class_title;
var local_code_session = JSON.parse(x).code_session;
//---
var node = {
"_id": local_id,
"id": localid,
"label": local_email + " " + local_sequence_start + " " + local_sequence_end,
"sequence_start": local_sequence_start,
"sequence_end": local_sequence_end,
"email": local_email,
"class_title": local_class_title,
"code_session": local_code_session,
};
new_data2.push(node);
});
if (new_data2.length > 0)
setNew_Emargement_Data(new_data2);
setDialog_1_open(false);
}
else if (String(res.data.status) === String("Err_Connexion")) {
alert('Erreur: ' + res.data.message);
history.push("/Connexion");
return;
}
else {
setget_E_Document_api("false");
seterreur_recup_e_doc(res.data.message);
get_E_Document_message(res.data.message)
alert(res.data.message);
}
}).catch((error) => {
setLoading(false);
console.warn('get_E_Document ee: Not good man :( = ', error);
setget_E_Document_api("false");
get_E_Document_message(" Impossible de recuperer le E-Document")
})
}
function GetSelectedRows_Emarg_Ids() {
var tab_tmp = []
for (var i = 0; i < selectionModel_sequence.length; i++) {
var myid = parseInt(String(selectionModel_sequence[i]));
//var line = JSON.parse(rowss[myid]);
tab_tmp.push(myid);
}
return tab_tmp;
}
const [Signature_E_Document_api, setSignature_E_Document_api] = useState();
const [Signature_E_Document_message, setSignature_E_Document_message] = useState();
const [Signature_E_Document_result, setSignature_E_Document_result] = useState();
function Signature_E_Document(local_option) {
var myurl = process.env.REACT_APP_API_URL + "myclass/api/Update_Emargement_QR_Code_From_Inscription_No_Token/";
var liste_formation = GetSelectedRows_Emarg_Ids();
var tab_emargement = [];
for (var i = 0; i < liste_formation.length; i++) {
var line = JSON.parse(get_E_Document_result[liste_formation[i]]);
tab_emargement.push(line._id)
}
var form = new FormData();
const stored_cookie = getCookie('tokenmysypart');
form.append("partner_owner_recid", partner_owner_recid);
form.append("my_safe_token", my_safe_token);
form.append("tab_emargement_ids", tab_emargement);
form.append("is_present", local_option);
if (isimgclassSelectedfile)
form.append('signature_img', isimgclassSelected);
else
form.append('signature_img', "");
//console.log(" isimgclassSelected #### = ", isimgclassSelected);
setLoading(true);
axios.post(myurl, form).then(res => {
setLoading(false);
//console.log(" Signature_E_Document : In test res.data.status = " + res.data.status);
// console.log(" Signature_E_Document: res.data.message.img = " + res.data.message);
if (String(res.data.status) === "true") {
setSignature_E_Document_api("true");
//setDialog_Message_open(true);
// alert(" Le document a été correctement signé");
}
else if (String(res.data.status) === String("Err_Connexion")) {
alert('Erreur: ' + res.data.message);
history.push("/Connexion");
return;
}
else {
setSignature_E_Document_api("false");
Signature_E_Document_message(res.data.message);
seterreur_recup_e_doc(res.data.message);
alert(res.data.message);
}
}).catch((error) => {
setLoading(false);
console.warn('Signature_E_Document ee: Not good man :( = ', error);
setSignature_E_Document_api("false");
Signature_E_Document_message(" Impossible de signer le E-Document")
})
}
useEffect(() => {
// setselected_e_doc_id(document_id);
// get_E_Document();
window.scrollTo({
top: 0,
behavior: "smooth",
});
}, [])
const [user_nom, setuser_nom] = React.useState("");
const [user_prenom, setuser_prenom] = React.useState("");
const [user_email, setuser_email] = React.useState("");
const [erreur_recup_e_doc, seterreur_recup_e_doc] = React.useState();
const [Dialog_1_message, setDialog_1_message] = React.useState(false);
const [Dialog_1_open, setDialog_1_open] = React.useState(true);
function Dialog_1_handle_change_participant_session(message) {
setDialog_1_message(message);
setDialog_1_open(true);
}
const Dialog_1_handleClose = () => {
//alert(" Utiliser le bouton 'fermer' ");
//setOpen(false);
};
const Dialog_1_handleClose_buton = () => {
setDialog_1_open(false);
history.push("/");
};
const [Dialog_Message_message, setDialog_Message_message] = React.useState(false);
const [Dialog_Message_open, setDialog_Message_open] = React.useState(false);
function Dialog_Message_handle_change_participant_session(message) {
setDialog_Message_message(message);
setDialog_Message_open(true);
}
const Dialog_Message_handleClose = () => {
//alert(" Utiliser le bouton 'fermer' ");
//setOpen(false);
};
const Dialog_Message_handleClose_buton = () => {
setDialog_Message_open(false);
history.push("/");
};
const [Dialog_SIGN_VALIDATION_open, setDialog_SIGN_VALIDATION_open] = React.useState(false);
const Dialog_SIGN_VALIDATION_handleClose = () => {
//alert(" Utiliser le bouton 'fermer' ");
//setOpen(false);
};
const Dialog_SIGN_VALIDATION_handleClose_buton = () => {
setDialog_SIGN_VALIDATION_open(false);
history.push("/");
};
const [isimgclassSelected, setisimgclassSelected] = useState(false);
const [isimgclassSelected_recid, setisimgclassSelected_recid] = useState("");
const [isimgclassSelectedfile, setisimgclassSelectedfile] = useState(false);
const [userimgclassprofil, setuserimgclassprofil] = useState();
const [userimgclassprofilchanged, setuserimgclassprofilchanged] = useState("");
const imglogoclasschangeHandler = (event) => {
let file_size = event.target.files[0].size;
//or if you like to have name and type
//console.log(event.target.files);
let file_name = event.target.files[0].name;
let file_type = event.target.files[0].type;
//alert("file_size = "+file_size+" file_type = "+file_type+" a = "+a);
if (file_size > 1000000) {
alert("L'image ne doit pas dépasser un 1 Méga octets");
return;
}
setisimgclassSelected(event.target.files[0]);
setisimgclassSelectedfile(true);
setuserimgclassprofil(URL.createObjectURL(event.target.files[0]));
setuserimgclassprofilchanged("1");
};
const [isimgclassSaved, setisimgclassSaved] = useState("");
const [isimgclassSaved_message, setisimgclassSaved_message] = useState("");
return (
<div className="emarge_qr_code">
{/* POUR SIGNATURE E-DOCUMENT */}
<Dialog
open={Dialog_SIGN_VALIDATION_open}
onClose={Dialog_SIGN_VALIDATION_handleClose}
className="esign"
>
{!erreur_recup_e_doc && <DialogTitle>Signature </DialogTitle>}
{erreur_recup_e_doc && <DialogTitle>Signature - <font color="red"> Identifiants invalides </font></DialogTitle>}
<DialogContent className="DialogContent_width">
<div className="div_row_dialog">
<div className="session_caract_Dialog" > <b> Email </b>
<TextField
autoFocus
margin="dense"
id="new_login"
//label="Prix Unitaire"
fullWidth
//variant="standard"
value={selected_e_doc_email}
onChange={(e) => {
setselected_e_doc_email(e.target.value);
}
}
/>
</div>
</div>
<div className="div_row_dialog">
<div className="session_caract_Dialog" > <b>Clé de signature </b>
<TextField
autoFocus
margin="dense"
id="secrete_key"
//label="Prix Unitaire"
fullWidth
//variant="standard"
value={selected_e_doc_secret}
onChange={(e) => {
setselected_e_doc_secret(e.target.value);
}
}
/>
</div>
</div>
</DialogContent>
<DialogActions>
<div className="div_row">
<div className="div_row_gauche">
<Button onClick={Signature_E_Document} className="bton_enreg_dialog">Valider &nbsp;</Button>
</div>
<div className="div_row_droite" style={{ "textAlign": 'center' }}>
<Button onClick={Dialog_SIGN_VALIDATION_handleClose_buton} className="bton_annule_dialog" >Annuler</Button>
</div>
</div>
</DialogActions>
</Dialog>
{/* FIN POUR SIGNATURE E-DOCUMENT */}
{/* POUR OUVERTURE E-DOCUMENT */}
<Dialog
open={Dialog_1_open}
onClose={Dialog_1_handleClose}
className="esign"
>
{!erreur_recup_e_doc && <DialogTitle>Authentification </DialogTitle>}
{erreur_recup_e_doc && <DialogTitle>Authentification - <font color="red"> Identifiants invalides </font></DialogTitle>}
<DialogContent className="DialogContent_width">
<div className="div_row_dialog">
<div className="session_caract_Dialog" > <b>Email </b>
<TextField
autoFocus
margin="dense"
id="new_login"
//label="Prix Unitaire"
fullWidth
//variant="standard"
value={user_email}
onChange={(e) => {
setuser_email(e.target.value);
}
}
/>
</div>
</div>
<div className="div_row_dialog">
<div className="session_caract_Dialog" > <b> Télephone </b>
<TextField
autoFocus
margin="dense"
id="secrete_key"
//label="Prix Unitaire"
fullWidth
//variant="standard"
value={selected_e_doc_secret}
onChange={(e) => {
setselected_e_doc_secret(e.target.value);
}
}
/>
</div>
</div>
</DialogContent>
<DialogActions>
<div className="div_row">
<div className="div_row_gauche">
<Button onClick={get_E_Document} className="bton_enreg_dialog">Afficher</Button>
</div>
<div className="div_row_droite" style={{ "textAlign": 'center' }}>
<Button onClick={Dialog_1_handleClose_buton} className="bton_annule_dialog" >Annuler</Button>
</div>
</div>
</DialogActions>
</Dialog>
{/* FIN POUR OUVERTURE E-DOCUMENT */}
<Dialog
open={Dialog_Message_open}
onClose={Dialog_Message_handleClose}
className="esign"
>
<DialogTitle>Information </DialogTitle>
<DialogContent className="DialogContent_width">
<div className="div_row_dialog">
Le document a été signée. Vous allez recevoir le document par email
</div>
</DialogContent>
<DialogActions>
<div className="div_row">
<div className="div_row_gauche">
&nbsp;
</div>
<div className="div_row_droite" style={{ "textAlign": 'center' }}>
<Button onClick={Dialog_Message_handleClose_buton} className="bton_enreg_dialog"> Fermer &nbsp;</Button>
</div>
</div>
</DialogActions>
</Dialog>
{isLoading && <div className="loader-container">
<div className="mysy_spinner"> <img src={img_loading_spin} /> </div>
</div>}
<Header />
<h3> Emargement électronique </h3>
<div className="div_row">
<div className="block_guide_line" >
<br />
<nav style={{ "fontSize": "2rem", "marginBottom": "1rem", "fontWeight": "700" }}> Guide d'utilisation : </nav><br />
<nav>Pour vous permettre de signer électroniquement vos documents, MySy Training Technology met à disposition ce module. </nav>
<nav style={{ "fontSize": "2rem", "marginBottom": "1rem", "marginTop": "1rem", "fontWeight": "700" }}> Comment ça marche : </nav>
<nav style={{ "fontSize": "16px", "marginBottom": "0.8rem" }}> étape 1 Vous accédez au document à laide votre adresse email et de la clé douverture </nav>
<nav style={{ "fontSize": "16px", "marginBottom": "0.8rem" }}> étape 2 Apres louverture du document vous recevez par email un code de validation de la signature</nav>
<nav style={{ "fontSize": "16px", "marginBottom": "0.8rem" }}> étape 3 Signez le document à laide de votre adresse email du code de validation de la signature</nav>
<nav style={{ "fontSize": "16px", "marginBottom": "0.8rem" }}> étape 4 Vous recevez par email la version pdf le document signé</nav>
</div>
<div className="block_data" >
{is_valide_e_document &&
<div className="div_row">
<div style={{ width: "80%", "marginLeft": "auto", "marginRight": "auto" }}>
<div className="div_row">
<div className="session_data">
{New_Emargement_Data && New_Emargement_Data.length > 0 && <div style={{ height: 550, width: '100%', paddingRight: '1px' }}>
&nbsp;
<Box
sx={{
height: "500px",
width: '100%',
paddingRight: '2px',
'& .line--statut--selected': {
backgroundColor: '#FBF2EF',
color: 'black',
}, [`& .${gridClasses.cell}`]: {
py: 1,
},
}}
>
<DataGrid
checkboxSelection={true}
disableRowSelectionOnClick
disableSelectionOnClick
onSelectionModelChange={(newSelectionModel) => {
setselectionModel_sequence(newSelectionModel);
}}
selectionModel={selectionModel_sequence}
localeText={frFR.components.MuiDataGrid.defaultProps.localeText}
rows={New_Emargement_Data.map((item, index) => (
{
id: index,
_id: (item)._id,
sequence_start: (item).sequence_start,
sequence_end: (item).sequence_end,
session_id: (item).session_id,
class_title: (item).class_title,
code_session: (item).code_session,
}
))}
columns={columns_sequence}
pageSize={10}
className="datagridclass"
onRowDoubleClick={(newSelectionModel) => {
}}
rowsPerPageOptions={[10]}
//disableSelectionOnClick
components={{
Toolbar: GridToolbar,
}}
//sx={datagridSx}
getCellClassName={(params) => {
}}
getRowClassName={(params) => {
}}
/>
</Box>
</div>}
</div>
</div>
</div>
<div className="div_row">
&nbsp;
</div>
<div style={{ width: "80%", "marginLeft": "auto", "marginRight": "auto" }}>
<div className="div_row" style={{ "border": "None", "color": "orange", "textAlign": "center" }}>
<div className="div_row">
<div className="div_row_bis" style={{ "marginBottom": "10px", "marginTop": "1rem" }} >
<div className="div_row_gauche_image">
<img class="img_class_logo" src={userimgclassprofil} /><br />
</div>
<div className="div_row_droite_image">
<input type="file" id="files_img_class" accept="image/*" onChange={imglogoclasschangeHandler} style={{ opacity: "0", zIndex: "-1", maxWidth: "5px", maxHeight: "0px" }} /><br />
{<nav>
<label for="files_img_class" className="bton_image_class">Charger une signature</label><br />
{String(userimgclassprofilchanged) === "1" &&
<nav className="bton_supprime_image_class" onClick={(e) => {
setuserimgclassprofil("");
setuserimgclassprofilchanged("");
}}>Supprimer la signature<br /> </nav>
}
<div className="div_row_bis tips_img_class">
<li>
L'image doit etre carrée.
</li>
<li>
Les formats autorisés sont : <i>['jpg', 'jpeg', 'png', 'jpe', 'webp']</i>
</li>
<li>
La taille de l'image ne doit pas dépasser 1 mega octet
</li>
</div>
</nav>}
{isimgclassSelected && String(isimgclassSaved) === "0" && <nav className="koUpdateData"> {isimgclassSaved_message}</nav>}
</div>
</div>
</div>
</div>
</div>
<div className="div_row">
&nbsp;
</div>
<div style={{ width: "80%", "marginLeft": "auto", "marginRight": "auto" }}>
<div className="div_row" style={{ "border": "None", "color": "orange", "textAlign": "center" }}>
<div className="div_row_gauche" style={{ "textAlign": 'left', 'marginLeft': '15px' }}>
<Button variant="contained" className="bton_enreg" onClick={(e) => {
Signature_E_Document(1);
}}>J'etais présent
</Button>
<Popup
trigger={
<Button variant="contained" className="bton_enreg" onClick={(e) => {
}}>J'etais présent
</Button>
}
modal
nested
position="center center"
>
{close => (
<div>
<button className="gest_close" onClick={close}>
&times;
</button>
<div className="gest_header"> MySy Information </div>
<div className="gest_content">
{' '}
En confirmant cette opération, vous validez votre présence aux {selectionModel_sequence.length} séquence(s) <br />
</div>
<div className="gest_actions">
<div style={{ "width": "45%", "float": "left" }}>
<button className="gest_bton_popup" onClick={(event) => {
Signature_E_Document(1);
close();
}}
> Valider </button>
</div>
<div style={{ "width": "45%", "float": "right" }}>
<button
className="gest_bton_popup"
onClick={() => {
//console.log('modal closed ');
close();
}}
>
Annuler
</button>
</div>
</div>
</div>
)}
</Popup>
</div>
<div className="div_row_droite" style={{ "textAlign": 'right', 'marginRight': '15px' }} >
<Button variant="contained" className="bton_annule" onClick={(e) => {
Signature_E_Document(0);
}}>J'etais Absent
</Button>
</div>
</div>
</div>
</div>}
{!is_valide_e_document && <div style={{ height: "40vh" }}>
&nbsp;
</div>}
</div>
</div>
<div className="div_row">
&nbsp;
</div>
<div className="pieddepage">
<Footer />
</div>
</div>
);
}
export default Emarge_QR_Code;

View File

@ -15,6 +15,7 @@ import { useHistory } from "react-router-dom";
import { Calendar, dateFnsLocalizer } from 'react-big-calendar' import { Calendar, dateFnsLocalizer } from 'react-big-calendar'
import format from 'date-fns/format' import format from 'date-fns/format'
import Link from '@mui/material/Link';
import parse from 'date-fns/parse' import parse from 'date-fns/parse'
import startOfWeek from 'date-fns/startOfWeek' import startOfWeek from 'date-fns/startOfWeek'
import getDay from 'date-fns/getDay' import getDay from 'date-fns/getDay'
@ -67,6 +68,11 @@ const TestUrl_New = (props) => {
const [field_programme, setfield_programme] = useState(""); const [field_programme, setfield_programme] = useState("");
const [editor_tochange, seteditor_tochange] = useState(""); const [editor_tochange, seteditor_tochange] = useState("");
const editorRef_description = useRef(null);
const [editorRef_description_limite, seteditorRef_description_limite] = useState(5000);
const [field_description, setfield_description] = useState("");
function editor_keyup() { function editor_keyup() {
seteditor_tochange("1"); seteditor_tochange("1");
} }
@ -576,8 +582,12 @@ const TestUrl_New = (props) => {
<title>testurl_new</title> <title>testurl_new</title>
<meta name="description" content="{this.metaDetails.description}" /> <meta name="description" content="{this.metaDetails.description}" />
<meta name="keywords" content="{this.metaDetails.keywords}" /> <meta name="keywords" content="{this.metaDetails.keywords}" />
</Helmet> </Helmet>
<Header /> <Header />
<Dialog <Dialog
@ -619,6 +629,33 @@ const TestUrl_New = (props) => {
</Draggable> </Draggable>
<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'
],
content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:14px; }'
}}
/>
<h2> Module attestation </h2> <h2> Module attestation </h2>

View File

@ -0,0 +1,17 @@
import Link from "next/link";
import Navigation from "../components/Navigation";
import Emarge_QR_Code from "../components/Emarge_QR_Code";
export default function emarge_qr_code() {
return (
<div>
<Navigation />
<div>
<Emarge_QR_Code />
</div>
</div>
);
}

File diff suppressed because it is too large Load Diff

View File

@ -116,3 +116,4 @@
@import "./components/moduleselectionevaluationapprenants"; @import "./components/moduleselectionevaluationapprenants";
@import "./components/groupe_apprenant"; @import "./components/groupe_apprenant";
@import "./components/moduleselectionapprenants"; @import "./components/moduleselectionapprenants";
@import "./components/emarge_qr_code";