From 75a851d46b768fa7227aaef1a21048d63716c76e Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Sun, 15 Mar 2026 09:02:14 +0000
Subject: [PATCH 1/8] Initial plan


From 7bb1777f4c1fb0d9f71c6cd4d752fb7729981287 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Sun, 15 Mar 2026 09:07:53 +0000
Subject: [PATCH 2/8] feat: improve messages.html UX per feedback

- Desktop/mobile login tab priority: bookmarklet on desktop (pointer: fine), session on mobile
- Replace sender name links with Bootstrap popovers showing user info popup
- Image zoom: cursor: zoom-in/zoom-out, title tooltip on images
- Global Ctrl+V paste handler for images anywhere in thread view
- Auto-resize compose textarea as user types

Co-authored-by: PythonSmall-Q <106425289+PythonSmall-Q@users.noreply.github.com>
---
 messages.html | 105 +++++++++++++++++++++++++++++++++++++++++++-------
 1 file changed, 92 insertions(+), 13 deletions(-)

diff --git a/messages.html b/messages.html
index 742c84ef..e664b71d 100644
--- a/messages.html
+++ b/messages.html
@@ -10,11 +10,15 @@
     <style>
         body { padding-top: 56px; }
         #thread-messages { max-height: 60vh; overflow-y: auto; }
-        #thread-messages img { max-width: 100%; max-height: 300px; object-fit: contain; cursor: pointer; }
+        #thread-messages img { max-width: 100%; max-height: 300px; object-fit: contain; cursor: zoom-in; }
         .compose-sticky { position: sticky; bottom: 0; background: var(--bs-body-bg); border-top: 1px solid var(--bs-border-color); padding: 0.75rem 0; }
         .msg-bubble-cell { word-break: break-word; max-width: 60vw; }
         #upload-indicator { font-size: 0.8em; }
         .bookmarklet-link { cursor: grab; }
+        .user-info-btn { font-size: inherit; vertical-align: baseline; text-decoration: none; }
+        .user-info-btn:hover { text-decoration: underline; }
+        #img-modal .modal-body { cursor: zoom-out; }
+        #thread-compose { resize: none; overflow-y: hidden; }
     </style>
     <script>
         (function() {
@@ -406,11 +410,47 @@ <h5 class="mb-0 flex-grow-1" id="thread-title">与 … 的对话</h5>
     return (d.getMonth() + 1) + '/' + d.getDate() + ' ' + pad(d.getHours()) + ':' + pad(d.getMinutes());
 }
 
-function userLink(username) {
-    return '<a href="' + XMOJ_BASE + '/userinfo.php?user=' + encodeURIComponent(username) +
-           '" target="_blank" rel="noopener">' + escapeHtml(username) + '</a>';
+// Popover state for user info buttons
+var _activePopoverBtn = null;
+
+function userSpan(username) {
+    return '<button type="button" class="btn btn-link p-0 user-info-btn" ' +
+           'data-username="' + escapeHtml(username) + '">' +
+           escapeHtml(username) + '</button>';
+}
+
+function initUserButtons(container) {
+    container.querySelectorAll('.user-info-btn').forEach(function(btn) {
+        var username = btn.dataset.username;
+        var popover = new bootstrap.Popover(btn, {
+            trigger: 'click',
+            html: true,
+            placement: 'top',
+            title: '<strong>' + escapeHtml(username) + '</strong>',
+            content: '<a href="' + XMOJ_BASE + '/userinfo.php?user=' + encodeURIComponent(username) +
+                     '" target="_blank" rel="noopener" class="btn btn-sm btn-outline-primary w-100">查看用户资料</a>',
+        });
+        btn.addEventListener('show.bs.popover', function() {
+            if (_activePopoverBtn && _activePopoverBtn !== btn) {
+                var prev = bootstrap.Popover.getInstance(_activePopoverBtn);
+                if (prev) prev.hide();
+            }
+            _activePopoverBtn = btn;
+        });
+        btn.addEventListener('hidden.bs.popover', function() {
+            if (_activePopoverBtn === btn) _activePopoverBtn = null;
+        });
+    });
 }
 
+// Close active popover when clicking outside
+document.addEventListener('click', function(e) {
+    if (_activePopoverBtn && !_activePopoverBtn.contains(e.target) && !e.target.closest('.popover')) {
+        var inst = bootstrap.Popover.getInstance(_activePopoverBtn);
+        if (inst) inst.hide();
+    }
+});
+
 // ── Theme ──────────────────────────────────────────────────────────────────
 function initTheme() {
     var t = localStorage.getItem('xmoj-msg-theme') || 'auto';
@@ -501,16 +541,17 @@ <h5 class="mb-0 flex-grow-1" id="thread-title">与 … 的对话</h5>
             var preview = stripMarkdown(item.LastsMessage);
             if (preview.length > PREVIEW_LEN) preview = preview.slice(0, PREVIEW_LEN) + '…';
             return '<tr class="' + (hasUnread ? 'table-primary' : '') + '" data-user="' + escapeHtml(item.OtherUser) + '" style="cursor:pointer;">' +
-                '<td>' + userLink(item.OtherUser) +
+                '<td>' + userSpan(item.OtherUser) +
                 (hasUnread ? ' <span class="badge text-bg-danger ms-1">' + item.UnreadCount + '</span>' : '') +
                 '</td>' +
                 '<td class="text-body-secondary small">' + escapeHtml(preview) + '</td>' +
                 '<td class="text-nowrap text-body-secondary small">' + formatTime(item.SendTime) + '</td>' +
                 '</tr>';
         }).join('');
+        initUserButtons(tbody);
         tbody.querySelectorAll('tr[data-user]').forEach(function(row) {
             row.addEventListener('click', function(e) {
-                if (e.target.tagName === 'A') return;
+                if (e.target.closest('.user-info-btn') || e.target.closest('.popover')) return;
                 openThread(row.dataset.user);
             });
         });
@@ -553,14 +594,16 @@ <h5 class="mb-0 flex-grow-1" id="thread-title">与 … 的对话</h5>
             var isUnread = !m.IsRead;
             var isHighlight = isUnread && m.FromUser !== currentUser.username;
             return '<tr class="' + (isHighlight ? 'table-primary' : '') + '">' +
-                '<td class="text-nowrap">' + userLink(m.FromUser) + '</td>' +
+                '<td class="text-nowrap">' + userSpan(m.FromUser) + '</td>' +
                 '<td class="msg-bubble-cell">' + renderMarkdown(m.Content) + '</td>' +
                 '<td class="text-nowrap text-body-secondary small">' + formatTime(m.SendTime) + '</td>' +
                 '<td class="text-nowrap small">' + (isUnread ? '<span class="badge text-bg-warning">未读</span>' : '<span class="text-body-secondary">已读</span>') + '</td>' +
                 '</tr>';
         }).join('');
-        // Make images clickable
+        initUserButtons(tbody);
+        // Make images clickable to zoom
         tbody.querySelectorAll('img').forEach(function(img) {
+            img.title = '点击放大';
             img.addEventListener('click', function() {
                 document.getElementById('img-modal-src').src = img.src;
                 imgModalBS.show();
@@ -719,13 +762,17 @@ <h5 class="mb-0 flex-grow-1" id="thread-title">与 … 的对话</h5>
 }
 
 // ── Login Tabs ─────────────────────────────────────────────────────────────
+function setLoginTab(tab) {
+    document.querySelectorAll('#loginTabs .nav-link').forEach(function(b) {
+        b.classList.toggle('active', b.dataset.tab === tab);
+    });
+    document.getElementById('tab-bookmarklet').style.display = tab === 'bookmarklet' ? '' : 'none';
+    document.getElementById('tab-manual').style.display = tab === 'manual' ? '' : 'none';
+}
+
 document.querySelectorAll('#loginTabs .nav-link').forEach(function(btn) {
     btn.addEventListener('click', function() {
-        document.querySelectorAll('#loginTabs .nav-link').forEach(function(b) { b.classList.remove('active'); });
-        btn.classList.add('active');
-        var tab = btn.dataset.tab;
-        document.getElementById('tab-bookmarklet').style.display = tab === 'bookmarklet' ? '' : 'none';
-        document.getElementById('tab-manual').style.display = tab === 'manual' ? '' : 'none';
+        setLoginTab(btn.dataset.tab);
     });
 });
 
@@ -780,6 +827,32 @@ <h5 class="mb-0 flex-grow-1" id="thread-title">与 … 的对话</h5>
     }
 });
 
+// Auto-resize textarea as user types
+(function() {
+    var ta = document.getElementById('thread-compose');
+    function autoResize() {
+        ta.style.height = 'auto';
+        ta.style.height = Math.min(ta.scrollHeight, 200) + 'px';
+    }
+    ta.addEventListener('input', autoResize);
+    autoResize();
+})();
+
+// Global paste handler: upload image from clipboard when in thread view
+document.addEventListener('paste', function(e) {
+    if (document.getElementById('screen-thread').style.display === 'none') return;
+    if (e.defaultPrevented) return; // already handled by local handler
+    var items = e.clipboardData && e.clipboardData.items;
+    if (!items) return;
+    for (var i = 0; i < items.length; i++) {
+        if (items[i].type.startsWith('image/')) {
+            e.preventDefault();
+            handleImageFile(items[i].getAsFile());
+            return;
+        }
+    }
+});
+
 document.getElementById('img-modal-src').addEventListener('click', function() {
     imgModalBS.hide();
 });
@@ -795,6 +868,12 @@ <h5 class="mb-0 flex-grow-1" id="thread-title">与 … 的对话</h5>
     initTheme();
     initBookmarklet();
 
+    // Set default login tab: bookmarklet on desktop, session login on mobile
+    var isDesktop = window.matchMedia
+        ? window.matchMedia('(pointer: fine)').matches
+        : (!('ontouchstart' in window) && window.innerWidth >= 1024);
+    setLoginTab(isDesktop ? 'bookmarklet' : 'manual');
+
     // Check for bookmarklet redirect
     if (checkSessionHash()) {
         onLoggedIn();

From a1e6eac1b0a78fa341e931a54377abd2b1c1284e Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Sun, 15 Mar 2026 09:11:20 +0000
Subject: [PATCH 3/8] fix: add year prefix to formatTime when message is from a
 previous year

Co-authored-by: PythonSmall-Q <106425289+PythonSmall-Q@users.noreply.github.com>
---
 messages.html | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/messages.html b/messages.html
index e664b71d..5e67b70a 100644
--- a/messages.html
+++ b/messages.html
@@ -407,7 +407,9 @@ <h5 class="mb-0 flex-grow-1" id="thread-title">与 … 的对话</h5>
     if (d.toDateString() === now.toDateString()) {
         return pad(d.getHours()) + ':' + pad(d.getMinutes());
     }
-    return (d.getMonth() + 1) + '/' + d.getDate() + ' ' + pad(d.getHours()) + ':' + pad(d.getMinutes());
+    var datePart = (d.getFullYear() !== now.getFullYear() ? d.getFullYear() + '/' : '') +
+        (d.getMonth() + 1) + '/' + d.getDate();
+    return datePart + ' ' + pad(d.getHours()) + ':' + pad(d.getMinutes());
 }
 
 // Popover state for user info buttons

From e8640be84c3f283d8f9daf5d0e5301e9d703882c Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Sun, 15 Mar 2026 09:17:22 +0000
Subject: [PATCH 4/8] fix: remove table-light from thead to fix dark mode color
 on user row

Co-authored-by: PythonSmall-Q <106425289+PythonSmall-Q@users.noreply.github.com>
---
 messages.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/messages.html b/messages.html
index 5e67b70a..3e99370a 100644
--- a/messages.html
+++ b/messages.html
@@ -240,7 +240,7 @@ <h5 class="mb-0">收件箱</h5>
     <!-- Mail list table -->
     <div class="table-responsive">
         <table class="table table-hover table-borderless align-middle">
-            <thead class="table-light">
+            <thead>
                 <tr>
                     <th>用户</th>
                     <th>最新消息</th>
@@ -269,7 +269,7 @@ <h5 class="mb-0 flex-grow-1" id="thread-title">与 … 的对话</h5>
     <!-- Messages table -->
     <div id="thread-messages" class="mb-2">
         <table class="table table-hover table-borderless align-top">
-            <thead class="table-light">
+            <thead>
                 <tr>
                     <th class="text-nowrap">发送者</th>
                     <th>内容</th>

From ff05e25412a8a4bf1e8840b7714a9338254f64f6 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Sun, 15 Mar 2026 09:33:13 +0000
Subject: [PATCH 5/8] fix(messages.html): dark mode table-primary, year display
 bug, user info modal

Co-authored-by: PythonSmall-Q <106425289+PythonSmall-Q@users.noreply.github.com>
---
 messages.html | 131 ++++++++++++++++++++++++++++++++++++--------------
 1 file changed, 96 insertions(+), 35 deletions(-)

diff --git a/messages.html b/messages.html
index 3e99370a..7e2fd96c 100644
--- a/messages.html
+++ b/messages.html
@@ -19,6 +19,13 @@
         .user-info-btn:hover { text-decoration: underline; }
         #img-modal .modal-body { cursor: zoom-out; }
         #thread-compose { resize: none; overflow-y: hidden; }
+        /* Bootstrap 5.3.3 does not ship dark-mode overrides for .table-primary;
+           supply them here using Bootstrap's own semantic color tokens. */
+        [data-bs-theme="dark"] .table-primary {
+            --bs-table-color: var(--bs-primary-text-emphasis);
+            --bs-table-bg: var(--bs-primary-bg-subtle);
+            --bs-table-border-color: var(--bs-primary-border-subtle);
+        }
     </style>
     <script>
         (function() {
@@ -306,6 +313,24 @@ <h5 class="mb-0 flex-grow-1" id="thread-title">与 … 的对话</h5>
     </div>
 </div>
 
+<!-- ==================== USER INFO MODAL ==================== -->
+<div class="modal fade" id="user-info-modal" tabindex="-1">
+    <div class="modal-dialog modal-dialog-centered">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="user-info-modal-title">用户信息</h5>
+                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
+            </div>
+            <div class="modal-body" id="user-info-modal-body"></div>
+            <div class="modal-footer">
+                <a id="user-info-profile-link" href="#" target="_blank" rel="noopener"
+                   class="btn btn-primary">查看完整资料</a>
+                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">关闭</button>
+            </div>
+        </div>
+    </div>
+</div>
+
 <!-- ==================== IMAGE VIEWER MODAL ==================== -->
 <div class="modal fade" id="img-modal" tabindex="-1">
     <div class="modal-dialog modal-xl modal-dialog-centered">
@@ -352,10 +377,11 @@ <h5 class="mb-0 flex-grow-1" id="thread-title">与 … 的对话</h5>
 let isFirstLoad    = true;
 
 // ── Bootstrap instances ────────────────────────────────────────────────────
-const toastEl    = document.getElementById('app-toast');
-const toastBS    = new bootstrap.Toast(toastEl, { delay: 3500 });
-const imgModalEl = document.getElementById('img-modal');
-const imgModalBS = new bootstrap.Modal(imgModalEl);
+const toastEl        = document.getElementById('app-toast');
+const toastBS        = new bootstrap.Toast(toastEl, { delay: 3500 });
+const imgModalEl     = document.getElementById('img-modal');
+const imgModalBS     = new bootstrap.Modal(imgModalEl);
+const userInfoModalBS = new bootstrap.Modal(document.getElementById('user-info-modal'));
 
 // ── Utility ────────────────────────────────────────────────────────────────
 function showToast(msg, type) {
@@ -401,7 +427,7 @@ <h5 class="mb-0 flex-grow-1" id="thread-title">与 … 的对话</h5>
 
 function formatTime(ts) {
     if (!ts) return '';
-    var d = new Date(ts * 1000);
+    var d = new Date(ts);
     var now = new Date();
     var pad = function(n) { return String(n).padStart(2, '0'); };
     if (d.toDateString() === now.toDateString()) {
@@ -412,47 +438,82 @@ <h5 class="mb-0 flex-grow-1" id="thread-title">与 … 的对话</h5>
     return datePart + ' ' + pad(d.getHours()) + ':' + pad(d.getMinutes());
 }
 
-// Popover state for user info buttons
-var _activePopoverBtn = null;
-
 function userSpan(username) {
     return '<button type="button" class="btn btn-link p-0 user-info-btn" ' +
            'data-username="' + escapeHtml(username) + '">' +
            escapeHtml(username) + '</button>';
 }
 
+async function showUserInfo(username) {
+    var title = document.getElementById('user-info-modal-title');
+    var body = document.getElementById('user-info-modal-body');
+    var profileLink = document.getElementById('user-info-profile-link');
+    var profileUrl = XMOJ_BASE + '/userinfo.php?user=' + encodeURIComponent(username);
+
+    title.textContent = username;
+    profileLink.href = profileUrl;
+    body.innerHTML = '<div class="text-center py-3"><span class="spinner-border spinner-border-sm me-2"></span>加载中…</div>';
+    userInfoModalBS.show();
+
+    try {
+        var res = await fetch(profileUrl);
+        if (!res.ok) throw new Error('HTTP ' + res.status);
+        var html = await res.text();
+
+        if (html.indexOf('No such User!') !== -1) {
+            body.innerHTML = '<p class="text-body-secondary mb-0">用户不存在。</p>';
+            return;
+        }
+
+        var doc = new DOMParser().parseFromString(html, 'text/html');
+
+        var captionEl = doc.querySelector('#statics > caption');
+        var nickname = '';
+        if (captionEl) {
+            // Caption text format: "UserID--Nickname"
+            var parts = captionEl.textContent.trim().split('--');
+            if (parts.length > 1) nickname = parts[1].trim();
+        }
+
+        var submitEl = doc.querySelector('#statics > tbody > tr:nth-child(3) > td:nth-child(2)');
+        var acceptEl = doc.querySelector('#statics > tbody > tr:nth-child(4) > td:nth-child(2)');
+        var submitCount = submitEl ? (parseInt(submitEl.textContent.trim()) || 0) : 0;
+        var acceptCount = acceptEl ? (parseInt(acceptEl.textContent.trim()) || 0) : 0;
+        var rating = submitCount > 0 ? ((acceptCount / submitCount) * 1000).toFixed(1) : '—';
+
+        var tbodyRows = doc.querySelectorAll('#statics > tbody > tr');
+        var email = '';
+        if (tbodyRows.length > 0) {
+            var lastCells = tbodyRows[tbodyRows.length - 1].querySelectorAll('td');
+            if (lastCells.length >= 2) email = lastCells[1].textContent.trim();
+        }
+
+        var rows = [];
+        if (nickname) rows.push(['昵称', escapeHtml(nickname)]);
+        rows.push(['评分', escapeHtml(acceptCount + ' / ' + submitCount) +
+            ' <span class="text-body-secondary small ms-1">(' + escapeHtml(String(rating)) + ')</span>']);
+        if (email) rows.push(['邮箱', '<a href="mailto:' + escapeHtml(email) + '">' + escapeHtml(email) + '</a>']);
+
+        body.innerHTML = '<dl class="row mb-0">' +
+            rows.map(function(r) {
+                return '<dt class="col-4 text-truncate">' + r[0] + '</dt>' +
+                       '<dd class="col-8 mb-2">' + r[1] + '</dd>';
+            }).join('') +
+            '</dl>';
+    } catch (e) {
+        body.innerHTML = '<p class="text-body-secondary mb-0">无法加载用户信息，请直接访问资料页面。</p>';
+    }
+}
+
 function initUserButtons(container) {
     container.querySelectorAll('.user-info-btn').forEach(function(btn) {
-        var username = btn.dataset.username;
-        var popover = new bootstrap.Popover(btn, {
-            trigger: 'click',
-            html: true,
-            placement: 'top',
-            title: '<strong>' + escapeHtml(username) + '</strong>',
-            content: '<a href="' + XMOJ_BASE + '/userinfo.php?user=' + encodeURIComponent(username) +
-                     '" target="_blank" rel="noopener" class="btn btn-sm btn-outline-primary w-100">查看用户资料</a>',
-        });
-        btn.addEventListener('show.bs.popover', function() {
-            if (_activePopoverBtn && _activePopoverBtn !== btn) {
-                var prev = bootstrap.Popover.getInstance(_activePopoverBtn);
-                if (prev) prev.hide();
-            }
-            _activePopoverBtn = btn;
-        });
-        btn.addEventListener('hidden.bs.popover', function() {
-            if (_activePopoverBtn === btn) _activePopoverBtn = null;
+        btn.addEventListener('click', function(e) {
+            e.stopPropagation();
+            showUserInfo(btn.dataset.username);
         });
     });
 }
 
-// Close active popover when clicking outside
-document.addEventListener('click', function(e) {
-    if (_activePopoverBtn && !_activePopoverBtn.contains(e.target) && !e.target.closest('.popover')) {
-        var inst = bootstrap.Popover.getInstance(_activePopoverBtn);
-        if (inst) inst.hide();
-    }
-});
-
 // ── Theme ──────────────────────────────────────────────────────────────────
 function initTheme() {
     var t = localStorage.getItem('xmoj-msg-theme') || 'auto';
@@ -553,7 +614,7 @@ <h5 class="mb-0 flex-grow-1" id="thread-title">与 … 的对话</h5>
         initUserButtons(tbody);
         tbody.querySelectorAll('tr[data-user]').forEach(function(row) {
             row.addEventListener('click', function(e) {
-                if (e.target.closest('.user-info-btn') || e.target.closest('.popover')) return;
+                if (e.target.closest('.user-info-btn')) return;
                 openThread(row.dataset.user);
             });
         });

From 7678bd51ef89492d8d24eb222e5c9eb9ebddb4fa Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Sun, 15 Mar 2026 09:41:02 +0000
Subject: [PATCH 6/8] fix(messages.html): set Referer to xmoj.tech and include
 credentials in userinfo fetch

Co-authored-by: PythonSmall-Q <106425289+PythonSmall-Q@users.noreply.github.com>
---
 messages.html | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/messages.html b/messages.html
index 7e2fd96c..d0ca90b4 100644
--- a/messages.html
+++ b/messages.html
@@ -456,7 +456,10 @@ <h5 class="modal-title" id="user-info-modal-title">用户信息</h5>
     userInfoModalBS.show();
 
     try {
-        var res = await fetch(profileUrl);
+        var res = await fetch(profileUrl, {
+            referrer: XMOJ_BASE + '/',
+            credentials: 'include'
+        });
         if (!res.ok) throw new Error('HTTP ' + res.status);
         var html = await res.text();
 

From 5a4b175b7e56cf0f9f0413e2ae41a6d8ef01ba02 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Sun, 15 Mar 2026 09:47:00 +0000
Subject: [PATCH 7/8] feat(messages.html): add local contact search box to mail
 list

Co-authored-by: PythonSmall-Q <106425289+PythonSmall-Q@users.noreply.github.com>
---
 messages.html | 67 ++++++++++++++++++++++++++++++++++++---------------
 1 file changed, 47 insertions(+), 20 deletions(-)

diff --git a/messages.html b/messages.html
index d0ca90b4..d1f88849 100644
--- a/messages.html
+++ b/messages.html
@@ -229,6 +229,12 @@ <h5 class="mb-0">收件箱</h5>
         </div>
     </div>
 
+    <!-- Search contacts -->
+    <div class="mb-2">
+        <input type="search" class="form-control form-control-sm" id="list-search"
+               placeholder="搜索联系人…" autocomplete="off" autocapitalize="none">
+    </div>
+
     <!-- Compose new message -->
     <div class="collapse mb-3" id="compose-panel">
         <div class="card card-body border-0 shadow-sm">
@@ -375,6 +381,7 @@ <h5 class="modal-title" id="user-info-modal-title">用户信息</h5>
 let currentThread  = null;   // other user's username
 let refreshTimer   = null;
 let isFirstLoad    = true;
+let mailListCache  = [];     // last fetched mail list (for local search)
 
 // ── Bootstrap instances ────────────────────────────────────────────────────
 const toastEl        = document.getElementById('app-toast');
@@ -591,6 +598,38 @@ <h5 class="modal-title" id="user-info-modal-title">用户信息</h5>
 }
 
 // ── Mail List ──────────────────────────────────────────────────────────────
+function renderMailList(query) {
+    var tbody = document.getElementById('list-tbody');
+    var q = query ? query.trim().toLowerCase() : '';
+    var list = q
+        ? mailListCache.filter(function(item) { return item.OtherUser.toLowerCase().indexOf(q) !== -1; })
+        : mailListCache;
+    if (list.length === 0) {
+        tbody.innerHTML = '<tr><td colspan="3" class="text-center text-body-secondary py-4">' +
+            (q ? '未找到匹配的联系人' : '暂无消息') + '</td></tr>';
+        return;
+    }
+    tbody.innerHTML = list.map(function(item) {
+        var hasUnread = item.UnreadCount > 0;
+        var preview = stripMarkdown(item.LastsMessage);
+        if (preview.length > PREVIEW_LEN) preview = preview.slice(0, PREVIEW_LEN) + '…';
+        return '<tr class="' + (hasUnread ? 'table-primary' : '') + '" data-user="' + escapeHtml(item.OtherUser) + '" style="cursor:pointer;">' +
+            '<td>' + userSpan(item.OtherUser) +
+            (hasUnread ? ' <span class="badge text-bg-danger ms-1">' + item.UnreadCount + '</span>' : '') +
+            '</td>' +
+            '<td class="text-body-secondary small">' + escapeHtml(preview) + '</td>' +
+            '<td class="text-nowrap text-body-secondary small">' + formatTime(item.SendTime) + '</td>' +
+            '</tr>';
+    }).join('');
+    initUserButtons(tbody);
+    tbody.querySelectorAll('tr[data-user]').forEach(function(row) {
+        row.addEventListener('click', function(e) {
+            if (e.target.closest('.user-info-btn')) return;
+            openThread(row.dataset.user);
+        });
+    });
+}
+
 async function loadMailList() {
     var tbody = document.getElementById('list-tbody');
     tbody.innerHTML = '<tr id="list-loading-row"><td colspan="3" class="text-center text-body-secondary py-4">' +
@@ -598,29 +637,13 @@ <h5 class="modal-title" id="user-info-modal-title">用户信息</h5>
     try {
         var result = await apiCall('GetMailList', {});
         var list = result && result.Data && result.Data.MailList;
-        if (!list || list.length === 0) {
+        mailListCache = list || [];
+        if (mailListCache.length === 0) {
             tbody.innerHTML = '<tr><td colspan="3" class="text-center text-body-secondary py-4">暂无消息</td></tr>';
             return;
         }
-        tbody.innerHTML = list.map(function(item) {
-            var hasUnread = item.UnreadCount > 0;
-            var preview = stripMarkdown(item.LastsMessage);
-            if (preview.length > PREVIEW_LEN) preview = preview.slice(0, PREVIEW_LEN) + '…';
-            return '<tr class="' + (hasUnread ? 'table-primary' : '') + '" data-user="' + escapeHtml(item.OtherUser) + '" style="cursor:pointer;">' +
-                '<td>' + userSpan(item.OtherUser) +
-                (hasUnread ? ' <span class="badge text-bg-danger ms-1">' + item.UnreadCount + '</span>' : '') +
-                '</td>' +
-                '<td class="text-body-secondary small">' + escapeHtml(preview) + '</td>' +
-                '<td class="text-nowrap text-body-secondary small">' + formatTime(item.SendTime) + '</td>' +
-                '</tr>';
-        }).join('');
-        initUserButtons(tbody);
-        tbody.querySelectorAll('tr[data-user]').forEach(function(row) {
-            row.addEventListener('click', function(e) {
-                if (e.target.closest('.user-info-btn')) return;
-                openThread(row.dataset.user);
-            });
-        });
+        var searchEl = document.getElementById('list-search');
+        renderMailList(searchEl ? searchEl.value : '');
     } catch (err) {
         tbody.innerHTML = '<tr><td colspan="3" class="text-center text-danger py-4">加载失败：' + escapeHtml(err.message) + '</td></tr>';
         showToast('加载消息列表失败：' + err.message, 'danger');
@@ -855,6 +878,10 @@ <h5 class="modal-title" id="user-info-modal-title">用户信息</h5>
 
 document.getElementById('btn-refresh-list').addEventListener('click', loadMailList);
 
+document.getElementById('list-search').addEventListener('input', function() {
+    renderMailList(this.value);
+});
+
 document.getElementById('btn-compose-send').addEventListener('click', sendCompose);
 
 document.getElementById('btn-back').addEventListener('click', function() {

From d4f7bb163526f7d06a59ed54978a9de6eedfb731 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Sun, 15 Mar 2026 09:54:20 +0000
Subject: [PATCH 8/8] feat(messages.html): show badge next to username + clear
 search on back + auto-scroll fix

Co-authored-by: PythonSmall-Q <106425289+PythonSmall-Q@users.noreply.github.com>
---
 messages.html | 165 ++++++++++++++++++++++++++++++++++++--------------
 1 file changed, 119 insertions(+), 46 deletions(-)

diff --git a/messages.html b/messages.html
index d1f88849..c4d227af 100644
--- a/messages.html
+++ b/messages.html
@@ -451,6 +451,54 @@ <h5 class="modal-title" id="user-info-modal-title">用户信息</h5>
            escapeHtml(username) + '</button>';
 }
 
+function loadBadgesForContainer(container) {
+    // Group buttons by username in a single DOM pass
+    var byUsername = new Map();
+    container.querySelectorAll('.user-info-btn').forEach(function(btn) {
+        var u = btn.dataset.username;
+        if (!u) return;
+        if (!byUsername.has(u)) byUsername.set(u, []);
+        byUsername.get(u).push(btn);
+    });
+    byUsername.forEach(function(btns, u) {
+        getUserBadge(u).then(function(badge) {
+            if (!badge || !badge.Content) return;
+            btns.forEach(function(b) {
+                // Avoid duplicates on re-render
+                if (b.nextElementSibling && b.nextElementSibling.classList.contains('user-badge')) return;
+                var span = document.createElement('span');
+                span.className = 'badge ms-1 user-badge';
+                span.style.backgroundColor = badge.BackgroundColor;
+                span.style.color = badge.Color;
+                span.textContent = badge.Content;
+                b.insertAdjacentElement('afterend', span);
+            });
+        }).catch(function() {});
+    });
+}
+
+async function getUserBadge(username) {
+    var BADGE_TTL = 1000 * 60 * 60 * 24; // 24 h, matching XMOJ.user.js
+    var prefix = 'UserScript-User-' + username + '-Badge-';
+    var lastUpdate = localStorage.getItem(prefix + 'LastUpdateTime');
+    if (lastUpdate && (Date.now() - parseInt(lastUpdate)) < BADGE_TTL) {
+        return {
+            BackgroundColor: localStorage.getItem(prefix + 'BackgroundColor') || '',
+            Color: localStorage.getItem(prefix + 'Color') || '',
+            Content: localStorage.getItem(prefix + 'Content') || ''
+        };
+    }
+    var result = await apiCall('GetBadge', { UserID: username });
+    var badge = (result && result.Success && result.Data)
+        ? result.Data
+        : { BackgroundColor: '', Color: '', Content: '' };
+    localStorage.setItem(prefix + 'BackgroundColor', badge.BackgroundColor || '');
+    localStorage.setItem(prefix + 'Color', badge.Color || '');
+    localStorage.setItem(prefix + 'Content', badge.Content || '');
+    localStorage.setItem(prefix + 'LastUpdateTime', String(Date.now()));
+    return badge;
+}
+
 async function showUserInfo(username) {
     var title = document.getElementById('user-info-modal-title');
     var body = document.getElementById('user-info-modal-body');
@@ -462,57 +510,68 @@ <h5 class="modal-title" id="user-info-modal-title">用户信息</h5>
     body.innerHTML = '<div class="text-center py-3"><span class="spinner-border spinner-border-sm me-2"></span>加载中…</div>';
     userInfoModalBS.show();
 
-    try {
-        var res = await fetch(profileUrl, {
-            referrer: XMOJ_BASE + '/',
-            credentials: 'include'
-        });
-        if (!res.ok) throw new Error('HTTP ' + res.status);
-        var html = await res.text();
+    var results = await Promise.allSettled([
+        fetch(profileUrl, { referrer: XMOJ_BASE + '/', credentials: 'include' })
+            .then(function(r) { if (!r.ok) throw new Error('HTTP ' + r.status); return r.text(); }),
+        getUserBadge(username)
+    ]);
+
+    // ── Badge (render into title) ───────────────────────────────────────────
+    var badge = results[1].status === 'fulfilled' ? results[1].value : null;
+    if (badge && badge.Content) {
+        title.innerHTML = escapeHtml(username) +
+            ' <span class="badge ms-2" style="background-color:' + escapeHtml(badge.BackgroundColor) +
+            ';color:' + escapeHtml(badge.Color) + '">' + escapeHtml(badge.Content) + '</span>';
+    }
 
-        if (html.indexOf('No such User!') !== -1) {
-            body.innerHTML = '<p class="text-body-secondary mb-0">用户不存在。</p>';
-            return;
-        }
+    // ── Profile (render into body) ──────────────────────────────────────────
+    if (results[0].status === 'rejected') {
+        body.innerHTML = '<p class="text-body-secondary mb-0">无法加载用户信息，请直接访问资料页面。</p>';
+        return;
+    }
 
-        var doc = new DOMParser().parseFromString(html, 'text/html');
+    var html = results[0].value;
 
-        var captionEl = doc.querySelector('#statics > caption');
-        var nickname = '';
-        if (captionEl) {
-            // Caption text format: "UserID--Nickname"
-            var parts = captionEl.textContent.trim().split('--');
-            if (parts.length > 1) nickname = parts[1].trim();
-        }
+    if (html.indexOf('No such User!') !== -1) {
+        body.innerHTML = '<p class="text-body-secondary mb-0">用户不存在。</p>';
+        return;
+    }
 
-        var submitEl = doc.querySelector('#statics > tbody > tr:nth-child(3) > td:nth-child(2)');
-        var acceptEl = doc.querySelector('#statics > tbody > tr:nth-child(4) > td:nth-child(2)');
-        var submitCount = submitEl ? (parseInt(submitEl.textContent.trim()) || 0) : 0;
-        var acceptCount = acceptEl ? (parseInt(acceptEl.textContent.trim()) || 0) : 0;
-        var rating = submitCount > 0 ? ((acceptCount / submitCount) * 1000).toFixed(1) : '—';
-
-        var tbodyRows = doc.querySelectorAll('#statics > tbody > tr');
-        var email = '';
-        if (tbodyRows.length > 0) {
-            var lastCells = tbodyRows[tbodyRows.length - 1].querySelectorAll('td');
-            if (lastCells.length >= 2) email = lastCells[1].textContent.trim();
-        }
+    var doc = new DOMParser().parseFromString(html, 'text/html');
 
-        var rows = [];
-        if (nickname) rows.push(['昵称', escapeHtml(nickname)]);
-        rows.push(['评分', escapeHtml(acceptCount + ' / ' + submitCount) +
-            ' <span class="text-body-secondary small ms-1">(' + escapeHtml(String(rating)) + ')</span>']);
-        if (email) rows.push(['邮箱', '<a href="mailto:' + escapeHtml(email) + '">' + escapeHtml(email) + '</a>']);
-
-        body.innerHTML = '<dl class="row mb-0">' +
-            rows.map(function(r) {
-                return '<dt class="col-4 text-truncate">' + r[0] + '</dt>' +
-                       '<dd class="col-8 mb-2">' + r[1] + '</dd>';
-            }).join('') +
-            '</dl>';
-    } catch (e) {
-        body.innerHTML = '<p class="text-body-secondary mb-0">无法加载用户信息，请直接访问资料页面。</p>';
+    var captionEl = doc.querySelector('#statics > caption');
+    var nickname = '';
+    if (captionEl) {
+        // Caption text format: "UserID--Nickname"
+        var parts = captionEl.textContent.trim().split('--');
+        if (parts.length > 1) nickname = parts[1].trim();
+    }
+
+    var submitEl = doc.querySelector('#statics > tbody > tr:nth-child(3) > td:nth-child(2)');
+    var acceptEl = doc.querySelector('#statics > tbody > tr:nth-child(4) > td:nth-child(2)');
+    var submitCount = submitEl ? (parseInt(submitEl.textContent.trim()) || 0) : 0;
+    var acceptCount = acceptEl ? (parseInt(acceptEl.textContent.trim()) || 0) : 0;
+    var rating = submitCount > 0 ? ((acceptCount / submitCount) * 1000).toFixed(1) : '—';
+
+    var tbodyRows = doc.querySelectorAll('#statics > tbody > tr');
+    var email = '';
+    if (tbodyRows.length > 0) {
+        var lastCells = tbodyRows[tbodyRows.length - 1].querySelectorAll('td');
+        if (lastCells.length >= 2) email = lastCells[1].textContent.trim();
     }
+
+    var rows = [];
+    if (nickname) rows.push(['昵称', escapeHtml(nickname)]);
+    rows.push(['评分', escapeHtml(acceptCount + ' / ' + submitCount) +
+        ' <span class="text-body-secondary small ms-1">(' + escapeHtml(String(rating)) + ')</span>']);
+    if (email) rows.push(['邮箱', '<a href="mailto:' + escapeHtml(email) + '">' + escapeHtml(email) + '</a>']);
+
+    body.innerHTML = '<dl class="row mb-0">' +
+        rows.map(function(r) {
+            return '<dt class="col-4 text-truncate">' + r[0] + '</dt>' +
+                   '<dd class="col-8 mb-2">' + r[1] + '</dd>';
+        }).join('') +
+        '</dl>';
 }
 
 function initUserButtons(container) {
@@ -622,6 +681,7 @@ <h5 class="modal-title" id="user-info-modal-title">用户信息</h5>
             '</tr>';
     }).join('');
     initUserButtons(tbody);
+    loadBadgesForContainer(tbody);
     tbody.querySelectorAll('tr[data-user]').forEach(function(row) {
         row.addEventListener('click', function(e) {
             if (e.target.closest('.user-info-btn')) return;
@@ -690,6 +750,7 @@ <h5 class="modal-title" id="user-info-modal-title">用户信息</h5>
                 '</tr>';
         }).join('');
         initUserButtons(tbody);
+        loadBadgesForContainer(tbody);
         // Make images clickable to zoom
         tbody.querySelectorAll('img').forEach(function(img) {
             img.title = '点击放大';
@@ -697,6 +758,12 @@ <h5 class="modal-title" id="user-info-modal-title">用户信息</h5>
                 document.getElementById('img-modal-src').src = img.src;
                 imgModalBS.show();
             });
+            // Re-scroll after each image loads so the bottom stays in view
+            if (atBottom) {
+                img.addEventListener('load', function() {
+                    scrollEl.scrollTop = scrollEl.scrollHeight;
+                });
+            }
         });
         // Make links open in new tab
         tbody.querySelectorAll('a').forEach(function(a) {
@@ -704,7 +771,11 @@ <h5 class="modal-title" id="user-info-modal-title">用户信息</h5>
             a.setAttribute('rel', 'noopener noreferrer');
         });
         if (atBottom) {
-            scrollEl.scrollTop = scrollEl.scrollHeight;
+            // Use requestAnimationFrame so the browser has finished laying out
+            // the new rows before we read scrollHeight
+            requestAnimationFrame(function() {
+                scrollEl.scrollTop = scrollEl.scrollHeight;
+            });
         }
         isFirstLoad = false;
     } catch (err) {
@@ -887,7 +958,9 @@ <h5 class="modal-title" id="user-info-modal-title">用户信息</h5>
 document.getElementById('btn-back').addEventListener('click', function() {
     stopRefresh();
     currentThread = null;
+    document.getElementById('list-search').value = '';
     showScreen('screen-list');
+    renderMailList('');
     loadMailList();
 });