<template>
  <div class="tree-list-dw">
    <div class="list-box">
      <ul class="li-item-left1_li" v-for="items in list" :key="items.id">
        <template v-if="items.childrens.length == 0">
          <li v-for="item in childrens.childrens" :key="item.prop">
            <div class="li-item-left1">
              <el-input-number @change="inputChange(item, titles)" v-model="getDeptDisabled(item).fraction"
                :precision="0" :max="11000 - 0" :disabled="getDeptDisabled(item).disabled"
                :placeholder="getDeptDisabled(item).placeholder"></el-input-number>
            </div>
          </li>
        </template>
        <template v-else>
          <tree-list-dw :list="items.childrens" :titles="titles" v-on="$listeners" :childrens="childrens">
          </tree-list-dw>
        </template>
      </ul>
    </div>
  </div>
</template>

<script>
export default {
  name: 'treeListDw',
  props: {
    list: {
      type: Array,
      default: () => {
        return [];
      }
    },
    titles: {
      type: Object,
      default: () => {
        return {};
      }
    },
    childrens: {
      type: Object
    }
  },
  data() {
    return {

    };
  },
  methods: {
    getDeptDisabled(item) {
      let dept = this.list[0].deptArr.find(obj => obj.deptId == item.prop);

      if (dept) {
        dept.fraction = dept.disabled ? undefined : dept.fraction;
        dept.placeholder = dept.disabled ? '不可编辑' : '请输入';
      } else {
        dept = { fraction: undefined, disabled: false, placeholder: '请输入' };
      }
      return dept;
    },
    inputChange(item, titles) {
      this.$emit('input-change', item, titles);
    }
  }
};
</script>

<style lang="scss" scoped>
</style>
