You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1 lines
14 KiB
1 lines
14 KiB
import{g as wt,C as xt,j as Dt,c as o,a,k as L,p as R,F as _,r as v,t as r,A as m,x as K,s as p,o as l,G as A,n as Q,l as X,_ as Ct}from"./CTAruH_8.js";import{u as At}from"./9B2ftqmN.js";import"./D9HxoMhB.js";import"./yUUyh6cG.js";const Mt={class:"panel p-4 mb-5"},St={class:"flex flex-wrap items-end gap-3"},Nt={class:"form-control"},Bt=["value"],Lt={class:"form-control"},Rt=["value"],Vt={class:"form-control"},qt=["value"],zt={class:"grid grid-cols-2 md:grid-cols-4 gap-3 mb-8"},Ot={class:"body"},Ht={class:"lbl"},Tt={class:"val"},It={class:"today-wrap mb-8"},Gt={class:"sec-title hero",style:{"margin-bottom":"16px"}},Ut={class:"tag",style:{color:"#0369a1",background:"#dbeafe"}},Pt={class:"grid grid-cols-2 md:grid-cols-4 gap-4"},jt={class:"today-card-top"},Yt={class:"lbl"},Wt={class:"val"},Jt={class:"foot"},Zt={key:0,class:"delta up"},$t={class:"grid grid-cols-1 xl:grid-cols-2 gap-6"},Kt={class:"panel-head"},Qt=["stroke"],Xt=["d"],te={class:"font-semibold text-slate-700 text-sm"},ee={key:0,class:"ml-auto text-xs text-slate-400"},se={key:1,class:"ml-auto flex items-center gap-1"},ae=["onClick"],ne={class:"px-5 py-4"},oe={class:"grid grid-cols-2 sm:grid-cols-3 gap-2.5"},le={class:"stat-label"},re={class:"stat-val"},ie={key:0,style:{height:"170px","margin-top":"1rem"}},ce=wt({__name:"dashboard",setup(de){const k=xt(),{webApi:V,consoleApi:tt}=At(),q=[["cn","中国"],["us","美国"],["ea","东亚"],["sea","东南亚"],["sa","南亚"],["me","中东"],["eu","欧洲"],["ru","俄罗斯"],["af","非洲"],["sam","南美"],["nam","北美"],["oc","大洋洲"],["br","巴西"],["in","印度"]],et={new_user_count:["👥","#EEF2FF","#6366F1"],active_user_count:["🟢","#ECFDF5","#10B981"],bind_device_count:["📱","#E0F2FE","#0EA5E9"],qr_active_count:["🔳","#FCE7F3","#EC4899"],order_paid_count:["🧾","#FEF3C7","#F59E0B"],order_paid_amount:["💰","#FEE2E2","#EF4444"],pay_user_count:["⭐","#FFF7ED","#F97316"],meet_second:["🎙️","#CFFAFE","#22D3EE"],trade_second:["🌐","#F3E8FF","#8B5CF6"]},z=[["new_user_count","累计用户",!1],["bind_device_count","累计绑定设备",!1],["qr_active_count","累计二维码激活",!1],["order_paid_count","累计支付订单",!1],["order_paid_amount","累计支付金额",!0],["meet_second","累计会议时长",!1],["trade_second","累计翻译时长",!1]],O=[["new_user_count","新增用户",!1],["active_user_count","活跃用户",!1],["qr_active_count","二维码激活",!1],["order_paid_count","支付订单",!1],["order_paid_amount","支付金额",!0],["pay_user_count","付费用户",!1],["meet_second","会议时长",!1,!0],["trade_second","翻译时长",!1,!0]],E=[{key:"user",title:"用户增长",color:"#6366F1",tint:"#EEF2FF",icon:"M17 20h5v-2a4 4 0 00-3-3.87M9 20H4v-2a4 4 0 013-3.87m6-1.13a4 4 0 10-4-4 4 4 0 004 4z",stats:[["new_user_count","新增用户"],["active_user_count","活跃用户"],["login_user_count","登录用户"],["login_count","登录次数"]],lines:[["new_user_count","新增用户","#6366F1"],["active_user_count","活跃用户","#34D399"]]},{key:"device",title:"设备激活绑定",color:"#0EA5E9",tint:"#E0F2FE",icon:"M12 18h.01M8 21h8a2 2 0 002-2V5a2 2 0 00-2-2H8a2 2 0 00-2 2v14a2 2 0 002 2z",stats:[["active_device_count","已激活"],["bind_device_count","已绑定"]],lines:[["active_device_count","已激活","#0EA5E9"],["bind_device_count","已绑定","#818CF8"]]},{key:"qrcode",title:"二维码激活",color:"#EC4899",tint:"#FCE7F3",icon:"M12 4v1m6 11h2m-6 0h-1v4m-6-4H5m14 0h-2m-6-7H5m0 0V5m0 4v6m14-6V5h-4M5 5h4M5 19h4m6 0h4v-4M4 4h6v6H4V4zm10 0h6v6h-6V4zM4 14h6v6H4v-6z",stats:[["qr_active_count","二维码激活次数"]],lines:[["qr_active_count","二维码激活","#EC4899"]]},{key:"order",title:"订单支付",color:"#F59E0B",tint:"#FEF3C7",icon:"M3 3h2l.4 2M7 13h10l4-8H5.4M7 13L5.4 5M7 13l-2.293 2.293c-.63.63-.184 1.707.707 1.707H17m0 0a2 2 0 100 4 2 2 0 000-4zm-8 2a2 2 0 11-4 0 2 2 0 014 0z",stats:[["order_create_count","创建订单"],["order_paid_count","支付订单"],["order_failed_count","失败订单"],["pay_user_count","付费用户"],["order_paid_amount","支付金额",!0],["order_create_amount","创建金额",!0]],lines:[["order_paid_count","支付订单","#F59E0B"],["order_create_count","创建订单","#FCD34D"]]},{key:"meeting",title:"会议",color:"#22D3EE",tint:"#CFFAFE",icon:"M15 10l4.553-2.276A1 1 0 0121 8.618v6.764a1 1 0 01-1.447.894L15 14M5 18h8a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z",stats:[["meet_count","会议次数"],["meet_second","会议时长",!1,!0],["grant_meet_second","发放会议时长",!1,!0]],lines:[["meet_count","会议次数","#22D3EE"],["meet_second","会议时长(秒)","#0EA5E9"]]},{key:"translate",title:"翻译",color:"#8B5CF6",tint:"#F3E8FF",icon:"M3 5h12M9 3v2m1.048 9.5A18.022 18.022 0 016.412 9m6.088 9h7M11 21l5-10 5 10M12.751 5C11.783 10.77 8.07 15.61 3 18.129",stats:[["trade_count","翻译次数"],["trade_second","翻译时长",!1,!0],["trade_words","翻译字数"],["grant_trade_second","发放翻译时长",!1,!0]],lines:[["trade_count","翻译次数","#8B5CF6"],["trade_second","翻译时长(秒)","#A78BFA"]]}],f=m(()=>k.identity===3),st=m(()=>k.apps),H=m(()=>k.regions),T=m(()=>k.products.map(t=>parseInt(t)).filter(t=>!isNaN(t))),I=["new_user_count","active_user_count","qr_active_count"],at=m(()=>f.value?z.filter(t=>!I.includes(t[0])):z),nt=m(()=>f.value?O.filter(t=>!I.includes(t[0])):O),G=m(()=>f.value?E.filter(t=>t.key!=="user"&&t.key!=="qrcode"):E),ot=[[7,"7天"],[30,"30天"],[90,"90天"],[0,"全部"]],i=K({app:"",region:"",product:""}),F=p([]),M=p([]),lt=m(()=>f.value&&H.value.length?q.filter(t=>H.value.includes(t[0])).map(t=>({value:t[0],label:t[1]})):q.map(t=>({value:t[0],label:t[1]}))),U=p({}),P=p({}),S=p({}),j=p({}),Y=p("实时"),N=p({}),w=K({});E.forEach(t=>{w[t.key]=30});function x(t){const e=t.getFullYear(),s=("0"+(t.getMonth()+1)).slice(-2),n=("0"+t.getDate()).slice(-2);return parseInt(e+s+n)}function rt(t){if(!t)return{start:0,end:0};const e=new Date,s=new Date;return s.setDate(s.getDate()-(t-1)),{start:x(s),end:x(e)}}function it(t,e){return t=Number(t)||0,e?"¥"+(t/100).toLocaleString(void 0,{minimumFractionDigits:2,maximumFractionDigits:2}):t.toLocaleString()}function ct(t){t=Math.max(0,Math.floor(Number(t)||0));const e=Math.floor(t/3600),s=Math.floor(t%3600/60),n=t%60;return e>0?e+"时"+s+"分":s>0?s+"分"+n+"秒":n+"秒"}function B(t,e,s){return s?ct(t):it(t,e)}function dt(t){const e=String(t);return e.length===8?e.slice(4,6)+"-"+e.slice(6,8):e}function ut(t,e){return t=Number(t)||0,e=Number(e)||0,e===0?t>0?null:0:(t-e)/e*100}function g(t){return et[t]||["📊","#f1f5f9","#94a3b8"]}function _t(t){const e=t[0]==="bind_device_count"||t[0]==="active_device_count"?P.value:U.value,s=t[0]==="meet_second"||t[0]==="trade_second";return B(e[t[0]],t[2],s)}function vt(t){return B(S.value[t[0]],t[2],!!t[3])}function b(t){const e=ut(S.value[t[0]],j.value[t[0]]);if(e===null)return{type:"new",arrow:"",abs:""};const s=e>0?"up":e<0?"down":"flat",n=e>0?"▲":e<0?"▼":"—";return{type:s,arrow:n,abs:Math.abs(e).toFixed(1)}}function mt(t,e){return B((N.value[t.key]||{})[e[0]],e[2],e[3])}function D(){const t={};return i.app!==""&&(t.app_id=i.app),i.region!==""&&(t.region=i.region),i.product!==""&&(t.product_id=parseInt(String(i.product))),t}function W(){const t={};return i.product!==""&&(t.product_id=parseInt(String(i.product))),t}async function y(t,e){try{return{code:0,data:await V(t,e)??{}}}catch{return null}}async function pt(){const t=await y("getstatssummary",D());U.value=t&&t.code===0&&t.data?t.data:{};const e=await y("getstatssummary",W());P.value=e&&e.code===0&&e.data?e.data:{}}async function ft(){const t=x(new Date),e=new Date;e.setDate(e.getDate()-1);const s=x(e),n=D();n.start_day=t,n.end_day=t;const d=D();d.start_day=s,d.end_day=s;const u=await y("getstatssummary",n);S.value=u&&u.code===0&&u.data?u.data:{};const c=await y("getstatssummary",d);j.value=c&&c.code===0&&c.data?c.data:{};const C=new Date,Et=("0"+(C.getMonth()+1)).slice(-2),Ft=("0"+C.getDate()).slice(-2);Y.value=Et+"-"+Ft+" 实时"}async function J(t){let e;if(t.key==="device")e=W();else{const c=rt(w[t.key]);e=D(),e.start_day=c.start,e.end_day=c.end}const s=await y("getstatssummary",e),n=s&&s.code===0&&s.data?s.data:{};if(N.value={...N.value,[t.key]:n},t.key==="device")return;const d=await y("getstatstrend",e),u=d&&d.code===0?d.data||[]:[];bt(t,u)}function yt(t,e){w[t]=e;const s=E.find(n=>n.key===t);s&&J(s)}function Z(){pt(),ft(),G.value.forEach(t=>J(t))}const $={},h={};function gt(t,e){e&&($[t]=e)}function bt(t,e){const s=window.Chart,n=$[t.key];if(!s||!n)return;const d=e.map(c=>dt(c.stat_day)),u=t.lines.map(c=>({label:c[1],data:e.map(C=>Number(C[c[0]])||0),borderColor:c[2],backgroundColor:c[2]+"22",tension:.35,fill:!0,pointRadius:0,borderWidth:2}));if(h[t.key]){h[t.key].data.labels=d,h[t.key].data.datasets=u,h[t.key].update();return}h[t.key]=new s(n,{type:"line",data:{labels:d,datasets:u},options:{responsive:!0,maintainAspectRatio:!1,plugins:{legend:{position:"bottom",labels:{boxWidth:10,padding:12,font:{size:11}}}},scales:{x:{ticks:{maxTicksLimit:8,font:{size:10},color:"#94a3b8"},grid:{display:!1}},y:{beginAtZero:!0,ticks:{precision:0,maxTicksLimit:5,font:{size:10},color:"#94a3b8"},grid:{color:"#f1f5f9"}}},interaction:{mode:"index",intersect:!1}}})}async function ht(){if(f.value)F.value=st.value.map(t=>({value:t,label:t}));else try{const t=await tt("apps/list",{}),e=Array.isArray(t)?t:[];F.value=e.map(s=>({value:s.name||"",label:s.name||"应用#"+s.id}))}catch{F.value=[]}try{const t=await V("getproducts",{});let e=t&&t.products?t.products:[];f.value&&T.value.length&&(e=e.filter(s=>T.value.includes(s.id))),M.value=e.map(s=>({value:s.id,label:(s.devicename||"产品#"+s.id)+" (#"+s.id+")"}))}catch{M.value=[]}}function kt(){return new Promise(t=>{if(window.Chart)return t();const e=document.createElement("script");e.src="https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.min.js",e.onload=()=>t(),e.onerror=()=>t(),document.head.appendChild(e)})}return Dt(async()=>{await kt(),await ht(),Z()}),(t,e)=>(l(),o("div",null,[a("div",Mt,[a("div",St,[a("div",Nt,[e[4]||(e[4]=a("label",{class:"label py-1"},[a("span",{class:"label-text text-xs text-slate-500"},"应用")],-1)),L(a("select",{"onUpdate:modelValue":e[0]||(e[0]=s=>i.app=s),class:"select select-bordered select-sm w-40"},[e[3]||(e[3]=a("option",{value:""},"全部应用",-1)),(l(!0),o(_,null,v(F.value,s=>(l(),o("option",{key:s.value,value:s.value},r(s.label),9,Bt))),128))],512),[[R,i.app]])]),a("div",Lt,[e[6]||(e[6]=a("label",{class:"label py-1"},[a("span",{class:"label-text text-xs text-slate-500"},"区域")],-1)),L(a("select",{"onUpdate:modelValue":e[1]||(e[1]=s=>i.region=s),class:"select select-bordered select-sm w-32"},[e[5]||(e[5]=a("option",{value:""},"全部区域",-1)),(l(!0),o(_,null,v(lt.value,s=>(l(),o("option",{key:s.value,value:s.value},r(s.label),9,Rt))),128))],512),[[R,i.region]])]),a("div",Vt,[e[8]||(e[8]=a("label",{class:"label py-1"},[a("span",{class:"label-text text-xs text-slate-500"},"产品")],-1)),L(a("select",{"onUpdate:modelValue":e[2]||(e[2]=s=>i.product=s),class:"select select-bordered select-sm w-48"},[e[7]||(e[7]=a("option",{value:""},"全部产品",-1)),(l(!0),o(_,null,v(M.value,s=>(l(),o("option",{key:s.value,value:s.value},r(s.label),9,qt))),128))],512),[[R,i.product]])]),a("button",{class:"btn btn-primary btn-sm text-white",onClick:Z},"查询"),e[9]||(e[9]=a("span",{class:"text-xs text-slate-400 ml-auto self-center"},"顶部为全量总览；各版面右上角可单独选时间周期",-1))])]),e[14]||(e[14]=a("div",{class:"sec-title muted"},[a("span",{class:"bar",style:{background:"#cbd5e1"}}),a("h2",null,"累计数据"),a("span",{class:"sub"},"全量累计 · 随筛选条件变化")],-1)),a("div",zt,[(l(!0),o(_,null,v(at.value,s=>(l(),o("div",{key:s[0],class:"cum-card"},[a("span",{class:"ico",style:A({background:g(s[0])[1]})},r(g(s[0])[0]),5),a("div",Ot,[a("div",Ht,r(s[1]),1),a("div",Tt,r(_t(s)),1)])]))),128))]),a("div",It,[a("div",Gt,[e[10]||(e[10]=a("span",{class:"bar",style:{background:"linear-gradient(180deg,#0EA5E9,#22D3EE)"}},null,-1)),e[11]||(e[11]=a("h2",null,"今日数据",-1)),a("span",Ut,r(Y.value),1),e[12]||(e[12]=a("span",{class:"sub"},"今日 0 点至现在 · 含较昨日同比（设备类无日期维度，仅见累计）",-1))]),a("div",Pt,[(l(!0),o(_,null,v(nt.value,s=>(l(),o("div",{key:s[0],class:"today-card"},[a("span",{class:"accent",style:A({background:g(s[0])[2]})},null,4),a("div",jt,[a("span",Yt,r(s[1]),1),a("span",{class:"ico",style:A({background:g(s[0])[1]})},r(g(s[0])[0]),5)]),a("div",Wt,r(vt(s)),1),a("div",Jt,[b(s).type==="new"?(l(),o("span",Zt,"新")):b(s).type!=="none"?(l(),o("span",{key:1,class:Q(["delta",b(s).type])},r(b(s).arrow)+" "+r(b(s).abs)+"%",3)):X("",!0),e[13]||(e[13]=a("span",null,"较昨日",-1))])]))),128))])]),e[15]||(e[15]=a("div",{class:"sec-title"},[a("span",{class:"bar",style:{background:"linear-gradient(180deg,#10B981,#22D3EE)"}}),a("h2",null,"趋势分析"),a("span",{class:"sub"},"各版面右上角可独立选择时间周期")],-1)),a("div",$t,[(l(!0),o(_,null,v(G.value,s=>(l(),o("div",{key:s.key,class:"panel"},[a("div",Kt,[a("span",{class:"panel-dot",style:A({background:s.tint})},[(l(),o("svg",{width:"17",height:"17",fill:"none",viewBox:"0 0 24 24",stroke:s.color},[a("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:s.icon},null,8,Xt)],8,Qt))],4),a("span",te,r(s.title),1),s.key==="device"?(l(),o("span",ee,"当前累计 · 无日期维度")):(l(),o("div",se,[(l(),o(_,null,v(ot,n=>a("button",{key:n[0],class:Q(["tbtn",{"tbtn-on":n[0]===w[s.key]}]),onClick:d=>yt(s.key,Number(n[0]))},r(n[1]),11,ae)),64))]))]),a("div",ne,[a("div",oe,[(l(!0),o(_,null,v(s.stats,n=>(l(),o("div",{key:n[0],class:"stat-box"},[a("div",le,r(n[1]),1),a("div",re,r(mt(s,n)),1)]))),128))]),s.key!=="device"?(l(),o("div",ie,[a("canvas",{ref_for:!0,ref:n=>gt(s.key,n)},null,512)])):X("",!0)])]))),128))])]))}}),pe=Ct(ce,[["__scopeId","data-v-7dbe8712"]]);export{pe as default};
|
|
|