Kaotings/www_site
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: Kaotings:12eef4b854d8085765608d94420fbe6e607caaca
Branches Tags
Kaotings:main
Kaotings:feat/chip-resources
..
compare: Kaotings:e46cd69c5648b05119455d7b565f5be3035a15ba
Branches Tags
Kaotings:feat/chip-resources
Kaotings:main

No commits in common. "12eef4b854d8085765608d94420fbe6e607caaca" and "e46cd69c5648b05119455d7b565f5be3035a15ba" have entirely different histories.
12eef4b854 ... e46cd69c56

1 changed files with 11 additions and 7 deletions
Show Stats Expand all files Collapse all files

18
app/tts/page.tsx
View File

@ -505,13 +505,6 @@ export default function TtsPage() {
{correctionMessage ? <p className="mt-3 rounded-lg border border-cyan/20 bg-cyan/5 px-3 py-2 text-xs text-cyan">{correctionMessage}</p> : null}
</div>
<p className="mt-5 border-t border-line pt-5 text-sm text-muted">{loadedAt ? `音色清单已更新 · ${voices.length} 个音色` : "正在读取音色清单…"}</p>
<div className="mt-6 grid gap-4 md:grid-cols-3">
<button className="assist-card text-left" disabled={helperBusy} onClick={() => fileInputRef.current?.click()} onDragOver={(event) => event.preventDefault()} onDrop={(event) => { event.preventDefault(); void handleOcr(event.dataTransfer.files[0]); }} type="button"><span className="assist-icon">▧</span><span><strong>图片转文字</strong><small>上传或拖入截图、纸稿、PPT，识别结果填入编辑区</small></span><span className="assist-arrow">→</span></button>
<button className="assist-card text-left" onClick={checkTypos} type="button"><span className="assist-icon">✓</span><span><strong>生成前查错字</strong><small>扫描疑似错字，红色波浪线标出并支持一键替换</small></span><span className="assist-arrow">→</span></button>
<button className="assist-card text-left" onClick={autoSegment} type="button"><span className="assist-icon">↵</span><span><strong>自动分段</strong><small>按句号、问号和感叹号切分长文案，方便控制节奏</small></span><span className="assist-arrow">→</span></button>
</div>
<input accept="image/*" className="hidden" onChange={(event) => void handleOcr(event.target.files?.[0])} ref={fileInputRef} type="file" />
{helperMessage ? <p className="mt-4 rounded-lg border border-cyan/20 bg-cyan/5 px-3 py-2 text-xs text-cyan">{helperMessage}</p> : null}
</section>
<aside className="space-y-6">
@ -531,6 +524,17 @@ export default function TtsPage() {
</aside>
</div>
<section className="mt-8 rounded-2xl border border-line bg-panel/40 p-5 sm:p-7" aria-labelledby="assist-title">
<div className="flex flex-col justify-between gap-4 sm:flex-row sm:items-end"><div><p className="text-xs font-semibold uppercase tracking-[0.18em] text-subtle">03 / Assist</p><h2 className="mt-2 text-xl font-semibold" id="assist-title">减负区</h2><p className="mt-2 text-sm leading-6 text-muted">把识别、校对和分段交给系统，客户只需要确认内容和听结果。</p></div><span className="rounded-full border border-cyan/20 bg-cyan/5 px-3 py-1 text-xs text-cyan">少打字 · 少校对 · 少返工</span></div>
<div className="mt-6 grid gap-4 md:grid-cols-3">
<button className="assist-card text-left" disabled={helperBusy} onClick={() => fileInputRef.current?.click()} onDragOver={(event) => event.preventDefault()} onDrop={(event) => { event.preventDefault(); void handleOcr(event.dataTransfer.files[0]); }} type="button"><span className="assist-icon">▧</span><span><strong>图片转文字</strong><small>上传或拖入截图、纸稿、PPT，识别结果填入编辑区</small></span><span className="assist-arrow">→</span></button>
<button className="assist-card text-left" onClick={checkTypos} type="button"><span className="assist-icon">✓</span><span><strong>生成前查错字</strong><small>扫描疑似错字，红色波浪线标出并支持一键替换</small></span><span className="assist-arrow">→</span></button>
<button className="assist-card text-left" onClick={autoSegment} type="button"><span className="assist-icon">↵</span><span><strong>自动分段</strong><small>按句号、问号和感叹号切分长文案，方便控制节奏</small></span><span className="assist-arrow">→</span></button>
</div>
<input accept="image/*" className="hidden" onChange={(event) => void handleOcr(event.target.files?.[0])} ref={fileInputRef} type="file" />
{helperMessage ? <p className="mt-4 rounded-lg border border-cyan/20 bg-cyan/5 px-3 py-2 text-xs text-cyan">{helperMessage}</p> : null}
</section>
{error ? <p className="mt-6 rounded-xl border border-danger/30 bg-danger/10 px-4 py-3 text-sm leading-6 text-danger" role="alert">{error}</p> : null}
{result ? <section className="mt-8 rounded-2xl border border-success/30 bg-success/5 p-5 sm:p-7" aria-labelledby="tts-result-title"><div className="flex items-start justify-between gap-4"><div><p className="text-xs font-semibold uppercase tracking-[0.18em] text-success">04 / Result</p><h2 className="mt-2 text-xl font-semibold" id="tts-result-title">生成完成</h2><p className="mt-2 break-all text-sm text-muted">{result.fileName}</p></div><WaveIcon className="h-8 w-8 shrink-0 text-success" /></div><audio autoPlay className="mt-5 w-full" controls src={result.url} /><div className="mt-4 flex justify-end"><a className="button-secondary" download={result.fileName} href={result.url}><BrandIcon />下载音频</a></div></section> : <section className="mt-8 rounded-2xl border border-line bg-panel/40 p-5 sm:p-7"><div className="flex min-h-28 flex-col items-center justify-center text-center"><span className="text-cyan"><WaveIcon className="h-9 w-9" /></span><p className="mt-3 font-semibold">生成结果会显示在这里</p><p className="mt-1 text-sm text-muted">选择音色并输入文本后，即可试听和下载。</p></div></section>}