<template>
  <div class="todo-container">
    <div class="reimburse-container" v-for="(item, index) in itemSetting.properties" :key="index">
      <ReimburseCard :config="item" :postionIndex="index"></ReimburseCard>
    </div>
  </div>
</template>
<script>
import ReimburseCard from '../components/ReimburseCard'
export default {
  components: {
    ReimburseCard,
  },
  props: {
    itemSetting: {
      type: Object,
      default: () => {},
    },
  },
  data() {
    return {
      configList: [
        {
          SQL: '',
          title: '我的审批待办',
          templateName: '',
          desc: '',
          color: '',
        },
        {
          SQL: '',
          title: '我的审批待办',
          templateName: '',
          desc: '',
          color: '',
        },
        {
          SQL: '',
          title: '我的审批待办',
          templateName: '',
          desc: '',
          color: '',
        },
        {
          SQL: '',
          title: '我的审批待办',
          templateName: '',
          desc: '',
          color: '',
        },
      ],
    }
  },
  created() {
    console.log('itemSetting', this.itemSetting)
    let prop = this.itemSetting.properties
    if (!prop || prop.length == 0) {
      this.itemSetting.properties = {}
      this.itemSetting.properties = this.configList
    }
  },
  methods: {},
}
</script>
<style lang="less" scoped>
.todo-container {
  width: 100%;
  height: 100%;
  display: flex;
  flex-wrap: nowrap;

  .reimburse-container {
    position: relative;
    flex-grow: 1;
  }
}
</style>