indeterminate-progress.vue 731 B

1234567891011121314151617181920212223242526272829
  1. <template>
  2. <div class="demo-progress">
  3. <el-progress :percentage="50" :indeterminate="true" />
  4. <el-progress :percentage="100" :format="format" :indeterminate="true" />
  5. <el-progress
  6. :percentage="100"
  7. status="success"
  8. :indeterminate="true"
  9. :duration="5"
  10. />
  11. <el-progress
  12. :percentage="100"
  13. status="warning"
  14. :indeterminate="true"
  15. :duration="1"
  16. />
  17. <el-progress :percentage="50" status="exception" :indeterminate="true" />
  18. </div>
  19. </template>
  20. <script lang="ts" setup>
  21. const format = (percentage) => (percentage === 100 ? 'Full' : `${percentage}%`)
  22. </script>
  23. <style scoped>
  24. .demo-progress .el-progress--line {
  25. margin-bottom: 15px;
  26. width: 350px;
  27. }
  28. </style>