feat: usage

2026-04-22 13:16:48 +08:00
parent b057d52499
commit 7d75714662
37 changed files with 2199 additions and 288 deletions
@@ -0,0 +1,66 @@
+import { Tabs } from 'antd';
+import React from 'react';
+import { UsageFilterItem } from '../config/types';
+import ApiKeysTable from '../tables/apikeys-table';
+import ModelsTable from '../tables/models-table';
+import UsersTable from '../tables/users-table';
+
+type FilterOptionType = Omit<UsageFilterItem, 'label' | 'deleted'>;
+
+const BreakdownTabs: React.FC<{
+  dateRange: {
+    start_date: string;
+    end_date: string;
+  };
+  scope: string;
+  filters: {
+    models?: FilterOptionType[];
+    users?: FilterOptionType[];
+    api_keys?: FilterOptionType[];
+  };
+}> = ({ filters, dateRange, scope }) => {
+  const items = [
+    {
+      key: 'models',
+      label: 'Models',
+      forceRender: true,
+      children: (
+        <ModelsTable
+          models={filters.models || []}
+          dateRange={dateRange}
+          scope={scope}
+        />
+      )
+    },
+    {
+      key: 'users',
+      label: 'Users',
+      forceRender: true,
+      children: <UsersTable users={filters.users || []} dateRange={dateRange} />
+    },
+    {
+      key: 'api_keys',
+      label: 'API Keys',
+      forceRender: true,
+      children: (
+        <ApiKeysTable
+          apiKeys={filters.api_keys || []}
+          dateRange={dateRange}
+          scope={scope}
+        />
+      )
+    }
+  ].filter((item) => {
+    if (item.key === 'users') {
+      return scope === 'all';
+    }
+    return true;
+  });
+
+  return (
+    <div style={{ marginTop: 16 }}>
+      <Tabs defaultActiveKey="models" items={items} />
+    </div>
+  );
+};
+export default BreakdownTabs;