Compare commits
14 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 1855dc54dc | |||
| 90e1460a1b | |||
| 98e8b8a8e9 | |||
| 30e07a8939 | |||
| af7b2bb436 | |||
| e7ea90798b | |||
| 130120c8a7 | |||
| 746899964b | |||
| f032152eaa | |||
| 9927413370 | |||
| 570a06f8c4 | |||
| 36e8f91e5e | |||
| ffb8ea6790 | |||
| cc01a5da69 |
@@ -93,7 +93,7 @@ def register_worker(
|
||||
svc: GpuLipsyncService = Depends(_get_svc),
|
||||
_token: str = Depends(_verify_gpu_token),
|
||||
):
|
||||
svc.register_worker(
|
||||
worker, cancel_task = svc.register_worker(
|
||||
worker_id=body.worker_id,
|
||||
hostname=body.hostname,
|
||||
gpu_name=body.gpu_name,
|
||||
@@ -101,7 +101,7 @@ def register_worker(
|
||||
capabilities=body.capabilities,
|
||||
task_id=body.task_id,
|
||||
)
|
||||
return GpuWorkerRegisterResponse(ok=True, server_time=datetime.now(UTC), message="ok")
|
||||
return GpuWorkerRegisterResponse(ok=True, server_time=datetime.now(UTC), message="ok", cancel_task=cancel_task)
|
||||
|
||||
|
||||
# ── GET /lipsync/poll — Worker 轮询拉任务 ─────────────────────────
|
||||
|
||||
@@ -346,13 +346,13 @@ def cancel_lipsync_job(
|
||||
current_user: AuthenticatedUser = Depends(get_current_user),
|
||||
svc: LipsyncService = Depends(_get_service),
|
||||
):
|
||||
"""取消对口型任务(仅 pending/tts_processing/submitted 状态可取消)."""
|
||||
"""取消对口型任务(仅 pending/tts_processing/submitted/processing 状态可取消)."""
|
||||
job = svc.cancel_job(job_id, current_user.user.id)
|
||||
if job is None:
|
||||
raise HTTPException(status_code=404, detail="任务不存在")
|
||||
if job.status != "cancelled":
|
||||
raise HTTPException(
|
||||
status_code=400,
|
||||
detail=f"任务状态 {job.status} 不可取消,仅 pending/tts_processing/submitted 可取消",
|
||||
detail=f"任务状态 {job.status} 不可取消,仅 pending/tts_processing/submitted/processing 可取消",
|
||||
)
|
||||
return job
|
||||
|
||||
@@ -36,6 +36,7 @@ class GpuWorkerRegisterResponse(BaseModel):
|
||||
ok: bool = True
|
||||
server_time: datetime
|
||||
message: str = "ok"
|
||||
cancel_task: bool = Field(False, description="当前心跳任务是否已被用户取消;为 true 时 Worker 应终止推理")
|
||||
|
||||
|
||||
# ── 轮询任务 ────────────────────────────────────────────────────
|
||||
|
||||
@@ -50,13 +50,16 @@ class GpuLipsyncService:
|
||||
free_vram_mb: int = 0,
|
||||
capabilities: str = "musetalk",
|
||||
task_id: Optional[str] = None,
|
||||
) -> GpuWorkerModel:
|
||||
) -> tuple[GpuWorkerModel, bool]:
|
||||
"""Worker 注册/心跳。
|
||||
|
||||
task_id 非空时(Worker 推理期间的任务级心跳),同步把对应 processing
|
||||
任务的 last_heartbeat_at 续到当前时间,使长推理不会被
|
||||
``_recover_timed_out_tasks`` 误回退。任务已结束 / 不属于该 worker
|
||||
(如已被超时回收重新派发)时忽略,不报错。
|
||||
|
||||
返回 ``(worker, cancel_task)``:当心跳任务已被用户取消时
|
||||
``cancel_task=True``,Worker 应尽快终止推理并释放 GPU。
|
||||
"""
|
||||
now = datetime.now(UTC)
|
||||
worker = self.db.query(GpuWorkerModel).filter(GpuWorkerModel.worker_id == worker_id).one_or_none()
|
||||
@@ -77,10 +80,11 @@ class GpuLipsyncService:
|
||||
worker.free_vram_mb = free_vram_mb
|
||||
worker.capabilities = capabilities or worker.capabilities
|
||||
worker.last_heartbeat_at = now
|
||||
cancel_task = False
|
||||
if task_id:
|
||||
self._touch_task_heartbeat(task_id, worker_id, now)
|
||||
cancel_task = self._touch_task_heartbeat(task_id, worker_id, now)
|
||||
self.db.commit()
|
||||
return worker
|
||||
return worker, cancel_task
|
||||
|
||||
# ── 轮询拉任务(Worker 调用) ──────────────────────────────────
|
||||
|
||||
@@ -166,6 +170,11 @@ class GpuLipsyncService:
|
||||
task.result_duration = duration_seconds or 0.0
|
||||
task.error_msg = ""
|
||||
task.finished_at = now
|
||||
elif task.status == "cancelled":
|
||||
# 用户已取消的任务,Worker 终止后上报失败,保持 cancelled 状态不回退
|
||||
task.finished_at = now
|
||||
task.error_msg = (error_msg or "用户取消")[:2000]
|
||||
logger.info("GPU 任务 %s 已被用户取消,保持 cancelled 状态", task_id)
|
||||
else:
|
||||
# 失败:若仍可重试(已尝试次数 < MAX_ATTEMPTS)→ 回退 pending;否则 → failed
|
||||
if task.attempt < MAX_ATTEMPTS:
|
||||
@@ -250,15 +259,21 @@ class GpuLipsyncService:
|
||||
def _result_key(self, task_id: str) -> str:
|
||||
return f"{self.RESULT_PREFIX}{task_id}.mp4"
|
||||
|
||||
def _touch_task_heartbeat(self, task_id: str, worker_id: str, now: datetime) -> None:
|
||||
def _touch_task_heartbeat(self, task_id: str, worker_id: str, now: datetime) -> bool:
|
||||
"""Worker 推理期间的任务级心跳:只刷新属于该 worker 且仍在 processing 的任务。
|
||||
|
||||
任务不存在 / 已被超时回收重新派发 / 已完成 → 静默忽略(此时旧 worker 的
|
||||
结果上报会被结果接口按最终态处理)。
|
||||
|
||||
返回 ``cancel_task``:任务已被用户取消时为 True,Worker 应终止推理。
|
||||
"""
|
||||
task = self.db.get(GpuLipsyncTaskModel, task_id)
|
||||
if task is None:
|
||||
return
|
||||
return False
|
||||
# 任务已被用户取消 → 通知 Worker 终止推理
|
||||
if task.status == "cancelled":
|
||||
logger.info("任务心跳检测到已取消 task=%s worker=%s,通知 Worker 终止", task_id, worker_id)
|
||||
return True
|
||||
if task.status != "processing" or task.worker_id != worker_id:
|
||||
logger.info(
|
||||
"忽略过期任务心跳 task=%s worker=%s(status=%s owner=%s)",
|
||||
@@ -267,10 +282,11 @@ class GpuLipsyncService:
|
||||
task.status,
|
||||
task.worker_id,
|
||||
)
|
||||
return
|
||||
return False
|
||||
task.last_heartbeat_at = now
|
||||
task.updated_at = now
|
||||
self.db.flush()
|
||||
return False
|
||||
|
||||
def _touch_worker(self, worker_id: str, now: datetime) -> None:
|
||||
if not worker_id:
|
||||
@@ -371,9 +387,7 @@ class GpuLipsyncService:
|
||||
task = self.db.get(GpuLipsyncTaskModel, task_id)
|
||||
if task is None:
|
||||
return None
|
||||
if task.status == "done":
|
||||
return task
|
||||
if task.status == "failed":
|
||||
if task.status in ("done", "failed", "cancelled"):
|
||||
return task
|
||||
# pending/processing 继续等
|
||||
if time.monotonic() >= deadline:
|
||||
|
||||
@@ -783,12 +783,32 @@ class LipsyncService:
|
||||
# ── 取消任务 ──────────────────────────────────────────────────────────
|
||||
|
||||
def cancel_job(self, job_id: str, user_id: str) -> Optional[LipsyncJobModel]:
|
||||
"""取消任务(仅 pending/tts_processing/submitted 状态可取消)."""
|
||||
"""取消任务(pending/tts_processing/submitted/processing 状态可取消).
|
||||
|
||||
当 job 走 GPU 路径(mediakit_task_id 以 "gpu:" 开头)且状态为 processing 时,
|
||||
同步将关联的 GpuLipsyncTask 标记为 cancelled,以便 Worker 心跳时检测到取消信号。
|
||||
"""
|
||||
job = self.get_job(job_id, user_id)
|
||||
if job is None:
|
||||
return None
|
||||
|
||||
if job.status in ("pending", "tts_processing", "submitted"):
|
||||
if job.status in ("pending", "tts_processing", "submitted", "processing"):
|
||||
# GPU 路径:同步标记关联的 GPU 任务为 cancelled
|
||||
if job.status == "processing" and job.mediakit_task_id and job.mediakit_task_id.startswith("gpu:"):
|
||||
gpu_task_id = job.mediakit_task_id[4:] # 去掉 "gpu:" 前缀
|
||||
try:
|
||||
from packages.adapters.sqlalchemy_impl.models import GpuLipsyncTaskModel
|
||||
|
||||
gpu_task = self.db.get(GpuLipsyncTaskModel, gpu_task_id)
|
||||
if gpu_task and gpu_task.status == "processing":
|
||||
gpu_task.status = "cancelled"
|
||||
gpu_task.error_msg = "用户取消"
|
||||
gpu_task.updated_at = datetime.now(UTC)
|
||||
gpu_task.finished_at = datetime.now(UTC)
|
||||
logger.info("GPU 任务 %s 已被用户取消(通过 job_id=%s)", gpu_task_id, job_id)
|
||||
except Exception as exc:
|
||||
logger.warning("标记 GPU 任务取消失败(不影响 job 取消): %s", exc)
|
||||
|
||||
job.status = "cancelled"
|
||||
job.updated_at = datetime.now(UTC)
|
||||
self.db.commit()
|
||||
|
||||
@@ -98,6 +98,14 @@ def lipsync_gpu_process_async(self, job_id: str, user_id: str, gpu_task_id: str)
|
||||
_fallback_to_mediakit(db, job)
|
||||
return
|
||||
|
||||
if final_task.status == "cancelled":
|
||||
# 用户已取消任务,不回退 MediaKit,直接标记 job 为 cancelled
|
||||
job.status = "cancelled"
|
||||
job.updated_at = datetime.now(UTC)
|
||||
db.commit()
|
||||
logger.info("[lipsync_gpu_async] GPU 任务已被用户取消: job_id=%s", job_id)
|
||||
return
|
||||
|
||||
if final_task.status != "done":
|
||||
logger.warning(
|
||||
"[lipsync_gpu_async] GPU 失败,回退 MediaKit: job_id=%s gpu_task=%s status=%s",
|
||||
|
||||
@@ -0,0 +1,211 @@
|
||||
/* ============================================================
|
||||
标题模板系统(#2003):选择器 + 编辑器 + 保存弹窗
|
||||
============================================================ */
|
||||
|
||||
/* ── Modal 头部 ── */
|
||||
.tt-modal-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding-right: 32px;
|
||||
}
|
||||
.tt-modal .ant-modal-body {
|
||||
padding: 16px 20px;
|
||||
max-height: 70vh;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
/* ── 分组 ── */
|
||||
.tt-section {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.tt-section:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.tt-section-title {
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
color: var(--text-secondary, #6b7280);
|
||||
margin: 0 0 10px;
|
||||
}
|
||||
|
||||
/* ── 空状态 ── */
|
||||
.tt-empty {
|
||||
padding: 32px 16px;
|
||||
text-align: center;
|
||||
color: var(--text-secondary, #9ca3af);
|
||||
background: var(--bg-secondary, #f9fafb);
|
||||
border: 1px dashed var(--border-color, #e5e7eb);
|
||||
border-radius: 8px;
|
||||
font-size: 13px;
|
||||
}
|
||||
.tt-empty-emoji {
|
||||
font-size: 32px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
/* ── 卡片网格(4列) ── */
|
||||
.tt-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 12px;
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
.tt-grid {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
}
|
||||
|
||||
.tt-card {
|
||||
border: 2px solid var(--border-color, #e5e7eb);
|
||||
border-radius: 10px;
|
||||
background: #fff;
|
||||
cursor: pointer;
|
||||
transition: all 0.18s ease;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
.tt-card:hover {
|
||||
border-color: var(--primary-color, #7c3aed);
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 6px 16px rgba(124, 58, 237, 0.12);
|
||||
}
|
||||
.tt-card.active {
|
||||
border-color: var(--primary-color, #7c3aed);
|
||||
background: #faf5ff;
|
||||
box-shadow: 0 0 0 1px var(--primary-color, #7c3aed);
|
||||
}
|
||||
|
||||
/* ── 预览区 ── */
|
||||
.tt-card-preview {
|
||||
position: relative;
|
||||
height: 80px;
|
||||
background: #0f172a;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
}
|
||||
.tt-card-preview canvas {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
/* ── 标签 ── */
|
||||
.tt-tag {
|
||||
position: absolute;
|
||||
top: 6px;
|
||||
left: 6px;
|
||||
padding: 1px 6px;
|
||||
border-radius: 4px;
|
||||
font-size: 10px;
|
||||
font-weight: 600;
|
||||
line-height: 16px;
|
||||
}
|
||||
.tt-tag.sys {
|
||||
background: rgba(124, 58, 237, 0.85);
|
||||
color: #fff;
|
||||
}
|
||||
.tt-tag.mine {
|
||||
background: rgba(16, 185, 129, 0.9);
|
||||
color: #fff;
|
||||
}
|
||||
.tt-check {
|
||||
position: absolute;
|
||||
top: 6px;
|
||||
right: 6px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 50%;
|
||||
background: var(--primary-color, #7c3aed);
|
||||
color: #fff;
|
||||
font-size: 11px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/* ── 卡片操作按钮(hover 显示) ── */
|
||||
.tt-card-actions {
|
||||
position: absolute;
|
||||
top: 6px;
|
||||
right: 6px;
|
||||
display: none;
|
||||
gap: 4px;
|
||||
align-items: center;
|
||||
}
|
||||
.tt-card.active .tt-check + .tt-card-actions {
|
||||
top: 30px;
|
||||
}
|
||||
.tt-card:hover .tt-card-actions {
|
||||
display: flex;
|
||||
}
|
||||
.tt-ico-btn {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border-radius: 4px;
|
||||
border: none;
|
||||
background: rgba(0, 0, 0, 0.55);
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 12px;
|
||||
padding: 0;
|
||||
transition: 0.15s;
|
||||
}
|
||||
.tt-ico-btn:hover {
|
||||
background: var(--primary-color, #7c3aed);
|
||||
}
|
||||
.tt-ico-btn.danger:hover {
|
||||
background: #ef4444;
|
||||
}
|
||||
|
||||
/* ── 卡片底部 meta ── */
|
||||
.tt-card-meta {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
padding: 6px 8px;
|
||||
font-size: 12px;
|
||||
color: var(--text-primary, #1f2937);
|
||||
}
|
||||
.tt-card-emoji {
|
||||
font-size: 13px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.tt-card-name {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
/* ── 编辑器(左右布局) ── */
|
||||
.tt-editor {
|
||||
display: grid;
|
||||
grid-template-columns: 360px 1fr;
|
||||
gap: 16px;
|
||||
min-height: 480px;
|
||||
}
|
||||
.tt-editor-preview {
|
||||
background: #0f172a;
|
||||
border-radius: 10px;
|
||||
padding: 16px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-height: 400px;
|
||||
}
|
||||
.tt-editor-panel {
|
||||
overflow-y: auto;
|
||||
max-height: 65vh;
|
||||
padding-right: 4px;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.tt-editor {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,187 @@
|
||||
/**
|
||||
* 标题模板编辑器(#2003)
|
||||
*
|
||||
* 左侧大预览(400×225,16:9),右侧复用 TitleStylePanel 进行参数调整。
|
||||
* 编辑完成后点"保存"弹出 SaveTemplateModal(名称必填),保存后回调 onSaved。
|
||||
*/
|
||||
import React, { useState } from "react"
|
||||
import { Modal, Button, Input, message } from "antd"
|
||||
import TitleStylePanel from "../../pages/generate/components/title/TitleStylePanel"
|
||||
import TitleMiniPreview from "../../pages/generate/components/title/TitleMiniPreview"
|
||||
import { POSITION_OPTIONS } from "../../pages/generate/constants"
|
||||
import { FONT_OPTIONS, TITLE_PRESETS as SYSTEM_TITLE_PRESETS } from "./constants"
|
||||
import type { TitleSettings } from "../../pages/generate/types"
|
||||
import { DEFAULT_TITLE_SETTINGS_FULL } from "../../pages/generate/types"
|
||||
import { titleStyleConfigToCamel, camelToTitleStyleConfig } from "./utils"
|
||||
import { useTitleTemplates } from "./useTitleTemplates"
|
||||
import type { TitleTemplate } from "./template-types"
|
||||
|
||||
interface Props {
|
||||
open: boolean
|
||||
template: TitleTemplate
|
||||
onClose: () => void
|
||||
onSaved: (template: TitleTemplate) => void
|
||||
}
|
||||
|
||||
const TitleTemplateEditor: React.FC<Props> = ({ open, template, onClose, onSaved }) => {
|
||||
const { updateTemplate, createTemplate } = useTitleTemplates()
|
||||
// 编辑态:完整 TitleSettings(camelCase)
|
||||
const [settings, setSettings] = useState<TitleSettings>(() => ({
|
||||
...DEFAULT_TITLE_SETTINGS_FULL,
|
||||
...titleStyleConfigToCamel(template.style || {}),
|
||||
title: "标题预览",
|
||||
}))
|
||||
const [formName, setFormName] = useState(template.name || "")
|
||||
const [formDesc, setFormDesc] = useState(template.description || "")
|
||||
const [formEmoji, setFormEmoji] = useState(template.emoji || "✨")
|
||||
const [saving, setSaving] = useState(false)
|
||||
|
||||
// 每次 open 重置
|
||||
React.useEffect(() => {
|
||||
if (open) {
|
||||
setSettings({
|
||||
...DEFAULT_TITLE_SETTINGS_FULL,
|
||||
...titleStyleConfigToCamel(template.style || {}),
|
||||
title: "标题预览",
|
||||
})
|
||||
setFormName(template.name || "")
|
||||
setFormDesc(template.description || "")
|
||||
setFormEmoji(template.emoji || "✨")
|
||||
}
|
||||
}, [open, template])
|
||||
|
||||
/** 把单个 updater 包装成 setSettings patch */
|
||||
const upd = (patch: Partial<TitleSettings>) => setSettings((s) => ({ ...s, ...patch }))
|
||||
|
||||
const handleSave = () => {
|
||||
const name = formName.trim()
|
||||
if (!name) {
|
||||
message.warning("请填写模板名称")
|
||||
return
|
||||
}
|
||||
setSaving(true)
|
||||
try {
|
||||
const snake = camelToTitleStyleConfig(settings)
|
||||
if (template.isBuiltin) {
|
||||
// 内置模板保存时创建一个副本
|
||||
const t = createTemplate({ name, description: formDesc, emoji: formEmoji, style: snake })
|
||||
onSaved(t)
|
||||
} else {
|
||||
updateTemplate(template.id, { name, description: formDesc, emoji: formEmoji, style: snake })
|
||||
onSaved({
|
||||
...template,
|
||||
name,
|
||||
description: formDesc,
|
||||
emoji: formEmoji,
|
||||
style: snake,
|
||||
updatedAt: new Date().toISOString(),
|
||||
})
|
||||
}
|
||||
} finally {
|
||||
setSaving(false)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<Modal
|
||||
title={template.isBuiltin ? `复制模板:${template.name}` : `编辑模板:${template.name}`}
|
||||
open={open}
|
||||
onCancel={onClose}
|
||||
width={960}
|
||||
footer={
|
||||
<div style={{ display: "flex", gap: 8, justifyContent: "flex-end" }}>
|
||||
<Button onClick={onClose}>取消</Button>
|
||||
<Button type="primary" loading={saving} onClick={handleSave}>
|
||||
保存模板
|
||||
</Button>
|
||||
</div>
|
||||
}
|
||||
destroyOnClose
|
||||
className="tt-modal tt-editor-modal"
|
||||
>
|
||||
{/* 模板名称/描述表单 */}
|
||||
<div
|
||||
style={{ display: "grid", gridTemplateColumns: "60px 1fr 1fr", gap: 10, marginBottom: 14 }}
|
||||
>
|
||||
<div>
|
||||
<label style={{ fontSize: 12, fontWeight: 600, display: "block", marginBottom: 6 }}>
|
||||
图标
|
||||
</label>
|
||||
<Input
|
||||
value={formEmoji}
|
||||
maxLength={2}
|
||||
style={{ textAlign: "center" }}
|
||||
onChange={(e) => setFormEmoji(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label style={{ fontSize: 12, fontWeight: 600, display: "block", marginBottom: 6 }}>
|
||||
模板名称<span style={{ color: "#ef4444" }}> *</span>
|
||||
</label>
|
||||
<Input
|
||||
placeholder="给模板起个名字,例如:抖音爆款黄"
|
||||
value={formName}
|
||||
maxLength={20}
|
||||
onChange={(e) => setFormName(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label style={{ fontSize: 12, fontWeight: 600, display: "block", marginBottom: 6 }}>
|
||||
模板描述
|
||||
</label>
|
||||
<Input
|
||||
placeholder="简短描述(可选)"
|
||||
value={formDesc}
|
||||
maxLength={40}
|
||||
onChange={(e) => setFormDesc(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="tt-editor">
|
||||
{/* 左侧实时预览 */}
|
||||
<div className="tt-editor-preview">
|
||||
<TitleMiniPreview settings={settings} width={320} sampleText="标题预览" height={180} />
|
||||
</div>
|
||||
{/* 右侧编辑器 — 复用 TitleStylePanel 的细粒度能力 */}
|
||||
<div className="tt-editor-panel">
|
||||
<TitleStylePanel
|
||||
settings={settings}
|
||||
onUpdatePosition={(p) => upd({ position: p, posX: null, posY: null })}
|
||||
onUpdateFont={(f) => upd({ font: f })}
|
||||
onUpdateSize={(v) => upd({ size: v })}
|
||||
onToggleBold={() => upd({ bold: !settings.bold })}
|
||||
onToggleItalic={() => upd({ italic: !settings.italic })}
|
||||
onToggleStroke={() =>
|
||||
upd({
|
||||
stroke: !settings.stroke,
|
||||
strokeWidth:
|
||||
!settings.stroke && (settings.strokeWidth ?? 0) < 2 ? 4 : settings.strokeWidth,
|
||||
})
|
||||
}
|
||||
onToggleShadow={() => upd({ shadow: !settings.shadow })}
|
||||
onApplyPreset={(key) => {
|
||||
// 在编辑器中点击系统预设:把 preset 作为编辑起点
|
||||
const pp = SYSTEM_TITLE_PRESETS.find((x) => x.key === key)
|
||||
if (pp) {
|
||||
setSettings((cs) => ({
|
||||
...cs,
|
||||
...titleStyleConfigToCamel(pp.style),
|
||||
lineOverrides: [],
|
||||
title: "标题预览",
|
||||
}))
|
||||
}
|
||||
}}
|
||||
onUpdateStyle={(patch) => upd(patch)}
|
||||
activePreset={null}
|
||||
titlePresets={[]}
|
||||
POSITION_OPTIONS={POSITION_OPTIONS}
|
||||
FONT_OPTIONS={FONT_OPTIONS}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
|
||||
export default TitleTemplateEditor
|
||||
@@ -0,0 +1,237 @@
|
||||
/**
|
||||
* 标题模板选择器(#2003)
|
||||
*
|
||||
* 参考「IP智能体设置 → 字幕设置 → 字幕模板」交互:
|
||||
* - Modal 打开后展示模板卡片网格(4 列),每张卡片含 Canvas 预览 + 名称 + 标签
|
||||
* - 系统模板(sys:):只能「复制为我的」「应用」
|
||||
* - 自定义模板(usr:):支持编辑/复制/导出/删除
|
||||
* - 右上角「+ 新建模板」按钮进入编辑器
|
||||
*
|
||||
* 受控使用:visible/onCancel/onSelect
|
||||
*/
|
||||
import React, { useMemo, useState } from "react"
|
||||
import { Modal, Button, message, Popconfirm, Tooltip } from "antd"
|
||||
import {
|
||||
PlusOutlined,
|
||||
EditOutlined,
|
||||
CopyOutlined,
|
||||
DeleteOutlined,
|
||||
ExportOutlined,
|
||||
CheckOutlined,
|
||||
} from "@ant-design/icons"
|
||||
import TitleMiniPreview from "../../pages/generate/components/title/TitleMiniPreview"
|
||||
import type { TitleSettings } from "../../pages/generate/types"
|
||||
import { DEFAULT_TITLE_SETTINGS_FULL } from "../../pages/generate/types"
|
||||
import { titleStyleConfigToCamel } from "./utils"
|
||||
import { useTitleTemplates } from "./useTitleTemplates"
|
||||
import type { TitleTemplate } from "./template-types"
|
||||
import TitleTemplateEditor from "./TitleTemplateEditor"
|
||||
import "./TitleTemplate.css"
|
||||
|
||||
interface Props {
|
||||
open: boolean
|
||||
/** 当前选中模板 id(可选) */
|
||||
selectedTemplateId?: string | null
|
||||
onClose: () => void
|
||||
/** 选择/应用模板:返回 camelCase TitleSettings 给调用方 */
|
||||
onSelect: (settings: TitleSettings, template: TitleTemplate) => void
|
||||
}
|
||||
|
||||
/** 把模板 style 渲染为完整 TitleSettings(带默认值),用于预览 */
|
||||
function templateToSettings(t: TitleTemplate): TitleSettings {
|
||||
return { ...DEFAULT_TITLE_SETTINGS_FULL, ...titleStyleConfigToCamel(t.style) }
|
||||
}
|
||||
|
||||
const TitleTemplateSelector: React.FC<Props> = ({
|
||||
open,
|
||||
selectedTemplateId,
|
||||
onClose,
|
||||
onSelect,
|
||||
}) => {
|
||||
const { templates, duplicateTemplate, deleteTemplate, exportTemplate, createTemplate } =
|
||||
useTitleTemplates()
|
||||
const [editingTemplate, setEditingTemplate] = useState<TitleTemplate | null>(null)
|
||||
const [editorOpen, setEditorOpen] = useState(false)
|
||||
|
||||
const grouped = useMemo(() => {
|
||||
return {
|
||||
builtin: templates.filter((t) => t.isBuiltin),
|
||||
custom: templates.filter((t) => !t.isBuiltin),
|
||||
}
|
||||
}, [templates])
|
||||
|
||||
const handleCreate = () => {
|
||||
// 基于当前默认样式创建空白模板进入编辑
|
||||
const t = createTemplate({
|
||||
name: "我的标题模板",
|
||||
style: {
|
||||
font: DEFAULT_TITLE_SETTINGS_FULL.font,
|
||||
size: 56,
|
||||
color: "#ffffff",
|
||||
bold: true,
|
||||
italic: false,
|
||||
stroke: true,
|
||||
stroke_width: 4,
|
||||
stroke_color: "#000000",
|
||||
shadow: false,
|
||||
bg_enabled: false,
|
||||
line_height: 1.2,
|
||||
max_chars_per_line: 10,
|
||||
position: "bottom",
|
||||
margin_top: 32,
|
||||
line_overrides: [],
|
||||
cover_title_config: null,
|
||||
},
|
||||
})
|
||||
setEditingTemplate(t)
|
||||
setEditorOpen(true)
|
||||
}
|
||||
|
||||
const handleEdit = (t: TitleTemplate) => {
|
||||
setEditingTemplate(t)
|
||||
setEditorOpen(true)
|
||||
}
|
||||
|
||||
const handleDuplicate = (t: TitleTemplate) => {
|
||||
const dup = duplicateTemplate(t.id)
|
||||
if (dup) message.success(`已复制:${dup.name}`)
|
||||
}
|
||||
|
||||
const handleDelete = (t: TitleTemplate) => {
|
||||
deleteTemplate(t.id)
|
||||
message.success("已删除模板")
|
||||
}
|
||||
|
||||
const handleExport = (t: TitleTemplate) => {
|
||||
const json = exportTemplate(t.id)
|
||||
if (!json) return
|
||||
const blob = new Blob([json], { type: "application/json" })
|
||||
const url = URL.createObjectURL(blob)
|
||||
const a = document.createElement("a")
|
||||
a.href = url
|
||||
a.download = `${t.name}.title-template.json`
|
||||
a.click()
|
||||
URL.revokeObjectURL(url)
|
||||
}
|
||||
|
||||
const handleApply = (t: TitleTemplate) => {
|
||||
const settings = templateToSettings(t)
|
||||
onSelect(settings, t)
|
||||
}
|
||||
|
||||
const renderCard = (t: TitleTemplate) => {
|
||||
const isSelected = selectedTemplateId === t.id
|
||||
const settings = templateToSettings(t)
|
||||
return (
|
||||
<div
|
||||
key={t.id}
|
||||
className={`tt-card${isSelected ? " active" : ""}`}
|
||||
onClick={() => handleApply(t)}
|
||||
>
|
||||
<div className="tt-card-preview">
|
||||
<TitleMiniPreview settings={settings} width={200} sampleText="标题预览" />
|
||||
<span className={`tt-tag${t.isBuiltin ? " sys" : " mine"}`}>
|
||||
{t.isBuiltin ? "系统" : "我的"}
|
||||
</span>
|
||||
{isSelected && (
|
||||
<span className="tt-check">
|
||||
<CheckOutlined />
|
||||
</span>
|
||||
)}
|
||||
<div className="tt-card-actions" onClick={(e) => e.stopPropagation()}>
|
||||
{!t.isBuiltin && (
|
||||
<Tooltip title="编辑">
|
||||
<button type="button" className="tt-ico-btn" onClick={() => handleEdit(t)}>
|
||||
<EditOutlined />
|
||||
</button>
|
||||
</Tooltip>
|
||||
)}
|
||||
<Tooltip title="复制">
|
||||
<button type="button" className="tt-ico-btn" onClick={() => handleDuplicate(t)}>
|
||||
<CopyOutlined />
|
||||
</button>
|
||||
</Tooltip>
|
||||
<Tooltip title="导出">
|
||||
<button type="button" className="tt-ico-btn" onClick={() => handleExport(t)}>
|
||||
<ExportOutlined />
|
||||
</button>
|
||||
</Tooltip>
|
||||
{!t.isBuiltin && (
|
||||
<Popconfirm title="删除该模板?" onConfirm={() => handleDelete(t)}>
|
||||
<Tooltip title="删除">
|
||||
<button type="button" className="tt-ico-btn danger">
|
||||
<DeleteOutlined />
|
||||
</button>
|
||||
</Tooltip>
|
||||
</Popconfirm>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<div className="tt-card-meta">
|
||||
<span className="tt-card-emoji">{t.emoji || "✨"}</span>
|
||||
<span className="tt-card-name" title={t.name}>
|
||||
{t.name}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<Modal
|
||||
title={
|
||||
<div className="tt-modal-title">
|
||||
<span>🎨 选择标题模板</span>
|
||||
<Button type="primary" size="small" icon={<PlusOutlined />} onClick={handleCreate}>
|
||||
新建模板
|
||||
</Button>
|
||||
</div>
|
||||
}
|
||||
open={open && !editorOpen}
|
||||
onCancel={onClose}
|
||||
footer={null}
|
||||
width={880}
|
||||
className="tt-modal"
|
||||
destroyOnClose
|
||||
>
|
||||
<div className="tt-section">
|
||||
<div className="tt-section-title">我的模板</div>
|
||||
{grouped.custom.length === 0 ? (
|
||||
<div className="tt-empty">
|
||||
<div className="tt-empty-emoji">✨</div>
|
||||
<div>还没有自定义模板,点击右上角「新建模板」创建第一个吧</div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="tt-grid">{grouped.custom.map(renderCard)}</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="tt-section">
|
||||
<div className="tt-section-title">系统模板</div>
|
||||
<div className="tt-grid">{grouped.builtin.map(renderCard)}</div>
|
||||
</div>
|
||||
</Modal>
|
||||
|
||||
{editorOpen && editingTemplate && (
|
||||
<TitleTemplateEditor
|
||||
open={editorOpen}
|
||||
template={editingTemplate}
|
||||
onClose={() => {
|
||||
setEditorOpen(false)
|
||||
setEditingTemplate(null)
|
||||
}}
|
||||
onSaved={(t) => {
|
||||
setEditorOpen(false)
|
||||
setEditingTemplate(null)
|
||||
message.success(`已保存:${t.name}`)
|
||||
// 保存后自动应用
|
||||
handleApply(t)
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default TitleTemplateSelector
|
||||
@@ -0,0 +1,28 @@
|
||||
/**
|
||||
* 标题模板系统类型(#2003)
|
||||
*
|
||||
* 设计:
|
||||
* - 内置系统模板(从 TITLE_PRESETS 自动派生,不可编辑/删除,可"复制为我的")
|
||||
* - 用户自定义模板(保存在 localStorage,可编辑/复制/导出/删除)
|
||||
* - 模板存完整 TitleStyleConfig(snake_case),与后端契约一致
|
||||
*/
|
||||
import type { TitleStyleConfig } from "./types"
|
||||
|
||||
export interface TitleTemplate {
|
||||
/** 唯一 ID:系统模板 `sys:<presetKey>`,用户模板 `usr:<uuid>` */
|
||||
id: string
|
||||
/** 模板名称(必填,保存时校验) */
|
||||
name: string
|
||||
/** 模板描述(可选) */
|
||||
description?: string
|
||||
/** 是否为系统内置(不可删除/编辑源) */
|
||||
isBuiltin: boolean
|
||||
/** emoji(展示用,可选) */
|
||||
emoji?: string
|
||||
/** 创建时间(ISO 字符串,系统模板=固定值) */
|
||||
createdAt: string
|
||||
/** 更新时间 */
|
||||
updatedAt: string
|
||||
/** 完整样式配置(snake_case,与后端 title_config 对齐) */
|
||||
style: Partial<TitleStyleConfig>
|
||||
}
|
||||
@@ -0,0 +1,213 @@
|
||||
/**
|
||||
* 标题模板 CRUD Hook(#2003)
|
||||
*
|
||||
* - 内存态 + localStorage 持久化
|
||||
* - 系统模板(来自 TITLE_PRESETS)始终前置、不可删除/编辑源
|
||||
* - 用户模板 CRUD:新增/复制/更新/删除/导出/导入
|
||||
*/
|
||||
import { useCallback, useEffect, useMemo, useState } from "react"
|
||||
import { TITLE_PRESETS } from "./constants"
|
||||
import type { TitleStyleConfig } from "./types"
|
||||
import type { TitleTemplate } from "./template-types"
|
||||
|
||||
const STORAGE_KEY = "xiaoxia.title.templates.v1"
|
||||
|
||||
function uid(): string {
|
||||
return "usr:" + Math.random().toString(36).slice(2, 10) + Date.now().toString(36)
|
||||
}
|
||||
|
||||
/** 把 TITLE_PRESETS 转为内置 TitleTemplate 列表 */
|
||||
function buildBuiltinTemplates(): TitleTemplate[] {
|
||||
const now = "2026-09-22T00:00:00+08:00"
|
||||
return TITLE_PRESETS.map((p) => ({
|
||||
id: `sys:${p.key}`,
|
||||
name: p.label,
|
||||
description: "系统内置模板",
|
||||
isBuiltin: true,
|
||||
emoji: p.emoji,
|
||||
createdAt: now,
|
||||
updatedAt: now,
|
||||
style: { ...p.style },
|
||||
}))
|
||||
}
|
||||
|
||||
function loadUserTemplates(): TitleTemplate[] {
|
||||
if (typeof window === "undefined") return []
|
||||
try {
|
||||
const raw = window.localStorage.getItem(STORAGE_KEY)
|
||||
if (!raw) return []
|
||||
const parsed = JSON.parse(raw)
|
||||
if (!Array.isArray(parsed)) return []
|
||||
return parsed.filter((t) => t && !t.isBuiltin && t.id.startsWith("usr:"))
|
||||
} catch {
|
||||
return []
|
||||
}
|
||||
}
|
||||
|
||||
function saveUserTemplates(list: TitleTemplate[]) {
|
||||
if (typeof window === "undefined") return
|
||||
try {
|
||||
window.localStorage.setItem(STORAGE_KEY, JSON.stringify(list))
|
||||
} catch {
|
||||
/* ignore quota */
|
||||
}
|
||||
}
|
||||
|
||||
export interface UseTitleTemplatesResult {
|
||||
templates: TitleTemplate[]
|
||||
builtin: TitleTemplate[]
|
||||
custom: TitleTemplate[]
|
||||
/** 新建自定义模板:传入样式(snake_case),返回新建模板 id */
|
||||
createTemplate: (input: {
|
||||
name: string
|
||||
description?: string
|
||||
emoji?: string
|
||||
style: Partial<TitleStyleConfig>
|
||||
}) => TitleTemplate
|
||||
/** 复制模板(内置模板也可复制,自动加"副本"后缀) */
|
||||
duplicateTemplate: (id: string) => TitleTemplate | null
|
||||
/** 更新自定义模板(系统模板不可改) */
|
||||
updateTemplate: (id: string, patch: Partial<Omit<TitleTemplate, "id" | "isBuiltin">>) => void
|
||||
/** 删除自定义模板 */
|
||||
deleteTemplate: (id: string) => void
|
||||
/** 导出单个模板为 JSON 字符串 */
|
||||
exportTemplate: (id: string) => string | null
|
||||
/** 导入 JSON 字符串作为新模板,返回新建模板 */
|
||||
importTemplate: (json: string) => TitleTemplate | null
|
||||
/** 根据 id 查询模板 */
|
||||
getById: (id: string) => TitleTemplate | undefined
|
||||
}
|
||||
|
||||
export function useTitleTemplates(): UseTitleTemplatesResult {
|
||||
const [custom, setCustom] = useState<TitleTemplate[]>(() => loadUserTemplates())
|
||||
|
||||
// 跨 tab 同步
|
||||
useEffect(() => {
|
||||
const onStorage = (e: StorageEvent) => {
|
||||
if (e.key === STORAGE_KEY) setCustom(loadUserTemplates())
|
||||
}
|
||||
window.addEventListener("storage", onStorage)
|
||||
return () => window.removeEventListener("storage", onStorage)
|
||||
}, [])
|
||||
|
||||
const builtin = useMemo(() => buildBuiltinTemplates(), [])
|
||||
const templates = useMemo(() => [...builtin, ...custom], [builtin, custom])
|
||||
|
||||
const persist = useCallback((next: TitleTemplate[]) => {
|
||||
setCustom(next)
|
||||
saveUserTemplates(next)
|
||||
}, [])
|
||||
|
||||
const getById = useCallback((id: string) => templates.find((t) => t.id === id), [templates])
|
||||
|
||||
const createTemplate = useCallback<UseTitleTemplatesResult["createTemplate"]>(
|
||||
({ name, description, emoji, style }) => {
|
||||
const now = new Date().toISOString()
|
||||
const t: TitleTemplate = {
|
||||
id: uid(),
|
||||
name: name.trim() || "未命名模板",
|
||||
description: description?.trim() || undefined,
|
||||
emoji: emoji || "✨",
|
||||
isBuiltin: false,
|
||||
createdAt: now,
|
||||
updatedAt: now,
|
||||
style: { ...style },
|
||||
}
|
||||
persist([...custom, t])
|
||||
return t
|
||||
},
|
||||
[custom, persist],
|
||||
)
|
||||
|
||||
const duplicateTemplate = useCallback<UseTitleTemplatesResult["duplicateTemplate"]>(
|
||||
(id) => {
|
||||
const src = templates.find((t) => t.id === id)
|
||||
if (!src) return null
|
||||
const now = new Date().toISOString()
|
||||
const t: TitleTemplate = {
|
||||
id: uid(),
|
||||
name: `${src.name} 副本`,
|
||||
description: src.description,
|
||||
emoji: src.emoji,
|
||||
isBuiltin: false,
|
||||
createdAt: now,
|
||||
updatedAt: now,
|
||||
style: { ...src.style },
|
||||
}
|
||||
persist([...custom, t])
|
||||
return t
|
||||
},
|
||||
[templates, custom, persist],
|
||||
)
|
||||
|
||||
const updateTemplate = useCallback<UseTitleTemplatesResult["updateTemplate"]>(
|
||||
(id, patch) => {
|
||||
if (id.startsWith("sys:")) return
|
||||
const next = custom.map((t) =>
|
||||
t.id === id
|
||||
? { ...t, ...patch, id: t.id, isBuiltin: false, updatedAt: new Date().toISOString() }
|
||||
: t,
|
||||
)
|
||||
persist(next)
|
||||
},
|
||||
[custom, persist],
|
||||
)
|
||||
|
||||
const deleteTemplate = useCallback<UseTitleTemplatesResult["deleteTemplate"]>(
|
||||
(id) => {
|
||||
if (id.startsWith("sys:")) return
|
||||
persist(custom.filter((t) => t.id !== id))
|
||||
},
|
||||
[custom, persist],
|
||||
)
|
||||
|
||||
const exportTemplate = useCallback<UseTitleTemplatesResult["exportTemplate"]>(
|
||||
(id) => {
|
||||
const t = templates.find((x) => x.id === id)
|
||||
if (!t) return null
|
||||
return JSON.stringify(
|
||||
{
|
||||
name: t.name,
|
||||
description: t.description,
|
||||
emoji: t.emoji,
|
||||
style: t.style,
|
||||
exportedAt: new Date().toISOString(),
|
||||
},
|
||||
null,
|
||||
2,
|
||||
)
|
||||
},
|
||||
[templates],
|
||||
)
|
||||
|
||||
const importTemplate = useCallback<UseTitleTemplatesResult["importTemplate"]>(
|
||||
(json) => {
|
||||
try {
|
||||
const data = JSON.parse(json)
|
||||
if (!data || typeof data !== "object" || !data.style) return null
|
||||
return createTemplate({
|
||||
name: data.name || "导入模板",
|
||||
description: data.description,
|
||||
emoji: data.emoji || "✨",
|
||||
style: data.style,
|
||||
})
|
||||
} catch {
|
||||
return null
|
||||
}
|
||||
},
|
||||
[createTemplate],
|
||||
)
|
||||
|
||||
return {
|
||||
templates,
|
||||
builtin,
|
||||
custom,
|
||||
createTemplate,
|
||||
duplicateTemplate,
|
||||
updateTemplate,
|
||||
deleteTemplate,
|
||||
exportTemplate,
|
||||
importTemplate,
|
||||
getById,
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,98 @@
|
||||
/**
|
||||
* 标题样式工具(#2001 / 模板系统 #2003)
|
||||
*
|
||||
* - snake_case TitleStyleConfig ↔ camelCase TitleSettings 互转
|
||||
* - preset 归一化预览(修复"标题"两字大小不一)
|
||||
*/
|
||||
import type { TitleStyleConfig } from "./types"
|
||||
import type { TitleSettings } from "../../pages/generate/types"
|
||||
import { TITLE_PRESETS } from "./constants"
|
||||
|
||||
/** snake_case TitleStyleConfig → camelCase TitleSettings(仅覆盖已知字段) */
|
||||
export function titleStyleConfigToCamel(s: Partial<TitleStyleConfig>): Partial<TitleSettings> {
|
||||
const out: Partial<TitleSettings> = {}
|
||||
if (s.font != null) out.font = s.font
|
||||
if (s.size != null) out.size = s.size
|
||||
if (s.color != null) out.color = s.color
|
||||
if (s.bold != null) out.bold = s.bold
|
||||
if (s.italic != null) out.italic = s.italic
|
||||
if (s.position != null) out.position = s.position as TitleSettings["position"]
|
||||
if (s.pos_x != null) out.posX = s.pos_x
|
||||
if (s.pos_y != null) out.posY = s.pos_y
|
||||
if (s.line_height != null) out.lineHeight = s.line_height
|
||||
if (s.margin_top != null) out.marginTop = s.margin_top
|
||||
if (s.max_chars_per_line != null) out.maxCharsPerLine = s.max_chars_per_line
|
||||
if (s.stroke != null) out.stroke = s.stroke
|
||||
if (s.stroke_width != null) out.strokeWidth = s.stroke_width
|
||||
if (s.stroke_color != null) out.strokeColor = s.stroke_color
|
||||
if (s.shadow != null) out.shadow = s.shadow
|
||||
if (s.shadow_offset_x != null) out.shadowOffsetX = s.shadow_offset_x
|
||||
if (s.shadow_offset_y != null) out.shadowOffsetY = s.shadow_offset_y
|
||||
if (s.shadow_blur != null) out.shadowBlur = s.shadow_blur
|
||||
if (s.shadow_color != null) out.shadowColor = s.shadow_color
|
||||
if (s.bg_enabled != null) out.bgEnabled = s.bg_enabled
|
||||
if (s.bg_color != null) out.bgColor = s.bg_color
|
||||
if (s.bg_padding != null) out.bgPadding = s.bg_padding
|
||||
if (s.bg_radius != null) out.bgRadius = s.bg_radius
|
||||
if (s.line_overrides != null) out.lineOverrides = s.line_overrides
|
||||
return out
|
||||
}
|
||||
|
||||
/** camelCase TitleSettings patch → snake_case TitleStyleConfig patch */
|
||||
export function camelToTitleStyleConfig(p: Partial<TitleSettings>): Partial<TitleStyleConfig> {
|
||||
const out: Partial<TitleStyleConfig> = {}
|
||||
if (p.font != null) out.font = p.font
|
||||
if (p.size != null) out.size = p.size
|
||||
if (p.color != null) out.color = p.color
|
||||
if (p.bold != null) out.bold = p.bold
|
||||
if (p.italic != null) out.italic = p.italic
|
||||
if (p.position != null) out.position = p.position as TitleStyleConfig["position"]
|
||||
if (p.posX != null) out.pos_x = p.posX
|
||||
if (p.posY != null) out.pos_y = p.posY
|
||||
if (p.lineHeight != null) out.line_height = p.lineHeight
|
||||
if (p.marginTop != null) out.margin_top = p.marginTop
|
||||
if (p.maxCharsPerLine != null) out.max_chars_per_line = p.maxCharsPerLine
|
||||
if (p.stroke != null) out.stroke = p.stroke
|
||||
if (p.strokeWidth != null) out.stroke_width = p.strokeWidth
|
||||
if (p.strokeColor != null) out.stroke_color = p.strokeColor
|
||||
if (p.shadow != null) out.shadow = p.shadow
|
||||
if (p.shadowOffsetX != null) out.shadow_offset_x = p.shadowOffsetX
|
||||
if (p.shadowOffsetY != null) out.shadow_offset_y = p.shadowOffsetY
|
||||
if (p.shadowBlur != null) out.shadow_blur = p.shadowBlur
|
||||
if (p.shadowColor != null) out.shadow_color = p.shadowColor
|
||||
if (p.bgEnabled != null) out.bg_enabled = p.bgEnabled
|
||||
if (p.bgColor != null) out.bg_color = p.bgColor
|
||||
if (p.bgPadding != null) out.bg_padding = p.bgPadding
|
||||
if (p.bgRadius != null) out.bg_radius = p.bgRadius
|
||||
if (p.lineOverrides != null) out.line_overrides = p.lineOverrides
|
||||
return out
|
||||
}
|
||||
|
||||
/**
|
||||
* 把 preset style(snake_case)归一化为固定字号的 TitleSettings,
|
||||
* 用于"预设卡片"缩略预览——所有卡片视觉上"标题"两字大小一致,便于辨识。
|
||||
* 描边/阴影/背景padding 按 fixedSize / 原始 size 比例缩放,避免粗描边爆框。
|
||||
*/
|
||||
export function buildPresetPreviewSettings(
|
||||
base: TitleSettings,
|
||||
presetKey: string,
|
||||
fixedSize = 56,
|
||||
): TitleSettings {
|
||||
const preset = TITLE_PRESETS.find((p) => p.key === presetKey)
|
||||
if (!preset) return base
|
||||
const origSize = preset.style.size ?? fixedSize
|
||||
const ratio = fixedSize / origSize
|
||||
const scale = (v: number | undefined, fallback: number): number =>
|
||||
v != null ? Math.round(v * ratio) : fallback
|
||||
return {
|
||||
...base,
|
||||
...titleStyleConfigToCamel(preset.style),
|
||||
size: fixedSize,
|
||||
strokeWidth: scale(preset.style.stroke_width, base.strokeWidth) ?? base.strokeWidth,
|
||||
shadowOffsetX: scale(preset.style.shadow_offset_x, base.shadowOffsetX) ?? base.shadowOffsetX,
|
||||
shadowOffsetY: scale(preset.style.shadow_offset_y, base.shadowOffsetY) ?? base.shadowOffsetY,
|
||||
shadowBlur: scale(preset.style.shadow_blur, base.shadowBlur) ?? base.shadowBlur,
|
||||
bgPadding: scale(preset.style.bg_padding, base.bgPadding) ?? base.bgPadding,
|
||||
lineOverrides: [],
|
||||
}
|
||||
}
|
||||
@@ -10,6 +10,9 @@
|
||||
import React, { useMemo, useState, useEffect } from "react"
|
||||
import { Input } from "antd"
|
||||
import TitleStylePanel from "@/pages/generate/components/title/TitleStylePanel"
|
||||
import TitleTemplateSelector from "@/components/title/TitleTemplateSelector"
|
||||
import type { TitleTemplate } from "@/components/title/template-types"
|
||||
|
||||
import TitleLibraryAutoComplete from "@/pages/generate/components/title/TitleLibraryAutoComplete"
|
||||
import type { TitleOption } from "@/pages/generate/components/title/TitleLibraryAutoComplete"
|
||||
import type { TitleSettings } from "@/pages/generate/types"
|
||||
@@ -29,6 +32,8 @@ interface PanelTitleConfigProps {
|
||||
const PanelTitleConfig: React.FC<PanelTitleConfigProps> = ({ titleConfig, onUpdate }) => {
|
||||
/** TitleStylePanel 内部高亮的预设 key(面板本地状态) */
|
||||
const [activePreset, setActivePreset] = useState<string | null>(null)
|
||||
const [templateModalOpen, setTemplateModalOpen] = useState(false)
|
||||
const [activeTemplate, setActiveTemplate] = useState<TitleTemplate | null>(null)
|
||||
|
||||
/** 标题库选项(#1894:从文案库 scripts[].title 取候选) */
|
||||
const [titleOptions, setTitleOptions] = useState<TitleOption[]>([])
|
||||
@@ -375,6 +380,9 @@ const PanelTitleConfig: React.FC<PanelTitleConfigProps> = ({ titleConfig, onUpda
|
||||
onUpdateStyle={handleUpdateStyle}
|
||||
showCoverToggle
|
||||
previewWidth={280}
|
||||
enableTemplates
|
||||
onOpenTemplates={() => setTemplateModalOpen(true)}
|
||||
activeTemplateLabel={activeTemplate?.name ?? null}
|
||||
activePreset={activePreset}
|
||||
titlePresets={
|
||||
TITLE_PRESETS as unknown as React.ComponentProps<typeof TitleStylePanel>["titlePresets"]
|
||||
@@ -383,6 +391,45 @@ const PanelTitleConfig: React.FC<PanelTitleConfigProps> = ({ titleConfig, onUpda
|
||||
FONT_OPTIONS={FONT_OPTIONS}
|
||||
/>
|
||||
|
||||
<TitleTemplateSelector
|
||||
open={templateModalOpen}
|
||||
selectedTemplateId={activeTemplate?.id}
|
||||
onClose={() => setTemplateModalOpen(false)}
|
||||
onSelect={(settings, tpl) => {
|
||||
setActiveTemplate(tpl)
|
||||
setActivePreset(null)
|
||||
setTemplateModalOpen(false)
|
||||
// 把 camelCase settings 转回 snake_case 并 onUpdate
|
||||
onUpdate({
|
||||
title: titleConfig.title,
|
||||
font: settings.font,
|
||||
size: settings.size,
|
||||
color: settings.color,
|
||||
bold: settings.bold,
|
||||
italic: settings.italic,
|
||||
position: settings.position,
|
||||
stroke: settings.stroke,
|
||||
stroke_width: settings.strokeWidth,
|
||||
stroke_color: settings.strokeColor,
|
||||
shadow: settings.shadow,
|
||||
shadow_offset_x: settings.shadowOffsetX,
|
||||
shadow_offset_y: settings.shadowOffsetY,
|
||||
shadow_blur: settings.shadowBlur,
|
||||
shadow_color: settings.shadowColor,
|
||||
bg_enabled: settings.bgEnabled,
|
||||
bg_color: settings.bgColor,
|
||||
bg_padding: settings.bgPadding,
|
||||
bg_radius: settings.bgRadius,
|
||||
line_height: settings.lineHeight,
|
||||
margin_top: settings.marginTop,
|
||||
max_chars_per_line: settings.maxCharsPerLine,
|
||||
line_overrides: [],
|
||||
pos_x: settings.posX ?? undefined,
|
||||
pos_y: settings.posY ?? undefined,
|
||||
})
|
||||
}}
|
||||
/>
|
||||
|
||||
{/* 自动生成字幕 */}
|
||||
<div className="aa-subtitle-toggle">
|
||||
<label className="aa-checkbox-row">
|
||||
|
||||
@@ -29,6 +29,8 @@ import { usePreviewAssets } from "./hooks/usePreviewAssets"
|
||||
import { useBatchVariantPlans } from "./hooks/useBatchVariantPlans"
|
||||
import { useVariantVoicePreview } from "./hooks/useVariantVoicePreview"
|
||||
import { useTitleStyleUpdaters } from "./hooks/useStep4Title/useTitleStyleUpdaters"
|
||||
import TitleTemplateSelector from "@/components/title/TitleTemplateSelector"
|
||||
import type { TitleTemplate } from "@/components/title/template-types"
|
||||
import { getAssetsByKind } from "@/api/assets"
|
||||
import { previewTts } from "@/api/tts"
|
||||
import { usePointsStore } from "@/store/pointsStore"
|
||||
@@ -149,6 +151,8 @@ const GeneratePage: React.FC = () => {
|
||||
const [voiceModalOpen, setVoiceModalOpen] = useState(false)
|
||||
const [scriptModalOpen, setScriptModalOpen] = useState(false)
|
||||
const [ttsModalOpen, setTtsModalOpen] = useState(false)
|
||||
const [titleTemplateModalOpen, setTitleTemplateModalOpen] = useState(false)
|
||||
const [activeTitleTemplate, setActiveTitleTemplate] = useState<TitleTemplate | null>(null)
|
||||
|
||||
/* ── 标题样式回调 ── */
|
||||
const styleUpdaters = useTitleStyleUpdaters({
|
||||
@@ -643,6 +647,9 @@ const GeneratePage: React.FC = () => {
|
||||
onUpdateStyle={styleUpdaters.updateStyle}
|
||||
activePreset={styleUpdaters.activePreset}
|
||||
titlePresets={styleUpdaters.titlePresets}
|
||||
enableTemplates
|
||||
onOpenTemplates={() => setTitleTemplateModalOpen(true)}
|
||||
activeTemplateLabel={activeTitleTemplate?.name ?? null}
|
||||
bgm={bgm}
|
||||
bgmConfig={bgmConfig}
|
||||
coverSettings={coverSettings}
|
||||
@@ -807,6 +814,17 @@ const GeneratePage: React.FC = () => {
|
||||
onCancel={() => setTtsModalOpen(false)}
|
||||
onSynthesized={handleTtsSynthesized}
|
||||
/>
|
||||
{/* 标题模板选择器 */}
|
||||
<TitleTemplateSelector
|
||||
open={titleTemplateModalOpen}
|
||||
selectedTemplateId={activeTitleTemplate?.id}
|
||||
onClose={() => setTitleTemplateModalOpen(false)}
|
||||
onSelect={(settings, tpl) => {
|
||||
styleUpdaters.applyTemplate(settings)
|
||||
setActiveTitleTemplate(tpl)
|
||||
setTitleTemplateModalOpen(false)
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -17,7 +17,7 @@ import type { EditPlanClip } from "@/api/template-editor"
|
||||
import { useSegmentScheduler, type PlaybackSegment } from "../hooks/useSegmentScheduler"
|
||||
import { usePreviewAudio } from "../hooks/usePreviewAudio"
|
||||
import { PreviewControls } from "./PreviewControls"
|
||||
import { getFontFamily } from "../constants"
|
||||
import { getFontFamily } from "@/components/title/constants"
|
||||
|
||||
interface FrontendPreviewPlayerProps {
|
||||
assets: AssetItem[]
|
||||
|
||||
@@ -59,6 +59,9 @@ export interface GenerateStepContentProps {
|
||||
emoji?: string
|
||||
style: Record<string, unknown>
|
||||
}>
|
||||
enableTemplates?: boolean
|
||||
onOpenTemplates?: () => void
|
||||
activeTemplateLabel?: string | null
|
||||
/* ── 封面 ── */
|
||||
coverSettings: CoverConfig
|
||||
onCoverSettingsChange: (settings: CoverConfig) => void
|
||||
@@ -126,6 +129,9 @@ export const GenerateStepContent: React.FC<GenerateStepContentProps> = (props) =
|
||||
onToggleShadow,
|
||||
onApplyPreset,
|
||||
onUpdateStyle,
|
||||
enableTemplates,
|
||||
onOpenTemplates,
|
||||
activeTemplateLabel,
|
||||
activePreset,
|
||||
titlePresets,
|
||||
coverSettings,
|
||||
@@ -201,6 +207,9 @@ export const GenerateStepContent: React.FC<GenerateStepContentProps> = (props) =
|
||||
onUpdateStyle={onUpdateStyle}
|
||||
activePreset={activePreset}
|
||||
titlePresets={titlePresets}
|
||||
enableTemplates={enableTemplates}
|
||||
onOpenTemplates={onOpenTemplates}
|
||||
activeTemplateLabel={activeTemplateLabel}
|
||||
previewCount={previewCount}
|
||||
previewTitles={previewTitles}
|
||||
onPreviewTitlesChange={onPreviewTitlesChange}
|
||||
|
||||
@@ -49,6 +49,9 @@ interface Step4TitleSettingsProps {
|
||||
/** 每个变体的标题文字(长度=previewCount) */
|
||||
previewTitles?: string[]
|
||||
onPreviewTitlesChange?: (titles: string[]) => void
|
||||
enableTemplates?: boolean
|
||||
onOpenTemplates?: () => void
|
||||
activeTemplateLabel?: string | null
|
||||
}
|
||||
|
||||
/** 从本地 AI 标题模板池按主题词生成 N 个不同标题(与单视频 AI 生成同源) */
|
||||
@@ -98,6 +101,9 @@ const Step4TitleSettings: React.FC<Step4TitleSettingsProps> = (props) => {
|
||||
previewCount = 1,
|
||||
previewTitles,
|
||||
onPreviewTitlesChange,
|
||||
enableTemplates,
|
||||
onOpenTemplates,
|
||||
activeTemplateLabel,
|
||||
} = props
|
||||
|
||||
const isBatch = previewCount > 1
|
||||
@@ -300,6 +306,9 @@ const Step4TitleSettings: React.FC<Step4TitleSettingsProps> = (props) => {
|
||||
titlePresets={titlePresets}
|
||||
POSITION_OPTIONS={POSITION_OPTIONS}
|
||||
FONT_OPTIONS={FONT_OPTIONS}
|
||||
enableTemplates={enableTemplates}
|
||||
onOpenTemplates={onOpenTemplates}
|
||||
activeTemplateLabel={activeTemplateLabel}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
*/
|
||||
import React, { useEffect, useRef } from "react"
|
||||
import type { TitleSettings } from "../../types"
|
||||
import { getFontFamily } from "../../constants"
|
||||
import { getFontFamily } from "@/components/title/constants"
|
||||
|
||||
interface Props {
|
||||
settings: TitleSettings
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
* 避免 -webkit-text-stroke 在 Chromium 中吞掉填充色的问题
|
||||
*/
|
||||
import React from "react"
|
||||
import { getFontFamily } from "../../constants"
|
||||
import { getFontFamily } from "@/components/title/constants"
|
||||
|
||||
interface TitlePresetItem {
|
||||
key: string
|
||||
|
||||
@@ -442,3 +442,17 @@
|
||||
font-size: 12px !important;
|
||||
padding: 6px 8px !important;
|
||||
}
|
||||
|
||||
/* 标题模板入口按钮(#2003) */
|
||||
.ts-template-btn {
|
||||
border: none;
|
||||
background: transparent;
|
||||
color: var(--primary-color, #7c3aed);
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
padding: 2px 0;
|
||||
font-weight: 500;
|
||||
}
|
||||
.ts-template-btn:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
@@ -19,6 +19,7 @@ import {
|
||||
STROKE_COLOR_PALETTE,
|
||||
BG_COLOR_PALETTE,
|
||||
} from "@/components/title/constants"
|
||||
import { buildPresetPreviewSettings } from "@/components/title/utils"
|
||||
|
||||
import TitleMiniPreview from "./TitleMiniPreview"
|
||||
import "./TitleStylePanel.css"
|
||||
@@ -57,6 +58,12 @@ interface TitleStylePanelProps {
|
||||
showCoverToggle?: boolean
|
||||
/** 画布预览宽度(默认 200) */
|
||||
previewWidth?: number
|
||||
/** 是否启用「标题模板」入口(显示选择模板按钮,隐藏旧预设网格) */
|
||||
enableTemplates?: boolean
|
||||
/** 打开模板选择器回调 */
|
||||
onOpenTemplates?: () => void
|
||||
/** 当前选中模板名称 */
|
||||
activeTemplateLabel?: string | null
|
||||
}
|
||||
|
||||
/* ── 通用 Slider + Label 行 ── */
|
||||
@@ -150,8 +157,8 @@ const PresetGrid: React.FC<{
|
||||
<div className="ts-presets-grid">
|
||||
{TITLE_PRESETS.map((p) => {
|
||||
const isActive = activePreset === p.key
|
||||
// 合并当前 style 与 preset.style 用于预览(仅预览时覆盖)
|
||||
const previewStyle: TitleSettings = { ...settings, ...(p.style as Partial<TitleSettings>) }
|
||||
// 归一化预览:固定字号 48(按 360 基准缩放后 ~13px),所有卡片"标题"两字视觉大小一致,描边/阴影按比例缩放
|
||||
const previewStyle = buildPresetPreviewSettings(settings, p.key, 56)
|
||||
return (
|
||||
<button
|
||||
key={p.key}
|
||||
@@ -161,7 +168,7 @@ const PresetGrid: React.FC<{
|
||||
title={p.label}
|
||||
>
|
||||
<div className="ts-preset-preview">
|
||||
<TitleMiniPreview settings={previewStyle} width={100} sampleText="标题" />
|
||||
<TitleMiniPreview settings={previewStyle} width={120} sampleText="标题" />
|
||||
</div>
|
||||
<div className="ts-preset-meta">
|
||||
<span className="ts-preset-emoji">{p.emoji}</span>
|
||||
@@ -189,6 +196,9 @@ const TitleStylePanel: React.FC<TitleStylePanelProps> = ({
|
||||
POSITION_OPTIONS,
|
||||
showCoverToggle = false,
|
||||
previewWidth = 220,
|
||||
enableTemplates = false,
|
||||
onOpenTemplates,
|
||||
activeTemplateLabel,
|
||||
onUpdateStyle,
|
||||
}) => {
|
||||
const upd = (patch: Partial<TitleSettings>) => {
|
||||
@@ -209,10 +219,21 @@ const TitleStylePanel: React.FC<TitleStylePanelProps> = ({
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* 预设样式(10个,含抖音爆款黄) */}
|
||||
{/* 标题模板 / 爆款预设 */}
|
||||
<div className="ts-form-field">
|
||||
<label>爆款预设</label>
|
||||
<PresetGrid activePreset={activePreset} onApply={onApplyPreset} settings={settings} />
|
||||
<div className="ts-field-label-row">
|
||||
<label>{enableTemplates ? "标题模板" : "爆款预设"}</label>
|
||||
{enableTemplates ? (
|
||||
<button type="button" className="ts-template-btn" onClick={onOpenTemplates}>
|
||||
{activeTemplateLabel ? `当前:${activeTemplateLabel} · ` : ""}选择模板
|
||||
</button>
|
||||
) : (
|
||||
activePreset && <span className="ts-field-value">已选</span>
|
||||
)}
|
||||
</div>
|
||||
{!enableTemplates && (
|
||||
<PresetGrid activePreset={activePreset} onApply={onApplyPreset} settings={settings} />
|
||||
)}
|
||||
</div>
|
||||
|
||||
<Tabs
|
||||
|
||||
@@ -54,39 +54,8 @@ export const POSITION_OPTIONS = [
|
||||
{ value: "custom", label: "自定义" },
|
||||
]
|
||||
|
||||
/* ── 标题字体选项(#2001:新增 4 款爆款字体) ── */
|
||||
export const FONT_OPTIONS = [
|
||||
"优设标题黑",
|
||||
"阿里普惠体Bold",
|
||||
"抖音美好体",
|
||||
"思源黑体Heavy",
|
||||
"思源黑体",
|
||||
"思源宋体",
|
||||
"苹方",
|
||||
"微软雅黑",
|
||||
"楷体",
|
||||
]
|
||||
|
||||
/* ── 标题字体 CSS font-family 映射(中文显示名 → 浏览器可识别的字体栈) ── */
|
||||
export const FONT_FAMILY_MAP: Record<string, string> = {
|
||||
优设标题黑:
|
||||
'"YouSheBiaoTiHei","YouShe Title Black","Source Han Sans SC Heavy","Noto Sans SC","PingFang SC",sans-serif',
|
||||
阿里普惠体Bold:
|
||||
'"Alibaba PuHuiTi Bold","Alibaba PuHuiTi","Source Han Sans SC","PingFang SC",sans-serif',
|
||||
抖音美好体: '"Douyin Sans","DouyinSansBold","Source Han Sans SC Heavy","PingFang SC",sans-serif',
|
||||
思源黑体Heavy:
|
||||
'"Source Han Sans SC Heavy","Noto Sans SC Heavy","Source Han Sans CN Heavy","PingFang SC",sans-serif',
|
||||
思源黑体: '"Source Han Sans SC", "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif',
|
||||
思源宋体: '"Source Han Serif SC", "Noto Serif SC", "Songti SC", "SimSun", serif',
|
||||
苹方: '"PingFang SC", -apple-system, "Helvetica Neue", sans-serif',
|
||||
PingFang: '"PingFang SC", -apple-system, "Helvetica Neue", sans-serif',
|
||||
微软雅黑: '"Microsoft YaHei", "PingFang SC", sans-serif',
|
||||
楷体: '"KaiTi", "STKaiti", "DFKai-SB", serif',
|
||||
}
|
||||
|
||||
export function getFontFamily(font: string): string {
|
||||
return FONT_FAMILY_MAP[font] || FONT_FAMILY_MAP["思源黑体"]
|
||||
}
|
||||
/* ── 标题字体:统一使用公共层定义(#2001) ── */
|
||||
export { getFontFamily } from "@/components/title/constants"
|
||||
|
||||
/* ── 标题样式预设 ── */
|
||||
export const TITLE_PRESETS = [
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import { useCallback, useMemo } from "react"
|
||||
import { TITLE_PRESETS } from "../../constants"
|
||||
import { TITLE_PRESETS as NEW_TITLE_PRESETS } from "@/components/title/constants"
|
||||
import { titleStyleConfigToCamel } from "@/components/title/utils"
|
||||
import type { TitleSettings } from "../../types"
|
||||
|
||||
interface UseTitleStyleUpdatersOptions {
|
||||
@@ -16,8 +17,24 @@ export function useTitleStyleUpdaters({
|
||||
titleSettings,
|
||||
onTitleSettingsChange,
|
||||
}: UseTitleStyleUpdatersOptions) {
|
||||
/** 匹配预设:只用 color/bold/italic/stroke/shadow,不再匹配 size */
|
||||
/** 匹配预设:对新预设(snake→camel 后)全字段比;旧预设只比 color/bold/italic/stroke/shadow */
|
||||
const getActivePreset = (settings: TitleSettings): string | null => {
|
||||
// 新预设匹配:font/size/color/bold/stroke/shadow/bg 全部对齐才算命中
|
||||
for (const p of NEW_TITLE_PRESETS) {
|
||||
const camel = titleStyleConfigToCamel(p.style)
|
||||
if (
|
||||
(camel.font ?? null) === (settings.font ?? null) &&
|
||||
(camel.color ?? null) === (settings.color ?? null) &&
|
||||
(camel.bold ?? null) === (settings.bold ?? null) &&
|
||||
(camel.italic ?? null) === (settings.italic ?? null) &&
|
||||
(camel.stroke ?? null) === (settings.stroke ?? null) &&
|
||||
(camel.shadow ?? null) === (settings.shadow ?? null) &&
|
||||
(camel.bgEnabled ?? null) === (settings.bgEnabled ?? null)
|
||||
) {
|
||||
return p.key
|
||||
}
|
||||
}
|
||||
// fallback 旧预设(legacy)
|
||||
for (const p of TITLE_PRESETS) {
|
||||
if (
|
||||
settings.color === p.style.color &&
|
||||
@@ -91,24 +108,31 @@ export function useTitleStyleUpdaters({
|
||||
}, [titleSettings, onTitleSettingsChange])
|
||||
|
||||
const toggleStroke = useCallback(() => {
|
||||
onTitleSettingsChange({ ...titleSettings, stroke: !titleSettings.stroke })
|
||||
onTitleSettingsChange({
|
||||
...titleSettings,
|
||||
stroke: !titleSettings.stroke,
|
||||
// 开启描边时若宽度过小给个默认值(让滑块可见可调)
|
||||
strokeWidth:
|
||||
!titleSettings.stroke && (titleSettings.strokeWidth ?? 0) < 2
|
||||
? 4
|
||||
: titleSettings.strokeWidth,
|
||||
})
|
||||
}, [titleSettings, onTitleSettingsChange])
|
||||
|
||||
const toggleShadow = useCallback(() => {
|
||||
onTitleSettingsChange({ ...titleSettings, shadow: !titleSettings.shadow })
|
||||
}, [titleSettings, onTitleSettingsChange])
|
||||
|
||||
/** 应用预设(支持新预设细粒度字段) */
|
||||
/** 应用预设:正确把 snake_case 的 preset.style 转为 camelCase 再 spread */
|
||||
const applyPreset = useCallback(
|
||||
(presetKey: string) => {
|
||||
// 优先匹配新预设(10个爆款预设),fallback 旧预设
|
||||
const newPreset = NEW_TITLE_PRESETS.find((p) => p.key === presetKey)
|
||||
const oldPreset = TITLE_PRESETS.find((p) => p.key === presetKey)
|
||||
if (newPreset) {
|
||||
onTitleSettingsChange({
|
||||
...titleSettings,
|
||||
...(newPreset.style as Partial<TitleSettings>),
|
||||
// 清除逐行覆盖
|
||||
...titleStyleConfigToCamel(newPreset.style),
|
||||
// 封面独立标题保持不变(不清空,避免破坏封面定制)
|
||||
lineOverrides: [],
|
||||
})
|
||||
return
|
||||
@@ -116,11 +140,47 @@ export function useTitleStyleUpdaters({
|
||||
if (!oldPreset) return
|
||||
onTitleSettingsChange({
|
||||
...titleSettings,
|
||||
color: oldPreset.style.color,
|
||||
bold: oldPreset.style.bold,
|
||||
italic: oldPreset.style.italic,
|
||||
stroke: oldPreset.style.stroke,
|
||||
shadow: oldPreset.style.shadow,
|
||||
color: oldPreset.style.color as string,
|
||||
bold: oldPreset.style.bold as boolean,
|
||||
italic: oldPreset.style.italic as boolean,
|
||||
stroke: oldPreset.style.stroke as boolean,
|
||||
shadow: oldPreset.style.shadow as boolean,
|
||||
})
|
||||
},
|
||||
[titleSettings, onTitleSettingsChange],
|
||||
)
|
||||
|
||||
/** 应用模板:用模板(camelCase TitleSettings)覆盖样式字段,保留 title/aiAutoSelect */
|
||||
const applyTemplate = useCallback(
|
||||
(tpl: TitleSettings) => {
|
||||
onTitleSettingsChange({
|
||||
...titleSettings,
|
||||
// 覆盖样式字段
|
||||
position: tpl.position,
|
||||
posX: tpl.posX,
|
||||
posY: tpl.posY,
|
||||
font: tpl.font,
|
||||
size: tpl.size,
|
||||
bold: tpl.bold,
|
||||
italic: tpl.italic,
|
||||
stroke: tpl.stroke,
|
||||
shadow: tpl.shadow,
|
||||
color: tpl.color,
|
||||
lineHeight: tpl.lineHeight,
|
||||
marginTop: tpl.marginTop,
|
||||
maxCharsPerLine: tpl.maxCharsPerLine,
|
||||
strokeWidth: tpl.strokeWidth,
|
||||
strokeColor: tpl.strokeColor,
|
||||
shadowOffsetX: tpl.shadowOffsetX,
|
||||
shadowOffsetY: tpl.shadowOffsetY,
|
||||
shadowBlur: tpl.shadowBlur,
|
||||
shadowColor: tpl.shadowColor,
|
||||
bgEnabled: tpl.bgEnabled,
|
||||
bgColor: tpl.bgColor,
|
||||
bgPadding: tpl.bgPadding,
|
||||
bgRadius: tpl.bgRadius,
|
||||
lineOverrides: [],
|
||||
// coverTitle 保留用户当前值,不强制覆盖
|
||||
})
|
||||
},
|
||||
[titleSettings, onTitleSettingsChange],
|
||||
@@ -149,6 +209,7 @@ export function useTitleStyleUpdaters({
|
||||
toggleStroke,
|
||||
toggleShadow,
|
||||
applyPreset,
|
||||
applyTemplate,
|
||||
updateStyle,
|
||||
}
|
||||
}
|
||||
|
||||
@@ -108,11 +108,14 @@ def _check_musetalk_health() -> tuple[bool, dict]:
|
||||
return False, {"error": str(exc)}
|
||||
|
||||
|
||||
def _register(task_id: Optional[str] = None) -> bool:
|
||||
def _register(task_id: Optional[str] = None) -> tuple[bool, bool]:
|
||||
"""向服务端注册 / 心跳,附带 GPU 信息。
|
||||
|
||||
推理期间的心跳线程传 task_id:服务端会同步刷新该 processing 任务的
|
||||
last_heartbeat_at,防止长推理被误判超时回收。
|
||||
last_heartbeat_at,防止长推理被误判超时回收。同时服务端会检查该任务
|
||||
是否已被用户取消,若是则返回 cancel_task=True。
|
||||
|
||||
返回 (ok, cancel_task)。
|
||||
"""
|
||||
ok, info = _check_musetalk_health()
|
||||
if isinstance(info, dict):
|
||||
@@ -142,12 +145,14 @@ def _register(task_id: Optional[str] = None) -> bool:
|
||||
timeout=15,
|
||||
)
|
||||
if r.status_code == 200:
|
||||
return True
|
||||
resp_body = r.json()
|
||||
cancel_task = resp_body.get("cancel_task", False)
|
||||
return True, cancel_task
|
||||
logger.error("注册/心跳失败: HTTP %d body=%s", r.status_code, r.text[:300])
|
||||
return False
|
||||
return False, False
|
||||
except Exception as exc:
|
||||
logger.error("注册/心跳异常: %s", exc)
|
||||
return False
|
||||
return False, False
|
||||
|
||||
|
||||
def _probe_gpu_name() -> str:
|
||||
@@ -329,6 +334,9 @@ class TaskHeartbeat(threading.Thread):
|
||||
期间无法发送,服务端会因任务 last_heartbeat_at 停滞而误判超时回退 pending。
|
||||
本线程每 task_heartbeat_interval 秒(默认 30s)POST /gpu/register 并
|
||||
携带当前 task_id,让服务端持续续期任务心跳;任务处理结束 stop()。
|
||||
|
||||
同时检测服务端返回的 cancel_task 信号:若为 True,说明用户已取消任务,
|
||||
立即调用 _cancel_musetalk() 终止本地推理,并设置 cancelled 标志供主流程检查。
|
||||
"""
|
||||
|
||||
def __init__(self, task_id: str, interval: float):
|
||||
@@ -336,13 +344,21 @@ class TaskHeartbeat(threading.Thread):
|
||||
self.task_id = task_id
|
||||
self.interval = max(5.0, interval)
|
||||
self._stop_event = threading.Event()
|
||||
self.cancelled = False # 外部可读的取消标志
|
||||
|
||||
def run(self) -> None:
|
||||
# 先立即发一次,再按间隔循环(首次心跳失败不影响主流程)
|
||||
while not self._stop_event.is_set():
|
||||
try:
|
||||
if _register(self.task_id):
|
||||
ok, cancel_task = _register(self.task_id)
|
||||
if ok:
|
||||
logger.debug("任务 %s 心跳已发送", self.task_id)
|
||||
if cancel_task:
|
||||
logger.warning("任务 %s 已被用户取消,正在终止本地推理...", self.task_id)
|
||||
self.cancelled = True
|
||||
_cancel_musetalk()
|
||||
self._stop_event.set()
|
||||
return
|
||||
except Exception as exc: # noqa: BLE001
|
||||
logger.warning("任务 %s 心跳异常(忽略): %s", self.task_id, exc)
|
||||
self._stop_event.wait(self.interval)
|
||||
@@ -369,9 +385,17 @@ def _handle_task(task: dict) -> None:
|
||||
if not _download(task["video_url"], video_path):
|
||||
_report_result(task_id, False, 0.0, "下载人物视频失败")
|
||||
return
|
||||
if hb.cancelled:
|
||||
logger.info("任务 %s 在下载阶段被用户取消", task_id)
|
||||
_report_result(task_id, False, 0.0, "用户取消任务")
|
||||
return
|
||||
if not _download(task["audio_url"], audio_path):
|
||||
_report_result(task_id, False, 0.0, "下载驱动音频失败")
|
||||
return
|
||||
if hb.cancelled:
|
||||
logger.info("任务 %s 在下载阶段被用户取消", task_id)
|
||||
_report_result(task_id, False, 0.0, "用户取消任务")
|
||||
return
|
||||
|
||||
# 2. 输入时长前置校验:短视频 MuseTalk 会 division by zero,
|
||||
# 直接上报 failed,不浪费 GPU 时间。ffprobe 不可用/读失败(0.0)
|
||||
@@ -392,12 +416,20 @@ def _handle_task(task: dict) -> None:
|
||||
err = ""
|
||||
retryable = False
|
||||
for attempt in range(Config.task_max_retry + 1):
|
||||
if hb.cancelled:
|
||||
logger.info("任务 %s 在推理前被用户取消", task_id)
|
||||
_report_result(task_id, False, 0.0, "用户取消任务")
|
||||
return
|
||||
if attempt > 0:
|
||||
logger.info("任务 %s 第 %d 次重试(瞬时错误)...", task_id, attempt + 1)
|
||||
time.sleep(2)
|
||||
success, duration, err, retryable = _call_musetalk(video_path, audio_path, out_path)
|
||||
if success or not retryable:
|
||||
break
|
||||
if hb.cancelled:
|
||||
logger.info("任务 %s 被用户取消(推理已终止)", task_id)
|
||||
_report_result(task_id, False, 0.0, "用户取消任务")
|
||||
return
|
||||
if not success:
|
||||
logger.error("任务 %s 推理失败: %s", task_id, err)
|
||||
_report_result(task_id, False, 0.0, err)
|
||||
@@ -467,7 +499,8 @@ def main() -> int:
|
||||
# 心跳
|
||||
now = time.time()
|
||||
if now - last_heartbeat >= Config.heartbeat_interval:
|
||||
if _register():
|
||||
ok, _ = _register()
|
||||
if ok:
|
||||
last_heartbeat = now
|
||||
|
||||
# 轮询任务
|
||||
|
||||
@@ -3,8 +3,8 @@
|
||||
部署在 RTX2060 本地,接收 gpu_worker.py 的推理请求,调用 MuseTalk 生成口型同步视频。
|
||||
|
||||
Bug 修复(2026-09-21):
|
||||
- Bug1: 60fps降帧逻辑 — 输入视频 >30fps 时先降帧至 25fps 推理,推理后用
|
||||
minterpolate MCI 插帧回原帧率,并记录 input_fps/inference_fps
|
||||
- Bug1: 60fps降帧逻辑 — 输入视频 >30fps 时先降帧至 25fps 推理,直接输出 25fps 结果
|
||||
(MCI 运动补偿插帧已移除,CPU密集且口型场景 25fps 足够)
|
||||
- Bug2: 超时终止机制 — 推理线程改为 daemon + abort_event 机制,超时时 set event
|
||||
让推理循环检测退出,同时 kill 所有活跃 ffmpeg 子进程,等线程退出后再释放锁和清理目录
|
||||
- Bug3: /health 接口增加 gfpgan_loaded 和 gfpgan_load_error 字段
|
||||
@@ -526,13 +526,12 @@ def _load_musetalk_models():
|
||||
gfpgan_key = "params_ema" if "params_ema" in gfpgan_ckpt else "params"
|
||||
gfpgan_model.load_state_dict(gfpgan_ckpt[gfpgan_key], strict=True)
|
||||
gfpgan_model.eval()
|
||||
if Config.use_float16:
|
||||
gfpgan_model = gfpgan_model.half()
|
||||
# GFPGAN 始终使用 FP32 推理,避免 FP16 色偏导致紫/灰色块
|
||||
gfpgan_model = gfpgan_model.to(device)
|
||||
del gfpgan_ckpt
|
||||
_gfpgan_loaded = True
|
||||
_gfpgan_load_error = None
|
||||
logger.info("GFPGAN 加载完成 (FP16=%s)", Config.use_float16)
|
||||
logger.info("GFPGAN 加载完成 (FP32,避免色偏)")
|
||||
else:
|
||||
_gfpgan_loaded = False
|
||||
_gfpgan_load_error = f"模型文件不存在: {gfpgan_path}"
|
||||
@@ -806,8 +805,9 @@ def _run_inference(
|
||||
crop = frame[y1:y2_eff, x1:x2]
|
||||
if crop.size == 0:
|
||||
continue
|
||||
crop_rgb = cv2.cvtColor(crop, cv2.COLOR_BGR2RGB)
|
||||
crop_resized = cv2.resize(crop_rgb, (256, 256), interpolation=cv2.INTER_LANCZOS4)
|
||||
# 直接传 BGR 给 VAE:VAE 内部 preprocess_img 已做 BGR→RGB 转换,
|
||||
# 此处再 cvtColor 会造成双重转换、R/B 通道互换(蓝色块根因)。
|
||||
crop_resized = cv2.resize(crop, (256, 256), interpolation=cv2.INTER_LANCZOS4)
|
||||
# 使用 VAE 的 get_latents_for_unet 得到 8 通道输入
|
||||
# get_latents_for_unet 内部: preprocess(half_mask=True) encode + preprocess(half_mask=False) encode → cat → [1,8,32,32]
|
||||
latents = vae.get_latents_for_unet(crop_resized).detach().cpu()
|
||||
@@ -830,7 +830,7 @@ def _run_inference(
|
||||
# ── Step 6: 批量推理(仿旧版 datagen 循环)──
|
||||
res_frame_list = []
|
||||
video_num = len(whisper_features)
|
||||
bs = min(Config.batch_size, 2) # RTX2060 6G 限制batch=2防OOM
|
||||
bs = min(Config.batch_size, 8) # RTX3060 12G 显存,FP16+GFPGAN batch=8 约用 7-8GB,留足余量
|
||||
total_batches = (video_num + bs - 1) // bs
|
||||
|
||||
for bi in tqdm(range(total_batches), desc="MuseTalk 推理"):
|
||||
@@ -920,25 +920,30 @@ def _run_inference(
|
||||
_ff_proc.stdin.write(ori_frame.tobytes())
|
||||
continue
|
||||
|
||||
# GFPGAN 人脸超分增强
|
||||
# GFPGAN 人脸超分增强(FP32 推理,避免 FP16 色偏)
|
||||
# 色彩通道约定:ori_frame / res_frame / _face_up 均为 BGR(OpenCV 默认);
|
||||
# GFPGAN 输出用 return_rgb=True 拿到 RGB,再转 BGR,与后续 face_parsing 融合保持一致。
|
||||
if gfpgan_enhancer is not None:
|
||||
try:
|
||||
_fh, _fw = res_frame_resized.shape[:2]
|
||||
_face_up = cv2.resize(res_frame_resized, (512, 512),
|
||||
interpolation=cv2.INTER_LANCZOS4)
|
||||
_face_rgb = cv2.cvtColor(_face_up, cv2.COLOR_BGR2RGB).astype(np.float32) / 255.0
|
||||
_face_t = torch.from_numpy(_face_rgb.transpose(2,0,1)).unsqueeze(0)
|
||||
_face_t = torch.from_numpy(_face_rgb.transpose(2, 0, 1)).unsqueeze(0)
|
||||
# GFPGAN 始终 FP32,避免 FP16 精度导致色偏;归一化到 [-1, 1]
|
||||
_face_t = ((_face_t - 0.5) / 0.5).to(device)
|
||||
if Config.use_float16:
|
||||
_face_t = _face_t.half()
|
||||
with torch.no_grad():
|
||||
_out = gfpgan_enhancer(_face_t, return_rgb=False, weight=0.5)[0]
|
||||
_out = _out.squeeze(0).float().cpu().clamp_(-1,1)
|
||||
_out = ((_out + 1)/2*255).numpy().transpose(1,2,0)
|
||||
_out_bgr = cv2.cvtColor(_out.astype(np.uint8), cv2.COLOR_RGB2BGR)
|
||||
_out = gfpgan_enhancer(_face_t, return_rgb=True, weight=0.35)[0]
|
||||
# 输出 tensor: RGB, [-1, 1] 范围 → clamp → 映射到 [0, 255] uint8
|
||||
_out = _out.squeeze(0).float().cpu().clamp_(-1.0, 1.0)
|
||||
_out = ((_out + 1.0) / 2.0 * 255.0).numpy().transpose(1, 2, 0)
|
||||
_out_rgb = _out.astype(np.uint8)
|
||||
# RGB → BGR,与 ori_frame 保持一致,确保 face_parsing 融合时通道正确
|
||||
_out_bgr = cv2.cvtColor(_out_rgb, cv2.COLOR_RGB2BGR)
|
||||
|
||||
res_frame_resized = cv2.resize(_out_bgr, (_fw, _fh),
|
||||
interpolation=cv2.INTER_LANCZOS4)
|
||||
del _face_t, _out, _out_bgr
|
||||
del _face_t, _out, _out_rgb, _out_bgr
|
||||
except Exception as _gfpgan_err:
|
||||
logger.warning("GFPGAN 增强失败(帧 %d),使用原图: %s", i, _gfpgan_err)
|
||||
|
||||
@@ -977,27 +982,15 @@ def _run_inference(
|
||||
pass
|
||||
raise
|
||||
|
||||
# ── Step 8: 高帧率视频插帧还原(如输入 >30fps,从 25fps 插帧回原帧率)──
|
||||
# ── Step 8: 高帧率视频处理 ──
|
||||
# 对口型数字人视频,25fps 完全够用。
|
||||
# MCI 运动补偿插帧极其耗时(343帧>6分钟),已移除。
|
||||
# 直接输出 25fps 推理结果,后续封装音频后播放器自动适配帧率。
|
||||
final_video = silent_video_path
|
||||
if video_downsampled:
|
||||
upscaled_video = video_path.parent / "output_upscaled.mp4"
|
||||
logger.info("将推理结果从 %.1f fps 插帧还原至 %.1f fps", inference_fps, original_fps)
|
||||
try:
|
||||
_run_ffmpeg([
|
||||
"ffmpeg", "-y", "-v", "warning",
|
||||
"-i", str(silent_video_path),
|
||||
"-vf", f"minterpolate=mi_mode=mci:mc_mode=aobmc:me_mode=bidir:vsbmc=1:fps={int(original_fps)}",
|
||||
"-c:v", "libx264", "-preset", "veryfast",
|
||||
"-crf", "18", "-pix_fmt", "yuv420p",
|
||||
str(upscaled_video),
|
||||
], timeout=max(300, int(original_fps * 10)))
|
||||
final_video = upscaled_video
|
||||
logger.info("插帧还原完成: %.1f fps", original_fps)
|
||||
except Exception as e:
|
||||
logger.warning("插帧还原失败,使用 %.1f fps 结果: %s", inference_fps, e)
|
||||
final_video = silent_video_path
|
||||
logger.info("输入视频 %.1f fps,降帧至 %.1f fps 推理后直接输出(不做插帧还原)", original_fps, inference_fps)
|
||||
|
||||
shutil.copy2(str(final_video), str(output_path))
|
||||
_mux_video_with_audio(final_video, audio_path, output_path)
|
||||
|
||||
try:
|
||||
torch.cuda.empty_cache()
|
||||
|
||||
@@ -18,6 +18,10 @@ def build_engine(
|
||||
pool_timeout: int = 30,
|
||||
pool_recycle: int = 3600,
|
||||
):
|
||||
# SQLite 不支持 QueuePool 的 pool_size/max_overflow/pool_timeout,
|
||||
# 传了会在 create_engine 阶段直接 TypeError,这里只对非 SQLite 传连接池参数。
|
||||
if _is_sqlite(database_url):
|
||||
return create_engine(database_url, pool_recycle=pool_recycle)
|
||||
return create_engine(
|
||||
database_url,
|
||||
pool_size=pool_size,
|
||||
|
||||
@@ -68,7 +68,9 @@ def test_register_payload_includes_task_id_only_when_provided(worker, monkeypatc
|
||||
|
||||
class _Resp:
|
||||
status_code = 200
|
||||
text = ""
|
||||
|
||||
def json(self):
|
||||
return {"worker_id": captured[-1]["worker_id"], "cancel_task": False}
|
||||
|
||||
def _fake_post(url, json=None, headers=None, timeout=None):
|
||||
captured.append(json)
|
||||
@@ -77,7 +79,9 @@ def test_register_payload_includes_task_id_only_when_provided(worker, monkeypatc
|
||||
monkeypatch.setattr(worker.requests, "post", _fake_post)
|
||||
monkeypatch.setattr(worker, "_check_musetalk_health", lambda: (True, {}))
|
||||
|
||||
assert worker._register("task-abc") is True
|
||||
_ok, _cancel = worker._register("task-abc")
|
||||
assert _ok is True
|
||||
assert _cancel is False
|
||||
assert captured[-1]["task_id"] == "task-abc"
|
||||
assert captured[-1]["worker_id"]
|
||||
|
||||
@@ -93,7 +97,7 @@ def test_task_heartbeat_thread_sends_and_stops(worker, monkeypatch):
|
||||
|
||||
def _fake_register(task_id=None):
|
||||
calls.append(task_id)
|
||||
return True
|
||||
return True, False
|
||||
|
||||
monkeypatch.setattr(worker, "_register", _fake_register)
|
||||
hb = worker.TaskHeartbeat("task-hb1", interval=5)
|
||||
@@ -105,6 +109,50 @@ def test_task_heartbeat_thread_sends_and_stops(worker, monkeypatch):
|
||||
assert calls and all(c == "task-hb1" for c in calls)
|
||||
|
||||
|
||||
def test_task_heartbeat_cancel_calls_musetalk_cancel(worker, monkeypatch):
|
||||
"""心跳响应 cancel_task=True → 调 _cancel_musetalk 并设置 cancelled 标志。"""
|
||||
cancel_calls = []
|
||||
|
||||
monkeypatch.setattr(worker, "_register", lambda *a, **k: (True, True))
|
||||
monkeypatch.setattr(worker, "_cancel_musetalk", lambda: cancel_calls.append(1))
|
||||
|
||||
hb = worker.TaskHeartbeat("task-cancel-1", interval=5)
|
||||
hb.start()
|
||||
hb.join(timeout=2) # 检测到取消后线程自行 return
|
||||
assert not hb.is_alive()
|
||||
assert hb.cancelled is True
|
||||
assert cancel_calls == [1]
|
||||
|
||||
|
||||
def test_handle_task_reports_cancelled_after_musetalk_abort(worker, monkeypatch):
|
||||
"""推理被 /cancel 终止后,hb.cancelled=True → 上报失败而非重试。"""
|
||||
reports = []
|
||||
|
||||
monkeypatch.setattr(worker, "_register", lambda *a, **k: (True, False))
|
||||
monkeypatch.setattr(worker, "_download", lambda url, path: True)
|
||||
monkeypatch.setattr(worker, "_probe_duration", lambda path: 12.0)
|
||||
# 模拟推理被终止(/inference 返回错误)
|
||||
monkeypatch.setattr(worker, "_call_musetalk", lambda v, a, o: (False, 0.0, "推理被取消", False))
|
||||
monkeypatch.setattr(
|
||||
worker,
|
||||
"_report_result",
|
||||
lambda task_id, success, duration=0.0, error_msg="": reports.append(error_msg) or True,
|
||||
)
|
||||
|
||||
# 让 TaskHeartbeat 在主线程检查时报告已取消
|
||||
orig_hb_init = worker.TaskHeartbeat
|
||||
|
||||
def _hb(task_id, interval):
|
||||
h = orig_hb_init(task_id, interval)
|
||||
h.cancelled = True
|
||||
return h
|
||||
|
||||
monkeypatch.setattr(worker, "TaskHeartbeat", _hb)
|
||||
|
||||
worker._handle_task({"task_id": "t-canceled", "video_url": "u", "audio_url": "u"})
|
||||
assert reports == ["用户取消任务"]
|
||||
|
||||
|
||||
# ── 短视频前置拦截 ─────────────────────────────────────────────────
|
||||
|
||||
|
||||
@@ -115,7 +163,7 @@ def test_handle_task_short_video_reports_failed_without_inference(worker, monkey
|
||||
audio.write_bytes(b"fake-audio")
|
||||
reports = []
|
||||
|
||||
monkeypatch.setattr(worker, "_register", lambda *a, **k: True)
|
||||
monkeypatch.setattr(worker, "_register", lambda *a, **k: (True, False))
|
||||
monkeypatch.setattr(worker, "_download", lambda url, path: True)
|
||||
# ffprobe 读出 1.2s → 低于 3s 阈值
|
||||
monkeypatch.setattr(worker, "_probe_duration", lambda path: 1.2)
|
||||
@@ -148,7 +196,7 @@ def test_handle_task_short_video_reports_failed_without_inference(worker, monkey
|
||||
def test_handle_task_probe_failure_does_not_block(worker, monkeypatch):
|
||||
"""ffprobe 不可用(duration=0.0)时不能误杀,应继续推理."""
|
||||
reports = []
|
||||
monkeypatch.setattr(worker, "_register", lambda *a, **k: True)
|
||||
monkeypatch.setattr(worker, "_register", lambda *a, **k: (True, False))
|
||||
monkeypatch.setattr(worker, "_download", lambda url, path: True)
|
||||
monkeypatch.setattr(worker, "_probe_duration", lambda path: 0.0)
|
||||
monkeypatch.setattr(
|
||||
@@ -214,7 +262,7 @@ def test_handle_task_retries_once_for_transient_then_succeeds(worker, monkeypatc
|
||||
return False, 0.0, "MuseTalk HTTP 503: busy", True
|
||||
return True, 6.5, "", False
|
||||
|
||||
monkeypatch.setattr(worker, "_register", lambda *a, **k: True)
|
||||
monkeypatch.setattr(worker, "_register", lambda *a, **k: (True, False))
|
||||
monkeypatch.setattr(worker, "_download", lambda url, path: True)
|
||||
monkeypatch.setattr(worker, "_probe_duration", lambda path: 12.0)
|
||||
monkeypatch.setattr(worker, "_call_musetalk", _fake_call)
|
||||
@@ -239,7 +287,7 @@ def test_handle_task_no_retry_for_deterministic_failure(worker, monkeypatch):
|
||||
return False, 0.0, "MuseTalk HTTP 400: bad input", False
|
||||
|
||||
reports = []
|
||||
monkeypatch.setattr(worker, "_register", lambda *a, **k: True)
|
||||
monkeypatch.setattr(worker, "_register", lambda *a, **k: (True, False))
|
||||
monkeypatch.setattr(worker, "_download", lambda url, path: True)
|
||||
monkeypatch.setattr(worker, "_probe_duration", lambda path: 12.0)
|
||||
monkeypatch.setattr(worker, "_call_musetalk", _fake_call)
|
||||
|
||||
@@ -0,0 +1,89 @@
|
||||
"""GPU Worker 路由单测 — #2009 取消链路.
|
||||
|
||||
直接调用路由函数(不经 HTTP 栈),显式注入 svc / _token 以跳过 Depends。
|
||||
CI 增量映射: gpu_lipsync.py (route) → test_gpu_lipsync_routes.py
|
||||
"""
|
||||
|
||||
from __future__ import annotations
|
||||
|
||||
import json
|
||||
from unittest.mock import MagicMock, patch
|
||||
|
||||
import pytest
|
||||
|
||||
|
||||
def _payload(**overrides):
|
||||
from app.schemas.gpu_lipsync import GpuWorkerRegisterRequest
|
||||
|
||||
data = {
|
||||
"worker_id": "w-1",
|
||||
"hostname": "gpu-host",
|
||||
"gpu_name": "RTX3060",
|
||||
"free_vram_mb": 10000,
|
||||
"capabilities": json.dumps({"musetalk": True}),
|
||||
}
|
||||
data.update(overrides)
|
||||
return GpuWorkerRegisterRequest(**data)
|
||||
|
||||
|
||||
def test_register_returns_cancel_task_true_when_cancelled():
|
||||
"""心跳接口在任务已取消时必须把 cancel_task=True 透传给 Worker."""
|
||||
fake_worker = MagicMock()
|
||||
fake_worker.worker_id = "w-1"
|
||||
fake_worker.hostname = "gpu-host"
|
||||
fake_worker.gpu_name = "RTX3060"
|
||||
fake_worker.free_vram_mb = 10000
|
||||
fake_worker.capabilities = "musetalk"
|
||||
fake_svc = MagicMock()
|
||||
fake_svc.register_worker.return_value = (fake_worker, True)
|
||||
|
||||
from app.api.routes.gpu_lipsync import register_worker as route
|
||||
|
||||
resp = route(_payload(task_id="task-cancelled"), svc=fake_svc, _token="t")
|
||||
|
||||
assert resp.cancel_task is True
|
||||
assert resp.ok is True
|
||||
fake_svc.register_worker.assert_called_once()
|
||||
kwargs = fake_svc.register_worker.call_args.kwargs
|
||||
assert kwargs["task_id"] == "task-cancelled"
|
||||
|
||||
|
||||
def test_register_returns_cancel_task_false_normal():
|
||||
"""正常心跳 cancel_task=False."""
|
||||
fake_worker = MagicMock()
|
||||
fake_worker.worker_id = "w-1"
|
||||
fake_worker.hostname = "gpu-host"
|
||||
fake_worker.gpu_name = "RTX3060"
|
||||
fake_worker.free_vram_mb = 10000
|
||||
fake_worker.capabilities = "musetalk"
|
||||
fake_svc = MagicMock()
|
||||
fake_svc.register_worker.return_value = (fake_worker, False)
|
||||
|
||||
from app.api.routes.gpu_lipsync import register_worker as route
|
||||
|
||||
resp = route(_payload(), svc=fake_svc, _token="t")
|
||||
|
||||
assert resp.cancel_task is False
|
||||
|
||||
|
||||
def test_cancel_route_accepts_processing_status():
|
||||
"""cancel 路由允许 processing 状态(GPU 推理中),不再 400。"""
|
||||
fake_job = MagicMock()
|
||||
fake_job.status = "cancelled"
|
||||
|
||||
svc = MagicMock()
|
||||
svc.cancel_job.return_value = fake_job
|
||||
|
||||
current_user = MagicMock()
|
||||
current_user.user.id = "u1"
|
||||
|
||||
from app.api.routes.lipsync import cancel_lipsync_job as route
|
||||
|
||||
result = route("job-1", current_user, svc)
|
||||
|
||||
svc.cancel_job.assert_called_once_with("job-1", "u1")
|
||||
assert result.status == "cancelled"
|
||||
|
||||
|
||||
if __name__ == "__main__":
|
||||
pytest.main([__file__, "-q"])
|
||||
@@ -173,10 +173,10 @@ def test_timed_out_task_is_redispatched(svc):
|
||||
|
||||
|
||||
def test_register_worker_creates_then_updates(svc):
|
||||
w = svc.register_worker("w-1", hostname="pc1", gpu_name="RTX2060", free_vram_mb=3500)
|
||||
w, _cancel = svc.register_worker("w-1", hostname="pc1", gpu_name="RTX2060", free_vram_mb=3500)
|
||||
assert w.worker_id == "w-1"
|
||||
assert w.gpu_name == "RTX2060"
|
||||
w2 = svc.register_worker("w-1", hostname="pc1", gpu_name="RTX2060", free_vram_mb=2000)
|
||||
w2, _cancel2 = svc.register_worker("w-1", hostname="pc1", gpu_name="RTX2060", free_vram_mb=2000)
|
||||
assert w2.free_vram_mb == 2000 # 更新
|
||||
assert w2.created_at == w.created_at # 没新建
|
||||
|
||||
@@ -195,7 +195,7 @@ def test_register_with_task_id_refreshes_task_heartbeat(svc):
|
||||
{"last_heartbeat_at": old_hb - timedelta(seconds=300)}
|
||||
)
|
||||
svc.db.commit()
|
||||
svc.register_worker("w-1", task_id=t.id)
|
||||
_w, _c = svc.register_worker("w-1", task_id=t.id)
|
||||
svc.db.refresh(t)
|
||||
assert t.last_heartbeat_at > old_hb
|
||||
assert t.status == "processing" # 心跳不改变状态
|
||||
@@ -213,7 +213,7 @@ def test_register_task_heartbeat_ignores_finished_or_foreign_task(svc):
|
||||
svc.poll_task("w-1")
|
||||
done = svc.report_result(t.id, "w-1", success=True, duration_seconds=10.0)
|
||||
hb_when_done = done.last_heartbeat_at
|
||||
svc.register_worker("w-1", task_id=t.id)
|
||||
_w, _c = svc.register_worker("w-1", task_id=t.id)
|
||||
svc.db.refresh(t)
|
||||
assert t.status == "done"
|
||||
assert t.last_heartbeat_at == hb_when_done # 没被改写
|
||||
@@ -232,17 +232,61 @@ def test_register_task_heartbeat_ignores_finished_or_foreign_task(svc):
|
||||
{"last_heartbeat_at": owner_hb - timedelta(seconds=600)}
|
||||
)
|
||||
svc.db.commit()
|
||||
svc.register_worker("w-1", task_id=t2.id) # 旧 worker 迟到心跳
|
||||
_w2, _c2 = svc.register_worker("w-1", task_id=t2.id) # 旧 worker 迟到心跳
|
||||
svc.db.refresh(t2)
|
||||
assert t2.worker_id == "w-2"
|
||||
assert t2.status == "processing"
|
||||
assert t2.last_heartbeat_at == owner_hb
|
||||
|
||||
# 场景 3:不存在的 task_id 不报错
|
||||
svc.register_worker("w-1", task_id="nonexistent-id")
|
||||
_wn, _cn = svc.register_worker("w-1", task_id="nonexistent-id")
|
||||
assert svc.db.get(GpuLipsyncTaskModel, "nonexistent-id") is None
|
||||
|
||||
|
||||
def test_register_task_heartbeat_detects_cancelled(svc):
|
||||
"""取消链路:任务已 cancelled 时,register 心跳必须返回 cancel_task=True."""
|
||||
t = svc.create_task(video_url="v", audio_url="a")
|
||||
svc.poll_task("w-1")
|
||||
svc.db.refresh(t)
|
||||
# 用户取消:直接把任务置为 cancelled
|
||||
t.status = "cancelled"
|
||||
t.finished_at = datetime.now(UTC)
|
||||
svc.db.commit()
|
||||
|
||||
_w, cancel_task = svc.register_worker("w-1", task_id=t.id)
|
||||
assert cancel_task is True
|
||||
svc.db.refresh(t)
|
||||
assert t.status == "cancelled" # 心跳不改写已取消状态
|
||||
|
||||
|
||||
def test_report_result_cancelled_stays_cancelled(svc):
|
||||
"""Worker 终止取消任务后上报失败,report_result 必须保持 cancelled 不回退 pending."""
|
||||
t = svc.create_task(video_url="v", audio_url="a")
|
||||
svc.poll_task("w-1")
|
||||
svc.db.refresh(t)
|
||||
t.status = "cancelled"
|
||||
svc.db.commit()
|
||||
|
||||
result = svc.report_result(t.id, "w-1", success=False, error_msg="推理被终止")
|
||||
assert result.status == "cancelled"
|
||||
assert result.finished_at is not None
|
||||
assert "推理被终止" in (result.error_msg or "")
|
||||
|
||||
|
||||
def test_wait_for_result_returns_when_cancelled(svc):
|
||||
"""wait_for_result 将 cancelled 视为终态,立即返回,Celery 不回退 MediaKit."""
|
||||
t = svc.create_task(video_url="v", audio_url="a")
|
||||
svc.poll_task("w-1")
|
||||
svc.db.refresh(t)
|
||||
t.status = "cancelled"
|
||||
t.finished_at = datetime.now(UTC)
|
||||
svc.db.commit()
|
||||
|
||||
result = svc.wait_for_result(t.id, timeout_seconds=5, poll_interval=0.1)
|
||||
assert result is not None
|
||||
assert result.status == "cancelled"
|
||||
|
||||
|
||||
def test_default_gpu_task_timeout_is_900(svc):
|
||||
"""#1970 默认超时 300→900,覆盖 RTX2060 长视频推理."""
|
||||
assert svc.settings.gpu_task_timeout_seconds == 900
|
||||
|
||||
@@ -248,3 +248,41 @@ class TestSignMediaUrl:
|
||||
with patch.object(task_mod, "get_shared_storage_service", side_effect=RuntimeError("x")):
|
||||
url = "https://own-bucket.oss-cn-beijing.aliyuncs.com/a.wav"
|
||||
assert task_mod._sign_media_url(url) == url
|
||||
|
||||
|
||||
def test_cancelled_gpu_task_does_not_fallback_mediakit(monkeypatch):
|
||||
"""GPU 任务被用户取消 → Celery 任务直接标记 cancelled,不回退 MediaKit。"""
|
||||
job = MagicMock()
|
||||
job.id = "job-1"
|
||||
job.status = "processing"
|
||||
job.mediakit_task_id = "gpu:gpu-task-1"
|
||||
|
||||
gpu_task = MagicMock()
|
||||
gpu_task.status = "cancelled"
|
||||
gpu_task.error_msg = "用户取消"
|
||||
|
||||
fake_gpu_svc = MagicMock()
|
||||
fake_gpu_svc.wait_for_result.return_value = gpu_task
|
||||
gpu_service_cls = MagicMock(return_value=fake_gpu_svc)
|
||||
|
||||
fake_db = MagicMock()
|
||||
fake_db.query.return_value.filter_by.return_value.first.return_value = job
|
||||
|
||||
# 直接替换 sys.modules 里的 gpu_lipsync_service 模块(全量跑时它可能已被
|
||||
# 其他测试换成 MagicMock),保证任务函数内 from...import 一定拿到我们的类;
|
||||
# 并替换 _get_db_session 绕开 worker_app / app.db 两条 import 分支。
|
||||
import sys
|
||||
from types import SimpleNamespace
|
||||
|
||||
fake_mod = SimpleNamespace(GpuLipsyncService=gpu_service_cls)
|
||||
monkeypatch.setitem(sys.modules, "app.services.gpu_lipsync_service", fake_mod)
|
||||
monkeypatch.setattr(task_mod, "_get_db_session", lambda: fake_db)
|
||||
monkeypatch.setattr(task_mod, "logger", MagicMock())
|
||||
|
||||
task_mod.lipsync_gpu_process_async.run("job-1", "u1", "gpu-task-1")
|
||||
|
||||
assert job.status == "cancelled"
|
||||
assert not str(job.mediakit_task_id).startswith("mk-")
|
||||
fake_db.commit.assert_called()
|
||||
fake_gpu_svc.wait_for_result.assert_called_once()
|
||||
gpu_service_cls.assert_called_once_with(fake_db)
|
||||
|
||||
@@ -323,3 +323,126 @@ class TestGpuServiceHelpers:
|
||||
svc = GpuLipsyncService(db=fake_db)
|
||||
fake_db.query.return_value.filter.return_value.first.return_value = None
|
||||
assert svc.has_available_worker() is False
|
||||
|
||||
|
||||
# ── cancel_job 取消链路 (#2009) ─────────────────────────────────────
|
||||
|
||||
|
||||
def _build_sqlite_session():
|
||||
from sqlalchemy import create_engine
|
||||
from sqlalchemy.orm import sessionmaker
|
||||
|
||||
from packages.adapters.sqlalchemy_impl import models as _ # noqa: F401
|
||||
from packages.adapters.sqlalchemy_impl.models import Base
|
||||
|
||||
engine = create_engine("sqlite:///:memory:", future=True)
|
||||
Base.metadata.create_all(engine)
|
||||
Session = sessionmaker(bind=engine, future=True)
|
||||
return Session()
|
||||
|
||||
|
||||
def _make_real_job(db, *, status="processing", mediakit_task_id="gpu:gpu-task-1"):
|
||||
import uuid
|
||||
|
||||
from packages.adapters.sqlalchemy_impl.models import LipsyncJobModel
|
||||
|
||||
job = LipsyncJobModel(
|
||||
id=str(uuid.uuid4()),
|
||||
user_id="u1",
|
||||
project_id="p1",
|
||||
video_url="videos/v.mp4",
|
||||
audio_url="audios/a.wav",
|
||||
enable_video_loop=True,
|
||||
mediakit_task_id=mediakit_task_id,
|
||||
status=status,
|
||||
)
|
||||
db.add(job)
|
||||
db.commit()
|
||||
return job
|
||||
|
||||
|
||||
def test_cancel_processing_gpu_job_marks_gpu_task_cancelled():
|
||||
"""processing 的 GPU job 取消时,关联 GpuLipsyncTask 必须同步置 cancelled."""
|
||||
import uuid
|
||||
|
||||
from packages.adapters.sqlalchemy_impl.models import GpuLipsyncTaskModel
|
||||
|
||||
db = _build_sqlite_session()
|
||||
gpu_task_id = str(uuid.uuid4())
|
||||
gpu_task = GpuLipsyncTaskModel(
|
||||
id=gpu_task_id,
|
||||
video_url="v",
|
||||
audio_url="a",
|
||||
status="processing",
|
||||
worker_id="w-1",
|
||||
attempt=1,
|
||||
)
|
||||
db.add(gpu_task)
|
||||
db.commit()
|
||||
|
||||
job = _make_real_job(db, mediakit_task_id=f"gpu:{gpu_task_id}")
|
||||
from app.services.lipsync_service import LipsyncService
|
||||
|
||||
svc = LipsyncService(db=db, client=MagicMock())
|
||||
result = svc.cancel_job(job.id, "u1")
|
||||
|
||||
assert result.status == "cancelled"
|
||||
db.refresh(gpu_task)
|
||||
assert gpu_task.status == "cancelled"
|
||||
assert gpu_task.error_msg == "用户取消"
|
||||
assert gpu_task.finished_at is not None
|
||||
|
||||
|
||||
def test_cancel_processing_gpu_job_skips_non_processing_gpu_task():
|
||||
"""GPU task 已不在 processing(如已 done)时,取消 job 不应改它,也不报错."""
|
||||
import uuid
|
||||
|
||||
from packages.adapters.sqlalchemy_impl.models import GpuLipsyncTaskModel
|
||||
|
||||
db = _build_sqlite_session()
|
||||
gpu_task_id = str(uuid.uuid4())
|
||||
gpu_task = GpuLipsyncTaskModel(
|
||||
id=gpu_task_id, video_url="v", audio_url="a", status="done", worker_id="w-1", attempt=1
|
||||
)
|
||||
db.add(gpu_task)
|
||||
db.commit()
|
||||
|
||||
job = _make_real_job(db, mediakit_task_id=f"gpu:{gpu_task_id}")
|
||||
from app.services.lipsync_service import LipsyncService
|
||||
|
||||
svc = LipsyncService(db=db, client=MagicMock())
|
||||
result = svc.cancel_job(job.id, "u1")
|
||||
|
||||
assert result.status == "cancelled"
|
||||
db.refresh(gpu_task)
|
||||
assert gpu_task.status == "done" # 没被动
|
||||
|
||||
|
||||
def test_cancel_processing_non_gpu_job_does_not_touch_gpu_table():
|
||||
"""mediakit_task_id 不是 gpu: 前缀(普通 MediaKit 任务)时,不查 GPU task."""
|
||||
db = _build_sqlite_session()
|
||||
job = _make_real_job(db, mediakit_task_id="mk-task-99")
|
||||
from app.services.lipsync_service import LipsyncService
|
||||
|
||||
svc = LipsyncService(db=db, client=MagicMock())
|
||||
result = svc.cancel_job(job.id, "u1")
|
||||
assert result.status == "cancelled"
|
||||
|
||||
|
||||
def test_cancel_completed_job_unchanged():
|
||||
"""completed 状态不可取消,cancel_job 原样返回."""
|
||||
db = _build_sqlite_session()
|
||||
job = _make_real_job(db, status="completed", mediakit_task_id="gpu:x")
|
||||
from app.services.lipsync_service import LipsyncService
|
||||
|
||||
svc = LipsyncService(db=db, client=MagicMock())
|
||||
result = svc.cancel_job(job.id, "u1")
|
||||
assert result.status == "completed"
|
||||
|
||||
|
||||
def test_cancel_job_not_found_returns_none():
|
||||
db = _build_sqlite_session()
|
||||
from app.services.lipsync_service import LipsyncService
|
||||
|
||||
svc = LipsyncService(db=db, client=MagicMock())
|
||||
assert svc.cancel_job("nonexistent", "u1") is None
|
||||
|
||||
Reference in New Issue
Block a user