wt_project_web_bak/src/components/file-way/index.vue

<template>
  <div class="flex flex-center flex-justify-between">
    <div class="flex flex-center flex-justify-start">
      <el-button text type="primary" size="mini" @click="goBefore"
        >返回上一层
      </el-button>
      <el-divider direction="vertical" border-style="dashed" />
      <el-button text type="primary" size="mini" @click="goHome"
        >全部文件
      </el-button>
      <div v-if="data" class="flex flex-center">
        <el-icon>
          <ArrowRight />
        </el-icon>
        <el-button v-if="refreshBtn" text type="primary" size="mini">{{
          data.title
        }}</el-button>
      </div>
    </div>
    <el-button icon="Refresh" circle />
  </div>
</template>

<script>
export default {
  props: {
    next: {
      type: Object,
      default: {
        title: ''
      }
    },
    refreshBtn: {
      type: Boolean,
      default: false
    }
  },
  watch: {
    next: {
      handler(val) {
        console.log(val)
        if (Object.hasOwn(val, 'projectId')) {
          const item = {
            id: val.id,
            title: val.title,
            projectId: val.projectId,
            stageId: val.stageId,
            parentId: val.parentId,
            type: val.type,
            isAccess: val.isAccess
          }
          const tmp = this.list.find(ele => ele.id === item.id)
          if (tmp === undefined || tmp === null) {
            console.log(item.type)
            if (item.type === 2) {
              this.data = item
              this.list.push(item)
            }
          }
        }
      },
      immediate: false
    }
  },
  data() {
    return {
      list: [],
      data: null
    }
  },
  methods: {
    goHome() {
      this.list.length = 0
      this.data = null
      this.$emit('goHome')
    },
    goBefore() {
      this.list.pop()
      if (this.list.length > 0) {
        this.data = this.list[this.list.length - 1]
        this.$emit('before', this.data)
      } else {
        this.goHome()
      }
    }
  }
}
</script>

<style lang="scss" scoped></style>