fix(ops): 修复错误日志和请求详情模态框的布局问题

- 修复 OpsErrorDetailsModal 的内容溢出问题，使用 flex 布局确保正确显示
- 修复 OpsErrorLogTable 的表格滚动问题，添加 min-h-0 确保正确的滚动行为
- 修复 OpsRequestDetailsModal 的布局问题，添加 pageSize 初始化并优化 flex 布局
- 统一使用 flex 布局模式，确保模态框内容在不同屏幕尺寸下正确显示

frontend/src/views/admin/ops/components/OpsErrorDetailsModal.vue

@@ -174,8 +174,9 @@ watch(
 
 <template>
   <BaseDialog :show="show" :title="modalTitle" width="full" @close="close">
+    <div class="flex h-full min-h-0 flex-col">
       <!-- Filters -->
-    <div class="border-b border-gray-200 pb-4 mb-4 dark:border-dark-700">
+      <div class="mb-4 flex-shrink-0 border-b border-gray-200 pb-4 dark:border-dark-700">
         <div class="grid grid-cols-1 gap-4 lg:grid-cols-12">
           <div class="lg:col-span-5">
             <div class="relative group">
@@ -225,10 +226,13 @@ watch(
       </div>
 
       <!-- Body -->
-    <div class="text-xs text-gray-500 dark:text-gray-400 mb-2">
+      <div class="flex min-h-0 flex-1 flex-col">
+        <div class="mb-2 flex-shrink-0 text-xs text-gray-500 dark:text-gray-400">
           {{ t('admin.ops.errorDetails.total') }} {{ total }}
         </div>
+
         <OpsErrorLogTable
+          class="min-h-0 flex-1"
           :rows="rows"
           :total="total"
           :loading="loading"
@@ -238,5 +242,7 @@ watch(
           @update:page="page = $event"
           @update:pageSize="pageSize = $event"
         />
+      </div>
+    </div>
   </BaseDialog>
 </template>

frontend/src/views/admin/ops/components/OpsErrorLogTable.vue

@@ -1,10 +1,11 @@
 <template>
-  <div>
+  <div class="flex h-full min-h-0 flex-col">
-    <div v-if="loading" class="flex items-center justify-center py-10">
+    <div v-if="loading" class="flex flex-1 items-center justify-center py-10">
       <div class="h-8 w-8 animate-spin rounded-full border-b-2 border-primary-600"></div>
     </div>
 
-    <div v-else class="overflow-x-auto">
+    <div v-else class="flex min-h-0 flex-1 flex-col">
+      <div class="min-h-0 flex-1 overflow-auto">
         <table class="min-w-full divide-y divide-gray-200 dark:divide-dark-700">
           <thead class="sticky top-0 z-10 bg-gray-50/50 dark:bg-dark-800/50">
             <tr>
@@ -172,6 +173,7 @@
         @update:pageSize="emit('update:pageSize', $event)"
       />
     </div>
+  </div>
 </template>
 
 <script setup lang="ts">

frontend/src/views/admin/ops/components/OpsRequestDetailsModal.vue

@@ -95,6 +95,7 @@ watch(
   (open) => {
     if (open) {
       page.value = 1
+      pageSize.value = 20
       fetchData()
     }
   }
@@ -150,7 +151,8 @@ const kindBadgeClass = (kind: string) => {
 <template>
   <BaseDialog :show="modelValue" :title="props.preset.title || t('admin.ops.requestDetails.title')" width="full" @close="close">
     <template #default>
-      <div class="flex items-center justify-between mb-4">
+      <div class="flex h-full min-h-0 flex-col">
+        <div class="mb-4 flex flex-shrink-0 items-center justify-between">
           <div class="text-xs text-gray-500 dark:text-gray-400">
             {{ t('admin.ops.requestDetails.rangeLabel', { range: rangeLabel }) }}
           </div>
@@ -164,7 +166,7 @@ const kindBadgeClass = (kind: string) => {
         </div>
 
         <!-- Loading -->
-      <div v-if="loading" class="flex items-center justify-center py-16">
+        <div v-if="loading" class="flex flex-1 items-center justify-center py-16">
           <div class="flex flex-col items-center gap-3">
             <svg class="h-8 w-8 animate-spin text-blue-500" fill="none" viewBox="0 0 24 24">
               <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
@@ -179,16 +181,16 @@ const kindBadgeClass = (kind: string) => {
         </div>
 
         <!-- Table -->
-      <div v-else>
+        <div v-else class="flex min-h-0 flex-1 flex-col">
           <div v-if="items.length === 0" class="rounded-xl border border-dashed border-gray-200 p-10 text-center dark:border-dark-700">
             <div class="text-sm font-medium text-gray-600 dark:text-gray-300">{{ t('admin.ops.requestDetails.empty') }}</div>
             <div class="mt-1 text-xs text-gray-400">{{ t('admin.ops.requestDetails.emptyHint') }}</div>
           </div>
 
-        <div v-else class="overflow-hidden rounded-xl border border-gray-200 dark:border-dark-700">
+          <div v-else class="flex min-h-0 flex-1 flex-col overflow-hidden rounded-xl border border-gray-200 dark:border-dark-700">
-          <div class="overflow-x-auto">
+            <div class="min-h-0 flex-1 overflow-auto">
               <table class="min-w-full divide-y divide-gray-200 dark:divide-dark-700">
-              <thead class="bg-gray-50 dark:bg-dark-900">
+                <thead class="sticky top-0 z-10 bg-gray-50 dark:bg-dark-900">
                 <tr>
                   <th class="px-4 py-3 text-left text-[11px] font-bold uppercase tracking-wider text-gray-500 dark:text-gray-400">
                     {{ t('admin.ops.requestDetails.table.time') }}
@@ -276,6 +278,7 @@ const kindBadgeClass = (kind: string) => {
             />
           </div>
         </div>
+      </div>
     </template>
   </BaseDialog>
 </template>