steps.vue 1.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
  1. <template>
  2. <div
  3. class="el-steps"
  4. :class="[
  5. !simple && 'el-steps--' + direction,
  6. simple && 'el-steps--simple'
  7. ]">
  8. <slot></slot>
  9. </div>
  10. </template>
  11. <script>
  12. import Migrating from 'element-ui/src/mixins/migrating';
  13. export default {
  14. name: 'ElSteps',
  15. mixins: [Migrating],
  16. props: {
  17. space: [Number, String],
  18. active: Number,
  19. direction: {
  20. type: String,
  21. default: 'horizontal'
  22. },
  23. alignCenter: Boolean,
  24. simple: Boolean,
  25. finishStatus: {
  26. type: String,
  27. default: 'finish'
  28. },
  29. processStatus: {
  30. type: String,
  31. default: 'process'
  32. }
  33. },
  34. data() {
  35. return {
  36. steps: [],
  37. stepOffset: 0
  38. };
  39. },
  40. methods: {
  41. getMigratingConfig() {
  42. return {
  43. props: {
  44. 'center': 'center is removed.'
  45. }
  46. };
  47. }
  48. },
  49. watch: {
  50. active(newVal, oldVal) {
  51. this.$emit('change', newVal, oldVal);
  52. },
  53. steps(steps) {
  54. steps.forEach((child, index) => {
  55. child.index = index;
  56. });
  57. }
  58. }
  59. };
  60. </script>