diff --git a/web/tenant/src/components/common/Icon.vue b/web/tenant/src/components/common/Icon.vue
index 79c8934..1168552 100644
--- a/web/tenant/src/components/common/Icon.vue
+++ b/web/tenant/src/components/common/Icon.vue
@@ -42,6 +42,7 @@ const icons: Record<string, string> = {
 	search: 'M21 21l-5.197-5.197m0 0A7.5 7.5 0 105.196 5.196a7.5 7.5 0 0010.607 10.607z',
 	more: 'M6.75 12a.75.75 0 11-1.5 0 .75.75 0 011.5 0zM12.75 12a.75.75 0 11-1.5 0 .75.75 0 011.5 0zM18.75 12a.75.75 0 11-1.5 0 .75.75 0 011.5 0z',
 	copy: 'M15.666 3.888A2.25 2.25 0 0013.5 2.25h-3c-1.03 0-1.9.693-2.166 1.638m7.332 0c.055.194.084.4.084.612v0a.75.75 0 01-.75.75H9.75a.75.75 0 01-.75-.75v0c0-.212.03-.418.084-.612m7.332 0c.646.049 1.288.11 1.927.184 1.1.128 1.907 1.077 1.907 2.185V19.5a2.25 2.25 0 01-2.25 2.25H6.75A2.25 2.25 0 014.5 19.5V6.257c0-1.108.806-2.057 1.907-2.185a48.208 48.208 0 011.927-.184',
+	download: 'M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5M16.5 12L12 16.5m0 0L7.5 12m4.5 4.5V3',
 	check: 'M4.5 12.75l6 6 9-13.5',
 	x: 'M6 18L18 6M6 6l12 12',
 
diff --git a/web/tenant/src/views/service/UsageLogsPage.vue b/web/tenant/src/views/service/UsageLogsPage.vue
index c1f1f6d..5ae1019 100644
--- a/web/tenant/src/views/service/UsageLogsPage.vue
+++ b/web/tenant/src/views/service/UsageLogsPage.vue
@@ -226,30 +226,10 @@ onMounted(() => {
 
 <template>
 	<div class="viewport-table-page space-y-6">
-		<!-- Page Header -->
-		<div class="page-header flex items-center justify-between">
-			<div>
-				<h1 class="page-title">用量日志</h1>
-				<p class="page-description">查看 API 调用记录和消费明细</p>
-			</div>
-			<div class="relative inline-block">
-				<button class="btn-secondary btn-sm inline-flex items-center gap-1.5" :disabled="exporting" @click="showExportDropdown = !showExportDropdown">
-					<svg v-if="!exporting" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5"><path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5M16.5 12L12 16.5m0 0L7.5 12m4.5 4.5V3"/></svg>
-					<svg v-else class="h-4 w-4 animate-spin" fill="none" viewBox="0 0 24 24"><circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"/><path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z"/></svg>
-					导出
-				</button>
-				<div v-if="showExportDropdown" class="absolute right-0 mt-2 w-36 bg-white rounded-xl border shadow-lg py-1 z-50">
-					<div class="px-4 py-2 text-sm text-gray-700 hover:bg-gray-50 cursor-pointer" @click="exportFile('csv'); showExportDropdown = false">导出 CSV</div>
-					<div class="px-4 py-2 text-sm text-gray-700 hover:bg-gray-50 cursor-pointer" @click="exportFile('xlsx'); showExportDropdown = false">导出 Excel</div>
-				</div>
-			</div>
-		</div>
-
 		<!-- Filters -->
-			<!-- Filters -->
-			<div class="card">
-				<div class="card-body">
-					<div class="flex flex-wrap items-center gap-4">
+		<div class="card">
+			<div class="card-body !p-4">
+				<form class="flex flex-wrap items-center gap-x-3 gap-y-3" @submit.prevent="applyFilters">
 						<div class="flex items-center gap-2">
 							<label class="text-sm text-gray-500 whitespace-nowrap">开始日期</label>
 							<input v-model="filterStartDate" type="date" class="input" style="width:140px" />
@@ -275,12 +255,33 @@ onMounted(() => {
 							<BaseSelect v-model="filterRequestType" :options="[{value:'',label:'全部'},{value:'1',label:'同步'},{value:'2',label:'流式'},{value:'3',label:'异步'}]" container-class="w-[100px]" />
 						</div>
 						<div class="ml-auto flex items-center gap-2">
-							<button class="btn btn-primary btn-sm" @click="applyFilters">搜索</button>
-							<button class="btn btn-secondary btn-sm" @click="resetFilters">重置</button>
+							<button type="submit" class="btn btn-primary btn-sm">
+								<Icon name="search" size="sm" />
+								搜索
+							</button>
+							<button type="button" class="btn btn-secondary btn-sm" @click="resetFilters">重置</button>
+							<span class="mx-1 h-6 w-px bg-gray-200" aria-hidden="true"></span>
+							<div class="relative">
+								<button
+									type="button"
+									class="btn btn-secondary btn-sm"
+									:disabled="exporting"
+									@click="showExportDropdown = !showExportDropdown"
+								>
+									<span v-if="exporting" class="spinner h-4 w-4"></span>
+									<Icon v-else name="download" size="sm" />
+									导出
+									<Icon name="chevronDown" size="xs" />
+								</button>
+								<div v-if="showExportDropdown" class="absolute right-0 z-50 mt-2 w-36 overflow-hidden rounded-lg border border-gray-200 bg-white py-1 shadow-lg">
+									<button type="button" class="block w-full px-4 py-2 text-left text-sm text-gray-700 hover:bg-gray-50" @click="exportFile('csv'); showExportDropdown = false">导出 CSV</button>
+									<button type="button" class="block w-full px-4 py-2 text-left text-sm text-gray-700 hover:bg-gray-50" @click="exportFile('xlsx'); showExportDropdown = false">导出 Excel</button>
+								</div>
+							</div>
 						</div>
-					</div>
-				</div>
+					</form>
 			</div>
+		</div>
 		<!-- Logs Table -->
 		<div class="viewport-table-panel card overflow-hidden">
 			<div v-if="loading" class="p-8 flex justify-center">