From 8959959e59f5a95ca7e61aa60decba4364f36339 Mon Sep 17 00:00:00 2001 From: chenhj <1263187585@qq.com> Date: 星期三, 04 六月 2025 17:57:30 +0800 Subject: [PATCH] 供应商省市区接口对接 --- src/views/basicInformation/mould/supplier.vue | 121 ++++++++++++++++++++++++---------------- 1 files changed, 72 insertions(+), 49 deletions(-) diff --git a/src/views/basicInformation/mould/supplier.vue b/src/views/basicInformation/mould/supplier.vue index 5072173..9819f41 100644 --- a/src/views/basicInformation/mould/supplier.vue +++ b/src/views/basicInformation/mould/supplier.vue @@ -1,39 +1,42 @@ <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"> + :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-input v-model="formData.supplierName" placeholder="璇疯緭鍏ヤ緵璐у晢鍚嶇О"/> </el-form-item> <el-form-item label="绾崇◣浜鸿瘑鍒彿" prop="taxpayerId"> - <el-input v-model="formData.taxpayerId" placeholder="璇疯緭鍏ョ撼绋庝汉璇嗗埆鍙�" /> + <el-input v-model="formData.taxpayerId" placeholder="璇疯緭鍏ョ撼绋庝汉璇嗗埆鍙�"/> </el-form-item> <el-form-item label="缁忚惀鍦板潃" prop="bids"> - <el-cascader placeholder="璇烽�夋嫨缁忚惀鍦板潃" size="default" :options="addressSelectOptions" v-model="formData.bids" - @change="handleChange"> + <el-cascader placeholder="璇烽�夋嫨缁忚惀鍦板潃" size="default" :options="addressSelectOptions" + v-model="formData.bids" + :props="cascaderProps" + @change="handleChange"> </el-cascader> </el-form-item> <el-form-item label="璇︾粏鍦板潃" prop="businessAddress"> - <el-input v-model="formData.businessAddress" placeholder="璇疯緭鍏ュ鎴疯缁嗗湴鍧�" /> + <el-input v-model="formData.businessAddress" placeholder="璇疯緭鍏ュ鎴疯缁嗗湴鍧�"/> </el-form-item> <el-form-item label="寮�鎴疯" prop="bankAccount"> - <el-input v-model="formData.bankAccount" placeholder="璇疯緭鍏ュ紑鎴疯" /> + <el-input v-model="formData.bankAccount" placeholder="璇疯緭鍏ュ紑鎴疯"/> </el-form-item> <el-form-item label="閾惰璐︽埛" prop="bankName"> - <el-input v-model="formData.bankName" placeholder="璇疯緭鍏ラ摱琛岃处鎴�" /> + <el-input v-model="formData.bankName" placeholder="璇疯緭鍏ラ摱琛岃处鎴�"/> </el-form-item> <el-form-item label="鑱旂郴浜�" prop="contactPerson"> - <el-input v-model="formData.contactPerson" placeholder="璇疯緭鍏ヨ仈绯讳汉" /> + <el-input v-model="formData.contactPerson" placeholder="璇疯緭鍏ヨ仈绯讳汉"/> </el-form-item> <el-form-item label="鑱旂郴浜虹數璇�" prop="contactPhone"> - <el-input v-model="formData.contactPhone" placeholder="璇疯緭鍏ヨ仈绯讳汉鐢佃瘽" /> + <el-input v-model="formData.contactPhone" placeholder="璇疯緭鍏ヨ仈绯讳汉鐢佃瘽"/> </el-form-item> <el-form-item label="鑱旂郴浜哄湴鍧�" prop="contactAddress"> - <el-input v-model="formData.contactAddress" placeholder="璇疯緭鍏ヨ仈绯讳汉鍦板潃" /> + <el-input v-model="formData.contactAddress" placeholder="璇疯緭鍏ヨ仈绯讳汉鍦板潃"/> </el-form-item> <el-form-item> - <el-button type="primary" @click="submitForm"> 纭畾 </el-button> + <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> @@ -43,13 +46,15 @@ </template> <script setup> -import { ref, watch, defineProps, onMounted } from "vue"; -import addressList from "@/api/jsonApi/areaList.json"; -import { addOrEditSupply } from "@/api/basicInformation/supplier"; +import {ref, watch, defineProps, onMounted} from "vue"; +import {addOrEditSupply} from "@/api/basicInformation/supplier"; +import {getAreaOptions} from "@/api/system/area.js"; + const props = defineProps({ beforeClose: { type: Function, - default: () => { }, + default: () => { + }, }, form: { type: Object, @@ -68,22 +73,40 @@ const emit = defineEmits(["submit", "handleBeforeClose"]); onMounted(() => { - addressSelectOptions.value = mapAddress(addressList); + fetchAreaOptions() }) + +// 淇敼鏍戝舰閫夋嫨鐨勬槧灏� +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.no, + value: item.id, label: item.name, children: item.children ? mapAddress(item.children) : undefined })); } + // 琛ㄥ崟寮曠敤 const formRef = ref(null); // 琛ㄥ崟鏁版嵁 -const formData = ref({ ...props.form }); +const formData = ref({...props.form}); // 寮圭獥鍙鎬� const dialogVisible = defineModel("supplierDialogFormVisible", { required: true, @@ -91,19 +114,19 @@ }); // 鐩戝惉澶栭儴浼犲叆鐨勮〃鍗曟暟鎹彉鍖� watch( - () => props.form, - (newVal) => { - formData.value = { ...newVal }; - }, - { deep: true } + () => props.form, + (newVal) => { + formData.value = {...newVal}; + }, + {deep: true} ); // 鐩戝惉鍐呴儴寮圭獥鐘舵�佸彉鍖� watch( - () => dialogVisible.value, - (newVal) => { - emit("update:supplierDialogFormVisible", newVal); - } + () => dialogVisible.value, + (newVal) => { + emit("update:supplierDialogFormVisible", newVal); + } ); // 澶勭悊鍦板潃閫夋嫨鍙樺寲 const handleChange = (value) => { @@ -114,23 +137,23 @@ if (!formRef.value) return; await formRef.value.validate(async (valid, fields) => { if (valid) { - if(props.title.includes('鏂板')){ + if (props.title.includes('鏂板')) { let result = await addOrEditSupply({ - ...formData.value, - }) - let obj = { - ...formData.value, - result - }; - }else{ + ...formData.value, + }) + let obj = { + ...formData.value, + result + }; + } else { delete formData.value.createTime delete formData.value.updateTime let result = await addOrEditSupply({ - ...formData.value, - }) - console.log(result) + ...formData.value, + }) + console.log(result) } - emit("submit", obj); + emit("submit", obj); } }); }; @@ -152,11 +175,11 @@ }; const rules = reactive({ supplierName: [ - { required: true, message: "璇疯緭鍏ヤ緵璐у晢鍚嶇О", trigger: "blur" }, + {required: true, message: "璇疯緭鍏ヤ緵璐у晢鍚嶇О", trigger: "blur"}, ], taxpayerId: [ - { required: true, message: "璇锋纭緭鍏ョ撼绋庝汉璇嗗埆鍙�", trigger: "blur" }, - { min: 17, max: 20, message: "璇疯緭鍏�17-20浣嶇撼绋庝汉璇嗗埆鍙�", trigger: "blur" }, + {required: true, message: "璇锋纭緭鍏ョ撼绋庝汉璇嗗埆鍙�", trigger: "blur"}, + {min: 17, max: 20, message: "璇疯緭鍏�17-20浣嶇撼绋庝汉璇嗗埆鍙�", trigger: "blur"}, ], bids: [ { @@ -165,12 +188,12 @@ trigger: "change", }, ], - bankName: [{ required: true, message: "璇疯緭鍏ラ摱琛岃处鎴�", trigger: "blur" }], - bankAccount: [{ required: true, message: "璇疯緭鍏ュ紑鎴疯", trigger: "blur" }], - contactPerson: [{ required: true, message: "鑱旂郴浜�", trigger: "blur" }], + bankName: [{required: true, message: "璇疯緭鍏ラ摱琛岃处鎴�", trigger: "blur"}], + bankAccount: [{required: true, message: "璇疯緭鍏ュ紑鎴疯", trigger: "blur"}], + contactPerson: [{required: true, message: "鑱旂郴浜�", trigger: "blur"}], contactPhone: [ - { required: true, message: "璇疯緭鍏ヨ仈绯讳汉", trigger: "blur" }, - { min: 11, max: 11, message: "璇疯緭鍏�11浣嶈仈绯讳汉鐢佃瘽", trigger: "blur" }, + {required: true, message: "璇疯緭鍏ヨ仈绯讳汉", trigger: "blur"}, + {min: 11, max: 11, message: "璇疯緭鍏�11浣嶈仈绯讳汉鐢佃瘽", trigger: "blur"}, ], }); </script> -- Gitblit v1.9.3