// @ts-ignore
import React, { useEffect, useState } from 'react';
import TreeCustom from '../index';
import { HomeOutlined } from '@ant-design/icons';

const Demo2 = (props) => {
  const treeData = [
    {
      title: '二供泵房',
      key: '0-0',
      icon: <HomeOutlined />,
      children: [
        {
          title: '碧桂园',
          key: '0-0-0',
          icon: <HomeOutlined />,
          children: [
            {
              title: '低区',
              key: '0-0-0-0',
            },
            {
              title: '中区',
              key: '0-0-0-1',
            },
            {
              title: '高区',
              key: '0-0-0-2',
            },
          ],
        },
        {
          title: '金瑞国际',
          key: '0-0-1',
          icon: <HomeOutlined />,
          children: [
            {
              title: '低区',
              key: '0-0-1-0',
            },
            {
              title: '中区',
              key: '0-0-1-1',
            },
            {
              title: '高区',
              key: '0-0-1-2',
            },
          ],
        },
      ],
    },
    {
      title: '二供机组',
      key: '0-1',
      icon: <HomeOutlined />,
      children: [
        {
          title: '低区',
          key: '0-1-0',
        },
        {
          title: '中区',
          key: '0-1-1',
        },
        {
          title: '高区',
          key: '0-1-2',
        },
      ],
    },
  ];
  const onSelect = (selectedKeys, info) => {
    console.log('selected', selectedKeys, info);
  };
  const onCheck = (checkedKeys, info) => {
    console.log('onCheck', checkedKeys, info);
  };
  return (
    <TreeCustom
      style={{ marginLeft: '20px' }}
      showIcon={true}
      defaultSelectedKeys={['0-0-0']}
      defaultExpandedKeys={['0-0-0']}
      onSelect={onSelect}
      onCheck={onCheck}
      treeData={treeData}
    />
  );
};

export default Demo2;
