<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" > <el-form-item :label="i.label" :style="{'width':i.prop == 'fileList1' ?'93%' :'45%'}" :prop="i.prop" v-for="i in projectEstimateForm" :disabled="typeList.type == 1 || typeList.type == 2" > <el-select style="width: 100%" v-if="i.prop == 'projectName'" @change="projectNameChange" v-model="FormList.projectName" :placeholder="i.placeholder" clearable > <el-option v-for="dict in ProjectListData" :key="dict.projectNo" :label="dict.projectName" :value="dict.projectNo" /> </el-select> <el-select style="width: 100%" clearable v-model="FormList.fundSource" class="m-2" v-else-if="i.prop == 'fundSource'" :placeholder="i.placeholder" > <el-option v-for="dict in fund_source" :key="dict.value" :label="dict.label" :value="dict.value" /> </el-select> <el-date-picker v-else-if="i.prop == 'quoteDate'" style="width: 100%" clearable format="YYYY-MM-DD" value-format="YYYY-MM-DD" v-model="FormList.quoteDate" type="date" range-separator="到" :placeholder="i.placeholder" /> <el-upload v-else-if="i.prop == 'fileList1'" v-model:file-list="fileList1" class="upload-demo" action="/prod-api/system/upload" :headers="uploadHeader" multiple :on-preview="handlePreview" :before-remove="beforeRemove" style="width:100vh" > <el-button type="primary">选择文件</el-button> <template #tip> <div class="el-upload__tip">支持CSV格式,可一次性上传多个文件</div> </template> </el-upload> <el-input v-else v-model="FormList[i.prop]" :placeholder="i.placeholder" :disabled="i.prop == 'projectNo'" :type=" i.prop == 'requireContent' ? 'textarea' : '' " > <template #append v-if="i.prop == 'budget'"> 万元 </template> </el-input> </el-form-item> </el-form> </div> </div> </template> <script setup> import { onMounted, defineEmits, reactive, defineProps, defineExpose, } from "vue"; import { projectInfoAdd, projectInfoEdit } from "@/api/projectEstimate"; import { projectInfoList } from "@/api/project/tenderReview"; import { getToken } from "@/utils/auth"; import { projectEstimateRules } from "@/utils/rules"; import { projectEstimateForm } from "@/utils/form"; import { ElMessage, ElMessageBox } from "element-plus"; const { proxy } = getCurrentInstance(); const { fund_source} =proxy.useDict("fund_source"); const uploadHeader = ref({ Authorization: "Bearer " + getToken(), }); const { typeList } = defineProps(["typeList"]); const ProjectListData = ref([]); const emits = defineEmits(); defineExpose({ submit, closed, resetFiled }); let FormList = ref({ projectNo: "", fileSaveRequestList: [] }); function projectNameChange(v) { FormList.value.projectNo = v; } 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) { FormList.value.fileSaveRequestList = []; fileList1.value.forEach((element) => { if (element.hasOwnProperty("response")) { element.response.data.refType = "proProjectBudget"; FormList.value.fileSaveRequestList.push(element.response.data); } else { FormList.value.fileSaveRequestList.push(element); } }); if (typeList.type == 4) { projectInfoAdd(FormList.value).then(({ code }) => { if (code == 200) { emits("onModalClose"); } }); } else { projectInfoEdit(FormList.value).then(({ code }) => { if (code == 200) { emits("onModalClose"); } }); } } }); } function loadProjerctListData() { projectInfoList().then((response) => { ProjectListData.value = response.data; FormList.value = typeList; 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>