signature_full_ok

src/pages/signature/signature.ts

@@ -118,15 +118,15 @@ class SignatureElement extends HTMLElement {
                                 
                                 <div class="info-section">
                                     <div class="info-row">
-                                        <span class="label">Créé le:</span>
+                                        <span class="label">Created:</span>
                                         <span class="value">${new Date(targetDoc.createdAt).toLocaleDateString()}</span>
                                     </div>
                                     <div class="info-row">
-                                        <span class="label">Date limite:</span>
+                                        <span class="label">Deadline:</span>
                                         <span class="value">${new Date(targetDoc.deadline).toLocaleDateString()}</span>
                                     </div>
                                     <div class="info-row">
-                                        <span class="label">Visibilité:</span>
+                                        <span class="label">Visibility:</span>
                                         <span class="value">${targetDoc.visibility}</span>
                                     </div>
                                 </div>
@@ -137,7 +137,7 @@ class SignatureElement extends HTMLElement {
                                 </div>
 
                                 <div class="signatures-section">
-                                    <h4>État des signatures:</h4>
+                                    <h4>Signatures status:</h4>
                                     <div class="signatures-list">
                                         ${targetDoc.signatures.map((sig: DocumentSignature) => `
                                             <div class="signature-item ${sig.signed ? 'signed' : 'pending'}">
@@ -154,7 +154,7 @@ class SignatureElement extends HTMLElement {
 
                                 ${this.getFileList().length > 0 ? `
                                     <div class="files-section">
-                                        <h4>Fichiers joints:</h4>
+                                        <h4>Files attached:</h4>
                                         <div class="files-list">
                                             ${this.getFileList().map(file => `
                                                 <div class="file-item">
@@ -282,6 +282,7 @@ class SignatureElement extends HTMLElement {
             }
         });
         this.initMessageEvents();
+        this.initFileUpload();
     }
 
     private initMessageEvents() {
@@ -303,6 +304,18 @@ class SignatureElement extends HTMLElement {
         }
     }
 
+    private initFileUpload() {
+        const fileInput = document.getElementById('file-input') as HTMLInputElement;
+        if (fileInput) {
+            fileInput.addEventListener('change', (event: Event) => {
+                const target = event.target as HTMLInputElement;
+                if (target.files && target.files.length > 0) {
+                    this.sendFile(target.files[0]);
+                }
+            });
+        }
+    }
+
 
     private calculateDuration(startDate: string | null | undefined, endDate: string | null | undefined): number {
         const start = new Date(startDate || '');
@@ -529,8 +542,8 @@ class SignatureElement extends HTMLElement {
                                                                 <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'}` : 
+                                                                        `✓ Signed on ${sig.signedAt ? new Date(sig.signedAt).toLocaleDateString() : 'unknown date'}` : 
-                                                                        '⌛ En attente'}
+                                                                        '⌛ Pending'}
                                                                 </span>
                                                             </div>
                                                         `).join('')}
@@ -541,7 +554,7 @@ class SignatureElement extends HTMLElement {
                                                     <p>${signedCount} out of ${totalSignatures} signed (${percentage.toFixed(0)}%)</p>
                                                 </div>
                                             ` : `
-                                                <p>Document vierge - En attente de création</p>
+                                                <p>Document vierge - Waiting for creation</p>
                                                 <button class="new-request-btn" onclick="newRequest({
                                                     processId: ${displayGroup.id},
                                                     processName: '${displayGroup.name}',
@@ -925,24 +938,29 @@ class SignatureElement extends HTMLElement {
             type: 'text' as const
         };
     }
+
     // Send a file
     private sendFile(file: File) {
+        console.log('SendFile called with file:', file);
         const reader = new FileReader();
         reader.onloadend = () => {
             const fileData = reader.result;
             const fileName = file.name;
+            console.log('File loaded:', fileName);
 
-            const newFileMessage = {
+            if (this.selectedMemberId) {
+                messageStore.addMessage(this.selectedMemberId, {
                     id: Date.now(),
                     sender: "4NK",
                     fileName: fileName,
                     fileData: fileData,
                     time: new Date().toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' }),
                     type: 'file'
-            };
+                });
+                console.log('Message added to store');
                 
-            if (this.selectedMemberId) {
+                this.messagesMock = messageStore.getMessages();
-                messageStore.addMessage(this.selectedMemberId, newFileMessage);
+                this.loadMemberChat(this.selectedMemberId);
             }
         };
         reader.readAsDataURL(file);
@@ -1624,80 +1642,6 @@ class SignatureElement extends HTMLElement {
         }
     }
 
-    /*private initSignature() {
-        // Reset the display
-        const groupList = this.shadowRoot?.querySelector('#group-list');
-        if (groupList) {
-            groupList.innerHTML = ''; // Clear the existing list
-        }
-
-        // Reload the messages from the store
-        this.messagesMock = messageStore.getMessages();
-        if (this.messagesMock.length === 0) {
-            messageStore.setMessages(initialMessagesMock);
-            this.messagesMock = messageStore.getMessages();
-        }
-
-        // Reset the interface
-        this.updateCurrentUserDisplay();
-        this.loadGroupList();   
-        
-        // If a member was selected, reload their chat
-        if (this.selectedMemberId) {
-            this.loadMemberChat(this.selectedMemberId);
-        }
-
-        // Event listeners 
-        document.addEventListener('click', (event) => {
-            const userList = this.shadowRoot?.querySelector('#userList');
-            const userSwitchBtn = this.shadowRoot?.querySelector('#userSwitchBtn');
-            if (userSwitchBtn && userList && !userSwitchBtn.contains(event.target as Node) && !userList.contains(event.target as Node)) {
-                userList.classList.remove('show');
-            }
-        });
-
-        // Initialize the display of the current user when the page loads
-        document.addEventListener('DOMContentLoaded', () => {
-            this.updateCurrentUserDisplay();
-        
-            // Close the list if clicked elsewhere
-            document.addEventListener('click', (event) => {
-                const userList = this.shadowRoot?.querySelector('#userList');
-                const userSwitchBtn = this.shadowRoot?.querySelector('#userSwitchBtn');
-                if (userSwitchBtn && userList && !userSwitchBtn.contains(event.target as Node) && !userList.contains(event.target as Node)) {
-                    userList.classList.remove('show');
-                }
-            });
-        });
-
-        // Initialize the groups in localStorage if they don't exist
-        if (!localStorage.getItem('groups')) {
-            localStorage.setItem('groups', JSON.stringify(groupsMock));
-        }
-
-        let messagesMock = messageStore.getMessages();
-        if (messagesMock.length === 0) {
-            messageStore.setMessages(initialMessagesMock);
-            messagesMock = messageStore.getMessages();
-        }
-        // Reattach the event listeners for the messages
-        const sendBtn = this.shadowRoot?.querySelector('#send-button');
-        if (sendBtn) {
-            sendBtn.addEventListener('click', this.sendMessage.bind(this));
-        }
-
-        const messageInput = this.shadowRoot?.querySelector('#message-input');
-        if (messageInput) {
-            messageInput.addEventListener('keydown', (event: Event) => {
-                const keyEvent = event as KeyboardEvent;
-                if (keyEvent.key === 'Enter') {
-                    event.preventDefault();
-                    this.sendMessage();
-                }
-            });
-        }
-    }*/
-
 
     private initializeEventListeners() {
         document.addEventListener('DOMContentLoaded', (): void => {