fix: 原始数据弹窗改为标签页切换，手机友好

- 原始请求/响应不再上下堆叠，改为「请求 / 响应」两个标签页
- 单个内容区（pre 内滚动 + 自动换行），避免手机上需要长距离滚动
- 打开时默认停在有内容的标签（请求优先）；仅有一个数据时只显示对应标签
- 弹窗标题补充模型名与协议信息

frontend/src/views/dashboard/UsageLogs.vue

@@ -125,17 +125,31 @@
           <button class="btn btn-circle btn-ghost btn-sm absolute right-2 top-2" aria-label="Close">✕</button>
         </form>
         <h3 class="text-lg font-semibold">原始数据 #{{ currentRaw?.id }}</h3>
-        <div class="mt-4 space-y-4 text-sm">
+        <p class="mt-1 text-xs text-base-content/50">
-          <div v-if="currentRaw?.raw_request">
+          {{ currentRaw?.model_name }} · {{ currentRaw?.protocol }}
-            <h4 class="mb-1 font-medium text-base-content/70">原始请求</h4>
+        </p>
-            <pre class="max-h-64 overflow-auto rounded-lg bg-base-200/50 p-3 text-xs leading-relaxed">{{ currentRaw.raw_request }}</pre>
+
+        <!-- 标签页切换：请求 / 响应，避免上下堆叠，手机友好 -->
+        <div v-if="hasAnyRaw" class="mt-4">
+          <div class="tabs tabs-boxed w-fit max-w-full overflow-x-auto">
+            <button
+              v-if="currentRaw?.raw_request"
+              type="button"
+              class="tab tab-sm"
+              :class="rawTab === 'request' && 'tab-active'"
+              @click="rawTab = 'request'"
+            >请求</button>
+            <button
+              v-if="currentRaw?.raw_response"
+              type="button"
+              class="tab tab-sm"
+              :class="rawTab === 'response' && 'tab-active'"
+              @click="rawTab = 'response'"
+            >响应</button>
           </div>
-          <div v-if="currentRaw?.raw_response">
+          <pre class="mt-3 max-h-[55vh] overflow-auto rounded-lg bg-base-200/50 p-3 text-xs leading-relaxed whitespace-pre-wrap break-words">{{ activeRawContent }}</pre>
-            <h4 class="mb-1 font-medium text-base-content/70">原始响应</h4>
-            <pre class="max-h-64 overflow-auto rounded-lg bg-base-200/50 p-3 text-xs leading-relaxed">{{ currentRaw.raw_response }}</pre>
-          </div>
-          <p v-if="!currentRaw?.raw_request && !currentRaw?.raw_response" class="text-base-content/50">该请求未记录原始数据（仅管理员且开关开启时记录）。</p>
         </div>
+        <p v-else class="mt-4 text-sm text-base-content/50">该请求未记录原始数据（仅管理员且开关开启时记录）。</p>
       </div>
       <form method="dialog" class="modal-backdrop">
         <button aria-label="Close">close</button>
@@ -163,8 +177,19 @@ const summary = computed(() => store.adminSummary?.totals)
 // 原始数据弹窗
 const rawModal = ref<HTMLDialogElement | null>(null)
 const currentRaw = ref<UsageLogItem | null>(null)
+const rawTab = ref<'request' | 'response'>('request')
+
+const hasAnyRaw = computed(() => !!currentRaw.value?.raw_request || !!currentRaw.value?.raw_response)
+const activeRawContent = computed(() => {
+  const item = currentRaw.value
+  if (!item) return ''
+  return rawTab.value === 'request' ? item.raw_request ?? '' : item.raw_response ?? ''
+})
+
 function viewRaw(item: UsageLogItem) {
   currentRaw.value = item
+  // 默认停在第一个有内容的标签（请求优先）
+  rawTab.value = item.raw_request ? 'request' : 'response'
   rawModal.value?.showModal()
 }