import{_ as l,B as o,o as e,c,x as a,D as n,N as r,L as v,M as F,a as d}from"./chunks/framework.68f3e7ab.js";const E=JSON.parse('{"title":"用法","description":"","frontmatter":{},"headers":[],"relativePath":"examples/Progress/index.md"}'),D={name:"examples/Progress/index.md"},p=s=>(v("data-v-9767431d"),s=s(),F(),s),i=p(()=>a("h1",{id:"用法",tabindex:"-1"},[d("用法 "),a("a",{class:"header-anchor",href:"#用法","aria-label":'Permalink to "用法"'},"​")],-1)),y=p(()=>a("h2",{id:"效果",tabindex:"-1"},[d("效果 "),a("a",{class:"header-anchor",href:"#效果","aria-label":'Permalink to "效果"'},"​")],-1)),u={style:{padding:"10px",border:"1px solid #ccc","border-radius":"10px","margin-top":"20px"}},_=r(`<h2 id="代码示例" tabindex="-1" data-v-9767431d>代码示例 <a class="header-anchor" href="#代码示例" aria-label="Permalink to &quot;代码示例&quot;" data-v-9767431d>​</a></h2><div class="language-js" data-v-9767431d><button title="Copy Code" class="copy" data-v-9767431d></button><span class="lang" data-v-9767431d>js</span><pre class="shiki material-theme-palenight" data-v-9767431d><code data-v-9767431d><span class="line" data-v-9767431d><span style="color:#89DDFF;" data-v-9767431d>&lt;</span><span style="color:#F07178;" data-v-9767431d>div</span><span style="color:#89DDFF;" data-v-9767431d> </span><span style="color:#C792EA;" data-v-9767431d>style</span><span style="color:#89DDFF;" data-v-9767431d>=</span><span style="color:#89DDFF;" data-v-9767431d>&quot;</span><span style="color:#C3E88D;" data-v-9767431d>padding:1em; border:1px solid #ccc;</span></span>
<span class="line" data-v-9767431d><span style="color:#C3E88D;" data-v-9767431d>border-radius:10px;</span></span>
<span class="line" data-v-9767431d><span style="color:#C3E88D;" data-v-9767431d>margin-top:20px;</span><span style="color:#89DDFF;" data-v-9767431d>&quot;</span><span style="color:#89DDFF;" data-v-9767431d>&gt;</span></span>
<span class="line" data-v-9767431d><span style="color:#A6ACCD;" data-v-9767431d>     </span><span style="color:#89DDFF;" data-v-9767431d>&lt;</span><span style="color:#FFCB6B;" data-v-9767431d>xs-progress</span><span style="color:#89DDFF;" data-v-9767431d> :percentage=&quot;60&quot; </span><span style="color:#C792EA;" data-v-9767431d>Animation</span><span style="color:#89DDFF;" data-v-9767431d>&gt;&lt;/</span><span style="color:#FFCB6B;" data-v-9767431d>xs-progress</span><span style="color:#89DDFF;" data-v-9767431d>&gt;</span></span>
<span class="line" data-v-9767431d><span style="color:#A6ACCD;" data-v-9767431d>  </span><span style="color:#89DDFF;" data-v-9767431d>&lt;</span><span style="color:#FFCB6B;" data-v-9767431d>xs-progress</span></span>
<span class="line" data-v-9767431d><span style="color:#89DDFF;" data-v-9767431d>    :percentage=&quot;60&quot;</span></span>
<span class="line" data-v-9767431d><span style="color:#89DDFF;" data-v-9767431d>    </span><span style="color:#C792EA;" data-v-9767431d>Animation</span></span>
<span class="line" data-v-9767431d><span style="color:#89DDFF;" data-v-9767431d>    :text-inside=&quot;true&quot;</span></span>
<span class="line" data-v-9767431d><span style="color:#89DDFF;" data-v-9767431d>    :stroke-width=&quot;20&quot;</span></span>
<span class="line" data-v-9767431d><span style="color:#89DDFF;" data-v-9767431d>    </span><span style="color:#C792EA;" data-v-9767431d>status</span><span style="color:#89DDFF;" data-v-9767431d>=</span><span style="color:#89DDFF;" data-v-9767431d>&quot;</span><span style="color:#C3E88D;" data-v-9767431d>exception</span><span style="color:#89DDFF;" data-v-9767431d>&quot;</span></span>
<span class="line" data-v-9767431d><span style="color:#89DDFF;" data-v-9767431d>  &gt;&lt;/</span><span style="color:#FFCB6B;" data-v-9767431d>xs-progress</span><span style="color:#89DDFF;" data-v-9767431d>&gt;</span></span>
<span class="line" data-v-9767431d><span style="color:#A6ACCD;" data-v-9767431d>  </span><span style="color:#89DDFF;" data-v-9767431d>&lt;</span><span style="color:#FFCB6B;" data-v-9767431d>xs-progress</span></span>
<span class="line" data-v-9767431d><span style="color:#89DDFF;" data-v-9767431d>    :percentage=&quot;100&quot;</span></span>
<span class="line" data-v-9767431d><span style="color:#89DDFF;" data-v-9767431d>    </span><span style="color:#C792EA;" data-v-9767431d>Animation</span></span>
<span class="line" data-v-9767431d><span style="color:#89DDFF;" data-v-9767431d>    :text-inside=&quot;true&quot;</span></span>
<span class="line" data-v-9767431d><span style="color:#89DDFF;" data-v-9767431d>    :stroke-width=&quot;20&quot;</span></span>
<span class="line" data-v-9767431d><span style="color:#89DDFF;" data-v-9767431d>    </span><span style="color:#C792EA;" data-v-9767431d>status</span><span style="color:#89DDFF;" data-v-9767431d>=</span><span style="color:#89DDFF;" data-v-9767431d>&quot;</span><span style="color:#C3E88D;" data-v-9767431d>exception</span><span style="color:#89DDFF;" data-v-9767431d>&quot;</span></span>
<span class="line" data-v-9767431d><span style="color:#89DDFF;" data-v-9767431d>    </span><span style="color:#C792EA;" data-v-9767431d>type</span><span style="color:#89DDFF;" data-v-9767431d>=</span><span style="color:#89DDFF;" data-v-9767431d>&quot;</span><span style="color:#C3E88D;" data-v-9767431d>dashboard</span><span style="color:#89DDFF;" data-v-9767431d>&quot;</span></span>
<span class="line" data-v-9767431d><span style="color:#89DDFF;" data-v-9767431d>  &gt;&lt;/</span><span style="color:#FFCB6B;" data-v-9767431d>xs-progress</span><span style="color:#89DDFF;" data-v-9767431d>&gt;</span></span>
<span class="line" data-v-9767431d><span style="color:#89DDFF;" data-v-9767431d>&lt;/</span><span style="color:#F07178;" data-v-9767431d>div</span><span style="color:#89DDFF;" data-v-9767431d>&gt;</span></span>
<span class="line" data-v-9767431d></span>
<span class="line" data-v-9767431d><span style="color:#89DDFF;" data-v-9767431d>&lt;</span><span style="color:#F07178;" data-v-9767431d>script</span><span style="color:#89DDFF;" data-v-9767431d> </span><span style="color:#C792EA;" data-v-9767431d>setup</span><span style="color:#89DDFF;" data-v-9767431d> &gt;</span></span>
<span class="line" data-v-9767431d></span>
<span class="line" data-v-9767431d><span style="color:#89DDFF;" data-v-9767431d>&lt;/</span><span style="color:#F07178;" data-v-9767431d>script</span><span style="color:#89DDFF;" data-v-9767431d>&gt;</span></span>
<span class="line" data-v-9767431d></span>
<span class="line" data-v-9767431d><span style="color:#89DDFF;" data-v-9767431d>&lt;</span><span style="color:#F07178;" data-v-9767431d>style</span><span style="color:#89DDFF;" data-v-9767431d> </span><span style="color:#C792EA;" data-v-9767431d>lang</span><span style="color:#89DDFF;" data-v-9767431d>=</span><span style="color:#89DDFF;" data-v-9767431d>&quot;</span><span style="color:#C3E88D;" data-v-9767431d>scss</span><span style="color:#89DDFF;" data-v-9767431d>&quot;</span><span style="color:#89DDFF;" data-v-9767431d> </span><span style="color:#C792EA;" data-v-9767431d>scoped</span><span style="color:#89DDFF;" data-v-9767431d>&gt;</span></span>
<span class="line" data-v-9767431d><span style="color:#A6ACCD;" data-v-9767431d>:deep(svg) </span><span style="color:#89DDFF;" data-v-9767431d>{</span></span>
<span class="line" data-v-9767431d><span style="color:#A6ACCD;" data-v-9767431d>  height: 120px;</span></span>
<span class="line" data-v-9767431d><span style="color:#A6ACCD;" data-v-9767431d>  width: 120px;</span></span>
<span class="line" data-v-9767431d><span style="color:#89DDFF;" data-v-9767431d>}</span></span>
<span class="line" data-v-9767431d><span style="color:#89DDFF;" data-v-9767431d>&lt;/</span><span style="color:#F07178;" data-v-9767431d>style</span><span style="color:#89DDFF;" data-v-9767431d>&gt;</span></span>
<span class="line" data-v-9767431d></span></code></pre></div>`,2);function g(s,x,C,h,A,m){const t=o("xs-progress");return e(),c("div",null,[i,y,a("div",u,[n(t,{percentage:60,Animation:""}),n(t,{percentage:60,Animation:"","text-inside":!0,"stroke-width":20,status:"exception"}),n(t,{percentage:100,Animation:"","text-inside":!0,"stroke-width":20,status:"exception",type:"dashboard"})]),_])}const B=l(D,[["render",g],["__scopeId","data-v-9767431d"]]);export{E as __pageData,B as default};
