个性化处理

1. 为所有抽屉和对话框添加 ESC 键关闭功能；
2. 为`使用记录`表格添加自动刷新开关；
3. 为后端 API 请求增加 User-Agent 头部；
4. 修改启动命令支持从.env中读取数据库和Redis配置。

frontend/src/features/models/components/ModelDetailDrawer.vue

@@ -698,6 +698,7 @@ import {
   Layers,
   BarChart3
 } from 'lucide-vue-next'
+import { useEscapeKey } from '@/composables/useEscapeKey'
 import { useToast } from '@/composables/useToast'
 import Card from '@/components/ui/card.vue'
 import Badge from '@/components/ui/badge.vue'
@@ -833,6 +834,16 @@ watch(() => props.open, (newOpen) => {
     detailTab.value = 'basic'
   }
 })
+
+// 添加 ESC 键监听
+useEscapeKey(() => {
+  if (props.open) {
+    handleClose()
+  }
+}, {
+  disableOnInput: true,
+  once: false
+})
 </script>
 
 <style scoped>

frontend/src/features/providers/components/ProviderDetailDrawer.vue

@@ -655,6 +655,7 @@ import {
   GripVertical,
   Copy
 } from 'lucide-vue-next'
+import { useEscapeKey } from '@/composables/useEscapeKey'
 import Button from '@/components/ui/button.vue'
 import Badge from '@/components/ui/badge.vue'
 import Card from '@/components/ui/card.vue'
@@ -1296,6 +1297,16 @@ async function loadEndpoints() {
     showError(err.response?.data?.detail || '加载端点失败', '错误')
   }
 }
+
+// 添加 ESC 键监听
+useEscapeKey(() => {
+  if (props.open) {
+    handleClose()
+  }
+}, {
+  disableOnInput: true,
+  once: false
+})
 </script>
 
 <style scoped>

frontend/src/features/usage/components/RequestDetailDrawer.vue

@@ -472,6 +472,7 @@
 <script setup lang="ts">
 import { ref, watch, computed } from 'vue'
 import Button from '@/components/ui/button.vue'
+import { useEscapeKey } from '@/composables/useEscapeKey'
 import Card from '@/components/ui/card.vue'
 import Badge from '@/components/ui/badge.vue'
 import Separator from '@/components/ui/separator.vue'
@@ -897,6 +898,16 @@ const providerHeadersWithDiff = computed(() => {
 
   return result
 })
+
+// 添加 ESC 键监听
+useEscapeKey(() => {
+  if (props.isOpen) {
+    handleClose()
+  }
+}, {
+  disableOnInput: true,
+  once: false
+})
 </script>
 
 <style scoped>

frontend/src/features/usage/components/UsageRecordsTable.vue

@@ -138,9 +138,21 @@
 
       <!-- 刷新按钮 -->
       <RefreshButton
+        v-if="!autoRefresh"
         :loading="loading"
         @click="$emit('refresh')"
       />
+
+      <!-- 自动刷新开关 -->
+      <div class="flex items-center gap-2">
+        <Switch
+          :model-value="autoRefresh"
+          @update:model-value="$emit('update:autoRefresh', $event)"
+        />
+        <label class="text-xs text-muted-foreground cursor-pointer select-none" @click="$emit('update:autoRefresh', !autoRefresh)">
+          自动刷新
+        </label>
+      </div>
     </template>
 
     <Table>
@@ -421,6 +433,7 @@ import {
   TableCell,
   Pagination,
   RefreshButton,
+  Switch,
 } from '@/components/ui'
 import { formatTokens, formatCurrency } from '@/utils/format'
 import { formatDateTime } from '../composables'
@@ -453,6 +466,8 @@ const props = defineProps<{
   pageSize: number
   totalRecords: number
   pageSizeOptions: number[]
+  // 自动刷新
+  autoRefresh: boolean
 }>()
 
 const emit = defineEmits<{
@@ -463,6 +478,7 @@ const emit = defineEmits<{
   'update:filterStatus': [value: string]
   'update:currentPage': [value: number]
   'update:pageSize': [value: number]
+  'update:autoRefresh': [value: boolean]
   'refresh': []
   'showDetail': [id: string]
 }>()