perf(ci): parallel image builds + pip cache

.gitea/workflows/ci-cd.yml

@@ -84,6 +84,13 @@ jobs:
           python3 -m pip --version
           echo "CI environment is ready"
 
+      - name: Cache pip dependencies
+        uses: actions/cache@v3
+        with:
+          path: ~/.cache/pip
+          key: pip-${{ runner.os }}-${{ hashFiles('requirements-base.txt', 'requirements.txt', 'requirements-dev.txt') }}
+          restore-keys: |
+            pip-${{ runner.os }}-
       - name: Install dependencies
         shell: sh
         run: |
@@ -213,6 +220,13 @@ jobs:
                       tar.extract(member, '.')
           PY
 
+      - name: Cache pip dependencies
+        uses: actions/cache@v3
+        with:
+          path: ~/.cache/pip
+          key: pip-${{ runner.os }}-${{ hashFiles('requirements-base.txt', 'requirements.txt', 'requirements-dev.txt') }}
+          restore-keys: |
+            pip-${{ runner.os }}-
       - name: Install dependencies
         shell: sh
         run: |
@@ -312,6 +326,13 @@ jobs:
           python3 -m pip --version
           echo "CI environment is ready"
 
+      - name: Cache pip dependencies
+        uses: actions/cache@v3
+        with:
+          path: ~/.cache/pip
+          key: pip-${{ runner.os }}-${{ hashFiles('requirements-base.txt', 'requirements.txt', 'requirements-dev.txt') }}
+          restore-keys: |
+            pip-${{ runner.os }}-
       - name: Install dependencies
         shell: sh
         run: |
@@ -587,14 +608,17 @@ jobs:
           echo "=== CI 失败通知 ==="
           FAILED_JOB="Frontend Lint" python3 scripts/ci_notify_failure.py
 
-  deploy-staging:
-    name: Build & Push Staging (Watchtower auto-deploy)
+  build-staging-api:
+    name: Build Staging API Image
     runs-on: saas
-    timeout-minutes: 30
+    timeout-minutes: 25
     needs: [validate, frontend-lint]
 
     if: github.event_name == 'push' && (github.ref_name == 'main' || github.ref_name == 'develop')
 
+    env:
+      BUILD_ONLY: api
+
     steps:
     - name: Checkout code
       shell: sh
@@ -641,16 +665,195 @@ jobs:
                     tar.extract(member, '.')
         INNERPY
 
-    - name: Build and push all images to Gitea Registry
+
+    - name: Build and push api image
       shell: sh
       env:
-        REGISTRY_TOKEN: ${{ secrets.REGISTRY_TOKEN }}
+        REGISTRY_TOKEN: ${ secrets.REGISTRY_TOKEN }
+        ALLOW_SHARED_PRODUCTION_BUILD_HOST: "true"
       run: |
         set -eu
         chmod +x scripts/build_release_images.sh
-        ALLOW_SHARED_PRODUCTION_BUILD_HOST=true REGISTRY_TOKEN="${REGISTRY_TOKEN}" \
+        BUILD_ONLY="${BUILD_ONLY}" \
+          ALLOW_SHARED_PRODUCTION_BUILD_HOST=true \
+          REGISTRY_TOKEN="${REGISTRY_TOKEN}" \
           scripts/build_release_images.sh "${GITHUB_SHA}" staging
 
+    - name: Notify CI failure
+      if: failure()
+      shell: sh
+      run: |
+        set +e
+        echo "=== CI 失败通知 ==="
+        FAILED_JOB="Build Staging API Image" python3 scripts/ci_notify_failure.py
+
+  build-staging-worker:
+    name: Build Staging Worker Image
+    runs-on: saas
+    timeout-minutes: 25
+    needs: [validate, frontend-lint]
+
+    if: github.event_name == 'push' && (github.ref_name == 'main' || github.ref_name == 'develop')
+
+    env:
+      BUILD_ONLY: worker
+
+    steps:
+    - name: Checkout code
+      shell: sh
+      env:
+        GITHUB_TOKEN: ${{ github.token }}
+      run: |
+        set -eu
+        python3 - <<'INNERPY'
+        import io, os, tarfile, time, urllib.request, urllib.error
+        url = f"{os.environ['GITHUB_API_URL']}/repos/{os.environ['GITHUB_REPOSITORY']}/archive/{os.environ['GITHUB_SHA']}.tar.gz"
+        request = urllib.request.Request(url, headers={"Authorization": f"token {os.environ['GITHUB_TOKEN']}"})
+        last_err = None
+        for attempt in range(5):
+            try:
+                with urllib.request.urlopen(request, timeout=120) as response:
+                    archive = response.read()
+                break
+            except urllib.error.HTTPError as e:
+                last_err = e
+                if e.code >= 500 and attempt < 4:
+                    wait = 2 ** attempt
+                    print(f"Checkout HTTP {e.code}, retrying in {wait}s (attempt {attempt+1}/5)...")
+                    time.sleep(wait)
+                    continue
+                raise
+            except Exception as e:
+                last_err = e
+                if attempt < 4:
+                    wait = 2 ** attempt
+                    print(f"Checkout error: {e}, retrying in {wait}s (attempt {attempt+1}/5)...")
+                    time.sleep(wait)
+                    continue
+        else:
+            raise last_err
+        with tarfile.open(fileobj=io.BytesIO(archive), mode='r:gz') as tar:
+            root_prefix = tar.getmembers()[0].name.split('/', 1)[0] + '/'
+            for member in tar.getmembers():
+                name = member.name
+                if name == root_prefix[:-1]:
+                    continue
+                if name.startswith(root_prefix):
+                    member.name = name[len(root_prefix):]
+                if member.name:
+                    tar.extract(member, '.')
+        INNERPY
+
+
+    - name: Build and push worker image
+      shell: sh
+      env:
+        REGISTRY_TOKEN: ${ secrets.REGISTRY_TOKEN }
+        ALLOW_SHARED_PRODUCTION_BUILD_HOST: "true"
+      run: |
+        set -eu
+        chmod +x scripts/build_release_images.sh
+        BUILD_ONLY="${BUILD_ONLY}" \
+          ALLOW_SHARED_PRODUCTION_BUILD_HOST=true \
+          REGISTRY_TOKEN="${REGISTRY_TOKEN}" \
+          scripts/build_release_images.sh "${GITHUB_SHA}" staging
+
+    - name: Notify CI failure
+      if: failure()
+      shell: sh
+      run: |
+        set +e
+        echo "=== CI 失败通知 ==="
+        FAILED_JOB="Build Staging Worker Image" python3 scripts/ci_notify_failure.py
+
+  build-staging-web:
+    name: Build Staging Web Image
+    runs-on: saas
+    timeout-minutes: 25
+    needs: [validate, frontend-lint]
+
+    if: github.event_name == 'push' && (github.ref_name == 'main' || github.ref_name == 'develop')
+
+    env:
+      BUILD_ONLY: web
+
+    steps:
+    - name: Checkout code
+      shell: sh
+      env:
+        GITHUB_TOKEN: ${{ github.token }}
+      run: |
+        set -eu
+        python3 - <<'INNERPY'
+        import io, os, tarfile, time, urllib.request, urllib.error
+        url = f"{os.environ['GITHUB_API_URL']}/repos/{os.environ['GITHUB_REPOSITORY']}/archive/{os.environ['GITHUB_SHA']}.tar.gz"
+        request = urllib.request.Request(url, headers={"Authorization": f"token {os.environ['GITHUB_TOKEN']}"})
+        last_err = None
+        for attempt in range(5):
+            try:
+                with urllib.request.urlopen(request, timeout=120) as response:
+                    archive = response.read()
+                break
+            except urllib.error.HTTPError as e:
+                last_err = e
+                if e.code >= 500 and attempt < 4:
+                    wait = 2 ** attempt
+                    print(f"Checkout HTTP {e.code}, retrying in {wait}s (attempt {attempt+1}/5)...")
+                    time.sleep(wait)
+                    continue
+                raise
+            except Exception as e:
+                last_err = e
+                if attempt < 4:
+                    wait = 2 ** attempt
+                    print(f"Checkout error: {e}, retrying in {wait}s (attempt {attempt+1}/5)...")
+                    time.sleep(wait)
+                    continue
+        else:
+            raise last_err
+        with tarfile.open(fileobj=io.BytesIO(archive), mode='r:gz') as tar:
+            root_prefix = tar.getmembers()[0].name.split('/', 1)[0] + '/'
+            for member in tar.getmembers():
+                name = member.name
+                if name == root_prefix[:-1]:
+                    continue
+                if name.startswith(root_prefix):
+                    member.name = name[len(root_prefix):]
+                if member.name:
+                    tar.extract(member, '.')
+        INNERPY
+
+
+    - name: Build and push web image
+      shell: sh
+      env:
+        REGISTRY_TOKEN: ${ secrets.REGISTRY_TOKEN }
+        ALLOW_SHARED_PRODUCTION_BUILD_HOST: "true"
+      run: |
+        set -eu
+        chmod +x scripts/build_release_images.sh
+        BUILD_ONLY="${BUILD_ONLY}" \
+          ALLOW_SHARED_PRODUCTION_BUILD_HOST=true \
+          REGISTRY_TOKEN="${REGISTRY_TOKEN}" \
+          scripts/build_release_images.sh "${GITHUB_SHA}" staging
+
+    - name: Notify CI failure
+      if: failure()
+      shell: sh
+      run: |
+        set +e
+        echo "=== CI 失败通知 ==="
+        FAILED_JOB="Build Staging Web Image" python3 scripts/ci_notify_failure.py
+
+  deploy-staging:
+    name: Deploy Staging (Watchtower auto-deploy)
+    runs-on: saas
+    timeout-minutes: 20
+    needs: [build-staging-api, build-staging-worker, build-staging-web]
+
+    if: github.event_name == 'push' && (github.ref_name == 'main' || github.ref_name == 'develop')
+
+    steps:
     - name: Tag and push :staging images (Watchtower auto-update)
       shell: sh
       env:
@@ -662,6 +865,7 @@ jobs:
           printf '%s' "${REGISTRY_TOKEN}" | docker login git.xiaoxiajianji.com -u xiaoxia --password-stdin 2>/dev/null
         fi
         for svc in api worker web; do
+          docker pull "${REGISTRY}/xiaoxia-saas-${svc}:${GITHUB_SHA}"
           docker tag "${REGISTRY}/xiaoxia-saas-${svc}:${GITHUB_SHA}" "${REGISTRY}/xiaoxia-saas-${svc}:staging"
           docker push "${REGISTRY}/xiaoxia-saas-${svc}:staging"
         done
@@ -732,9 +936,7 @@ jobs:
       run: |
         set +e
         echo "=== CI 失败通知 ==="
-        FAILED_JOB="Build & Push Staging (Watchtower auto-deploy)" python3 scripts/ci_notify_failure.py
-
-
+        FAILED_JOB="Deploy Staging" python3 scripts/ci_notify_failure.py
 
   staging-e2e:
     name: Staging E2E Tests
@@ -887,14 +1089,17 @@ jobs:
 
 
 
-  build-production-runtime-images:
-    name: Build Production Runtime Images
+  build-prod-api:
+    name: Build Production API Image
     runs-on: saas
-    timeout-minutes: 30
+    timeout-minutes: 25
     needs: [validate, frontend-lint]
 
     if: startsWith(github.ref, 'refs/tags/v')
 
+    env:
+      BUILD_ONLY: api
+
     steps:
     - name: Checkout code
       shell: sh
@@ -902,7 +1107,7 @@ jobs:
         GITHUB_TOKEN: ${{ github.token }}
       run: |
         set -eu
-        python3 - <<'PY'
+        python3 - <<'INNERPY'
         import io, os, tarfile, time, urllib.request, urllib.error
         url = f"{os.environ['GITHUB_API_URL']}/repos/{os.environ['GITHUB_REPOSITORY']}/archive/{os.environ['GITHUB_SHA']}.tar.gz"
         request = urllib.request.Request(url, headers={"Authorization": f"token {os.environ['GITHUB_TOKEN']}"})
@@ -927,7 +1132,6 @@ jobs:
                     print(f"Checkout error: {e}, retrying in {wait}s (attempt {attempt+1}/5)...")
                     time.sleep(wait)
                     continue
-                raise
         else:
             raise last_err
         with tarfile.open(fileobj=io.BytesIO(archive), mode='r:gz') as tar:
@@ -940,47 +1144,215 @@ jobs:
                     member.name = name[len(root_prefix):]
                 if member.name:
                     tar.extract(member, '.')
-        PY
+        INNERPY
 
-    - name: Build and push all images (api + worker + web, with buildx cache)
+
+    - name: Build and push production api image
       shell: sh
       env:
-        REGISTRY_TOKEN: ${{ secrets.REGISTRY_TOKEN }}
+        REGISTRY_TOKEN: ${ secrets.REGISTRY_TOKEN }
       run: |
         set -eu
         chmod +x scripts/build_release_images.sh
-        REGISTRY_TOKEN="${REGISTRY_TOKEN}" scripts/build_release_images.sh "${GITHUB_REF_NAME}"
+        BUILD_ONLY="${BUILD_ONLY}" \
+          REGISTRY_TOKEN="${REGISTRY_TOKEN}" \
+          scripts/build_release_images.sh "${GITHUB_REF_NAME}"
+
 
     - name: Cleanup old Docker images
       if: always()
       shell: sh
       run: |
-        set -eu
-        if [ -f scripts/cleanup_old_images.sh ]; then
-          chmod +x scripts/cleanup_old_images.sh
-          scripts/cleanup_old_images.sh
-        else
-          echo "Cleanup script not found, doing basic prune..."
-          docker image prune -f 2>/dev/null || true
-        fi
+        set +e
+        docker image prune -f 2>/dev/null || true
         echo "Disk usage after cleanup:"
         df -h / | tail -1
-
     - name: Notify CI failure
       if: failure()
       shell: sh
       run: |
         set +e
         echo "=== CI 失败通知 ==="
-        FAILED_JOB="Build Production Runtime Images" python3 scripts/ci_notify_failure.py
+        FAILED_JOB="Build Production API Image" python3 scripts/ci_notify_failure.py
 
+  build-prod-worker:
+    name: Build Production Worker Image
+    runs-on: saas
+    timeout-minutes: 25
+    needs: [validate, frontend-lint]
+
+    if: startsWith(github.ref, 'refs/tags/v')
+
+    env:
+      BUILD_ONLY: worker
+
+    steps:
+    - name: Checkout code
+      shell: sh
+      env:
+        GITHUB_TOKEN: ${{ github.token }}
+      run: |
+        set -eu
+        python3 - <<'INNERPY'
+        import io, os, tarfile, time, urllib.request, urllib.error
+        url = f"{os.environ['GITHUB_API_URL']}/repos/{os.environ['GITHUB_REPOSITORY']}/archive/{os.environ['GITHUB_SHA']}.tar.gz"
+        request = urllib.request.Request(url, headers={"Authorization": f"token {os.environ['GITHUB_TOKEN']}"})
+        last_err = None
+        for attempt in range(5):
+            try:
+                with urllib.request.urlopen(request, timeout=120) as response:
+                    archive = response.read()
+                break
+            except urllib.error.HTTPError as e:
+                last_err = e
+                if e.code >= 500 and attempt < 4:
+                    wait = 2 ** attempt
+                    print(f"Checkout HTTP {e.code}, retrying in {wait}s (attempt {attempt+1}/5)...")
+                    time.sleep(wait)
+                    continue
+                raise
+            except Exception as e:
+                last_err = e
+                if attempt < 4:
+                    wait = 2 ** attempt
+                    print(f"Checkout error: {e}, retrying in {wait}s (attempt {attempt+1}/5)...")
+                    time.sleep(wait)
+                    continue
+        else:
+            raise last_err
+        with tarfile.open(fileobj=io.BytesIO(archive), mode='r:gz') as tar:
+            root_prefix = tar.getmembers()[0].name.split('/', 1)[0] + '/'
+            for member in tar.getmembers():
+                name = member.name
+                if name == root_prefix[:-1]:
+                    continue
+                if name.startswith(root_prefix):
+                    member.name = name[len(root_prefix):]
+                if member.name:
+                    tar.extract(member, '.')
+        INNERPY
+
+
+    - name: Build and push production worker image
+      shell: sh
+      env:
+        REGISTRY_TOKEN: ${ secrets.REGISTRY_TOKEN }
+      run: |
+        set -eu
+        chmod +x scripts/build_release_images.sh
+        BUILD_ONLY="${BUILD_ONLY}" \
+          REGISTRY_TOKEN="${REGISTRY_TOKEN}" \
+          scripts/build_release_images.sh "${GITHUB_REF_NAME}"
+
+
+    - name: Cleanup old Docker images
+      if: always()
+      shell: sh
+      run: |
+        set +e
+        docker image prune -f 2>/dev/null || true
+        echo "Disk usage after cleanup:"
+        df -h / | tail -1
+    - name: Notify CI failure
+      if: failure()
+      shell: sh
+      run: |
+        set +e
+        echo "=== CI 失败通知 ==="
+        FAILED_JOB="Build Production Worker Image" python3 scripts/ci_notify_failure.py
+
+  build-prod-web:
+    name: Build Production Web Image
+    runs-on: saas
+    timeout-minutes: 25
+    needs: [validate, frontend-lint]
+
+    if: startsWith(github.ref, 'refs/tags/v')
+
+    env:
+      BUILD_ONLY: web
+
+    steps:
+    - name: Checkout code
+      shell: sh
+      env:
+        GITHUB_TOKEN: ${{ github.token }}
+      run: |
+        set -eu
+        python3 - <<'INNERPY'
+        import io, os, tarfile, time, urllib.request, urllib.error
+        url = f"{os.environ['GITHUB_API_URL']}/repos/{os.environ['GITHUB_REPOSITORY']}/archive/{os.environ['GITHUB_SHA']}.tar.gz"
+        request = urllib.request.Request(url, headers={"Authorization": f"token {os.environ['GITHUB_TOKEN']}"})
+        last_err = None
+        for attempt in range(5):
+            try:
+                with urllib.request.urlopen(request, timeout=120) as response:
+                    archive = response.read()
+                break
+            except urllib.error.HTTPError as e:
+                last_err = e
+                if e.code >= 500 and attempt < 4:
+                    wait = 2 ** attempt
+                    print(f"Checkout HTTP {e.code}, retrying in {wait}s (attempt {attempt+1}/5)...")
+                    time.sleep(wait)
+                    continue
+                raise
+            except Exception as e:
+                last_err = e
+                if attempt < 4:
+                    wait = 2 ** attempt
+                    print(f"Checkout error: {e}, retrying in {wait}s (attempt {attempt+1}/5)...")
+                    time.sleep(wait)
+                    continue
+        else:
+            raise last_err
+        with tarfile.open(fileobj=io.BytesIO(archive), mode='r:gz') as tar:
+            root_prefix = tar.getmembers()[0].name.split('/', 1)[0] + '/'
+            for member in tar.getmembers():
+                name = member.name
+                if name == root_prefix[:-1]:
+                    continue
+                if name.startswith(root_prefix):
+                    member.name = name[len(root_prefix):]
+                if member.name:
+                    tar.extract(member, '.')
+        INNERPY
+
+
+    - name: Build and push production web image
+      shell: sh
+      env:
+        REGISTRY_TOKEN: ${ secrets.REGISTRY_TOKEN }
+      run: |
+        set -eu
+        chmod +x scripts/build_release_images.sh
+        BUILD_ONLY="${BUILD_ONLY}" \
+          REGISTRY_TOKEN="${REGISTRY_TOKEN}" \
+          scripts/build_release_images.sh "${GITHUB_REF_NAME}"
+
+
+    - name: Cleanup old Docker images
+      if: always()
+      shell: sh
+      run: |
+        set +e
+        docker image prune -f 2>/dev/null || true
+        echo "Disk usage after cleanup:"
+        df -h / | tail -1
+    - name: Notify CI failure
+      if: failure()
+      shell: sh
+      run: |
+        set +e
+        echo "=== CI 失败通知 ==="
+        FAILED_JOB="Build Production Web Image" python3 scripts/ci_notify_failure.py
 
   deploy-production:
     name: Deploy Production
     runs-on: saas
     timeout-minutes: 20
     if: startsWith(github.ref, 'refs/tags/v')
-    needs: build-production-runtime-images
+    needs: [build-prod-api, build-prod-worker, build-prod-web]
 
     steps:
     - name: Install SSH client

apps/web/src/components/modals/CloneVoiceModal.tsx

@@ -0,0 +1,290 @@
+/**
+ * CloneVoiceModal — 音色克隆弹窗
+ *
+ * 三步骤状态：input → uploading → success
+ * 支持上传音频文件或直接录制（mock，无真实录音）
+ *
+ * V21 Design System — 零 antd 直接导入
+ */
+import React, { useState, useCallback, useRef } from "react";
+import { Modal, Button } from "@/components/ui";
+import { createVoiceClone, toVoiceClone } from "@/api/voiceClone";
+import type { VoiceClone } from "@/api/voiceClone";
+import { uploadAsset } from "@/api/assets";
+import "./clone-voice-modal.css";
+
+/* ── 类型定义 ───────────────────────────────────────────── */
+
+type ModalStep = "input" | "uploading" | "success";
+
+export interface CloneVoiceModalProps {
+  /** 弹窗是否可见 */
+  open: boolean;
+  /** 关闭弹窗回调 */
+  onClose: () => void;
+  /** 克隆成功回调（返回新创建的音色） */
+  onSuccess?: (voice: VoiceClone) => void;
+}
+
+/* ── 默认音色名称计数器 ─────────────────────────────────── */
+
+let cloneCounter = 1;
+
+const getNextDefaultName = (): string => {
+  const name = `我的声音 ${cloneCounter}`;
+  cloneCounter += 1;
+  return name;
+};
+
+/* ── 组件 ───────────────────────────────────────────────── */
+
+const CloneVoiceModal: React.FC<CloneVoiceModalProps> = ({
+  open,
+  onClose,
+  onSuccess,
+}) => {
+  const [step, setStep] = useState<ModalStep>("input");
+  const [voiceName, setVoiceName] = useState("");
+  const [isRecording, setIsRecording] = useState(false);
+  const [selectedFile, setSelectedFile] = useState<File | null>(null);
+  const [dragActive, setDragActive] = useState(false);
+  const fileInputRef = useRef<HTMLInputElement>(null);
+
+  /** 重置弹窗状态 */
+  const resetState = useCallback(() => {
+    setStep("input");
+    setVoiceName("");
+    setSelectedFile(null);
+    setIsRecording(false);
+    setDragActive(false);
+  }, []);
+
+  /** 关闭弹窗 */
+  const handleClose = useCallback(() => {
+    resetState();
+    onClose();
+  }, [resetState, onClose]);
+
+  /** 上传区域点击 */
+  const handleUploadClick = () => {
+    fileInputRef.current?.click();
+  };
+
+  /** 文件选择 */
+  const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    const file = e.target.files?.[0];
+    if (file) {
+      setSelectedFile(file);
+      // 清除之前的录制状态
+      setIsRecording(false);
+    }
+    // 清空 input 以允许重复选择同一文件
+    e.target.value = "";
+  };
+
+  /** 拖拽事件 */
+  const handleDrag = (e: React.DragEvent) => {
+    e.preventDefault();
+    e.stopPropagation();
+    if (e.type === "dragenter" || e.type === "dragover") {
+      setDragActive(true);
+    } else if (e.type === "dragleave") {
+      setDragActive(false);
+    }
+  };
+
+  const handleDrop = (e: React.DragEvent) => {
+    e.preventDefault();
+    e.stopPropagation();
+    setDragActive(false);
+    const file = e.dataTransfer.files?.[0];
+    if (file) {
+      const ext = file.name.split(".").pop()?.toLowerCase();
+      if (ext === "mp3" || ext === "wav") {
+        setSelectedFile(file);
+        setIsRecording(false);
+      }
+    }
+  };
+
+  /** 录制按钮（mock） */
+  const handleRecord = () => {
+    setIsRecording((prev) => !prev);
+    if (!isRecording) {
+      // 开始录制 — 清除已选文件
+      setSelectedFile(null);
+    }
+  };
+
+  /** 开始克隆 */
+  const handleStartClone = async () => {
+    const name = voiceName.trim() || getNextDefaultName();
+    setStep("uploading");
+
+    try {
+      // 先上传音频文件获取真实 URL
+      let audioUrl: string;
+      if (selectedFile) {
+        const formData = new FormData();
+        formData.append("file", selectedFile);
+        formData.append("kind", "voice");
+        const uploadResult = await uploadAsset(formData);
+        audioUrl = uploadResult.url;
+      } else {
+        // 录制功能暂未实现，提示用户上传
+        setStep("input");
+        return;
+      }
+
+      // 提交克隆请求
+      const result = await createVoiceClone({
+        name,
+        audio_url: audioUrl,
+      });
+
+      setStep("success");
+
+      // 2秒后自动关闭
+      setTimeout(() => {
+        onSuccess?.(toVoiceClone(result));
+        handleClose();
+      }, 2000);
+    } catch {
+      setStep("input");
+    }
+  };
+
+  /** 弹窗打开时初始化默认名称 */
+  const handleAfterOpenChange = (visible: boolean) => {
+    if (visible) {
+      setVoiceName(getNextDefaultName());
+    }
+  };
+
+  const canStart = selectedFile || isRecording;
+
+  return (
+    <Modal
+      open={open}
+      onCancel={handleClose}
+      title="🎤 克隆新音色"
+      width={520}
+      footer={null}
+      destroyOnClose
+      afterOpenChange={handleAfterOpenChange}
+    >
+      {/* ── 输入步骤 ──────────────────────────────────── */}
+      {step === "input" && (
+        <div className="cvm-body">
+          {/* 音色名称 */}
+          <div className="cvm-field">
+            <label className="cvm-label">音色名称</label>
+            <input
+              type="text"
+              className="cvm-input"
+              value={voiceName}
+              onChange={(e) => setVoiceName(e.target.value)}
+              placeholder="输入音色名称"
+            />
+          </div>
+
+          {/* 上传区域 */}
+          <div className="cvm-field">
+            <label className="cvm-label">上传音频</label>
+            <div
+              className={`cvm-upload-zone${dragActive ? " cvm-upload-zone--active" : ""}`}
+              onClick={handleUploadClick}
+              onDragEnter={handleDrag}
+              onDragOver={handleDrag}
+              onDragLeave={handleDrag}
+              onDrop={handleDrop}
+            >
+              <div className="cvm-upload-icon">🎵</div>
+              <p className="cvm-upload-title">
+                {selectedFile ? selectedFile.name : "拖拽音频文件到此处"}
+              </p>
+              <p className="cvm-upload-hint">支持 MP3、WAV 格式</p>
+              <input
+                ref={fileInputRef}
+                type="file"
+                accept=".mp3,.wav,audio/mpeg,audio/wav"
+                style={{ display: "none" }}
+                onChange={handleFileChange}
+              />
+            </div>
+          </div>
+
+          {/* 或分隔 */}
+          <div className="cvm-divider">
+            <div className="cvm-divider-line" />
+            <span className="cvm-divider-text">或</span>
+            <div className="cvm-divider-line" />
+          </div>
+
+          {/* 录制区域 */}
+          <div className="cvm-field">
+            <label className="cvm-label">直接录制</label>
+            <div className="cvm-record-area">
+              <p className="cvm-record-hint">
+                {isRecording
+                  ? "录制中…再次点击停止"
+                  : "点击按钮开始录制你的声音"}
+              </p>
+              <button
+                type="button"
+                className={`cvm-record-btn${isRecording ? " cvm-record-btn--recording" : ""}`}
+                onClick={handleRecord}
+              >
+                🎙️
+              </button>
+            </div>
+          </div>
+
+          {/* 提示 */}
+          <div className="cvm-tip">
+            <span className="cvm-tip-icon">💡</span>
+            <span>
+              建议上传10秒~3分钟的清晰语音，环境安静、语速均匀效果最佳
+            </span>
+          </div>
+
+          {/* 底部按钮 */}
+          <div className="cvm-footer">
+            <Button buttonType="ghost" onClick={handleClose}>
+              取消
+            </Button>
+            <Button
+              buttonType="primary"
+              disabled={!canStart}
+              onClick={handleStartClone}
+            >
+              🎤 开始克隆
+            </Button>
+          </div>
+        </div>
+      )}
+
+      {/* ── 上传中步骤 ────────────────────────────────── */}
+      {step === "uploading" && (
+        <div className="cvm-uploading">
+          <div className="cvm-uploading-spinner" />
+          <p className="cvm-uploading-text">正在克隆你的音色…</p>
+          <p className="cvm-uploading-sub">AI 正在分析你的声音特征，请稍候</p>
+        </div>
+      )}
+
+      {/* ── 成功步骤 ──────────────────────────────────── */}
+      {step === "success" && (
+        <div className="cvm-success">
+          <div className="cvm-success-icon">✅</div>
+          <h3 className="cvm-success-title">克隆已提交</h3>
+          <p className="cvm-success-desc">
+            音色正在生成中，完成后将出现在列表中
+          </p>
+        </div>
+      )}
+    </Modal>
+  );
+};
+
+export default CloneVoiceModal;

apps/web/src/components/modals/clone-voice-modal.css

@@ -0,0 +1,325 @@
+/**
+ * CloneVoiceModal — V21 Design System
+ *
+ * 音色克隆弹窗样式
+ * 三步骤状态：input → uploading → success
+ */
+
+/* ── 弹窗内容区 ─────────────────────────────────────────── */
+
+.cvm-body {
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+}
+
+/* ── 表单区 ─────────────────────────────────────────────── */
+
+.cvm-field {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+
+.cvm-label {
+  font-size: 13px;
+  font-weight: 600;
+  color: var(--text-secondary, #475467);
+}
+
+.cvm-input {
+  width: 100%;
+  padding: 10px 14px;
+  border: 1px solid var(--line, #e4e7ec);
+  border-radius: var(--radius-sm);
+  background: var(--bg-surface, #fff);
+  color: var(--text-primary, #101828);
+  font-size: 14px;
+  line-height: 1.5;
+  transition:
+    border-color 0.2s,
+    box-shadow 0.2s;
+  outline: none;
+}
+
+.cvm-input:focus {
+  border-color: var(--primary, #6366f1);
+  box-shadow: 0 0 0 3px
+    color-mix(in srgb, var(--primary-color) 12%, transparent);
+}
+
+.cvm-input::placeholder {
+  color: var(--muted, #98a2b3);
+}
+
+/* ── 上传区域 ───────────────────────────────────────────── */
+
+.cvm-upload-zone {
+  border: 2px dashed var(--line, #e4e7ec);
+  border-radius: var(--radius-md);
+  padding: 28px 20px;
+  text-align: center;
+  background: var(--bg-subtle, #f8fafc);
+  cursor: pointer;
+  transition:
+    border-color 0.2s,
+    background 0.2s;
+}
+
+.cvm-upload-zone:hover {
+  border-color: var(--primary, #6366f1);
+  background: color-mix(in srgb, var(--primary-color) 4%, transparent);
+}
+
+.cvm-upload-zone.cvm-upload-zone--active {
+  border-color: var(--primary, #6366f1);
+  background: color-mix(in srgb, var(--primary-color) 6%, transparent);
+}
+
+.cvm-upload-icon {
+  font-size: 36px;
+  margin-bottom: 8px;
+  line-height: 1;
+}
+
+.cvm-upload-title {
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--text-primary, #101828);
+  margin: 0 0 4px;
+}
+
+.cvm-upload-hint {
+  font-size: 13px;
+  color: var(--muted, #98a2b3);
+  margin: 0;
+}
+
+/* ── 或分隔线 ───────────────────────────────────────────── */
+
+.cvm-divider {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+  margin: 4px 0;
+}
+
+.cvm-divider-line {
+  flex: 1;
+  height: 1px;
+  background: var(--line, #e4e7ec);
+}
+
+.cvm-divider-text {
+  font-size: 13px;
+  color: var(--muted, #98a2b3);
+  flex-shrink: 0;
+}
+
+/* ── 录制区域 ───────────────────────────────────────────── */
+
+.cvm-record-area {
+  border: 1px solid var(--line, #e4e7ec);
+  border-radius: var(--radius-md);
+  padding: 24px;
+  text-align: center;
+}
+
+.cvm-record-hint {
+  font-size: 13px;
+  color: var(--muted, #98a2b3);
+  margin: 0 0 14px;
+}
+
+.cvm-record-btn {
+  width: 80px;
+  height: 80px;
+  border-radius: 50%;
+  border: none;
+  cursor: pointer;
+  font-size: 32px;
+  line-height: 1;
+  padding: 0;
+  background: linear-gradient(
+    135deg,
+    var(--error-color, #ef4444),
+    var(--error-dark, #dc2626)
+  );
+  color: var(--text-inverse);
+  box-shadow: 0 4px 14px
+    color-mix(in srgb, var(--error-color, #ef4444) 35%, transparent);
+  transition:
+    transform 0.15s,
+    box-shadow 0.15s;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.cvm-record-btn:hover {
+  transform: scale(1.06);
+  box-shadow: 0 6px 20px
+    color-mix(in srgb, var(--error-color, #ef4444) 45%, transparent);
+}
+
+.cvm-record-btn:active {
+  transform: scale(0.96);
+}
+
+.cvm-record-btn--recording {
+  animation: cvm-pulse 1.2s ease-in-out infinite;
+}
+
+@keyframes cvm-pulse {
+  0%,
+  100% {
+    box-shadow: 0 4px 14px
+      color-mix(in srgb, var(--error-color, #ef4444) 35%, transparent);
+  }
+  50% {
+    box-shadow: 0 4px 28px
+      color-mix(in srgb, var(--error-color, #ef4444) 60%, transparent);
+  }
+}
+
+/* ── 提示条 ─────────────────────────────────────────────── */
+
+.cvm-tip {
+  display: flex;
+  align-items: flex-start;
+  gap: 8px;
+  padding: 12px 16px;
+  background: var(--warning-soft, #fef3c7);
+  border-radius: var(--radius-sm);
+  font-size: 13px;
+  color: var(--warning-color, #92400e);
+  line-height: 1.5;
+}
+
+.cvm-tip-icon {
+  flex-shrink: 0;
+  font-size: 14px;
+  line-height: 1.5;
+}
+
+/* ── 底部按钮 ───────────────────────────────────────────── */
+
+.cvm-footer {
+  display: flex;
+  gap: 12px;
+  margin-top: 4px;
+}
+
+.cvm-footer .xx-btn {
+  flex: 1;
+}
+
+/* ── 上传中状态 ─────────────────────────────────────────── */
+
+.cvm-uploading {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 48px 20px;
+  gap: 16px;
+}
+
+.cvm-uploading-spinner {
+  width: 48px;
+  height: 48px;
+  border: 3px solid var(--line, #e4e7ec);
+  border-top-color: var(--primary, #6366f1);
+  border-radius: 50%;
+  animation: cvm-spin 0.8s linear infinite;
+}
+
+@keyframes cvm-spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+.cvm-uploading-text {
+  font-size: 15px;
+  font-weight: 500;
+  color: var(--text-primary, #101828);
+  margin: 0;
+}
+
+.cvm-uploading-sub {
+  font-size: 13px;
+  color: var(--muted, #98a2b3);
+  margin: 0;
+}
+
+/* ── 成功状态 ───────────────────────────────────────────── */
+
+.cvm-success {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 48px 20px;
+  gap: 12px;
+}
+
+.cvm-success-icon {
+  font-size: 56px;
+  line-height: 1;
+}
+
+.cvm-success-title {
+  font-size: 18px;
+  font-weight: 700;
+  color: var(--text-primary, #101828);
+  margin: 0;
+}
+
+.cvm-success-desc {
+  font-size: 14px;
+  color: var(--muted, #98a2b3);
+  margin: 0;
+}
+
+/* ── 响应式 ─────────────────────────────────────────────── */
+
+@media (max-width: 768px) {
+  .cvm-overlay {
+    padding: var(--space-md);
+  }
+
+  .cvm-modal {
+    width: 100%;
+    max-width: 100%;
+    padding: var(--space-lg);
+  }
+}
+
+@media (max-width: 576px) {
+  .cvm-upload-zone {
+    padding: 20px 14px;
+  }
+
+  .cvm-record-btn {
+    width: 64px;
+    height: 64px;
+    font-size: 26px;
+  }
+
+  .cvm-footer {
+    flex-direction: column;
+  }
+}
+
+@media (max-width: 480px) {
+  .cvm-record-btn {
+    width: 60px;
+    height: 60px;
+  }
+
+  .cvm-tip {
+    font-size: 12px;
+    padding: var(--space-sm);
+  }
+}

apps/web/src/components/ui/ui.css

@@ -532,23 +532,3 @@
     padding: 8px 16px !important;
   }
 }
-
-
-/* ── xx-card antd 子元素覆盖样式（从 Admin.css 迁移） ── */
-/* AdminComingSoon 等页面使用 <Card className="xx-card"> 时需要 */
-/* .xx-card 基础样式和 :hover 已在 global.css 中定义（V21 设计系统） */
-
-.xx-card .ant-card-head {
-  border-bottom: 1px solid var(--border-color);
-  padding: 20px 24px;
-}
-
-.xx-card .ant-card-head-title {
-  font-weight: 800;
-  font-size: 17px;
-  color: var(--text-primary);
-}
-
-.xx-card .ant-card-body {
-  padding: 24px;
-}

apps/web/src/pages/accounts/Accounts.tsx

@@ -153,7 +153,7 @@ const Accounts: React.FC = () => {
     },
   });
 
-  /** 绑定 mutation */
+  /** 绑定 mutation（mock） */
   const bindMutation = useMutation({
     mutationFn: bindAccount,
     onSuccess: () => {
@@ -165,7 +165,7 @@ const Accounts: React.FC = () => {
     },
   });
 
-  /** 绑定新账号 */
+  /** 绑定新账号（mock：直接创建） */
   const handleBind = (platformId: PlatformId) => {
     const platform = PLATFORMS.find((p) => p.id === platformId);
     if (!platform) return;

apps/web/src/pages/dashboard/Dashboard.tsx

@@ -29,7 +29,6 @@ interface KpiItem {
   accent: string;
 }
 
-// TODO: kpiData 当前使用硬编码 mock 数据，待后端提供 Dashboard 统计 API 后替换
 const kpiData: KpiItem[] = [
   {
     key: "projects",
@@ -82,7 +81,6 @@ interface QuickEntry {
   path: string;
 }
 
-// TODO: quickEntries 描述中含硬编码计数（如 486个素材），待后端 API 后动态化
 const quickEntries: QuickEntry[] = [
   {
     id: "titles",
@@ -137,7 +135,6 @@ const statusLabel: Record<TaskStatus, string> = {
   failed: "失败",
 };
 
-// TODO: recentTasks 当前使用硬编码 mock 数据，待后端提供最近任务 API 后替换
 const recentTasks: RecentTask[] = [
   {
     id: "t-1",

apps/web/src/pages/titles/TitleLibrary.tsx

@@ -55,9 +55,13 @@ interface TitleData {
 /* ============================================================
  * Mock 数据
  * ============================================================ */
-// TODO: 分类数据当前为前端硬编码 mock，待后端提供标题分类 API 后替换
 const MOCK_CATEGORIES: CategoryItem[] = [
-  { id: "cat-all", name: "全部标题", count: 0 },
+  { id: "cat-all", name: "全部标题", count: 15 },
+  { id: "cat-1", name: "美食探店", count: 4 },
+  { id: "cat-2", name: "科技数码", count: 3 },
+  { id: "cat-3", name: "生活日常", count: 4 },
+  { id: "cat-4", name: "美妆穿搭", count: 2 },
+  { id: "cat-5", name: "教育学习", count: 2 },
 ];
 
 /** 后端 TitleItem → 前端 TitleData 映射 */

apps/web/src/pages/voice-clone/VoiceClone.tsx

@@ -18,7 +18,7 @@ import {
   CloseCircleOutlined,
 } from "@ant-design/icons";
 import PageHead from "@/components/layout/PageHead";
-import CloneModal from "@/components/voice/CloneModal";
+import CloneVoiceModal from "@/components/modals/CloneVoiceModal";
 import {
   getVoiceClones,
   deleteVoiceClone,
@@ -356,7 +356,7 @@ const VoiceClone: React.FC = () => {
       )}
 
       {/* 克隆音色弹窗 */}
-      <CloneModal
+      <CloneVoiceModal
         open={cloneModalOpen}
         onClose={() => setCloneModalOpen(false)}
         onSuccess={() => {

scripts/build_release_images.sh

@@ -17,6 +17,12 @@ case "$BUILD_ENV" in
 esac
 echo "Build environment: $BUILD_ENV → nginx config: $NGINX_CONF_FILE"
 
+# 可选：只构建指定镜像（api|worker|web），空则全部构建
+BUILD_ONLY="${BUILD_ONLY:-}"
+if [ -n "$BUILD_ONLY" ]; then
+  echo "Build mode: only $BUILD_ONLY"
+fi
+
 ROOT_DIR="$(CDPATH= cd -- "$(dirname -- "$0")/.." && pwd)"
 cd "$ROOT_DIR"
 
@@ -60,26 +66,22 @@ fi
 # 默认只读不写，防止 feature 分支污染主缓存
 # 只有 develop/main 分支才写回缓存
 BRANCH_NAME="${GITHUB_REF_NAME:-${CI_COMMIT_BRANCH:-unknown}}"
-if [ "$USE_CACHE" -eq 1 ]; then
-  docker buildx build \
-    --build-arg APP_VERSION="$VERSION" \
-    --cache-from "type=registry,ref=${CACHE_REGISTRY}/api-cache:${CACHE_TAG},ignore-error=true" \
-    --cache-to "type=registry,ref=${CACHE_REGISTRY}/api-cache:${CACHE_TAG},mode=max" \
-    -f infra/docker/api.Dockerfile \
-    -t "$API_IMAGE" -t "$API_LATEST" \
-    --load \
-    .
-else
-  docker build --pull=false --build-arg APP_VERSION="$VERSION" -f infra/docker/api.Dockerfile -t "$API_IMAGE" -t "$API_LATEST" .
-fi
+case "$BRANCH_NAME" in
+  develop|main) CACHE_WRITE=1 ; echo "Cache mode: read+write (branch: $BRANCH_NAME)" ;;
+  *)            CACHE_WRITE=0 ; echo "Cache mode: read-only (branch: $BRANCH_NAME)" ;;
+esac
 
+# ---- 构建函数：使用 buildx 直接 push 到 registry ----
+# 不再使用 --load → docker tag → docker push 的串行方式
+# buildx --push 直接从 buildkit 推送，省去序列化导入 daemon 的开销
 build_with_cache() {
-  # usage: build_with_cache <image_name> <dockerfile> <extra_args...>
+  # usage: build_with_cache <image_name> <dockerfile> [extra_args...]
   IMG_NAME="$1"
   DOCKERFILE="$2"
   shift 2
   EXTRA_ARGS="$*"
 
+  REGISTRY_IMG="${REGISTRY}/xiaoxia-saas-${IMG_NAME}:$VERSION"
   CACHE_FROM="type=registry,ref=${CACHE_REGISTRY}/${IMG_NAME}-cache:${CACHE_TAG_PRIMARY},ignore-error=true"
 
   if [ "$CACHE_WRITE" -eq 1 ]; then
@@ -90,96 +92,100 @@ build_with_cache() {
     echo "  cache: read-only from ${CACHE_REGISTRY}/${IMG_NAME}-cache:${CACHE_TAG_PRIMARY}"
   fi
 
-  if [ "$USE_CACHE" -eq 1 ]; then
+  if [ "$USE_CACHE" -eq 1 ] && [ "$USE_PUSH" -eq 1 ]; then
     if [ -n "$CACHE_TO" ]; then
       docker buildx build \
         $EXTRA_ARGS \
         --cache-from "$CACHE_FROM" \
         --cache-to "$CACHE_TO" \
         -f "$DOCKERFILE" \
-        -t "$IMG_NAME:$VERSION" \
-        --load \
+        -t "$REGISTRY_IMG" \
+        --push \
         .
     else
       docker buildx build \
         $EXTRA_ARGS \
         --cache-from "$CACHE_FROM" \
         -f "$DOCKERFILE" \
-        -t "$IMG_NAME:$VERSION" \
-        --load \
+        -t "$REGISTRY_IMG" \
+        --push \
         .
     fi
+    echo "  ✅ Pushed: $REGISTRY_IMG"
   else
-    docker build --pull=false $EXTRA_ARGS -f "$DOCKERFILE" -t "$IMG_NAME:$VERSION" .
+    # 无push权限时，本地构建用于测试
+    docker build --pull=false $EXTRA_ARGS -f "$DOCKERFILE" -t "xiaoxia-saas-${IMG_NAME}:$VERSION" .
+    echo "  ✅ Built locally: xiaoxia-saas-${IMG_NAME}:$VERSION"
   fi
 }
 
-echo "=== Building API image ==="
-build_with_cache "api" "infra/docker/api.Dockerfile" \
-  "--build-arg APP_VERSION=$VERSION"
-docker tag "$API_IMAGE" "$API_LATEST"
+should_build() {
+  # usage: should_build <image_name>
+  # 返回0表示需要构建，1表示跳过
+  local img="$1"
+  if [ -z "$BUILD_ONLY" ]; then
+    return 0  # 全部构建
+  fi
+  if [ "$BUILD_ONLY" = "$img" ]; then
+    return 0
+  fi
+  return 1
+}
 
-echo "=== Building Worker image ==="
-if [ "$USE_CACHE" -eq 1 ]; then
-  docker buildx build \
-    --build-arg APP_VERSION="$VERSION" \
-    --cache-from "type=registry,ref=${CACHE_REGISTRY}/worker-cache:${CACHE_TAG},ignore-error=true" \
-    --cache-to "type=registry,ref=${CACHE_REGISTRY}/worker-cache:${CACHE_TAG},mode=max" \
-    -f infra/docker/worker.Dockerfile \
-    -t "$WORKER_IMAGE" -t "$WORKER_LATEST" \
-    --load \
-    .
-else
-  docker build --pull=false --build-arg APP_VERSION="$VERSION" -f infra/docker/worker.Dockerfile -t "$WORKER_IMAGE" -t "$WORKER_LATEST" .
+if should_build "api"; then
+  echo ""
+  echo "=== Building API image ==="
+  build_with_cache "api" "infra/docker/api.Dockerfile" \
+    "--build-arg APP_VERSION=$VERSION"
+
+  # 本地也打一个 :dev 标签方便本地引用（如果有本地镜像的话）
+  if [ "$USE_PUSH" -eq 0 ]; then
+    docker tag "$API_IMAGE" "$API_LATEST" 2>/dev/null || true
+  fi
 fi
 
-echo "=== Building Web image (with buildx cache) ==="
-# 先构建前端产物（使用持久化 npm 缓存卷）
-NPM_CACHE_VOLUME="xiaoxia-npm-cache"
-if ! docker volume inspect "$NPM_CACHE_VOLUME" >/dev/null 2>&1; then
-  docker volume create "$NPM_CACHE_VOLUME" >/dev/null
-  echo "  Created npm cache volume: $NPM_CACHE_VOLUME"
+if should_build "worker"; then
+  echo ""
+  echo "=== Building Worker image ==="
+  build_with_cache "worker" "infra/docker/worker.Dockerfile" \
+    "--build-arg APP_VERSION=$VERSION"
+
+  if [ "$USE_PUSH" -eq 0 ]; then
+    docker tag "$WORKER_IMAGE" "$WORKER_LATEST" 2>/dev/null || true
+  fi
 fi
 
-docker run --rm \
-  -v "$PWD:/workspace" \
-  -v "$NPM_CACHE_VOLUME:/workspace/apps/web/node_modules" \
-  -w /workspace/apps/web \
-  docker.m.daocloud.io/library/node:20 \
-  sh -lc "npm ci && npm run build"
+if should_build "web"; then
+  echo ""
+  echo "=== Building Web image ==="
+  # 先构建前端产物（使用持久化 npm 缓存卷）
+  NPM_CACHE_VOLUME="xiaoxia-npm-cache"
+  if ! docker volume inspect "$NPM_CACHE_VOLUME" >/dev/null 2>&1; then
+    docker volume create "$NPM_CACHE_VOLUME" >/dev/null
+    echo "  Created npm cache volume: $NPM_CACHE_VOLUME"
+  fi
 
-test -f apps/web/dist/index.html
+  docker run --rm \
+    -v "$PWD:/workspace" \
+    -v "$NPM_CACHE_VOLUME:/workspace/apps/web/node_modules" \
+    -w /workspace/apps/web \
+    docker.m.daocloud.io/library/node:20 \
+    sh -lc "npm ci && npm run build"
 
-if [ "$USE_CACHE" -eq 1 ]; then
-  docker buildx build \
-    --cache-from "type=registry,ref=${CACHE_REGISTRY}/web-cache:${CACHE_TAG},ignore-error=true" \
-    --cache-to "type=registry,ref=${CACHE_REGISTRY}/web-cache:${CACHE_TAG},mode=max" \
-    -f infra/docker/web-artifact.Dockerfile \
-    --build-arg "NGINX_CONF=$NGINX_CONF_FILE" \
-    -t "$WEB_IMAGE" \
-    --load \
-    .
-else
-  docker build --pull=false \
-    -f infra/docker/web-artifact.Dockerfile \
-    --build-arg "NGINX_CONF=$NGINX_CONF_FILE" \
-    -t "$WEB_IMAGE" \
-    .
-fi
+  test -f apps/web/dist/index.html
 
-# Push 到 Registry
-if [ "$USE_PUSH" -eq 1 ]; then
-  echo "=== Pushing images to Registry ==="
-  docker tag "$API_IMAGE" "$REGISTRY_API"
-  docker tag "$WORKER_IMAGE" "$REGISTRY_WORKER"
-  docker tag "$WEB_IMAGE" "$REGISTRY_WEB"
-  docker push "$REGISTRY_API"
-  docker push "$REGISTRY_WORKER"
-  docker push "$REGISTRY_WEB"
-  echo "All images pushed to $REGISTRY"
-else
-  echo "Registry push skipped (no auth token available)"
+  build_with_cache "web" "infra/docker/web-artifact.Dockerfile" \
+    "--build-arg NGINX_CONF=$NGINX_CONF_FILE"
 fi
 
+echo ""
 echo "=== Build complete ==="
-docker images | grep "xiaoxia-saas.*:$VERSION"
+if [ "$USE_PUSH" -eq 1 ]; then
+  echo "Images pushed to $REGISTRY:"
+  should_build "api" && echo "  - $REGISTRY_API"
+  should_build "worker" && echo "  - $REGISTRY_WORKER"
+  should_build "web" && echo "  - $REGISTRY_WEB"
+else
+  echo "Images built locally (registry push skipped)"
+  docker images | grep "xiaoxia-saas.*:$VERSION" || true
+fi