button_signature
This commit is contained in:
Pascal
parent
a190221e32
commit
8aa1099eb5
@ -1499,4 +1499,23 @@ input[type="file"] {
|
||||
z-index: 1000;
|
||||
display: none;
|
||||
animation: slideDown 0.3s ease-out;
|
||||
}
|
||||
|
||||
.sign-button {
|
||||
background-color: #4CAF50;
|
||||
color: white;
|
||||
padding: 8px 16px;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.sign-button:hover {
|
||||
background-color: #45a049;
|
||||
}
|
||||
|
||||
.sign-button:disabled {
|
||||
background-color: #cccccc;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
@ -13,6 +13,7 @@ declare global {
|
||||
submitDocumentRequest: typeof submitDocumentRequest;
|
||||
submitNewDocument: typeof submitNewDocument;
|
||||
submitCommonDocument: typeof submitCommonDocument;
|
||||
signDocument: typeof signDocument;
|
||||
}
|
||||
}
|
||||
|
||||
@ -28,7 +29,15 @@ import {
|
||||
} from '../../models/signature.models';
|
||||
import { messageStore } from '../../utils/messageMock';
|
||||
import { showAlert } from '../account/account';
|
||||
let currentUser = membersMock[0];
|
||||
|
||||
interface Member {
|
||||
id: string | number;
|
||||
name: string;
|
||||
email?: string;
|
||||
avatar?: string;
|
||||
}
|
||||
|
||||
let currentUser: Member = membersMock[0];
|
||||
|
||||
interface Group {
|
||||
id: number;
|
||||
@ -546,19 +555,19 @@ function showProcessDetails(group: Group, groupId: number) {
|
||||
<div class="details-section">
|
||||
<h3>Documents Communs</h3>
|
||||
<div class="documents-grid">
|
||||
${displayGroup.commonDocuments.map((document: {
|
||||
signatures?: DocumentSignature[];
|
||||
name: string;
|
||||
visibility: string;
|
||||
createdAt?: string | null;
|
||||
deadline?: string | null;
|
||||
id: number;
|
||||
}) => {
|
||||
${displayGroup.commonDocuments.map((document: any) => {
|
||||
const totalSignatures = document.signatures?.length || 0;
|
||||
const signedCount = document.signatures?.filter((sig: DocumentSignature) => sig.signed).length || 0;
|
||||
const percentage = totalSignatures > 0 ? (signedCount / totalSignatures) * 100 : 0;
|
||||
const isVierge = !document.createdAt || !document.deadline || !document.signatures?.length;
|
||||
|
||||
// Ajouter le bouton de signature pour tous les documents non vierges en mode dev
|
||||
const signButton = !isVierge ? `
|
||||
<button class="sign-button" onclick="signDocument(${document.id}, ${groupId}, true)">
|
||||
Signer le document
|
||||
</button>
|
||||
` : '';
|
||||
|
||||
return `
|
||||
<div class="document-card ${document.visibility} ${isVierge ? 'vierge' : ''}">
|
||||
<div class="document-header">
|
||||
@ -600,6 +609,7 @@ function showProcessDetails(group: Group, groupId: number) {
|
||||
documentName: '${document.name}'
|
||||
})">New request</button>
|
||||
`}
|
||||
${signButton}
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
@ -614,14 +624,16 @@ function showProcessDetails(group: Group, groupId: number) {
|
||||
<div class="documents-grid">
|
||||
${(role.documents || []).length > 0 ?
|
||||
(role.documents || []).map(document => {
|
||||
const totalSignatures = document.signatures.length;
|
||||
const signedCount = document.signatures.filter((sig: DocumentSignature) => sig.signed).length;
|
||||
const percentage = totalSignatures > 0 ? (signedCount / totalSignatures) * 100 : 0;
|
||||
|
||||
// Détection d'un document vierge
|
||||
const isVierge = !document.createdAt ||
|
||||
!document.deadline ||
|
||||
document.signatures.length === 0;
|
||||
!document.deadline ||
|
||||
document.signatures.length === 0;
|
||||
|
||||
// Ajouter le bouton de signature pour tous les documents non vierges en mode dev
|
||||
const signButton = !isVierge ? `
|
||||
<button class="sign-button" onclick="signDocument(${document.id}, ${groupId}, false)">
|
||||
Signer le document
|
||||
</button>
|
||||
` : '';
|
||||
|
||||
return `
|
||||
<div class="document-card ${document.visibility} ${isVierge ? 'vierge' : ''}">
|
||||
@ -652,11 +664,12 @@ function showProcessDetails(group: Group, groupId: number) {
|
||||
`).join('')}
|
||||
</div>
|
||||
<div class="progress-bar">
|
||||
<div class="progress" style="width: ${percentage}%;"></div>
|
||||
<div class="progress" style="width: ${document.signatures.filter((sig: DocumentSignature) => sig.signed).length / document.signatures.length * 100}%;"></div>
|
||||
</div>
|
||||
<p>${signedCount} out of ${totalSignatures} signed (${percentage.toFixed(0)}%)</p>
|
||||
<p>${document.signatures.filter((sig: DocumentSignature) => sig.signed).length} out of ${document.signatures.length} signed (${(document.signatures.filter((sig: DocumentSignature) => sig.signed).length / document.signatures.length * 100).toFixed(0)}%)</p>
|
||||
</div>
|
||||
` : ''}
|
||||
${signButton}
|
||||
</div>
|
||||
`;
|
||||
}).join('')
|
||||
@ -1437,3 +1450,122 @@ export function initSignature() {
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Ajouter cette interface pour la signature
|
||||
interface SignatureResponse {
|
||||
success: boolean;
|
||||
message: string;
|
||||
documentId: number;
|
||||
memberId: string | number;
|
||||
signedAt: string;
|
||||
}
|
||||
|
||||
// Ajouter cette fonction pour signer un document
|
||||
function signDocument(documentId: number, processId: number, isCommonDocument: boolean = false) {
|
||||
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 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) {
|
||||
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
|
||||
);
|
||||
|
||||
if (!userSignature) {
|
||||
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
|
||||
if (isCommonDocument) {
|
||||
showProcessDetails(group, processId);
|
||||
} else {
|
||||
const role = group.roles.find((r: any) => r.documents?.includes(document));
|
||||
if (role) {
|
||||
showRoleDocuments(role, group);
|
||||
}
|
||||
}
|
||||
|
||||
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.signDocument = signDocument;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user