From 4c9e1ba3c7f5c95a1789e88823ff262c26a53bce Mon Sep 17 00:00:00 2001 From: zhang_12370 <z2864490065@outlook.com> Date: 星期二, 08 七月 2025 20:34:32 +0800 Subject: [PATCH] 解决 生产加工煤种字段匹配 --- src/views/equipment/management/mould/managementDialog.vue | 361 ++++++++++++++++++++++----------------------------- 1 files changed, 156 insertions(+), 205 deletions(-) diff --git a/src/views/equipment/management/mould/managementDialog.vue b/src/views/equipment/management/mould/managementDialog.vue index f245902..b092d33 100644 --- a/src/views/equipment/management/mould/managementDialog.vue +++ b/src/views/equipment/management/mould/managementDialog.vue @@ -2,135 +2,118 @@ <div> <el-dialog v-model="dialogVisible" - :title="title" - width="600" + :title="addOrEdit === 'edit' ? '缂栬緫' : '鏂板' + '璁惧'" + width="800" + :title-style="{ textAlign: 'center' }" :close-on-click-modal="false" :before-close="handleClose" > <el-form ref="formRef" - style="max-width: 400px; margin: 0 auto" :model="formData" :rules="rules" label-width="auto" - > <el-form-item - label="渚涘簲鍟嗗悕绉�" - prop="supplierName" - > - <el-input - v-model="formData.supplierName" - placeholder="璇疯緭鍏ヤ緵璐у晢鍚嶇О" - :disabled="isViewMode" - /> - </el-form-item> - <el-form-item - label="绾崇◣浜鸿瘑鍒彿" - prop="taxpayerId" - > - <el-input - v-model="formData.taxpayerId" - placeholder="璇疯緭鍏ョ撼绋庝汉璇嗗埆鍙�" - :disabled="isViewMode" - /> - </el-form-item> - <el-form-item - label="缁忚惀鍦板潃" - prop="bids" - > - <el-cascader - placeholder="璇烽�夋嫨缁忚惀鍦板潃" - size="default" - :options="addressSelectOptions" - v-model="formData.bids" - :props="cascaderProps" - @change="handleChange" - :disabled="isViewMode" - > - </el-cascader> - </el-form-item> - <el-form-item - label="璇︾粏鍦板潃" - prop="businessAddress" - > - <el-input - v-model="formData.businessAddress" - placeholder="璇疯緭鍏ュ鎴疯缁嗗湴鍧�" - :disabled="isViewMode" - /> - </el-form-item> - <el-form-item - label="寮�鎴疯" - prop="bankAccount" - > - <el-input - v-model="formData.bankAccount" - placeholder="璇疯緭鍏ュ紑鎴疯" - :disabled="isViewMode" - /> - </el-form-item> - <el-form-item - label="閾惰璐︽埛" - prop="bankName" - > - <el-input - v-model="formData.bankName" - placeholder="璇疯緭鍏ラ摱琛岃处鎴�" - :disabled="isViewMode" - /> - </el-form-item> - <el-form-item - label="鑱旂郴浜�" - prop="contactPerson" - > - <el-input - v-model="formData.contactPerson" - placeholder="璇疯緭鍏ヨ仈绯讳汉" - :disabled="isViewMode" - /> - </el-form-item> - <el-form-item - label="鑱旂郴浜虹數璇�" - prop="contactPhone" - > - <el-input - v-model="formData.contactPhone" - placeholder="璇疯緭鍏ヨ仈绯讳汉鐢佃瘽" - :disabled="isViewMode" - /> - </el-form-item> - <el-form-item - label="鑱旂郴浜哄湴鍧�" - prop="cids" - > - <el-cascader - placeholder="璇烽�夋嫨鑱旂郴浜哄湴鍧�" - size="default" - :options="addressSelectOptions" - v-model="formData.cids" - :props="cascaderProps" - @change="handleChange" - :disabled="isViewMode" - > - </el-cascader> - </el-form-item> - <el-form-item - label="鑱旂郴浜鸿缁嗗湴鍧�" - prop="contactAddress" - > - <el-input - v-model="formData.contactAddress" - placeholder="璇疯緭鍏ヨ仈绯讳汉鍦板潃" - :disabled="isViewMode" - /> - </el-form-item> + > + <el-row :gutter="20"> + <el-col :span="11"> + <el-form-item label="璁惧缂栧彿" prop="equipmentId"> + <el-input + v-model="formData.equipmentId" + placeholder="璇疯緭鍏ヨ澶囩紪鍙�" + :disabled="isViewMode" + style="width: 100%" + /> + </el-form-item> + </el-col> + <el-col :span="11"> + <el-form-item label="璁惧鍚嶇О" prop="equipmentName"> + <el-input + v-model="formData.equipmentName" + placeholder="璇疯緭鍏ヨ澶囧悕绉�" + :disabled="isViewMode" + style="width: 100%" + /> + </el-form-item> + </el-col> + <el-col :span="11"> + <el-form-item label="鏁伴噺" prop="quantity"> + <el-input + v-model="formData.quantity" + placeholder="璇疯緭鍏ユ暟閲�" + :disabled="isViewMode" + style="width: 100%" + /> + </el-form-item> + </el-col> + <el-col :span="11"> + <el-form-item label="瑙勬牸鍨嬪彿" prop="specification"> + <el-input + v-model="formData.specification" + placeholder="璇疯緭鍏ヨ鏍煎瀷鍙�" + :disabled="isViewMode" + style="width: 100%" + /> + </el-form-item> + </el-col> + <el-col :span="11"> + <el-form-item label="浣跨敤鐘舵��" prop="usageStatus"> + <el-select + v-model="formData.usageStatus" + placeholder="璇烽�夋嫨浣跨敤鐘舵��" + :disabled="isViewMode" + > + <el-option label="鍚敤" value="1" /> + <el-option label="绂佺敤" value="0" /> + </el-select> + </el-form-item> + </el-col> + <el-col :span="11"> + <el-form-item label="浣跨敤閮ㄩ棬" prop="usingDepartment"> + <el-input + v-model="formData.usingDepartment" + placeholder="璇疯緭鍏ヤ娇鐢ㄩ儴闂�" + :disabled="isViewMode" + style="width: 100%" + /> + </el-form-item> + </el-col> + <el-col :span="11"> + <el-form-item label="瀛樻斁浣嶇疆" prop="storageLocation"> + <el-input + v-model="formData.storageLocation" + placeholder="璇疯緭鍏ュ瓨鏀句綅缃�" + :disabled="isViewMode" + style="width: 100%" + /> + </el-form-item> + </el-col> + <el-col :span="11"> + <el-form-item label="閲囪喘浠锋牸" prop="purchasePrice"> + <el-input + v-model="formData.purchasePrice" + placeholder="璇疯緭鍏ラ噰璐环鏍�" + :disabled="isViewMode" + style="width: 100%" + /> + </el-form-item> + </el-col> + <el-col :span="11"> + <el-form-item label="閲囪喘鏃ユ湡" prop="purchaseDate"> + <el-date-picker + v-model="formData.purchaseDate" + type="date" + placeholder="璇烽�夋嫨閲囪喘鏃ユ湡" + size="default" + :value-format="'YYYY-MM-DD'" + style="width: 100%;" + :disabled="isViewMode" + /> + </el-form-item> + </el-col> + </el-row> <el-form-item class="dialog-footer"> - <el-button v-if="addOrEdit === 'edit'" @click="resetForm" - >閲嶇疆</el-button - > - <el-button v-if="addOrEdit !== 'edit'||addOrEdit.includes('viewRow')" @click="cancelForm" - >鍙栨秷</el-button - > - <el-button type="primary" @click="submitForm" v-if="!isViewMode"> 纭畾</el-button> + <el-button v-if="!isViewMode" @click="cancelForm">鍙栨秷</el-button> + <el-button v-if="!isViewMode" type="primary" @click="submitForm">纭畾</el-button> </el-form-item> </el-form> </el-dialog> @@ -138,9 +121,8 @@ </template> <script setup> -import { ref, watch, defineProps, onMounted, computed, reactive } from "vue"; -import { addOrEditSupply } from "@/api/basicInformation/supplier"; -import { getAreaOptions } from "@/api/system/area.js"; +import { ref, watch, computed, reactive } from "vue"; +import { addOrEditEquipment } from "@/api/equipment/management/index.js"; const props = defineProps({ beforeClose: { @@ -161,121 +143,83 @@ }, }); -// 璁$畻灞炴�э細缁熶竴鎺у埗鏄惁绂佺敤 -const isViewMode = computed(() => props.addOrEdit === 'viewRow'); - const emit = defineEmits(["submit", "handleBeforeClose"]); + +// 璁$畻灞炴�э細缁熶竴鎺у埗鏄惁绂佺敤 +const isViewMode = computed(() => props.addOrEdit === "viewRow"); + +// 琛ㄥ崟寮曠敤鍜屾暟鎹� +const formRef = ref(null); +const formData = ref({}); const copyForm = defineModel("copyForm", { required: true, type: Object, -}); -onMounted(() => { - fetchAreaOptions(); + default: () => ({}), }); -// 淇敼鏍戝舰閫夋嫨鐨勬槧灏� -const cascaderProps = ref({ - value: "id", // 鎸囧畾value瀛楁涓篿d - label: "label", // 鎸囧畾label瀛楁 - children: "children", // 鎸囧畾瀛愯妭鐐瑰瓧娈� -}); - -// 鍦板潃閫夋嫨鏁版嵁 -const addressSelectOptions = ref([]); -const fetchAreaOptions = async () => { - addressSelectOptions.value = []; - - const res = await getAreaOptions(); - if (res.code === 200) { - addressSelectOptions.value = res.data; - } -}; - -// 澶勭悊鍦板潃鏁版嵁杞崲 -function mapAddress(list) { - return list.map((item) => ({ - value: item.id, - label: item.name, - children: item.children ? mapAddress(item.children) : undefined, - })); -} - -// 琛ㄥ崟寮曠敤 -const formRef = ref(null); -// 琛ㄥ崟鏁版嵁 -const formData = ref({ ...props.form }); // 寮圭獥鍙鎬� -const dialogVisible = defineModel("supplierDialogFormVisible", { +const dialogVisible = defineModel("managementFormDialog", { required: true, type: Boolean, }); -// 鐩戝惉澶栭儴浼犲叆鐨勮〃鍗曟暟鎹彉鍖� -watch( - () => props.form, - (newVal) => { - formData.value = { ...newVal }; - }, - { deep: true } -); -// 鐩戝惉鍐呴儴寮圭獥鐘舵�佸彉鍖� +// 鐩戝惉澶栭儴浼犲叆鐨勮〃鍗曟暟鎹彉鍖栵紝鍚堝苟鐩戝惉閫昏緫 watch( - () => dialogVisible.value, - (newVal) => { - emit("update:supplierDialogFormVisible", newVal); - } + [() => props.form, () => props.addOrEdit], + ([newForm, newAddOrEdit]) => { + formData.value = { ...newForm }; + }, + { deep: true, immediate: true } ); -// 澶勭悊鍦板潃閫夋嫨鍙樺寲 -const handleChange = (value) => { - console.log(value); -}; // 鎻愪氦琛ㄥ崟 const submitForm = async () => { if (!formRef.value) return; - await formRef.value.validate(async (valid, fields) => { - if (valid) { - const obj = ref({}); - if (props.title.includes("鏂板")) { - let result = await addOrEditSupply({ - ...formData.value, - }); - obj.value = { - title: "鏂板", - ...formData.value, - result, - }; + + await formRef.value.validate(async (valid) => { + if (!valid) return; + + try { + const result = await addOrEditEquipment({ ...formData.value }); + const title = props.title.includes("鏂板") ? "鏂板" : "缂栬緫"; + + if (result.code === 200 && result.msg) { + ElMessage.success(`${title}鎴愬姛锛�${result.msg}`); + emit("submit", { title, ...formData.value, result }); + closeDialog(); } else { - let result = await addOrEditSupply({ - ...formData.value, - }); - obj.value = { - title: "缂栬緫", - ...formData.value, - result, - }; + ElMessage.error(`${title}澶辫触锛�${result.msg}`); } - emit("submit", obj.value); + } catch (error) { + console.error("鎻愪氦澶辫触:", error); + ElMessage.error("鎻愪氦澶辫触锛岃閲嶈瘯"); } }); }; -// 鍙栨秷琛ㄥ崟 -const cancelForm = () => { - emit("update:supplierDialogFormVisible", false); + +// 鍏抽棴寮圭獥鐨勭粺涓�鏂规硶 +const closeDialog = () => { + emit("update:managementFormDialog", false); formData.value = {}; }; + +// 鍙栨秷琛ㄥ崟 +const cancelForm = () => { + closeDialog(); +}; + // 閲嶇疆琛ㄥ崟 const resetForm = () => { if (!formRef.value) return; formData.value = JSON.parse(JSON.stringify(copyForm.value)); }; + // 鍏抽棴寮圭獥 const handleClose = () => { - // 瑙﹀彂鐖剁粍浠剁殑鍏抽棴鍑芥暟 emit("handleBeforeClose"); - emit("update:supplierDialogFormVisible", false); + closeDialog(); }; const rules = reactive({ - supplierName: [ + equipmentId: [ { required: true, message: "璇疯緭鍏ヤ緵璐у晢鍚嶇О", trigger: "blur" }, ], }); @@ -287,4 +231,11 @@ margin-top: 20px; flex-direction: column; } + +// 鍙负dialog澶撮儴鍔犱笅鍒掔嚎 +:deep(.el-dialog__header) { + border-bottom: 1px solid #e8eaec; + padding: 0 20px 10px 0; + margin-bottom: 14px; +} </style> -- Gitblit v1.9.3