feat: 调用日志补模型筛选与汇总条——可按模型收窄查询，并在当前筛选下直接读出请求次数与消费用量

apps/web/src/views/member/logs-view.vue

@@ -12,6 +12,7 @@ import PageHeader from "@/components/common/page-header.vue";
 import TableRefresh from "@/components/common/table-refresh.vue";
 import TimeRangePicker from "@/components/common/time-range-picker.vue";
 import QuotaText from "@/components/common/quota-text.vue";
+import LogsSummaryBar from "@/components/common/logs-summary-bar.vue";
 import { useMemberRange } from "@/composables/use-member-range.ts";
 import type { RangeKind } from "@/stores/member-range.ts";
 import { useMemberLogs, useMemberOverview } from "@/queries/member.ts";
@@ -23,6 +24,7 @@ const router = useRouter();
 const { range, setRange } = useMemberRange();
 
 const apiKeyId = ref<number | null>(null);
+const modelFilter = ref<string | null>(null);
 const billingSource = ref<string | null>(null);
 const subscriptionId = ref<number | null>(null);
 const typeFilter = ref<number | "error" | null>(null);
@@ -40,6 +42,7 @@ const params = computed(() => ({
   page: page.value,
   page_size: pageSize.value,
   api_key_id: apiKeyId.value ?? undefined,
+  model_name: modelFilter.value ?? undefined,
   billing_source: billingSource.value ?? undefined,
   subscription_id: subscriptionId.value ?? undefined,
   type: typeFilter.value ?? undefined,
@@ -48,6 +51,11 @@ const params = computed(() => ({
 const logsQuery = useMemberLogs(() => params.value);
 const rows = computed(() => logsQuery.data.value?.items ?? []);
 const total = computed(() => logsQuery.data.value?.total ?? 0);
+const summary = computed(() => logsQuery.data.value?.summary);
+const modelOptions = computed(() => [
+  { value: null, label: "全部模型" },
+  ...(logsQuery.data.value?.models ?? []).map((m) => ({ value: m, label: m })),
+]);
 
 const keyOptions = computed(() => [
   { value: null, label: "全部 Key" },
@@ -137,6 +145,8 @@ function syncFromRoute() {
   const q = route.query;
   const k = q.api_key_id ?? q.key_id;
   apiKeyId.value = typeof k === "string" && k ? Number(k) || null : null;
+  modelFilter.value =
+    typeof q.model_name === "string" && q.model_name ? q.model_name : null;
   billingSource.value =
     typeof q.billing_source === "string" && q.billing_source
       ? q.billing_source
@@ -160,6 +170,7 @@ function pushQuery() {
     to: range.value.to,
   };
   if (apiKeyId.value != null) query.api_key_id = String(apiKeyId.value);
+  if (modelFilter.value) query.model_name = modelFilter.value;
   if (billingSource.value) query.billing_source = billingSource.value;
   if (subscriptionId.value != null) {
     query.subscription_id = String(subscriptionId.value);
@@ -171,7 +182,7 @@ function pushQuery() {
 
 syncFromRoute();
 watch(() => route.query, () => syncFromRoute());
-watch([apiKeyId, billingSource, subscriptionId, typeFilter], () => {
+watch([apiKeyId, modelFilter, billingSource, subscriptionId, typeFilter], () => {
   if (applyingRoute.value) return;
   page.value = 1;
   pushQuery();
@@ -246,6 +257,15 @@ watch(
         show-search
         option-filter-prop="label"
       />
+      <a-select
+        v-model:value="modelFilter"
+        :options="modelOptions"
+        style="width: 140px"
+        allow-clear
+        placeholder="模型"
+        show-search
+        option-filter-prop="label"
+      />
       <a-select
         v-model:value="billingSource"
         :options="[
@@ -277,6 +297,15 @@ watch(
       />
     </div>
 
+    <LogsSummaryBar
+      :hit-count="summary?.hit_count ?? 0"
+      :usage-count="summary?.usage_count ?? 0"
+      :error-count="summary?.error_count ?? 0"
+      :quota="summary?.quota ?? 0"
+      :quota-usd="summary?.quota_usd ?? '0.00'"
+      :loading="logsQuery.isPending.value || logsQuery.isFetching.value"
+    />
+
     <TableRefresh
       :loading="logsQuery.isFetching.value"
       @refresh="() => logsQuery.refetch()"