many ok

Html/apps/static/js/chatbox.js

@@ -19,9 +19,9 @@ document.addEventListener('DOMContentLoaded', function () {
     });
     // 监听来自服务器的消息
     socket.on('voiceMessage', function (data) {
-        console.log(data)
-        const input =  document.createElement('messageInput');
-        input.data = data['data'];
+        console.log(data);
+        const input =  document.getElementById('messageInput');
+        input.value += data;
     });
     socket.on('message', function (data) {
         // 显示服务器的回复消息

Html/apps/static/js/process_show_floating_window.js

@@ -48,28 +48,50 @@ function createEntry(nodeName) {
 
     return entry;
 }
-
+function cleanString(str) {
+    // 去除所有空白字符（包括中间的）
+    return str.replace(/\s+/g, '');
+}
 // 更新条目内容
 function updateEntry(nodeName, statusData) {
-    const contentDiv = document.getElementById('content');
-    const entries = contentDiv.children;
-
+    const contentDiv = document.getElementById('entry-content');
+    const entries = [...contentDiv.children];
+    entries.forEach(entry => {
+        entry.style.display = 'none';
+    });
+    // 只显示前8个条目
+    const displayEntries = entries.slice(0, 8);
+    displayEntries.forEach(entry => {
+        entry.style.display = ''; // 恢复默认显示
+    });
     // 查找对应的条目
     for (let entry of entries) {
         const nodeNameElement = entry.querySelector('.node-name');
         if (nodeNameElement.textContent === nodeName) {
-            const statusDot = entry.querySelector('.status-dot');
-            const statusDataElement = entry.querySelector('.status-data');
+            let statusDataElement = entry.querySelector('.status-data');
+            // 如果内容和要更新的内容一样,跳过
+            if (!statusData)return;
+            if (cleanString(statusData) === cleanString(statusDataElement.textContent)) {
+                return;
+            }
 
+            // 将元素滚动到最底部
+            const parent = entry.parentElement; // 获取条目所在的父容器
+            parent.appendChild(entry); // 移动到父容器末尾（自动移除原有位置）
+            const statusDot = entry.querySelector('.status-dot');
+            statusDataElement = entry.querySelector('.status-data');
             // 更新状态圆点颜色（根据状态来决定颜色，可以根据后端发送的状态修改）
             statusDot.style.backgroundColor = 'green';  // 假设状态是正常的，暂时设置为绿色
 
             // 更新流式数据
             statusDataElement.textContent = statusData;
+            statusDataElement.scrollLeft = statusDataElement.scrollWidth - statusDataElement.clientWidth
+            contentDiv.scrollTop = contentDiv.scrollHeight;
             return;  // 找到对应的条目后退出
         }
     }
 
+
     // 如果没有找到对应条目，创建一个新的条目并添加到页面
     contentDiv.appendChild(createEntry(nodeName));
     updateEntry(nodeName, statusData); // 立即更新新条目