Newer
Older
KaiFengPC / src / views / spongePerformance / ManagingPerformance / projectCompletionStatus / rationality / project.vue
@zhangdeliang zhangdeliang on 23 May 5 KB 初始化项目
  1. <template>
  2. <div class="project">
  3. <el-card class="box-card" shadow="never">
  4. <template #header>
  5. <div class="card-header">
  6. <span class="title">项目目标</span>
  7. <el-icon
  8. class="icon"
  9. v-show="props.step === 1"
  10. @click="visible = true"
  11. ><ChatLineSquare /></el-icon>
  12. </div>
  13. </template>
  14. <el-form class="formM5" ref="projectForm" :model="form">
  15. <el-row :gutter="20">
  16. <el-col :span="6">
  17. <el-form-item label="建设工程:" prop="projectNo">
  18. <span>{{ form.projectName }}</span>
  19. </el-form-item>
  20. </el-col>
  21. <el-col :span="6">
  22. <el-form-item label="工程类型:" prop="engineeringType">
  23. <span>{{ findText('sponge_engineering_type', form.engineeringType) }}</span>
  24. </el-form-item>
  25. </el-col>
  26. <el-col :span="6">
  27. <el-form-item label="建设分区:" prop="drainagePartition">
  28. <span>{{ findText('drainage_partition', form.drainagePartition) }}</span>
  29. </el-form-item>
  30. </el-col>
  31. <el-col :span="6">
  32. <el-form-item label="建设类型:" prop="buildCategory">
  33. <span>{{ findText('build_category', form.buildCategory) }}</span>
  34. </el-form-item>
  35. </el-col>
  36. </el-row>
  37. <el-row :gutter="20">
  38. <el-col :span="6">
  39. <el-form-item label="面积㎡:" prop="area">
  40. <span>{{ form.area }}</span>
  41. </el-form-item>
  42. </el-col>
  43. <el-col :span="6">
  44. <el-form-item label="年径流总量控制率%,≥:" prop="annualRunoffTotalControlRate">
  45. <span>{{ form.annualRunoffTotalControlRate }}</span>
  46. </el-form-item>
  47. </el-col>
  48. <el-col :span="6">
  49. <el-form-item label="年径流污染控制率%,≥:" prop="annualRunoffPollutionControlRate">
  50. <span>{{ form.annualRunoffPollutionControlRate }}</span>
  51. </el-form-item>
  52. </el-col>
  53. <el-col :span="6">
  54. <el-form-item label="硬质地面率%,<:" prop="hardGroundRate">
  55. <span>{{ form.hardGroundRate }}</span>
  56. </el-form-item>
  57. </el-col>
  58. </el-row>
  59. <el-row :gutter="20">
  60. <el-col :span="6">
  61. <el-form-item label="处置客水m³:" prop="disposalOfGuestWater">
  62. <span>{{ form.disposalOfGuestWater }}</span>
  63. </el-form-item>
  64. </el-col>
  65. <el-col :span="6">
  66. <el-form-item label="设计降雨mm:" prop="designRainfall">
  67. <template #label>
  68. <span>设计降雨mm</span>
  69. <popover :width="240">
  70. <span style="font-weight: 700">说明</span>
  71. <br />
  72. <span>根据目标年径流总量控制率跟设计降雨关系曲线,由年径流总量控制率推算设计降雨</span>
  73. </popover>
  74. <span>:</span>
  75. </template>
  76. <span>{{ form.designRainfall }}</span>
  77. </el-form-item>
  78. </el-col>
  79. <el-col :span="6">
  80. <el-form-item label="海绵设施投资/万元:" prop="spongeInvest">
  81. <span>{{ form.spongeInvest }}</span>
  82. </el-form-item>
  83. </el-col>
  84. <el-col :span="6">
  85. <el-form-item label="推荐投产比(万元/m3):" prop="recommendedProductionRatio">
  86. <span>{{ form.recommendedProductionRatio }}</span>
  87. </el-form-item>
  88. </el-col>
  89. </el-row>
  90. </el-form>
  91. </el-card>
  92. </div>
  93. <el-dialog
  94. v-model="visible"
  95. title="建设工程审查"
  96. :close-on-click-modal="false"
  97. width="40%"
  98. class="dialog"
  99. >
  100. <card header="结论" shadow="never" v-if="props.investigateData?.conclusions?.length">
  101. <div class="conclusion">
  102. <div
  103. class="conclusion-item"
  104. v-for="(item, index) in props.investigateData.conclusions"
  105. >
  106. <span>{{ `${index + 1}: ${item}` }}</span>
  107. <br /><br v-if="index < props.investigateData.conclusions.length - 1" />
  108. </div>
  109. </div>
  110. </card>
  111. <card header="建议" class="suggestCard" shadow="never" v-if="props.investigateData?.suggests?.length">
  112. <div class="suggest">
  113. <div
  114. class="suggest-item"
  115. v-for="(item, index) in props.investigateData.suggests"
  116. >
  117. <span>{{ `${index + 1}: ${item}` }}</span>
  118. <br /><br v-if="index < props.investigateData.suggests.length - 1" />
  119. </div>
  120. </div>
  121. </card>
  122. </el-dialog>
  123. </template>
  124.  
  125. <script setup>
  126. import { computed } from 'vue'
  127. import { useDicts } from '@/hooks'
  128. import popover from '@/components/popover'
  129. import { ChatLineSquare } from '@element-plus/icons-vue'
  130. const { proxy } = getCurrentInstance();
  131. const emit = defineEmits(['select-change'])
  132. const props = defineProps({
  133. data: {
  134. type: Object,
  135. default: () => ({})
  136. },
  137. list: {
  138. type: Array,
  139. default: () => []
  140. },
  141. step: {
  142. type: [Number, String],
  143. default: 0
  144. },
  145. investigateData: {
  146. type: Object,
  147. default: () => ({})
  148. }
  149. })
  150. const { findText } = useDicts(proxy)
  151. const form = computed(() => {
  152. return props.data
  153. })
  154. const visible = ref(false)
  155. </script>
  156.  
  157. <style lang="scss" scoped>
  158. .project {
  159. margin-bottom: 10px;
  160. .suggestCard {
  161. margin-top: 10px;
  162. }
  163. .card-header {
  164. display: flex;
  165. justify-content: space-between;
  166. align-items: center;
  167. .icon {
  168. font-size: 20px;
  169. cursor: pointer;
  170. }
  171. .title {
  172. font-size: 16px;
  173. font-weight: 700;
  174. }
  175. }
  176.  
  177. .conclusion-item,
  178. .suggest-item {
  179. line-height: 1.5;
  180. }
  181. }
  182. </style>