Upload 104 files

前端页面/core/网络请求_缓存管理.js

@@ -844,6 +844,7 @@ export function invalidateRelatedCache(endpoint, method = null) {
 
 // 获取缓存TTL
 export function _getCacheTTL(endpoint) {
+    if (endpoint.split(/[?#]/)[0] === CACHE.PUBLIC_LISTS.prompts.endpoint) return CACHE.TTL.DETAIL_DATA;
     for (const [pattern, ttl] of Object.entries(CACHE_CONFIG)) {
         if (endpoint.startsWith(pattern)) {
             return ttl;

前端页面/market/创作者卡片组件.js

@@ -345,7 +345,7 @@ export function createCreatorCard(creatorData, currentUser = null) {
     let commentUI = null;
     let isDetailLoaded = false;
     let isChartRendered = false;
-    let chartInstance = null;
+    let chartInstance = null, removeChartAppearance = null;
     let generation = 0, detailPending = false, chartPending = false, detailRead = null;
     let widthObserver = null, widthTimer = null, resizeTimer = null;
     let stopTrackingRemoval = null, resizeSubscribed = false;
@@ -368,6 +368,9 @@ export function createCreatorCard(creatorData, currentUser = null) {
     });
     const current = token => scope.isCurrent() && card.isConnected && detailView.style.display !== 'none' && token === generation;
     const clearChartWork = () => {
+        removeChartAppearance?.(); removeChartAppearance = null;
+        const chartDom = detailView.querySelector('.creator-card__chart');
+        chartDom?.removeAttribute('role'); chartDom?.removeAttribute('aria-label');
         widthObserver?.disconnect(); widthObserver = null;
         clearTimeout(widthTimer); clearTimeout(resizeTimer); widthTimer = resizeTimer = null;
         chartPending = false;
@@ -487,40 +490,78 @@ export function createCreatorCard(creatorData, currentUser = null) {
         renderTrendChart(detailData.trendData);
     }
 
-    // 📊 渲染趋势图表
+    function bindChartAppearance(chartDom, trendData, token) {
+        removeChartAppearance?.(); removeChartAppearance = null;
+        const instance = chartInstance;
+        const data = trendData || { months: [], tools: [], skills: [], apps: [], recommends: [] };
+        const refresh = () => {
+            if (!current(token) || chartInstance !== instance || !chartDom.isConnected) return;
+            try {
+                const theme = getComputedStyle(chartDom);
+                const textColor = theme.getPropertyValue('--rk-text').trim() || theme.color;
+                const borderColor = theme.getPropertyValue('--rk-border').trim() || theme.borderColor;
+                const panelColor = theme.getPropertyValue('--rk-panel').trim() || theme.backgroundColor;
+                const measuredSize = parseFloat(theme.fontSize);
+                const fontSize = Number.isFinite(measuredSize) ? measuredSize : 12;
+                const series = [
+                    { name: t('creator.chart.series.tools'), type: 'line', data: data.tools, smooth: true, itemStyle: { color: '#4CAF50' }, lineStyle: { width: 2, type: 'dashed' } },
+                    { name: t('creator.chart.series.skills'), type: 'line', data: data.skills || [], smooth: true, itemStyle: { color: '#7C4DFF' }, lineStyle: { width: 2, type: 'dashed' } },
+                    { name: t('creator.chart.series.apps'), type: 'line', data: data.apps, smooth: true, itemStyle: { color: '#2196F3' }, lineStyle: { width: 2, type: 'dashed' } },
+                    { name: t('creator.chart.series.recommends'), type: 'line', data: data.recommends, smooth: true, itemStyle: { color: '#FF9800' }, lineStyle: { width: 2, type: 'dashed' } }
+                ];
+                instance.setOption({
+                    animation: getSettings().enableAnimations !== false && !window.matchMedia('(prefers-reduced-motion: reduce)').matches,
+                    textStyle: { color: textColor, fontFamily: theme.fontFamily, fontSize },
+                    tooltip: { trigger: 'axis', backgroundColor: panelColor, borderColor, textStyle: { color: textColor, fontSize } },
+                    grid: { top: fontSize, bottom: fontSize * 1.5, left: fontSize, right: fontSize, containLabel: true },
+                    xAxis: { type: 'category', data: data.months, axisLabel: { color: textColor, fontSize, hideOverlap: true, formatter: value => String(value).replace('-', '\n'), showMinLabel: true, showMaxLabel: true, alignMinLabel: 'left', alignMaxLabel: 'right' }, axisLine: { lineStyle: { color: borderColor } } },
+                    yAxis: { type: 'value', splitLine: { lineStyle: { color: borderColor, type: 'dashed' } }, axisLabel: { color: textColor, fontSize }, minInterval: 1 },
+                    series
+                });
+                chartDom.setAttribute('role', 'img');
+                chartDom.setAttribute('aria-label', series.map(entry => t('chart.data_description', {
+                    series: entry.name,
+                    values: data.months.flatMap((month, index) => entry.data?.[index] == null ? [] : [t('chart.month_value', { month, value: entry.data[index] })]).join('; ')
+                })).join(' '));
+                instance.resize();
+            } catch (_) {
+                if (!current(token) || chartInstance !== instance) return;
+                clearChartWork(); instance.dispose(); chartInstance = null; isChartRendered = false;
+                chartDom.innerHTML = `<div class="creator-card__chart-status creator-card__chart-status--error" role="status">${t('creator.chart.load_failed')}</div>`;
+            }
+        };
+        refresh();
+        if (!current(token) || chartInstance !== instance) return false;
+        const observer = new MutationObserver(refresh);
+        for (let ancestor = chartDom.parentElement; ancestor; ancestor = ancestor.parentElement) {
+            observer.observe(ancestor, { attributes: true, attributeFilter: ['class', 'style', 'data-theme', 'data-color-scheme'] });
+        }
+        const queries = ['(prefers-color-scheme: dark)', '(forced-colors: active)', '(prefers-reduced-motion: reduce)'].map(query => window.matchMedia(query));
+        for (const query of queries) query.addEventListener('change', refresh);
+        window.addEventListener('comfy-settings-changed', refresh);
+        removeChartAppearance = () => {
+            observer.disconnect();
+            for (const query of queries) query.removeEventListener('change', refresh);
+            window.removeEventListener('comfy-settings-changed', refresh);
+        };
+        return true;
+    }
+
     function _initTrendChart(chartDom, trendData, token) {
         if (!current(token)) return;
         loadECharts().then(echarts => {
             if (!current(token) || !chartDom.isConnected) return;
             chartDom.innerHTML = "";
-            const theme = getComputedStyle(card);
-            const textColor = theme.getPropertyValue('--rk-text').trim() || theme.color;
-            const borderColor = theme.getPropertyValue('--rk-border').trim() || theme.borderColor;
             chartInstance = echarts.init(chartDom, null, { backgroundColor: 'transparent' });
-
-            const data = trendData || { months: [], tools: [], skills: [], apps: [], recommends: [] };
-
-            chartInstance.setOption({
-                tooltip: { trigger: 'axis', textStyle: { fontSize: 11 } },
-                grid: { top: 10, bottom: 20, left: 35, right: 10, containLabel: true },
-                xAxis: { type: 'category', data: data.months, axisLabel: { color: textColor, fontSize: 10 }, axisLine: { lineStyle: { color: borderColor } } },
-                yAxis: { type: 'value', splitLine: { lineStyle: { color: borderColor, type: 'dashed' } }, axisLabel: { color: textColor, fontSize: 10 }, minInterval: 1 },
-                series: [
-                    { name: t('creator.chart.series.tools'), type: 'line', data: data.tools, smooth: true, itemStyle: { color: '#4CAF50' }, lineStyle: { width: 2, type: 'dashed' } },
-                    { name: t('creator.chart.series.skills'), type: 'line', data: data.skills || [], smooth: true, itemStyle: { color: '#7C4DFF' }, lineStyle: { width: 2, type: 'dashed' } },
-                    { name: t('creator.chart.series.apps'), type: 'line', data: data.apps, smooth: true, itemStyle: { color: '#2196F3' }, lineStyle: { width: 2, type: 'dashed' } },
-                    { name: t('creator.chart.series.recommends'), type: 'line', data: data.recommends, smooth: true, itemStyle: { color: '#FF9800' }, lineStyle: { width: 2, type: 'dashed' } }
-                ]
-            });
-            isChartRendered = true;
-
-            // 初始化完成后延迟调用resize确保正确渲染
+            isChartRendered = bindChartAppearance(chartDom, trendData, token);
+            if (!isChartRendered) return;
             resizeTimer = setTimeout(() => {
                 resizeTimer = null;
                 if (current(token) && chartInstance) chartInstance.resize();
             }, 300);
         }).catch(() => {
             if (!current(token)) return;
+            clearChartWork();
             chartInstance?.dispose(); chartInstance = null; isChartRendered = false;
             chartDom.innerHTML = `<div class="creator-card__chart-status creator-card__chart-status--error" role="status">${t('creator.chart.load_failed')}</div>`;
         }).finally(() => { if (current(token)) chartPending = false; });
@@ -529,11 +570,11 @@ export function createCreatorCard(creatorData, currentUser = null) {
     function renderTrendChart(trendData) {
         const token = generation;
         if (!current(token)) return;
-        if (isChartRendered) { chartInstance?.resize(); return; }
+        const chartDom = detailView.querySelector(`#${chartContainerId}`);
+        if (!chartDom) return;
+        if (isChartRendered) { bindChartAppearance(chartDom, trendData, token); return; }
         if (chartPending) return;
         chartPending = true;
-        const chartDom = detailView.querySelector(`#${chartContainerId}`);
-        if (!chartDom) { chartPending = false; return; }
 
         chartDom.innerHTML = `<div class="creator-card__chart-status" role="status">${t('creator.chart.loading')}</div>`;
 

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

@@ -141,12 +141,19 @@ export function showUserProfile(initialUserData, currentUser = null, isMe = true
     observer.observe(document.body, { childList: true, subtree: true });
     scope.addCleanup(() => { observer.disconnect(); releaseChild(); });
 
-    function render() {
+    function restoreOwnedFocus(target, owned) {
+        if (owned && scope.isCurrent() && container.isConnected && document.hasFocus()
+            && document.activeElement === document.body && target?.isConnected
+            && !target.disabled && target.getClientRects().length) target.focus({ preventScroll: true });
+    }
+
+    function render(focusTarget = null, allowBodyFocus = false) {
         if (!scope.isCurrent()) return;
         const focused = document.activeElement;
         const ownedFocus = document.hasFocus() && container.contains(focused);
         const focusedTab = ownedFocus && focused.matches('.profile-tab-btn') ? focused.dataset.id : null;
-        const focusedCount = ownedFocus && ['btn-followers', 'btn-following'].includes(focused.id) ? focused.id : null;
+        const focusedControl = ownedFocus && focused.matches('.profile-header button[id]') ? focused.id : null;
+        const actionFocus = focusTarget && (ownedFocus || (allowBodyFocus && focused === document.body));
         releaseChild();
         const generation = ++renderGeneration;
         const current = () => scope.isCurrent() && renderGeneration === generation;
@@ -175,20 +182,34 @@ export function showUserProfile(initialUserData, currentUser = null, isMe = true
         container.innerHTML = buildProfileHTML(userData, isMe, isSettingsView, isFollowing, followingCount, activeTab, tabs);
 
         if (isSettingsView && isMe) {
+            let settingsSubmitFocused = false;
             const settingsContainer = createSettingsForm(
                 userData,
-                () => { if (!current()) return; isSettingsView = false; render(); },
+                () => { if (!current()) return; isSettingsView = false; render('btn-open-settings'); },
                 (newUserData) => {
                     if (!current()) return;
                     userData = normalizeProfileData(newUserData, userData.account, true);
                     if (container.updateData) container.updateData(userData);
                     isSettingsView = false;
-                    render();
+                    render('btn-open-settings', settingsSubmitFocused);
                 },
                 { isCurrent: current }
             );
+            const captureSettingsSubmitFocus = event => {
+                if (!current() || !settingsContainer.isConnected) return;
+                const saveButton = settingsContainer.querySelector('#btn-save-settings');
+                if (saveButton?.contains(event.target)) {
+                    settingsSubmitFocused = document.hasFocus() && settingsContainer.contains(document.activeElement);
+                }
+            };
+            settingsContainer.addEventListener('click', captureSettingsSubmitFocus, true);
+            const cleanupSettings = settingsContainer._cleanup;
+            settingsContainer._cleanup = () => {
+                settingsContainer.removeEventListener('click', captureSettingsSubmitFocus, true);
+                cleanupSettings();
+            };
             container.appendChild(settingsContainer);
-            container.querySelector("#btn-back-profile").onclick = () => { isSettingsView = false; render(); };
+            container.querySelector("#btn-back-profile").onclick = () => { isSettingsView = false; render('btn-open-settings'); };
         } else {
             container.querySelector("#btn-back-profile").onclick = () => window.dispatchEvent(new CustomEvent("comfy-route-back"));
 
@@ -218,7 +239,7 @@ export function showUserProfile(initialUserData, currentUser = null, isMe = true
                     });
                 };
 
-                container.querySelector("#btn-open-settings").onclick = () => { isSettingsView = true; render(); };
+                container.querySelector("#btn-open-settings").onclick = () => { isSettingsView = true; render('setting-name'); };
                 container.querySelector("#btn-logout").onclick = async () => {
                     if (!current() || logoutPending) return;
                     const currentAccount = getCurrentAccount();
@@ -253,6 +274,7 @@ export function showUserProfile(initialUserData, currentUser = null, isMe = true
                     btnFollow.onclick = async () => {
                         if (!current()) return;
                         if (!currentUser) return showToast(t('feedback.login_required'), "warning");
+                        const followFocusOwned = document.hasFocus() && document.activeElement === btnFollow;
                         btnFollow.innerHTML = `⏳ ${t('common.processing')}...`; btnFollow.disabled = true;
                         try {
                             const newStatus = !isFollowing;
@@ -264,9 +286,15 @@ export function showUserProfile(initialUserData, currentUser = null, isMe = true
                             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();
+                            const restoreFollow = followFocusOwned && [document.body, btnFollow].includes(document.activeElement);
+                            render(restoreFollow ? 'btn-follow-user' : null, restoreFollow);
                         } 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; }
+                        finally {
+                            if (current()) {
+                                btnFollow.disabled = false;
+                                restoreOwnedFocus(btnFollow, followFocusOwned);
+                            }
+                        }
                     };
                 }
 
@@ -299,12 +327,11 @@ export function showUserProfile(initialUserData, currentUser = null, isMe = true
             listDOM._profileAddCleanup = cleanup => scope.addCleanup(cleanup);
             renderProfileListContent(activeTab, listDOM, userData, currentUser, openOtherUserProfileModal);
         }
-        if ((focusedTab || focusedCount) && current() && container.isConnected
-            && document.hasFocus() && document.activeElement === document.body) {
-            const target = focusedTab
-                ? [...container.querySelectorAll('.profile-tab-btn')].find(button => button.dataset.id === focusedTab)
-                : container.querySelector('#' + focusedCount);
-            if (target && !target.disabled && target.getClientRects().length) target.focus({ preventScroll: true });
+        if (current()) {
+            const target = actionFocus ? container.querySelector('#' + focusTarget)
+                : focusedTab ? [...container.querySelectorAll('.profile-tab-btn')].find(button => button.dataset.id === focusedTab)
+                : focusedControl ? [...container.querySelectorAll('.profile-header button[id]')].find(button => button.id === focusedControl) : null;
+            restoreOwnedFocus(target, actionFocus || focusedTab || focusedControl);
         }
     }
 

前端页面/styles/主题基础.css

@@ -353,15 +353,18 @@
 .comfy-ranking-root .top-nav button:focus-visible { outline: 2px solid var(--rk-focus); outline-offset: 2px; }
 @media (hover: hover) { .comfy-ranking-root .top-nav__icon:hover, .comfy-ranking-root .top-nav__identity:hover { border-color: var(--rk-focus); } .comfy-ranking-root .top-nav__brand:hover { opacity: .85; } }
 
+.comfy-ranking-root .top-nav:has(> .top-banner > .top-banner__image) { padding-bottom: 0; }
+
 .comfy-ranking-root .top-banner {
     display: flex;
     flex: 0 0 100%;
     width: 100%;
     min-width: 0;
-    max-height: 64px;
+    min-height: 0;
+    max-height: calc(64px * 2 / 3);
     justify-content: center;
     align-items: center;
-    margin: 0;
+    margin: -8px 0 0;
     padding: 0;
     overflow: hidden;
     border: 0;
@@ -377,10 +380,10 @@
 }
 
 .comfy-ranking-root .top-banner__image {
-    max-width: 100%;
+    max-width: calc(100% * 2 / 3);
     width: auto;
     height: auto;
-    max-height: 64px;
+    max-height: calc(64px * 2 / 3);
     display: block;
     object-fit: contain;
 }
@@ -1581,7 +1584,7 @@ button.ranking-rating__star { cursor: pointer; min-width: 28px; min-height: 28px
 .creator-card__detail[hidden] { display:none !important; }
 .creator-card__section-label { font-size:12px; font-weight:700; margin-bottom:8px; }
 .creator-card__section-label--comments { margin-top:16px; }
-.creator-card__chart { width:100%; height:180px; background:var(--rk-bg,var(--comfy-menu-bg,#202020)); border-radius:6px; margin-bottom:12px; }
+.creator-card__chart { width:100%; height:max(180px,11.25rem); font-size:.75rem; background:var(--rk-bg,var(--comfy-menu-bg,#202020)); border-radius:6px; margin-bottom:12px; }
 .creator-card__comments { height:250px; border:1px solid var(--rk-border,#454545); border-radius:6px; overflow:hidden; }
 .creator-card__status { padding:32px 12px; text-align:center; color:var(--rk-muted,var(--descrip-text,#a4a4a4)); }
 .creator-card__status--error, .creator-card__chart-status--error { color:var(--rk-danger,#ef5350); }