合并html导出文件的模板内容

app/resources/template.html

@@ -161,7 +161,7 @@ body{
     color: darkgray;
 }
 
-.chat-image img{
+.chat-image img,.chat-file img{
     margin-right: 18px;
     margin-left: 18px;
     max-width: 300px;
@@ -184,6 +184,29 @@ audio{
     margin-left: 9px;
     margin-right: 9px;
 }
+
+.chat-file {
+    width: 300px;
+    background-color: #fff;
+    margin-right: 20px;
+}
+.chat-file a ,.chat-file div{
+    display: flex;
+    color: #000;
+    outline: none;
+    text-decoration: none;
+    margin: 0 20px 20px 20px;
+}
+.chat-file div{
+    margin: 20px;
+}
+.chat-file a span ,.chat-file div span{
+    /* flex-grow: 1; */
+    width: 200px;
+}
+.chat-file a img,.chat-file div img{
+    width: 100px;
+}
 .input-area{
     border-top:0.5px solid #e0e0e0;
     height: 150px;
@@ -534,6 +557,17 @@ input {
             messageAudioTag.innerHTML = `<audio src="${message.text}" controls></audio>`;
             return messageAudioTag;
         }
+        function messageFileBox(message) {
+            const messageFileTag = document.createElement('div');
+            messageFileTag.className = `chat-file`;
+            if (message.link !== ''){
+                messageFileTag.innerHTML  = `
+                <a href="${message.link}" target="_blank"><span>${message.file_name}</span><img src="${message.text}"/></a>`
+            }else{
+                messageFileTag.innerHTML = `<div><span>文件已丢失</span><img src="${message.text}"/></div>`;
+            }
+            return messageFileTag;
+        }
 
             // 从数据列表中取出对应范围的元素并添加到容器中
         for (let i = startIndex; i < endIndex && i < chatMessages.length; i++) {
@@ -619,6 +653,19 @@ input {
                         messageContent.appendChild(messageElementReferText(message, side));
                     }
 
+                    // 整合
+                    messageElement.className = `item item-${side}`;
+                    messageElement.appendChild(message.is_send ? messageContent : avatarTag);
+                    messageElement.appendChild(message.is_send ? avatarTag : messageContent);
+                }
+                if (message.sub_type == 6) {
+                    // displayname 和 file
+                    messageContent.className = `content-wrapper content-wrapper-${side}`;
+                    if (message.is_chatroom && !message.is_send) {
+                        messageContent.appendChild(displayNameBox(message));
+                    }
+                    messageContent.appendChild(messageFileBox(message));
+
                     // 整合
                     messageElement.className = `item item-${side}`;
                     messageElement.appendChild(message.is_send ? messageContent : avatarTag);