vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

added default slot to ProgressBar

pull/451/head
lochstar 2020-08-26 09:01:28 +10:00
parent f2b4d1b3f3
commit 496ba4132b
2 changed files with 11 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/progressbar/ProgressBar.vue
View File

@ -1,7 +1,9 @@
<template> <template>
<div role="progressbar" :class="containerClass" aria-valuemin="0" :aria-valuenow="value" aria-valuemax="100"> <div role="progressbar" :class="containerClass" aria-valuemin="0" :aria-valuenow="value" aria-valuemax="100">
<div v-if="determinate" class="p-progressbar-value p-progressbar-value-animate" :style="progressStyle"></div> <div v-if="determinate" class="p-progressbar-value p-progressbar-value-animate" :style="progressStyle"></div>
<div v-if="determinate && value && showValue" class="p-progressbar-label">{{value + '%'}}</div> <div v-if="determinate && value && showValue" class="p-progressbar-label">
<slot>{{value + '%'}}</slot>
</div>
<div v-if="indeterminate" class="p-progressbar-indeterminate-container"> <div v-if="indeterminate" class="p-progressbar-indeterminate-container">
<div class="p-progressbar-value p-progressbar-value-animate"></div> <div class="p-progressbar-value p-progressbar-value-animate"></div>
</div> </div>

8
src/views/progressbar/ProgressBarDoc.vue
View File

@ -23,6 +23,14 @@ data() {
<p>Indeterminate is simplly enabled using <i>mode</i> property.</p> <p>Indeterminate is simplly enabled using <i>mode</i> property.</p>
<CodeHighlight> <CodeHighlight>
&lt;ProgressBar mode="indeterminate"/&gt; &lt;ProgressBar mode="indeterminate"/&gt;
</CodeHighlight>
<h5>Slot</h5>
<p>A custom label can be placed inside the progress bar via the default slot.</p>
<CodeHighlight>
&lt;ProgressBar :value="value"&gt;
Percent Complete
&lt;/ProgressBar&gt;
</CodeHighlight> </CodeHighlight>
<h5>Properties</h5> <h5>Properties</h5>