feat: 优化歌单懒加载加载策略，并修复播放栏遮挡问题

[4everWZ]

🤔 这个 PR 的性质是？

• 日常 bug 修复
• 新特性提交
• 文档改进
• 演示代码改进
• 组件样式/交互改进
• CI/CD 改进
• 重构
• 代码风格优化
• 测试用例
• 分支合并
• 其他

🔗 相关 Issue

#547

💡 需求背景和解决方案

1. 要解决的具体问题 (The specific problem being resolved)

• 性能问题：当且仅当列表项（已下载、本地音乐、大歌单）数量较多（>500）时，页面加载会出现显著卡顿（主要由一次性全量请求和大量 DOM 渲染引起）。

• 布局 Bug：底部播放栏（PlayBottom）在播放状态下会遮挡列表的最后几项，导致无法操作。

• 内存优化

  ：旧有的普通列表渲染 ( v-for ) 在长列表中占用大量内存，影响应用稳定性。

2. 最终实现的 API 和用法 (Final API Implementation & Usage)

A. 下载页面 (DownloadPage) - 懒加载重构

将原有的全量加载重构为分批懒加载模式：

// 核心逻辑：本地文件全量读取 -> 内存切片 -> 分批请求详情

const loadMoreDownloaded = async () => {
  // 1. 获取当前批次的本地文件记录 (Batch Size: 50)
  const batchRecords = allLocalRecords.value.slice(start, end);
  // 2. 仅请求当前批次的云端详情
  const processedBatch = await getMusicDetail(ids);
  // 3. 追加到显示列表
  downloadedList.value = [...downloadedList.value, ...processedBatch];
}

B. 虚拟列表集成 (Virtual List Integration)

在 DownloadPage、FavoritePage 和 MusicListPage 中统一引入 ：

<n-virtual-list
  :items="displayList"
  :item-size="64" <!-- 固定高度优化渲染 -->
  key-field="id"
  @scroll="handleVirtualScroll" <!-- 滚动触底触发加载 -->
  :style="{ height: isPlay ? 'calc(100vh - 210px)' : 'calc(100vh - 130px)' }" <!-- 动态高度 -->
>
  <template #default="{ item }">
    <song-item :item="item" />
  </template>
</n-virtual-list>

3. UI/交互变动 (UI/Interaction Changes)

✅ 布局修复 (Layout Fix)

播放栏不再遮挡列表底部：

📝 更新日志

1. 针对下载页面的优化：

   perf(DownloadPage): refactor to use batch lazy loading and virtual list
   

2. 针对收藏页面的优化：

   perf(FavoritePage): replace standard list with n-virtual-list
   

3. 针对布局遮挡修复：

   fix(Layout): prevent player bar from obscuring list bottom content
   

• 本条 PR 不需要纳入 Changelog

☑️ 请求合并前的自查清单

⚠️ 请自检并全部勾选全部选项。⚠️

• 文档已补充或无须补充
• 代码演示已提供或无须提供
• TypeScript 定义已补充或无须补充
• Changelog 已提供或无须提供

[Copilot]

Pull request overview

This PR optimizes playlist performance and fixes a layout issue where the player bar was obscuring list content. The changes introduce virtual list rendering with lazy loading to improve performance for large playlists (>500 items), and dynamically adjust list heights based on player state.

Key Changes

• Implemented virtual list rendering using n-virtual-list in Download, Favorite, and MusicList pages
• Added batch lazy loading for downloaded music (50 items per batch) to reduce initial load time and memory usage
• Introduced dynamic height calculations that adjust list heights based on whether the player is active

Reviewed changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 6 comments.

File	Description
src/renderer/views/download/DownloadPage.vue	Refactored to use virtual list with batch lazy loading (50 items/batch), added pagination state management, and dynamic height based on player state
src/renderer/views/favorite/index.vue	Replaced n-scrollbar with n-virtual-list for better performance, added dynamic height calculation
src/renderer/views/music/MusicListPage.vue	Changed from eager loading (loadFullPlaylist) to lazy loading strategy, removed manual spacing workaround, added dynamic height

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

The finally block at line 837 sets isLoadingDownloaded to false, but this is redundant when loadMoreDownloaded() succeeds (since it already sets it to false in its own finally block at line 757). Consider removing the finally block here, or restructuring the logic so that refreshDownloadedList only manages the loading state for the initial data fetch, not for the first page load.