|
|
@@ -1,74 +1,80 @@
|
|
|
<!-- 搜索表单 -->
|
|
|
<template>
|
|
|
- <simple-form-modal title="修改地址" :items="formItems" ref="editRef" :baseUrl="baseUrl"
|
|
|
- @success="(data) => emit('success', data)" :formatData="formatData">
|
|
|
- <template #areaSelect>
|
|
|
- <area-select v-model="formData.proCodes" />
|
|
|
- </template>
|
|
|
- </simple-form-modal>
|
|
|
+ <simple-form-modal
|
|
|
+ title="修改地址"
|
|
|
+ :items="formItems"
|
|
|
+ ref="editRef"
|
|
|
+ :baseUrl="baseUrl"
|
|
|
+ @success="(data) => emit('success', data)"
|
|
|
+ :formatData="formatData"
|
|
|
+ >
|
|
|
+ <template #areaSelect>
|
|
|
+ <area-select v-model="formData.proCodes" />
|
|
|
+ </template>
|
|
|
+ </simple-form-modal>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
-import { reactive, ref, defineEmits, getCurrentInstance } from 'vue';
|
|
|
-import SimpleFormModal from '@/components/CommonPage/SimpleFormModal.vue';
|
|
|
-import AreaSelect from '@/components/CommonPage/AreaSelect.vue';
|
|
|
-import request from '@/utils/request'
|
|
|
-const { proxy } = getCurrentInstance();
|
|
|
+ import { reactive, ref, defineEmits, getCurrentInstance } from 'vue';
|
|
|
+ import SimpleFormModal from '@/components/CommonPage/SimpleFormModal.vue';
|
|
|
+ import AreaSelect from '@/components/CommonPage/AreaSelect.vue';
|
|
|
+ import request from '@/utils/request';
|
|
|
+ const { proxy } = getCurrentInstance();
|
|
|
|
|
|
-const emit = defineEmits(['success']);
|
|
|
+ const emit = defineEmits(['success']);
|
|
|
|
|
|
-const formItems = computed(() => {
|
|
|
+ const formItems = computed(() => {
|
|
|
return [
|
|
|
- {
|
|
|
- type: 'input',
|
|
|
- label: '发件人',
|
|
|
- prop: 'sendName',
|
|
|
- required: true
|
|
|
- },
|
|
|
- {
|
|
|
- type: 'input',
|
|
|
- label: '手机号',
|
|
|
- prop: 'sendMobile',
|
|
|
- itemProps: {
|
|
|
- rules: [
|
|
|
- { required: true, message: '请输入手机号', trigger: ['blur'] },
|
|
|
- {
|
|
|
- pattern: /^1[3-9]\d{9}$/,
|
|
|
- message: '请输入正确的手机号',
|
|
|
- trigger: ['change']
|
|
|
- }
|
|
|
- ]
|
|
|
+ {
|
|
|
+ type: 'input',
|
|
|
+ label: '发件人',
|
|
|
+ prop: 'sendName',
|
|
|
+ required: true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'input',
|
|
|
+ label: '手机号',
|
|
|
+ prop: 'sendMobile',
|
|
|
+ itemProps: {
|
|
|
+ rules: [
|
|
|
+ { required: true, message: '请输入手机号', trigger: ['blur'] },
|
|
|
+ {
|
|
|
+ pattern: /^1[3-9]\d{9}$/,
|
|
|
+ message: '请输入正确的手机号',
|
|
|
+ trigger: ['change']
|
|
|
}
|
|
|
- },
|
|
|
- {
|
|
|
- type: 'regions',
|
|
|
- label: '省市区',
|
|
|
- prop: 'proCodes',
|
|
|
- required: true,
|
|
|
- props: {
|
|
|
- cascaderProps: {
|
|
|
- lazy: true,
|
|
|
- lazyLoad: loadAreaData,
|
|
|
- value: 'id',
|
|
|
- label: 'district',
|
|
|
- checkStrictly: false
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- {
|
|
|
- type: 'textarea',
|
|
|
- label: '详细地址',
|
|
|
- prop: 'detailAddress',
|
|
|
- required: true
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'regions',
|
|
|
+ label: '省市区',
|
|
|
+ prop: 'proCodes',
|
|
|
+ required: true,
|
|
|
+ props: {
|
|
|
+ cascaderProps: {
|
|
|
+ lazy: true,
|
|
|
+ lazyLoad: loadAreaData,
|
|
|
+ value: 'id',
|
|
|
+ label: 'district',
|
|
|
+ checkStrictly: false
|
|
|
+ }
|
|
|
}
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'textarea',
|
|
|
+ label: '详细地址',
|
|
|
+ prop: 'detailAddress',
|
|
|
+ required: true
|
|
|
+ }
|
|
|
];
|
|
|
-});
|
|
|
+ });
|
|
|
|
|
|
-//默认值
|
|
|
-const baseUrl = reactive({
|
|
|
- add: '/order/orderInfo/modifyAddress',
|
|
|
-});
|
|
|
-const formData = ref({
|
|
|
+ //默认值
|
|
|
+ const baseUrl = reactive({
|
|
|
+ add: '/order/orderInfo/modifyAddress'
|
|
|
+ });
|
|
|
+ const formData = ref({
|
|
|
orderId: '',
|
|
|
sendName: '',
|
|
|
sendMobile: '',
|
|
|
@@ -77,66 +83,73 @@ const formData = ref({
|
|
|
districtId: 0,
|
|
|
detailAddress: '',
|
|
|
proCodes: []
|
|
|
-});
|
|
|
+ });
|
|
|
|
|
|
-const editRef = ref(null);
|
|
|
+ const editRef = ref(null);
|
|
|
|
|
|
-const formatData = (data) => {
|
|
|
+ const formatData = (data) => {
|
|
|
if (data.proCodes.length > 0) {
|
|
|
- data.provinceId = data.proCodes[0];
|
|
|
- data.cityId = data.proCodes[1];
|
|
|
- data.districtId = data.proCodes[2];
|
|
|
+ data.provinceId = data.proCodes[0];
|
|
|
+ data.cityId = data.proCodes[1];
|
|
|
+ data.districtId = data.proCodes[2];
|
|
|
}
|
|
|
return {
|
|
|
- ...data,
|
|
|
- orderId: formData.value.orderId
|
|
|
- }
|
|
|
-}
|
|
|
+ ...data,
|
|
|
+ orderId: formData.value.orderId
|
|
|
+ };
|
|
|
+ };
|
|
|
|
|
|
-function handleOpen(data) {
|
|
|
- formData.value.orderId = data.orderId;
|
|
|
- editRef.value?.handleOpen(formData.value);
|
|
|
-}
|
|
|
+ function handleOpen(data) {
|
|
|
+ if (data && data.orderId) {
|
|
|
+ formData.value.orderId = data.orderId;
|
|
|
+ formData.value.sendName = data.sendName;
|
|
|
+ formData.value.sendMobile = data.sendMobile;
|
|
|
+ formData.value.detailAddress = data.sendAddress;
|
|
|
+ formData.value.proCodes = data.sendSsqId ? data.sendSsqId.split('/').map(Number) : [];
|
|
|
+ console.log(formData.value, 'formData.value');
|
|
|
+ editRef.value?.handleOpen(formData.value);
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
-// 加载区域数据
|
|
|
-async function loadAreaData(node, resolve) {
|
|
|
+ // 加载区域数据
|
|
|
+ async function loadAreaData(node, resolve) {
|
|
|
const { level, value } = node;
|
|
|
try {
|
|
|
- let data = [];
|
|
|
- if (level === 0) {
|
|
|
- // 加载省份数据
|
|
|
- data = await getProvinceList();
|
|
|
- console.log(data, 'data');
|
|
|
- } else if (level === 1) {
|
|
|
- // 加载城市数据
|
|
|
- data = await getProvinceList(value);
|
|
|
- } else if (level === 2) {
|
|
|
- // 加载区县数据
|
|
|
- data = await getProvinceList(value);
|
|
|
- data.forEach((item) => {
|
|
|
- item.leaf = true;
|
|
|
- });
|
|
|
- }
|
|
|
- resolve(data);
|
|
|
+ let data = [];
|
|
|
+ if (level === 0) {
|
|
|
+ // 加载省份数据
|
|
|
+ data = await getProvinceList();
|
|
|
+ console.log(data, 'data');
|
|
|
+ } else if (level === 1) {
|
|
|
+ // 加载城市数据
|
|
|
+ data = await getProvinceList(value);
|
|
|
+ } else if (level === 2) {
|
|
|
+ // 加载区县数据
|
|
|
+ data = await getProvinceList(value);
|
|
|
+ data.forEach((item) => {
|
|
|
+ item.leaf = true;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ resolve(data);
|
|
|
} catch (error) {
|
|
|
- console.error('加载地区数据失败:', error);
|
|
|
- resolve([]);
|
|
|
+ console.error('加载地区数据失败:', error);
|
|
|
+ resolve([]);
|
|
|
}
|
|
|
-}
|
|
|
+ }
|
|
|
|
|
|
-function getProvinceList(id = 1) {
|
|
|
+ function getProvinceList(id = 1) {
|
|
|
return new Promise((resolve, reject) => {
|
|
|
- request
|
|
|
- .get(`/baseinfo/districtInfo/findInfo/${id}`)
|
|
|
- .then((res) => {
|
|
|
- resolve(res.data.data);
|
|
|
- })
|
|
|
- .catch((err) => {
|
|
|
- resolve([]);
|
|
|
- reject(err);
|
|
|
- });
|
|
|
+ request
|
|
|
+ .get(`/baseinfo/districtInfo/findInfo/${id}`)
|
|
|
+ .then((res) => {
|
|
|
+ resolve(res.data.data);
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ resolve([]);
|
|
|
+ reject(err);
|
|
|
+ });
|
|
|
});
|
|
|
-}
|
|
|
+ }
|
|
|
|
|
|
-defineExpose({ handleOpen });
|
|
|
+ defineExpose({ handleOpen });
|
|
|
</script>
|