From fc75f2f27f1ce66801c5637175046f8c65a81249 Mon Sep 17 00:00:00 2001 From: zhang_12370 <z2864490065@outlook.com> Date: 星期四, 26 六月 2025 09:58:18 +0800 Subject: [PATCH] 完善部分页面查看 --- src/views/basicInformation/mould/supplier.vue | 212 ++++++++++++++++++++++++++++++++++++++++------------ 1 files changed, 163 insertions(+), 49 deletions(-) diff --git a/src/views/basicInformation/mould/supplier.vue b/src/views/basicInformation/mould/supplier.vue index ae30965..7922ca7 100644 --- a/src/views/basicInformation/mould/supplier.vue +++ b/src/views/basicInformation/mould/supplier.vue @@ -13,61 +13,124 @@ :model="formData" :rules="rules" label-width="auto" - > - <el-form-item label="瀹㈡埛鍚嶇О" prop="supplierName"> + > <el-form-item + label="渚涘簲鍟嗗悕绉�" + prop="supplierName" + > <el-input v-model="formData.supplierName" placeholder="璇疯緭鍏ヤ緵璐у晢鍚嶇О" + :disabled="isViewMode" /> </el-form-item> - <el-form-item label="绾崇◣浜鸿瘑鍒彿" prop="identifyNumber"> + <el-form-item + label="绾崇◣浜鸿瘑鍒彿" + prop="taxpayerId" + > <el-input - v-model="formData.identifyNumber" + v-model="formData.taxpayerId" placeholder="璇疯緭鍏ョ撼绋庝汉璇嗗埆鍙�" + :disabled="isViewMode" /> </el-form-item> - <el-form-item label="缁忚惀鍦板潃" prop="address"> + <el-form-item + label="缁忚惀鍦板潃" + prop="bids" + > <el-cascader placeholder="璇烽�夋嫨缁忚惀鍦板潃" size="default" :options="addressSelectOptions" - v-model="formData.address" + v-model="formData.bids" + :props="cascaderProps" @change="handleChange" + :disabled="isViewMode" > </el-cascader> </el-form-item> - <el-form-item label="璇︾粏鍦板潃" prop="addressDetail"> + <el-form-item + label="璇︾粏鍦板潃" + prop="businessAddress" + > <el-input - v-model="formData.addressDetail" + v-model="formData.businessAddress" placeholder="璇疯緭鍏ュ鎴疯缁嗗湴鍧�" + :disabled="isViewMode" /> </el-form-item> - <el-form-item label="閾惰璐︽埛" prop="bankAccount"> - <el-input - v-model="formData.bankAccount" - placeholder="璇疯緭鍏ラ摱琛岃处鎴�" + <el-form-item + label="寮�鎴疯" + prop="bankAccount" + > + <el-input + v-model="formData.bankAccount" + placeholder="璇疯緭鍏ュ紑鎴疯" + :disabled="isViewMode" /> </el-form-item> - <el-form-item label="寮�鎴疯" prop="bank"> - <el-input v-model="formData.bank" placeholder="璇疯緭鍏ュ紑鎴疯" /> + <el-form-item + label="閾惰璐︽埛" + prop="bankName" + > + <el-input + v-model="formData.bankName" + placeholder="璇疯緭鍏ラ摱琛岃处鎴�" + :disabled="isViewMode" + /> </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-form-item + label="鑱旂郴浜�" + prop="contactPerson" + > <el-input - v-model="formData.contactsPhone" + 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> - <el-button type="primary" @click="submitForm"> 纭畾 </el-button> + <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-form-item class="dialog-footer"> <el-button v-if="addOrEdit === 'edit'" @click="resetForm" >閲嶇疆</el-button > - <el-button v-if="addOrEdit === 'add'" @click="cancelForm" + <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-form-item> </el-form> </el-dialog> @@ -75,9 +138,10 @@ </template> <script setup> -import { ref, watch, defineProps, onMounted } from "vue"; -import addressList from "@/api/jsonApi/areaList.json"; -import imageUpload from "@/components/ImageUpload/index.vue"; +import { ref, watch, defineProps, onMounted, computed, reactive } from "vue"; +import { addOrEditSupply } from "@/api/basicInformation/supplier"; +import { getAreaOptions } from "@/api/system/area.js"; + const props = defineProps({ beforeClose: { type: Function, @@ -97,21 +161,45 @@ }, }); -const emit = defineEmits(["submit", "handleBeforeClose"]); +// 璁$畻灞炴�э細缁熶竴鎺у埗鏄惁绂佺敤 +const isViewMode = computed(() => props.addOrEdit === 'viewRow'); -onMounted(()=>{ - addressSelectOptions.value = mapAddress(addressList); -}) +const emit = defineEmits(["submit", "handleBeforeClose"]); +const copyForm = defineModel("copyForm", { + required: true, + type: Object, +}); +onMounted(() => { + 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, + return list.map((item) => ({ + value: item.id, label: item.name, - children: item.children ? mapAddress(item.children) : undefined + children: item.children ? mapAddress(item.children) : undefined, })); } + // 琛ㄥ崟寮曠敤 const formRef = ref(null); // 琛ㄥ崟鏁版嵁 @@ -144,9 +232,29 @@ // 鎻愪氦琛ㄥ崟 const submitForm = async () => { if (!formRef.value) return; - await formRef.value.validate((valid, fields) => { + await formRef.value.validate(async (valid, fields) => { if (valid) { - emit("submit", formData.value); + const obj = ref({}); + if (props.title.includes("鏂板")) { + let result = await addOrEditSupply({ + ...formData.value, + }); + obj.value = { + title: "鏂板", + ...formData.value, + result, + }; + } else { + let result = await addOrEditSupply({ + ...formData.value, + }); + obj.value = { + title: "缂栬緫", + ...formData.value, + result, + }; + } + emit("submit", obj.value); } }); }; @@ -158,7 +266,7 @@ // 閲嶇疆琛ㄥ崟 const resetForm = () => { if (!formRef.value) return; - formRef.value.resetFields(); + formData.value = JSON.parse(JSON.stringify(copyForm.value)); }; // 鍏抽棴寮圭獥 const handleClose = () => { @@ -170,25 +278,31 @@ supplierName: [ { required: true, message: "璇疯緭鍏ヤ緵璐у晢鍚嶇О", trigger: "blur" }, ], - identifyNumber: [ + taxpayerId: [ { 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: [ + // bids: [ + // { + // required: true, + // message: "璇烽�夋嫨缁忚惀鍦板潃", + // trigger: "change", + // }, + // ], + 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" }, ], }); </script> -<style lang="sass" scoped> -</style> \ No newline at end of file +<style lang="scss" scoped> +.dialog-footer { + display: flex; + justify-content: flex-end; + margin-top: 20px; + flex-direction: column; +} +</style> -- Gitblit v1.9.3