detail.vue 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111
  1. <template>
  2. <div class="hui-detail">
  3. <div class="hui-detail-title">基础信息</div>
  4. <div class="hui-detail-content">
  5. <div class="hui-detail-item">
  6. <div class="hui-detail-label">项目名称</div>
  7. <div class="hui-detail-value">{{detail.name}}</div>
  8. </div>
  9. <div class="hui-detail-item">
  10. <div class="hui-detail-label">类型</div>
  11. <div class="hui-detail-value">{{$field.findTypeName('projectType',detail.type)}}</div>
  12. </div>
  13. <div class="hui-detail-item">
  14. <div class="hui-detail-label">项目类型</div>
  15. <div class="hui-detail-value">{{$field.findTypeName('projectTypes',detail.projectType)}}</div>
  16. </div>
  17. <div class="hui-detail-item">
  18. <div class="hui-detail-label">竣工时间</div>
  19. <div class="hui-detail-value">{{detail.completionTime}}</div>
  20. </div>
  21. <div class="hui-detail-item">
  22. <div class="hui-detail-label">建筑面积</div>
  23. <div class="hui-detail-value">{{detail.buildingArea}}</div>
  24. </div>
  25. <div class="hui-detail-item">
  26. <div class="hui-detail-label">项目区域</div>
  27. <div class="hui-detail-value">{{detail.address.join('-')}}</div>
  28. </div>
  29. <div class="hui-detail-item">
  30. <div class="hui-detail-label">具体地点</div>
  31. <div class="hui-detail-value">{{detail.specificLocation}}</div>
  32. </div>
  33. <div class="hui-detail-item">
  34. <div class="hui-detail-label">项目介绍</div>
  35. <div class="hui-detail-value">{{detail.comment}}</div>
  36. </div>
  37. </div>
  38. <div class="hui-detail-title" v-if="detail.supportingFacilities">配套设施</div>
  39. <div class="hui-detail-content hui-detail-image" v-if="detail.supportingFacilities">
  40. <div class="hui-tag hui-tag-info"
  41. v-for="item in $field.findTypeNameByList('supportingFacilities',detail.supportingFacilities)"
  42. :key="item.id" style="margin-right: 10px;">
  43. {{item.name}}
  44. </div>
  45. </div>
  46. <div class="hui-detail-title" v-if="detail.coordinates">地图位置</div>
  47. <div class="hui-detail-content hui-detail-image" v-if="detail.coordinates">
  48. <select-location ref="map" type="look" :coordinates="detail.coordinates">
  49. </select-location>
  50. </div>
  51. <div class="hui-detail-title">项目标签</div>
  52. <div class="hui-detail-content hui-detail-image">
  53. <tag ref="tag" type="look" :tagType="1" :tagActive="detail.tagIds ? detail.tagIds.split(',') : []">
  54. </tag>
  55. </div>
  56. <div class="hui-detail-title">项目图片</div>
  57. <div class="hui-detail-content hui-detail-image">
  58. <upload ref="upload" :list="detail.picture ? JSON.parse(detail.picture) : []" type="preview">
  59. </upload>
  60. </div>
  61. </div>
  62. </template>
  63. <script>
  64. import {
  65. getProjectDetailById
  66. } from '@/httpApi/space'
  67. import upload from '@/components/common/upload'
  68. import tag from '@/components/common/tag'
  69. import selectLocation from '@/components/work/common/selectLocation'
  70. export default {
  71. props: ['detailId'],
  72. data() {
  73. return {
  74. detail: {
  75. name: '', //项目名称
  76. address: [],
  77. comment: '',
  78. data: '',
  79. organizationId: '',
  80. picture: '',
  81. tagIds: ''
  82. }
  83. }
  84. },
  85. created() {
  86. if (this.detailId) this.init();
  87. },
  88. components: {
  89. upload,
  90. tag,
  91. selectLocation
  92. },
  93. methods: {
  94. init() {
  95. getProjectDetailById(this.detailId).then(res => {
  96. if (res.state) {
  97. let obj = res.data;
  98. let data = {};
  99. if (obj.data) data = JSON.parse(obj.data);
  100. obj.address = JSON.parse(obj.address);
  101. this.detail = Object.assign(obj, data);
  102. }
  103. })
  104. }
  105. },
  106. }
  107. </script>
  108. <style lang="scss">
  109. </style>