fix(frontend): place quota notify toggle inline with limit input

Move QuotaNotifyToggle to the same row as the limit $ input for all
three dimensions (daily/weekly/total), significantly reducing card height.

backend/cmd/server/VERSION

-0.1.110.30
+0.1.110.31

frontend/src/components/account/QuotaLimitCard.vue

@@ -200,7 +200,8 @@ const onWeeklyModeChange = (e: Event) => {
         <!-- 日配额 -->
         <div>
           <label class="input-label">{{ t('admin.accounts.quotaDailyLimit') }}</label>
-          <div class="relative">
+          <div class="flex items-start gap-2">
+            <div class="relative flex-1">
               <span class="absolute left-3 top-1/2 -translate-y-1/2 text-gray-500 dark:text-gray-400">$</span>
               <input
                 :value="dailyLimit"
@@ -212,6 +213,17 @@ const onWeeklyModeChange = (e: Event) => {
                 :placeholder="t('admin.accounts.quotaLimitPlaceholder')"
               />
             </div>
+            <QuotaNotifyToggle
+              v-if="quotaNotifyGlobalEnabled && dailyLimit && dailyLimit > 0"
+              class="flex-1"
+              :enabled="props.quotaNotifyDailyEnabled"
+              :threshold="props.quotaNotifyDailyThreshold"
+              :threshold-type="props.quotaNotifyDailyThresholdType"
+              @update:enabled="emit('update:quotaNotifyDailyEnabled', $event)"
+              @update:threshold="emit('update:quotaNotifyDailyThreshold', $event)"
+              @update:threshold-type="emit('update:quotaNotifyDailyThresholdType', $event)"
+            />
+          </div>
           <div class="mt-1.5 flex items-center gap-2 flex-wrap">
             <label class="text-xs text-gray-500 dark:text-gray-400 whitespace-nowrap">{{ t('admin.accounts.quotaResetMode') }}</label>
             <select
@@ -241,21 +253,13 @@ const onWeeklyModeChange = (e: Event) => {
               {{ t('admin.accounts.quotaDailyLimitHint') }}
             </template>
           </p>
-          <QuotaNotifyToggle
-            v-if="quotaNotifyGlobalEnabled && dailyLimit && dailyLimit > 0"
-            :enabled="props.quotaNotifyDailyEnabled"
-            :threshold="props.quotaNotifyDailyThreshold"
-            :threshold-type="props.quotaNotifyDailyThresholdType"
-            @update:enabled="emit('update:quotaNotifyDailyEnabled', $event)"
-            @update:threshold="emit('update:quotaNotifyDailyThreshold', $event)"
-            @update:threshold-type="emit('update:quotaNotifyDailyThresholdType', $event)"
-          />
         </div>
 
         <!-- 周配额 -->
         <div>
           <label class="input-label">{{ t('admin.accounts.quotaWeeklyLimit') }}</label>
-          <div class="relative">
+          <div class="flex items-start gap-2">
+            <div class="relative flex-1">
               <span class="absolute left-3 top-1/2 -translate-y-1/2 text-gray-500 dark:text-gray-400">$</span>
               <input
                 :value="weeklyLimit"
@@ -267,6 +271,17 @@ const onWeeklyModeChange = (e: Event) => {
                 :placeholder="t('admin.accounts.quotaLimitPlaceholder')"
               />
             </div>
+            <QuotaNotifyToggle
+              v-if="quotaNotifyGlobalEnabled && weeklyLimit && weeklyLimit > 0"
+              class="flex-1"
+              :enabled="props.quotaNotifyWeeklyEnabled"
+              :threshold="props.quotaNotifyWeeklyThreshold"
+              :threshold-type="props.quotaNotifyWeeklyThresholdType"
+              @update:enabled="emit('update:quotaNotifyWeeklyEnabled', $event)"
+              @update:threshold="emit('update:quotaNotifyWeeklyThreshold', $event)"
+              @update:threshold-type="emit('update:quotaNotifyWeeklyThresholdType', $event)"
+            />
+          </div>
           <div class="mt-1.5 flex items-center gap-2 flex-wrap">
             <label class="text-xs text-gray-500 dark:text-gray-400 whitespace-nowrap">{{ t('admin.accounts.quotaResetMode') }}</label>
             <select
@@ -304,15 +319,6 @@ const onWeeklyModeChange = (e: Event) => {
               {{ t('admin.accounts.quotaWeeklyLimitHint') }}
             </template>
           </p>
-          <QuotaNotifyToggle
-            v-if="quotaNotifyGlobalEnabled && weeklyLimit && weeklyLimit > 0"
-            :enabled="props.quotaNotifyWeeklyEnabled"
-            :threshold="props.quotaNotifyWeeklyThreshold"
-            :threshold-type="props.quotaNotifyWeeklyThresholdType"
-            @update:enabled="emit('update:quotaNotifyWeeklyEnabled', $event)"
-            @update:threshold="emit('update:quotaNotifyWeeklyThreshold', $event)"
-            @update:threshold-type="emit('update:quotaNotifyWeeklyThresholdType', $event)"
-          />
         </div>
 
         <!-- 时区选择（当任一维度使用固定模式时显示） -->
@@ -330,7 +336,8 @@ const onWeeklyModeChange = (e: Event) => {
         <!-- 总配额 -->
         <div>
           <label class="input-label">{{ t('admin.accounts.quotaTotalLimit') }}</label>
-          <div class="relative">
+          <div class="flex items-start gap-2">
+            <div class="relative flex-1">
               <span class="absolute left-3 top-1/2 -translate-y-1/2 text-gray-500 dark:text-gray-400">$</span>
               <input
                 :value="totalLimit"
@@ -342,9 +349,9 @@ const onWeeklyModeChange = (e: Event) => {
                 :placeholder="t('admin.accounts.quotaLimitPlaceholder')"
               />
             </div>
-          <p class="input-hint mb-0">{{ t('admin.accounts.quotaTotalLimitHint') }}</p>
             <QuotaNotifyToggle
               v-if="quotaNotifyGlobalEnabled && totalLimit && totalLimit > 0"
+              class="flex-1"
               :enabled="props.quotaNotifyTotalEnabled"
               :threshold="props.quotaNotifyTotalThreshold"
               :threshold-type="props.quotaNotifyTotalThresholdType"
@@ -353,6 +360,8 @@ const onWeeklyModeChange = (e: Event) => {
               @update:threshold-type="emit('update:quotaNotifyTotalThresholdType', $event)"
             />
           </div>
+          <p class="input-hint mb-0">{{ t('admin.accounts.quotaTotalLimitHint') }}</p>
+        </div>
       </div>
   </div>
 </template>