https://detiklife.com/static/js/report-overview-C89ps4TJ.js

1import{r as w}from"./rolldown-runtime-BNNRdYrd.js";import{A as F,At as o,C as s,Ct as D,E as u,L as S,M as A,Q as p,S as C,Yt as L,_ as B,_n as $,_t as z,it as O,mn as h,nt as N,zt as V}from"./vue.runtime.esm-bundler-BXOQDxND.js";import{i as M}from"./core-m9dZxrlL.js";import{vt as P}from"./index-DbIsMhdV.js";import{t as T}from"./useEcharts-D1m6t4ke.js";import{t as j}from"./report-Dn6540UH.js";S();D(),L();var q={class:"mine-card w-auto p-3 xl:w-8/12"},G={class:"grid grid-cols-2 mt-6 gap-y-3 md:grid-cols-4"},H={class:"text-base"},I=A({__name:"report-overview",setup(R){const a=M(),l=o([]),v=o([]),d=o([]),m=o([]),f=o([]),_=o();function g(e){return e.map(t=>`<div class="content-panel">
2        <p>
3          <span style="background-color: ${t.color}" class="tooltip-item-icon"></span><span>${t.seriesName}</span>
4        </p>
5        <span class="tooltip-value">${t.value.toLocaleString()}</span>
6      </div>`).reverse().join("")}const y=C(()=>[{title:"内容生产量",value:1902,prefix:{icon:"heroicons:pencil-square",background:a.value==="dark"?"#593E2F":"#FFE4BA",iconColor:a.value==="dark"?"#F29A43":"#F77234"}},{title:"内容点击量",value:2445,prefix:{icon:"heroicons:hand-thumb-up",background:a.value==="dark"?"#3D5A62":"#E8FFFB",iconColor:a.value==="dark"?"#6ED1CE":"#33D1C9"}},{title:"内容曝光量",value:3034,prefix:{icon:"heroicons:heart-16-solid",background:a.value==="dark"?"#354276":"#E8F3FF",iconColor:a.value==="dark"?"#4A7FF7":"#165DFF"}},{title:"活跃用户数",value:1275,prefix:{icon:"heroicons:user-16-solid",background:a.value==="dark"?"#3F385E":"#F5E8FF",iconColor:a.value==="dark"?"#8558D3":"#722ED1"}}]);function i(e,t,n,c){return{name:e,data:c,stack:"Total",type:"line",smooth:!0,symbol:"circle",symbolSize:10,itemStyle:{color:t},emphasis:{focus:"series",itemStyle:{color:t,borderWidth:2,borderColor:n}},lineStyle:{width:2,color:t},showSymbol:!1,areaStyle:{opacity:.1,color:t}}}const{getOverviewData:b}=j(),x=b();l.value=x.xAxis,x.data.forEach(e=>{e.name==="内容生产量"?v.value=e.value:e.name==="内容点击量"?d.value=e.value:e.name==="内容曝光量"&&(m.value=e.value),f.value=e.value});const k={grid:{left:"2.6%",right:"4",top:"40",bottom:"40"},xAxis:{type:"category",offset:2,data:l.value,boundaryGap:!1,axisLabel:{color:"#4E5969",formatter(e,t){return t===0||t===l.value.length-1?"":`${e}`}},axisLine:{show:!1},axisTick:{show:!1},splitLine:{show:!1},axisPointer:{show:!0,lineStyle:{color:"#23ADFF",width:2}}},yAxis:{type:"value",axisLine:{show:!1},axisLabel:{formatter(e,t){return t===0?String(e):`${e/1e3}k`}},splitLine:{lineStyle:{color:a.value==="dark"?"#2E2E30":"#F2F3F5"}}},tooltip:{trigger:"axis",formatter(e){const[t]=e;return`<div>
7            <p class="tooltip-title">${t.axisValueLabel}</p>
8            ${g(e)}
9          </div>`},className:"echarts-tooltip-diy"},graphic:{elements:[{type:"text",left:"2.6%",bottom:"18",style:{text:"12.10",textAlign:"center",fill:"#4E5969",fontSize:12}},{type:"text",right:"0",bottom:"18",style:{text:"12.17",textAlign:"center",fill:"#4E5969",fontSize:12}}]},series:[i("内容生产量","#722ED1","#F5E8FF",v.value),i("内容点击量","#F77234","#FFE4BA",d.value),i("内容曝光量","#33D1C9","#E8FFFB",m.value),i("活跃用户数","#3469FF","#E8F3FF",f.value)]};return T(_).setOption(k),(e,t)=>{const n=P,c=O("el-statistic");return p(),u("div",q,[t[0]||(t[0]=s("div",{class:"text-base"}," 报表总览 ",-1)),s("div",G,[(p(!0),u(B,null,N(V(y),(r,E)=>(p(),u("div",{key:E,class:"content flex gap-3"},[s("div",{class:"h-[50px] w-[50px] flex-center rounded-md p-1",style:h({background:r.prefix.background})},[F(n,{name:r.prefix.icon,style:h({color:r.prefix.iconColor}),size:50},null,8,["name","style"])],4),F(c,{value:r.value},{title:z(()=>[s("div",H,$(r.title),1)]),_:2},1032,["value"])]))),128))]),s("div",{ref_key:"echartsOverview",ref:_,class:"mt-5 h-400px"},null,512)])}}}),Z=w({default:()=>Q}),Q=I;export{Z as n,Q as t};