From a6728b9b696f449e011af662ed0f082332565823 Mon Sep 17 00:00:00 2001
From: erio <asakifeng@gmail.com>
Date: Thu, 9 Apr 2026 23:58:52 +0800
Subject: [PATCH] style(admin): move cancel rate limit checkbox inline with
 pending orders row

---
 frontend/src/views/admin/SettingsView.vue | 28 +++++++++++------------
 1 file changed, 13 insertions(+), 15 deletions(-)

diff --git a/frontend/src/views/admin/SettingsView.vue b/frontend/src/views/admin/SettingsView.vue
index 20f9318c26..3ee730a688 100644
--- a/frontend/src/views/admin/SettingsView.vue
+++ b/frontend/src/views/admin/SettingsView.vue
@@ -1669,32 +1669,30 @@
                 <div><label class="input-label">{{ t('admin.settings.payment.dailyLimit') }}</label><input :value="form.payment_daily_limit || ''" @input="form.payment_daily_limit = parseFloat(($event.target as HTMLInputElement).value) || 0" type="number" step="0.01" min="0" class="input" :placeholder="t('admin.settings.payment.noLimit')" /></div>
                 <div><label class="input-label">{{ t('admin.settings.payment.orderTimeout') }} <span class="text-red-500">*</span></label><input v-model.number="form.payment_order_timeout_minutes" type="number" min="1" class="input" required /><p class="mt-0.5 text-xs text-gray-400">{{ t('admin.settings.payment.orderTimeoutHint') }}</p></div>
               </div>
-              <!-- Row 3: Pending orders + load balance -->
+              <!-- Row 3: Pending orders + load balance + cancel rate limit -->
               <div class="flex flex-wrap items-end gap-4">
                 <div class="w-28"><label class="input-label">{{ t('admin.settings.payment.maxPendingOrders') }}</label><input v-model.number="form.payment_max_pending_orders" type="number" min="1" class="input" /></div>
                 <div>
                   <label class="input-label">{{ t('admin.settings.payment.loadBalanceStrategy') }}</label>
                   <Select v-model="form.payment_load_balance_strategy" :options="loadBalanceOptions" class="w-40" />
                 </div>
-              </div>
-              <!-- Row 3.5: Cancel rate limit -->
-              <div class="rounded-lg border border-gray-200 p-3 dark:border-dark-600">
-                <div class="flex items-center gap-3">
+                <div class="flex items-center gap-2 pb-1">
                   <label class="flex cursor-pointer items-center gap-2 text-sm font-medium text-gray-700 dark:text-gray-300">
                     <input type="checkbox" v-model="form.payment_cancel_rate_limit_enabled" class="h-4 w-4 rounded border-gray-300 text-primary-600" />
                     {{ t('admin.settings.payment.cancelRateLimit') }}
                   </label>
                 </div>
-                <div v-if="form.payment_cancel_rate_limit_enabled" class="mt-3">
-                  <div class="flex flex-wrap items-center gap-2 text-sm text-gray-700 dark:text-gray-300">
-                    <span>{{ t('admin.settings.payment.cancelRateLimitEvery') }}</span>
-                    <input v-model.number="form.payment_cancel_rate_limit_window" type="number" min="1" required class="input w-16 text-center" />
-                    <Select v-model="form.payment_cancel_rate_limit_unit" :options="cancelRateLimitUnitOptions" class="w-24" />
-                    <span>{{ t('admin.settings.payment.cancelRateLimitAllowMax') }}</span>
-                    <input v-model.number="form.payment_cancel_rate_limit_max" type="number" min="1" required class="input w-16 text-center" />
-                    <span>{{ t('admin.settings.payment.cancelRateLimitTimes') }}</span>
-                    <Select v-model="form.payment_cancel_rate_limit_window_mode" :options="cancelRateLimitModeOptions" class="w-32" />
-                  </div>
+              </div>
+              <!-- Cancel rate limit detail (expandable) -->
+              <div v-if="form.payment_cancel_rate_limit_enabled" class="rounded-lg border border-gray-200 p-3 dark:border-dark-600">
+                <div class="flex flex-wrap items-center gap-2 text-sm text-gray-700 dark:text-gray-300">
+                  <span>{{ t('admin.settings.payment.cancelRateLimitEvery') }}</span>
+                  <input v-model.number="form.payment_cancel_rate_limit_window" type="number" min="1" required class="input w-16 text-center" />
+                  <Select v-model="form.payment_cancel_rate_limit_unit" :options="cancelRateLimitUnitOptions" class="w-24" />
+                  <span>{{ t('admin.settings.payment.cancelRateLimitAllowMax') }}</span>
+                  <input v-model.number="form.payment_cancel_rate_limit_max" type="number" min="1" required class="input w-16 text-center" />
+                  <span>{{ t('admin.settings.payment.cancelRateLimitTimes') }}</span>
+                  <Select v-model="form.payment_cancel_rate_limit_window_mode" :options="cancelRateLimitModeOptions" class="w-32" />
                 </div>
                 <p class="mt-1.5 text-xs text-gray-400">{{ t('admin.settings.payment.cancelRateLimitHint') }}</p>
               </div>