import React, { useEffect, useState } from 'react';
import { Modal, Tree, Checkbox, Spin, Button, Input } from 'antd';
import ProTable, { ProColumns, ActionType, TableDropdown } from '@ant-design/pro-table';

import { Page } from '../../../sys/Roles/service';

const columns = [
  {
    title: '角色名称',
    dataIndex: 'name',
    hideInSearch: true,
  },

  {
    title: '备注',
    dataIndex: 'remark',
    valueType: 'textarea',
    hideInSearch: true,
  },
];
const OrgForm = (props) => {
  const [options, setOptions] = useState();
  const [loading, setLoading] = useState(undefined);
  const [keys, setSelectedRows] = useState();
  // // componentDidMount
  // useEffect(() => {
  //   setLoading(true);
  //   async function getRoles() {
  //     if (loading) {
  //       return;
  //     }
  //   }

  //   getRoles();
  // }, []);

  const renderContent = () => {
    return (
      <Tree
        defaultExpandAll={true}
        checkable
        onCheck={(e) => setSelectedRows(e)}
        treeData={props.treeDatas}
      />
    );
  };

  return (
    <Modal
      width={640}
      bodyStyle={{ padding: '32px 40px 48px' }}
      destroyOnClose
      title={`给 ${props.values.name} 授权数据`}
      visible={props.updateModalVisible}
      onOk={() => props.onSubmit(keys)}
      onCancel={() => props.onCancel()}
      maskClosable={false}
    >
      {loading ? <Spin /> : renderContent()}
    </Modal>
  );
};

export default OrgForm;
