import { TreeSelect, Row, Col } from '@btri-ui/base';
import React, { useState } from 'react';

const treeData = [
  {
    title: '第一层',
    value: '0-0',
    children: [
      {
        title: '第二层',
        value: '0-0-1',
        children: [
          {
            title: '第三层',
            value: '0-0-1-1',
          },
          {
            title: 'Child Node-2',
            value: '0-0-1-2',
          },
        ],
      },
      {
        title: '第二层',
        value: '0-0-2',
      },
    ],
  },
  {
    title: '第一层',
    value: '0-1',
  },
];

const App: React.FC = () => {
  const [value, setValue] = useState<string>();

  const onChange = (newValue: string) => {
    console.log(newValue);
    setValue(newValue);
  };

  return (
    <Row autoMode>
      <Col span={4}>
        <TreeSelect value={value} treeData={treeData} onChange={onChange} />
      </Col>
    </Row>
  );
};

export default App;
