Blame view

components/steps/steps.vue 3.17 KB
7fa943eb   梁灏   init
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
  <template>
      <div :class="classes">
          <slot></slot>
      </div>
  </template>
  <script>
      import { oneOf } from '../../utils/assist';
  
      const prefixCls = 'ivu-steps';
  
      export default {
          props: {
              current: {
                  type: Number,
                  default: 0
              },
              status: {
                  validator (value) {
                      return oneOf(value, ['wait', 'process', 'finish', 'error']);
                  },
                  default: 'process'
              },
              size: {
                  validator (value) {
                      return oneOf(value, ['small']);
                  }
              },
              direction: {
                  validator (value) {
                      return oneOf(value, ['horizontal', 'vertical']);
                  },
                  default: 'horizontal'
              }
          },
          computed: {
              classes () {
                  return [
                      `${prefixCls}`,
                      `${prefixCls}-${this.direction}`,
                      {
                          [`${prefixCls}-${this.size}`]: !!this.size
                      }
                  ]
              }
          },
          ready () {
              this.updateChildProps(true);
              this.setNextError();
              this.updateCurrent(true);
          },
          methods: {
              updateChildProps (isInit) {
                  this.$children.forEach((child, index) => {
                      child.stepNumber = index + 1;
  
                      // 如果已存在status,且在初始化时,则略过
                      // todo 如果当前是error,在current改变时需要处理
                      if (!(isInit && child.status)) {
                          if (index == this.current) {
                              if (this.status != 'error') {
                                  child.status = 'process';
                              }
                          } else if (index < this.current) {
                              child.status = 'finish';
                          } else {
                              child.status = 'wait';
                          }
                      }
  
                      if (child.status != 'error' && index != 0) {
                          this.$children[index - 1].nextError = false;
                      }
                  });
              },
              setNextError () {
                  this.$children.forEach((child, index) => {
                      if (child.status == 'error' && index != 0) {
                          this.$children[index - 1].nextError = true;
                      }
                  });
              },
              updateCurrent (isInit) {
                  if (isInit) {
                      const current_status = this.$children[this.current].status;
                      if (!current_status) {
                          this.$children[this.current].status = this.status;
                      }
                  } else {
                      this.$children[this.current].status = this.status;
                  }
              }
          },
          watch: {
              current () {
                  this.updateChildProps();
              },
              status () {
                  this.updateCurrent();
              }
          }
      }
  </script>