details.vue 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
  1. <template>
  2. <div class='flex flex-justify-start full-height'>
  3. <div class="full-height">
  4. <left-bar :active="type === '0' ? -1 : active " :data="data" :stage="stage" @typeChange="typeChange"
  5. @typeChange1="typeChange1"/>
  6. </div>
  7. <div class="full-height full-width white-bg padding-left padding-top" style="margin-left: 300px">
  8. <proinfo v-if="type === '0'" :data="data" :issue="list" @refInfo="proInfo" @refresh="issueList"/>
  9. <folder-info v-else-if="type === '1'" :id="id" :data='data' :projectStageId="projectStageId"/>
  10. <grant-record v-else/>
  11. </div>
  12. </div>
  13. </template>
  14. <route>
  15. {
  16. name: '项目详情',
  17. meta: { keepAlive: true }
  18. }
  19. </route>
  20. <script>
  21. import leftBar from './component/left_bar.vue'
  22. import proinfo from './component/proinfo.vue'
  23. import folderInfo from './component/folder_info.vue'
  24. import grantRecord from '@/views/home/component/grant_record.vue'
  25. export default {
  26. name: '项目详情',
  27. components: { leftBar, proinfo, folderInfo, grantRecord },
  28. watch: {
  29. stage: {
  30. handler (newValue) {
  31. if (newValue) {
  32. this.change(0)
  33. }
  34. },
  35. immediate: true
  36. }
  37. },
  38. data () {
  39. return {
  40. type: '0',
  41. id: '',
  42. data: {},
  43. list: [],
  44. stage: [],
  45. projectStageId: '',
  46. active: -1
  47. }
  48. },
  49. created () {
  50. this.id = this.$route.query.id
  51. this.type = this.$route.query.type
  52. this.proInfo()
  53. this.issueList()
  54. this.getStage()
  55. this.$bus.on('change', (index) => {
  56. this.type = '1'
  57. this.active = index
  58. this.projectStageId = this.stage[index] === undefined ? '' : this.stage[index].id
  59. })
  60. },
  61. methods: {
  62. typeChange () {
  63. this.type = '0'
  64. },
  65. typeChange1 () {
  66. this.type = '2'
  67. },
  68. /**
  69. * 项目信息
  70. */
  71. proInfo () {
  72. this.$api.project.projectInfo(this.id).then(res => {
  73. if (res.code === 200) {
  74. this.data = res.data
  75. }
  76. })
  77. },
  78. /**
  79. * 发行明细
  80. */
  81. issueList () {
  82. this.$api.project.issuanceDetail({ projectId: this.id }).then(res => {
  83. if (res.code === 200) {
  84. this.list = res.data.records
  85. }
  86. })
  87. },
  88. /**
  89. * 获取项目阶段
  90. */
  91. getStage () {
  92. this.$api.project.includeStage({ projectId: this.id }).then(res => {
  93. if (res.code === 200) {
  94. this.stage = res.data.map(e => {
  95. const newItem = {}
  96. newItem.title = e.name
  97. newItem.count = e.fileAmount
  98. newItem.isAccess = e.isAccess
  99. newItem.id = e.id
  100. return newItem
  101. })
  102. }
  103. })
  104. },
  105. /**
  106. * 切换项目阶段
  107. * @param res
  108. */
  109. change (res) {
  110. if (this.$route.query.type !== '0') {
  111. this.type = '1'
  112. }
  113. this.projectStageId = this.stage[res] === undefined ? '' : this.stage[res].id
  114. }
  115. }
  116. }
  117. </script>
  118. <style scoped>
  119. </style>