feat(notify): add balance low & account quota notification system

- User balance low notification: email alert when balance drops below
  configurable threshold (user email + verified extra emails)
- Account quota notification: broadcast email to admin-configured
  recipients when daily/weekly/total quota usage exceeds alert threshold
- Admin settings: global enable/disable, default threshold, quota
  notification email list (Email Settings tab)
- User profile: enable/disable, custom threshold, add/remove extra
  notification emails with verification code flow
- Account quota: per-dimension alert toggle and threshold in quota
  control card
- Trigger logic: first-crossing only (old >= threshold && new < threshold
  for balance; old < threshold && new >= threshold for quota), naturally
  prevents duplicate notifications without Redis dedup

frontend/src/components/account/EditAccountModal.vue

@@ -1186,6 +1186,12 @@
           :weeklyResetDay="editWeeklyResetDay"
           :weeklyResetHour="editWeeklyResetHour"
           :resetTimezone="editResetTimezone"
+          :quotaNotifyDailyEnabled="editQuotaNotifyDailyEnabled"
+          :quotaNotifyDailyThreshold="editQuotaNotifyDailyThreshold"
+          :quotaNotifyWeeklyEnabled="editQuotaNotifyWeeklyEnabled"
+          :quotaNotifyWeeklyThreshold="editQuotaNotifyWeeklyThreshold"
+          :quotaNotifyTotalEnabled="editQuotaNotifyTotalEnabled"
+          :quotaNotifyTotalThreshold="editQuotaNotifyTotalThreshold"
           @update:totalLimit="editQuotaLimit = $event"
           @update:dailyLimit="editQuotaDailyLimit = $event"
           @update:weeklyLimit="editQuotaWeeklyLimit = $event"
@@ -1195,6 +1201,12 @@
           @update:weeklyResetDay="editWeeklyResetDay = $event"
           @update:weeklyResetHour="editWeeklyResetHour = $event"
           @update:resetTimezone="editResetTimezone = $event"
+          @update:quotaNotifyDailyEnabled="editQuotaNotifyDailyEnabled = $event"
+          @update:quotaNotifyDailyThreshold="editQuotaNotifyDailyThreshold = $event"
+          @update:quotaNotifyWeeklyEnabled="editQuotaNotifyWeeklyEnabled = $event"
+          @update:quotaNotifyWeeklyThreshold="editQuotaNotifyWeeklyThreshold = $event"
+          @update:quotaNotifyTotalEnabled="editQuotaNotifyTotalEnabled = $event"
+          @update:quotaNotifyTotalThreshold="editQuotaNotifyTotalThreshold = $event"
         />
       </div>
       <!-- 配额控制 (非 Anthropic apikey/bedrock) -->
@@ -1218,6 +1230,12 @@
           :weeklyResetDay="editWeeklyResetDay"
           :weeklyResetHour="editWeeklyResetHour"
           :resetTimezone="editResetTimezone"
+          :quotaNotifyDailyEnabled="editQuotaNotifyDailyEnabled"
+          :quotaNotifyDailyThreshold="editQuotaNotifyDailyThreshold"
+          :quotaNotifyWeeklyEnabled="editQuotaNotifyWeeklyEnabled"
+          :quotaNotifyWeeklyThreshold="editQuotaNotifyWeeklyThreshold"
+          :quotaNotifyTotalEnabled="editQuotaNotifyTotalEnabled"
+          :quotaNotifyTotalThreshold="editQuotaNotifyTotalThreshold"
           @update:totalLimit="editQuotaLimit = $event"
           @update:dailyLimit="editQuotaDailyLimit = $event"
           @update:weeklyLimit="editQuotaWeeklyLimit = $event"
@@ -1227,6 +1245,12 @@
           @update:weeklyResetDay="editWeeklyResetDay = $event"
           @update:weeklyResetHour="editWeeklyResetHour = $event"
           @update:resetTimezone="editResetTimezone = $event"
+          @update:quotaNotifyDailyEnabled="editQuotaNotifyDailyEnabled = $event"
+          @update:quotaNotifyDailyThreshold="editQuotaNotifyDailyThreshold = $event"
+          @update:quotaNotifyWeeklyEnabled="editQuotaNotifyWeeklyEnabled = $event"
+          @update:quotaNotifyWeeklyThreshold="editQuotaNotifyWeeklyThreshold = $event"
+          @update:quotaNotifyTotalEnabled="editQuotaNotifyTotalEnabled = $event"
+          @update:quotaNotifyTotalThreshold="editQuotaNotifyTotalThreshold = $event"
         />
       </div>
 
@@ -1960,6 +1984,12 @@ const editWeeklyResetMode = ref<'rolling' | 'fixed' | null>(null)
 const editWeeklyResetDay = ref<number | null>(null)
 const editWeeklyResetHour = ref<number | null>(null)
 const editResetTimezone = ref<string | null>(null)
+const editQuotaNotifyDailyEnabled = ref<boolean | null>(null)
+const editQuotaNotifyDailyThreshold = ref<number | null>(null)
+const editQuotaNotifyWeeklyEnabled = ref<boolean | null>(null)
+const editQuotaNotifyWeeklyThreshold = ref<number | null>(null)
+const editQuotaNotifyTotalEnabled = ref<boolean | null>(null)
+const editQuotaNotifyTotalThreshold = ref<number | null>(null)
 const openAIWSModeOptions = computed(() => [
   { value: OPENAI_WS_MODE_OFF, label: t('admin.accounts.openai.wsModeOff') },
   // TODO: ctx_pool 选项暂时隐藏，待测试完成后恢复
@@ -2159,6 +2189,13 @@ const syncFormFromAccount = (newAccount: Account | null) => {
     editWeeklyResetDay.value = (extra?.quota_weekly_reset_day as number) ?? null
     editWeeklyResetHour.value = (extra?.quota_weekly_reset_hour as number) ?? null
     editResetTimezone.value = (extra?.quota_reset_timezone as string) || null
+    // Load quota notify config
+    editQuotaNotifyDailyEnabled.value = (extra?.quota_notify_daily_enabled as boolean) ?? null
+    editQuotaNotifyDailyThreshold.value = (extra?.quota_notify_daily_threshold as number) ?? null
+    editQuotaNotifyWeeklyEnabled.value = (extra?.quota_notify_weekly_enabled as boolean) ?? null
+    editQuotaNotifyWeeklyThreshold.value = (extra?.quota_notify_weekly_threshold as number) ?? null
+    editQuotaNotifyTotalEnabled.value = (extra?.quota_notify_total_enabled as boolean) ?? null
+    editQuotaNotifyTotalThreshold.value = (extra?.quota_notify_total_threshold as number) ?? null
   } else {
     editQuotaLimit.value = null
     editQuotaDailyLimit.value = null
@@ -2169,6 +2206,12 @@ const syncFormFromAccount = (newAccount: Account | null) => {
     editWeeklyResetDay.value = null
     editWeeklyResetHour.value = null
     editResetTimezone.value = null
+    editQuotaNotifyDailyEnabled.value = null
+    editQuotaNotifyDailyThreshold.value = null
+    editQuotaNotifyWeeklyEnabled.value = null
+    editQuotaNotifyWeeklyThreshold.value = null
+    editQuotaNotifyTotalEnabled.value = null
+    editQuotaNotifyTotalThreshold.value = null
   }
 
   // Load antigravity model mapping (Antigravity 只支持映射模式)
@@ -2283,6 +2326,13 @@ const syncFormFromAccount = (newAccount: Account | null) => {
     editQuotaLimit.value = typeof bedrockExtra.quota_limit === 'number' ? bedrockExtra.quota_limit : null
     editQuotaDailyLimit.value = typeof bedrockExtra.quota_daily_limit === 'number' ? bedrockExtra.quota_daily_limit : null
     editQuotaWeeklyLimit.value = typeof bedrockExtra.quota_weekly_limit === 'number' ? bedrockExtra.quota_weekly_limit : null
+    // Load quota notify for bedrock
+    editQuotaNotifyDailyEnabled.value = (bedrockExtra.quota_notify_daily_enabled as boolean) ?? null
+    editQuotaNotifyDailyThreshold.value = (bedrockExtra.quota_notify_daily_threshold as number) ?? null
+    editQuotaNotifyWeeklyEnabled.value = (bedrockExtra.quota_notify_weekly_enabled as boolean) ?? null
+    editQuotaNotifyWeeklyThreshold.value = (bedrockExtra.quota_notify_weekly_threshold as number) ?? null
+    editQuotaNotifyTotalEnabled.value = (bedrockExtra.quota_notify_total_enabled as boolean) ?? null
+    editQuotaNotifyTotalThreshold.value = (bedrockExtra.quota_notify_total_threshold as number) ?? null
 
     // Load model mappings for bedrock
     const existingMappings = bedrockCreds.model_mapping as Record<string, string> | undefined
@@ -3198,6 +3248,40 @@ const handleSubmit = async () => {
       } else {
         delete newExtra.quota_reset_timezone
       }
+      // Quota notify config
+      if (editQuotaNotifyDailyEnabled.value) {
+        newExtra.quota_notify_daily_enabled = true
+        if (editQuotaNotifyDailyThreshold.value != null) {
+          newExtra.quota_notify_daily_threshold = editQuotaNotifyDailyThreshold.value
+        } else {
+          delete newExtra.quota_notify_daily_threshold
+        }
+      } else {
+        delete newExtra.quota_notify_daily_enabled
+        delete newExtra.quota_notify_daily_threshold
+      }
+      if (editQuotaNotifyWeeklyEnabled.value) {
+        newExtra.quota_notify_weekly_enabled = true
+        if (editQuotaNotifyWeeklyThreshold.value != null) {
+          newExtra.quota_notify_weekly_threshold = editQuotaNotifyWeeklyThreshold.value
+        } else {
+          delete newExtra.quota_notify_weekly_threshold
+        }
+      } else {
+        delete newExtra.quota_notify_weekly_enabled
+        delete newExtra.quota_notify_weekly_threshold
+      }
+      if (editQuotaNotifyTotalEnabled.value) {
+        newExtra.quota_notify_total_enabled = true
+        if (editQuotaNotifyTotalThreshold.value != null) {
+          newExtra.quota_notify_total_threshold = editQuotaNotifyTotalThreshold.value
+        } else {
+          delete newExtra.quota_notify_total_threshold
+        }
+      } else {
+        delete newExtra.quota_notify_total_enabled
+        delete newExtra.quota_notify_total_threshold
+      }
       updatePayload.extra = newExtra
     }
 

frontend/src/components/account/QuotaLimitCard.vue

@@ -4,7 +4,7 @@ import { useI18n } from 'vue-i18n'
 
 const { t } = useI18n()
 
-const props = defineProps<{
+const props = withDefaults(defineProps<{
   totalLimit: number | null
   dailyLimit: number | null
   weeklyLimit: number | null
@@ -14,7 +14,20 @@ const props = defineProps<{
   weeklyResetDay: number | null
   weeklyResetHour: number | null
   resetTimezone: string | null
-}>()
+  quotaNotifyDailyEnabled?: boolean | null
+  quotaNotifyDailyThreshold?: number | null
+  quotaNotifyWeeklyEnabled?: boolean | null
+  quotaNotifyWeeklyThreshold?: number | null
+  quotaNotifyTotalEnabled?: boolean | null
+  quotaNotifyTotalThreshold?: number | null
+}>(), {
+  quotaNotifyDailyEnabled: null,
+  quotaNotifyDailyThreshold: null,
+  quotaNotifyWeeklyEnabled: null,
+  quotaNotifyWeeklyThreshold: null,
+  quotaNotifyTotalEnabled: null,
+  quotaNotifyTotalThreshold: null,
+})
 
 const emit = defineEmits<{
   'update:totalLimit': [value: number | null]
@@ -26,6 +39,12 @@ const emit = defineEmits<{
   'update:weeklyResetDay': [value: number | null]
   'update:weeklyResetHour': [value: number | null]
   'update:resetTimezone': [value: string | null]
+  'update:quotaNotifyDailyEnabled': [value: boolean | null]
+  'update:quotaNotifyDailyThreshold': [value: number | null]
+  'update:quotaNotifyWeeklyEnabled': [value: boolean | null]
+  'update:quotaNotifyWeeklyThreshold': [value: number | null]
+  'update:quotaNotifyTotalEnabled': [value: boolean | null]
+  'update:quotaNotifyTotalThreshold': [value: number | null]
 }>()
 
 const enabled = computed(() =>
@@ -203,6 +222,36 @@ const onWeeklyModeChange = (e: Event) => {
               {{ t('admin.accounts.quotaDailyLimitHint') }}
             </template>
           </p>
+          <!-- 日配额告警 -->
+          <div v-if="dailyLimit && dailyLimit > 0" class="ml-4 mt-2 flex items-center gap-3">
+            <label class="text-sm text-gray-500 whitespace-nowrap">{{ t('admin.accounts.quotaNotify.alert') }}</label>
+            <button
+              type="button"
+              @click="emit('update:quotaNotifyDailyEnabled', !(props.quotaNotifyDailyEnabled))"
+              :class="[
+                'relative inline-flex h-5 w-9 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none',
+                props.quotaNotifyDailyEnabled ? 'bg-primary-600' : 'bg-gray-200 dark:bg-dark-600'
+              ]"
+            >
+              <span
+                :class="[
+                  'pointer-events-none inline-block h-4 w-4 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out',
+                  props.quotaNotifyDailyEnabled ? 'translate-x-4' : 'translate-x-0'
+                ]"
+              />
+            </button>
+            <div v-if="props.quotaNotifyDailyEnabled" class="relative flex-1">
+              <span class="absolute left-2 top-1/2 -translate-y-1/2 text-gray-400 text-sm">$</span>
+              <input
+                :value="props.quotaNotifyDailyThreshold"
+                @input="emit('update:quotaNotifyDailyThreshold', parseFloat(($event.target as HTMLInputElement).value) || null)"
+                type="number"
+                min="0"
+                step="0.01"
+                class="input pl-6 py-1 text-sm"
+              />
+            </div>
+          </div>
         </div>
 
         <!-- 周配额 -->
@@ -259,6 +308,36 @@ const onWeeklyModeChange = (e: Event) => {
               {{ t('admin.accounts.quotaWeeklyLimitHint') }}
             </template>
           </p>
+          <!-- 周配额告警 -->
+          <div v-if="weeklyLimit && weeklyLimit > 0" class="ml-4 mt-2 flex items-center gap-3">
+            <label class="text-sm text-gray-500 whitespace-nowrap">{{ t('admin.accounts.quotaNotify.alert') }}</label>
+            <button
+              type="button"
+              @click="emit('update:quotaNotifyWeeklyEnabled', !(props.quotaNotifyWeeklyEnabled))"
+              :class="[
+                'relative inline-flex h-5 w-9 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none',
+                props.quotaNotifyWeeklyEnabled ? 'bg-primary-600' : 'bg-gray-200 dark:bg-dark-600'
+              ]"
+            >
+              <span
+                :class="[
+                  'pointer-events-none inline-block h-4 w-4 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out',
+                  props.quotaNotifyWeeklyEnabled ? 'translate-x-4' : 'translate-x-0'
+                ]"
+              />
+            </button>
+            <div v-if="props.quotaNotifyWeeklyEnabled" class="relative flex-1">
+              <span class="absolute left-2 top-1/2 -translate-y-1/2 text-gray-400 text-sm">$</span>
+              <input
+                :value="props.quotaNotifyWeeklyThreshold"
+                @input="emit('update:quotaNotifyWeeklyThreshold', parseFloat(($event.target as HTMLInputElement).value) || null)"
+                type="number"
+                min="0"
+                step="0.01"
+                class="input pl-6 py-1 text-sm"
+              />
+            </div>
+          </div>
         </div>
 
         <!-- 时区选择（当任一维度使用固定模式时显示） -->
@@ -289,6 +368,36 @@ const onWeeklyModeChange = (e: Event) => {
             />
           </div>
           <p class="input-hint">{{ t('admin.accounts.quotaTotalLimitHint') }}</p>
+          <!-- 总配额告警 -->
+          <div v-if="totalLimit && totalLimit > 0" class="ml-4 mt-2 flex items-center gap-3">
+            <label class="text-sm text-gray-500 whitespace-nowrap">{{ t('admin.accounts.quotaNotify.alert') }}</label>
+            <button
+              type="button"
+              @click="emit('update:quotaNotifyTotalEnabled', !(props.quotaNotifyTotalEnabled))"
+              :class="[
+                'relative inline-flex h-5 w-9 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none',
+                props.quotaNotifyTotalEnabled ? 'bg-primary-600' : 'bg-gray-200 dark:bg-dark-600'
+              ]"
+            >
+              <span
+                :class="[
+                  'pointer-events-none inline-block h-4 w-4 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out',
+                  props.quotaNotifyTotalEnabled ? 'translate-x-4' : 'translate-x-0'
+                ]"
+              />
+            </button>
+            <div v-if="props.quotaNotifyTotalEnabled" class="relative flex-1">
+              <span class="absolute left-2 top-1/2 -translate-y-1/2 text-gray-400 text-sm">$</span>
+              <input
+                :value="props.quotaNotifyTotalThreshold"
+                @input="emit('update:quotaNotifyTotalThreshold', parseFloat(($event.target as HTMLInputElement).value) || null)"
+                type="number"
+                min="0"
+                step="0.01"
+                class="input pl-6 py-1 text-sm"
+              />
+            </div>
+          </div>
         </div>
       </div>
   </div>

frontend/src/components/user/profile/ProfileBalanceNotifyCard.vue

@@ -0,0 +1,204 @@
+<template>
+  <div class="card">
+    <div class="border-b border-gray-100 px-6 py-4 dark:border-dark-700">
+      <h2 class="text-lg font-medium text-gray-900 dark:text-white">
+        {{ t('profile.balanceNotify.title') }}
+      </h2>
+    </div>
+    <div class="px-6 py-6 space-y-6">
+      <!-- Enable toggle -->
+      <div class="flex items-center justify-between">
+        <div>
+          <label class="input-label">{{ t('profile.balanceNotify.enabled') }}</label>
+        </div>
+        <label class="relative inline-flex items-center cursor-pointer">
+          <input type="checkbox" v-model="notifyEnabled" @change="handleToggle" class="sr-only peer" />
+          <div class="w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-primary-300 dark:peer-focus:ring-primary-800 rounded-full peer dark:bg-gray-700 peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all dark:after:border-gray-600 peer-checked:bg-primary-600"></div>
+        </label>
+      </div>
+
+      <!-- Custom threshold -->
+      <div v-if="notifyEnabled">
+        <label class="input-label">
+          {{ t('profile.balanceNotify.threshold') }}
+          <span class="text-xs text-gray-400 ml-2">{{ t('profile.balanceNotify.thresholdHint') }}</span>
+        </label>
+        <div class="flex items-center gap-2">
+          <span class="text-gray-500">$</span>
+          <input
+            v-model.number="customThreshold"
+            type="number"
+            min="0"
+            step="0.01"
+            class="input flex-1"
+            :placeholder="t('profile.balanceNotify.thresholdPlaceholder')"
+            @blur="handleThresholdUpdate"
+          />
+        </div>
+      </div>
+
+      <!-- Extra emails -->
+      <div v-if="notifyEnabled">
+        <label class="input-label">{{ t('profile.balanceNotify.extraEmails') }}</label>
+
+        <!-- Existing emails list -->
+        <div v-if="extraEmails.length > 0" class="space-y-2 mb-4">
+          <div v-for="email in extraEmails" :key="email"
+            class="flex items-center justify-between px-3 py-2 bg-gray-50 dark:bg-dark-700 rounded-lg">
+            <span class="text-sm text-gray-700 dark:text-gray-300">{{ email }}</span>
+            <button @click="handleRemoveEmail(email)" class="text-red-500 hover:text-red-700 text-sm">
+              {{ t('profile.balanceNotify.removeEmail') }}
+            </button>
+          </div>
+        </div>
+
+        <!-- Add new email -->
+        <div class="space-y-2">
+          <div class="flex gap-2">
+            <input
+              v-model="newEmail"
+              type="email"
+              class="input flex-1"
+              :placeholder="t('profile.balanceNotify.emailPlaceholder')"
+              :disabled="codeSent"
+            />
+            <button
+              @click="handleSendCode"
+              :disabled="!newEmail || sendingCode || codeCountdown > 0"
+              class="btn btn-outline whitespace-nowrap"
+            >
+              {{ codeCountdown > 0 ? `${codeCountdown}s` : (codeSent ? t('profile.balanceNotify.codeSent') : t('profile.balanceNotify.sendCode')) }}
+            </button>
+          </div>
+          <div v-if="codeSent" class="flex gap-2">
+            <input
+              v-model="verifyCode"
+              type="text"
+              maxlength="6"
+              class="input flex-1"
+              :placeholder="t('profile.balanceNotify.codePlaceholder')"
+            />
+            <button
+              @click="handleVerify"
+              :disabled="!verifyCode || verifyCode.length !== 6 || verifying"
+              class="btn btn-primary whitespace-nowrap"
+            >
+              {{ t('profile.balanceNotify.verify') }}
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useAuthStore } from '@/stores/auth'
+import { useAppStore } from '@/stores/app'
+import { userAPI } from '@/api'
+import { extractApiErrorMessage } from '@/utils/apiError'
+
+const props = defineProps<{
+  enabled: boolean
+  threshold: number | null
+  extraEmails: string[]
+}>()
+
+const { t } = useI18n()
+const authStore = useAuthStore()
+const appStore = useAppStore()
+
+const notifyEnabled = ref(props.enabled)
+const customThreshold = ref<number | null>(props.threshold)
+const extraEmails = ref<string[]>([...props.extraEmails])
+const newEmail = ref('')
+const verifyCode = ref('')
+const codeSent = ref(false)
+const sendingCode = ref(false)
+const verifying = ref(false)
+const codeCountdown = ref(0)
+
+let countdownTimer: ReturnType<typeof setInterval> | null = null
+
+watch(() => props.enabled, (val) => { notifyEnabled.value = val })
+watch(() => props.threshold, (val) => { customThreshold.value = val })
+watch(() => props.extraEmails, (val) => { extraEmails.value = [...val] })
+
+const handleToggle = async () => {
+  try {
+    const updated = await userAPI.updateProfile({ balance_notify_enabled: notifyEnabled.value })
+    authStore.user = updated
+  } catch (err: unknown) {
+    appStore.showError(extractApiErrorMessage(err, t('common.error')))
+    notifyEnabled.value = !notifyEnabled.value
+  }
+}
+
+const handleThresholdUpdate = async () => {
+  try {
+    const threshold = customThreshold.value && customThreshold.value > 0 ? customThreshold.value : 0
+    const updated = await userAPI.updateProfile({ balance_notify_threshold: threshold })
+    authStore.user = updated
+  } catch (err: unknown) {
+    appStore.showError(extractApiErrorMessage(err, t('common.error')))
+  }
+}
+
+const handleSendCode = async () => {
+  if (!newEmail.value) return
+  sendingCode.value = true
+  try {
+    await userAPI.sendNotifyEmailCode(newEmail.value)
+    codeSent.value = true
+    codeCountdown.value = 60
+    countdownTimer = setInterval(() => {
+      codeCountdown.value--
+      if (codeCountdown.value <= 0) {
+        if (countdownTimer) clearInterval(countdownTimer)
+        countdownTimer = null
+      }
+    }, 1000)
+    appStore.showSuccess(t('profile.balanceNotify.codeSent'))
+  } catch (err: unknown) {
+    appStore.showError(extractApiErrorMessage(err, t('common.error')))
+  } finally {
+    sendingCode.value = false
+  }
+}
+
+const handleVerify = async () => {
+  if (!verifyCode.value || verifyCode.value.length !== 6) return
+  verifying.value = true
+  try {
+    await userAPI.verifyNotifyEmail(newEmail.value, verifyCode.value)
+    extraEmails.value.push(newEmail.value)
+    newEmail.value = ''
+    verifyCode.value = ''
+    codeSent.value = false
+    if (countdownTimer) clearInterval(countdownTimer)
+    codeCountdown.value = 0
+    appStore.showSuccess(t('profile.balanceNotify.verifySuccess'))
+    // Refresh user data
+    const updated = await userAPI.getProfile()
+    authStore.user = updated
+  } catch (err: unknown) {
+    appStore.showError(extractApiErrorMessage(err, t('common.error')))
+  } finally {
+    verifying.value = false
+  }
+}
+
+const handleRemoveEmail = async (email: string) => {
+  try {
+    await userAPI.removeNotifyEmail(email)
+    extraEmails.value = extraEmails.value.filter(e => e !== email)
+    appStore.showSuccess(t('profile.balanceNotify.removeSuccess'))
+    const updated = await userAPI.getProfile()
+    authStore.user = updated
+  } catch (err: unknown) {
+    appStore.showError(extractApiErrorMessage(err, t('common.error')))
+  }
+}
+</script>