From 3a00c9dce729b6567c2cb4bbfa7078eaeeebaf9f Mon Sep 17 00:00:00 2001 From: kjqwer <2990346238@qq.com> Date: Fri, 29 Aug 2025 08:15:58 +0800 Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E9=9D=9E=E5=85=AC=E5=BC=80?= =?UTF-8?q?=E5=85=B3=E6=B3=A8=E5=92=8C=E5=85=B3=E6=B3=A8=E5=8C=BA=E5=88=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- backend/routes/artist.js | 5 +- backend/services/artist.js | 59 ++++++++----- ui/src/services/artist.ts | 5 +- ui/src/stores/artist.ts | 18 ++-- ui/src/views/ArtistsView.vue | 158 +++++++++++++++++++++++++++++++---- 5 files changed, 197 insertions(+), 48 deletions(-) diff --git a/backend/routes/artist.js b/backend/routes/artist.js index c7952ac..0c3b750 100644 --- a/backend/routes/artist.js +++ b/backend/routes/artist.js @@ -61,12 +61,11 @@ router.get('/search', async (req, res) => { */ router.get('/following', async (req, res) => { try { - const { offset = 0, limit = 30 } = req.query; + const { restrict = 'public' } = req.query; const artistService = new ArtistService(req.backend.getAuth()); const result = await artistService.getFollowingArtists({ - offset: parseInt(offset), - limit: parseInt(limit) + restrict }); if (result.success) { diff --git a/backend/services/artist.js b/backend/services/artist.js index 0503497..0f9324e 100644 --- a/backend/services/artist.js +++ b/backend/services/artist.js @@ -93,7 +93,7 @@ class ArtistService { */ async getArtistFollowing(artistId, options = {}) { try { - const { restrict = 'public', offset = 0, limit = 30 } = options; + const { restrict = 'public', offset = 0, limit = 100 } = options; const params = { user_id: artistId, @@ -124,7 +124,7 @@ class ArtistService { */ async getArtistFollowers(artistId, options = {}) { try { - const { offset = 0, limit = 30 } = options; + const { offset = 0, limit = 100 } = options; const params = { user_id: artistId, @@ -154,7 +154,7 @@ class ArtistService { */ async getFollowingArtists(options = {}) { try { - const { offset = 0, limit = 30 } = options; + const { offset = 0, limit = 30, restrict = 'public' } = options; // 检查认证状态 if (!this.auth || !this.auth.accessToken) { @@ -180,29 +180,48 @@ class ArtistService { }; } - const params = { - user_id: currentUserId, - restrict: 'public', - offset, - limit, - }; + let allArtists = []; + let currentOffset = offset; + let hasMore = true; - const response = await this.makeRequest('GET', `/v1/user/following?${stringify(params)}`); + // 循环获取所有关注的作者 + while (hasMore) { + const params = { + user_id: currentUserId, + restrict, + offset: currentOffset, + limit, + }; - // 转换数据格式以匹配前端期望 - const artists = (response.user_previews || []).map(user => ({ - id: user.user.id, - name: user.user.name, - account: user.user.account, - profile_image_urls: user.user.profile_image_urls, - is_followed: user.user.is_followed || false, - })); + console.log(`请求关注列表: offset=${currentOffset}, limit=${limit}`); + const response = await this.makeRequest('GET', `/v1/user/following?${stringify(params)}`); + + // 转换数据格式以匹配前端期望 + const artists = (response.user_previews || []).map(user => ({ + id: user.user.id, + name: user.user.name, + account: user.user.account, + profile_image_urls: user.user.profile_image_urls, + is_followed: user.user.is_followed || false, + })); + + allArtists.push(...artists); + console.log(`本次获取到 ${artists.length} 个作者，累计 ${allArtists.length} 个`); + + // 如果返回的数量少于limit，说明已经获取完所有数据 + if (artists.length < limit) { + hasMore = false; + console.log('已获取完所有关注的作者'); + } else { + currentOffset += artists.length; + } + } return { success: true, data: { - artists: artists, - total: artists.length, + artists: allArtists, + total: allArtists.length, }, }; } catch (error) { diff --git a/ui/src/services/artist.ts b/ui/src/services/artist.ts index 5e13c14..b21dbed 100644 --- a/ui/src/services/artist.ts +++ b/ui/src/services/artist.ts @@ -85,10 +85,9 @@ class ArtistService { /** * 获取当前用户关注的作者列表 */ - async getFollowingArtists(options: { offset?: number; limit?: number } = {}): Promise> { + async getFollowingArtists(options: { restrict?: 'public' | 'private' } = {}): Promise> { const params = new URLSearchParams(); - if (options.offset !== undefined) params.append('offset', options.offset.toString()); - if (options.limit !== undefined) params.append('limit', options.limit.toString()); + if (options.restrict) params.append('restrict', options.restrict); const query = params.toString(); const url = query ? `/api/artist/following?${query}` : '/api/artist/following'; diff --git a/ui/src/stores/artist.ts b/ui/src/stores/artist.ts index ab23fba..c41a2f6 100644 --- a/ui/src/stores/artist.ts +++ b/ui/src/stores/artist.ts @@ -26,7 +26,7 @@ export const useArtistStore = defineStore('artist', () => { }); // 获取关注的作者 - const fetchFollowingArtists = async (forceRefresh = false) => { + const fetchFollowingArtists = async (forceRefresh = false, options: { restrict?: 'public' | 'private' } = {}) => { // 如果数据不是过期的且不是强制刷新，直接返回缓存的数据 if (!forceRefresh && !isDataStale.value && hasFollowingArtists.value) { return { @@ -39,12 +39,18 @@ export const useArtistStore = defineStore('artist', () => { loading.value = true; error.value = null; - const response = await artistService.getFollowingArtists(); + const restrict = options.restrict || 'public'; + + // 后端会自动循环获取所有数据 + const response = await artistService.getFollowingArtists({ + restrict: restrict + }); + if (response.success && response.data) { followingArtists.value = response.data.artists; lastFetchTime.value = Date.now(); } else { - throw new Error(response.error || '获取关注列表失败'); + throw new Error('获取关注列表失败'); } return response; @@ -70,7 +76,7 @@ export const useArtistStore = defineStore('artist', () => { searchResults.value = response.data.artists; return response; } else { - throw new Error(response.error || '搜索失败'); + throw new Error('搜索失败'); } } catch (err) { error.value = err instanceof Error ? err.message : '搜索失败'; @@ -97,7 +103,7 @@ export const useArtistStore = defineStore('artist', () => { followingArtists.value.push(artistToAdd); } } else { - throw new Error(response.error || '关注失败'); + throw new Error('关注失败'); } return response; @@ -123,7 +129,7 @@ export const useArtistStore = defineStore('artist', () => { artist.is_followed = false; } } else { - throw new Error(response.error || '取消关注失败'); + throw new Error('取消关注失败'); } return response; diff --git a/ui/src/views/ArtistsView.vue b/ui/src/views/ArtistsView.vue index 38731a7..8514fe1 100644 --- a/ui/src/views/ArtistsView.vue +++ b/ui/src/views/ArtistsView.vue @@ -4,6 +4,23 @@

作者管理

+ +
+ +
+ 共 {{ artistStore.followingArtists.length }} 个关注的作者 +
+
@@ -281,6 +341,45 @@ onMounted(() => { gap: 1rem; } +.follow-type-toggle { + display: flex; + gap: 0.25rem; + background: #f3f4f6; + border: 1px solid #d1d5db; + border-radius: 0.5rem; + padding: 0.25rem; + margin-right: 1rem; +} + +.toggle-btn { + background: none; + border: none; + padding: 0.5rem 1rem; + cursor: pointer; + font-size: 0.875rem; + color: #6b7280; + border-radius: 0.375rem; + transition: all 0.2s; + font-weight: 500; +} + +.toggle-btn:hover:not(:disabled) { + background: #e5e7eb; + color: #374151; +} + +.toggle-btn:disabled { + background: #f9fafb; + color: #9ca3af; + cursor: not-allowed; +} + +.toggle-btn.active { + background: #4f46e5; + color: white; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); +} + .refresh-icon { width: 1rem; height: 1rem; @@ -348,14 +447,25 @@ onMounted(() => { height: 0.875rem; } +.stats-section { + display: flex; + justify-content: space-between; + align-items: center; + margin-bottom: 1rem; + padding: 0.75rem 1rem; + background: #f3f4f6; + border-radius: 0.5rem; + font-size: 0.875rem; + color: #6b7280; +} + .artists-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 1.5rem; + margin-bottom: 2rem; } - - .empty-section { text-align: center; padding: 4rem 0; @@ -574,8 +684,24 @@ onMounted(() => { align-items: stretch; } + .header-actions { + flex-direction: column; + gap: 1rem; + } + + .follow-type-toggle { + margin-right: 0; + justify-content: center; + } + .artists-grid { grid-template-columns: 1fr; } + + .stats-section { + flex-direction: column; + gap: 0.5rem; + text-align: center; + } } \ No newline at end of file