<route lang="yaml">
meta:
  enabled: false
</route>

<script lang="ts" setup>
import DirTreeComponent from './components/DirTree.vue'
import FileListComponent from './components/FileList.vue'
const dirTreeRef = ref()
const fileListRef = ref()

const onItemSelect = (dirId: number) => {
  fileListRef.value.loadData(dirId)
}
</script>

<template>
  <div class="absolute-container">
    <tool-header title="企业网盘" />

    <div class="page-main">
      <LayoutContainer left-side-width="250px" hide-left-side-toggle>
        <template #leftSide>
          <DirTreeComponent ref="dirTreeRef" @onItemSelect="onItemSelect" />
        </template>

        <FileListComponent ref="fileListRef" />
      </LayoutContainer>
    </div>
  </div>
</template>

<style lang="scss" scoped>
.container {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.absolute-container {
  :deep(.left-side) {
    display: flex;
    flex-direction: column;
    height: 100%;
  }
}
</style>
