写一段ElementUI TreeTable的代码

以下是一个简单的ElementUI TreeTable的代码示例：

<template>
  <el-table-tree
    :data="tableData"
    :indent-size="20"
    :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
  >
    <el-table-column
      prop="name"
      label="名称"
      width="200"
    >
    </el-table-column>
    <el-table-column
      prop="type"
      label="类型"
      width="100"
    >
    </el-table-column>
    <el-table-column
      prop="size"
      label="大小"
      width="100"
    >
    </el-table-column>
    <el-table-column
      prop="date"
      label="修改日期"
      width="200"
    >
    </el-table-column>
  </el-table-tree>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        {
          name: '文件夹1',
          type: '文件夹',
          size: '',
          date: '2021-01-01',
          hasChildren: true,
          children: [
            {
              name: '文件1-1',
              type: '文本文件',
              size: '100KB',
              date: '2021-01-02',
            },
            {
              name: '文件1-2',
              type: '图像文件',
              size: '200KB',
              date: '2021-01-03',
            },
          ],
        },
        {
          name: '文件夹2',
          type: '文件夹',
          size: '',
          date: '2021-01-04',
          hasChildren: false,
          children: [],
        },
      ],
    };
  },
};
</script>

在上面的代码中，我们使用了ElementUI的el-table-tree组件来呈现树形结构的表格。在el-table-tree组件中，我们通过设置data属性来传入表格的数据，通过设置indent-size属性来控制每个节点的缩进大小，通过设置tree-props属性来定义数据中每个节点的子节点和是否有子节点的属性名称。

在el-table-tree组件中，我们还可以使用el-table-column组件来定义表格的列。在el-table-column组件中，我们通过设置prop属性来指定列对应数据中的字段，通过设置label属性来指定列的标题，通过设置width属性来指定列的宽度。

在上面的示例中，我们定义了一个包含两个文件夹的树形结构，其中每个文件夹下面包含了一些文件。这些数据会被传入到el-table-tree组件中，最终呈现出一个树形结构的表格。