<template> <div class="water-analysis-page"> <div class="top"> <el-form ref="ruleForm" :disabled="typeList.type == 1" :rules="xmlxwhRules" inline :model="FormList" label-width="auto"> <el-row> <el-form-item label="项目类型编码:" style="width: 45%" prop="projectTypeCode"> <el-input style="width: 100%" :disabled="typeList.type == 2" v-model="FormList.projectTypeCode" placeholder="请输入项目类型编码" /> </el-form-item> <el-form-item label="项目类型名称:" style="width: 45%" prop="projectTypeName"> <el-input v-model="FormList.projectTypeName" placeholder="请输入项目类型名称" /> </el-form-item> <el-form-item label="所属类型:" style="width: 45%" prop="ownership"> <el-select clearable v-model="FormList.ownership" class="m-2" placeholder="请选择所属类型" size="mini" style="width: 100%"> <el-option v-for="item in ownership" :key="item.id" :label="item.label" :value="item.value" /> </el-select> </el-form-item> <el-form-item label="是否启用:" style="width: 45%" prop="status"> <el-select clearable v-model="FormList.status" class="m-2" placeholder="请选择是否启用" size="mini" style="width: 100%"> <el-option v-for="item in isStatus" :key="item.value" :label="item.label" :value="item.value" /> </el-select> </el-form-item> <el-form-item label="描述:" style="width: 94%" prop="remark"> <el-input type="textarea" v-model="FormList.remark" placeholder="请输入描述" /> </el-form-item> <el-form-item label="附件:" style="width: 93%"> <ImageFileUpload :fileType="['txt', 'doc', 'xls', 'docx', 'pdf']" v-model:saveFileArr="FormList.fileSaveRequestList" :listType="'text'" :refType="'proProjectType'" /> </el-form-item> </el-row> </el-form> </div> </div> </template> <script setup> import { projectInfoAdd, projectInfoEdit } from '@/api/project/xmlxwh'; import { getToken } from '@/utils/auth'; import { ElMessageBox } from 'element-plus'; import { xmlxwhRules } from '@/utils/rules'; const { typeList } = defineProps(['typeList']); const { proxy } = getCurrentInstance(); const { ownership } = proxy.useDict('ownership'); const uploadHeader = ref({ Authorization: 'Bearer ' + getToken(), }); let FormList = ref({}); const emits = defineEmits(); const isStatus = ref([ { label: '是', value: '0' }, { label: '否', value: '1' }, ]); function handlePreview(file) { return ElMessageBox.confirm(`下载此文件: ${file.name}?`).then( () => window.open(file.url), () => false ); } function handleBeforeUpload(file) { if (file.name.length > 50) { proxy.$modal.msgError(`文件名称过长(50个字符以内),请先修改再上传!`); return false; } return true; } function submit() { proxy.$refs.ruleForm.validate(valid => { if (valid) { if (typeList.type) { projectInfoEdit(FormList.value).then(({ code }) => { if (code == 200) { emits('onModalClose'); } }); } else { projectInfoAdd(FormList.value).then(({ code }) => { if (code == 200) { emits('onModalClose'); } }); } } }); } function desertFilds() { FormList.value.fileSaveRequestList = []; proxy.$refs.ruleForm.resetFields(); } defineExpose({ submit, desertFilds }); onMounted(() => { FormList.value = typeList; FormList.value.fileSaveRequestList = typeList.fileList1; console.log(FormList.value, ' FormList.value'); }); </script> <style lang="scss" scoped> .water-analysis-page { padding: 20px; } </style>