<template>
  <div class="select-account">
    <BasicTable @register="registerTable" :searchInfo="searchInfo" />
  </div>
</template>
<script lang="ts" setup>
  import { reactive } from 'vue';

  import { BasicTable, useTable } from '@/components/Table';
  import { getAccountList } from '@/api/demo/system';

  import { SelectColumns, SelectSearchFormSchema } from './data';

  defineOptions({ name: 'AccountManagement' });

  const searchInfo = reactive<Recordable>({});
  const [registerTable, { reload, updateTableDataRecord, getSelectRows, clearSelectedRowKeys }] =
    useTable({
      title: '用户列表',
      api: getAccountList,
      rowKey: 'id',
      columns: SelectColumns,
      formConfig: {
        labelWidth: 120,
        schemas: SelectSearchFormSchema,
        autoSubmitOnEnter: true,
      },
      rowSelection: {
        //多选框
        type: 'checkbox',
      },
      useSearchForm: true,
      showTableSetting: false,
      bordered: true,
      tableSetting: { fullScreen: true },
      isCanResizeParent: true,
      handleSearchInfoFn(info) {
        console.log('handleSearchInfoFn', info);
        return info;
      },
    });

  function getRow() {
    let rows = getSelectRows();
    console.log(rows);
    return rows;
  }
  defineExpose({
    getRow,
  });
</script>
<style scoped>
  .select-account {
    display: flex;
    height: 100%;
  }
</style>
