<template>
  <div>
    <BasicTree ref="asyncExpandTreeRef" title="部门和职级列表" toolbar treeWrapperClassName="h-[calc(100%-35px)] overflow-auto"
      loadData :clickRowToExpand="false" :treeData="treeData"
      :fieldNames="{ key: 'id', title: 'name' ,disabled:'disabled'}" :defaultExpandAll="true" :checkable="true"
      :checkStrictly="true" @check="handleSelect" />
  </div>
</template>
<script lang="ts" setup>
  import { reactive, ref, onMounted, nextTick, unref } from 'vue';

  import { BasicTree, TreeItem } from '@/components/Tree';

  import { getOrgPositonTree, userOrgs } from '@/api/demo/system';

  defineOptions({ name: 'RoleManagement' });
  const treeData = ref < TreeItem[] > ([]);
  const asyncExpandTreeRef = ref < Nullable < TreeActionType >> (null);
  const posData = ref([])
  function treeIterator(tree) {
    tree.forEach((node) => {
      if (node.key == 0) {
        node.name = "部门--" + node.name
        node.disableCheckbox = true
      } else {
        node.name = "职级--" + node.name
        // 需要拼接parentName
        posData.value.push(node)
      }
      node.children && treeIterator(node.children)
    })
  }
  async function fetch() {
    const data = (await getOrgPositonTree()) as unknown as TreeItem[];
    treeIterator(data)
    treeData.value = await data
    // 展开全部
    nextTick(() => {
      unref(asyncExpandTreeRef)?.expandAll(true);
    });
  }
  onMounted(() => {
    fetch();
  });
  let orgList = ref([])
  let posList = ref([])
  function handleSelect(checkedKeys, e: { checked: bool, checkedNodes, node, event }) {
    const list = e.checkedNodes
    console.log(e.node)
    console.log(checkedKeys)
    orgList.value = []
    posList.value = []
    list.forEach(element => {
      if (element.key > 0) {
        posList.value.push({
          orgId: Number(element.tag),
          posId: element.id,
        })
      } else {
        orgList.value.push({
          orgId: element.id,
          posId: 0,
        })
      }
    });
  }
  function getRow() {
    let rows = getSelectRows();
    return rows
  }
  defineExpose({
    getRow
  })

</script>