Update templates/index.html

templates/index.html

@@ -1221,13 +1221,26 @@
         });
     }
 
-    async function saveMessage(role, text, audioUrl = null, imageBase64 = null, timestamp = null) {
+    async function saveMessage(role, text, audioUrl = null, imageBase64 = null, timestamp = null, pdfUrl = null, docxUrl = null, isDocument = false) {
         let displayTitle = text ? text.substring(0, 20) + "..." : "تصویر ارسال شد";
+        if (isDocument) {
+            displayTitle = "📄 مقاله: " + displayTitle;
+        }
         if (!currentSessionId) {
             await createNewSession(displayTitle);
         }
         const msgTime = timestamp || Date.now();
-        const message = { sessionId: currentSessionId, role: role, text: text, audioUrl: audioUrl, imageBase64: imageBase64, timestamp: msgTime };
+        const message = { 
+            sessionId: currentSessionId, 
+            role: role, 
+            text: text, 
+            audioUrl: audioUrl, 
+            imageBase64: imageBase64, 
+            timestamp: msgTime,
+            pdfUrl: pdfUrl,
+            docxUrl: docxUrl,
+            isDocument: isDocument
+        };
         const tx = db.transaction('messages', 'readwrite');
         tx.objectStore('messages').add(message);
         if (role === 'user') {
@@ -1303,8 +1316,15 @@
             } else {
                 document.getElementById('emptyState').style.display = 'none';
                 messages.forEach(msg => {
-                    if(msg.role === 'user') appendUserMessageUI(msg.text, true, msg.imageBase64, msg.timestamp);
-                    else appendBotMessageUI(msg.text, msg.audioUrl, true);
+                    if(msg.role === 'user') {
+                        appendUserMessageUI(msg.text, true, msg.imageBase64, msg.timestamp);
+                    } else {
+                        if (msg.isDocument) {
+                            appendBotDocumentUI(msg.text, msg.pdfUrl, msg.docxUrl, true);
+                        } else {
+                            appendBotMessageUI(msg.text, msg.audioUrl, true);
+                        }
+                    }
                 });
                 setTimeout(() => {
                     const rows = chatArea.querySelectorAll('.message-row');
@@ -1461,6 +1481,85 @@
         chatArea.insertBefore(row, document.getElementById('dynamicSpacer'));
     }
 
+    /* --- قرارگیری فایل ها داخل کارت و دکمه های دانلود هنگام لود تاریخچه --- */
+    function appendBotDocumentUI(text, pdfUrl, docxUrl, isRestore = false) {
+        document.getElementById('emptyState').style.display = 'none';
+        const row = document.createElement('div');
+        row.className = 'message-row bot';
+        
+        const cardId = 'doc-' + Date.now() + '-' + Math.random().toString(36).substr(2, 5);
+        const contentId = 'content-' + cardId;
+        
+        let pdfHtml = '';
+        if (pdfUrl) {
+            pdfHtml = `
+                <div class="document-card" style="width:100%; border-right: 4px solid #ef4444;">
+                    <div class="doc-header" style="border-bottom:none; padding-bottom:0;">
+                        <div class="doc-download-actions visible">
+                            <a href="${pdfUrl}" class="doc-dl-btn" title="دانلود فایل PDF" download>
+                                <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="#ef4444" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
+                                    <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path>
+                                    <polyline points="7 10 12 15 17 10"></polyline>
+                                    <line x1="12" y1="15" x2="12" y2="3"></line>
+                                </svg>
+                            </a>
+                        </div>
+                        <div class="doc-title-container">
+                            <span>فایل PDF مقاله</span>
+                            <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#ef4444" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><polyline points="14 2 14 8 20 8"></polyline><line x1="16" y1="13" x2="8" y2="13"></line><line x1="16" y1="17" x2="8" y2="17"></line></svg>
+                        </div>
+                    </div>
+                </div>
+            `;
+        }
+
+        let docxHtml = '';
+        if (docxUrl) {
+            docxHtml = `
+                <div class="document-card" style="width:100%; border-right: 4px solid #2563eb;">
+                    <div class="doc-header" style="border-bottom:none; padding-bottom:0;">
+                        <div class="doc-download-actions visible">
+                            <a href="${docxUrl}" class="doc-dl-btn" title="دانلود فایل Word" download>
+                                <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="#2563eb" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
+                                    <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path>
+                                    <polyline points="7 10 12 15 17 10"></polyline>
+                                    <line x1="12" y1="15" x2="12" y2="3"></line>
+                                </svg>
+                            </a>
+                        </div>
+                        <div class="doc-title-container">
+                            <span>فایل Word مقاله</span>
+                            <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#2563eb" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><polyline points="14 2 14 8 20 8"></polyline><line x1="16" y1="13" x2="8" y2="13"></line><line x1="16" y1="17" x2="8" y2="17"></line></svg>
+                        </div>
+                    </div>
+                </div>
+            `;
+        }
+
+        row.innerHTML = `
+            <div style="display:flex; flex-direction:column; gap:12px; width:100%; max-width:320px;">
+                <div class="document-card" style="width:100%;">
+                    <div class="doc-header">
+                        <div class="doc-title-container" style="width: 100%; justify-content: flex-start;">
+                            <span>متن مقاله ساخته شده</span>
+                            <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><polyline points="14 2 14 8 20 8"></polyline><line x1="16" y1="13" x2="8" y2="13"></line><line x1="16" y1="17" x2="8" y2="17"></line></svg>
+                        </div>
+                    </div>
+                    <div class="doc-content-scroll" id="${contentId}">
+                        ${formatMessageText(text)}
+                    </div>
+                </div>
+                ${pdfHtml}
+                ${docxHtml}
+            </div>
+            <div class="action-buttons">
+                <button class="action-btn" title="کپی" onclick="copyMessageText(this)">${COPY_ICON_SVG}</button>
+            </div>
+        `;
+        
+        chatArea.insertBefore(row, document.getElementById('dynamicSpacer'));
+    }
+
     let currentBotRow = null;
     let currentBotBubble = null;
     let currentBotText = "";
@@ -1649,7 +1748,7 @@
                                     `;
                                 }
                                 
-                                saveMessage('bot', "مقاله شما ایجاد شد.\n" + fullText, null, null, Date.now());
+                                saveMessage('bot', fullText, null, null, Date.now(), data.pdf_url, data.docx_url, true);
                             }
                             else if (data.type === 'error') {
                                 contentBox.innerHTML += `<br><span style="color:red;">خطا: ${data.message}</span>`;