<template>
  <div class="demo">
    <table-tree :dataSource="dataSource" :keys="['1', '2']" @change="onChange"/>
  </div>
</template>

<script>
import TableTree from './TableTree/TableTree'

export default {
  name: 'demo',
  components: { TableTree },
  data () {
    return {
      dataSource: [
        {
          key: '1',
          name: '1',
          list: [
            {
              key: '1-1',
              name: '1-1',
              list: []
            },
            {
              key: '1-2',
              name: '1-2',
              list: [
                {
                  key: '1-2-1',
                  name: '1-2-1',
                  list: [
                    {
                      key: '1-2-1-1',
                      name: '1-2-1-1',
                      list: []
                    },
                    {
                      key: '1-2-1-2',
                      name: '1-2-1-2',
                      list: [
                        {
                          key: '1-2-1-2-1',
                          name: '1-2-1-2-1',
                          list: [
                            {
                              key: '1-2-1-2-1-1',
                              name: '1-2-1-2-1-1',
                              list: []
                            },
                            {
                              key: '1-2-1-2-1-2',
                              name: '1-2-1-2-1-2',
                              list: []
                            },
                            {
                              key: '1-2-1-2-1-3',
                              name: '1-2-1-2-1-3',
                              list: []
                            },
                          ]
                        },
                        {
                          key: '1-2-1-2-2',
                          name: '1-2-1-2-2',
                          list: []
                        }
                      ]
                    }
                  ]
                },
                {
                  key: '1-2-2',
                  name: '1-2-2',
                  list: []
                }
              ]
            }
          ]
        },
        {
          key: '2',
          name: '2',
          list: [
            {
              key: '2-1',
              name: '2-1',
              list: []
            },
            {
              key: '2-2',
              name: '2-2',
              list: []
            }
          ]
        },
      ]
    }
  },
  methods: {
    onChange(values) {
      console.log(values);
    },
  }
}
</script>