all_doc_view_ok

public/style/signature.css

@@ -804,7 +804,7 @@ body {
     align-items: center;
     background-color: #f8f9fa;
     padding: 5px 20px;
-    border-radius: 8px 8px 0 0;
+    border-radius:20px;
 }
 
 .header-buttons {
@@ -1169,6 +1169,7 @@ body {
     width: 100%;
     border-radius: 20px;
     padding: 10px 0;
+    padding-left: 10px;
     resize: none;
 
 }
@@ -1483,3 +1484,19 @@ input[type="file"] {
     margin-left: auto;
     opacity: 0.6;
 }
+
+/* Style pour la popup d'alerte */
+.alert-popup {
+    position: fixed;
+    top: 20px;
+    left: 50%;
+    transform: translateX(-50%);
+    background-color: #f44336;
+    color: white;
+    padding: 15px 25px;
+    border-radius: 4px;
+    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
+    z-index: 1000;
+    display: none;
+    animation: slideDown 0.3s ease-out;
+}

src/mocks/mock-signature/groupsMock.js

@@ -39,6 +39,68 @@ export const groupsMock = [
         id: 1,
         name: "Processus 1",
         description: "Description du processus 1",
+        commonDocuments: [
+            {
+                id: 101,
+                name: "Règlement intérieur",
+                description: "Document vierge pour le règlement intérieur",
+                visibility: VISIBILITY_LEVELS.PUBLIC,
+                status: DOCUMENT_STATUS.DRAFT,
+                createdAt: null,
+                deadline: null,
+                signatures: []
+            },
+            {
+                id: 102,
+                name: "Charte de confidentialité",
+                description: "Document vierge pour la charte de confidentialité",
+                visibility: VISIBILITY_LEVELS.CONFIDENTIAL,
+                status: DOCUMENT_STATUS.DRAFT,
+                createdAt: null,
+                deadline: null,
+                signatures: []
+            },
+            {
+                id: 103,
+                name: "Procédures générales",
+                description: "Document vierge pour les procédures générales",
+                visibility: VISIBILITY_LEVELS.PUBLIC,
+                status: DOCUMENT_STATUS.DRAFT,
+                createdAt: null,
+                deadline: null,
+                signatures: []
+            },
+            {
+                id: 104,
+                name: "Plan d'urgence",
+                description: "Document vierge pour le plan d'urgence",
+                visibility: VISIBILITY_LEVELS.PRIVATE,
+                status: DOCUMENT_STATUS.DRAFT,
+                createdAt: null,
+                deadline: null,
+                signatures: []
+            },
+            {
+                id: 105,
+                name: "Plan d'urgence",
+                description: "Document vierge pour le plan d'urgence",
+                visibility: VISIBILITY_LEVELS.PRIVATE,
+                status: DOCUMENT_STATUS.DRAFT,
+                createdAt: null,
+                deadline: null,
+                signatures: []
+            },
+            {
+                id: 106,
+                name: "Plan d'urgence",
+                description: "Document vierge pour le plan d'urgence",
+                visibility: VISIBILITY_LEVELS.PRIVATE,
+                status: DOCUMENT_STATUS.DRAFT,
+                createdAt: null,
+                deadline: null,
+                signatures: []
+            }
+        ],
         roles: [
             {
                 name: "User",
@@ -157,6 +219,58 @@ export const groupsMock = [
         id: 2,
         name: "Processus 2",
         description: "Description du processus 2",
+        commonDocuments: [
+            {
+                id: 201,
+                name: "Règlement intérieur",
+                description: "Document vierge pour le règlement intérieur",
+                visibility: VISIBILITY_LEVELS.PUBLIC,
+                status: DOCUMENT_STATUS.DRAFT,
+                createdAt: null,
+                deadline: null,
+                signatures: []
+            },
+            {
+                id: 202,
+                name: "Charte de confidentialité",
+                description: "Document vierge pour la charte de confidentialité",
+                visibility: VISIBILITY_LEVELS.CONFIDENTIAL,
+                status: DOCUMENT_STATUS.DRAFT,
+                createdAt: null,
+                deadline: null,
+                signatures: []
+            },
+            {
+                id: 203,
+                name: "Charte de confidentialité",
+                description: "Document vierge pour la charte de confidentialité",
+                visibility: VISIBILITY_LEVELS.PRIVATE,
+                status: DOCUMENT_STATUS.DRAFT,
+                createdAt: null,
+                deadline: null,
+                signatures: []
+            },
+            {
+                id: 204,
+                name: "Charte de confidentialité",
+                description: "Document vierge pour la charte de confidentialité",
+                visibility: VISIBILITY_LEVELS.PRIVATE,
+                status: DOCUMENT_STATUS.DRAFT,
+                createdAt: null,
+                deadline: null,
+                signatures: []
+            },
+            {
+                id: 205,
+                name: "Charte de confidentialité",
+                description: "Document vierge pour la charte de confidentialité",
+                visibility: VISIBILITY_LEVELS.PRIVATE,
+                status: DOCUMENT_STATUS.DRAFT,
+                createdAt: null,
+                deadline: null,
+                signatures: []
+            }
+        ],
         roles: [
             {
                 name: "Artefact",
@@ -206,6 +320,38 @@ export const groupsMock = [
         id: 3,
         name: "Processus 3",
         description: "Description du processus 3",
+        commonDocuments: [
+            {
+                id: 301,
+                name: "Règlement intérieur",
+                description: "Document vierge pour le règlement intérieur",
+                visibility: VISIBILITY_LEVELS.PUBLIC,
+                status: DOCUMENT_STATUS.DRAFT,
+                createdAt: null,
+                deadline: null,
+                signatures: []
+            },
+            {
+                id: 302,
+                name: "Charte de confidentialité",
+                description: "Document vierge pour la charte de confidentialité",
+                visibility: VISIBILITY_LEVELS.CONFIDENTIAL,
+                status: DOCUMENT_STATUS.DRAFT,
+                createdAt: null,
+                deadline: null,
+                signatures: []
+            },
+            {
+                id: 303,
+                name: "Procédures générales",
+                description: "Document vierge pour les procédures générales",
+                visibility: VISIBILITY_LEVELS.PUBLIC,
+                status: DOCUMENT_STATUS.DRAFT,
+                createdAt: null,
+                deadline: null,
+                signatures: []
+            }
+        ],
         roles: [
             {
                 name: "Deposit",

src/pages/signature/signature.ts

@@ -19,7 +19,6 @@ import { groupsMock } from '../../mocks/mock-signature/groupsMock';
 import { messagesMock as initialMessagesMock } from '../../mocks/mock-signature/messagesMock';
 import { membersMock } from '../../mocks/mock-signature/membersMocks';
 import { 
-    Group, 
     Message, 
     MemberMessages, 
     DocumentSignature, 
@@ -30,6 +29,23 @@ import { messageStore } from '../../utils/messageMock';
 import { showAlert } from '../account/account';
 let currentUser = membersMock[0]; 
 
+interface Group {
+    id: number;
+    name: string;
+    description: string;
+    roles: Array<{
+        name: string;
+        members: Array<{ id: string | number; name: string }>;
+        documents?: Array<any>; 
+    }>;
+    commonDocuments: Array<{  
+        id: number;
+        name: string;
+        visibility: string;
+        description: string;
+    }>;
+}
+
 // Fonction pour gérer la liste des utilisateurs
 function toggleUserList() {
     const userList = document.getElementById('userList');
@@ -229,6 +245,7 @@ function toggleMembers(role: { members: { id: string | number; name: string; }[]
     roleElement.appendChild(memberList);
 }
 
+
 // Load the list of members
 function loadMemberChat(memberId: string | number) {
     selectedMemberId = String(memberId);
@@ -515,6 +532,30 @@ function showProcessDetails(group: Group, groupId: number) {
                     <p>${group.description || 'No description available'}</p>
                 </div>
                 <div class="details-section">
+                                <div class="details-section">
+                    <h3>Documents Communs</h3>
+                    <div class="documents-grid">
+                        ${group.commonDocuments.map(document => `
+                            <div class="document-card ${document.visibility} vierge">
+                                <div class="document-header">
+                                    <h4>⚠️ ${document.name}</h4>
+                                    <span class="document-visibility">${document.visibility}</span>
+                                </div>
+                                <div class="document-info">
+                                    <p>${document.description}</p>
+                                    <button class="new-request-btn" onclick="newRequest({
+                                        processId: ${group.id},
+                                        processName: '${group.name}',
+                                        roleId: 0,
+                                        roleName: 'common',
+                                        documentId: ${document.id},
+                                        documentName: '${document.name}'
+                                    })">New request</button>
+                                </div>
+                            </div>
+                        `).join('')}
+                    </div>
+                </div>
                     <h3>Roles and Documents</h3>
                     ${group.roles.map(role => `
                         <div class="role-section">
@@ -588,7 +629,6 @@ function showProcessDetails(group: Group, groupId: number) {
                         `).join('')}
                     </div>
                 </div>
-            </div>
         `;
 
         /**const newRequestBtn = document.createElement('button');
@@ -1040,19 +1080,17 @@ function closeNewRequest() {
     const newRequestView = document.getElementById('new-request-view');
     if (newRequestView) {
         newRequestView.style.display = 'none';
-        // Optionnel : supprimer la vue du DOM
         newRequestView.remove();
     }
 }
 
-// N'oubliez pas d'exposer la fonction globalement
 window.closeNewRequest = closeNewRequest;
 
 document.addEventListener('DOMContentLoaded', function() {
     const newRequestBtn = document.getElementById('newRequestBtn');
     if (newRequestBtn) {
         newRequestBtn.addEventListener('click', () => {
-            // Provide default/empty RequestParams when clicked
+
             newRequest({
                 processId: 0,
                 processName: '',
@@ -1099,7 +1137,7 @@ window.submitDocumentRequest = submitDocumentRequest;
 const allMembers = membersMock.map(member => ({
     id: member.id,
     name: member.name,
-    roleName: 'Default Role' // Add role information if available in your membersMock
+    roleName: 'Default Role' 
 }));
 
 const addMembersBtn = document.getElementById('addMembersBtn');