From 6b9dd0a1b0c259a02c086f7834467e1fa2c2a5ea Mon Sep 17 00:00:00 2001 From: 张诺 <zhang_12370@163.com> Date: 星期五, 30 五月 2025 17:58:54 +0800 Subject: [PATCH] 调整基础信息供应商模块,客户信息模块并新增联动查询省市区联动,修改table表格方法 --- src/views/basicInformation/mould/coalQualityMaintenance.vue | 193 ++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 193 insertions(+), 0 deletions(-) diff --git a/src/views/basicInformation/mould/coalQualityMaintenance.vue b/src/views/basicInformation/mould/coalQualityMaintenance.vue new file mode 100644 index 0000000..e42754b --- /dev/null +++ b/src/views/basicInformation/mould/coalQualityMaintenance.vue @@ -0,0 +1,193 @@ +<template> + <div> + <el-dialog + v-model="dialogVisible" + :title="title" + width="600" + :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="璇疯緭鍏ヤ緵璐у晢鍚嶇О" + /> + </el-form-item> + <el-form-item label="绾崇◣浜鸿瘑鍒彿" prop="identifyNumber"> + <el-input + v-model="formData.identifyNumber" + placeholder="璇疯緭鍏ョ撼绋庝汉璇嗗埆鍙�" + /> + </el-form-item> + <el-form-item label="缁忚惀鍦板潃" prop="address"> + <el-cascader + placeholder="璇烽�夋嫨缁忚惀鍦板潃" + size="default" + :options="addressSelectOptions" + v-model="formData.address" + @change="handleChange" + > + </el-cascader> + </el-form-item> + <el-form-item label="璇︾粏鍦板潃" prop="addressDetail"> + <el-input + v-model="formData.addressDetail" + placeholder="璇疯緭鍏ュ鎴疯缁嗗湴鍧�" + /> + </el-form-item> + <el-form-item label="閾惰璐︽埛" prop="bankAccount"> + <el-input + v-model="formData.bankAccount" + placeholder="璇疯緭鍏ラ摱琛岃处鎴�" + /> + </el-form-item> + <el-form-item label="寮�鎴疯" prop="bank"> + <el-input v-model="formData.bank" placeholder="璇疯緭鍏ュ紑鎴疯" /> + </el-form-item> + <el-form-item label="鑱旂郴浜�" prop="contacts"> + <el-input v-model="formData.contacts" placeholder="璇疯緭鍏ヨ仈绯讳汉" /> + </el-form-item> + <el-form-item label="鑱旂郴浜虹數璇�" prop="contactsPhone"> + <el-input + v-model="formData.contactsPhone" + placeholder="璇疯緭鍏ヨ仈绯讳汉鐢佃瘽" + /> + </el-form-item> + <el-form-item> + <el-button type="primary" @click="submitForm"> 纭畾 </el-button> + <el-button v-if="addOrEdit === 'edit'" @click="resetForm" + >閲嶇疆</el-button + > + <el-button v-if="addOrEdit === 'add'" @click="cancelForm" + >鍙栨秷</el-button + > + </el-form-item> + </el-form> + </el-dialog> + </div> +</template> + +<script setup> +import { ref, watch, defineProps, onMounted } from "vue"; +import addressList from "@/api/jsonApi/areaList.json"; +const props = defineProps({ + beforeClose: { + type: Function, + default: () => {}, + }, + form: { + type: Object, + default: () => ({}), + }, + addOrEdit: { + type: String, + default: "add", + }, + title: { + type: String, + default: "", + }, +}); + +const emit = defineEmits(["submit", "handleBeforeClose"]); + +onMounted(()=>{ + addressSelectOptions.value = mapAddress(addressList); +}) +// 鍦板潃閫夋嫨鏁版嵁 +const addressSelectOptions = ref([]); +// 澶勭悊鍦板潃鏁版嵁杞崲 +function mapAddress(list) { + return list.map(item => ({ + value: item.no, + label: item.name, + children: item.children ? mapAddress(item.children) : undefined + })); +} +// 琛ㄥ崟寮曠敤 +const formRef = ref(null); +// 琛ㄥ崟鏁版嵁 +const formData = ref({ ...props.form }); +// 寮圭獥鍙鎬� +const dialogVisible = defineModel("coalQualityMaintenanceDialogFormVisible", { + required: true, + type: Boolean, +}); +// 鐩戝惉澶栭儴浼犲叆鐨勮〃鍗曟暟鎹彉鍖� +watch( + () => props.form, + (newVal) => { + formData.value = { ...newVal }; + }, + { deep: true } +); + +// 鐩戝惉鍐呴儴寮圭獥鐘舵�佸彉鍖� +watch( + () => dialogVisible.value, + (newVal) => { + emit("update:coalQualityMaintenanceDialogFormVisible", newVal); + } +); +// 澶勭悊鍦板潃閫夋嫨鍙樺寲 +const handleChange = (value) => { + console.log(value); +}; +// 鎻愪氦琛ㄥ崟 +const submitForm = async () => { + if (!formRef.value) return; + await formRef.value.validate((valid, fields) => { + if (valid) { + emit("submit", formData.value); + } + }); +}; +// 鍙栨秷琛ㄥ崟 +const cancelForm = () => { + emit("update:coalQualityMaintenanceDialogFormVisible", false); + formData.value = {}; +}; +// 閲嶇疆琛ㄥ崟 +const resetForm = () => { + if (!formRef.value) return; + formRef.value.resetFields(); +}; +// 鍏抽棴寮圭獥 +const handleClose = () => { + // 瑙﹀彂鐖剁粍浠剁殑鍏抽棴鍑芥暟 + emit("handleBeforeClose"); + emit("update:coalQualityMaintenanceDialogFormVisible", false); +}; +const rules = reactive({ + supplierName: [ + { required: true, message: "璇疯緭鍏ヤ緵璐у晢鍚嶇О", trigger: "blur" }, + ], + identifyNumber: [ + { required: true, message: "璇锋纭緭鍏ョ撼绋庝汉璇嗗埆鍙�", trigger: "blur" }, + { min: 17, max: 20, message: "璇疯緭鍏�17-20浣嶇撼绋庝汉璇嗗埆鍙�", trigger: "blur" }, + ], + address: [ + { + required: true, + message: "璇烽�夋嫨缁忚惀鍦板潃", + trigger: "change", + }, + ], + bankAccount: [{ required: true, message: "璇疯緭鍏ラ摱琛岃处鎴�", trigger: "blur" }], + bank: [{ required: true, message: "璇疯緭鍏ュ紑鎴疯", trigger: "blur" }], + contacts: [{ required: true, message: "璇疯緭鍏ュ紑鎴疯", trigger: "blur" }], + contactsPhone: [ + { required: true, message: "璇疯緭鍏ヨ仈绯讳汉", trigger: "blur" }, + { min: 11, max: 11, message: "璇疯緭鍏�11浣嶈仈绯讳汉鐢佃瘽", trigger: "blur" }, + ], +}); +</script> +<style lang="sass" scoped> +</style> \ No newline at end of file -- Gitblit v1.9.3