import crumbs from "@/components/crumbs";

import { nodeIdList2nodeInfoListByNodeTree } from "@/utils/other.js";
import {
  getFolderTree,
} from "@/api";

import {i18n} from "@/lang"

export default {
  components: {
    crumbs,
  },
  data() {
    return {
      folderTree: null,
      folderPath: [],
    }
  },
  computed: {
    currentFolderId() {
      return this.folderPath[this.folderPath.length - 1]?.id
    },
  },
  methods: {
    onClickPath(idx) {
      this.searchKey = ''
      this.folderPath = this.folderPath.slice(0, idx + 1)
    },
    onClickFolder(folder) {
      getFolderTree({
        type: this.currentMaterialType,
      }).then((res) => {
        this.folderTree = res.data
        const targetPathIdList = folder.ancestors.split(',').map((item) => {
          return Number(item)
        })
        targetPathIdList.push(folder.id)
        this.folderPath = nodeIdList2nodeInfoListByNodeTree(targetPathIdList, this.folderTree)
        this.searchKey = ''
      })
    },
  },
  watch: {
    currentFolderId: {
      handler: function (v1, v2) {
        if (v2 !== undefined) {
          this.refreshMaterialList(this.currentMaterialType)
        }
      },
    },
  },
  created() {
    this.folderPath.push({
      name: i18n.t(`gather.${this.currentMaterialType}`),
      id: 1,
    })
  }
}