import{s as R}from"./pinia-1fd00649.js";import{c as L}from"./lodash-es-c8e56e34.js";import{b as $}from"./index-92492b5f.js";import{v as B}from"./hook-1ce4b33f.js";import{u as m,i as V,a as U,b as j,c as z,d as M,e as N,f as P,g as _,h as I,j as W,k as q,l as G,m as H,n as X,o as J,p as K,q as Q,r as Y}from"./echarts-2fc78c0b.js";import{e as O,r as p,l as Z,w as F,h as ee,o as te,n as ae,f as se,aa as t,c as r}from"./@vue-0f114043.js";import{T as l,R as ie,q as D}from"./naive-ui-8b684773.js";import"./vue-demi-71ba0ef2.js";import"./pinia-plugin-persistedstate-d93b4f94.js";import"./vue-i18n-37f9b77c.js";import"./@intlify-bd5dfa46.js";import"./vue-router-ed35b26a.js";import"./@vueuse-dacd7844.js";import"./screenfull-578bfdd4.js";import"./date-fns-7f923de7.js";import"./vueuc-4d05699f.js";import"./evtd-b614532e.js";import"./seemly-dc6f1e91.js";import"./@css-render-ad88a31e.js";import"./vooks-ab318924.js";import"./vdirs-b0483831.js";import"./@juggle-41516555.js";import"./css-render-57962bc1.js";import"./@emotion-8a8e73f6.js";import"./treemate-25c27bff.js";import"./date-fns-tz-230e778e.js";import"./async-validator-dee29e8b.js";import"./zrender-e8935425.js";const ne=(e,i,a,o=!1)=>{e&&i&&a&&e.addEventListener(i,a,o)},ue=(e,i,a,o=!1)=>{e&&i&&a&&e.removeEventListener(i,a,o)},S=(e,i)=>{e&&(B(i,"Object")?Object.keys(i).forEach(a=>{e.style[a]=i[a]}):B(i,"String")&&i.split(";").forEach(o=>{const[c,s]=o.split(":");c&&s&&(e.style[c.trim()]=s.trim())}))},d=O({name:"RayChart",props:{width:{type:String,default:"100%"},height:{type:String,default:"100%"},autoResize:{type:[Boolean,Object],default:!0},canvasRender:{type:Boolean,default:!0},showAria:{type:Boolean,default:!1},options:{type:Object,default:()=>({})},success:{type:Function,default:()=>({})},error:{type:Function,default:()=>({})},theme:{type:[String,Object],default:""},autoChangeTheme:{type:Boolean,default:!1},use:{type:Array,default:()=>[]},watchOptions:{type:Boolean,default:!0}},setup(e){const i=$(),{themeValue:a}=R(i),o=p(),c=p();let s;const C=Z(()=>({"--ray-chart-width":e.width,"--ray-chart-height":e.height})),b=async()=>{m([U,j,z,M,N,P,_,I]),m([W,q,G,H,X,J]),m([K,Q]),m([Y]);try{m(e.use)}catch{console.error("Error: wrong property and method passed in extend attribute")}},g=()=>{let u=L(e.options);const h=y=>Object.assign({},u,y);return e.showAria&&(u=h({aria:{enabled:!0,decal:{show:!0}}})),u},n=u=>{var w,v;const h=o.value,y=g(),{height:k,width:x}=h.getBoundingClientRect();k===0&&S(h,{height:"200px"}),x===0&&S(h,{width:"200px"});try{s=V(h,u),c.value=s,y&&s.setOption(y),(w=e.success)==null||w.call(e,s)}catch(T){(v=e.error)==null||v.call(e),console.error(T)}},f=u=>{if(e.autoChangeTheme){n(u?"dark":"");return}e.theme||n("")},E=()=>{s&&(s.clear(),s.dispose())},A=()=>{s&&s.resize()};return F(()=>[a.value],([u])=>{e.autoChangeTheme&&(E(),f(u))}),F(()=>e.showAria,()=>{E(),(e.autoChangeTheme||e.theme)&&a.value?n("dark"):n("")}),e.watchOptions&&F(()=>e.watchOptions,()=>{const u=g();s==null||s.setOption(u)}),ee(async()=>{await b()}),te(()=>{ae(()=>{e.autoChangeTheme?f(a.value):e.theme?n("dark"):n(""),e.autoResize&&ne(window,"resize",A)})}),se(()=>{E(),ue(window,"resize",A)}),{rayChartRef:o,cssVarsRef:C,echartInstance:c}},render(){return t("div",{class:"ray-chart",style:[this.cssVarsRef],ref:"rayChartRef"},null)}}),Ve=O({name:"Echart",setup(){const e=p(),i=p(!1),a=p(!1);return{baseOptions:{legend:{},tooltip:{},xAxis:{type:"category",data:["Mon","Tue","Wed","Thu","Fri","Sat","Sun"]},yAxis:{type:"value"},series:[{name:"日期",data:[120,200,150,80,70,110,130],type:"bar",showBackground:!0,backgroundStyle:{color:"rgba(180, 180, 180, 0.2)"}}]},baseChartRef:e,chartLoading:i,handleLoadingShow:n=>{if(e.value){const{echartInstance:f}=e.value;n?f.showLoading():f.hideLoading()}},chartAria:a,handleAriaShow:n=>{a.value=n},handleChartRenderSuccess:n=>{window.$notification.info({title:"可视化图渲染成功回调函数",content:"可视化图渲染成功, 并且返回了当前可视化图实例",duration:5*1e3})},basePieOptions:{title:{text:"Referer of a Website",subtext:"Fake Data",left:"center"},tooltip:{trigger:"item"},legend:{orient:"vertical",left:"left"},series:[{name:"Access From",type:"pie",radius:"50%",data:[{value:1048,name:"Search Engine"},{value:735,name:"Direct"},{value:580,name:"Email"},{value:484,name:"Union Ads"},{value:300,name:"Video Ads"}],emphasis:{itemStyle:{shadowBlur:10,shadowOffsetX:0,shadowColor:"rgba(0, 0, 0, 0.5)"}}}]},baseLineOptions:{title:{text:"Stacked Area Chart"},tooltip:{trigger:"axis",axisPointer:{type:"cross",label:{backgroundColor:"#6a7985"}}},legend:{data:["Email","Union Ads","Video Ads","Direct","Search Engine"]},toolbox:{feature:{saveAsImage:{}}},grid:{left:"3%",right:"4%",bottom:"3%",containLabel:!0},xAxis:[{type:"category",boundaryGap:!1,data:["Mon","Tue","Wed","Thu","Fri","Sat","Sun"]}],yAxis:[{type:"value"}],series:[{name:"Email",type:"line",stack:"Total",areaStyle:{},emphasis:{focus:"series"},data:[120,132,101,134,90,230,210]},{name:"Union Ads",type:"line",stack:"Total",areaStyle:{},emphasis:{focus:"series"},data:[220,182,191,234,290,330,310]},{name:"Video Ads",type:"line",stack:"Total",areaStyle:{},emphasis:{focus:"series"},data:[150,232,201,154,190,330,410]},{name:"Direct",type:"line",stack:"Total",areaStyle:{},emphasis:{focus:"series"},data:[320,332,301,334,390,330,320]},{name:"Search Engine",type:"line",stack:"Total",label:{show:!0,position:"top"},areaStyle:{},emphasis:{focus:"series"},data:[820,932,901,934,1290,1330,1320]}]}}},render(){return t("div",{class:"echart"},[t(l,null,{default:()=>[r("RayChart 组件使用")]}),t(ie,null,{default:()=>[r("该组件会默认以 200*200 宽高进行填充。预设了常用的图、方法组件，如果不满足需求，需要用 use 方法进行手动拓展。该组件实现了自动跟随模板主题切换功能，但是动态切换损耗较大，所以默认不启用")]}),t(l,null,{default:()=>[r("基础使用")]}),t("div",{class:"chart--container"},[t(d,{options:this.baseOptions},null)]),t(l,null,{default:()=>[r("渲染成功后运行回调函数")]}),t("div",{class:"chart--container"},[t(d,{options:this.basePieOptions,success:this.handleChartRenderSuccess.bind(this)},null)]),t(l,null,{default:()=>[r("能跟随主题切换的可视化图")]}),t("div",{class:"chart--container"},[t(d,{autoChangeTheme:!0,options:this.baseLineOptions,showAria:this.chartAria},null)]),t(l,null,{default:()=>[r("不跟随主题切换的暗色主题可视化图")]}),t("div",{class:"chart--container"},[t(d,{theme:"dark",options:this.baseOptions},null)]),t(l,null,{default:()=>[r("加载动画")]}),t(D,{value:this.chartLoading,"onUpdate:value":e=>this.chartLoading=e,onUpdateValue:this.handleLoadingShow.bind(this),style:["padding: 18px 0"]},{checked:()=>"隐藏加载动画",unchecked:()=>"显示加载动画"}),t("div",{class:"chart--container"},[t(d,{ref:"baseChartRef",options:this.baseOptions},null)]),t(l,null,{default:()=>[r("贴画可视化图")]}),t(D,{value:this.chartAria,"onUpdate:value":e=>this.chartAria=e,onUpdateValue:this.handleAriaShow.bind(this),style:["padding: 18px 0"]},{checked:()=>"隐藏贴花",unchecked:()=>"显示贴花"}),t("div",{class:"chart--container"},[t(d,{options:this.baseOptions,showAria:this.chartAria},null)])])}});export{Ve as default};