import{i as c}from"./index.1703796278973314.js";import{f as m}from"./tool.1703796278973.js";import{_ as h}from"./_plugin-vue_export-helper.1703796278973.js";import{o as n,x as d,z as a,A as i,B as l}from"./vue.1703796278973.js";import"./dayjs.min.1703796278973.js";const f={name:"TopEchartsItemNode",props:{title:{type:String,default:""},value:{type:Number,default:0},max:{type:Number,default:0},bottom:{type:String,default:""},formatter:{type:String,default:"%"}},data(){return{options:{}}},methods:{createChart(t){const s=this.$refs.chartRef;if(s&&Object.keys(t).length>0){const e=c(s);e.setOption(t),window.addEventListener("resize",function(){e.resize()})}},getOptions(t,s,e){let o=0;this.options={series:[{...m,max:t||100,axisLabel:{distance:-22,color:"auto",fontSize:12,width:30,padding:[6,10,0,10],formatter:r=>(o+=1,[1,3,6,9,11].includes(o)?r+(s||"%"):"")},data:[{value:e||0}]}]}}},watch:{options:{handler(t){this.createChart(t)},immediate:!0,deep:!0},max:{handler(t){this.getOptions(t,this.formatter,this.value)},immediate:!0,deep:!0},value:{handler(t){this.getOptions(this.max,this.formatter,t)},immediate:!0,deep:!0},formatter:{handler(t){this.getOptions(this.max,t,this.value)},immediate:!0,deep:!0}}},u={class:"echarts-item"},_={class:"echarts-item-left"},p={class:"echarts-item-title"},v={class:"echarts-item-value"},g={key:0,class:"echarts-item-bottom"},b={class:"echarts-item-right"},x={ref:"chartRef",style:{width:"100%",height:"100px"}};function y(t,s,e,o,r,N){return n(),d("div",u,[a("div",_,[a("div",p,i(e.title),1),a("div",v,i(e.value||0)+" "+i(e.formatter||"%"),1),e.bottom?(n(),d("div",g,i(e.bottom),1)):l("",!0)]),a("div",b,[a("div",x,null,512)])])}const k=h(f,[["render",y],["__scopeId","data-v-f8cffbb8"]]);export{k as default};