modal_sign_working_but_not_ok
This commit is contained in:
Pascal
parent
8aa1099eb5
commit
d3198fbdd6
@ -1518,4 +1518,103 @@ input[type="file"] {
|
||||
.sign-button:disabled {
|
||||
background-color: #cccccc;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.modal-document {
|
||||
background: white;
|
||||
border-radius: 8px;
|
||||
max-width: 800px;
|
||||
width: 90%;
|
||||
max-height: 75vh;
|
||||
overflow-y: auto;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.document-details {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.info-section {
|
||||
margin: 20px 0;
|
||||
background: #f8f9fa;
|
||||
padding: 15px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.info-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.label {
|
||||
font-weight: bold;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.description-section {
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
.signatures-section {
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
.signature-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 8px;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
.signature-item.signed {
|
||||
background-color: #e8f5e9;
|
||||
}
|
||||
|
||||
.signature-item.pending {
|
||||
background-color: #fff3e0;
|
||||
}
|
||||
|
||||
.files-section {
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
.file-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 8px;
|
||||
background: #f8f9fa;
|
||||
margin-bottom: 5px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.file-icon {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.download-link {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.confirmation-section {
|
||||
margin-top: 30px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.warning-text {
|
||||
color: #f44336;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.sign-confirm-btn {
|
||||
background-color: #4CAF50;
|
||||
color: white;
|
||||
padding: 10px 20px;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.sign-confirm-btn:hover {
|
||||
background-color: #45a049;
|
||||
}
|
||||
@ -14,6 +14,7 @@ declare global {
|
||||
submitNewDocument: typeof submitNewDocument;
|
||||
submitCommonDocument: typeof submitCommonDocument;
|
||||
signDocument: typeof signDocument;
|
||||
confirmSignature: typeof confirmSignature;
|
||||
}
|
||||
}
|
||||
|
||||
@ -586,9 +587,9 @@ function showProcessDetails(group: Group, groupId: number) {
|
||||
<div class="signature-item ${sig.signed ? 'signed' : 'pending'}">
|
||||
<span class="signer-name">${sig.member.name}</span>
|
||||
<span class="signature-status">
|
||||
${sig.signed ?
|
||||
`✓ Signed on ${sig.signedAt ? new Date(sig.signedAt).toLocaleDateString() : 'Unknown date'}` :
|
||||
'⌛ Pending'}
|
||||
${sig.signed ?
|
||||
`✓ Signé le ${sig.signedAt ? new Date(sig.signedAt).toLocaleDateString() : 'date inconnue'}` :
|
||||
'⌛ En attente'}
|
||||
</span>
|
||||
</div>
|
||||
`).join('')}
|
||||
@ -657,8 +658,8 @@ function showProcessDetails(group: Group, groupId: number) {
|
||||
<span class="signer-name">${sig.member.name}</span>
|
||||
<span class="signature-status">
|
||||
${sig.signed ?
|
||||
`✓ Signed on ${sig.signedAt ? new Date(sig.signedAt).toLocaleDateString() : 'Unknown date'}` :
|
||||
' Pending'}
|
||||
`✓ Signé le ${sig.signedAt ? new Date(sig.signedAt).toLocaleDateString() : 'date inconnue'}` :
|
||||
'⌛ En attente'}
|
||||
</span>
|
||||
</div>
|
||||
`).join('')}
|
||||
@ -819,8 +820,8 @@ function showRoleDocuments(role: {
|
||||
<span class="signer-name">${sig.member.name}</span>
|
||||
<span class="signature-status">
|
||||
${sig.signed ?
|
||||
`✓ Signed on ${sig.signedAt ? new Date(sig.signedAt).toLocaleDateString() : 'Unknown date'}` :
|
||||
'⌛ Pending'}
|
||||
`✓ Signé le ${sig.signedAt ? new Date(sig.signedAt).toLocaleDateString() : 'date inconnue'}` :
|
||||
'⌛ En attente'}
|
||||
</span>
|
||||
</div>
|
||||
`).join('')}
|
||||
@ -1462,6 +1463,122 @@ interface SignatureResponse {
|
||||
|
||||
// Ajouter cette fonction pour signer un document
|
||||
function signDocument(documentId: number, processId: number, isCommonDocument: boolean = false) {
|
||||
if (typeof window === 'undefined' || typeof document === 'undefined') {
|
||||
console.error('Cette fonction ne peut être exécutée que dans un navigateur');
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const groups = JSON.parse(localStorage.getItem('groups') || JSON.stringify(groupsMock));
|
||||
const group = groups.find((g: Group) => g.id === processId);
|
||||
|
||||
if (!group) {
|
||||
throw new Error('Processus non trouvé');
|
||||
}
|
||||
|
||||
let targetDoc;
|
||||
if (isCommonDocument) {
|
||||
targetDoc = group.commonDocuments.find((d: any) => d.id === documentId);
|
||||
} else {
|
||||
for (const role of group.roles) {
|
||||
if (role.documents) {
|
||||
targetDoc = role.documents.find((d: any) => d.id === documentId);
|
||||
if (targetDoc) break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (!targetDoc) {
|
||||
throw new Error('Document non trouvé');
|
||||
}
|
||||
|
||||
// Créer et insérer la modal directement dans le body
|
||||
const modalHtml = `
|
||||
<div class="modal-overlay" id="signatureModal">
|
||||
<div class="modal-document">
|
||||
<div class="modal-content-document">
|
||||
<div class="details-header">
|
||||
<h2>Signature du document</h2>
|
||||
<button class="close-btn" onclick="closeModal(this)">×</button>
|
||||
</div>
|
||||
|
||||
<div class="document-details">
|
||||
<h3>${targetDoc.name}</h3>
|
||||
|
||||
<div class="info-section">
|
||||
<div class="info-row">
|
||||
<span class="label">Créé le:</span>
|
||||
<span class="value">${new Date(targetDoc.createdAt).toLocaleDateString()}</span>
|
||||
</div>
|
||||
<div class="info-row">
|
||||
<span class="label">Date limite:</span>
|
||||
<span class="value">${new Date(targetDoc.deadline).toLocaleDateString()}</span>
|
||||
</div>
|
||||
<div class="info-row">
|
||||
<span class="label">Visibilité:</span>
|
||||
<span class="value">${targetDoc.visibility}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="description-section">
|
||||
<h4>Description:</h4>
|
||||
<p>${targetDoc.description || 'Aucune description disponible'}</p>
|
||||
</div>
|
||||
|
||||
<div class="signatures-section">
|
||||
<h4>État des signatures:</h4>
|
||||
<div class="signatures-list">
|
||||
${targetDoc.signatures.map((sig: DocumentSignature) => `
|
||||
<div class="signature-item ${sig.signed ? 'signed' : 'pending'}">
|
||||
<span class="signer-name">${sig.member.name}</span>
|
||||
<span class="signature-status">
|
||||
${sig.signed ?
|
||||
`✓ Signé le ${sig.signedAt ? new Date(sig.signedAt).toLocaleDateString() : 'date inconnue'}` :
|
||||
'⌛ En attente'}
|
||||
</span>
|
||||
</div>
|
||||
`).join('')}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
${targetDoc.files ? `
|
||||
<div class="files-section">
|
||||
<h4>Fichiers joints:</h4>
|
||||
<div class="files-list">
|
||||
${targetDoc.files.map((file: any) => `
|
||||
<div class="file-item">
|
||||
<span class="file-icon"></span>
|
||||
<span class="file-name">${file.name}</span>
|
||||
<a href="${file.url}" class="download-link" download>
|
||||
<span class="download-icon">⬇️</span>
|
||||
</a>
|
||||
</div>
|
||||
`).join('') || 'Aucun fichier joint'}
|
||||
</div>
|
||||
</div>
|
||||
` : ''}
|
||||
|
||||
<div class="confirmation-section">
|
||||
<p class="warning-text">En signant ce document, vous confirmez avoir pris connaissance de son contenu.</p>
|
||||
<button class="sign-confirm-btn" onclick="confirmSignature(${documentId}, ${processId}, ${isCommonDocument})">
|
||||
Signer le document
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>`;
|
||||
|
||||
document.body.insertAdjacentHTML('beforeend', modalHtml);
|
||||
|
||||
} catch (error) {
|
||||
console.error('Erreur lors de l\'affichage de la modal:', error);
|
||||
showAlert(error instanceof Error ? error.message : 'Erreur lors de l\'affichage de la modal');
|
||||
}
|
||||
}
|
||||
|
||||
// Nouvelle fonction pour confirmer la signature
|
||||
function confirmSignature(documentId: number, processId: number, isCommonDocument: boolean) {
|
||||
try {
|
||||
const groups = JSON.parse(localStorage.getItem('groups') || JSON.stringify(groupsMock));
|
||||
const group = groups.find((g: Group) => g.id === processId);
|
||||
@ -1471,20 +1588,13 @@ function signDocument(documentId: number, processId: number, isCommonDocument: b
|
||||
}
|
||||
|
||||
let document;
|
||||
let documentList;
|
||||
|
||||
if (isCommonDocument) {
|
||||
documentList = group.commonDocuments;
|
||||
document = group.commonDocuments.find((d: any) => d.id === documentId);
|
||||
} else {
|
||||
// Chercher dans les documents des rôles
|
||||
for (const role of group.roles) {
|
||||
if (role.documents) {
|
||||
document = role.documents.find((d: any) => d.id === documentId);
|
||||
if (document) {
|
||||
documentList = role.documents;
|
||||
break;
|
||||
}
|
||||
if (document) break;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1493,7 +1603,6 @@ function signDocument(documentId: number, processId: number, isCommonDocument: b
|
||||
throw new Error('Document non trouvé');
|
||||
}
|
||||
|
||||
// Trouver la signature correspondant à l'utilisateur courant
|
||||
const userSignature = document.signatures.find((sig: DocumentSignature) =>
|
||||
sig.member.name === currentUser.name
|
||||
);
|
||||
@ -1502,18 +1611,13 @@ function signDocument(documentId: number, processId: number, isCommonDocument: b
|
||||
throw new Error('Signature non trouvée pour cet utilisateur');
|
||||
}
|
||||
|
||||
if (userSignature.signed) {
|
||||
throw new Error('Document déjà signé par cet utilisateur');
|
||||
}
|
||||
|
||||
// Mettre à jour la signature
|
||||
userSignature.signed = true;
|
||||
userSignature.signedAt = new Date().toISOString();
|
||||
|
||||
// Sauvegarder les modifications
|
||||
localStorage.setItem('groups', JSON.stringify(groups));
|
||||
|
||||
// Rafraîchir l'affichage
|
||||
closeModal(document.querySelector('.close-btn'));
|
||||
|
||||
if (isCommonDocument) {
|
||||
showProcessDetails(group, processId);
|
||||
} else {
|
||||
@ -1524,48 +1628,18 @@ function signDocument(documentId: number, processId: number, isCommonDocument: b
|
||||
}
|
||||
|
||||
showAlert('Document signé avec succès!');
|
||||
return {
|
||||
success: true,
|
||||
message: 'Document signé avec succès',
|
||||
documentId,
|
||||
memberId: currentUser.id,
|
||||
signedAt: userSignature.signedAt
|
||||
};
|
||||
|
||||
} catch (error) {
|
||||
console.error('Erreur lors de la signature:', error);
|
||||
showAlert(error instanceof Error ? error.message : 'Erreur lors de la signature');
|
||||
return {
|
||||
success: false,
|
||||
message: error instanceof Error ? error.message : 'Erreur lors de la signature',
|
||||
documentId,
|
||||
memberId: currentUser.id,
|
||||
signedAt: ''
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
// Modifier la fonction qui génère les cartes de documents pour ajouter le bouton de signature
|
||||
function generateDocumentCard(document: any, isCommonDocument: boolean = false) {
|
||||
// ... code existant de la carte ...
|
||||
|
||||
// Ajouter le bouton de signature si l'utilisateur n'a pas encore signé
|
||||
const userSignature = document.signatures?.find((sig: DocumentSignature) =>
|
||||
sig.member?.name === currentUser?.name
|
||||
);
|
||||
|
||||
const signatureButton = !userSignature?.signed ? `
|
||||
<button class="sign-button" onclick="signDocument('${document.id}', '${document.processId}', ${isCommonDocument})">
|
||||
Signer le document
|
||||
</button>
|
||||
` : '';
|
||||
return `
|
||||
<div class="document-card ${document.visibility}">
|
||||
// ... reste du code de la carte ...
|
||||
${signatureButton}
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
// Ajouter la fonction au scope global
|
||||
window.confirmSignature = confirmSignature;
|
||||
window.signDocument = signDocument;
|
||||
|
||||
// S'assurer que la fonction est disponible globalement
|
||||
if (typeof window !== 'undefined') {
|
||||
(window as any).signDocument = signDocument;
|
||||
(window as any).confirmSignature = confirmSignature;
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user