2 lines
1.4 KiB
JavaScript
2 lines
1.4 KiB
JavaScript
import{a as m,r as u,s as _,H as g,cG as y,o as D,h as b,i as l,t as n}from"./index.c1c766ec.js";import{u as C}from"./useECharts.3db5b6c0.js";import{c}from"./colors.69d1b0cd.js";const w={class:"bg-[#1D2D35] p-10px"},S={class:"text-base"},j=m({__name:"LineCharts",props:{loading:Boolean,data:{type:Object,default:()=>{}}},setup(x){const a=x,i=u(null),{setOptions:f}=C(i),o=_({x_axis:[],series:[]});function p(e){const s={legendData:[],series:[]};return e.series.forEach(({name:t,data:d},h)=>{const r=c[h%c.length];s.legendData.push(t+""),s.series.push({name:t,data:d,type:"line",smooth:!1,itemStyle:{color:r.itemColor},areaStyle:{color:r.areaColor}})}),s}return g(()=>a.data,e=>{if(e){e.x_axis,e.series,o.x_axis=e.x_axis,o.series=e.series;const s=p({x_axis:e.x_axis,series:e.series});f({grid:{left:"2%",right:"20px",top:"10%",bottom:"2%",containLabel:!0},legend:{data:s.legendData,top:"0%",right:"0",textStyle:{color:"#ffffff"}},tooltip:{trigger:"axis",axisPointer:{lineStyle:{width:1,color:"#019680"}}},xAxis:{type:"category",data:o.x_axis.map(t=>y(t).format("HH:mm")),axisTick:{show:!1},axisLine:{show:!1}},yAxis:[{type:"value",axisTick:{show:!1},splitLine:{lineStyle:{type:"dashed"}}}],series:s.series})}},{immediate:!0}),(e,s)=>(D(),b("div",w,[l("div",S,n(a.data.name)+"\uFF08"+n(a.data.unit)+"\uFF09",1),l("div",{ref_key:"chartRef",ref:i,class:"w-full h-300px"},null,512)]))}});export{j as default};
|