|
@@ -0,0 +1,140 @@
|
|
|
|
|
+<!-- 搜索表单 -->
|
|
|
|
|
+<template>
|
|
|
|
|
+ <simple-form-modal
|
|
|
|
|
+ title="修改地址"
|
|
|
|
|
+ :items="formItems"
|
|
|
|
|
+ ref="editRef"
|
|
|
|
|
+ :baseUrl="baseUrl"
|
|
|
|
|
+ @success="(data) => emit('success', data)"
|
|
|
|
|
+ :formatData="formatData"
|
|
|
|
|
+ >
|
|
|
|
|
+ <template #areaSelect="{ model, updateValue }">
|
|
|
|
|
+ <area-select
|
|
|
|
|
+ :modelValue="model.proCodes"
|
|
|
|
|
+ @update:modelValue="(val) => updateValue(val)"
|
|
|
|
|
+ />
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </simple-form-modal>
|
|
|
|
|
+</template>
|
|
|
|
|
+
|
|
|
|
|
+<script setup>
|
|
|
|
|
+ import {
|
|
|
|
|
+ reactive,
|
|
|
|
|
+ ref,
|
|
|
|
|
+ defineEmits,
|
|
|
|
|
+ getCurrentInstance,
|
|
|
|
|
+ nextTick,
|
|
|
|
|
+ computed
|
|
|
|
|
+ } from 'vue';
|
|
|
|
|
+ import SimpleFormModal from '@/components/CommonPage/SimpleFormModal.vue';
|
|
|
|
|
+ import AreaSelect from '@/components/CommonPage/AreaSelect.vue';
|
|
|
|
|
+ const { proxy } = getCurrentInstance();
|
|
|
|
|
+
|
|
|
|
|
+ const emit = defineEmits(['success']);
|
|
|
|
|
+
|
|
|
|
|
+ const formItems = computed(() => {
|
|
|
|
|
+ return [
|
|
|
|
|
+ {
|
|
|
|
|
+ type: 'input',
|
|
|
|
|
+ label: '收件人',
|
|
|
|
|
+ prop: 'receiveName',
|
|
|
|
|
+ required: true
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ type: 'input',
|
|
|
|
|
+ label: '手机号',
|
|
|
|
|
+ prop: 'receiveMobile',
|
|
|
|
|
+ itemProps: {
|
|
|
|
|
+ rules: [
|
|
|
|
|
+ {
|
|
|
|
|
+ required: true,
|
|
|
|
|
+ message: '请输入手机号',
|
|
|
|
|
+ trigger: ['blur']
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ pattern: /^1[3-9]\d{9}$/,
|
|
|
|
|
+ message: '请输入正确的手机号',
|
|
|
|
|
+ trigger: ['change']
|
|
|
|
|
+ }
|
|
|
|
|
+ ]
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ type: 'areaSelect',
|
|
|
|
|
+ label: '省市区',
|
|
|
|
|
+ prop: 'proCodes',
|
|
|
|
|
+ required: true
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ type: 'textarea',
|
|
|
|
|
+ label: '详细地址',
|
|
|
|
|
+ prop: 'detailAddress',
|
|
|
|
|
+ required: true
|
|
|
|
|
+ }
|
|
|
|
|
+ ];
|
|
|
|
|
+ });
|
|
|
|
|
+
|
|
|
|
|
+ const baseUrl = reactive({
|
|
|
|
|
+ add: '/order/orderInfo/refund/modifyAddress',
|
|
|
|
|
+ });
|
|
|
|
|
+ const formData = ref({
|
|
|
|
|
+ refundOrderId: '',
|
|
|
|
|
+ receiveName: '',
|
|
|
|
|
+ receiveMobile: '',
|
|
|
|
|
+ provinceId: 0,
|
|
|
|
|
+ cityId: 0,
|
|
|
|
|
+ districtId: 0,
|
|
|
|
|
+ detailAddress: '',
|
|
|
|
|
+ proCodes: []
|
|
|
|
|
+ });
|
|
|
|
|
+
|
|
|
|
|
+ const editRef = ref(null);
|
|
|
|
|
+
|
|
|
|
|
+ const formatData = (data) => {
|
|
|
|
|
+ if (data.proCodes.length > 0) {
|
|
|
|
|
+ data.provinceId = data.proCodes[0];
|
|
|
|
|
+ data.cityId = data.proCodes[1];
|
|
|
|
|
+ data.districtId = data.proCodes[2];
|
|
|
|
|
+ }
|
|
|
|
|
+ return {
|
|
|
|
|
+ refundOrderId: formData.value.refundOrderId,
|
|
|
|
|
+ receiveName: data.receiveName,
|
|
|
|
|
+ receiveMobile: data.receiveMobile,
|
|
|
|
|
+ provinceId: data.provinceId,
|
|
|
|
|
+ cityId: data.cityId,
|
|
|
|
|
+ districtId: data.districtId,
|
|
|
|
|
+ detailAddress: data.detailAddress
|
|
|
|
|
+ };
|
|
|
|
|
+ };
|
|
|
|
|
+
|
|
|
|
|
+ function handleOpen(data) {
|
|
|
|
|
+ // 先重置formData,确保清空所有数据
|
|
|
|
|
+ formData.value = {
|
|
|
|
|
+ refundOrderId: '',
|
|
|
|
|
+ receiveName: '',
|
|
|
|
|
+ receiveMobile: '',
|
|
|
|
|
+ provinceId: 0,
|
|
|
|
|
+ cityId: 0,
|
|
|
|
|
+ districtId: 0,
|
|
|
|
|
+ detailAddress: '',
|
|
|
|
|
+ proCodes: []
|
|
|
|
|
+ };
|
|
|
|
|
+
|
|
|
|
|
+ if (data && data.refundOrderId) {
|
|
|
|
|
+ formData.value.refundOrderId = data.refundOrderId;
|
|
|
|
|
+ formData.value.receiveName = data.receiveName;
|
|
|
|
|
+ formData.value.receiveMobile = data.receiveMobile;
|
|
|
|
|
+ formData.value.detailAddress = data.receiveAddress;
|
|
|
|
|
+ formData.value.proCodes = data.receiveSsqId
|
|
|
|
|
+ ? data.receiveSsqId.split('/').map(Number)
|
|
|
|
|
+ : [];
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ // 使用nextTick确保数据重置后再打开弹窗
|
|
|
|
|
+ nextTick(() => {
|
|
|
|
|
+ editRef.value?.handleOpen(formData.value);
|
|
|
|
|
+ });
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ defineExpose({ handleOpen });
|
|
|
|
|
+</script>
|