Newer
Older
KaiFengPC / src / views / preassess / evaluation / operate.vue
@鲁yixuan 鲁yixuan on 14 Aug 7 KB updata
  1. <template>
  2. <el-dialog
  3. class="dialog"
  4. v-model="visible"
  5. :title="`${opts.text}项目工程预评估`"
  6. :close-on-click-modal="false"
  7. width="70%"
  8. :before-close="close"
  9. >
  10. <el-card class="box-card">
  11. <template #header>
  12. <div class="card-header">
  13. <span>项目目标</span>
  14. </div>
  15. </template>
  16. <el-form class="form" ref="targetForm" :model="form">
  17. <el-row :gutter="20">
  18. <el-col :span="8">
  19. <el-form-item label="建设工程:" prop="projectNo">
  20. <el-select v-model="form.projectNo" placeholder="建设工程" v-if="opts.type === 'add'">
  21. <el-option
  22. v-for="item in list"
  23. :label="item.projectName"
  24. :value="item.projectNo"
  25. :key="item.projectNo"
  26. @click="selectChange(item)"
  27. />
  28. </el-select>
  29. <span v-else>{{ form.projectName }}</span>
  30. </el-form-item>
  31. </el-col>
  32. <el-col :span="8">
  33. <el-form-item label="工程类型:" prop="engineeringType">
  34. <span>{{ findText('sponge_engineering_type', form.engineeringType) }}</span>
  35. </el-form-item>
  36. </el-col>
  37. <el-col :span="8">
  38. <el-form-item label="建设分区:" prop="drainagePartition">
  39. <span>{{ findText('drainage_partition', form.drainagePartition) }}</span>
  40. </el-form-item>
  41. </el-col>
  42. </el-row>
  43. <el-row :gutter="20">
  44. <el-col :span="8">
  45. <el-form-item label="建设类型:" prop="buildCategory">
  46. <span>{{ findText('build_category', form.buildCategory) }}</span>
  47. </el-form-item></el-col
  48. >
  49. <el-col :span="8">
  50. <el-form-item label="年径流总量控制率%,≥:" prop="targetAnnualRunoffTotalControlRate">
  51. <span>{{ form.targetAnnualRunoffTotalControlRate }}</span>
  52. </el-form-item>
  53. </el-col>
  54. <el-col :span="8">
  55. <el-form-item label="年径流污染控制率%,≥:" prop="targetAnnualRunoffPollutionControlRate">
  56. <span>{{ form.targetAnnualRunoffPollutionControlRate }}</span>
  57. </el-form-item>
  58. </el-col>
  59. </el-row>
  60. <el-row :gutter="20">
  61. <el-col :span="8">
  62. <el-form-item label="调蓄量是否达标:" prop="storageCapacityStandards">
  63. <el-tag
  64. v-if="standardMap.get(form.storageCapacityStandards)?.text"
  65. :type="standardMap.get(form.storageCapacityStandards)?.type"
  66. >{{ standardMap.get(form.storageCapacityStandards)?.text }}</el-tag
  67. >
  68. <span v-else></span>
  69. </el-form-item>
  70. </el-col>
  71. <el-col :span="8">
  72. <el-form-item label="污染去除率是否达标:" prop="pollutionRemovalStandards">
  73. <el-tag
  74. v-if="standardMap.get(form.pollutionRemovalStandards)?.text"
  75. :type="standardMap.get(form.pollutionRemovalStandards)?.type"
  76. >{{ standardMap.get(form.pollutionRemovalStandards)?.text }}</el-tag
  77. >
  78. <span v-else></span>
  79. </el-form-item>
  80. </el-col>
  81. </el-row>
  82. </el-form>
  83. </el-card>
  84. <!-- 详情显示 -->
  85. <div class="tabs" v-if="isSelect">
  86. <el-tabs v-model="active">
  87. <el-tab-pane label="控制项" :name="0">
  88. <Control ref="controlRef" :key="form.projectNo" :project-info="form" :id="id" :opts="opts" />
  89. </el-tab-pane>
  90. <el-tab-pane label="评分项" :name="1">
  91. <Mark ref="markRef" :key="form.projectNo" :project-info="form" :id="id" :opts="opts" />
  92. </el-tab-pane>
  93. </el-tabs>
  94. </div>
  95. <template #footer v-if="isSelect && opts.type !== 'view'">
  96. <div class="dialog-footer">
  97. <div class="btns">
  98. <el-button type="primary" @click="submit">确定</el-button>
  99. <el-button type="primary" v-show="form.rowId" @click="handleOk">提交</el-button>
  100. <el-button @click="close">取消</el-button>
  101. </div>
  102. </div>
  103. </template>
  104. </el-dialog>
  105. </template>
  106.  
  107. <script setup>
  108. import { ref, reactive, onMounted, toRef, computed, nextTick } from 'vue';
  109. import Control from './control.vue';
  110. import Mark from './mark.vue';
  111. import {
  112. getFacilitiesStandardCalcList,
  113. projectPreEvaluateAdd,
  114. projectPreEvaluateDetails,
  115. projectPreEvaluateSubmit,
  116. } from '@/api/preassess/evaluation';
  117. import { inheritAttr } from '@/utils/v3';
  118. const { proxy } = getCurrentInstance();
  119. const emit = defineEmits(['update:modelValue', 'close']);
  120. const props = defineProps({
  121. id: {
  122. type: [String, Number],
  123. default: '',
  124. },
  125. opts: {
  126. type: Object,
  127. default: () => {},
  128. },
  129. modelValue: {
  130. type: Boolean,
  131. default: false,
  132. },
  133. });
  134. const { id, opts } = props;
  135.  
  136. const { build_category } = proxy.useDict('build_category');
  137. const { drainage_partition } = proxy.useDict('drainage_partition');
  138. const { sponge_engineering_type } = proxy.useDict('sponge_engineering_type');
  139. const dicts = {
  140. build_category,
  141. drainage_partition,
  142. sponge_engineering_type,
  143. };
  144. const findText = (prop, type) => {
  145. const item = dicts[prop].value.find(it => it.value === type);
  146. return item?.label || '';
  147. };
  148. const isShowDialog = toRef(props, 'modelValue');
  149. const visible = computed({
  150. get() {
  151. return isShowDialog.value;
  152. },
  153. set(value) {
  154. emit('update:modelValue', value);
  155. },
  156. });
  157.  
  158. const form = reactive({
  159. id: '',
  160. rowId: id,
  161. projectNo: '',
  162. projectName: '',
  163. buildCategory: '',
  164. engineeringType: '',
  165. drainagePartition: '',
  166. targetAnnualRunoffTotalControlRate: '',
  167. targetAnnualRunoffPollutionControlRate: '',
  168. storageCapacityStandards: '',
  169. pollutionRemovalStandards: '',
  170. });
  171. const active = ref(0);
  172. const list = ref([]);
  173.  
  174. const standardMap = new Map([
  175. [0, { text: '否', type: 'danger' }],
  176. [1, { text: '是', type: 'success' }],
  177. ]);
  178.  
  179. const isSelect = ref(false);
  180. const isSubmit = ref(false);
  181.  
  182. const close = () => {
  183. visible.value = false;
  184. emit('close', {
  185. type: opts.type,
  186. isSubmit: isSubmit.value,
  187. });
  188. };
  189.  
  190. const submit = async () => {
  191. console.log('submit!!!');
  192. const params = {
  193. id: form.rowId,
  194. calcId: form.id,
  195. projectNo: form.projectNo,
  196. evaluateAssessControllerItemSaveRequestList: proxy.$refs.controlRef.treeData,
  197. evaluateAssessGradeItemSaveRequestList: proxy.$refs.markRef.treeData,
  198. };
  199. const res = await projectPreEvaluateAdd(params);
  200. if (res?.code !== 200) return;
  201. if (!form.rowId) form.rowId = res.data;
  202. isSubmit.value = true;
  203. proxy.$modal.msgSuccess('操作成功');
  204. };
  205.  
  206. const handleOk = async () => {
  207. const formData = new FormData();
  208. formData.append('id', form.rowId);
  209. const res = await projectPreEvaluateSubmit(formData);
  210. if (res?.code !== 200) return;
  211. isSubmit.value = true;
  212. proxy.$modal.msgSuccess('操作成功');
  213. close();
  214. };
  215.  
  216. const selectChange = item => {
  217. isSelect.value = true;
  218. inheritAttr(item, form);
  219. active.value = 0;
  220. };
  221.  
  222. const getList = async () => {
  223. const res = await getFacilitiesStandardCalcList({ status: '2' });
  224. if (res?.code !== 200) return;
  225. list.value = res.data;
  226. };
  227.  
  228. const getDetail = async () => {
  229. const res = await projectPreEvaluateDetails(id);
  230. if (res?.code !== 200) return;
  231. console.log(res);
  232. const projectInfo = list.value.find(item => item.projectNo === res.data.projectNo);
  233. selectChange(projectInfo);
  234. nextTick(() => {
  235. proxy.$refs.controlRef.getDetail(res.data.evaluateAssessControllerItemSaveRequestList);
  236. proxy.$refs.markRef.getDetail(res.data.evaluateAssessGradeItemSaveRequestList);
  237. });
  238. };
  239.  
  240. onMounted(async () => {
  241. await getList();
  242. if (id) getDetail();
  243. });
  244. </script>
  245.  
  246. <style lang="scss" scoped>
  247. .box-card {
  248. .card-header {
  249. font-weight: 700;
  250. font-size: 18px;
  251. }
  252.  
  253. :deep(.form) {
  254. .el-form-item {
  255. margin-bottom: 5px;
  256. }
  257. }
  258. }
  259. </style>