<template>
  <div style="position: absolute"> </div>
  <div class="bg-white m-4 mr-0 overflow-hidden">
    <BasicTree
      title="组织列表"
      toolbar
      search
      :clickRowToExpand="false"
      :treeData="treeData"
      :expandedKeys="treeExpandData"
      :replaceFields="{ key: 'id', title: 'name' }"
      :selectedKeys="selectedKeys"
      @select="handleSelect"
      v-bind="$attrs"
    />
  </div>
</template>
<script lang="ts" setup name="OrganizationIdTree">
  import { onMounted, ref } from 'vue';
  import { BasicTree, TreeItem } from '/@/components/Tree';
  import { getOrganizationList } from '/@/api/system/system';

  const emit = defineEmits(['select']);
  const treeData = ref<TreeItem[]>([]);
  const selectedKeys = ref<string[]>();
  const treeExpandData = ref([]);
  //获取所有父级id
  function findForAllId(data = [], arr = []) {
    for (const item of data) {
      arr.push(item.id);
    }
    return arr;
  }
  function handleSelect(keys) {
    emit('select', keys[0]);
  }
  function resetOrganization() {
    selectedKeys.value = [];
  }
  onMounted(async () => {
    treeData.value = (await getOrganizationList()) as unknown as TreeItem[];
    const getAllIds = findForAllId(treeData.value as any, []);
    //设置要展开的id
    treeExpandData.value = getAllIds;
  });
  defineExpose({
    resetOrganization,
  });
</script>