Upload 102 files

前端页面/components/全局设置组件.js

@@ -11,7 +11,8 @@
 import { showToast } from "./UI交互提示组件.js";
 import { setLanguage, getLanguage, t } from "./用户体验增强.js";
 import { clearAllCache } from "./性能优化工具.js";
-import { IS_WEB_MODE, getSettings, saveSettings } from "../core/全局配置.js";
+import { IS_WEB_MODE, LOCAL_PERFORMANCE, getSettings, saveSettings } from "../core/全局配置.js";
+import { getLocalPerformanceStats, clearLocalPerformanceStats } from "../core/本机性能统计.js";
 export { getSettings, saveSettings };
 import { getDiskCacheStats, clearDiskCache } from './缓存管理请求.js';
 
@@ -151,6 +152,23 @@ export function createSettingsView() {
                 ${t('settings.data_cache')}
             </h2>
 
+            <div class="setting-item">
+                <div class="ranking-settings__copy">
+                    <div class="ranking-settings__label" id="label-local-performance">${t('settings.performance_stats')}</div>
+                    <div class="ranking-settings__description" id="desc-local-performance">${t('settings.performance_stats_desc')}</div>
+                </div>
+                <button type="button" role="switch" id="switch-local-performance" aria-labelledby="label-local-performance" aria-describedby="desc-local-performance" class="setting-switch ${settings.enableLocalPerformanceStats === true ? 'active' : ''}"></button>
+            </div>
+            <section id="local-performance-panel" aria-labelledby="label-local-performance" hidden>
+                <div class="ranking-settings__stack setting-item">
+                    <div class="ranking-settings__stats" id="local-performance-stats" role="status" aria-live="polite"></div>
+                    <div class="ranking-settings__actions">
+                        <button type="button" id="btn-refresh-local-performance" class="cache-clear-btn">${t('settings.performance_refresh')}</button>
+                        <button type="button" id="btn-clear-local-performance" class="cache-clear-btn">${t('settings.performance_clear')}</button>
+                    </div>
+                </div>
+            </section>
+
             <!-- 设置项：缓存刷新间隔（滑条） -->
             <div class="ranking-settings__stack setting-item" >
                 <div class="ranking-settings__copy-wide" >
@@ -226,11 +244,12 @@ export function createSettingsView() {
      */
     function _bindSwitchHandler(selector, settingKey, labelKey, iconOn = '✅') {
         const switchEl = container.querySelector(selector);
+        const strictPreference = settingKey === 'enableKeyboardShortcuts' || settingKey === 'enableLocalPerformanceStats';
         switchEl.setAttribute("aria-checked", String(switchEl.classList.contains("active")));
         switchEl.onclick = () => {
-            if (settingKey === 'enableKeyboardShortcuts' && (cacheViewDisposed || !container.isConnected)) return;
+            if (strictPreference && (cacheViewDisposed || !container.isConnected)) return;
             let currentSettings;
-            try { currentSettings = getSettings(settingKey === 'enableKeyboardShortcuts' ? { strict: true } : undefined); }
+            try { currentSettings = getSettings(strictPreference ? { strict: true } : undefined); }
             catch { showToast(t('common.error'), 'error'); return; }
             const previousValue = switchEl.classList.contains("active");
             const newValue = !previousValue;
@@ -239,11 +258,11 @@ export function createSettingsView() {
             currentSettings[settingKey] = newValue;
             const saved = saveSettings(currentSettings);
             let confirmed = saved === true;
-            if (settingKey === 'enableKeyboardShortcuts') {
-                try { confirmed = confirmed && getSettings({ strict: true }).enableKeyboardShortcuts === newValue; }
+            if (strictPreference) {
+                try { confirmed = confirmed && getSettings({ strict: true })[settingKey] === newValue; }
                 catch { confirmed = false; }
             }
-            if (settingKey === 'enableKeyboardShortcuts' && !confirmed) {
+            if (strictPreference && !confirmed) {
                 switchEl.classList.toggle('active', previousValue);
                 switchEl.setAttribute('aria-checked', String(previousValue));
                 showToast(t('common.error'), 'error');
@@ -303,6 +322,7 @@ export function createSettingsView() {
 
     // 🎛️ 开关控制：创作者背景图 / 榜单切换动画 / 动画音效
     _bindSwitchHandler("#switch-keyboard-shortcuts", "enableKeyboardShortcuts", "settings.keyboard_combinations");
+    _bindSwitchHandler("#switch-local-performance", "enableLocalPerformanceStats", "settings.performance_stats");
     _bindSwitchHandler("#switch-creator-banner", "showCreatorBanner", "settings.creator_banner", "✅");
     _bindSwitchHandler("#switch-animations",     "enableAnimations",  "settings.animations",     "✨");
     _bindSwitchHandler("#switch-sound-effects",  "enableSoundEffects", "settings.sound",         "🔊");
@@ -377,6 +397,11 @@ export function createSettingsView() {
         if (cacheViewDisposed) return;
         cacheViewDisposed = true;
         container.querySelector("#switch-keyboard-shortcuts").onclick = null;
+        container.querySelector("#switch-local-performance").onclick = null;
+        refreshPerformance.onclick = null;
+        clearPerformance.onclick = null;
+        window.removeEventListener('comfy-settings-changed', onPerformancePreference);
+        window.removeEventListener('storage', onPerformancePreference);
         languageGeneration++;
         clearTimeout(languageTimer);
         languageTimer = null;
@@ -385,6 +410,43 @@ export function createSettingsView() {
         statsController = null;
     };
 
+    const performancePanel = container.querySelector('#local-performance-panel');
+    const performanceStats = container.querySelector('#local-performance-stats');
+    const performanceSwitch = container.querySelector('#switch-local-performance');
+    const refreshPerformance = container.querySelector('#btn-refresh-local-performance');
+    const clearPerformance = container.querySelector('#btn-clear-local-performance');
+    function renderPerformanceStats() {
+        const snapshot = getLocalPerformanceStats();
+        performancePanel.hidden = !snapshot.enabled;
+        performanceSwitch.classList.toggle('active', snapshot.enabled);
+        performanceSwitch.setAttribute('aria-checked', String(snapshot.enabled));
+        performanceStats.replaceChildren();
+        if (!snapshot.enabled) return;
+        if (!snapshot.rows.length) {
+            performanceStats.textContent = t('settings.performance_empty');
+            return;
+        }
+        for (const row of snapshot.rows) {
+            const line = document.createElement('div');
+            line.className = 'ranking-settings__stat';
+            line.textContent = `${t(LOCAL_PERFORMANCE.LABELS[row.category])} · ${t('settings.performance_row', { count: row.count, average: (row.totalMs / row.count).toFixed(1), hits: row.cacheHits })}`;
+            performanceStats.appendChild(line);
+        }
+    }
+    function onPerformancePreference() {
+        if (cacheViewDisposed || !container.isConnected) return;
+        renderPerformanceStats();
+    }
+    refreshPerformance.onclick = onPerformancePreference;
+    clearPerformance.onclick = () => {
+        if (cacheViewDisposed || !container.isConnected) return;
+        clearLocalPerformanceStats();
+        renderPerformanceStats();
+    };
+    window.addEventListener('comfy-settings-changed', onPerformancePreference);
+    window.addEventListener('storage', onPerformancePreference);
+    renderPerformanceStats();
+
     async function loadCacheStats() {
         const generation = ++statsGeneration;
         statsController?.abort();

前端页面/components/用户体验_国际化.js

@@ -275,6 +275,12 @@ const translations = {
         'settings.cache_expire': '数据刷新间隔（秒）',
         'settings.cache_expire_desc': '设置本地缓存数据的刷新间隔，过期后切换页面时会自动后台更新数据。最小60秒，最大86400秒（1天）。',
         'settings.cache_trigger_desc': '当缓存超过设定时间后，切换页面标签时会自动在后台拉取最新数据并静默更新，不影响使用流畅度。手动刷新不受此设置影响。',
+        'settings.performance_stats': "本机性能统计",
+        'settings.performance_stats_desc': "默认关闭。仅汇总当前页面的榜单请求耗时和缓存命中，不记录账号或内容，也不上传。关闭或刷新页面后清空。",
+        'settings.performance_empty': "暂无统计，浏览榜单后可在此刷新查看。",
+        'settings.performance_row': "已结束 {count} 次请求 · 平均 {average} 毫秒 · 缓存返回 {hits}/{count}",
+        'settings.performance_refresh': "刷新统计",
+        'settings.performance_clear': "清空统计",
         'settings.cache_stats': '缓存统计',
         'settings.cache_stats_hint': '非卸载，不推荐清除磁盘缓存',
         'settings.cache_disk_images': '图片缓存',
@@ -2070,6 +2076,12 @@ const translations = {
         'settings.cache_expire': 'Data Refresh Interval (seconds)',
         'settings.cache_expire_desc': 'Set the local cache refresh interval. Data will be silently updated in the background when switching tabs after expiry. Minimum 60 seconds, maximum 86400 seconds (1 day).',
         'settings.cache_trigger_desc': 'When the cache exceeds the set time, switching tabs will automatically fetch the latest data in the background and update silently without affecting usability. Manual refresh is not affected by this setting.',
+        'settings.performance_stats': "Local performance statistics",
+        'settings.performance_stats_desc': "Off by default. Summarizes list request times and cache hits on this page only. No accounts or content are recorded or uploaded. Disabling or reloading clears the totals.",
+        'settings.performance_empty': "No statistics yet. Browse the lists, then refresh here.",
+        'settings.performance_row': "{count} finished requests · Average {average} ms · Cached {hits}/{count}",
+        'settings.performance_refresh': "Refresh statistics",
+        'settings.performance_clear': "Clear statistics",
         'settings.cache_stats': 'Cache Statistics',
         'settings.cache_stats_hint': 'Not uninstall, clearing disk cache is not recommended',
         'settings.cache_disk_images': 'Image Cache',

前端页面/core/全局配置.js

@@ -112,6 +112,15 @@ export const API = {
 };
 
 
+export const LOCAL_PERFORMANCE = Object.freeze({
+    MAX_ENDPOINT_CHARS: 4096,
+    MAX_COUNT: 1000000,
+    MAX_DURATION_MS: 600000,
+    ITEM_CATEGORIES: Object.freeze({ tool: 'tools', skill: 'skills', app: 'apps', recommend: 'recommends' }),
+    LIST_CATEGORIES: Object.freeze({ '/api/creators': 'creators', '/api/creators/search': 'creators', '/api/tasks': 'tasks', '/api/posts': 'posts', '/api/prompts': 'prompts' }),
+    LABELS: Object.freeze({ tools: 'nav.tools', skills: 'nav.skills', apps: 'nav.apps', recommends: 'nav.recommends', creators: 'nav.creators', tasks: 'nav.tasks', posts: 'nav.posts', prompts: 'nav.prompts' })
+});
+
 export const SKILL_INSTALL = Object.freeze({
     PATH: '/community_hub/skill_install',
     PREFLIGHT_TIMEOUT: 30000,
@@ -916,7 +925,8 @@ const SETTINGS_KEY = "ComfyCommunity_Settings";
 
 // 🔧 默认设置值
 const DEFAULT_SETTINGS = {
-    enableKeyboardShortcuts: false,
+    enableKeyboardShortcuts: false,
+    enableLocalPerformanceStats: false,
     showCreatorBanner: true,  // 创作者卡片显示背景图
     enableAnimations: true,   // ✨ 榜单切换动画
     enableSoundEffects: true, // 🔊 动画音效

前端页面/core/本机性能统计.js

@@ -0,0 +1,81 @@
+import { LOCAL_PERFORMANCE, getSettings } from './全局配置.js';
+
+let enabled = false;
+let generation = 0;
+const totals = new Map();
+
+function syncPreference() {
+    let next = false;
+    try { next = getSettings({ strict: true }).enableLocalPerformanceStats === true; } catch {}
+    if (next !== enabled) {
+        enabled = next;
+        generation++;
+        totals.clear();
+    }
+}
+
+function now() {
+    try {
+        const value = performance.now();
+        return Number.isFinite(value) && value >= 0 ? value : null;
+    } catch { return null; }
+}
+
+function createSample(category) {
+    const started = now();
+    if (started === null) return null;
+    const ownGeneration = generation;
+    let finished = false;
+    let cached = false;
+    return Object.freeze({
+        cacheHit() { cached = true; },
+        discard() { finished = true; },
+        finish() {
+            if (finished) return;
+            finished = true;
+            syncPreference();
+            if (!enabled || ownGeneration !== generation) return;
+            const ended = now();
+            if (ended === null || ended < started) return;
+            const previous = totals.get(category) || { count: 0, cacheHits: 0, totalMs: 0 };
+            if (previous.count >= LOCAL_PERFORMANCE.MAX_COUNT) return;
+            totals.set(category, {
+                count: previous.count + 1,
+                cacheHits: previous.cacheHits + (cached ? 1 : 0),
+                totalMs: previous.totalMs + Math.min(ended - started, LOCAL_PERFORMANCE.MAX_DURATION_MS)
+            });
+        }
+    });
+}
+
+export function beginLocalPerformanceSample(endpoint, method = 'GET') {
+    syncPreference();
+    if (!enabled || typeof method !== 'string' || method.toUpperCase() !== 'GET'
+        || typeof endpoint !== 'string' || endpoint.length > LOCAL_PERFORMANCE.MAX_ENDPOINT_CHARS || endpoint.includes('#')) return null;
+    const separator = endpoint.indexOf('?');
+    const path = separator < 0 ? endpoint : endpoint.slice(0, separator);
+    let category;
+    if (path === '/api/items') {
+        const types = new URLSearchParams(separator < 0 ? '' : endpoint.slice(separator + 1)).getAll('type');
+        if (types.length === 1 && Object.hasOwn(LOCAL_PERFORMANCE.ITEM_CATEGORIES, types[0])) category = LOCAL_PERFORMANCE.ITEM_CATEGORIES[types[0]];
+    } else if (Object.hasOwn(LOCAL_PERFORMANCE.LIST_CATEGORIES, path)) category = LOCAL_PERFORMANCE.LIST_CATEGORIES[path];
+    return category ? createSample(category) : null;
+}
+
+export function getLocalPerformanceStats() {
+    syncPreference();
+    return {
+        enabled,
+        rows: Object.keys(LOCAL_PERFORMANCE.LABELS).filter(category => totals.has(category))
+            .map(category => ({ category, ...totals.get(category) }))
+    };
+}
+
+export function clearLocalPerformanceStats() {
+    generation++;
+    totals.clear();
+}
+
+syncPreference();
+window.addEventListener('comfy-settings-changed', syncPreference);
+window.addEventListener('storage', syncPreference);

前端页面/core/网络请求_基础设施.js

@@ -10,7 +10,8 @@
 // ==========================================
 
 import { removeCache, getCacheWithMeta } from "../components/性能优化工具.js";
-import { API, CACHE } from "./全局配置.js";
+import { API, CACHE } from "./全局配置.js";
+import { beginLocalPerformanceSample } from "./本机性能统计.js";
 import { eventBus, EVENTS, logoutAndClearUserData, isOnline, isCloudReachable, markCloudDown, markCloudUp } from "./状态管理.js";
 import { CACHE_CONFIG, CACHE_INVALIDATION_MAP, invalidateRelatedCache, _getCacheTTL, getCache, setCache, isPrivateApiGet } from "./网络请求_缓存管理.js";
 import { unproxyImages } from "./网络请求_图片代理.js";
@@ -279,7 +280,13 @@ const requestQueue = {
     }
 };
 
-async function request(endpoint, options = {}) {
+async function request(endpoint, options = {}) {
+    const sample = beginLocalPerformanceSample(endpoint, options.method || 'GET');
+    try { return await performRequest(endpoint, options, sample); }
+    finally { sample?.finish(); }
+}
+
+async function performRequest(endpoint, options = {}, sample = null) {
     const privateRead = (options.method || "GET").toUpperCase() === "GET" && isPrivateApiGet(endpoint);
     if (privateRead) {
         removeCache(`api_${endpoint}`);
@@ -330,6 +337,7 @@ async function request(endpoint, options = {}) {
         const cached = getCache(cacheKey);
         if (cached) {
             const proxyFn = await getProxyImages();
+            sample?.cacheHit();
             return proxyFn(cached);
         }
     }
@@ -361,6 +369,7 @@ async function request(endpoint, options = {}) {
         if (fallbackMeta.found) {
             console.log(`📴 ${isOnline() ? '☁️ 云端不可达' : '离线模式'}：返回${fallbackMeta.expired ? '过期' : ''}缓存`);
             const proxyFn2 = await getProxyImages();
+            sample?.cacheHit();
             return proxyFn2(fallbackMeta.value);
         }
         // 🔧 修复：原为硬编码中文，而本错误会被 12+ 处调用方直接 showToast(err.message) 弹给用户，
@@ -372,6 +381,7 @@ async function request(endpoint, options = {}) {
     // ⚡ P1性能优化：请求去重（相同GET请求只发一次）
     if (trackPendingRequest) {
         if (pendingRequests.has(cacheKey)) {
+            sample?.discard();
             return pendingRequests.get(cacheKey);
         }
     }
@@ -472,6 +482,7 @@ async function request(endpoint, options = {}) {
                                 && response.headers?.get?.('ETag') === conditionalMeta.etag
                                 && currentMeta.found && currentMeta.etag === conditionalMeta.etag
                                 && currentMeta.value === conditionalMeta.value) {
+                                sample?.cacheHit();
                                 validatedData = currentMeta.value;
                             } else {
                                 // 缓存可能在等待期间被清理/写操作失效；同一预算内补取完整响应。
@@ -656,6 +667,7 @@ async function request(endpoint, options = {}) {
             if (fallback.found) {
                 console.warn('📴 网络请求失败，回退到本地缓存');
                 const proxyFn4 = await getProxyImages();
+                sample?.cacheHit();
                 return proxyFn4(fallback.value);  // 返回过期缓存数据
             }
         }

前端页面/profile/个人中心视图.js

@@ -1,349 +1,370 @@
-// 前端页面/profile/个人中心视图.js
-import { api, captureRequestSession, requestCancelManager } from "../core/网络请求API.js";
-import { openChatModal } from "../social/私信聊天组件.js";
-import { createSettingsForm } from "./个人设置表单组件.js";
-import { renderProfileListContent } from "./个人列表组件.js";
-import { showToast, showConfirm } from "../components/UI交互提示组件.js";
-import { t } from "../components/用户体验增强.js";
-// ==========================================
-// 资金模块 (充值/提现)
-// ==========================================
-import { openRechargeModal } from "../market/资金与钱包_充值组件.js";
-import { openWithdrawModal } from "../market/资金与钱包_提现组件.js";
-import { buildProfileHTML } from "./个人中心_UI模板.js";
-import { openTipModal } from "./个人中心_赞赏组件.js";
-import { getBannerCacheKey, getCurrentAccount, IS_WEB_MODE, CACHE, UI, API, getCachedProfile, setCachedProfile, normalizeProfileImageUrl } from "../core/全局配置.js";
-import { logoutAndClearUserData, eventBus, EVENTS } from "../core/状态管理.js";
-
-
-import { createTaskViewScope, subscribeTaskSessionChanges } from '../task/任务视图生命周期.js';
-import { endProfileListView } from './个人列表缓存.js';
-import { normalizeProfileData, normalizeWalletData, mergeStoredProfile } from './个人资料工具.js';
-
-let profileSequence = 0;
-let profileNavigation = 0;
-const safeGet = key => { try { return localStorage.getItem(key); } catch (_) { return null; } };
-const safeSet = (key, value) => { try { localStorage.setItem(key, value); } catch (_) {} };
-function sessionStorages() {
-    return ['localStorage', 'sessionStorage'].map(name => { try { return window[name]; } catch (_) { return null; } });
-}
-
-// ==========================================
-// 🖼️ 个人资料卡背景图云端同步
-// ==========================================
-// 作用：当本地无缓存但云端有背景图时，下载并缓存到本地
-async function syncBannerCache(account, bannerUrl, scope, apply) {
-    const source = normalizeProfileImageUrl(bannerUrl, true);
-    if (!/^https?:\/\//i.test(source) || !scope.isCurrent()
-        || normalizeProfileImageUrl(safeGet(getBannerCacheKey(account)))) return;
-    const controller = new AbortController();
-    const release = scope.addCleanup(() => controller.abort());
-    const timer = setTimeout(() => controller.abort(), API.BACKGROUND_TIMEOUT);
-    try {
-        const fetchUrl = IS_WEB_MODE ? source : API.LOCAL_IMAGE_PROXY_PREFIX + encodeURIComponent(source);
-        const response = await fetch(fetchUrl, { signal: controller.signal });
-        if (!response.ok || !scope.isCurrent()) return;
-        const blob = await response.blob();
-        if (!scope.isCurrent() || !/^image\/(png|jpeg|webp|gif)$/.test(blob.type)) return;
-        if (blob.size <= UI.PROFILE_BANNER_CACHE_BYTES) {
-            const data = await new Promise(resolve => {
-                const reader = new FileReader();
-                const off = scope.addCleanup(() => { reader.abort(); resolve(null); });
-                reader.onload = () => { off(); resolve(reader.result); };
-                reader.onerror = reader.onabort = () => { off(); resolve(null); };
-                reader.readAsDataURL(blob);
-            });
-            if (!scope.isCurrent() || typeof data !== 'string') return;
-            safeSet(getBannerCacheKey(account), data);
-        }
-        if (!scope.isCurrent()) return;
-        const blobUrl = URL.createObjectURL(blob);
-        scope.addCleanup(() => URL.revokeObjectURL(blobUrl));
-        apply(blobUrl);
-    } catch (_) { /* 背景同步失败保留当前背景，不影响资料。 */ }
-    finally { clearTimeout(timer); release(); }
-}
-
-async function _fetchProfileAndWallet(account, { own = false, options = {} } = {}) {
-    const profileRequest = api.getUserProfile(account, options).then(response => {
-        if (response?.status !== 'success') throw new Error('Invalid profile response');
-        return normalizeProfileData(response.data, account, own);
-    });
-    if (!own) return profileRequest;
-    const [profile, wallet] = await Promise.allSettled([profileRequest, api.getWallet(account, options)]);
-    return { ...(profile.status === 'fulfilled' ? profile.value : {}),
-        ...(wallet.status === 'fulfilled' ? normalizeWalletData(wallet.value) : {}) };
-}
-
-/** 统一设置 Tab 按钮点击事件 */
-function _setupTabButton(container, selector, tabId, onSwitch) {
-    const btn = container.querySelector(selector);
-    if (btn) btn.onclick = () => onSwitch(tabId);
-}
-
-export function showUserProfile(initialUserData, currentUser = null, isMe = true) {
-    const container = document.createElement("div");
-    container.className = "profile-view";
-
-    let isSettingsView = false;
-    let activeTab = safeGet(`Profile_ActiveTab_${isMe}`) || "published";
-    let userData = normalizeProfileData(initialUserData, initialUserData.account, isMe);
-    let constructing = true;
-    let renderGeneration = 0;
-    let logoutPending = false;
-    const componentId = `profile-detail-${++profileSequence}`;
-    const releaseChild = () => {
-        const list = container.querySelector('#profile-list-container');
-        if (list) endProfileListView(list);
-        container.querySelector('.ranking-settings-form')?._cleanup?.();
-    };
-    const scope = createTaskViewScope({
-        sessionMatches: captureRequestSession(), connected: () => constructing || container.isConnected,
-        subscribe: notify => subscribeTaskSessionChanges(notify, { target: window, eventBus, events: EVENTS,
-            userKey: CACHE.LEGACY_KEYS.USER, tokenKey: CACHE.LEGACY_KEYS.TOKEN }),
-        cancelReads: () => requestCancelManager.cancelAll(componentId),
-        invalidate: () => {
-            releaseChild(); userData = { account: initialUserData.account };
-            container.replaceChildren();
-            const back = document.createElement('button'); back.type = 'button';
-            back.className = 'about-back'; back.textContent = t('common.back');
-            back.onclick = () => window.dispatchEvent(new CustomEvent('comfy-route-back'));
-            const status = document.createElement('div'); status.setAttribute('role', 'status');
-            status.textContent = t('auth.session_changed'); container.append(back, status);
-        }
-    });
-    container._profileScope = scope;
-    container._profileReadOptions = { componentId, timeout: API.BACKGROUND_TIMEOUT, retries: API.BACKGROUND_RETRIES };
-    container._cleanup = () => { releaseChild(); scope.dispose(); container.replaceChildren(); };
-    // 独立挂载者也能释放；正常侧栏路由在移除前调用 _cleanup。
-    const observer = new MutationObserver(() => { if (!container.isConnected) container._cleanup(); });
-    observer.observe(document.body, { childList: true, subtree: true });
-    scope.addCleanup(() => { observer.disconnect(); releaseChild(); });
-
-    function render() {
-        if (!scope.isCurrent()) return;
-        releaseChild();
-        const generation = ++renderGeneration;
-        const current = () => scope.isCurrent() && renderGeneration === generation;
-        container.innerHTML = "";
-
-        let isFollowing = false;
-        if (currentUser && userData.followers) { isFollowing = userData.followers.includes(currentUser.account); }
-
-        const privacy = userData.privacy || {};
-        const followingCount = (!isMe && privacy.follows) ? "***" : (userData.following ? userData.following.length : 0);
-
-        const tabs = [{ id: "published", label: isMe ? t('profile.my_published') : t('profile.their_published') }];
-        if (isMe) tabs.push({ id: "acquired", label: t('profile.my_purchased') });
-        if (isMe) tabs.push({ id: "my_tasks", label: t('profile.my_tasks') });
-        if (isMe) tabs.push({ id: "transactions", label: t('profile.transactions') });
-        if (isMe) tabs.push({ id: "my_posts", label: t('profile.my_posts') });
-        if (isMe) tabs.push({ id: "my_prompts", label: t('prompt.my_prompts') });
-        if (isMe) tabs.push({ id: "collected", label: t('profile.my_collected') });
-        if (isMe || !privacy.likes) tabs.push({ id: "liked", label: t('profile.recent_likes') });
-        if (isMe || !privacy.follows) tabs.push({ id: "following", label: t('profile.following') });
-        if (isMe || !privacy.followers) tabs.push({ id: "followers", label: t('profile.followers') });
-
-        if (!tabs.find(t => t.id === activeTab)) activeTab = "published";
-
-        // 调用解耦的模板引擎生成 HTML
-        container.innerHTML = buildProfileHTML(userData, isMe, isSettingsView, isFollowing, followingCount, activeTab, tabs);
-
-        if (isSettingsView && isMe) {
-            const settingsContainer = createSettingsForm(
-                userData,
-                () => { if (!current()) return; isSettingsView = false; render(); },
-                (newUserData) => {
-                    if (!current()) return;
-                    userData = normalizeProfileData(newUserData, userData.account, true);
-                    if (container.updateData) container.updateData(userData);
-                    isSettingsView = false;
-                    render();
-                },
-                { isCurrent: current }
-            );
-            container.appendChild(settingsContainer);
-            container.querySelector("#btn-back-profile").onclick = () => { isSettingsView = false; render(); };
-        } else {
-            container.querySelector("#btn-back-profile").onclick = () => window.dispatchEvent(new CustomEvent("comfy-route-back"));
-
-            if (isMe) {
-                container.querySelector("#btn-wallet").onclick = () => {
-                    if (!current()) return;
-                    openRechargeModal(currentUser, (newBalance) => { if (!current()) return; userData.balance = newBalance; render(); });
-                };
-                container.querySelector("#btn-withdraw").onclick = () => {
-                    if (!current()) return;
-                    openWithdrawModal(currentUser, async () => {
-                        if (!current()) return;
-                        // 提现成功后重新拉取用户数据刷新余额
-                        try {
-                            const walletResponse = await api.getWallet(currentUser.account, { componentId });
-                            if (!current()) return;
-                            const walletRes = normalizeWalletData(walletResponse);
-                            userData.balance = walletRes.balance ?? userData.balance;
-                            userData.earn_balance = walletRes.earn_balance ?? userData.earn_balance;
-                            userData.tip_balance = walletRes.tip_balance ?? userData.tip_balance;
-                            userData.total_withdrawn = walletRes.total_withdrawn ?? userData.total_withdrawn;
-                        } catch (err) {
-                            if (!current()) return;
-                            console.warn("提现后刷新钱包数据失败");
-                        }
-                        render();
-                    });
-                };
-
-                container.querySelector("#btn-open-settings").onclick = () => { isSettingsView = true; render(); };
-                container.querySelector("#btn-logout").onclick = async () => {
-                    if (!current() || logoutPending) return;
-                    const currentAccount = getCurrentAccount();
-                    logoutPending = true;
-                    try {
-                        if (!await showConfirm(t('confirm.logout')) || !scope.isCurrent()
-                            || getCurrentAccount() !== currentAccount) return;
-                        logoutAndClearUserData(currentAccount);
-                        window.dispatchEvent(new CustomEvent("comfy-route-back"));
-                        window.dispatchEvent(new CustomEvent("comfy-user-logout"));
-                        showToast(t('feedback.logged_out'), "info");
-                    } finally {
-                        logoutPending = false;
-                    }
-                };
-            } else {
-                const btnTip = container.querySelector("#btn-tip-user");
-                if (btnTip) {
-                    btnTip.onclick = async () => {
-                        if (!current()) return;
-                        if (!currentUser) return showToast(t('feedback.login_required_tip'), "warning");
-                        await openTipModal(currentUser, userData, (newBalance) => {
-                            if (!current()) return;
-                            currentUser.balance = newBalance;
-                            openOtherUserProfileModal(userData.account, currentUser);
-                        }, null, { isCurrent: current });
-                    };
-                }
-
-                const btnFollow = container.querySelector("#btn-follow-user");
-                if (btnFollow) {
-                    btnFollow.onclick = async () => {
-                        if (!current()) return;
-                        if (!currentUser) return showToast(t('feedback.login_required'), "warning");
-                        btnFollow.innerHTML = `⏳ ${t('common.processing')}...`; btnFollow.disabled = true;
-                        try {
-                            const newStatus = !isFollowing;
-                            const response = await api.toggleFollow(currentUser.account, userData.account, newStatus);
-                            if (!current()) return;
-                            if (response?.status !== 'success') throw new Error('Invalid follow response');
-                            isFollowing = newStatus;
-
-                            if (!userData.followers) userData.followers = [];
-                            if (isFollowing) { if (!userData.followers.includes(currentUser.account)) userData.followers.push(currentUser.account); }
-                            else { userData.followers = userData.followers.filter(a => a !== currentUser.account); }
-                            render();
-                        } catch (_) { if (!current()) return; showToast(t('feedback.operation_failed'), "error"); btnFollow.innerHTML = isFollowing ? `✔️ ${t('social.followed')}` : `➕ ${t('social.follow')}`; }
-                        finally { if (current()) btnFollow.disabled = false; }
-                    };
-                }
-
-                const btnSendMsg = container.querySelector("#btn-send-msg");
-                if (btnSendMsg) {
-                    btnSendMsg.onclick = () => {
-                        if (!current()) return;
-                        if (!currentUser) return showToast(t('feedback.login_required'), "warning");
-                        openChatModal(currentUser, userData.account);
-                    };
-                }
-            }
-
-            container.querySelectorAll(".profile-tab-btn").forEach(btn => {
-                btn.onclick = (e) => {
-                    if (!current()) return;
-                    activeTab = e.currentTarget.getAttribute("data-id");
-                    safeSet(`Profile_ActiveTab_${isMe}`, activeTab);
-                    render();
-                };
-            });
-
-            // 粉丝/关注数点击跳转对应列表
-            const _switchTab = (tabId) => { if (!current()) return; activeTab = tabId; safeSet(`Profile_ActiveTab_${isMe}`, tabId); render(); };
-            _setupTabButton(container, "#btn-followers", "followers", _switchTab);
-            _setupTabButton(container, "#btn-following", "following", _switchTab);
-
-            const listDOM = container.querySelector("#profile-list-container");
-            listDOM._profileSessionCurrent = current;
-            listDOM._profileAddCleanup = cleanup => scope.addCleanup(cleanup);
-            renderProfileListContent(activeTab, listDOM, userData, currentUser, openOtherUserProfileModal);
-        }
-    }
-
-    container.updateData = function(newUserData) {
-        if (!scope.isCurrent() || !newUserData || typeof newUserData !== 'object' || Array.isArray(newUserData)) return;
-        const safeNewData = normalizeProfileData({ ...userData, ...newUserData }, userData.account, isMe);
-        Object.keys(safeNewData).forEach(key => safeNewData[key] == null && delete safeNewData[key]);
-        const mergedData = { ...userData, ...safeNewData };
-        if (JSON.stringify(userData) !== JSON.stringify(mergedData)) {
-            userData = mergedData;
-            if (!isSettingsView) { render(); }
-        }
-    };
-
-    render();
-    constructing = false;
-    return container;
-}
-
-export function openUserProfileModal(userData) {
-    ++profileNavigation;
-    const view = showUserProfile(userData, userData, true);
-    window.dispatchEvent(new CustomEvent("comfy-route-view", { detail: { view } }));
-    _fetchProfileAndWallet(userData.account, { own: true, options: view._profileReadOptions }).then(freshData => {
-        if (!view._profileScope.isCurrent()) return;
-        mergeStoredProfile(userData.account, freshData, sessionStorages(), CACHE.LEGACY_KEYS.USER);
-        view.updateData(freshData);
-        if (freshData.bannerUrl) syncBannerCache(userData.account, freshData.bannerUrl, view._profileScope,
-            blobUrl => view.updateData({ bannerUrl: blobUrl }));
-    }).catch(() => { if (view._profileScope.isCurrent()) console.warn('后台更新本人资料失败'); });
-}
-
-export async function openOtherUserProfileModal(targetAccount, currentUser) {
-    if (currentUser && currentUser.account === targetAccount) return openUserProfileModal(currentUser);
-    const generation = ++profileNavigation;
-    const sessionMatches = captureRequestSession();
-    const componentId = `profile-open-${++profileSequence}`;
-    let activeContainer = null;
-    const cached = getCachedProfile(targetAccount);
-    if (cached) {
-        try {
-            activeContainer = showUserProfile({ ...cached, account: targetAccount }, currentUser, false);
-            window.dispatchEvent(new CustomEvent('comfy-route-view', { detail: { view: activeContainer } }));
-        } catch (_) {}
-    }
-    let obsolete = false;
-    const cancel = () => { obsolete = true; requestCancelManager.cancelAll(componentId); };
-    const onRouteView = event => { if (event.detail?.view !== activeContainer) cancel(); };
-    window.addEventListener('comfy-route-back', cancel);
-    window.addEventListener('comfy-route-view', onRouteView);
-    const unsubscribe = subscribeTaskSessionChanges(force => { if (force || !sessionMatches()) cancel(); }, {
-        target: window, eventBus, events: EVENTS, userKey: CACHE.LEGACY_KEYS.USER, tokenKey: CACHE.LEGACY_KEYS.TOKEN
-    });
-    const current = () => !obsolete && generation === profileNavigation && sessionMatches()
-        && (!activeContainer || activeContainer._profileScope.isCurrent());
-    try {
-        const freshData = await _fetchProfileAndWallet(targetAccount, {
-            options: activeContainer?._profileReadOptions || { componentId }
-        });
-        if (!current()) return;
-        setCachedProfile(targetAccount, freshData);
-        if (activeContainer) activeContainer.updateData(freshData);
-        else {
-            activeContainer = showUserProfile(freshData, currentUser, false);
-            window.dispatchEvent(new CustomEvent('comfy-route-view', { detail: { view: activeContainer } }));
-        }
-    } catch (_) {
-        if (current() && !activeContainer) showToast(t('feedback.user_fetch_failed'), 'error');
-    } finally {
-        unsubscribe();
-        window.removeEventListener('comfy-route-back', cancel);
-        window.removeEventListener('comfy-route-view', onRouteView);
-    }
-}
+// 前端页面/profile/个人中���视图.js
+import { api, captureRequestSession, requestCancelManager } from "../core/网络请求API.js";
+import { openChatModal } from "../social/私信聊天组件.js";
+import { createSettingsForm } from "./个人设置表单组件.js";
+import { renderProfileListContent } from "./个人列表组件.js";
+import { showToast, showConfirm } from "../components/UI交互提示组件.js";
+import { t } from "../components/用户体验增强.js";
+// ==========================================
+// 资金模块 (充值/提现)
+// ==========================================
+import { openRechargeModal } from "../market/资金与钱包_充值组件.js";
+import { openWithdrawModal } from "../market/资金与钱包_提现组件.js";
+import { buildProfileHTML } from "./个人中心_UI模板.js";
+import { openTipModal } from "./个人中心_赞赏组件.js";
+import { getBannerCacheKey, getCurrentAccount, IS_WEB_MODE, CACHE, UI, API, getCachedProfile, setCachedProfile, normalizeProfileImageUrl } from "../core/全局配置.js";
+import { logoutAndClearUserData, eventBus, EVENTS } from "../core/状态管理.js";
+
+
+import { createTaskViewScope, subscribeTaskSessionChanges } from '../task/任务视图生命周期.js';
+import { endProfileListView } from './个人列表缓存.js';
+import { normalizeProfileData, normalizeWalletData, mergeStoredProfile } from './个人资料工具.js';
+
+let profileSequence = 0;
+let profileNavigation = 0;
+const safeGet = key => { try { return localStorage.getItem(key); } catch (_) { return null; } };
+const safeSet = (key, value) => { try { localStorage.setItem(key, value); } catch (_) {} };
+function sessionStorages() {
+    return ['localStorage', 'sessionStorage'].map(name => { try { return window[name]; } catch (_) { return null; } });
+}
+
+// ==========================================
+// 🖼️ 个人资料卡背景图云端同步
+// ==========================================
+// 作用：当本地无缓存但云端有背景图时，下载并缓存到本地
+async function syncBannerCache(account, bannerUrl, scope, apply) {
+    const source = normalizeProfileImageUrl(bannerUrl, true);
+    if (!/^https?:\/\//i.test(source) || !scope.isCurrent()
+        || normalizeProfileImageUrl(safeGet(getBannerCacheKey(account)))) return;
+    const controller = new AbortController();
+    const release = scope.addCleanup(() => controller.abort());
+    const timer = setTimeout(() => controller.abort(), API.BACKGROUND_TIMEOUT);
+    try {
+        const fetchUrl = IS_WEB_MODE ? source : API.LOCAL_IMAGE_PROXY_PREFIX + encodeURIComponent(source);
+        const response = await fetch(fetchUrl, { signal: controller.signal });
+        if (!response.ok || !scope.isCurrent()) return;
+        const type = new Blob([], { type: response.headers.get('Content-Type') || '' }).type;
+        if (!/^image\/(png|jpeg|webp|gif)$/.test(type)) return;
+        const length = response.headers.get('Content-Length');
+        if (length && /^\d+$/.test(length) && Number(length) > UI.PROFILE_BANNER_CACHE_BYTES) return;
+        if (!response.body?.getReader) return;
+        const reader = response.body.getReader();
+        const chunks = [];
+        let bytes = 0, complete = false;
+        try {
+            while (true) {
+                const { done, value } = await reader.read();
+                if (!scope.isCurrent()) return;
+                if (done) { complete = true; break; }
+                if (!(value instanceof Uint8Array) || value.byteLength > UI.PROFILE_BANNER_CACHE_BYTES - bytes) return;
+                bytes += value.byteLength;
+                chunks.push(value);
+            }
+        } finally {
+            if (!complete) { try { await reader.cancel(); } catch (_) {} }
+            reader.releaseLock();
+        }
+        const blob = new Blob(chunks, { type });
+        if (!scope.isCurrent() || !/^image\/(png|jpeg|webp|gif)$/.test(blob.type)) return;
+        if (blob.size <= UI.PROFILE_BANNER_CACHE_BYTES) {
+            const data = await new Promise(resolve => {
+                const reader = new FileReader();
+                const off = scope.addCleanup(() => { reader.abort(); resolve(null); });
+                reader.onload = () => { off(); resolve(reader.result); };
+                reader.onerror = reader.onabort = () => { off(); resolve(null); };
+                reader.readAsDataURL(blob);
+            });
+            if (!scope.isCurrent() || typeof data !== 'string') return;
+            safeSet(getBannerCacheKey(account), data);
+        }
+        if (!scope.isCurrent()) return;
+        const blobUrl = URL.createObjectURL(blob);
+        scope.addCleanup(() => URL.revokeObjectURL(blobUrl));
+        apply(blobUrl);
+    } catch (_) { /* 背景同步失败保留当前背景，不影响资料。 */ }
+    finally { clearTimeout(timer); controller.abort(); release(); }
+}
+
+async function _fetchProfileAndWallet(account, { own = false, options = {} } = {}) {
+    const profileRequest = api.getUserProfile(account, options).then(response => {
+        if (response?.status !== 'success') throw new Error('Invalid profile response');
+        return normalizeProfileData(response.data, account, own);
+    });
+    if (!own) return profileRequest;
+    const [profile, wallet] = await Promise.allSettled([profileRequest, api.getWallet(account, options)]);
+    return { ...(profile.status === 'fulfilled' ? profile.value : {}),
+        ...(wallet.status === 'fulfilled' ? normalizeWalletData(wallet.value) : {}) };
+}
+
+/** 统一设置 Tab 按钮点击事件 */
+function _setupTabButton(container, selector, tabId, onSwitch) {
+    const btn = container.querySelector(selector);
+    if (btn) btn.onclick = () => onSwitch(tabId);
+}
+
+export function showUserProfile(initialUserData, currentUser = null, isMe = true) {
+    const container = document.createElement("div");
+    container.className = "profile-view";
+
+    let isSettingsView = false;
+    let activeTab = safeGet(`Profile_ActiveTab_${isMe}`) || "published";
+    let userData = normalizeProfileData(initialUserData, initialUserData.account, isMe);
+    let constructing = true;
+    let renderGeneration = 0;
+    let logoutPending = false;
+    const componentId = `profile-detail-${++profileSequence}`;
+    const releaseChild = () => {
+        const list = container.querySelector('#profile-list-container');
+        if (list) endProfileListView(list);
+        container.querySelector('.ranking-settings-form')?._cleanup?.();
+    };
+    const scope = createTaskViewScope({
+        sessionMatches: captureRequestSession(), connected: () => constructing || container.isConnected,
+        subscribe: notify => subscribeTaskSessionChanges(notify, { target: window, eventBus, events: EVENTS,
+            userKey: CACHE.LEGACY_KEYS.USER, tokenKey: CACHE.LEGACY_KEYS.TOKEN }),
+        cancelReads: () => requestCancelManager.cancelAll(componentId),
+        invalidate: () => {
+            releaseChild(); userData = { account: initialUserData.account };
+            container.replaceChildren();
+            const back = document.createElement('button'); back.type = 'button';
+            back.className = 'about-back'; back.textContent = t('common.back');
+            back.onclick = () => window.dispatchEvent(new CustomEvent('comfy-route-back'));
+            const status = document.createElement('div'); status.setAttribute('role', 'status');
+            status.textContent = t('auth.session_changed'); container.append(back, status);
+        }
+    });
+    container._profileScope = scope;
+    container._profileReadOptions = { componentId, timeout: API.BACKGROUND_TIMEOUT, retries: API.BACKGROUND_RETRIES };
+    container._cleanup = () => { releaseChild(); scope.dispose(); container.replaceChildren(); };
+    // 独立挂载者也能释放；正常侧栏路由在移除前调用 _cleanup。
+    const observer = new MutationObserver(() => { if (!container.isConnected) container._cleanup(); });
+    observer.observe(document.body, { childList: true, subtree: true });
+    scope.addCleanup(() => { observer.disconnect(); releaseChild(); });
+
+    function render() {
+        if (!scope.isCurrent()) return;
+        releaseChild();
+        const generation = ++renderGeneration;
+        const current = () => scope.isCurrent() && renderGeneration === generation;
+        container.innerHTML = "";
+
+        let isFollowing = false;
+        if (currentUser && userData.followers) { isFollowing = userData.followers.includes(currentUser.account); }
+
+        const privacy = userData.privacy || {};
+        const followingCount = (!isMe && privacy.follows) ? "***" : (userData.following ? userData.following.length : 0);
+
+        const tabs = [{ id: "published", label: isMe ? t('profile.my_published') : t('profile.their_published') }];
+        if (isMe) tabs.push({ id: "acquired", label: t('profile.my_purchased') });
+        if (isMe) tabs.push({ id: "my_tasks", label: t('profile.my_tasks') });
+        if (isMe) tabs.push({ id: "transactions", label: t('profile.transactions') });
+        if (isMe) tabs.push({ id: "my_posts", label: t('profile.my_posts') });
+        if (isMe) tabs.push({ id: "my_prompts", label: t('prompt.my_prompts') });
+        if (isMe) tabs.push({ id: "collected", label: t('profile.my_collected') });
+        if (isMe || !privacy.likes) tabs.push({ id: "liked", label: t('profile.recent_likes') });
+        if (isMe || !privacy.follows) tabs.push({ id: "following", label: t('profile.following') });
+        if (isMe || !privacy.followers) tabs.push({ id: "followers", label: t('profile.followers') });
+
+        if (!tabs.find(t => t.id === activeTab)) activeTab = "published";
+
+        // 调用解耦的模板引擎生成 HTML
+        container.innerHTML = buildProfileHTML(userData, isMe, isSettingsView, isFollowing, followingCount, activeTab, tabs);
+
+        if (isSettingsView && isMe) {
+            const settingsContainer = createSettingsForm(
+                userData,
+                () => { if (!current()) return; isSettingsView = false; render(); },
+                (newUserData) => {
+                    if (!current()) return;
+                    userData = normalizeProfileData(newUserData, userData.account, true);
+                    if (container.updateData) container.updateData(userData);
+                    isSettingsView = false;
+                    render();
+                },
+                { isCurrent: current }
+            );
+            container.appendChild(settingsContainer);
+            container.querySelector("#btn-back-profile").onclick = () => { isSettingsView = false; render(); };
+        } else {
+            container.querySelector("#btn-back-profile").onclick = () => window.dispatchEvent(new CustomEvent("comfy-route-back"));
+
+            if (isMe) {
+                container.querySelector("#btn-wallet").onclick = () => {
+                    if (!current()) return;
+                    openRechargeModal(currentUser, (newBalance) => { if (!current()) return; userData.balance = newBalance; render(); });
+                };
+                container.querySelector("#btn-withdraw").onclick = () => {
+                    if (!current()) return;
+                    openWithdrawModal(currentUser, async () => {
+                        if (!current()) return;
+                        // 提现成功后重新拉取用户数据刷新余额
+                        try {
+                            const walletResponse = await api.getWallet(currentUser.account, { componentId });
+                            if (!current()) return;
+                            const walletRes = normalizeWalletData(walletResponse);
+                            userData.balance = walletRes.balance ?? userData.balance;
+                            userData.earn_balance = walletRes.earn_balance ?? userData.earn_balance;
+                            userData.tip_balance = walletRes.tip_balance ?? userData.tip_balance;
+                            userData.total_withdrawn = walletRes.total_withdrawn ?? userData.total_withdrawn;
+                        } catch (err) {
+                            if (!current()) return;
+                            console.warn("提现后刷新钱包数据失败");
+                        }
+                        render();
+                    });
+                };
+
+                container.querySelector("#btn-open-settings").onclick = () => { isSettingsView = true; render(); };
+                container.querySelector("#btn-logout").onclick = async () => {
+                    if (!current() || logoutPending) return;
+                    const currentAccount = getCurrentAccount();
+                    logoutPending = true;
+                    try {
+                        if (!await showConfirm(t('confirm.logout')) || !scope.isCurrent()
+                            || getCurrentAccount() !== currentAccount) return;
+                        logoutAndClearUserData(currentAccount);
+                        window.dispatchEvent(new CustomEvent("comfy-route-back"));
+                        window.dispatchEvent(new CustomEvent("comfy-user-logout"));
+                        showToast(t('feedback.logged_out'), "info");
+                    } finally {
+                        logoutPending = false;
+                    }
+                };
+            } else {
+                const btnTip = container.querySelector("#btn-tip-user");
+                if (btnTip) {
+                    btnTip.onclick = async () => {
+                        if (!current()) return;
+                        if (!currentUser) return showToast(t('feedback.login_required_tip'), "warning");
+                        await openTipModal(currentUser, userData, (newBalance) => {
+                            if (!current()) return;
+                            currentUser.balance = newBalance;
+                            openOtherUserProfileModal(userData.account, currentUser);
+                        }, null, { isCurrent: current });
+                    };
+                }
+
+                const btnFollow = container.querySelector("#btn-follow-user");
+                if (btnFollow) {
+                    btnFollow.onclick = async () => {
+                        if (!current()) return;
+                        if (!currentUser) return showToast(t('feedback.login_required'), "warning");
+                        btnFollow.innerHTML = `⏳ ${t('common.processing')}...`; btnFollow.disabled = true;
+                        try {
+                            const newStatus = !isFollowing;
+                            const response = await api.toggleFollow(currentUser.account, userData.account, newStatus);
+                            if (!current()) return;
+                            if (response?.status !== 'success') throw new Error('Invalid follow response');
+                            isFollowing = newStatus;
+
+                            if (!userData.followers) userData.followers = [];
+                            if (isFollowing) { if (!userData.followers.includes(currentUser.account)) userData.followers.push(currentUser.account); }
+                            else { userData.followers = userData.followers.filter(a => a !== currentUser.account); }
+                            render();
+                        } catch (_) { if (!current()) return; showToast(t('feedback.operation_failed'), "error"); btnFollow.innerHTML = isFollowing ? `✔️ ${t('social.followed')}` : `➕ ${t('social.follow')}`; }
+                        finally { if (current()) btnFollow.disabled = false; }
+                    };
+                }
+
+                const btnSendMsg = container.querySelector("#btn-send-msg");
+                if (btnSendMsg) {
+                    btnSendMsg.onclick = () => {
+                        if (!current()) return;
+                        if (!currentUser) return showToast(t('feedback.login_required'), "warning");
+                        openChatModal(currentUser, userData.account);
+                    };
+                }
+            }
+
+            container.querySelectorAll(".profile-tab-btn").forEach(btn => {
+                btn.onclick = (e) => {
+                    if (!current()) return;
+                    activeTab = e.currentTarget.getAttribute("data-id");
+                    safeSet(`Profile_ActiveTab_${isMe}`, activeTab);
+                    render();
+                };
+            });
+
+            // 粉丝/关注数点击跳转对应列表
+            const _switchTab = (tabId) => { if (!current()) return; activeTab = tabId; safeSet(`Profile_ActiveTab_${isMe}`, tabId); render(); };
+            _setupTabButton(container, "#btn-followers", "followers", _switchTab);
+            _setupTabButton(container, "#btn-following", "following", _switchTab);
+
+            const listDOM = container.querySelector("#profile-list-container");
+            listDOM._profileSessionCurrent = current;
+            listDOM._profileAddCleanup = cleanup => scope.addCleanup(cleanup);
+            renderProfileListContent(activeTab, listDOM, userData, currentUser, openOtherUserProfileModal);
+        }
+    }
+
+    container.updateData = function(newUserData) {
+        if (!scope.isCurrent() || !newUserData || typeof newUserData !== 'object' || Array.isArray(newUserData)) return;
+        const safeNewData = normalizeProfileData({ ...userData, ...newUserData }, userData.account, isMe);
+        Object.keys(safeNewData).forEach(key => safeNewData[key] == null && delete safeNewData[key]);
+        const mergedData = { ...userData, ...safeNewData };
+        if (JSON.stringify(userData) !== JSON.stringify(mergedData)) {
+            userData = mergedData;
+            if (!isSettingsView) { render(); }
+        }
+    };
+
+    render();
+    constructing = false;
+    return container;
+}
+
+export function openUserProfileModal(userData) {
+    ++profileNavigation;
+    const view = showUserProfile(userData, userData, true);
+    window.dispatchEvent(new CustomEvent("comfy-route-view", { detail: { view } }));
+    _fetchProfileAndWallet(userData.account, { own: true, options: view._profileReadOptions }).then(freshData => {
+        if (!view._profileScope.isCurrent()) return;
+        mergeStoredProfile(userData.account, freshData, sessionStorages(), CACHE.LEGACY_KEYS.USER);
+        view.updateData(freshData);
+        if (freshData.bannerUrl) syncBannerCache(userData.account, freshData.bannerUrl, view._profileScope,
+            blobUrl => view.updateData({ bannerUrl: blobUrl }));
+    }).catch(() => { if (view._profileScope.isCurrent()) console.warn('后台更新本人资料失败'); });
+}
+
+export async function openOtherUserProfileModal(targetAccount, currentUser) {
+    if (currentUser && currentUser.account === targetAccount) return openUserProfileModal(currentUser);
+    const generation = ++profileNavigation;
+    const sessionMatches = captureRequestSession();
+    const componentId = `profile-open-${++profileSequence}`;
+    let activeContainer = null;
+    const cached = getCachedProfile(targetAccount);
+    if (cached) {
+        try {
+            activeContainer = showUserProfile({ ...cached, account: targetAccount }, currentUser, false);
+            window.dispatchEvent(new CustomEvent('comfy-route-view', { detail: { view: activeContainer } }));
+        } catch (_) {}
+    }
+    let obsolete = false;
+    const cancel = () => { obsolete = true; requestCancelManager.cancelAll(componentId); };
+    const onRouteView = event => { if (event.detail?.view !== activeContainer) cancel(); };
+    window.addEventListener('comfy-route-back', cancel);
+    window.addEventListener('comfy-route-view', onRouteView);
+    const unsubscribe = subscribeTaskSessionChanges(force => { if (force || !sessionMatches()) cancel(); }, {
+        target: window, eventBus, events: EVENTS, userKey: CACHE.LEGACY_KEYS.USER, tokenKey: CACHE.LEGACY_KEYS.TOKEN
+    });
+    const current = () => !obsolete && generation === profileNavigation && sessionMatches()
+        && (!activeContainer || activeContainer._profileScope.isCurrent());
+    try {
+        const freshData = await _fetchProfileAndWallet(targetAccount, {
+            options: activeContainer?._profileReadOptions || { componentId }
+        });
+        if (!current()) return;
+        setCachedProfile(targetAccount, freshData);
+        if (activeContainer) activeContainer.updateData(freshData);
+        else {
+            activeContainer = showUserProfile(freshData, currentUser, false);
+            window.dispatchEvent(new CustomEvent('comfy-route-view', { detail: { view: activeContainer } }));
+        }
+    } catch (_) {
+        if (current() && !activeContainer) showToast(t('feedback.user_fetch_failed'), 'error');
+    } finally {
+        unsubscribe();
+        window.removeEventListener('comfy-route-back', cancel);
+        window.removeEventListener('comfy-route-view', onRouteView);
+    }
+}

前端页面/prompt/提示词详情组件.js

@@ -495,12 +495,32 @@ async function showPurchaseConfirmDialog(contentArea, prompt, currentUser) {
     const context = viewContexts.get(contentArea);
     if (!context?.scope.isCurrent() || context.purchasePending) return;
     context.purchasePending = true;
+    const content = document.createElement("div");
+    content.className = "prompt-detail-dialog";
+    content.setAttribute('aria-busy', 'true');
+    const loading = document.createElement('div');
+    loading.setAttribute('role', 'status'); loading.setAttribute('aria-live', 'polite');
+    loading.textContent = t('common.loading'); content.append(loading);
+    const modal = openOwnedModal(contentArea, `💎 ${t('prompt.purchase_confirm_title')}`, content, { width: "320px" });
+    if (!modal) { context.purchasePending = false; return; }
+    let submitted = false, closed = false;
+    context.purchaseSequence = (context.purchaseSequence || 0) + 1;
+    const componentId = `${context.readOptions.componentId}-purchase-${context.purchaseSequence}`;
+    const readOptions = { ...context.readOptions, componentId };
+    const release = content._cleanup;
+    content._cleanup = () => {
+        if (closed) return;
+        closed = true;
+        try { requestCancelManager.cancelAll(componentId); }
+        finally { release?.(); if (!submitted) context.purchasePending = false; }
+    };
+    const current = () => !closed && isCurrent(contentArea) && modal.isConnected;
     let balance;
     let expectedPrice;
     let purchaseTitle;
     try {
-        const detailRes = await api.getPromptDetail(prompt.id, context.readOptions);
-        if (!isCurrent(contentArea)) return;
+        const detailRes = await api.getPromptDetail(prompt.id, readOptions);
+        if (!current()) return;
         const latest = detailRes?.data;
         if (detailRes?.status !== "success" || !latest || Array.isArray(latest) || latest.id !== prompt.id ||
             typeof latest.owned !== "boolean" || !Number.isSafeInteger(latest.price) || latest.price < 0) throw new Error();
@@ -511,26 +531,29 @@ async function showPurchaseConfirmDialog(contentArea, prompt, currentUser) {
             prompt.price = latest.price;
             renderPromptTextArea(contentArea, prompt, currentUser, true);
             context.purchasePending = false;
+            const restore = modal.contains(document.activeElement);
+            globalModal.closeModal(modal);
+            if (restore && isCurrent(contentArea) && document.activeElement === document.body) contentArea.querySelector('#btn-copy-prompt')?.focus({ preventScroll: true });
             return;
         }
         if (latest.price_confirmation_supported !== true) {
             context.purchasePending = false;
+            globalModal.closeModal(modal);
             showToast(t('acquire.purchase_verification_unavailable'), "warning");
             return;
         }
         expectedPrice = latest.price;
         purchaseTitle = typeof latest.title === "string" ? latest.title : prompt.title;
-        const walletRes = await api.getWallet(currentUser.account, context.readOptions);
-        if (!isCurrent(contentArea)) return;
+        const walletRes = await api.getWallet(currentUser.account, readOptions);
+        if (!current()) return;
         if (walletRes?.status !== "success" || !Number.isSafeInteger(walletRes.balance) || walletRes.balance < 0) throw new Error();
         balance = walletRes.balance;
     } catch (_) {
-        if (isCurrent(contentArea)) { context.purchasePending = false; showToast(t('common.error'), "error"); }
+        if (current()) { globalModal.closeModal(modal); showToast(t('common.error'), "error"); }
         return;
     }
 
-    const content = document.createElement("div");
-    content.className = "prompt-detail-dialog";
+    content.setAttribute('aria-busy', 'false');
     content.innerHTML = `
         <div class="prompt-detail-dialog__center">
             <div class="prompt-detail-dialog__icon" aria-hidden="true">💎</div>
@@ -546,10 +569,6 @@ async function showPurchaseConfirmDialog(contentArea, prompt, currentUser) {
         </div>
     `;
 
-    const modal = openOwnedModal(contentArea, `💎 ${t('prompt.purchase_confirm_title')}`, content, { width: "320px" });
-    let submitted = false;
-    const release = content._cleanup;
-    content._cleanup = () => { release?.(); if (!submitted) context.purchasePending = false; };
     content.querySelector("#purchase-cancel").onclick = () => globalModal.closeModal(modal);
     content.querySelector("#purchase-confirm").onclick = async () => {
         if (submitted || !isCurrent(contentArea) || !modal?.isConnected) return;