<script setup lang="ts">
import type { VxeTableGridOptions } from '@vben/plugins/vxe-table';

import { ref } from 'vue';

import { useVbenModal } from '@vben/common-ui';
import { useVbenVxeGrid } from '@vben/plugins/vxe-table';

import { getAllDeptTree } from '#/api';

// import { useAuthColumns } from '../data';

const emits = defineEmits(['success']);
const formData = ref();

const [Modal, modalApi] = useVbenModal({
  async onConfirm() {
    if (!formData.value) return;

    modalApi.lock();
    try {
      formData.value = gridApi.grid.getCheckboxRecords();
      emits('success');
      modalApi.close();
    } finally {
      modalApi.lock(false);
    }
  },
});

const [Grid, gridApi] = useVbenVxeGrid({
  gridEvents: {},
  gridOptions: {
    // columns: useAuthColumns(),
    height: 'auto',
    keepSource: true,
    pagerConfig: {
      enabled: false,
    },
    proxyConfig: {
      ajax: {
        query: async (_params) => {
          const res = await getAllDeptTree(0);
          return {
            items: res,
          };
        },
      },
    },
    toolbarConfig: {
      export: false,
    },
  } as VxeTableGridOptions,
});
</script>

<template>
  <Modal title="权限" class="flex flex-col">
    <Grid />
  </Modal>
</template>

<style scoped></style>
