Component({
  externalClasses: [
    'l-class'
  ],
  options: {
    multipleSlots: true // 在组件定义时的选项中启用多slot支持
  },
  relations: {
    '../step/index': {
      type: 'child',
      linked() {
        this.initSteps();
      },
      unlinked() {
        this.initSteps();
      }
    },
  },

  properties: {
    direction: {
      type: String,
      value: 'row',
      options: ['row', 'column']
    },
    activeIndex: {
      type: Number,
      value: 0
    },
    color: String,
    stepMinHeight: {
      type: String,
      value: '120'
    },
    status: {
      type: String,
      value: 'process',
      options: ['process', 'error']
    },
    dot: Boolean
  },

  observers: {
    'activeIndex': function () {
      this.initSteps()
    }
  },

  /**
   * 组件的初始数据
   */
  data: {

  },

  /**
   * 组件的方法列表
   */
  methods: {
    initSteps() {
      let steps = this.getRelationNodes('../step/index')
      this.data.length = steps.length
      if (this.data.length > 0) {
        steps.forEach((step, index) => {
          step.updateDataChange({
            index,
            ...this.data,
            stepsWidth: 375
          });
        });
      }
    }
  }
});