<template>
  <div class="dof-collapse">
    <slot></slot>
  </div>
</template>
<style>
.dof-collapse {
  position: relative;
}
</style>
<script>
export default {
  props: {
    //手风琴效果
    accordion: {
      type: Boolean,
      default: false
    },
    activeNames: {
      type: [Number, String],
      default: -1
    }
  },
  provide() {
    return {
      _activeData: this.activeData
    }
  },
  data() {
    return {
      activeData: { _activeName: -1, accordion: this.accordion }
    }
  },
  computed: {},
  created() {},
  methods: {
    //接收子组件点击事件
    collapseClick(value) {
      if (this.accordion) {
        this.activeData._activeName = this.activeData._activeName == value.name ? 0 : value.name
        this.$emit('change', { name: this.activeData._activeName })
      } else {
        //从数组中去除
        if (value.collapsed) {
          if (this.activeNames.length) {
            let currIndex = this.activeNames.findIndex(x => x == value.name)
            this.activeNames.splice(currIndex, 1)
          }
        } else {
          this.activeNames.push(Number(value.name))
          this.activeNames.sort((a, b) => {
            return a - b
          })
        }
        this.$emit('change', { name: this.activeNames })
      }
    }
  }
}
</script>
