<template>
  <div class="flex flex-justify-start full-height wrapper padding-top">
    <div class="full-height">
      <left-bar
        :active="type === '0' ? -1 : active"
        :data="data"
        :stage="stage"
        @typeChange="typeChange"
        @typeChange1="typeChange1"
      />
    </div>
    <el-card
      shadow="hover"
      class="full-height full-width white-bg padding-left padding-top"
      style="margin-left: 10px"
    >
      <proinfo
        v-if="type === '0'"
        :data="data"
        :issue="list"
        @refInfo="proInfo"
        @refresh="issueList"
      />
      <folder-info
        v-else-if="type === '1'"
        :id="id"
        :data="data"
        :projectStageId="projectStageId"
      />
      <grant-record v-else />
    </el-card>
  </div>
</template>

<route>
{
name: '资料管理',
meta: { layout: 'empty' }
}
</route>

<script>
import leftBar from './component/left_bar.vue'
import proinfo from './component/proinfo.vue'
import folderInfo from './component/folder_info.vue'
import grantRecord from '@/views/home/component/grant_record.vue'

export default {
  name: '项目详情',
  components: { leftBar, proinfo, folderInfo, grantRecord },
  watch: {
    stage: {
      handler(newValue) {
        if (newValue) {
          this.change(0)
        }
      },
      immediate: true
    }
  },
  data() {
    return {
      type: '0',
      id: '',
      data: {},
      list: [],
      stage: [],
      projectStageId: '',
      active: -1
    }
  },
  created() {
    this.id = this.$route.query.id
    this.type = this.$route.query.type
    this.proInfo()
    this.issueList()
    this.getStage()
    this.$bus.on('change', index => {
      this.type = '1'
      this.active = index
      this.projectStageId =
        this.stage[index] === undefined ? '' : this.stage[index].id
    })
  },
  methods: {
    typeChange() {
      this.type = '0'
    },
    typeChange1() {
      this.type = '2'
    },
    /**
     * 项目信息
     */
    proInfo() {
      this.$api.project.projectInfo(this.id).then(res => {
        if (res.code === 200) {
          this.data = res.data
        } else {
          this.$message.error(res.msg)
        }
      })
    },
    /**
     * 发行明细
     */
    issueList() {
      this.$api.project.issuanceDetail({ projectId: this.id }).then(res => {
        if (res.code === 200) {
          this.list = res.data.records
        }
      })
    },
    /**
     * 获取项目阶段
     */
    getStage() {
      this.$api.project.includeStage({ projectId: this.id }).then(res => {
        if (res.code === 200) {
          this.stage = res.data.map(e => {
            const newItem = {}
            newItem.title = e.name
            newItem.count = e.fileAmount
            newItem.isAccess = e.isAccess
            newItem.id = e.id
            return newItem
          })
        }
      })
    },
    /**
     * 切换项目阶段
     * @param res
     */
    change(res) {
      if (this.$route.query.type !== '0') {
        this.type = '1'
      }
      this.projectStageId =
        this.stage[res] === undefined ? '' : this.stage[res].id
    }
  }
}
</script>

<style scoped></style>
