This commit is contained in:
2026-02-02 22:42:15 +08:00
parent 5cee704132
commit 42567c457b

View File

@@ -49,8 +49,40 @@ const playerContainer = ref(null)
const audioUrl = ref('')
const currentVoiceName = ref('')
// 默认封面图片(Base64 SVG
const defaultCover = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgdmlld0JveD0iMCAwIDEwMCAxMDAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHJlY3Qgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9IiMzY4MmY2IiBmaWxsLW9wYWNpdHk9IjAuMSIvPjxwL3N2Zz4='
// 默认封面图片(音频波形图标
const defaultCover = `data:image/svg+xml;base64,${btoa(`
<svg width="100" height="100" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
<rect width="100" height="100" fill="#1f2937" rx="8"/>
<g fill="#60a5fa">
<rect x="20" y="35" width="4" height="30" rx="2">
<animate attributeName="height" values="30;20;30" dur="0.8s" repeatCount="indefinite"/>
<animate attributeName="y" values="35;40;35" dur="0.8s" repeatCount="indefinite"/>
</rect>
<rect x="30" y="30" width="4" height="40" rx="2">
<animate attributeName="height" values="40;25;40" dur="0.6s" repeatCount="indefinite"/>
<animate attributeName="y" values="30;37.5;30" dur="0.6s" repeatCount="indefinite"/>
</rect>
<rect x="40" y="25" width="4" height="50" rx="2">
<animate attributeName="height" values="50;30;50" dur="0.7s" repeatCount="indefinite"/>
<animate attributeName="y" values="25;35;25" dur="0.7s" repeatCount="indefinite"/>
</rect>
<rect x="50" y="28" width="4" height="44" rx="2">
<animate attributeName="height" values="44;28;44" dur="0.9s" repeatCount="indefinite"/>
<animate attributeName="y" values="28;36;28" dur="0.9s" repeatCount="indefinite"/>
</rect>
<rect x="60" y="32" width="4" height="36" rx="2">
<animate attributeName="height" values="36;22;36" dur="0.5s" repeatCount="indefinite"/>
<animate attributeName="y" values="32;39;32" dur="0.5s" repeatCount="indefinite"/>
</rect>
<rect x="70" y="38" width="4" height="24" rx="2">
<animate attributeName="height" values="24;15;24" dur="0.7s" repeatCount="indefinite"/>
<animate attributeName="y" values="38;42.5;38" dur="0.7s" repeatCount="indefinite"/>
</rect>
</g>
<circle cx="50" cy="50" r="18" fill="none" stroke="#60a5fa" stroke-width="2" opacity="0.3"/>
<path d="M44 44 L44 56 L56 50 Z" fill="#60a5fa" opacity="0.5"/>
</svg>
`.trim())}`
// 使用TTS Hook
const {