diff --git a/assets/js/app.js b/assets/js/app.js
index 3709235..975fa60 100644
--- a/assets/js/app.js
+++ b/assets/js/app.js
@@ -10,6 +10,10 @@ let lazyLoadObserver = null;
let isAllAlbumsLoaded = false; // 标记是否已加载所有相册数据
let isInFavoritesPage = false; // 标记当前是否在收藏页
+// 标签和人物筛选
+let currentFilter = null; // { type: 'tag'|'person', value: string }
+let collapsedSections = { people: false, tags: false };
+
// API基础URL
const API_BASE = '/api';
@@ -437,6 +441,9 @@ async function loadAlbums(reset = false) {
// 预加载下一批图片
preloadNextBatchImages();
+ // 加载热门标签和人物
+ loadDiscoverData();
+
} catch (error) {
console.error('加载相册失败:', error);
showError('加载相册数据失败，请刷新页面重试');
@@ -1199,6 +1206,192 @@ function openFavoriteImage(favoriteId) {
window.location.href = `/album?id=${favoriteId}`;
}
+// ============================================================
+// 标签和人物发现功能
+// ============================================================
+
+// 加载热门标签和人物数据
+async function loadDiscoverData() {
+ try {
+ // 并行加载
+ const [tagsResp, peopleResp] = await Promise.all([
+ fetch(`${API_BASE}/tags/popular?limit=40`),
+ fetch(`${API_BASE}/recommend/popular-persons?limit=30`)
+ ]);
+
+ if (tagsResp.ok) {
+ const tags = await tagsResp.json();
+ if (tags && tags.length > 0) {
+ renderTagCloud(tags);
+ }
+ }
+
+ if (peopleResp.ok) {
+ const people = await peopleResp.json();
+ if (people && people.length > 0) {
+ renderPeopleCloud(people);
+ }
+ }
+ } catch (error) {
+ console.warn('加载发现数据失败:', error);
+ }
+}
+
+// 渲染标签云
+function renderTagCloud(tags) {
+ const section = document.getElementById('tags-section');
+ const cloud = document.getElementById('tag-cloud');
+ if (!section || !cloud || !tags.length) return;
+
+ section.style.display = 'block';
+
+ // 计算标签大小范围
+ const maxCount = Math.max(...tags.map(t => t.album_cnt || t.count || 1));
+ const minCount = Math.min(...tags.map(t => t.album_cnt || t.count || 1));
+
+ cloud.innerHTML = tags.map(tag => {
+ const count = tag.album_cnt || tag.count || 1;
+ const name = tag.tag || tag.name || '';
+ // 计算字体大小 (12px - 22px)
+ const ratio = maxCount === minCount ? 0.5 : (count - minCount) / (maxCount - minCount);
+ const fontSize = 12 + ratio * 10;
+ // 计算热度颜色
+ const hue = 210 - ratio * 50; // 蓝色到紫色
+ const opacity = 0.6 + ratio * 0.4;
+
+ return `
+ ${name} (${count})
+ `;
+ }).join('');
+}
+
+// 渲染热门人物
+function renderPeopleCloud(people) {
+ const section = document.getElementById('people-section');
+ const cloud = document.getElementById('people-cloud');
+ if (!section || !cloud || !people.length) return;
+
+ section.style.display = 'block';
+
+ cloud.innerHTML = people.map(p => {
+ const name = p.name || p.display_name || '';
+ const albumCount = p.total_albums || 0;
+ const imageCount = p.total_images || 0;
+
+ return `
+
${name.charAt(0)}
+
+
${name}
+
${albumCount} 相册 · ${imageCount} 图
+
+
`;
+ }).join('');
+}
+
+// 按标签筛选
+async function filterByTag(tag) {
+ currentFilter = { type: 'tag', value: tag };
+ showFilterStatus(`标签: ${tag}`);
+
+ try {
+ showSkeleton(6);
+ const response = await fetch(`${API_BASE}/tags/search?tag=${encodeURIComponent(tag)}&limit=200`);
+ if (!response.ok) throw new Error('搜索失败');
+ const results = await response.json();
+
+ displayAlbums(results);
+ updateStats(results);
+ initLazyLoading();
+ } catch (error) {
+ console.error('标签筛选失败:', error);
+ showError('标签筛选失败');
+ }
+}
+
+// 按人物筛选
+async function filterByPerson(personName) {
+ currentFilter = { type: 'person', value: personName };
+ showFilterStatus(`人物: ${personName}`);
+
+ try {
+ showSkeleton(6);
+ const response = await fetch(`${API_BASE}/people/search?q=${encodeURIComponent(personName)}`);
+ if (!response.ok) throw new Error('搜索失败');
+ const persons = await response.json();
+
+ if (persons && persons.length > 0) {
+ // 先尝试通过人物详情获取相册
+ const personId = persons[0].id;
+ try {
+ const detailResp = await fetch(`${API_BASE}/people/${encodeURIComponent(personName)}`);
+ if (detailResp.ok) {
+ const detail = await detailResp.json();
+ if (detail && detail.albums) {
+ displayAlbums(detail.albums);
+ updateStats(detail.albums);
+ initLazyLoading();
+ return;
+ }
+ }
+ } catch (e) {
+ // 回退到标题搜索
+ }
+ }
+
+ // 回退：使用标题搜索
+ await performServerSearch(personName);
+ } catch (error) {
+ console.error('人物筛选失败:', error);
+ // 回退到标题搜索
+ await performServerSearch(personName);
+ }
+}
+
+// 显示筛选状态
+function showFilterStatus(text) {
+ const status = document.getElementById('filter-status');
+ const label = document.getElementById('current-filter');
+ if (status && label) {
+ label.textContent = text;
+ status.style.display = 'flex';
+ }
+}
+
+// 清除筛选
+function clearFilter() {
+ currentFilter = null;
+ const status = document.getElementById('filter-status');
+ if (status) status.style.display = 'none';
+
+ // 清空搜索框
+ const searchInput = document.getElementById('search-input');
+ if (searchInput) searchInput.value = '';
+
+ // 重新加载所有相册
+ loadAlbums(true);
+}
+
+// 折叠/展开区域
+function toggleSection(name) {
+ collapsedSections[name] = !collapsedSections[name];
+ const cloudId = name === 'people' ? 'people-cloud' : 'tag-cloud';
+ const cloud = document.getElementById(cloudId);
+ const btn = document.querySelector(`#${name}-section .section-toggle i`);
+
+ if (cloud) {
+ if (collapsedSections[name]) {
+ cloud.style.display = 'none';
+ btn.className = 'fas fa-chevron-down';
+ } else {
+ cloud.style.display = '';
+ btn.className = 'fas fa-chevron-up';
+ }
+ }
+}
+
// 导出函数供全局使用
window.searchAlbums = searchAlbums;
window.openRandomAlbum = openRandomAlbum;
@@ -1209,4 +1402,8 @@ window.loadAlbums = loadAlbums;
window.removeFavorite = removeFavorite;
window.previewFavorite = previewFavorite;
window.openFavoriteImage = openFavoriteImage;
-window.removeFavoriteFromPreview = removeFavoriteFromPreview;
\ No newline at end of file
+window.removeFavoriteFromPreview = removeFavoriteFromPreview;
+window.filterByTag = filterByTag;
+window.filterByPerson = filterByPerson;
+window.clearFilter = clearFilter;
+window.toggleSection = toggleSection;
\ No newline at end of file