7d003ff822
Extracted cron utilities to utils/schedule.js, all state management (15+ useState) to useSettingsForm hook, and 5 config sections + 2 dialogs + 1 status badge into focused components. SettingsPage reduced from ~700 lines to ~130 line container. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
54 lines
2.4 KiB
React
54 lines
2.4 KiB
React
// frontend/src/components/settings/AdvancedStrategySection.jsx
|
|
import { SlidersHorizontal } from 'lucide-react';
|
|
|
|
const STRATEGY_OPTIONS = [
|
|
{
|
|
key: 'metadataFallback',
|
|
defaultVal: true,
|
|
label: '开启多源元数据轮询回退',
|
|
desc: '仅控制 Netease / QQ / Spotify 的身份兜底查询;AcoustID 与 MusicBrainz 主链路始终参与匹配。'
|
|
},
|
|
{
|
|
key: 'downloadAssets',
|
|
defaultVal: true,
|
|
label: '自动下载并补全资产 (封面/歌词)',
|
|
desc: '仅控制 Discogs / Last.fm / Genius 的增强信息查询与来源决策,本轮不会真实下载文件。'
|
|
},
|
|
{
|
|
key: 'replaceLowQualityDuplicates',
|
|
defaultVal: false,
|
|
label: '重复项自动替换低音质 (慎用)',
|
|
desc: '若发现重复曲目且新文件比特率更高,自动覆盖库中旧文件,而非移入回收站产生冲突。'
|
|
}
|
|
];
|
|
|
|
export default function AdvancedStrategySection({ advancedStrategy = {}, onUpdate }) {
|
|
const getVal = (key, defaultVal) =>
|
|
advancedStrategy[key] !== undefined ? advancedStrategy[key] : defaultVal;
|
|
|
|
return (
|
|
<div className="rounded-xl border border-slate-800 bg-slate-900 p-6 shadow-lg">
|
|
<h3 className="mb-5 flex items-center border-b border-slate-800 pb-3 text-base font-semibold text-white">
|
|
<SlidersHorizontal className="mr-2 h-5 w-5 text-purple-400" />
|
|
高级运行策略 (Advanced Strategy)
|
|
</h3>
|
|
<div className="grid grid-cols-1 gap-6 md:grid-cols-3">
|
|
{STRATEGY_OPTIONS.map(({ key, defaultVal, label, desc }) => (
|
|
<label key={key} className="group flex h-full cursor-pointer items-start space-x-3 rounded-lg border border-slate-800/50 bg-slate-950/50 p-4 transition-colors hover:border-blue-500/30 hover:bg-slate-900">
|
|
<input
|
|
type="checkbox"
|
|
checked={getVal(key, defaultVal)}
|
|
onChange={(e) => onUpdate('advancedStrategy', { ...advancedStrategy, [key]: e.target.checked })}
|
|
className="mt-1 shrink-0 cursor-pointer rounded border-slate-700 bg-slate-950 text-blue-500 focus:ring-blue-500"
|
|
/>
|
|
<div>
|
|
<span className="block text-sm font-medium text-white transition-colors group-hover:text-blue-400">{label}</span>
|
|
<span className="mt-1.5 block text-xs leading-relaxed text-slate-500">{desc}</span>
|
|
</div>
|
|
</label>
|
|
))}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|