<!--
 * @Description: 
 * @Autor: renchao
 * @LastEditTime: 2023-07-20 13:40:27
-->
<template>
  <dialogBox title="配置常办项目" @submitForm="submitForm" saveButton="保存" :isFullscreen="false" width="50%"
    @closeDialog="closeDialog" v-model="myValue">
    <Tree :data="projectList" show-checkbox node-key="id" :default-checked-keys="defaultCheckeds" ref="tree"
      default-expand-all :props="defaultProps" @check-change="handleClick" />
  </dialogBox>
</template>
<script>
  import { getMenuInfo } from "@/api/user.js";
  import Tree from "@/components/Tree/src/tree.vue"
  import { saveFrequentProjectsList, getHomeFrequentProjects } from "@/api/home.js";
  export default {
    components: {
      Tree
    },
    props: {
      value: { type: Boolean, default: false },
      bindItem: { type: Array, default: [] }
    },
    data () {
      return {
        myValue: false,
        defaultCheckeds: [],
        projectList: [],
        checkedItem: [],
        defaultProps: {
          children: "children",
          label: "name",
          disabled: function (data, node) {
            if (data.children && data.children.length > 0) {
              return true
            } else {
              return false
            }
          }
        },
        uniqueValue: ''//最后拿到的唯一选择的moduldCode值,相当于id
      }
    },
    watch: {
      value (val) {
        this.myValue = val
        if (val) {
          this.queryClick()
        }
      }
    },
    mounted () {
      this.dealCheckedItem();
    },
    methods: {
      submitForm () {
        var checkedNodes = this.$refs.tree.getCheckedNodes();
        if (checkedNodes.length > 6) {
          this.$message.error("最多选择6个项目！");
          return
        }
        saveFrequentProjectsList(checkedNodes).then(res => {
          if (res.code == 200) {
            this.$parent.queryProjectList();
            this.$message.success("保存成功");
            this.$emit("input", false);
          } else {
            this.$message.error(res.message);
          }
        })
      },
      queryClick () {
        let that = this
        getMenuInfo().then(res => {
          this.projectList = res.result.slice(0, -2)
        })
        function lookForAllId (arr = []) {
          for (let item of that.bindItem) {
            arr.push(item.id)
            if (item.children && item.children.length) lookForAllId(item.children, arr)
          }
          return arr
        }
        this.defaultCheckeds = lookForAllId()
      },
      dealCheckedItem () {
      },
      //关闭窗口
      closeDialog () {
        this.$emit("input", false);
      },
      //节点选择状态发生改变时
      handleClick (data, checked, node) {
        var checkedNodes = this.$refs.tree.getCheckedNodes();
        if (checkedNodes.length > 6) {
          this.$message({
            message: '最后选择6条数据',
            type: 'warning',
            customClass: 'messageIndex'
          })
          this.$refs.tree.setChecked(data, false) // 取消当前节点的选中状态
        }
      }
    }
  }
</script>
<style scoped lang='scss'>
  /deep/.el-tree-node.is-expanded > .el-tree-node__children {
    display: flex;
    flex-wrap: wrap;
  }
</style>