You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

40 lines
686 B

  1. <template>
  2. <view
  3. :class="[
  4. size,
  5. radius ? 'radius' : '',
  6. round ? 'round' : '',
  7. striped ? 'striped' : '',
  8. active && striped ? 'active' : ''
  9. ]"
  10. class="cu-progress"
  11. >
  12. <view :class="[color ? 'bg-' + color : '']" :style="{ width: displayPercent + '%' }">
  13. {{ noText ? '' : displayPercent + '%' }}
  14. </view>
  15. </view>
  16. </template>
  17. <script>
  18. export default {
  19. name: 'l-progress',
  20. props: {
  21. percent: {},
  22. noText: {},
  23. color: {},
  24. radius: {},
  25. round: {},
  26. size: { default: 'df' },
  27. striped: {},
  28. active: {}
  29. },
  30. computed: {
  31. displayPercent() {
  32. return Number(this.percent) || 0
  33. }
  34. }
  35. }
  36. </script>