<template> <div class="water-analysis-page"> <div class="top"> <el-form label-width="auto" :rules="projectEstimateRules" inline ref="ruleForm" :model="FormList" :disabled="typeList.type == 1"> <div v-for="i in typeList.monitorDynamicTableTitleList" style="display: flex; flex-direction: column"> <el-form-item v-if="i.key == 'real' || i.key == 'target'" v-for="k in i.titleGroup" :label="i.key == 'real' ? '实际' + k.value + ':' : '目标' + k.value + ':'" :prop="k.key" :disabled="typeList.type == 1 || typeList.type == 2" > <el-input :disabled="i.key != 'real'" v-model="FormList[k.key]" :placeholder="k.placeholder" @change="ChangeClick(k.key, FormList[k.key])" > </el-input> </el-form-item> <el-form-item v-else :label="i.value + ':'" :prop="i.key" :disabled="typeList.type == 1 || typeList.type == 2"> <el-upload v-if="i.key == 'attachFileList'" v-model:file-list="fileList1" class="upload-demo" action="/system/upload" :headers="uploadHeader" multiple :on-preview="handlePreview" :before-remove="beforeRemove" style="width: 100vh" > <el-button type="primary">选择文件</el-button> </el-upload> <div v-else-if="i.key == 'standardFlag' && typeList.iSstandardFlag" :style="{ color: typeList.iSstandardFlag ? '#108ee9' : 'red' }" > {{ typeList.iSstandardFlag ? '达标' : '未达标' }} </div> <div v-else-if="i.key == 'standardFlag' && !typeList.iSstandardFlag" :style="{ color: IsStandFlag1 > 0 && IsStandFlag2 > 0 ? '#108ee9' : 'red' }" > <span v-show="false">{{ IsStandFlag1 > 0 && IsStandFlag2 > 0 ? (IsStandText = 1) : (IsStandText = 0) }}</span> {{ IsStandFlag1 > 0 && IsStandFlag2 > 0 ? '达标' : '未达标' }} </div> <div v-else> {{ FormList[i.key] }} </div> </el-form-item> </div> </el-form> </div> </div> </template> <script setup> import { projectInfoEdit } from '@/api/spongePerformance/prevention'; import { getToken } from '@/utils/auth'; import { projectEstimateRules } from '@/utils/rules'; import { ElMessage, ElMessageBox } from 'element-plus'; const { proxy } = getCurrentInstance(); const uploadHeader = ref({ Authorization: 'Bearer ' + getToken(), }); const { typeList } = defineProps(['typeList']); const emits = defineEmits(); defineExpose({ submit, closed, resetFiled }); const IsStandFlag1 = ref(0); const IsStandFlag2 = ref(0); const IsStandText = ref(''); let FormList = ref({ projectNo: '', fileSaveRequestList: [] }); function ChangeClick(v, m) { console.log('v', v); console.log('m', m); typeList.iSstandardFlag = null; if (v == 'realCXQ') { console.log('object1', m * 1 - FormList.value.targetCXQ * 1); IsStandFlag1.value = m * 1 - FormList.value.targetCXQ * 1; } else { console.log('object2', m * 1 - FormList.value.targetDBMJZJCQMJ * 1); IsStandFlag2.value = m * 1 - FormList.value.targetCXQ * 1; } } const fileList1 = ref([]); function handlePreview(file) { return ElMessageBox.confirm(`下载此文件: ${file.name}?`).then( () => window.open(file.url), () => false ); } function beforeRemove(file) { return true; } function submit() { proxy.$refs.ruleForm.validate(valid => { if (valid) { const fileSaveRequestList = []; fileList1.value.forEach(element => { if (element.hasOwnProperty('response')) { element.response.data.refType = 'proProjectBudget'; fileSaveRequestList.push(element.response.data); } else { fileSaveRequestList.push(element); } }); const itemUpdateFieldRequestList = [ { id: typeList.data['CXQ-id'], realValue: FormList.value.realCXQ, standardFlag: IsStandFlag1.value > 0 ? 1 : 0 }, { id: typeList.data['DBMJZJCQMJ-id' || 0], realValue: FormList.value.realDBMJZJCQMJ, standardFlag: IsStandFlag2.value > 0 ? 1 : 0, }, ]; FormList.value = { itemDataType: typeList.itemDataType, standardFlag: typeList.iSstandardFlag || IsStandText.value, itemUpdateFieldRequestList, fileSaveRequestList, performanceEvaluateId: typeList.data.performanceEvaluateId, }; console.log('FormList.value', FormList.value); projectInfoEdit(FormList.value).then(({ code }) => { if (code == 200) { emits('onModalClose'); } }); } // } }); } function loadProjerctListData() { console.log('typeListtypeList', typeList); FormList.value = typeList.data; fileList1.value = typeList.fileList1; proxy.$refs.ruleForm.resetFields(); } function resetFiled() { proxy.$refs.ruleForm.resetFields(); fileList1.value = []; } function closed() { emits('onModalClose'); } onMounted(() => { loadProjerctListData(); }); </script> <style lang="scss" scoped> .water-analysis-page { padding: 20px; } </style>