<template>
  <div class="main_content">
    <CardList class="box-card" v-for="(item, index) in stepOneList" :key="index" :cardList="item" />
    <!-- <div class="step_next step_btn" @click="handleNext">下一步</div> -->
  </div>
</template>
<script>
import CardList from '@/components/base/CardList.vue'

export default {
  components: {
    CardList
  },
  props: {
    activeStep: {
      type: Number,
      default: 0
    },
    stepOneList: {
      type: Array
    }
  },
  data() {
    return {}
  },
  methods: {
    // 下一步
    handleStepOne() {
      let flag = true
      this.stepOneList.forEach(item =>
        item.form.personAttribute.forEach(it => {
          if (it.equal === '' || it.personal === '' || it.range === '') {
            flag = false
          }
        })
      )
      if (!flag) {
        this.$message.warning('请完善改步骤后才能进入下一步')
      }
      return flag
    }
  }
}
</script>
<style lang="scss" scoped>
.main_content {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  .box-card {
    min-width: 520px;
  }
  .step_btn {
    width: 119px;
    height: 32px;
    border-radius: 16px;
    font-size: 18px;
    line-height: 32px;
    color: #ffffff;
    text-align: center;
    cursor: pointer;
    background: #49bba2;
    margin: 30px auto;
    cursor: pointer;
  }
}
</style>
