mirror of
https://github.com/algerkong/AlgerMusicPlayer.git
synced 2026-04-03 14:20:50 +08:00
feat: 添加下载设置功能,支持自定义文件名格式和下载路径配置
- 新增下载设置抽屉,允许用户设置下载路径和文件名格式 - 支持多种文件名格式预设和自定义格式 - 实现下载项的显示名称格式化 - 优化下载管理逻辑,避免重复通知
This commit is contained in:
@@ -3,17 +3,20 @@ export default {
|
||||
localMusic: 'Local Music',
|
||||
count: '{count} songs in total',
|
||||
clearAll: 'Clear All',
|
||||
settings: 'Settings',
|
||||
tabs: {
|
||||
downloading: 'Downloading',
|
||||
downloaded: 'Downloaded'
|
||||
},
|
||||
empty: {
|
||||
noTasks: 'No download tasks',
|
||||
noDownloaded: 'No downloaded songs'
|
||||
noDownloaded: 'No downloaded songs',
|
||||
noDownloadedHint: 'Download your favorite songs to listen offline'
|
||||
},
|
||||
progress: {
|
||||
total: 'Total Progress: {progress}%'
|
||||
},
|
||||
items: 'items',
|
||||
status: {
|
||||
downloading: 'Downloading',
|
||||
completed: 'Completed',
|
||||
@@ -43,7 +46,8 @@ export default {
|
||||
},
|
||||
message: {
|
||||
downloadComplete: '{filename} download completed',
|
||||
downloadFailed: '{filename} download failed: {error}'
|
||||
downloadFailed: '{filename} download failed: {error}',
|
||||
alreadyDownloading: '{filename} is already downloading'
|
||||
},
|
||||
loading: 'Loading...',
|
||||
playStarted: 'Play started: {name}',
|
||||
@@ -51,5 +55,37 @@ export default {
|
||||
path: {
|
||||
copied: 'Path copied to clipboard',
|
||||
copyFailed: 'Failed to copy path'
|
||||
},
|
||||
settingsPanel: {
|
||||
title: 'Download Settings',
|
||||
path: 'Download Location',
|
||||
pathDesc: 'Set where your music files will be saved',
|
||||
pathPlaceholder: 'Please select download path',
|
||||
noPathSelected: 'Please select download path first',
|
||||
select: 'Select Folder',
|
||||
open: 'Open Folder',
|
||||
fileFormat: 'Filename Format',
|
||||
fileFormatDesc: 'Set how downloaded music files will be named',
|
||||
customFormat: 'Custom Format',
|
||||
separator: 'Separator',
|
||||
separators: {
|
||||
dash: 'Space-dash-space',
|
||||
underscore: 'Underscore',
|
||||
space: 'Space'
|
||||
},
|
||||
dragToArrange: 'Sort or use arrow buttons to arrange:',
|
||||
formatVariables: 'Available variables',
|
||||
preview: 'Preview:',
|
||||
saveSuccess: 'Download settings saved',
|
||||
presets: {
|
||||
songArtist: 'Song - Artist',
|
||||
artistSong: 'Artist - Song',
|
||||
songOnly: 'Song only'
|
||||
},
|
||||
components: {
|
||||
songName: 'Song name',
|
||||
artistName: 'Artist name',
|
||||
albumName: 'Album name'
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@@ -3,6 +3,7 @@ export default {
|
||||
localMusic: '本地音乐',
|
||||
count: '共 {count} 首歌曲',
|
||||
clearAll: '清空记录',
|
||||
settings: '设置',
|
||||
tabs: {
|
||||
downloading: '下载中',
|
||||
downloaded: '已下载'
|
||||
@@ -50,5 +51,37 @@ export default {
|
||||
path: {
|
||||
copied: '路径已复制到剪贴板',
|
||||
copyFailed: '复制路径失败'
|
||||
},
|
||||
settingsPanel: {
|
||||
title: '下载设置',
|
||||
path: '下载位置',
|
||||
pathDesc: '设置音乐文件下载保存的位置',
|
||||
pathPlaceholder: '请选择下载路径',
|
||||
noPathSelected: '请先选择下载路径',
|
||||
select: '选择文件夹',
|
||||
open: '打开文件夹',
|
||||
fileFormat: '文件名格式',
|
||||
fileFormatDesc: '设置下载音乐时的文件命名格式',
|
||||
customFormat: '自定义格式',
|
||||
separator: '分隔符',
|
||||
separators: {
|
||||
dash: '空格-空格',
|
||||
underscore: '下划线',
|
||||
space: '空格'
|
||||
},
|
||||
dragToArrange: '拖动排序或使用箭头按钮调整顺序:',
|
||||
formatVariables: '可用变量',
|
||||
preview: '预览效果:',
|
||||
saveSuccess: '下载设置已保存',
|
||||
presets: {
|
||||
songArtist: '歌曲名 - 歌手名',
|
||||
artistSong: '歌手名 - 歌曲名',
|
||||
songOnly: '仅歌曲名'
|
||||
},
|
||||
components: {
|
||||
songName: '歌曲名',
|
||||
artistName: '歌手名',
|
||||
albumName: '专辑名'
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@@ -34,6 +34,9 @@ const audioCacheStore = new Store({
|
||||
}
|
||||
});
|
||||
|
||||
// 保存已发送通知的文件,避免重复通知
|
||||
const sentNotifications = new Map();
|
||||
|
||||
/**
|
||||
* 初始化文件管理相关的IPC监听
|
||||
*/
|
||||
@@ -123,6 +126,23 @@ export function initializeFileManager() {
|
||||
}
|
||||
});
|
||||
|
||||
// 获取默认下载路径
|
||||
ipcMain.handle('get-downloads-path', () => {
|
||||
return app.getPath('downloads');
|
||||
});
|
||||
|
||||
// 获取存储的配置值
|
||||
ipcMain.handle('get-store-value', (_, key) => {
|
||||
const store = new Store();
|
||||
return store.get(key);
|
||||
});
|
||||
|
||||
// 设置存储的配置值
|
||||
ipcMain.on('set-store-value', (_, key, value) => {
|
||||
const store = new Store();
|
||||
store.set(key, value);
|
||||
});
|
||||
|
||||
// 下载音乐处理
|
||||
ipcMain.on('download-music', handleDownloadRequest);
|
||||
|
||||
@@ -358,9 +378,28 @@ async function downloadMusic(
|
||||
const downloadPath =
|
||||
(configStore.get('set.downloadPath') as string) || app.getPath('downloads');
|
||||
const apiPort = configStore.get('set.musicApiPort') || 30488;
|
||||
|
||||
// 获取文件名格式设置
|
||||
const nameFormat =
|
||||
(configStore.get('set.downloadNameFormat') as string) || '{songName} - {artistName}';
|
||||
|
||||
// 根据格式创建文件名
|
||||
let formattedFilename = filename;
|
||||
if (songInfo) {
|
||||
// 准备替换变量
|
||||
const artistName = songInfo.ar?.map((a: any) => a.name).join('/') || '未知艺术家';
|
||||
const songName = songInfo.name || filename;
|
||||
const albumName = songInfo.al?.name || '未知专辑';
|
||||
|
||||
// 应用自定义格式
|
||||
formattedFilename = nameFormat
|
||||
.replace(/\{songName\}/g, songName)
|
||||
.replace(/\{artistName\}/g, artistName)
|
||||
.replace(/\{albumName\}/g, albumName);
|
||||
}
|
||||
|
||||
// 清理文件名中的非法字符
|
||||
const sanitizedFilename = sanitizeFilename(filename);
|
||||
const sanitizedFilename = sanitizeFilename(formattedFilename);
|
||||
|
||||
// 创建临时文件路径 (在系统临时目录中创建)
|
||||
const tempDir = path.join(os.tmpdir(), 'AlgerMusicPlayerTemp');
|
||||
@@ -635,27 +674,38 @@ async function downloadMusic(
|
||||
history.unshift(newSongInfo);
|
||||
downloadStore.set('history', history);
|
||||
|
||||
// 发送桌面通知
|
||||
try {
|
||||
const artistNames =
|
||||
(songInfo?.ar || songInfo?.song?.artists)?.map((a: any) => a.name).join('/') ||
|
||||
'未知艺术家';
|
||||
const notification = new Notification({
|
||||
title: '下载完成',
|
||||
body: `${songInfo?.name || filename} - ${artistNames}`,
|
||||
silent: false
|
||||
});
|
||||
|
||||
notification.on('click', () => {
|
||||
shell.showItemInFolder(finalFilePath);
|
||||
});
|
||||
|
||||
notification.show();
|
||||
} catch (notifyError) {
|
||||
console.error('发送通知失败:', notifyError);
|
||||
// 避免重复发送通知
|
||||
const notificationId = `download-${finalFilePath}`;
|
||||
if (!sentNotifications.has(notificationId)) {
|
||||
sentNotifications.set(notificationId, true);
|
||||
|
||||
// 发送桌面通知
|
||||
try {
|
||||
const artistNames =
|
||||
(songInfo?.ar || songInfo?.song?.artists)?.map((a: any) => a.name).join('/') ||
|
||||
'未知艺术家';
|
||||
const notification = new Notification({
|
||||
title: '下载完成',
|
||||
body: `${songInfo?.name || filename} - ${artistNames}`,
|
||||
silent: false
|
||||
});
|
||||
|
||||
notification.on('click', () => {
|
||||
shell.showItemInFolder(finalFilePath);
|
||||
});
|
||||
|
||||
notification.show();
|
||||
|
||||
// 60秒后清理通知记录,释放内存
|
||||
setTimeout(() => {
|
||||
sentNotifications.delete(notificationId);
|
||||
}, 60000);
|
||||
} catch (notifyError) {
|
||||
console.error('发送通知失败:', notifyError);
|
||||
}
|
||||
}
|
||||
|
||||
// 发送下载完成事件
|
||||
// 发送下载完成事件,确保只发送一次
|
||||
event.reply('music-download-complete', {
|
||||
success: true,
|
||||
path: finalFilePath,
|
||||
|
||||
@@ -6,11 +6,145 @@ import { useMessage } from 'naive-ui';
|
||||
import { getSongUrl } from '@/store/modules/player';
|
||||
import type { SongResult } from '@/type/music';
|
||||
|
||||
// 全局下载管理(闭包模式)
|
||||
const createDownloadManager = () => {
|
||||
// 正在下载的文件集合
|
||||
const activeDownloads = new Set<string>();
|
||||
|
||||
// 已经发送了通知的文件集合(避免重复通知)
|
||||
const notifiedDownloads = new Set<string>();
|
||||
|
||||
// 事件监听器是否已初始化
|
||||
let isInitialized = false;
|
||||
|
||||
// 监听器引用(用于清理)
|
||||
let completeListener: ((event: any, data: any) => void) | null = null;
|
||||
let errorListener: ((event: any, data: any) => void) | null = null;
|
||||
|
||||
return {
|
||||
// 添加下载
|
||||
addDownload: (filename: string) => {
|
||||
activeDownloads.add(filename);
|
||||
},
|
||||
|
||||
// 移除下载
|
||||
removeDownload: (filename: string) => {
|
||||
activeDownloads.delete(filename);
|
||||
// 延迟清理通知记录
|
||||
setTimeout(() => {
|
||||
notifiedDownloads.delete(filename);
|
||||
}, 5000);
|
||||
},
|
||||
|
||||
// 标记文件已通知
|
||||
markNotified: (filename: string) => {
|
||||
notifiedDownloads.add(filename);
|
||||
},
|
||||
|
||||
// 检查文件是否已通知
|
||||
isNotified: (filename: string) => {
|
||||
return notifiedDownloads.has(filename);
|
||||
},
|
||||
|
||||
// 清理所有下载
|
||||
clearDownloads: () => {
|
||||
activeDownloads.clear();
|
||||
notifiedDownloads.clear();
|
||||
},
|
||||
|
||||
// 初始化事件监听器
|
||||
initEventListeners: (message: any, t: any) => {
|
||||
if (isInitialized) return;
|
||||
|
||||
// 移除可能存在的旧监听器
|
||||
if (completeListener) {
|
||||
window.electron.ipcRenderer.removeListener('music-download-complete', completeListener);
|
||||
}
|
||||
|
||||
if (errorListener) {
|
||||
window.electron.ipcRenderer.removeListener('music-download-error', errorListener);
|
||||
}
|
||||
|
||||
// 创建新的监听器
|
||||
completeListener = (_event, data) => {
|
||||
if (!data.filename || !activeDownloads.has(data.filename)) return;
|
||||
|
||||
// 如果该文件已经通知过,则跳过
|
||||
if (notifiedDownloads.has(data.filename)) return;
|
||||
|
||||
// 标记为已通知
|
||||
notifiedDownloads.add(data.filename);
|
||||
|
||||
// 从活动下载移除
|
||||
activeDownloads.delete(data.filename);
|
||||
};
|
||||
|
||||
errorListener = (_event, data) => {
|
||||
if (!data.filename || !activeDownloads.has(data.filename)) return;
|
||||
|
||||
// 如果该文件已经通知过,则跳过
|
||||
if (notifiedDownloads.has(data.filename)) return;
|
||||
|
||||
// 标记为已通知
|
||||
notifiedDownloads.add(data.filename);
|
||||
|
||||
// 显示失败通知
|
||||
message.error(t('songItem.message.downloadFailed', {
|
||||
filename: data.filename,
|
||||
error: data.error || '未知错误'
|
||||
}));
|
||||
|
||||
// 从活动下载移除
|
||||
activeDownloads.delete(data.filename);
|
||||
};
|
||||
|
||||
// 添加监听器
|
||||
window.electron.ipcRenderer.on('music-download-complete', completeListener);
|
||||
window.electron.ipcRenderer.on('music-download-error', errorListener);
|
||||
|
||||
isInitialized = true;
|
||||
},
|
||||
|
||||
// 清理事件监听器
|
||||
cleanupEventListeners: () => {
|
||||
if (!isInitialized) return;
|
||||
|
||||
if (completeListener) {
|
||||
window.electron.ipcRenderer.removeListener('music-download-complete', completeListener);
|
||||
completeListener = null;
|
||||
}
|
||||
|
||||
if (errorListener) {
|
||||
window.electron.ipcRenderer.removeListener('music-download-error', errorListener);
|
||||
errorListener = null;
|
||||
}
|
||||
|
||||
isInitialized = false;
|
||||
},
|
||||
|
||||
// 获取活跃下载数量
|
||||
getActiveDownloadCount: () => {
|
||||
return activeDownloads.size;
|
||||
},
|
||||
|
||||
// 检查是否有特定文件正在下载
|
||||
hasDownload: (filename: string) => {
|
||||
return activeDownloads.has(filename);
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
// 创建单例下载管理器
|
||||
const downloadManager = createDownloadManager();
|
||||
|
||||
export const useDownload = () => {
|
||||
const { t } = useI18n();
|
||||
const message = useMessage();
|
||||
const isDownloading = ref(false);
|
||||
|
||||
// 初始化事件监听器
|
||||
downloadManager.initEventListeners(message, t);
|
||||
|
||||
/**
|
||||
* 下载单首音乐
|
||||
* @param song 歌曲信息
|
||||
@@ -33,9 +167,19 @@ export const useDownload = () => {
|
||||
// 构建文件名
|
||||
const artistNames = (song.ar || song.song?.artists)?.map((a) => a.name).join(',');
|
||||
const filename = `${song.name} - ${artistNames}`;
|
||||
|
||||
// 检查是否已在下载
|
||||
if (downloadManager.hasDownload(filename)) {
|
||||
isDownloading.value = false;
|
||||
return;
|
||||
}
|
||||
|
||||
// 添加到活动下载集合
|
||||
downloadManager.addDownload(filename);
|
||||
|
||||
const songData = cloneDeep(song);
|
||||
songData.ar = songData.ar || songData.song?.artists;
|
||||
|
||||
// 发送下载请求
|
||||
window.electron.ipcRenderer.send('download-music', {
|
||||
url: typeof musicUrl === 'string' ? musicUrl : musicUrl.url,
|
||||
@@ -43,39 +187,16 @@ export const useDownload = () => {
|
||||
songInfo: {
|
||||
...songData,
|
||||
downloadTime: Date.now()
|
||||
}
|
||||
},
|
||||
type: musicUrl.type
|
||||
});
|
||||
|
||||
message.success(t('songItem.message.downloadQueued'));
|
||||
|
||||
// 监听下载完成事件
|
||||
const handleDownloadComplete = (_, result) => {
|
||||
if (result.filename === filename) {
|
||||
isDownloading.value = false;
|
||||
removeListeners();
|
||||
}
|
||||
};
|
||||
|
||||
// 监听下载错误事件
|
||||
const handleDownloadError = (_, result) => {
|
||||
if (result.filename === filename) {
|
||||
isDownloading.value = false;
|
||||
removeListeners();
|
||||
}
|
||||
};
|
||||
|
||||
// 移除监听器函数
|
||||
const removeListeners = () => {
|
||||
window.electron.ipcRenderer.removeListener('music-download-complete', handleDownloadComplete);
|
||||
window.electron.ipcRenderer.removeListener('music-download-error', handleDownloadError);
|
||||
};
|
||||
|
||||
// 添加事件监听器
|
||||
window.electron.ipcRenderer.once('music-download-complete', handleDownloadComplete);
|
||||
window.electron.ipcRenderer.once('music-download-error', handleDownloadError);
|
||||
|
||||
// 30秒后自动清理监听器(以防下载过程中出现未知错误)
|
||||
setTimeout(removeListeners, 30000);
|
||||
|
||||
// 简化的监听逻辑,基本通知由全局监听器处理
|
||||
setTimeout(() => {
|
||||
isDownloading.value = false;
|
||||
}, 2000);
|
||||
} catch (error: any) {
|
||||
console.error('Download error:', error);
|
||||
isDownloading.value = false;
|
||||
@@ -103,27 +224,17 @@ export const useDownload = () => {
|
||||
isDownloading.value = true;
|
||||
message.success(t('favorite.downloading'));
|
||||
|
||||
// 移除旧的监听器
|
||||
window.electron.ipcRenderer.removeAllListeners('music-download-complete');
|
||||
|
||||
let successCount = 0;
|
||||
let failCount = 0;
|
||||
|
||||
// 添加新的监听器
|
||||
window.electron.ipcRenderer.on('music-download-complete', (_, result) => {
|
||||
if (result.success) {
|
||||
successCount++;
|
||||
} else {
|
||||
failCount++;
|
||||
}
|
||||
|
||||
// 当所有下载完成时
|
||||
if (successCount + failCount === songs.length) {
|
||||
const totalCount = songs.length;
|
||||
|
||||
// 下载进度追踪
|
||||
const trackProgress = () => {
|
||||
if (successCount + failCount === totalCount) {
|
||||
isDownloading.value = false;
|
||||
message.success(t('favorite.downloadSuccess'));
|
||||
window.electron.ipcRenderer.removeAllListeners('music-download-complete');
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 并行获取所有歌曲的下载链接
|
||||
const downloadUrls = await Promise.all(
|
||||
@@ -133,6 +244,7 @@ export const useDownload = () => {
|
||||
return { song, ...data };
|
||||
} catch (error) {
|
||||
console.error(`获取歌曲 ${song.name} 下载链接失败:`, error);
|
||||
failCount++;
|
||||
return { song, url: null };
|
||||
}
|
||||
})
|
||||
@@ -142,21 +254,41 @@ export const useDownload = () => {
|
||||
downloadUrls.forEach(({ song, url, type }) => {
|
||||
if (!url) {
|
||||
failCount++;
|
||||
trackProgress();
|
||||
return;
|
||||
}
|
||||
|
||||
const songData = cloneDeep(song);
|
||||
const filename = `${song.name} - ${(song.ar || song.song?.artists)?.map((a) => a.name).join(',')}`;
|
||||
|
||||
// 检查是否已在下载
|
||||
if (downloadManager.hasDownload(filename)) {
|
||||
failCount++;
|
||||
trackProgress();
|
||||
return;
|
||||
}
|
||||
|
||||
// 添加到活动下载集合
|
||||
downloadManager.addDownload(filename);
|
||||
|
||||
const songInfo = {
|
||||
...songData,
|
||||
ar: songData.ar || songData.song?.artists,
|
||||
downloadTime: Date.now()
|
||||
};
|
||||
|
||||
window.electron.ipcRenderer.send('download-music', {
|
||||
url,
|
||||
filename: `${song.name} - ${(song.ar || song.song?.artists)?.map((a) => a.name).join(',')}`,
|
||||
filename,
|
||||
songInfo,
|
||||
type
|
||||
});
|
||||
|
||||
successCount++;
|
||||
});
|
||||
|
||||
// 所有下载开始后,检查进度
|
||||
trackProgress();
|
||||
} catch (error) {
|
||||
console.error('下载失败:', error);
|
||||
isDownloading.value = false;
|
||||
|
||||
@@ -2,20 +2,26 @@
|
||||
<div class="download-page">
|
||||
<div class="page-header">
|
||||
<h1 class="page-title">{{ t('download.title') }}</h1>
|
||||
<div class="segment-control">
|
||||
<div
|
||||
class="segment-item"
|
||||
:class="{ 'active': tabName === 'downloading' }"
|
||||
@click="tabName = 'downloading'"
|
||||
>
|
||||
{{ t('download.tabs.downloading') }}
|
||||
</div>
|
||||
<div
|
||||
class="segment-item"
|
||||
:class="{ 'active': tabName === 'downloaded' }"
|
||||
@click="tabName = 'downloaded'"
|
||||
>
|
||||
{{ t('download.tabs.downloaded') }}
|
||||
<div class="flex items-center gap-3">
|
||||
<n-button size="small" @click="showSettingsDrawer = true">
|
||||
<template #icon><i class="iconfont ri-settings-3-line"></i></template>
|
||||
{{ t('download.settings') }}
|
||||
</n-button>
|
||||
<div class="segment-control">
|
||||
<div
|
||||
class="segment-item"
|
||||
:class="{ 'active': tabName === 'downloading' }"
|
||||
@click="tabName = 'downloading'"
|
||||
>
|
||||
{{ t('download.tabs.downloading') }}
|
||||
</div>
|
||||
<div
|
||||
class="segment-item"
|
||||
:class="{ 'active': tabName === 'downloaded' }"
|
||||
@click="tabName = 'downloaded'"
|
||||
>
|
||||
{{ t('download.tabs.downloaded') }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -120,8 +126,8 @@
|
||||
<img :src="getImgUrl(item.picUrl, '200y200')" alt="Cover" />
|
||||
</div>
|
||||
<div class="item-info flex items-center gap-4 w-full">
|
||||
<div class="item-name min-w-[160px] max-w-[160px] truncate" :title="item.filename">
|
||||
{{ item.filename }}
|
||||
<div class="item-name min-w-[160px] max-w-[160px] truncate" :title="item.displayName || item.filename">
|
||||
{{ item.displayName || item.filename }}
|
||||
</div>
|
||||
<div class="item-artist min-w-[120px] max-w-[120px] flex items-center gap-1 truncate">
|
||||
<i class="iconfont ri-user-line"></i>
|
||||
@@ -166,7 +172,7 @@
|
||||
<span>{{ t('download.delete.title') }}</span>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
{{ t('download.delete.message', { filename: itemToDelete?.filename }) }}
|
||||
{{ t('download.delete.message', { filename: itemToDelete?.displayName || itemToDelete?.filename }) }}
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button class="modal-btn cancel" @click="showDeleteConfirm = false">
|
||||
@@ -199,6 +205,164 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 下载设置抽屉 -->
|
||||
<n-drawer v-model:show="showSettingsDrawer" :width="380" placement="right" :z-index="999999999">
|
||||
<n-drawer-content :native-scrollbar="false">
|
||||
<template #header>
|
||||
<div class="flex items-center justify-between">
|
||||
<div class="text-lg font-bold">{{ t('download.settingsPanel.title') }}</div>
|
||||
<n-button type="primary" @click="saveDownloadSettings">
|
||||
{{ t('common.save') }}
|
||||
</n-button>
|
||||
</div>
|
||||
</template>
|
||||
<div class="download-settings">
|
||||
<!-- 下载路径设置 -->
|
||||
<div class="setting-item">
|
||||
<div class="setting-title">{{ t('download.settingsPanel.path') }}</div>
|
||||
<div class="setting-desc">{{ t('download.settingsPanel.pathDesc') }}</div>
|
||||
<div class="flex flex-col gap-2 mt-2">
|
||||
<n-input
|
||||
v-model:value="downloadSettings.path"
|
||||
:placeholder="t('download.settingsPanel.pathPlaceholder')"
|
||||
readonly
|
||||
class="flex-1"
|
||||
/>
|
||||
<div class="flex items-center gap-2">
|
||||
<n-button class="flex-1" @click="selectDownloadPath">{{ t('download.settingsPanel.select') }}</n-button>
|
||||
<n-button class="flex-1" @click="openDownloadPath">
|
||||
{{ t('download.settingsPanel.open') }}
|
||||
<i class="iconfont ri-folder-open-line"></i>
|
||||
</n-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 文件名格式设置 -->
|
||||
<div class="setting-item">
|
||||
<div class="setting-title">{{ t('download.settingsPanel.fileFormat') }}</div>
|
||||
<div class="setting-desc">{{ t('download.settingsPanel.fileFormatDesc') }}</div>
|
||||
|
||||
<!-- 预设模板 -->
|
||||
<div class="flex gap-2 my-2">
|
||||
<n-button
|
||||
size="small"
|
||||
:type="downloadSettings.nameFormat === '{songName} - {artistName}' ? 'primary' : 'default'"
|
||||
@click="downloadSettings.nameFormat = '{songName} - {artistName}'"
|
||||
>
|
||||
{{ t('download.settingsPanel.presets.songArtist') }}
|
||||
</n-button>
|
||||
<n-button
|
||||
size="small"
|
||||
:type="downloadSettings.nameFormat === '{artistName} - {songName}' ? 'primary' : 'default'"
|
||||
@click="downloadSettings.nameFormat = '{artistName} - {songName}'"
|
||||
>
|
||||
{{ t('download.settingsPanel.presets.artistSong') }}
|
||||
</n-button>
|
||||
<n-button
|
||||
size="small"
|
||||
:type="downloadSettings.nameFormat === '{songName}' ? 'primary' : 'default'"
|
||||
@click="downloadSettings.nameFormat = '{songName}'"
|
||||
>
|
||||
{{ t('download.settingsPanel.presets.songOnly') }}
|
||||
</n-button>
|
||||
</div>
|
||||
|
||||
<!-- 分隔符设置 -->
|
||||
<div class="my-3">
|
||||
<div class="text-sm text-gray-500 mb-2">{{ t('download.settingsPanel.separator') || '分隔符' }}</div>
|
||||
<div class="flex items-center gap-2">
|
||||
<n-button
|
||||
size="small"
|
||||
:type="downloadSettings.separator === ' - ' ? 'primary' : 'default'"
|
||||
@click="downloadSettings.separator = ' - '"
|
||||
>
|
||||
{{ t('download.settingsPanel.separators.dash') || '空格-空格' }}
|
||||
</n-button>
|
||||
<n-button
|
||||
size="small"
|
||||
:type="downloadSettings.separator === '_' ? 'primary' : 'default'"
|
||||
@click="downloadSettings.separator = '_'"
|
||||
>
|
||||
{{ t('download.settingsPanel.separators.underscore') || '下划线' }}
|
||||
</n-button>
|
||||
<n-button
|
||||
size="small"
|
||||
:type="downloadSettings.separator === ' ' ? 'primary' : 'default'"
|
||||
@click="downloadSettings.separator = ' '"
|
||||
>
|
||||
{{ t('download.settingsPanel.separators.space') || '空格' }}
|
||||
</n-button>
|
||||
<n-input
|
||||
v-model:value="downloadSettings.separator"
|
||||
size="small"
|
||||
style="width: 100px"
|
||||
placeholder="自定义"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 组件排序 -->
|
||||
<div class="my-3">
|
||||
<div class="text-sm text-gray-500 mb-2">{{ t('download.settingsPanel.dragToArrange') }}</div>
|
||||
<div class="format-components">
|
||||
<div v-for="(component, index) in formatComponents" :key="component.id" class="format-item">
|
||||
<div class="flex items-center justify-between w-full">
|
||||
<span>{{ t(`download.settingsPanel.components.${component.type}`) }}</span>
|
||||
<div class="flex items-center">
|
||||
<n-button quaternary circle size="small" @click="handleMoveUp(index)" :disabled="index === 0">
|
||||
<template #icon><i class="iconfont ri-arrow-up-s-line"></i></template>
|
||||
</n-button>
|
||||
<n-button quaternary circle size="small" @click="handleMoveDown(index)" :disabled="index === formatComponents.length - 1">
|
||||
<template #icon><i class="iconfont ri-arrow-down-s-line"></i></template>
|
||||
</n-button>
|
||||
<n-button quaternary circle size="small" @click="removeFormatComponent(index)" :disabled="formatComponents.length <= 1">
|
||||
<template #icon><i class="iconfont ri-close-line"></i></template>
|
||||
</n-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-2 flex gap-2">
|
||||
<n-button size="small" @click="addFormatComponent('songName')" :disabled="formatComponents.some(c => c.type === 'songName')">
|
||||
+{{ t('download.settingsPanel.components.songName') }}
|
||||
</n-button>
|
||||
<n-button size="small" @click="addFormatComponent('artistName')" :disabled="formatComponents.some(c => c.type === 'artistName')">
|
||||
+{{ t('download.settingsPanel.components.artistName') }}
|
||||
</n-button>
|
||||
<n-button size="small" @click="addFormatComponent('albumName')" :disabled="formatComponents.some(c => c.type === 'albumName')">
|
||||
+{{ t('download.settingsPanel.components.albumName') }}
|
||||
</n-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 自定义格式 -->
|
||||
<div class="my-3">
|
||||
<div class="text-sm text-gray-500 mb-2">{{ t('download.settingsPanel.customFormat') }}</div>
|
||||
<n-input
|
||||
v-model:value="downloadSettings.nameFormat"
|
||||
placeholder="{artistName} - {songName} - {albumName}"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="mt-2 text-xs text-amber-500">
|
||||
<i class="iconfont ri-information-line"></i>
|
||||
{{ t('download.settingsPanel.formatVariables') }}:<br>
|
||||
{songName}, {artistName}, {albumName}
|
||||
</div>
|
||||
|
||||
<!-- 预览 -->
|
||||
<div class="format-preview mt-3 bg-gray-100 dark:bg-dark-300 p-2 rounded">
|
||||
<div class="text-xs text-gray-500 mb-1">{{ t('download.settingsPanel.preview') }}</div>
|
||||
<div class="preview-content">{{ formatNamePreview }}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</n-drawer-content>
|
||||
</n-drawer>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
@@ -233,6 +397,7 @@ interface DownloadedItem {
|
||||
id: number;
|
||||
picUrl: string;
|
||||
ar: { name: string }[];
|
||||
displayName?: string;
|
||||
}
|
||||
const tabName = ref('downloading');
|
||||
|
||||
@@ -330,14 +495,14 @@ const handlePlayMusic = async (item: DownloadedItem) => {
|
||||
const fileExists = await window.electron.ipcRenderer.invoke('check-file-exists', item.path);
|
||||
|
||||
if (!fileExists) {
|
||||
message.error(t('download.delete.fileNotFound', { name: item.filename }));
|
||||
message.error(t('download.delete.fileNotFound', { name: item.displayName || item.filename }));
|
||||
return;
|
||||
}
|
||||
|
||||
// 转换下载项为播放所需的歌曲对象
|
||||
const song: SongResult = {
|
||||
id: item.id,
|
||||
name: item.filename,
|
||||
name: item.displayName || item.filename,
|
||||
ar: item.ar?.map(a => ({
|
||||
id: 0,
|
||||
name: a.name,
|
||||
@@ -373,10 +538,10 @@ const handlePlayMusic = async (item: DownloadedItem) => {
|
||||
playerStore.setPlayMusic(true);
|
||||
playerStore.setIsPlay(true);
|
||||
|
||||
message.success(t('download.playStarted', { name: item.filename }));
|
||||
message.success(t('download.playStarted', { name: item.displayName || item.filename }));
|
||||
} catch (error) {
|
||||
console.error('播放音乐失败:', error);
|
||||
message.error(t('download.playFailed', { name: item.filename }));
|
||||
message.error(t('download.playFailed', { name: item.displayName || item.filename }));
|
||||
}
|
||||
};
|
||||
|
||||
@@ -439,6 +604,25 @@ const clearDownloadRecords = async () => {
|
||||
// 添加加载状态
|
||||
const isLoadingDownloaded = ref(false);
|
||||
|
||||
// 格式化歌曲名称,应用用户设置的格式
|
||||
const formatSongName = (songInfo) => {
|
||||
if (!songInfo) return '';
|
||||
|
||||
// 获取格式设置
|
||||
const nameFormat = downloadSettings.value.nameFormat || '{songName} - {artistName}';
|
||||
|
||||
// 准备替换变量
|
||||
const artistName = songInfo.ar?.map((a) => a.name).join('/') || '未知艺术家';
|
||||
const songName = songInfo.name || songInfo.filename || '未知歌曲';
|
||||
const albumName = songInfo.al?.name || '未知专辑';
|
||||
|
||||
// 应用自定义格式
|
||||
return nameFormat
|
||||
.replace(/\{songName\}/g, songName)
|
||||
.replace(/\{artistName\}/g, artistName)
|
||||
.replace(/\{albumName\}/g, albumName);
|
||||
};
|
||||
|
||||
// 获取已下载音乐列表
|
||||
const refreshDownloadedList = async () => {
|
||||
if (isLoadingDownloaded.value) return; // 防止重复加载
|
||||
@@ -455,8 +639,14 @@ const refreshDownloadedList = async () => {
|
||||
|
||||
const songIds = list.filter(item => item.id).map(item => item.id);
|
||||
if (songIds.length === 0) {
|
||||
downloadedList.value = list;
|
||||
localStorage.setItem('downloadedList', JSON.stringify(list));
|
||||
// 处理显示格式化文件名
|
||||
const updatedList = list.map(item => ({
|
||||
...item,
|
||||
displayName: formatSongName(item) || item.filename
|
||||
}));
|
||||
|
||||
downloadedList.value = updatedList;
|
||||
localStorage.setItem('downloadedList', JSON.stringify(updatedList));
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -467,18 +657,32 @@ const refreshDownloadedList = async () => {
|
||||
return acc;
|
||||
}, {});
|
||||
|
||||
const updatedList = list.map(item => ({
|
||||
...item,
|
||||
picUrl: songDetails[item.id]?.al?.picUrl || item.picUrl || '/images/default_cover.png',
|
||||
ar: songDetails[item.id]?.ar || item.ar || [{ name: t('download.localMusic') }]
|
||||
}));
|
||||
const updatedList = list.map(item => {
|
||||
const songDetail = songDetails[item.id];
|
||||
const updatedItem = {
|
||||
...item,
|
||||
picUrl: songDetail?.al?.picUrl || item.picUrl || '/images/default_cover.png',
|
||||
ar: songDetail?.ar || item.ar || [{ name: t('download.localMusic') }],
|
||||
name: songDetail?.name || item.name || item.filename
|
||||
};
|
||||
|
||||
// 添加格式化的显示名称
|
||||
updatedItem.displayName = formatSongName(updatedItem) || updatedItem.filename;
|
||||
return updatedItem;
|
||||
});
|
||||
|
||||
downloadedList.value = updatedList;
|
||||
localStorage.setItem('downloadedList', JSON.stringify(updatedList));
|
||||
} catch (error) {
|
||||
console.error('Failed to get music details:', error);
|
||||
downloadedList.value = list;
|
||||
localStorage.setItem('downloadedList', JSON.stringify(list));
|
||||
// 处理显示格式化文件名
|
||||
const updatedList = list.map(item => ({
|
||||
...item,
|
||||
displayName: formatSongName(item) || item.filename
|
||||
}));
|
||||
|
||||
downloadedList.value = updatedList;
|
||||
localStorage.setItem('downloadedList', JSON.stringify(updatedList));
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Failed to get downloaded music list:', error);
|
||||
@@ -498,10 +702,13 @@ watch(
|
||||
}
|
||||
);
|
||||
|
||||
// 监听下载进度
|
||||
// 初始化
|
||||
onMounted(() => {
|
||||
refreshDownloadedList();
|
||||
|
||||
// 记录已处理的下载项,避免重复触发事件
|
||||
const processedDownloads = new Set<string>();
|
||||
|
||||
// 监听下载进度
|
||||
window.electron.ipcRenderer.on('music-download-progress', (_, data) => {
|
||||
const existingItem = downloadList.value.find((item) => item.filename === data.filename);
|
||||
@@ -517,7 +724,8 @@ onMounted(() => {
|
||||
songInfo: data.songInfo || existingItem.songInfo
|
||||
});
|
||||
|
||||
// 如果下载完成,从列表中移除
|
||||
// 如果下载完成,从列表中移除,但不触发完成通知
|
||||
// 通知由 music-download-complete 事件处理
|
||||
if (data.status === 'completed') {
|
||||
downloadList.value = downloadList.value.filter((item) => item.filename !== data.filename);
|
||||
}
|
||||
@@ -531,12 +739,31 @@ onMounted(() => {
|
||||
|
||||
// 监听下载完成
|
||||
window.electron.ipcRenderer.on('music-download-complete', async (_, data) => {
|
||||
// 如果已经处理过此文件的完成事件,则跳过
|
||||
if (processedDownloads.has(data.filename)) {
|
||||
return;
|
||||
}
|
||||
|
||||
// 标记为已处理
|
||||
processedDownloads.add(data.filename);
|
||||
|
||||
// 下载成功处理
|
||||
if (data.success) {
|
||||
// 从下载列表中移除
|
||||
downloadList.value = downloadList.value.filter(item => item.filename !== data.filename);
|
||||
|
||||
// 延迟刷新已下载列表,避免文件系统未完全写入
|
||||
setTimeout(() => refreshDownloadedList(), 500);
|
||||
|
||||
// 只在下载页面显示一次下载成功通知
|
||||
message.success(t('download.message.downloadComplete', { filename: data.filename }));
|
||||
|
||||
// 避免通知过多占用内存,设置一个超时来清理已处理的标记
|
||||
setTimeout(() => {
|
||||
processedDownloads.delete(data.filename);
|
||||
}, 10000); // 10秒后清除
|
||||
} else {
|
||||
// 下载失败处理
|
||||
const existingItem = downloadList.value.find(item => item.filename === data.filename);
|
||||
if (existingItem) {
|
||||
Object.assign(existingItem, {
|
||||
@@ -546,8 +773,10 @@ onMounted(() => {
|
||||
});
|
||||
setTimeout(() => {
|
||||
downloadList.value = downloadList.value.filter(item => item.filename !== data.filename);
|
||||
processedDownloads.delete(data.filename);
|
||||
}, 3000);
|
||||
}
|
||||
|
||||
message.error(t('download.message.downloadFailed', { filename: data.filename, error: data.error }));
|
||||
}
|
||||
});
|
||||
@@ -568,6 +797,178 @@ onMounted(() => {
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// 下载设置
|
||||
const showSettingsDrawer = ref(false);
|
||||
const downloadSettings = ref({
|
||||
path: '',
|
||||
nameFormat: '{songName} - {artistName}',
|
||||
separator: ' - '
|
||||
});
|
||||
|
||||
// 格式组件(用于拖拽排序)
|
||||
const formatComponents = ref([
|
||||
{ id: 1, type: 'songName' },
|
||||
{ id: 2, type: 'artistName' },
|
||||
]);
|
||||
|
||||
// 处理组件排序
|
||||
const handleMoveUp = (index: number) => {
|
||||
if (index > 0) {
|
||||
const temp = formatComponents.value.splice(index, 1)[0];
|
||||
formatComponents.value.splice(index - 1, 0, temp);
|
||||
}
|
||||
};
|
||||
|
||||
const handleMoveDown = (index: number) => {
|
||||
if (index < formatComponents.value.length - 1) {
|
||||
const temp = formatComponents.value.splice(index, 1)[0];
|
||||
formatComponents.value.splice(index + 1, 0, temp);
|
||||
}
|
||||
};
|
||||
|
||||
// 添加新的格式组件
|
||||
const addFormatComponent = (type: string) => {
|
||||
if (!formatComponents.value.some(item => item.type === type)) {
|
||||
formatComponents.value.push({
|
||||
id: Date.now(),
|
||||
type
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
// 删除格式组件
|
||||
const removeFormatComponent = (index: number) => {
|
||||
formatComponents.value.splice(index, 1);
|
||||
};
|
||||
|
||||
// 监听组件变化更新格式
|
||||
watch(formatComponents, (newComponents) => {
|
||||
let format = '';
|
||||
newComponents.forEach((component, index) => {
|
||||
format += `{${component.type}}`;
|
||||
if (index < newComponents.length - 1) {
|
||||
format += downloadSettings.value.separator;
|
||||
}
|
||||
});
|
||||
downloadSettings.value.nameFormat = format;
|
||||
}, { deep: true });
|
||||
|
||||
// 监听分隔符变化更新格式
|
||||
watch(() => downloadSettings.value.separator, (newSeparator) => {
|
||||
if (formatComponents.value.length > 1) {
|
||||
// 重新构建格式字符串
|
||||
let format = '';
|
||||
formatComponents.value.forEach((component, index) => {
|
||||
format += `{${component.type}}`;
|
||||
if (index < formatComponents.value.length - 1) {
|
||||
format += newSeparator;
|
||||
}
|
||||
});
|
||||
downloadSettings.value.nameFormat = format;
|
||||
}
|
||||
});
|
||||
|
||||
// 格式名称预览
|
||||
const formatNamePreview = computed(() => {
|
||||
const format = downloadSettings.value.nameFormat;
|
||||
return format
|
||||
.replace(/\{songName\}/g, '莫失莫忘')
|
||||
.replace(/\{artistName\}/g, '香蜜沉沉烬如霜')
|
||||
.replace(/\{albumName\}/g, '电视剧原声带');
|
||||
});
|
||||
|
||||
// 选择下载路径
|
||||
const selectDownloadPath = async () => {
|
||||
const result = await window.electron.ipcRenderer.invoke('select-directory');
|
||||
if (result && !result.canceled && result.filePaths.length > 0) {
|
||||
downloadSettings.value.path = result.filePaths[0];
|
||||
}
|
||||
};
|
||||
|
||||
// 打开下载路径
|
||||
const openDownloadPath = () => {
|
||||
if (downloadSettings.value.path) {
|
||||
window.electron.ipcRenderer.send('open-directory', downloadSettings.value.path);
|
||||
} else {
|
||||
message.warning(t('download.settingsPanel.noPathSelected'));
|
||||
}
|
||||
};
|
||||
|
||||
// 保存下载设置
|
||||
const saveDownloadSettings = () => {
|
||||
// 保存到配置
|
||||
window.electron.ipcRenderer.send('set-store-value', 'set.downloadPath', downloadSettings.value.path);
|
||||
window.electron.ipcRenderer.send('set-store-value', 'set.downloadNameFormat', downloadSettings.value.nameFormat);
|
||||
window.electron.ipcRenderer.send('set-store-value', 'set.downloadSeparator', downloadSettings.value.separator);
|
||||
|
||||
// 如果是在已下载页面,刷新列表以更新显示
|
||||
if (tabName.value === 'downloaded') {
|
||||
refreshDownloadedList();
|
||||
}
|
||||
|
||||
message.success(t('download.settingsPanel.saveSuccess'));
|
||||
showSettingsDrawer.value = false;
|
||||
};
|
||||
|
||||
// 初始化下载设置
|
||||
const initDownloadSettings = async () => {
|
||||
// 获取当前配置
|
||||
const path = await window.electron.ipcRenderer.invoke('get-store-value', 'set.downloadPath');
|
||||
const nameFormat = await window.electron.ipcRenderer.invoke('get-store-value', 'set.downloadNameFormat');
|
||||
const separator = await window.electron.ipcRenderer.invoke('get-store-value', 'set.downloadSeparator');
|
||||
|
||||
downloadSettings.value = {
|
||||
path: path || await window.electron.ipcRenderer.invoke('get-downloads-path'),
|
||||
nameFormat: nameFormat || '{songName} - {artistName}',
|
||||
separator: separator || ' - '
|
||||
};
|
||||
|
||||
// 初始化排序组件
|
||||
updateFormatComponents();
|
||||
};
|
||||
|
||||
// 根据格式更新组件
|
||||
const updateFormatComponents = () => {
|
||||
// 提取格式中的变量
|
||||
const format = downloadSettings.value.nameFormat;
|
||||
const matches = Array.from(format.matchAll(/\{(\w+)\}/g));
|
||||
|
||||
if (matches.length === 0) {
|
||||
formatComponents.value = [
|
||||
{ id: 1, type: 'songName' },
|
||||
{ id: 2, type: 'artistName' }
|
||||
];
|
||||
return;
|
||||
}
|
||||
|
||||
formatComponents.value = matches.map((match, index) => ({
|
||||
id: index + 1,
|
||||
type: match[1]
|
||||
}));
|
||||
};
|
||||
|
||||
// 监听格式变化更新组件
|
||||
watch(() => downloadSettings.value.nameFormat, updateFormatComponents);
|
||||
|
||||
// 监听命名格式变化,更新已下载文件的显示名称
|
||||
watch(() => downloadSettings.value.nameFormat, () => {
|
||||
if (downloadedList.value.length > 0) {
|
||||
// 更新所有已下载项的显示名称
|
||||
downloadedList.value = downloadedList.value.map(item => ({
|
||||
...item,
|
||||
displayName: formatSongName(item) || item.filename
|
||||
}));
|
||||
|
||||
// 保存到本地存储
|
||||
localStorage.setItem('downloadedList', JSON.stringify(downloadedList.value));
|
||||
}
|
||||
});
|
||||
|
||||
// 初始化
|
||||
onMounted(() => {
|
||||
initDownloadSettings();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@@ -992,6 +1393,37 @@ onMounted(() => {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.download-settings {
|
||||
@apply flex flex-col gap-6;
|
||||
}
|
||||
|
||||
.setting-item {
|
||||
@apply bg-white dark:bg-dark-200 p-3 rounded-lg shadow-sm;
|
||||
@apply border border-gray-200/60 dark:border-gray-700/50;
|
||||
}
|
||||
|
||||
.setting-title {
|
||||
@apply text-base font-medium;
|
||||
@apply text-gray-800 dark:text-gray-200;
|
||||
}
|
||||
|
||||
.setting-desc {
|
||||
@apply text-sm text-gray-500 dark:text-gray-400 mt-1;
|
||||
}
|
||||
|
||||
.format-components {
|
||||
@apply flex flex-col gap-2;
|
||||
}
|
||||
|
||||
.format-item {
|
||||
@apply flex items-center px-3 py-2 bg-gray-100 dark:bg-dark-300 rounded;
|
||||
@apply border border-gray-200 dark:border-gray-700;
|
||||
}
|
||||
|
||||
.format-preview {
|
||||
@apply text-sm;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user