Files
claude-relay-service/web/admin-spa/dist/assets/DashboardView-B-EZhqex.js

2 lines
24 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import{E as it}from"./element-plus-B8Fs_0jW.js";import{aR as dt,r as k,c as ut,aW as ct,o as st,q as pt,D as E,x as b,z as t,P as d,u as s,O as v,L as I,Q as lt,ac as rt,C as j,R as yt,y as h}from"./vue-vendor-CKToUHZx.js";import{a as O,_ as mt}from"./index-DhITICXu.js";import{s as at}from"./toast-BvwA7Mwb.js";import{C as ot}from"./chart-Cor9iTVD.js";import"./vendor-BDiMbLwQ.js";const ft=dt("dashboard",()=>{const L=k(!1),U=k({totalApiKeys:0,activeApiKeys:0,totalAccounts:0,activeAccounts:0,rateLimitedAccounts:0,todayRequests:0,totalRequests:0,todayTokens:0,todayInputTokens:0,todayOutputTokens:0,totalTokens:0,totalInputTokens:0,totalOutputTokens:0,totalCacheCreateTokens:0,totalCacheReadTokens:0,todayCacheCreateTokens:0,todayCacheReadTokens:0,systemRPM:0,systemTPM:0,systemStatus:"正常",uptime:0}),i=k({todayCosts:{totalCost:0,formatted:{totalCost:"$0.000000"}},totalCosts:{totalCost:0,formatted:{totalCost:"$0.000000"}}}),V=k([]),w=k([]),q=k([]),T=k({data:[],topApiKeys:[],totalApiKeys:0}),l=k({type:"preset",preset:"7days",customStart:"",customEnd:"",customRange:null,presetOptions:[{value:"today",label:"今日",days:1},{value:"7days",label:"7天",days:7},{value:"30days",label:"30天",days:30}]}),g=k("day"),R=k("requests"),_=k([new Date(2e3,1,1,0,0,0),new Date(2e3,2,1,23,59,59)]),Z=ut(()=>{const a=U.value.uptime,r=Math.floor(a/86400),n=Math.floor(a%86400/3600),o=Math.floor(a%3600/60);return r>0?`${r}${n}小时`:n>0?`${n}小时 ${o}分钟`:`${o}分钟`});async function J(){L.value=!0;try{const[a,r,n]=await Promise.all([O.get("/admin/dashboard"),O.get("/admin/usage-costs?period=today"),O.get("/admin/usage-costs?period=all")]);if(a.success){const o=a.data.overview||{},c=a.data.recentActivity||{},m=a.data.systemAverages||{},C=a.data.systemHealth||{};U.value={totalApiKeys:o.totalApiKeys||0,activeApiKeys:o.activeApiKeys||0,totalAccounts:o.totalClaudeAccounts||0,activeAccounts:o.activeClaudeAccounts||0,rateLimitedAccounts:o.rateLimitedClaudeAccounts||0,todayRequests:c.requestsToday||0,totalRequests:o.totalRequestsUsed||0,todayTokens:c.tokensToday||0,todayInputTokens:c.inputTokensToday||0,todayOutputTokens:c.outputTokensToday||0,totalTokens:o.totalTokensUsed||0,totalInputTokens:o.totalInputTokensUsed||0,totalOutputTokens:o.totalOutputTokensUsed||0,totalCacheCreateTokens:o.totalCacheCreateTokensUsed||0,totalCacheReadTokens:o.totalCacheReadTokensUsed||0,todayCacheCreateTokens:c.cacheCreateTokensToday||0,todayCacheReadTokens:c.cacheReadTokensToday||0,systemRPM:m.rpm||0,systemTPM:m.tpm||0,systemStatus:C.redisConnected?"正常":"异常",uptime:C.uptime||0}}r.success&&n.success&&(i.value={todayCosts:r.data.totalCosts||{totalCost:0,formatted:{totalCost:"$0.000000"}},totalCosts:n.data.totalCosts||{totalCost:0,formatted:{totalCost:"$0.000000"}}})}catch(a){console.error("加载仪表板数据失败:",a)}finally{L.value=!1}}async function X(a=7,r="day"){try{let n="/admin/usage-trend?";r==="hour"?(n+="granularity=hour",l.value.customRange&&l.value.customRange.length===2&&(n+=`&startDate=${encodeURIComponent(l.value.customRange[0])}`,n+=`&endDate=${encodeURIComponent(l.value.customRange[1])}`)):n+=`granularity=day&days=${a}`;const o=await O.get(n);o.success&&(w.value=o.data)}catch(n){console.error("加载使用趋势失败:",n)}}async function tt(a="daily"){try{const r=await O.get(`/admin/model-stats?period=${a}`);r.success&&(q.value=r.data)}catch(r){console.error("加载模型统计失败:",r)}}async function Y(a="requests"){try{let r="/admin/api-keys-usage-trend?";if(g.value==="hour")r+="granularity=hour",l.value.customRange&&l.value.customRange.length===2&&(r+=`&startDate=${encodeURIComponent(l.value.customRange[0])}`,r+=`&endDate=${encodeURIComponent(l.value.customRange[1])}`);else{const o=l.value.type==="preset"?l.value.preset==="today"?1:l.value.preset==="7days"?7:30:z(l.value.customStart,l.value.customEnd);r+=`granularity=day&days=${o}`}r+=`&metric=${a}`;const n=await O.get(r);n.success&&(T.value={data:n.data||[],topApiKeys:n.topApiKeys||[],totalApiKeys:n.totalApiKeys||0})}catch(r){console.error("加载API Keys趋势失败:",r)}}function K(a){l.value.type="preset",l.value.preset=a;const r=l.value.presetOptions.find(n=>n.value===a);if(r){const n=new Date;let o,c;if(g.value==="hour")switch(a){case"last24h":o=new Date(n.getTime()-24*60*60*1e3),c=n;break;case"yesterday":o=new Date(n),o.setDate(n.getDate()-1),o.setHours(0,0,0,0),c=new Date(o),c.setHours(23,59,59,999);break;case"dayBefore":o=new Date(n),o.setDate(n.getDate()-2),o.setHours(0,0,0,0),c=new Date(o),c.setHours(23,59,59,999);break}else o=new Date(n),c=new Date(n),a==="today"?(o.setHours(0,0,0,0),c.setHours(23,59,59,999)):(o.setDate(n.getDate()-(r.days-1)),o.setHours(0,0,0,0),c.setHours(23,59,59,999));l.value.customStart=o.toISOString().split("T")[0],l.value.customEnd=c.toISOString().split("T")[0];const m=C=>{const G=C.getFullYear(),W=String(C.getMonth()+1).padStart(2,"0"),H=String(C.getDate()).padStart(2,"0"),Q=String(C.getHours()).padStart(2,"0"),p=String(C.getMinutes()).padStart(2,"0"),e=String(C.getSeconds()).padStart(2,"0");return`${G}-${W}-${H} ${Q}:${p}:${e}`};l.value.customRange=[m(o),m(c)]}$()}function et(a){if(a&&a.length===2){l.value.type="custom",l.value.preset="",l.value.customRange=a,l.value.customStart=a[0].split(" ")[0],l.value.customEnd=a[1].split(" ")[0];const r=new Date(a[0]),n=new Date(a[1]);if(g.value==="hour"){if((n-r)/36e5>24){at("小时粒度下日期范围不能超过24小时","warning");return}}else if(Math.ceil((n-r)/864e5)+1>31){at("日期范围不能超过 31 天","warning");return}$()}else a===null&&K((g.value==="hour","7days"))}function N(a){if(g.value=a,a==="hour"){if(l.value.presetOptions=[{value:"last24h",label:"近24小时",hours:24},{value:"yesterday",label:"昨天",hours:24},{value:"dayBefore",label:"前天",hours:24}],l.value.type==="custom"&&l.value.customRange&&l.value.customRange.length===2){const r=new Date(l.value.customRange[0]);if((new Date(l.value.customRange[1])-r)/(1e3*60*60)>24){at("小时粒度下日期范围不能超过24小时已切换到近24小时","warning"),K("last24h");return}}if(["today","7days","30days"].includes(l.value.preset)){K("last24h");return}}else if(l.value.presetOptions=[{value:"today",label:"今日",days:1},{value:"7days",label:"7天",days:7},{value:"30days",label:"30天",days:30}],["last24h","yesterday","dayBefore"].includes(l.value.preset)){K("7days");return}$()}async function $(){let a,r="monthly";if(l.value.type==="preset"){const n=l.value.presetOptions.find(o=>o.value===l.value.preset);g.value==="hour"?(a=1,r="daily"):(a=n?n.days:7,l.value.preset==="today"?r="daily":r="monthly")}else{if(g.value==="hour"){const n=new Date(l.value.customRange[0]),o=new Date(l.value.customRange[1]),c=Math.ceil((o-n)/(1e3*60*60));a=Math.ceil(c/24)||1}else a=z(l.value.customStart,l.value.customEnd);r="daily"}await Promise.all([X(a,g.value),tt(r),Y(R.value)])}function z(a,r){if(!a||!r)return 7;const n=new Date(a),o=new Date(r),c=Math.abs(o-n);return Math.ceil(c/(1e3*60*60*24))||7}function B(a){return a>new Date}return{loading:L,dashboardData:U,costsData:i,modelStats:V,trendData:w,dashboardModelStats:q,apiKeysTrendData:T,dateFilter:l,trendGranularity:g,apiKeysTrendMetric:R,defaultTime:_,formattedUptime:Z,loadDashboardData:J,loadUsageTrend:X,loadModelStats:tt,loadApiKeysTrend:Y,setDateFilterPreset:K,onCustomDateRangeChange:et,setTrendGranularity:N,refreshChartsData:$,disabledDate:B}}),gt={class:"grid grid-cols-1 md:grid-cols-2 xl:grid-cols-4 gap-6 mb-8"},xt={class:"stat-card"},bt={class:"flex items-center justify-between"},vt={class:"text-3xl font-bold text-gray-900"},ht={class:"text-xs text-gray-500 mt-1"},kt={class:"stat-card"},Ct={class:"flex items-center justify-between"},Tt={class:"text-3xl font-bold text-gray-900"},_t={class:"text-xs text-gray-500 mt-1"},Dt={key:0,class:"text-yellow-600"},wt={class:"stat-card"},Rt={class:"flex items-center justify-between"},At={class:"text-3xl font-bold text-gray-900"},St={class:"text-xs text-gray-500 mt-1"},Kt={class:"stat-card"},$t={class:"flex items-center justify-between"},Mt={class:"text-3xl font-bold text-green-600"},Ut={class:"text-xs text-gray-500 mt-1"},Pt={class:"grid grid-cols-1 md:grid-cols-2 xl:grid-cols-4 gap-6 mb-8"},Ft={class:"stat-card"},It={class:"flex items-center justify-between"},Ot={class:"flex-1 mr-8"},qt={class:"flex items-baseline gap-2 mb-2 flex-wrap"},Bt={class:"text-3xl font-bold text-blue-600"},Ht={class:"text-sm text-green-600 font-medium"},Et={class:"text-xs text-gray-500"},jt={class:"flex justify-between items-center flex-wrap gap-x-4"},Lt={class:"font-medium"},Vt={class:"font-medium"},Yt={key:0,class:"text-purple-600"},Nt={class:"font-medium"},zt={key:1,class:"text-purple-600"},Gt={class:"font-medium"},Wt={class:"stat-card"},Qt={class:"flex items-center justify-between"},Zt={class:"flex-1 mr-8"},Jt={class:"flex items-baseline gap-2 mb-2 flex-wrap"},Xt={class:"text-3xl font-bold text-emerald-600"},te={class:"text-sm text-green-600 font-medium"},ee={class:"text-xs text-gray-500"},se={class:"flex justify-between items-center flex-wrap gap-x-4"},ae={class:"font-medium"},oe={class:"font-medium"},ne={key:0,class:"text-purple-600"},le={class:"font-medium"},re={key:1,class:"text-purple-600"},ie={class:"font-medium"},de={class:"stat-card"},ue={class:"flex items-center justify-between"},ce={class:"text-3xl font-bold text-orange-600"},pe={class:"stat-card"},ye={class:"flex items-center justify-between"},me={class:"text-3xl font-bold text-rose-600"},fe={class:"mb-8"},ge={class:"flex items-center justify-between mb-6"},xe={class:"flex gap-2 items-center"},be={class:"flex gap-1 bg-gray-100 rounded-lg p-1"},ve=["onClick"],he={class:"flex gap-1 bg-gray-100 rounded-lg p-1"},ke={class:"flex items-center gap-2"},Ce={key:0,class:"text-xs text-orange-600"},Te={class:"grid grid-cols-1 lg:grid-cols-2 gap-6"},_e={class:"card p-6"},De={class:"relative",style:{height:"300px"}},we={class:"card p-6"},Re={key:0,class:"text-center py-8"},Ae={key:1,class:"overflow-auto max-h-[300px]"},Se={class:"min-w-full"},Ke={class:"divide-y divide-gray-200"},$e={class:"px-4 py-2 text-sm text-gray-900"},Me={class:"px-4 py-2 text-sm text-gray-600 text-right"},Ue={class:"px-4 py-2 text-sm text-gray-600 text-right"},Pe={class:"px-4 py-2 text-sm text-green-600 text-right font-medium"},Fe={class:"px-4 py-2 text-sm font-medium text-right"},Ie={class:"inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-blue-100 text-blue-800"},Oe={class:"mb-8"},qe={class:"card p-6"},Be={style:{height:"300px"}},He={class:"mb-8"},Ee={class:"card p-6"},je={class:"flex items-center justify-between mb-4"},Le={class:"flex gap-1 bg-gray-100 rounded-lg p-1"},Ve={class:"mb-4 text-sm text-gray-600"},Ye={key:0},Ne={key:1},ze={style:{height:"350px"}},Ge={__name:"DashboardView",setup(L){const U=ft(),{dashboardData:i,costsData:V,dashboardModelStats:w,trendData:q,apiKeysTrendData:T,formattedUptime:l,dateFilter:g,trendGranularity:R,apiKeysTrendMetric:_,defaultTime:Z}=ct(U),{loadDashboardData:J,loadUsageTrend:X,loadModelStats:tt,loadApiKeysTrend:Y,setDateFilterPreset:K,onCustomDateRangeChange:et,setTrendGranularity:N,refreshChartsData:$,disabledDate:z}=U,B=k(null),a=k(null),r=k(null);let n=null,o=null,c=null;function m(p){return p>=1e6?(p/1e6).toFixed(2)+"M":p>=1e3?(p/1e3).toFixed(2)+"K":p.toString()}function C(p,e){if(!e||e.length===0)return 0;const f=e.reduce((u,A)=>u+A.allTokens,0);return f===0?0:(p/f*100).toFixed(1)}function G(){if(!B.value)return;n&&n.destroy();const p=w.value||[],e={labels:p.map(f=>f.model),datasets:[{data:p.map(f=>f.allTokens),backgroundColor:["#3B82F6","#10B981","#F59E0B","#EF4444","#8B5CF6","#EC4899","#14B8A6","#F97316","#6366F1","#84CC16"],borderWidth:0}]};n=new ot(B.value,{type:"doughnut",data:e,options:{responsive:!0,maintainAspectRatio:!1,plugins:{legend:{position:"bottom",labels:{padding:15,usePointStyle:!0,font:{size:12}}},tooltip:{callbacks:{label:function(f){const u=f.label||"",A=m(f.parsed),P=C(f.parsed,p);return`${u}: ${A} (${P}%)`}}}}}})}function W(){if(!a.value)return;o&&o.destroy();const p=q.value||[],e=p.map(y=>y.inputTokens||0),f=p.map(y=>y.outputTokens||0),u=p.map(y=>y.cacheCreateTokens||0),A=p.map(y=>y.cacheReadTokens||0),P=p.map(y=>y.requests||0),x=p.map(y=>y.cost||0),F={labels:p.map(y=>y.date),datasets:[{label:"输入Token",data:e,borderColor:"rgb(102, 126, 234)",backgroundColor:"rgba(102, 126, 234, 0.1)",tension:.3},{label:"输出Token",data:f,borderColor:"rgb(240, 147, 251)",backgroundColor:"rgba(240, 147, 251, 0.1)",tension:.3},{label:"缓存创建Token",data:u,borderColor:"rgb(59, 130, 246)",backgroundColor:"rgba(59, 130, 246, 0.1)",tension:.3},{label:"缓存读取Token",data:A,borderColor:"rgb(147, 51, 234)",backgroundColor:"rgba(147, 51, 234, 0.1)",tension:.3},{label:"费用 (USD)",data:x,borderColor:"rgb(34, 197, 94)",backgroundColor:"rgba(34, 197, 94, 0.1)",tension:.3,yAxisID:"y2"},{label:"请求数",data:P,borderColor:"rgb(16, 185, 129)",backgroundColor:"rgba(16, 185, 129, 0.1)",tension:.3,yAxisID:"y1"}]};o=new ot(a.value,{type:"line",data:F,options:{responsive:!0,maintainAspectRatio:!1,interaction:{mode:"index",intersect:!1},plugins:{title:{display:!0,text:"Token使用趋势",font:{size:16,weight:"bold"}},legend:{position:"top"},tooltip:{mode:"index",intersect:!1,callbacks:{label:function(y){const D=y.dataset.label||"";let S=y.parsed.y;return D==="费用 (USD)"?S<.01?D+": $"+S.toFixed(6):D+": $"+S.toFixed(4):D==="请求数"?D+": "+S.toLocaleString()+" 次":D+": "+S.toLocaleString()+" tokens"}}}},scales:{x:{type:"category",display:!0,title:{display:!0,text:R.value==="hour"?"时间":"日期"}},y:{type:"linear",display:!0,position:"left",title:{display:!0,text:"Token数量"},ticks:{callback:function(y){return m(y)}}},y1:{type:"linear",display:!0,position:"right",title:{display:!0,text:"请求数"},grid:{drawOnChartArea:!1},ticks:{callback:function(y){return y.toLocaleString()}}},y2:{type:"linear",display:!1,position:"right"}}}})}function H(){var P;if(!r.value)return;c&&c.destroy();const p=T.value.data||[],e=_.value,f=["#3B82F6","#10B981","#F59E0B","#EF4444","#8B5CF6","#EC4899","#14B8A6","#F97316","#6366F1","#84CC16"],u=((P=T.value.topApiKeys)==null?void 0:P.map((x,F)=>{var S,nt;const y=T.value.data.map(M=>!M.apiKeys||!M.apiKeys[x]?0:e==="tokens"?M.apiKeys[x].tokens:M.apiKeys[x].requests||0);return{label:((nt=(S=T.value.data.find(M=>M.apiKeys&&M.apiKeys[x]))==null?void 0:S.apiKeys[x])==null?void 0:nt.name)||`API Key ${x}`,data:y,borderColor:f[F%f.length],backgroundColor:f[F%f.length]+"20",tension:.4,fill:!1}}))||[],A={labels:p.map(x=>x.date),datasets:u};c=new ot(r.value,{type:"line",data:A,options:{responsive:!0,maintainAspectRatio:!1,plugins:{legend:{position:"bottom",labels:{padding:20,usePointStyle:!0,font:{size:12}}},tooltip:{mode:"index",intersect:!1,callbacks:{label:function(x){const F=x.dataset.label||"",y=x.parsed.y,D=_.value==="tokens"?" tokens":" 次";return F+": "+y.toLocaleString()+D}}}},scales:{x:{type:"category",display:!0,title:{display:!0,text:R.value==="hour"?"时间":"日期"}},y:{beginAtZero:!0,title:{display:!0,text:_.value==="tokens"?"Token 数量":"请求次数"},ticks:{callback:function(x){return m(x)}}}}}})}async function Q(){await Y(_.value),await E(),H()}return st(w,()=>{E(()=>G())}),st(q,()=>{E(()=>W())}),st(T,()=>{E(()=>H())}),pt(async()=>{await Promise.all([J(),$()]),await E(),G(),W(),H()}),(p,e)=>{const f=it;return h(),b("div",null,[t("div",gt,[t("div",xt,[t("div",bt,[t("div",null,[e[6]||(e[6]=t("p",{class:"text-sm font-semibold text-gray-600 mb-1"},"总API Keys",-1)),t("p",vt,d(s(i).totalApiKeys),1),t("p",ht,"活跃: "+d(s(i).activeApiKeys||0),1)]),e[7]||(e[7]=t("div",{class:"stat-icon flex-shrink-0 bg-gradient-to-br from-blue-500 to-blue-600"},[t("i",{class:"fas fa-key"})],-1))])]),t("div",kt,[t("div",Ct,[t("div",null,[e[8]||(e[8]=t("p",{class:"text-sm font-semibold text-gray-600 mb-1"},"服务账户",-1)),t("p",Tt,d(s(i).totalAccounts),1),t("p",_t,[v(" 活跃: "+d(s(i).activeAccounts||0)+" ",1),s(i).rateLimitedAccounts>0?(h(),b("span",Dt," | 限流: "+d(s(i).rateLimitedAccounts),1)):I("",!0)])]),e[9]||(e[9]=t("div",{class:"stat-icon flex-shrink-0 bg-gradient-to-br from-green-500 to-green-600"},[t("i",{class:"fas fa-user-circle"})],-1))])]),t("div",wt,[t("div",Rt,[t("div",null,[e[10]||(e[10]=t("p",{class:"text-sm font-semibold text-gray-600 mb-1"},"今日请求",-1)),t("p",At,d(s(i).todayRequests),1),t("p",St,"总请求: "+d(m(s(i).totalRequests||0)),1)]),e[11]||(e[11]=t("div",{class:"stat-icon flex-shrink-0 bg-gradient-to-br from-purple-500 to-purple-600"},[t("i",{class:"fas fa-chart-line"})],-1))])]),t("div",Kt,[t("div",$t,[t("div",null,[e[12]||(e[12]=t("p",{class:"text-sm font-semibold text-gray-600 mb-1"},"系统状态",-1)),t("p",Mt,d(s(i).systemStatus),1),t("p",Ut,"运行时间: "+d(s(l)),1)]),e[13]||(e[13]=t("div",{class:"stat-icon flex-shrink-0 bg-gradient-to-br from-yellow-500 to-orange-500"},[t("i",{class:"fas fa-heartbeat"})],-1))])])]),t("div",Pt,[t("div",Ft,[t("div",It,[t("div",Ot,[e[18]||(e[18]=t("p",{class:"text-sm font-semibold text-gray-600 mb-1"},"今日Token",-1)),t("div",qt,[t("p",Bt,d(m((s(i).todayInputTokens||0)+(s(i).todayOutputTokens||0)+(s(i).todayCacheCreateTokens||0)+(s(i).todayCacheReadTokens||0))),1),t("span",Ht,"/ "+d(s(V).todayCosts.formatted.totalCost),1)]),t("div",Et,[t("div",jt,[t("span",null,[e[14]||(e[14]=v("输入: ",-1)),t("span",Lt,d(m(s(i).todayInputTokens||0)),1)]),t("span",null,[e[15]||(e[15]=v("输出: ",-1)),t("span",Vt,d(m(s(i).todayOutputTokens||0)),1)]),(s(i).todayCacheCreateTokens||0)>0?(h(),b("span",Yt,[e[16]||(e[16]=v("缓存创建: ",-1)),t("span",Nt,d(m(s(i).todayCacheCreateTokens||0)),1)])):I("",!0),(s(i).todayCacheReadTokens||0)>0?(h(),b("span",zt,[e[17]||(e[17]=v("缓存读取: ",-1)),t("span",Gt,d(m(s(i).todayCacheReadTokens||0)),1)])):I("",!0)])])]),e[19]||(e[19]=t("div",{class:"stat-icon flex-shrink-0 bg-gradient-to-br from-indigo-500 to-indigo-600"},[t("i",{class:"fas fa-coins"})],-1))])]),t("div",Wt,[t("div",Qt,[t("div",Zt,[e[24]||(e[24]=t("p",{class:"text-sm font-semibold text-gray-600 mb-1"},"总Token消耗",-1)),t("div",Jt,[t("p",Xt,d(m((s(i).totalInputTokens||0)+(s(i).totalOutputTokens||0)+(s(i).totalCacheCreateTokens||0)+(s(i).totalCacheReadTokens||0))),1),t("span",te,"/ "+d(s(V).totalCosts.formatted.totalCost),1)]),t("div",ee,[t("div",se,[t("span",null,[e[20]||(e[20]=v("输入: ",-1)),t("span",ae,d(m(s(i).totalInputTokens||0)),1)]),t("span",null,[e[21]||(e[21]=v("输出: ",-1)),t("span",oe,d(m(s(i).totalOutputTokens||0)),1)]),(s(i).totalCacheCreateTokens||0)>0?(h(),b("span",ne,[e[22]||(e[22]=v("缓存创建: ",-1)),t("span",le,d(m(s(i).totalCacheCreateTokens||0)),1)])):I("",!0),(s(i).totalCacheReadTokens||0)>0?(h(),b("span",re,[e[23]||(e[23]=v("缓存读取: ",-1)),t("span",ie,d(m(s(i).totalCacheReadTokens||0)),1)])):I("",!0)])])]),e[25]||(e[25]=t("div",{class:"stat-icon flex-shrink-0 bg-gradient-to-br from-emerald-500 to-emerald-600"},[t("i",{class:"fas fa-database"})],-1))])]),t("div",de,[t("div",ue,[t("div",null,[e[26]||(e[26]=t("p",{class:"text-sm font-semibold text-gray-600 mb-1"},"平均RPM",-1)),t("p",ce,d(s(i).systemRPM||0),1),e[27]||(e[27]=t("p",{class:"text-xs text-gray-500 mt-1"},"每分钟请求数",-1))]),e[28]||(e[28]=t("div",{class:"stat-icon flex-shrink-0 bg-gradient-to-br from-orange-500 to-orange-600"},[t("i",{class:"fas fa-tachometer-alt"})],-1))])]),t("div",pe,[t("div",ye,[t("div",null,[e[29]||(e[29]=t("p",{class:"text-sm font-semibold text-gray-600 mb-1"},"平均TPM",-1)),t("p",me,d(s(i).systemTPM||0),1),e[30]||(e[30]=t("p",{class:"text-xs text-gray-500 mt-1"},"每分钟Token数",-1))]),e[31]||(e[31]=t("div",{class:"stat-icon flex-shrink-0 bg-gradient-to-br from-rose-500 to-rose-600"},[t("i",{class:"fas fa-rocket"})],-1))])])]),t("div",fe,[t("div",ge,[e[36]||(e[36]=t("h3",{class:"text-xl font-bold text-gray-900"},"模型使用分布与Token使用趋势",-1)),t("div",xe,[t("div",be,[(h(!0),b(lt,null,rt(s(g).presetOptions,u=>(h(),b("button",{key:u.value,onClick:A=>s(K)(u.value),class:j(["px-3 py-1 rounded-md text-sm font-medium transition-colors",s(g).preset===u.value&&s(g).type==="preset"?"bg-white text-blue-600 shadow-sm":"text-gray-600 hover:text-gray-900"])},d(u.label),11,ve))),128))]),t("div",he,[t("button",{onClick:e[0]||(e[0]=u=>s(N)("day")),class:j(["px-3 py-1 rounded-md text-sm font-medium transition-colors",s(R)==="day"?"bg-white text-blue-600 shadow-sm":"text-gray-600 hover:text-gray-900"])},e[32]||(e[32]=[t("i",{class:"fas fa-calendar-day mr-1"},null,-1),v("按天 ",-1)]),2),t("button",{onClick:e[1]||(e[1]=u=>s(N)("hour")),class:j(["px-3 py-1 rounded-md text-sm font-medium transition-colors",s(R)==="hour"?"bg-white text-blue-600 shadow-sm":"text-gray-600 hover:text-gray-900"])},e[33]||(e[33]=[t("i",{class:"fas fa-clock mr-1"},null,-1),v("按小时 ",-1)]),2)]),t("div",ke,[yt(f,{"default-time":s(Z),modelValue:s(g).customRange,"onUpdate:modelValue":e[2]||(e[2]=u=>s(g).customRange=u),type:"datetimerange","range-separator":"至","start-placeholder":"开始日期","end-placeholder":"结束日期",format:"YYYY-MM-DD HH:mm:ss","value-format":"YYYY-MM-DD HH:mm:ss",onChange:s(et),"disabled-date":s(z),size:"default",style:{width:"400px"},class:"custom-date-picker"},null,8,["default-time","modelValue","onChange","disabled-date"]),s(R)==="hour"?(h(),b("span",Ce,e[34]||(e[34]=[t("i",{class:"fas fa-info-circle"},null,-1),v(" 最多24小时 ",-1)]))):I("",!0)]),t("button",{onClick:e[3]||(e[3]=u=>s($)()),class:"btn btn-primary px-4 py-2 flex items-center gap-2"},e[35]||(e[35]=[t("i",{class:"fas fa-sync-alt"},null,-1),v("刷新 ",-1)]))])]),t("div",Te,[t("div",_e,[e[37]||(e[37]=t("h4",{class:"text-lg font-semibold text-gray-800 mb-4"},"Token使用分布",-1)),t("div",De,[t("canvas",{ref_key:"modelUsageChart",ref:B},null,512)])]),t("div",we,[e[40]||(e[40]=t("h4",{class:"text-lg font-semibold text-gray-800 mb-4"},"详细统计数据",-1)),s(w).length===0?(h(),b("div",Re,e[38]||(e[38]=[t("p",{class:"text-gray-500"},"暂无模型使用数据",-1)]))):(h(),b("div",Ae,[t("table",Se,[e[39]||(e[39]=t("thead",{class:"bg-gray-50 sticky top-0"},[t("tr",null,[t("th",{class:"px-4 py-2 text-left text-xs font-medium text-gray-700"},"模型"),t("th",{class:"px-4 py-2 text-right text-xs font-medium text-gray-700"},"请求数"),t("th",{class:"px-4 py-2 text-right text-xs font-medium text-gray-700"},"总Token"),t("th",{class:"px-4 py-2 text-right text-xs font-medium text-gray-700"},"费用"),t("th",{class:"px-4 py-2 text-right text-xs font-medium text-gray-700"},"占比")])],-1)),t("tbody",Ke,[(h(!0),b(lt,null,rt(s(w),u=>(h(),b("tr",{key:u.model,class:"hover:bg-gray-50"},[t("td",$e,d(u.model),1),t("td",Me,d(m(u.requests)),1),t("td",Ue,d(m(u.allTokens)),1),t("td",Pe,d(u.formatted?u.formatted.total:"$0.000000"),1),t("td",Fe,[t("span",Ie,d(C(u.allTokens,s(w)))+"% ",1)])]))),128))])])]))])])]),t("div",Oe,[t("div",qe,[t("div",Be,[t("canvas",{ref_key:"usageTrendChart",ref:a},null,512)])])]),t("div",He,[t("div",Ee,[t("div",je,[e[43]||(e[43]=t("h3",{class:"text-lg font-semibold text-gray-900"},"API Keys 使用趋势",-1)),t("div",Le,[t("button",{onClick:e[4]||(e[4]=u=>{_.value="requests",Q()}),class:j(["px-3 py-1 rounded-md text-sm font-medium transition-colors",s(_)==="requests"?"bg-white text-blue-600 shadow-sm":"text-gray-600 hover:text-gray-900"])},e[41]||(e[41]=[t("i",{class:"fas fa-exchange-alt mr-1"},null,-1),v("请求次数 ",-1)]),2),t("button",{onClick:e[5]||(e[5]=u=>{_.value="tokens",Q()}),class:j(["px-3 py-1 rounded-md text-sm font-medium transition-colors",s(_)==="tokens"?"bg-white text-blue-600 shadow-sm":"text-gray-600 hover:text-gray-900"])},e[42]||(e[42]=[t("i",{class:"fas fa-coins mr-1"},null,-1),v("Token 数量 ",-1)]),2)])]),t("div",Ve,[s(T).totalApiKeys>10?(h(),b("span",Ye," 共 "+d(s(T).totalApiKeys)+" 个 API Key显示使用量前 10 个 ",1)):(h(),b("span",Ne," 共 "+d(s(T).totalApiKeys)+" 个 API Key ",1))]),t("div",ze,[t("canvas",{ref_key:"apiKeysUsageTrendChart",ref:r},null,512)])])])])}}},es=mt(Ge,[["__scopeId","data-v-5170898f"]]);export{es as default};