https://clipo.ai/assets/ServiceHistory-BmHw2ejg.js

1import{r as C,w as p,x as u,au as y,j as e,m as r,P as z,T as s,ay as D,B as d,aw as g,b0 as A,gf as k,f$ as S,n as W,L as v,gg as j,bk as B,K as T,M as R}from"./index-aREvobyF.js";import{P as H}from"./PageMetaHeader-6lUw-EYb.js";import{A as U}from"./ai-usage-bPe2Ot8y.js";import{S as _}from"./SimpleTable-DF7EMZw0.js";import{C as w}from"./react-apexcharts.min-fYSCb3wM.js";import"./link-box-DcUyRFYn.js";import"./table-BqH1TAsn.js";import"./index-Dz2fSXDx.js";try{let t=typeof window<"u"?window:typeof global<"u"?global:typeof globalThis<"u"?globalThis:typeof self<"u"?self:{},o=new t.Error().stack;o&&(t._sentryDebugIds=t._sentryDebugIds||{},t._sentryDebugIds[o]="2f9ad3b5-7d54-4686-96ff-f3d498366d37",t._sentryDebugIdIdentifier="sentry-dbid-2f9ad3b5-7d54-4686-96ff-f3d498366d37")}catch{}const M=t=>{const o=U[t];if(!o)return e.jsx(e.Fragment,{});const n=t==="GT"?"blue.500":"skyBlue.300",c=t==="GT"?"blue.50":"skyBlue.50",i={width:"fit-content",py:1,px:2,borderRadius:"base",fontSize:"sm",fontWeight:500,display:"flex",alignItems:"center"};return e.jsx(d,{bg:c,color:n,...i,children:o})},G=()=>{const[t,o]=C.useState("-created_at"),{data:n}=p(u.serviceHistories.aiUsageHistories({limit:20,offset:0,sort:t})),c=y({base:!0,md:!1},{fallback:"md"});return e.jsxs(r,{flex:1,mt:6,flexDirection:"column",bg:"white",borderRadius:"lg",p:{base:5,md:6},children:[e.jsxs(z,{justifyContent:"space-between",children:[e.jsx(s,{fontSize:"xl",fontWeight:600,children:"최근 AI 이용내역"}),e.jsx(D,{w:"12rem",value:[t],items:Object.entries(F).map(([i,x])=>({label:x,value:i})),onValueChange:({value:i})=>{o(i[0])}})]}),e.jsx(d,{mt:6,children:e.jsx(_,{size:"md",width:"100%",rows:(n==null?void 0:n.items.map((i,x)=>({key:i.key,cells:[{key:"번호",children:x+1},{key:"분류",display:"flex",justifyContent:"center",children:M(i.category),hidden:c},{key:"이용한 AI",children:i.name},{key:"이용 횟수",children:i.amount},{key:"이용일시",children:g(i.created_at).format(A)}]})))??[],header:{columns:[{key:"번호",children:e.jsx(r,{alignItems:"center",justifyContent:"center",children:e.jsx(s,{textStyle:"b1-regular",children:"번호"})})},{key:"분류",hidden:c,children:e.jsx(r,{alignItems:"center",justifyContent:"center",children:e.jsx(s,{textStyle:"b1-regular",children:"분류"})})},{key:"이용한 AI",children:e.jsx(r,{alignItems:"center",justifyContent:"center",children:e.jsx(s,{textStyle:"b1-regular",children:"이용한 AI"})})},{key:"이용 횟수",children:e.jsx(r,{alignItems:"center",justifyContent:"center",children:e.jsx(s,{textStyle:"b1-regular",children:"이용 횟수"})})},{key:"이용일시",children:e.jsx(r,{alignItems:"center",justifyContent:"center",children:e.jsx(s,{textStyle:"b1-regular",children:"이용일시"})})}]}})})]})},F={"-created_at":"이용일시 내림차순",created_at:"이용일시 오름차순","-amount":"이용 횟수 내림차순",amount:"이용 횟수 오름차순","-name":"이용한 AI 내림차순",name:"이용한 AI 오름차순"},$=()=>{const{data:t}=p(u.serviceHistories.aiUsage),o=(t==null?void 0:t.daily.map(l=>g(l.date).format(k)))||[],n=(t==null?void 0:t.daily.map(l=>l.count))||[],[c,i,x]=S("colors",["blue.400","gray.500","gray.700"]),f=y({base:!1,md:!0})??!1,b=(l,a)=>`
2      <div style="background: rgba(35, 35, 35, 0.3); border-radius: 6px; padding: 8px; width:110px; display: flex; flex-direction: column;">
3        <p style="font-size: 12px;">${l} 사용량</p>
4        <p style="font-size: 16px; font-weight: 600; color: white; opacity: 1;">${a}회</p>
5      </div>
6      `,m=()=>e.jsxs(d,{minWidth:180,display:"flex",borderRadius:"md",bg:"gray.50",p:5,flexDirection:"column",alignItems:"flex-start",children:[e.jsx(s,{color:"black.400",fontSize:"xs",fontWeight:500,children:"오늘 사용한 AI 이용 횟수"}),e.jsxs(s,{mt:1,fontSize:"2xl",fontWeight:600,children:[e.jsxs(s,{as:"span",color:"blue.500",children:[t==null?void 0:t.today_usage," "]}),"회"]})]}),h=Math.max(...n,1);return e.jsxs(r,{flexDirection:"column",flex:1,gap:4,color:"black.600",children:[e.jsxs(d,{borderRadius:"xl",borderColor:"gray.100",borderWidth:1,borderStyle:"solid",p:{base:5,md:6},bg:"white",display:"flex",flexDirection:"column",children:[e.jsxs(r,{color:"black.600",children:[e.jsx(r,{flex:1,children:e.jsxs(r,{flexDirection:"column",children:[e.jsx(r,{alignItems:"center",children:e.jsx(s,{fontSize:"lg",fontWeight:600,children:"AI 이용량"})}),e.jsxs(s,{mt:3,fontSize:"sm",pr:3,color:"black.400",fontWeight:500,children:["AI 기능을 실행할 때마ë

6‹¤ AI 이용 횟수가 사용됩니다.",e.jsx("br",{}),"무료 체험 기간 동안 매일 30개의 AI 이용 횟수가 제공됩니다.",e.jsx("br",{}),e.jsx(W,{asChild:!0,variant:"link",size:"sm",fontWeight:500,textDecoration:"underline",color:"black.400",children:e.jsx(v,{to:"/teachers/pricing-plan",children:"요금제 알아보기"})}),"를 통해 더 많은 이용량을 확보해 보세요.",e.jsx("br",{})]})]})}),f&&m()]}),!f&&e.jsx(r,{mt:3,children:m()})]}),e.jsxs(d,{border:"1px #DAD9D7 solid",borderColor:"gray.100",borderWidth:1,borderStyle:"solid",p:{base:5,md:6},bg:"white",borderRadius:"lg",children:[e.jsx(s,{fontSize:"lg",fontWeight:600,children:"일별 AI 이용량"}),e.jsx(d,{mt:5,children:e.jsx(w,{width:"100%",series:[{type:"bar",name:"aiUsage",data:n}],options:{fill:{colors:[c]},chart:{type:"bar",toolbar:{show:!1}},stroke:{curve:"smooth",colors:[c],width:0},xaxis:{categories:o,tooltip:{enabled:!1},labels:{style:{fontSize:"16px",fontWeight:500,colors:o.map(()=>"#888784")}}},tooltip:{theme:"dark",custom:({dataPointIndex:l})=>b(o[l],n[l])},yaxis:{max:h,labels:{style:{fontSize:"12px",colors:[i]}}},plotOptions:{bar:{borderRadius:6,borderRadiusApplication:"end"}},annotations:{yaxis:[{y:h,borderColor:"transparent",label:{borderColor:"transparent",style:{color:x,background:"transparent",fontSize:"12px"},text:"(측정기준: 이용 횟수)",position:"left",offsetX:410,offsetY:-10}}]}}})})]})]})},E=()=>{const{data:t}=p(u.serviceHistories.diskUsage),o=(t==null?void 0:t.daily.map(a=>g(a.date).format(k)))||[],n=(t==null?void 0:t.daily.map(a=>j(a.total_used_space)))||[],[c,i,x,f]=S("colors",["blue.100","blue.500","gray.500","gray.700"]),b=y({base:!1,md:!0})??!1,m=(a,I)=>`
7      <div style="background: rgba(35, 35, 35, 0.3); border-radius: 6px; padding: 8px; width:110px; display: flex; flex-direction: column;">
8        <p style="font-size: 12px;">${a} 사용량</p>
9        <p style="font-size: 16px; font-weight: 600; color: white; opacity: 1; align-self: start;">${I}GB</p>
10      </div>
11      `,h=()=>e.jsx(r,{flexDirection:"column",flexWrap:"wrap",children:e.jsxs(d,{alignSelf:"flex-end",display:"flex",borderRadius:"md",bg:"gray.50",p:5,minWidth:170,flexDirection:"column",alignItems:"flex-start",children:[e.jsx(s,{color:"black.400",fontSize:"xs",fontWeight:500,children:"저장 공간 이용"}),e.jsxs(s,{mt:1,textStyle:"t1-semibold-compact",children:[e.jsxs(s,{as:"span",color:"blue.500",children:[j((t==null?void 0:t.total_disk_usage)??0)," "]}),"GB"]})]})}),l=Math.max(...n,1);return e.jsxs(r,{flexDirection:"column",flex:1,gap:4,color:"black.600",children:[e.jsxs(d,{borderColor:"gray.100",borderWidth:1,borderStyle:"solid",borderRadius:"lg",bg:"white",p:{base:5,md:6},display:"flex",flexDirection:"column",children:[e.jsxs(r,{children:[e.jsx(r,{flex:1,children:e.jsxs(r,{flexDirection:"column",children:[e.jsx(r,{alignItems:"center",children:e.jsx(s,{fontSize:"lg",fontWeight:600,children:"저장 공간 이용량"})}),e.jsxs(s,{color:"black.400",fontSize:"sm",pr:3,fontWeight:500,mt:3,children:["클리포는 업로드된 과제 파일을 안전하게 보관하고 있습니다.",e.jsx("br",{}),"현재 사용 중인 저장 용량을 확인하고, ",e.jsx("br",{}),"필요에 따라 효율적으로 관리해 보세요."]})]})}),b&&h()]}),!b&&e.jsx(r,{mt:3,children:h()})]}),e.jsxs(d,{borderColor:"gray.100",borderWidth:1,borderStyle:"solid",borderRadius:"lg",p:{base:5,md:6},bg:"white",children:[e.jsx(s,{fontSize:"lg",fontWeight:600,children:"일별 저장 공간 이용량"}),e.jsx(d,{mt:5,children:e.jsx(w,{width:"100%",series:[{type:"area",name:"diskUsage",data:n}],options:{fill:{colors:[c]},chart:{type:"area",toolbar:{show:!1}},stroke:{curve:"smooth",colors:[i],width:3},xaxis:{categories:o,tooltip:{enabled:!1},labels:{style:{fontSize:"16px",fontWeight:500,colors:o.map(()=>f)}}},tooltip:{theme:"dark",custom:({dataPointIndex:a})=>m(o[a],n[a])},yaxis:{max:l,labels:{style:{fontSize:"12px",colors:[x]}}},annotations:{yaxis:[{y:l,borderColor:"transparent",label:{borderColor:"transparent",style:{color:f,background:"transparent",fontSize:"12px"},text:"(측정기준: GB)",position:"left",offsetX:460,offsetY:-10}}]}}})})]})]})},Q=()=>(B(),e.jsx(T,{maxWidth:R,children:e.jsxs(r,{display:"column",mb:10,px:{base:5,md:0},children:[e.jsx(H,{title:"서비스 이용 내역",description:"클리포 저장 공간과 AI 이용 내역 등 전체 서비스 현황을 확인하고 효율적으로 관리할 수 있습니다."}),e.jsxs(r,{gap:4,flexDirection:{base:"column",md:"row"},children:[e.jsx(E,{}),e.jsx($,{})]}),e.jsx(G,{})]})}));export{Q as default};
12//# sourceMappingURL=ServiceHistory-BmHw2ejg.js.map