From 790f1751f25c89fa848c6b31e2ce5f2fb9a1fcce Mon Sep 17 00:00:00 2001
From: sion123 <450702724@qq.com>
Date: Sun, 15 Mar 2026 21:50:13 +0800
Subject: [PATCH] =?UTF-8?q?feat:z=20=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../web-gold/src/components/LoginModal.vue    | 1010 -----------------
 .../src/components/MyFavoritesModal.vue       |  306 -----
 .../material/MaterialBatchGroupModal.vue      |   97 --
 .../components/material/MaterialMixModal.vue  |  197 ----
 4 files changed, 1610 deletions(-)
 delete mode 100644 frontend/app/web-gold/src/components/LoginModal.vue
 delete mode 100644 frontend/app/web-gold/src/components/MyFavoritesModal.vue
 delete mode 100644 frontend/app/web-gold/src/components/material/MaterialBatchGroupModal.vue
 delete mode 100644 frontend/app/web-gold/src/components/material/MaterialMixModal.vue

diff --git a/frontend/app/web-gold/src/components/LoginModal.vue b/frontend/app/web-gold/src/components/LoginModal.vue
deleted file mode 100644
index 95d5107fd9..0000000000
--- a/frontend/app/web-gold/src/components/LoginModal.vue
+++ /dev/null
@@ -1,1010 +0,0 @@
-<script setup>
-import { ref, computed, onUnmounted } from 'vue'
-import { message } from 'ant-design-vue'
-import { useUserStore } from '@/stores/user'
-import authApi, { SMS_SCENE, SMS_TEMPLATE_CODE } from '@/api/auth'
-// 直接使用实例（最简单、最可靠）
-import tokenManager from '@gold/utils/token-manager'
-
-defineProps({
-  open: { type: Boolean, default: false },
-})
-const emit = defineEmits(['update:open'])
-
-const userStore = useUserStore()
-
-// 页面类型常量
-const PAGE_TYPE = {
-  LOGIN: 'login',
-  REGISTER: 'register',
-  RESET: 'reset',
-}
-
-// 倒计时时长（秒）
-const COUNTDOWN_DURATION = 60
-
-// 页面状态：login | register | reset
-const page = ref(PAGE_TYPE.LOGIN)
-const phone = ref('')
-const code = ref('')
-const password = ref('')
-const confirmPassword = ref('')
-const agree = ref(true)
-const sending = ref(false)
-const counting = ref(false)
-const count = ref(COUNTDOWN_DURATION)
-const loading = ref(false)
-
-const canSend = computed(() => {
-  return /^1\d{10}$/.test(phone.value) && !sending.value && !counting.value
-})
-
-// 密码验证规则
-const PASSWORD_MIN_LENGTH = 4
-const PASSWORD_MAX_LENGTH = 16
-const CODE_PATTERN = /^\d{4,6}$/
-
-const canSubmit = computed(() => {
-  const isValidPhone = /^1\d{10}$/.test(phone.value)
-  const isValidPassword = password.value.length >= PASSWORD_MIN_LENGTH && password.value.length <= PASSWORD_MAX_LENGTH
-  
-  if (!isValidPhone || !agree.value || loading.value) return false
-  
-  if (page.value === PAGE_TYPE.LOGIN) {
-    // 手机+验证码登录
-    return CODE_PATTERN.test(code.value)
-    // 密码登录（已注释）
-    // return isValidPassword
-  } else if (page.value === PAGE_TYPE.REGISTER || page.value === PAGE_TYPE.RESET) {
-    return CODE_PATTERN.test(code.value) && isValidPassword && password.value === confirmPassword.value
-  }
-  return false
-})
-
-let timer = null
-onUnmounted(() => {
-  if (timer) {
-    clearInterval(timer)
-    timer = null
-  }
-})
-
-function close() {
-  emit('update:open', false)
-}
-
-function switchPage(next) {
-  if (page.value === next) return
-  page.value = next
-  // 只重置与当前页面相关的字段，保留手机号
-  code.value = ''
-  password.value = ''
-  confirmPassword.value = ''
-}
-
-/**
- * 提取错误消息
- * @param {Error} error - 错误对象
- * @returns {string} 错误消息
- */
-function getErrorMessage(error) {
-  return error?.response?.data?.msg || error?.response?.data?.message || error?.message || '操作失败，请重试'
-}
-
-/**
- * 开始倒计时
- */
-function startCountdown() {
-  counting.value = true
-  count.value = COUNTDOWN_DURATION
-  timer = setInterval(() => {
-    if (count.value <= 1) {
-      clearInterval(timer)
-      timer = null
-      counting.value = false
-    } else {
-      count.value -= 1
-    }
-  }, 1000)
-}
-
-/**
- * 获取短信场景和模板编码配置
- * @returns {{ scene: number, templateCode: string | null }}
- */
-function getSmsConfig() {
-  if (page.value === PAGE_TYPE.REGISTER) {
-    return {
-      scene: SMS_SCENE.MEMBER_LOGIN, // 注册也用登录场景，首次登录即注册
-      templateCode: SMS_TEMPLATE_CODE.USER_REGISTER, // 注册时使用指定的模板编码
-    }
-  } else if (page.value === PAGE_TYPE.RESET) {
-    return {
-      scene: SMS_SCENE.MEMBER_RESET_PASSWORD,
-      templateCode: null,
-    }
-  }
-  // 默认登录场景
-  return {
-    scene: SMS_SCENE.MEMBER_LOGIN,
-    templateCode: null,
-  }
-}
-
-async function handleSendCode() {
-  if (!canSend.value) return
-  sending.value = true
-  try {
-    const { scene, templateCode } = getSmsConfig()
-    await authApi.sendSmsCode(phone.value, scene, templateCode)
-    message.success('验证码发送成功')
-    startCountdown()
-  } catch (e) {
-    const errorMsg = getErrorMessage(e) || '发送失败，请重试'
-    message.error(errorMsg)
-  } finally {
-    sending.value = false
-  }
-}
-
-/**
- * 处理注册流程
- * 流程：1. 短信登录（首次即注册） 2. 设置密码（使用登录验证码）
- */
-async function handleRegister() {
-  // 1. 短信登录（首次即注册）- loginBySms 内部已保存 token
-  const info = await authApi.loginBySms(phone.value, code.value)
-  if (!info?.accessToken) {
-    throw new Error('登录失败，请重试')
-  }
-  
-  // 2. 设置密码（使用登录验证码，后端可能允许首次注册时使用登录验证码设置密码）
-  // 确保一定会调用 updatePasswordBySmsCode
-  await authApi.updatePasswordBySmsCode(password.value, code.value)
-  
-  // 3. 更新用户信息到 store（可选：如果注册后需要自动登录）
-  // await handleLoginSuccess(info)
-  
-  // 4. 注册成功后提示用户并切换到登录页面
-  message.success('注册成功！请使用手机号和密码登录')
-  setTimeout(() => {
-    switchPage(PAGE_TYPE.LOGIN)
-    // 清理表单
-    code.value = ''
-    password.value = ''
-    confirmPassword.value = ''
-  }, 2000)
-}
-
-/**
- * 处理重置密码流程
- */
-async function handleResetPassword() {
-  await authApi.resetPasswordBySms(phone.value, password.value, code.value)
-  message.success('密码重置成功，请使用新密码登录')
-  setTimeout(() => {
-    switchPage(PAGE_TYPE.LOGIN)
-  }, 2000)
-}
-
-async function handleSubmit() {
-  if (!canSubmit.value) return
-  loading.value = true
-  
-  try {
-    if (page.value === PAGE_TYPE.LOGIN) {
-      // 手机+验证码登录
-      const info = await authApi.loginBySms(phone.value, code.value)
-      await handleLoginSuccess(info)
-      // 密码登录（已注释）
-      // const info = await authApi.loginByPassword(phone.value, password.value)
-      // await handleLoginSuccess(info)
-    } else if (page.value === PAGE_TYPE.REGISTER) {
-      await handleRegister()
-    } else if (page.value === PAGE_TYPE.RESET) {
-      await handleResetPassword()
-    }
-  } catch (e) {
-    const errorMsg = getErrorMessage(e)
-    message.error(errorMsg)
-  } finally {
-    loading.value = false
-  }
-}
-
-async function handleLoginSuccess(info) {
-  if (info?.accessToken) {
-    tokenManager.setTokens({ accessToken: info.accessToken, refreshToken: info.refreshToken })
-  }
-  const userInfo = info?.userInfo || {}
-  await userStore.loginWithPhone({
-    profile: {
-      userId: String(userInfo.id || userInfo.userId || phone.value),
-      nickname: userInfo.nickname || userInfo.username || '用户',
-      avatar: userInfo.avatar || '',
-      balance: userInfo.balance ?? 0,
-      vipLevel: userInfo.vipLevel ?? 0,
-      credits: userInfo.credits ?? 0,
-    }
-  })
-  
-  // 登录成功后获取完整的用户信息
-  await userStore.fetchUserInfo()
-  
-  close()
-}
-</script>
-
-<template>
-  <transition name="fade">
-    <div v-if="open" class="login-mask">
-      <div class="login-modal">
-        <!-- 左侧品牌区域 -->
-        <div class="brand-pane">
-          <div class="brand-content">
-            <div class="brand-logo">
-              <img src="/favicon.ico" alt="logo" />
-            </div>
-            <div class="brand-title">金牌营销</div>
-            <div class="brand-subtitle">智能内容与营销洞察平台</div>
-            <div class="brand-features">
-              <div class="feature-item">
-                <div class="feature-icon">🚀</div>
-                <div class="feature-text">AI 驱动的内容创作</div>
-              </div>
-              <div class="feature-item">
-                <div class="feature-icon">📊</div>
-                <div class="feature-text">实时营销数据分析</div>
-              </div>
-              <div class="feature-item">
-                <div class="feature-icon">🎯</div>
-                <div class="feature-text">精准用户画像洞察</div>
-              </div>
-            </div>
-          </div>
-        </div>
-
-        <!-- 右侧表单区域 -->
-        <div class="form-pane">
-          <div class="form-header">
-            <button class="close-btn" @click="close">
-              <svg width="20" height="20" viewBox="0 0 20 20" fill="currentColor">
-                <path d="M15.898,4.045c-0.271-0.272-0.713-0.272-0.986,0l-4.71,4.711L5.493,4.045c-0.272-0.272-0.714-0.272-0.986,0s-0.272,0.714,0,0.986l4.709,4.711l-4.71,4.711c-0.272,0.271-0.272,0.713,0,0.986c0.136,0.136,0.314,0.203,0.492,0.203c0.179,0,0.357-0.067,0.493-0.203l4.711-4.711l4.71,4.711c0.136,0.136,0.314,0.203,0.494,0.203c0.178,0,0.356-0.067,0.492-0.203c0.272-0.273,0.272-0.715,0-0.986L10.875,9.742l4.711-4.711C16.17,4.759,16.17,4.317,15.898,4.045z"/>
-              </svg>
-            </button>
-          </div>
-
-          <div class="form-content">
-            <!-- 页面切换 -->
-            <!-- <div class="page-tabs">
-              <button 
-                class="tab-btn" 
-                :class="{ active: page === PAGE_TYPE.LOGIN }" 
-                @click="switchPage(PAGE_TYPE.LOGIN)"
-              >
-                登录
-              </button>
-              <button 
-                class="tab-btn" 
-                :class="{ active: page === PAGE_TYPE.REGISTER }" 
-                @click="switchPage(PAGE_TYPE.REGISTER)"
-              >
-                注册
-              </button>
-            </div> -->
-
-            <!-- 表单标题 -->
-            <div class="form-title">
-              <h2 v-if="page === PAGE_TYPE.LOGIN">欢迎回来</h2>
-              <h2 v-else-if="page === PAGE_TYPE.REGISTER">创建账户</h2>
-              <h2 v-else>重置密码</h2>
-              <p class="form-desc">
-                <span v-if="page === PAGE_TYPE.LOGIN">使用手机号和验证码登录您的账户</span>
-                <span v-else-if="page === PAGE_TYPE.REGISTER">使用手机号快速注册新账户</span>
-                <span v-else>通过手机验证码重置您的密码</span>
-              </p>
-            </div>
-
-            <!-- 登录表单 -->
-            <div v-if="page === PAGE_TYPE.LOGIN" class="auth-form">
-              <div class="input-group">
-                <label class="input-label">手机号</label>
-                <input 
-                  class="form-input" 
-                  type="tel" 
-                  placeholder="请输入11位手机号" 
-                  v-model.trim="phone" 
-                  maxlength="11" 
-                />
-              </div>
-              
-              <!-- 手机+验证码登录 -->
-              <div class="input-group">
-                <label class="input-label">验证码</label>
-                <div class="code-row">
-                  <input 
-                    class="form-input code-input" 
-                    placeholder="请输入验证码" 
-                    v-model.trim="code" 
-                    maxlength="6" 
-                  />
-                  <button 
-                    class="send-code-btn" 
-                    :disabled="!canSend" 
-                    @click="handleSendCode"
-                  >
-                    <span v-if="!counting">{{ sending ? '发送中...' : '获取验证码' }}</span>
-                    <span v-else>{{ count }}s 后重发</span>
-                  </button>
-                </div>
-              </div>
-
-              <!-- 密码登录（已注释） -->
-              <!-- <div class="input-group">
-                <label class="input-label">密码</label>
-                <input 
-                  class="form-input" 
-                  type="password" 
-                  placeholder="请输入密码" 
-                  v-model.trim="password" 
-                  maxlength="16" 
-                />
-              </div> -->
-
-              <div class="form-actions">
-                <button class="forgot-btn" @click="switchPage(PAGE_TYPE.RESET)">
-                  忘记密码？
-                </button>
-              </div>
-
-              <button 
-                class="submit-btn" 
-                :disabled="!canSubmit" 
-                @click="handleSubmit"
-              >
-                {{ loading ? '登录中...' : '立即登录' }}
-              </button>
-
-              <div class="register-tip">
-                还没有账户？<button class="link-btn" @click="switchPage(PAGE_TYPE.REGISTER)">立即注册</button>
-              </div>
-            </div>
-
-            <!-- 注册表单 -->
-            <div v-else-if="page === PAGE_TYPE.REGISTER" class="auth-form">
-              <div class="form-actions">
-                <button class="back-btn" @click="switchPage(PAGE_TYPE.LOGIN)">
-                  ← 返回登录
-                </button>
-              </div>
-              
-              <div class="input-group">
-                <label class="input-label">手机号</label>
-                <input 
-                  class="form-input" 
-                  type="tel" 
-                  placeholder="请输入11位手机号" 
-                  v-model.trim="phone" 
-                  maxlength="11" 
-                />
-              </div>
-              
-              <div class="input-group">
-                <label class="input-label">验证码</label>
-                <div class="code-row">
-                  <input 
-                    class="form-input code-input" 
-                    placeholder="请输入验证码" 
-                    v-model.trim="code" 
-                    maxlength="6" 
-                  />
-                  <button 
-                    class="send-code-btn" 
-                    :disabled="!canSend" 
-                    @click="handleSendCode"
-                  >
-                    <span v-if="!counting">{{ sending ? '发送中...' : '获取验证码' }}</span>
-                    <span v-else>{{ count }}s 后重发</span>
-                  </button>
-                </div>
-              </div>
-
-              <div class="input-group">
-                <label class="input-label">设置密码</label>
-                <input 
-                  class="form-input" 
-                  type="password" 
-                  placeholder="请设置4-16位密码" 
-                  v-model.trim="password" 
-                  maxlength="16" 
-                />
-              </div>
-
-              <div class="input-group">
-                <label class="input-label">确认密码</label>
-                <input 
-                  class="form-input" 
-                  type="password" 
-                  placeholder="请再次输入密码" 
-                  v-model.trim="confirmPassword" 
-                  maxlength="16" 
-                />
-              </div>
-
-              <button 
-                class="submit-btn" 
-                :disabled="!canSubmit" 
-                @click="handleSubmit"
-              >
-                {{ loading ? '注册中...' : '立即注册' }}
-              </button>
-
-              <div class="login-tip">
-                已有账户？<button class="link-btn" @click="switchPage(PAGE_TYPE.LOGIN)">立即登录</button>
-              </div>
-            </div>
-
-            <!-- 重置密码表单 -->
-            <div v-else class="auth-form">
-              <div class="form-actions">
-                <button class="back-btn" @click="switchPage(PAGE_TYPE.LOGIN)">
-                  ← 返回登录
-                </button>
-              </div>
-              
-              <div class="input-group">
-                <label class="input-label">手机号</label>
-                <input 
-                  class="form-input" 
-                  type="tel" 
-                  placeholder="请输入11位手机号" 
-                  v-model.trim="phone" 
-                  maxlength="11" 
-                />
-              </div>
-              
-              <div class="input-group">
-                <label class="input-label">验证码</label>
-                <div class="code-row">
-                  <input 
-                    class="form-input code-input" 
-                    placeholder="请输入验证码" 
-                    v-model.trim="code" 
-                    maxlength="6" 
-                  />
-                  <button 
-                    class="send-code-btn" 
-                    :disabled="!canSend" 
-                    @click="handleSendCode"
-                  >
-                    <span v-if="!counting">{{ sending ? '发送中...' : '获取验证码' }}</span>
-                    <span v-else>{{ count }}s 后重发</span>
-                  </button>
-                </div>
-              </div>
-
-              <div class="input-group">
-                <label class="input-label">新密码</label>
-                <input 
-                  class="form-input" 
-                  type="password" 
-                  placeholder="请设置4-16位新密码" 
-                  v-model.trim="password" 
-                  maxlength="16" 
-                />
-              </div>
-
-              <div class="input-group">
-                <label class="input-label">确认新密码</label>
-                <input 
-                  class="form-input" 
-                  type="password" 
-                  placeholder="请再次输入新密码" 
-                  v-model.trim="confirmPassword" 
-                  maxlength="16" 
-                />
-              </div>
-
-              <button 
-                class="submit-btn" 
-                :disabled="!canSubmit" 
-                @click="handleSubmit"
-              >
-                {{ loading ? '重置中...' : '重置密码' }}
-              </button>
-
-              <div class="login-tip">
-                记起密码了？<button class="link-btn" @click="switchPage(PAGE_TYPE.LOGIN)">返回登录</button>
-              </div>
-            </div>
-
-            <!-- 协议同意 -->
-            <div class="agreement">
-              <label class="agreement-label">
-                <input type="checkbox" v-model="agree" />
-                <span class="agreement-text">
-                  我已阅读并同意 
-                  <a href="javascript:void(0)" class="agreement-link">《用户协议》</a> 
-                  和 
-                  <a href="javascript:void(0)" class="agreement-link">《隐私政策》</a>
-                </span>
-              </label>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </transition>
-</template>
-
-<style scoped>
-.fade-enter-active, .fade-leave-active { 
-  transition: opacity 0.3s ease; 
-}
-.fade-enter-from, .fade-leave-to { 
-  opacity: 0; 
-}
-
-.login-mask {
-  position: fixed;
-  inset: 0;
-  background: rgba(0, 0, 0, 0.6);
-  backdrop-filter: blur(8px);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  z-index: 1000;
-  padding: 20px;
-}
-
-.login-modal {
-  width: 100%;
-  max-width: 1000px;
-  height: 800px;
-  background: var(--color-surface);
-  border-radius: 20px;
-  overflow: hidden;
-  display: flex;
-  border: 1px solid var(--color-border);
-  box-shadow: 0 25px 80px rgba(0, 0, 0, 0.4);
-}
-
-/* 左侧品牌区域 */
-.brand-pane {
-  width: 50%;
-  height: 100%;
-  background: linear-gradient(135deg, var(--color-gray-900) 0%, var(--color-gray-800) 100%);
-  position: relative;
-  overflow: hidden;
-}
-
-.brand-pane::before {
-  content: '';
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: 
-    radial-gradient(circle at 20% 20%, rgba(0, 176, 48, 0.15) 0%, transparent 50%),
-    radial-gradient(circle at 80% 80%, rgba(26, 102, 224, 0.12) 0%, transparent 50%);
-  pointer-events: none;
-}
-
-.brand-content {
-  position: relative;
-  z-index: 1;
-  height: 100%;
-  padding: 50px 50px;
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-}
-
-.brand-logo {
-  margin-bottom: 30px;
-}
-
-.brand-logo img {
-  width: 80px;
-  height: 80px;
-  border-radius: 16px;
-  box-shadow: var(--shadow-blue);
-}
-
-.brand-title {
-  font-size: 36px;
-  font-weight: 800;
-  color: var(--color-primary);
-  margin-bottom: 12px;
-  letter-spacing: -0.5px;
-}
-
-.brand-subtitle {
-  font-size: 18px;
-  color: var(--color-text-secondary);
-  margin-bottom: 40px;
-  opacity: 0.9;
-}
-
-.brand-features {
-  display: flex;
-  flex-direction: column;
-  gap: 24px;
-}
-
-.feature-item {
-  display: flex;
-  align-items: center;
-  gap: 16px;
-}
-
-.feature-icon {
-  font-size: 24px;
-  width: 40px;
-  height: 40px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  background: var(--color-gray-800);
-  border-radius: 10px;
-  border: 1px solid var(--color-gray-700);
-}
-
-.feature-text {
-  font-size: 16px;
-  color: var(--color-text);
-  font-weight: 500;
-}
-
-/* 右侧表单区域 */
-.form-pane {
-  width: 50%;
-  height: 100%;
-  background: var(--color-surface);
-  position: relative;
-}
-
-.form-header {
-  position: absolute;
-  top: 24px;
-  right: 24px;
-  z-index: 10;
-}
-
-.close-btn {
-  width: 40px;
-  height: 40px;
-  border: none;
-  background: var(--color-gray-100);
-  border-radius: 10px;
-  color: var(--color-text-secondary);
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  transition: all 0.2s ease;
-}
-
-.close-btn:hover {
-  background: var(--color-gray-200);
-  color: var(--color-text);
-}
-
-.form-content {
-  height: 100%;
-  padding: 25px 50px;
-  display: flex;
-  flex-direction: column;
-  justify-content: flex-start;
-  overflow-y: auto;
-}
-
-/* 页面切换 */
-.page-tabs {
-  display: flex;
-  gap: 8px;
-  margin-bottom: 12px;
-  background: var(--color-gray-50);
-  padding: 4px;
-  border-radius: 12px;
-  border: 1px solid var(--color-border);
-}
-
-.tab-btn {
-  flex: 1;
-  height: 40px;
-  border: none;
-  background: transparent;
-  color: var(--color-text-secondary);
-  font-size: 14px;
-  font-weight: 500;
-  cursor: pointer;
-  border-radius: 8px;
-  transition: all 0.2s ease;
-}
-
-.tab-btn.active {
-  background: var(--color-primary);
-  color: white;
-  box-shadow: var(--shadow-sm);
-}
-
-/* 表单标题 */
-.form-title {
-  margin-bottom: 16px;
-  margin-top: 6px;
-}
-
-.form-title h2 {
-  font-size: 28px;
-  font-weight: 700;
-  color: var(--color-text);
-  margin: 0 0 8px 0;
-  letter-spacing: -0.5px;
-}
-
-.form-desc {
-  font-size: 16px;
-  color: var(--color-text-secondary);
-  margin: 0;
-  line-height: 1.5;
-}
-
-/* 表单样式 */
-.auth-form {
-  display: flex;
-  flex-direction: column;
-  gap: 14px;
-}
-
-.input-group {
-  display: flex;
-  flex-direction: column;
-  gap: 8px;
-}
-
-.input-label {
-  font-size: 14px;
-  font-weight: 500;
-  color: var(--color-text);
-}
-
-.form-input {
-  height: 48px;
-  padding: 0 16px;
-  border-radius: 12px;
-  border: 1px solid var(--color-border);
-  background: var(--color-surface);
-  color: var(--color-text);
-  font-size: 16px;
-  transition: all 0.2s ease;
-}
-
-.form-input:focus {
-  outline: none;
-  border-color: var(--color-primary);
-  background: var(--color-surface);
-  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
-}
-
-.form-input::placeholder {
-  color: var(--color-text-secondary);
-}
-
-/* 验证码行 */
-.code-row {
-  display: flex;
-  gap: 12px;
-}
-
-.code-input {
-  flex: 1;
-}
-
-.send-code-btn {
-  width: 120px;
-  height: 48px;
-  border: 1px solid var(--color-border);
-  background: var(--color-surface);
-  color: var(--color-text);
-  border-radius: 12px;
-  font-size: 14px;
-  cursor: pointer;
-  transition: all 0.2s ease;
-}
-
-.send-code-btn:hover:not(:disabled) {
-  background: var(--color-gray-50);
-  border-color: var(--color-primary);
-}
-
-.send-code-btn:disabled {
-  opacity: 0.5;
-  cursor: not-allowed;
-}
-
-/* 表单操作 */
-.form-actions {
-  display: flex;
-  justify-content: flex-start;
-  margin-bottom: 8px;
-}
-
-.form-actions:has(.forgot-btn) {
-  justify-content: flex-end;
-  margin-top: -8px;
-  margin-bottom: 0;
-}
-
-.forgot-btn {
-  background: none;
-  border: none;
-  color: var(--color-primary);
-  font-size: 14px;
-  cursor: pointer;
-  text-decoration: underline;
-  transition: color 0.2s ease;
-}
-
-.forgot-btn:hover {
-  color: var(--color-primary-hover);
-}
-
-.back-btn {
-  background: none;
-  border: none;
-  color: var(--color-text-secondary);
-  font-size: 13px;
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  gap: 4px;
-  padding: 4px 8px;
-  border-radius: 6px;
-  transition: all 0.2s ease;
-}
-
-.back-btn:hover {
-  background: var(--color-gray-50);
-  color: var(--color-text);
-}
-
-/* 提交按钮 */
-.submit-btn {
-  height: 52px;
-  border: none;
-  background: var(--color-primary);
-  color: white;
-  border-radius: 12px;
-  font-size: 16px;
-  font-weight: 600;
-  cursor: pointer;
-  margin-top: 8px;
-  transition: all 0.2s ease;
-  box-shadow: var(--shadow-blue);
-}
-
-.submit-btn:hover:not(:disabled) {
-  background: var(--color-primary-hover);
-  transform: translateY(-1px);
-  box-shadow: var(--shadow-blue);
-}
-
-.submit-btn:disabled {
-  opacity: 0.6;
-  cursor: not-allowed;
-  transform: none;
-}
-
-/* 提示文本 */
-.register-tip,
-.login-tip {
-  text-align: center;
-  font-size: 14px;
-  color: var(--color-text-secondary);
-  margin-top: 16px;
-}
-
-.link-btn {
-  background: none;
-  border: none;
-  color: var(--color-primary);
-  cursor: pointer;
-  text-decoration: underline;
-  font-size: inherit;
-  transition: color 0.2s ease;
-}
-
-.link-btn:hover {
-  color: var(--color-primary-hover);
-}
-
-/* 协议同意 */
-.agreement {
-  margin-top: 8px;
-}
-
-.agreement-label {
-  display: flex;
-  align-items: flex-start;
-  gap: 12px;
-  cursor: pointer;
-}
-
-.agreement-label input[type="checkbox"] {
-  margin: 0;
-  width: 16px;
-  height: 16px;
-  accent-color: var(--color-primary);
-}
-
-.agreement-text {
-  font-size: 13px;
-  color: var(--color-text-secondary);
-  line-height: 1.4;
-}
-
-.agreement-link {
-  color: var(--color-primary);
-  text-decoration: underline;
-  transition: color 0.2s ease;
-}
-
-.agreement-link:hover {
-  color: var(--color-primary-hover);
-}
-
-/* 响应式设计 */
-@media (max-width: 768px) {
-  .login-modal {
-    flex-direction: column;
-    height: auto;
-    max-height: 90vh;
-    overflow-y: auto;
-  }
-  
-  .brand-pane {
-    width: 100%;
-    height: 200px;
-  }
-  
-  .brand-content {
-    padding: 30px 20px;
-    flex-direction: row;
-    align-items: center;
-    gap: 20px;
-  }
-  
-  .brand-logo img {
-    width: 60px;
-    height: 60px;
-  }
-  
-  .brand-title {
-    font-size: 24px;
-    margin-bottom: 4px;
-  }
-  
-  .brand-subtitle {
-    font-size: 14px;
-    margin-bottom: 0;
-  }
-  
-  .brand-features {
-    display: none;
-  }
-  
-  .form-pane {
-    width: 100%;
-  }
-  
-  .form-content {
-    padding: 30px 20px;
-  }
-  
-  .form-title h2 {
-    font-size: 24px;
-  }
-}
-</style>
diff --git a/frontend/app/web-gold/src/components/MyFavoritesModal.vue b/frontend/app/web-gold/src/components/MyFavoritesModal.vue
deleted file mode 100644
index a9a0a11df4..0000000000
--- a/frontend/app/web-gold/src/components/MyFavoritesModal.vue
+++ /dev/null
@@ -1,306 +0,0 @@
-<template>
-  <a-modal
-    :open="visible"
-    title="我创建的"
-    :width="700"
-    :footer="null"
-    @cancel="handleClose"
-  >
-    <div class="favorites-content">
-      <!-- 操作栏 -->
-      <div class="action-bar">
-        <a-button type="primary" @click="handleCreate">
-          <template #icon><PlusOutlined /></template>
-          新建风格
-        </a-button>
-        <a-button @click="loadList" :loading="loading">
-          <template #icon><ReloadOutlined /></template>
-          刷新
-        </a-button>
-      </div>
-
-      <!-- 列表 -->
-      <div class="favorites-list" v-if="!loading && list.length > 0">
-        <div
-          v-for="item in list"
-          :key="item.id"
-          class="favorite-card"
-        >
-          <div class="card-header">
-            <span class="card-name">{{ item.name }}</span>
-            <div class="card-actions">
-              <a-button type="link" size="small" @click="handleEdit(item)">编辑</a-button>
-              <a-popconfirm
-                title="确定删除此风格？"
-                @confirm="handleDelete(item.id)"
-              >
-                <a-button type="link" size="small" danger>删除</a-button>
-              </a-popconfirm>
-            </div>
-          </div>
-          <div class="card-content">{{ item.content }}</div>
-          <div class="card-footer">
-            <span class="card-category" v-if="item.category">{{ item.category }}</span>
-            <span class="card-use-count">使用 {{ item.useCount || 0 }} 次</span>
-          </div>
-        </div>
-      </div>
-
-      <!-- 空状态 -->
-      <div class="empty-state" v-if="!loading && list.length === 0">
-        <p>暂无收藏的风格</p>
-        <a-button type="primary" @click="handleCreate">立即创建</a-button>
-      </div>
-
-      <!-- 加载状态 -->
-      <div class="loading-state" v-if="loading">
-        <a-spin />
-        <span>加载中...</span>
-      </div>
-    </div>
-
-    <!-- 编辑弹窗 -->
-    <a-modal
-      v-model:open="editVisible"
-      :title="editingItem ? '编辑风格' : '新建风格'"
-      :width="500"
-      @ok="handleSave"
-      :confirmLoading="saving"
-    >
-      <a-form layout="vertical">
-        <a-form-item label="风格名称" required>
-          <a-input v-model:value="editForm.name" placeholder="请输入风格名称" />
-        </a-form-item>
-        <a-form-item label="风格内容" required>
-          <a-textarea
-            v-model:value="editForm.content"
-            :rows="6"
-            placeholder="请输入风格提示词内容"
-          />
-        </a-form-item>
-        <a-form-item label="分类">
-          <a-input v-model:value="editForm.category" placeholder="可选，用于分类管理" />
-        </a-form-item>
-      </a-form>
-    </a-modal>
-  </a-modal>
-</template>
-
-<script setup>
-import { ref, watch } from 'vue'
-import { message } from 'ant-design-vue'
-import { PlusOutlined, ReloadOutlined } from '@ant-design/icons-vue'
-import { UserPromptApi } from '@/api/userPrompt'
-
-const props = defineProps({
-  visible: {
-    type: Boolean,
-    default: false
-  }
-})
-
-const emit = defineEmits(['update:visible', 'refresh'])
-
-const loading = ref(false)
-const list = ref([])
-const editVisible = ref(false)
-const editingItem = ref(null)
-const saving = ref(false)
-
-const editForm = ref({
-  name: '',
-  content: '',
-  category: ''
-})
-
-// 加载列表
-async function loadList() {
-  loading.value = true
-  try {
-    const res = await UserPromptApi.getUserPromptList()
-    if (res.code === 0) {
-      list.value = res.data || []
-    }
-  } catch (error) {
-    console.error('加载列表失败:', error)
-  } finally {
-    loading.value = false
-  }
-}
-
-// 创建新风格
-function handleCreate() {
-  editingItem.value = null
-  editForm.value = {
-    name: '',
-    content: '',
-    category: ''
-  }
-  editVisible.value = true
-}
-
-// 编辑风格
-function handleEdit(item) {
-  editingItem.value = item
-  editForm.value = {
-    name: item.name,
-    content: item.content,
-    category: item.category || ''
-  }
-  editVisible.value = true
-}
-
-// 保存风格
-async function handleSave() {
-  if (!editForm.value.name.trim()) {
-    message.warning('请输入风格名称')
-    return
-  }
-  if (!editForm.value.content.trim()) {
-    message.warning('请输入风格内容')
-    return
-  }
-
-  saving.value = true
-  try {
-    const data = {
-      name: editForm.value.name.trim(),
-      content: editForm.value.content.trim(),
-      category: editForm.value.category.trim() || null,
-      status: 1
-    }
-
-    if (editingItem.value) {
-      // 更新
-      await UserPromptApi.updateUserPrompt({
-        id: editingItem.value.id,
-        ...data
-      })
-      message.success('更新成功')
-    } else {
-      // 创建
-      await UserPromptApi.createUserPrompt(data)
-      message.success('创建成功')
-    }
-
-    editVisible.value = false
-    loadList()
-    emit('refresh')
-  } catch (error) {
-    console.error('保存失败:', error)
-    message.error('保存失败')
-  } finally {
-    saving.value = false
-  }
-}
-
-// 删除风格
-async function handleDelete(id) {
-  try {
-    await UserPromptApi.deleteUserPrompt(id)
-    message.success('删除成功')
-    loadList()
-    emit('refresh')
-  } catch (error) {
-    console.error('删除失败:', error)
-    message.error('删除失败')
-  }
-}
-
-// 关闭弹窗
-function handleClose() {
-  emit('update:visible', false)
-}
-
-// 监听 visible 变化
-watch(() => props.visible, (newVal) => {
-  if (newVal) {
-    loadList()
-  }
-})
-</script>
-
-<style scoped lang="less">
-.favorites-content {
-  min-height: 300px;
-}
-
-.action-bar {
-  display: flex;
-  gap: 12px;
-  margin-bottom: 16px;
-}
-
-.favorites-list {
-  display: grid;
-  gap: 12px;
-}
-
-.favorite-card {
-  padding: 16px;
-  border: 1px solid var(--color-border);
-  border-radius: 8px;
-  background: var(--color-surface);
-  transition: all 0.2s;
-
-  &:hover {
-    border-color: var(--color-primary);
-    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
-  }
-}
-
-.card-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 8px;
-}
-
-.card-name {
-  font-weight: 600;
-  font-size: 15px;
-  color: var(--color-text);
-}
-
-.card-actions {
-  display: flex;
-  gap: 4px;
-}
-
-.card-content {
-  color: var(--color-text-secondary);
-  font-size: 13px;
-  line-height: 1.6;
-  display: -webkit-box;
-  -webkit-line-clamp: 3;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-  margin-bottom: 12px;
-}
-
-.card-footer {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  font-size: 12px;
-  color: var(--color-text-tertiary);
-}
-
-.card-category {
-  padding: 2px 8px;
-  background: rgba(24, 144, 255, 0.1);
-  color: #1890ff;
-  border-radius: 10px;
-}
-
-.empty-state,
-.loading-state {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  padding: 60px 20px;
-  color: var(--color-text-secondary);
-  gap: 16px;
-}
-</style>
diff --git a/frontend/app/web-gold/src/components/material/MaterialBatchGroupModal.vue b/frontend/app/web-gold/src/components/material/MaterialBatchGroupModal.vue
deleted file mode 100644
index 0d36bc8a34..0000000000
--- a/frontend/app/web-gold/src/components/material/MaterialBatchGroupModal.vue
+++ /dev/null
@@ -1,97 +0,0 @@
-<template>
-  <a-modal
-    v-model:open="modalVisible"
-    title="批量分组"
-    centered
-    @ok="handleConfirm"
-    @cancel="handleCancel"
-  >
-    <a-form layout="vertical">
-      <a-form-item label="选择分组" required>
-        <a-select
-          v-model:value="selectedGroupId"
-          placeholder="请选择要添加到的分组"
-          style="width: 100%"
-        >
-          <a-select-option v-for="group in groupList" :key="group.id" :value="group.id">
-            {{ group.name }}
-          </a-select-option>
-        </a-select>
-      </a-form-item>
-      <div style="margin-top: 16px; padding: 12px; background: var(--color-bg-2); border-radius: var(--radius-card);">
-        <p style="margin: 0; font-size: 13px; color: var(--color-text-2);">
-          {{ groupingInfo }}
-        </p>
-      </div>
-    </a-form>
-  </a-modal>
-</template>
-
-<script setup>
-import { ref, watch, computed } from 'vue'
-import { message } from 'ant-design-vue'
-
-const props = defineProps({
-  open: {
-    type: Boolean,
-    default: false
-  },
-  groupList: {
-    type: Array,
-    default: () => []
-  },
-  // 可选的信息，组件会显示但不会强依赖
-  fileName: {
-    type: String,
-    default: ''
-  },
-  fileCount: {
-    type: Number,
-    default: 0
-  }
-})
-
-const emit = defineEmits(['update:open', 'confirm', 'cancel'])
-
-// 数据
-const selectedGroupId = ref(null)
-const modalVisible = ref(false)
-
-// 计算分组提示信息
-const groupingInfo = computed(() => {
-  if (props.fileName) {
-    return `将为文件 "${props.fileName}" 添加到选中的分组中`
-  }
-  if (props.fileCount > 0) {
-    return `将为 ${props.fileCount} 个文件添加到选中的分组中`
-  }
-  return '将为选中文件添加到选中的分组中'
-})
-
-// 监听 open 变化
-watch(() => props.open, (newVal) => {
-  modalVisible.value = newVal
-  if (!newVal) {
-    selectedGroupId.value = null
-  }
-})
-
-// 处理确认
-const handleConfirm = () => {
-  if (!selectedGroupId.value) {
-    message.warning('请选择分组')
-    return
-  }
-
-  emit('confirm', selectedGroupId.value)
-  handleCancel()
-}
-
-// 处理取消
-const handleCancel = () => {
-  modalVisible.value = false
-  selectedGroupId.value = null
-  emit('update:open', false)
-  emit('cancel')
-}
-</script>
diff --git a/frontend/app/web-gold/src/components/material/MaterialMixModal.vue b/frontend/app/web-gold/src/components/material/MaterialMixModal.vue
deleted file mode 100644
index f27486235e..0000000000
--- a/frontend/app/web-gold/src/components/material/MaterialMixModal.vue
+++ /dev/null
@@ -1,197 +0,0 @@
-<template>
-  <a-modal
-    v-model:open="modalVisible"
-    title="素材混剪"
-    centered
-    :confirm-loading="loading"
-    ok-text="确定"
-    cancel-text="取消"
-    @ok="handleConfirm"
-    @cancel="handleCancel"
-  >
-    <div class="mix-modal__summary">
-      <p>视频分组：{{ getGroupName(videoGroupId) || '未选择' }}</p>
-      <p>视频数量：{{ videoGroupFiles.length }} 个</p>
-      <p style="margin-top: 8px; font-size: 12px; color: var(--color-text-3);">
-        纯画面模式：仅拼接视频片段，无配音、无背景音乐
-      </p>
-    </div>
-    <a-form layout="vertical">
-      <a-form-item label="选择视频分组" required>
-        <a-select
-          v-model:value="videoGroupId"
-          placeholder="请选择视频分组"
-          style="width: 100%"
-          @change="handleVideoGroupChange"
-        >
-          <a-select-option v-for="group in groupList" :key="group.id" :value="group.id">
-            {{ group.name }}
-          </a-select-option>
-        </a-select>
-      </a-form-item>
-
-      <a-form-item label="视频标题" required>
-        <a-input v-model:value="mixForm.title" placeholder="请输入生成视频标题（仅用于记录）" />
-        <div style="margin-top: 8px; font-size: 12px; color: var(--color-text-3);">
-          标题仅用于任务记录，不会在视频上显示
-        </div>
-      </a-form-item>
-    </a-form>
-  </a-modal>
-</template>
-
-<script setup>
-import { ref, reactive, watch, computed } from 'vue'
-import { message } from 'ant-design-vue'
-import { MaterialService } from '@/api/material'
-
-const props = defineProps({
-  open: {
-    type: Boolean,
-    default: false
-  },
-  loading: {
-    type: Boolean,
-    default: false
-  },
-  groupList: {
-    type: Array,
-    default: () => []
-  }
-})
-
-const emit = defineEmits(['update:open', 'confirm', 'cancel'])
-
-// 数据
-const modalVisible = ref(false)
-const videoGroupId = ref(null)
-const videoGroupFiles = ref([])
-
-const mixForm = reactive({
-  title: ''
-})
-
-// 获取分组名称
-const getGroupName = (groupId) => {
-  if (!groupId) return ''
-  const group = props.groupList.find(g => g.id === groupId)
-  return group?.name || ''
-}
-
-// 监听 open 变化
-watch(() => props.open, (newVal) => {
-  modalVisible.value = newVal
-  if (newVal) {
-    resetForm()
-  }
-})
-
-// 处理视频分组变化
-const handleVideoGroupChange = async (groupId) => {
-  console.log('[MaterialMixModal] handleVideoGroupChange called with groupId:', groupId)
-
-  if (!groupId) {
-    videoGroupFiles.value = []
-    console.log('[MaterialMixModal] groupId is empty, videoGroupFiles cleared')
-    return
-  }
-
-  console.log('[MaterialMixModal] Loading video files for group:', groupId)
-
-  try {
-    const res = await MaterialService.getFilePage({
-      pageNo: 1,
-      pageSize: 100,
-      groupId: groupId,
-      fileCategory: 'video'
-    })
-    if (res.code === 0) {
-      videoGroupFiles.value = res.data.list || []
-      console.log('[MaterialMixModal] Loaded video files:', videoGroupFiles.value.length, 'files')
-    } else {
-      console.error('[MaterialMixModal] Failed to load video files:', res.msg)
-      message.error(res.msg || '加载分组文件失败')
-    }
-  } catch (error) {
-    console.error('[MaterialMixModal] Error loading video files:', error)
-    message.error('加载分组文件失败')
-  }
-}
-
-// 重置表单
-const resetForm = () => {
-  mixForm.title = ''
-  videoGroupId.value = null
-  videoGroupFiles.value = []
-}
-
-// 暴露给父组件的方法
-defineExpose({
-  resetForm
-})
-
-// 处理确认
-const handleConfirm = async () => {
-  const title = mixForm.title.trim()
-
-  if (!videoGroupId.value) {
-    message.warning('请选择视频分组')
-    return
-  }
-  if (!title) {
-    message.warning('请输入视频标题')
-    return
-  }
-
-  // 如果当前没有视频文件，重新加载一次
-  if (videoGroupFiles.value.length === 0) {
-    message.loading('正在加载视频文件...', 0)
-    await handleVideoGroupChange(videoGroupId.value)
-    message.destroy()
-  }
-
-  if (videoGroupFiles.value.length === 0) {
-    message.warning('所选分组下没有视频文件，请检查分组设置或更换分组')
-    return
-  }
-
-  // 提取视频URL
-  const videoUrls = videoGroupFiles.value
-    .map(file => file?.fileUrl || file?.imgUrl)
-    .filter(Boolean)
-
-  if (videoUrls.length === 0) {
-    message.warning('视频分组中没有有效的视频文件')
-    return
-  }
-
-  emit('confirm', {
-    title,
-    videoUrls
-  })
-}
-
-// 处理取消
-const handleCancel = () => {
-  modalVisible.value = false
-  emit('update:open', false)
-  emit('cancel')
-}
-</script>
-
-<style scoped>
-.mix-modal__summary {
-  margin-bottom: 16px;
-  padding: 12px;
-  background: var(--color-bg-2);
-  border: 1px dashed var(--color-border);
-  border-radius: var(--radius-card);
-  font-size: 13px;
-  color: var(--color-text-2);
-}
-
-.mix-modal__summary p {
-  margin: 0;
-  line-height: 1.6;
-}
-</style>