apps/web/src/components/cover/useSharedCover.ts

@@ -77,7 +77,14 @@ export function useSharedCover(opts: UseSharedCoverOptions): UseSharedCoverRetur
     setTemplatesError(null)
     try {
       const res = await fetchCoverTemplates()
-      setTemplates(res.items || [])
+      // 兼容两种响应：{items:[...]} 或直接数组
+      const rawList = (res as unknown as { items?: CoverTemplate[] }).items ?? []
+      // 确保每个模板都有 config 字段（避免编辑器打开时访问 cfg.title.text 崩溃）
+      const list: CoverTemplate[] = rawList.map((t) => ({
+        ...t,
+        config: t.config,
+      }))
+      setTemplates(list)
     } catch (err) {
       console.error("[SharedCover] 加载封面模板失败:", err)
       setTemplatesError("加载模板失败，请稍后重试")

apps/web/src/pages/generate/components/cover-settings/CoverEditorModal.tsx

@@ -12,6 +12,31 @@ import Modal from "@/components/ui/Modal"
 import Button from "@/components/ui/Button"
 import "@/components/cover/cover.css"
 
+/** 安全合并模板 config 与默认配置（深拷贝 title/subtitle/shadows/background 等嵌套对象，避免共享引用 & 字段缺失） */
+const mergeEditorConfig = (partial?: Partial<CoverEditorConfig> | null): CoverEditorConfig => {
+  const def = DEFAULT_EDITOR_CONFIG
+  const src = partial || {}
+  const mergeText = (
+    base: TextStyleConfig,
+    patch?: Partial<TextStyleConfig> | null,
+  ): TextStyleConfig => ({
+    ...base,
+    ...(patch || {}),
+    position: { ...base.position, ...(patch?.position || {}) },
+    background: { ...base.background, ...(patch?.background || {}) },
+    shadows: Array.isArray(patch?.shadows) ? [...patch!.shadows] : [...base.shadows],
+  })
+  return {
+    ...def,
+    ...src,
+    title: mergeText(def.title, src.title),
+    subtitle: mergeText(def.subtitle, src.subtitle),
+    portraitPosition: { ...def.portraitPosition, ...(src.portraitPosition || {}) },
+    backgroundPosition: { ...def.backgroundPosition, ...(src.backgroundPosition || {}) },
+    maskPosition: { ...def.maskPosition, ...(src.maskPosition || {}) },
+  }
+}
+
 /* ── Props ── */
 interface CoverEditorModalProps {
   open: boolean
@@ -98,10 +123,11 @@ const getFontFamily = (name: string): string => {
 
 /* ── Text style panel (shared between title & subtitle) ── */
 const TextStylePanel: React.FC<{
-  config: TextStyleConfig
+  config: TextStyleConfig | undefined | null
   onChange: (c: TextStyleConfig) => void
   placeholder: string
 }> = ({ config, onChange, placeholder }) => {
+  if (!config) return null
   const upd = <K extends keyof TextStyleConfig>(key: K, val: TextStyleConfig[K]) =>
     onChange({ ...config, [key]: val })
   return (
@@ -274,9 +300,9 @@ const TextStylePanel: React.FC<{
 
 /* ══════════════ Main Component ══════════════ */
 const CoverEditorModal: React.FC<CoverEditorModalProps> = ({ open, onClose, template, onSave }) => {
-  const initCfg = template?.config ?? DEFAULT_EDITOR_CONFIG
+  const initCfg = mergeEditorConfig(template?.config)
   const [name, setName] = useState(template?.name ?? "")
-  const [cfg, setCfg] = useState<CoverEditorConfig>(() => ({ ...initCfg }))
+  const [cfg, setCfg] = useState<CoverEditorConfig>(() => mergeEditorConfig(template?.config))
   const [sections, setSections] = useState<Record<SectionKey, boolean>>({
     basic: true,
     portrait: false,
@@ -294,8 +320,8 @@ const CoverEditorModal: React.FC<CoverEditorModalProps> = ({ open, onClose, temp
   // reset state when modal opens with a new template
   useEffect(() => {
     if (open) {
-      const c = template?.config ?? DEFAULT_EDITOR_CONFIG
-      setCfg({ ...c })
+      const c = mergeEditorConfig(template?.config)
+      setCfg(c)
       setName(template?.name ?? "")
       setBgImageUrl(c.backgroundImage || "")
       setPortraitImageUrl(c.portraitImage || "")
@@ -366,7 +392,8 @@ const CoverEditorModal: React.FC<CoverEditorModalProps> = ({ open, onClose, temp
 
   const s = (px: number) => Math.round(px * SCALE * 100) / 100
 
-  const renderTextStyle = (tc: TextStyleConfig): React.CSSProperties => {
+  const renderTextStyle = (tc: TextStyleConfig | undefined | null): React.CSSProperties => {
+    if (!tc) return {}
     // wrap text by charsPerLine
     const rawText = tc.text || ""
     const lines: string[] = []
@@ -407,7 +434,8 @@ const CoverEditorModal: React.FC<CoverEditorModalProps> = ({ open, onClose, temp
     return style
   }
 
-  const renderTextLines = (tc: TextStyleConfig) => {
+  const renderTextLines = (tc: TextStyleConfig | undefined | null): string => {
+    if (!tc) return ""
     const raw = tc.text || ""
     if (tc.direction === "vertical") return raw
     const per = Math.max(1, tc.charsPerLine)
@@ -608,7 +636,7 @@ const CoverEditorModal: React.FC<CoverEditorModalProps> = ({ open, onClose, temp
             {sections.title && (
               <div className="xx-ce-section-body">
                 <TextStylePanel
-                  config={cfg.title}
+                  config={cfg.title || DEFAULT_EDITOR_CONFIG.title}
                   onChange={updTitle}
                   placeholder="输入主标题文字"
                 />
@@ -625,7 +653,7 @@ const CoverEditorModal: React.FC<CoverEditorModalProps> = ({ open, onClose, temp
             {sections.subtitle && (
               <div className="xx-ce-section-body">
                 <TextStylePanel
-                  config={cfg.subtitle}
+                  config={cfg.subtitle || DEFAULT_EDITOR_CONFIG.subtitle}
                   onChange={updSubtitle}
                   placeholder="输入副标题文字"
                 />
@@ -887,10 +915,14 @@ const CoverEditorModal: React.FC<CoverEditorModalProps> = ({ open, onClose, temp
               )}
 
               {/* Title */}
-              <div style={renderTextStyle(cfg.title)}>{renderTextLines(cfg.title)}</div>
+              {cfg.title && (
+                <div style={renderTextStyle(cfg.title)}>{renderTextLines(cfg.title)}</div>
+              )}
 
               {/* Subtitle */}
-              <div style={renderTextStyle(cfg.subtitle)}>{renderTextLines(cfg.subtitle)}</div>
+              {cfg.subtitle && (
+                <div style={renderTextStyle(cfg.subtitle)}>{renderTextLines(cfg.subtitle)}</div>
+              )}
 
               {/* Mask overlay */}
               {cfg.maskEnabled && (