2 lines
4.2 KiB
JavaScript
2 lines
4.2 KiB
JavaScript
import{W as e,X as t,d as a,a4 as s,a5 as r,cy as n,cs as o,at as i,aM as l,bb as c,aQ as u,a1 as p,o as d,c as f,n as h,a as y,f as v,aE as g,A as k,t as b,j as x,i as $,w as m,aF as w,aa as F,a6 as N,ae as B}from"./index-vMt5tOuI.js";const I=e({type:{type:String,default:"line",values:["line","circle","dashboard"]},percentage:{type:Number,default:0,validator:e=>e>=0&&e<=100},status:{type:String,default:"",values:["","success","exception","warning"]},indeterminate:{type:Boolean,default:!1},duration:{type:Number,default:3},strokeWidth:{type:Number,default:6},strokeLinecap:{type:t(String),default:"round"},textInside:{type:Boolean,default:!1},width:{type:Number,default:126},showText:{type:Boolean,default:!0},color:{type:t([String,Array,Function]),default:""},striped:Boolean,stripedFlow:Boolean,format:{type:t(Function),default:e=>`${e}%`}}),D=["aria-valuenow"],S={viewBox:"0 0 100 100"},T=["d","stroke","stroke-linecap","stroke-width"],W=["d","stroke","opacity","stroke-linecap","stroke-width"],E={key:0},L=a({name:"ElProgress"});const M=B(N(a({...L,props:I,setup(e){const t=e,a={success:"#13ce66",exception:"#ff4949",warning:"#e6a23c",default:"#20a0ff"},N=s("progress"),B=r((()=>({width:`${t.percentage}%`,animationDuration:`${t.duration}s`,backgroundColor:q(t.percentage)}))),I=r((()=>(t.strokeWidth/t.width*100).toFixed(1))),L=r((()=>["circle","dashboard"].includes(t.type)?Number.parseInt(""+(50-Number.parseFloat(I.value)/2),10):0)),M=r((()=>{const e=L.value,a="dashboard"===t.type;return`\n M 50 50\n m 0 ${a?"":"-"}${e}\n a ${e} ${e} 0 1 1 0 ${a?"-":""}${2*e}\n a ${e} ${e} 0 1 1 0 ${a?"":"-"}${2*e}\n `})),_=r((()=>2*Math.PI*L.value)),j=r((()=>"dashboard"===t.type?.75:1)),A=r((()=>`${-1*_.value*(1-j.value)/2}px`)),P=r((()=>({strokeDasharray:`${_.value*j.value}px, ${_.value}px`,strokeDashoffset:A.value}))),z=r((()=>({strokeDasharray:`${_.value*j.value*(t.percentage/100)}px, ${_.value}px`,strokeDashoffset:A.value,transition:"stroke-dasharray 0.6s ease 0s, stroke 0.6s ease, opacity ease 0.6s"}))),C=r((()=>{let e;return e=t.color?q(t.percentage):a[t.status]||a.default,e})),Q=r((()=>"warning"===t.status?n:"line"===t.type?"success"===t.status?o:i:"success"===t.status?l:c)),V=r((()=>"line"===t.type?12+.4*t.strokeWidth:.111111*t.width+2)),X=r((()=>t.format(t.percentage)));const q=e=>{var a;const{color:s}=t;if(u(s))return s(e);if(p(s))return s;{const t=function(e){const t=100/e.length;return e.map(((e,a)=>p(e)?{color:e,percentage:(a+1)*t}:e)).sort(((e,t)=>e.percentage-t.percentage))}(s);for(const a of t)if(a.percentage>e)return a.color;return null==(a=t[t.length-1])?void 0:a.color}};return(e,t)=>(d(),f("div",{class:h([y(N).b(),y(N).m(e.type),y(N).is(e.status),{[y(N).m("without-text")]:!e.showText,[y(N).m("text-inside")]:e.textInside}]),role:"progressbar","aria-valuenow":e.percentage,"aria-valuemin":"0","aria-valuemax":"100"},["line"===e.type?(d(),f("div",{key:0,class:h(y(N).b("bar"))},[v("div",{class:h(y(N).be("bar","outer")),style:g({height:`${e.strokeWidth}px`})},[v("div",{class:h([y(N).be("bar","inner"),{[y(N).bem("bar","inner","indeterminate")]:e.indeterminate},{[y(N).bem("bar","inner","striped")]:e.striped},{[y(N).bem("bar","inner","striped-flow")]:e.stripedFlow}]),style:g(y(B))},[(e.showText||e.$slots.default)&&e.textInside?(d(),f("div",{key:0,class:h(y(N).be("bar","innerText"))},[k(e.$slots,"default",{percentage:e.percentage},(()=>[v("span",null,b(y(X)),1)]))],2)):x("v-if",!0)],6)],6)],2)):(d(),f("div",{key:1,class:h(y(N).b("circle")),style:g({height:`${e.width}px`,width:`${e.width}px`})},[(d(),f("svg",S,[v("path",{class:h(y(N).be("circle","track")),d:y(M),stroke:`var(${y(N).cssVarName("fill-color-light")}, #e5e9f2)`,"stroke-linecap":e.strokeLinecap,"stroke-width":y(I),fill:"none",style:g(y(P))},null,14,T),v("path",{class:h(y(N).be("circle","path")),d:y(M),stroke:y(C),fill:"none",opacity:e.percentage?1:0,"stroke-linecap":e.strokeLinecap,"stroke-width":y(I),style:g(y(z))},null,14,W)]))],6)),!e.showText&&!e.$slots.default||e.textInside?x("v-if",!0):(d(),f("div",{key:2,class:h(y(N).e("text")),style:g({fontSize:`${y(V)}px`})},[k(e.$slots,"default",{percentage:e.percentage},(()=>[e.status?(d(),$(y(F),{key:1},{default:m((()=>[(d(),$(w(y(Q))))])),_:1})):(d(),f("span",E,b(y(X)),1))]))],6))],10,D))}}),[["__file","progress.vue"]]));export{M as E};
|