Skip to content

B
baifang-java
Commit 3d0ac2cb authored by 赵乐's avatar 赵乐
Browse files
Options

选择地址修改

parent 677dd111
Hide whitespace changes
Inline Side-by-side
Showing with 217 additions and 175 deletions
yudao-ui/yudao-ui-admin-vue3/.env.local
View file @ 3d0ac2cb
...@@ -4,7 +4,8 @@ NODE_ENV=development ...@@ -4,7 +4,8 @@ NODE_ENV=development
VITE_DEV=true VITE_DEV=true
# 请求路径 # 请求路径
VITE_BASE_URL='http://192.168.0.133:48080' # VITE_BASE_URL='http://192.168.0.133:48080'
VITE_BASE_URL='https://hntqwl.com'
# VITE_BASE_URL='http://localhost:48080' # VITE_BASE_URL='http://localhost:48080'
# 文件上传类型：server - 后端上传， client - 前端直连上传，仅支持 S3 服务 # 文件上传类型：server - 后端上传， client - 前端直连上传，仅支持 S3 服务
......
yudao-ui/yudao-ui-admin-vue3/src/views/visit/customerinfo/CustomerInfoForm.vue
View file @ 3d0ac2cb
...@@ -36,21 +36,28 @@ ...@@ -36,21 +36,28 @@
@change="handleChange" @change="handleChange"
/> />
</el-form-item> </el-form-item>
<!-- <el-form-item label="市名称" prop="cityName">--> <!-- <el-form-item label="市名称" prop="cityName">-->
<!-- <el-input v-model="formData.cityName" placeholder="请输入市名称" />--> <!-- <el-input v-model="formData.cityName" placeholder="请输入市名称" />-->
<!-- </el-form-item>--> <!-- </el-form-item>-->
<!-- --> <!-- -->
<!-- <el-form-item label="区名称" prop="areaName">--> <!-- <el-form-item label="区名称" prop="areaName">-->
<!-- <el-input v-model="formData.areaName" placeholder="请输入区名称" />--> <!-- <el-input v-model="formData.areaName" placeholder="请输入区名称" />-->
<!-- </el-form-item>--> <!-- </el-form-item>-->
<!-- <el-form-item label="所在地区" prop="regionFullName">--> <!-- <el-form-item label="所在地区" prop="regionFullName">-->
<!-- <el-input v-model="formData.regionFullName" placeholder="请输入所在地区" />--> <!-- <el-input v-model="formData.regionFullName" placeholder="请输入所在地区" />-->
<!-- </el-form-item>--> <!-- </el-form-item>-->
<!-- <el-form-item label="详细地址" prop="locationText">
<el-input v-model="formData.locationText" placeholder="请点击右侧选择" readonly>
<template #append v-if="formType !== 'detail'">
<el-link type="primary" @click="openMapPicker">选择地址</el-link>
</template>
</el-input>
</el-form-item> -->
<el-form-item label="详细地址" prop="locationText"> <el-form-item label="详细地址" prop="locationText">
<el-input <el-input
v-model="formData.locationText" v-model="formData.locationText"
placeholder="请点击右侧选择" placeholder="点击右侧选择地址后可进行编辑"
readonly :readonly="formType === 'detail' || !formData.locationText"
> >
<template #append v-if="formType !== 'detail'"> <template #append v-if="formType !== 'detail'">
<el-link type="primary" @click="openMapPicker">选择地址</el-link> <el-link type="primary" @click="openMapPicker">选择地址</el-link>
...@@ -59,23 +66,19 @@ ...@@ -59,23 +66,19 @@
</el-form-item> </el-form-item>
<MapPicker ref="mapPickerRef" @update-location="handleLocation" /> <MapPicker ref="mapPickerRef" @update-location="handleLocation" />
<!-- <el-form-item label="详细地址" prop="locationText">--> <!-- <el-form-item label="详细地址" prop="locationText">-->
<!-- <el-input v-model="formData.locationText" placeholder="请输入详细地址" />--> <!-- <el-input v-model="formData.locationText" placeholder="请输入详细地址" />-->
<!-- </el-form-item>--> <!-- </el-form-item>-->
<!-- <el-form-item label="经度" prop="longitude">--> <!-- <el-form-item label="经度" prop="longitude">-->
<!-- <el-input v-model="formData.longitude" placeholder="请输入经度" />--> <!-- <el-input v-model="formData.longitude" placeholder="请输入经度" />-->
<!-- </el-form-item>--> <!-- </el-form-item>-->
<!-- <el-form-item label="纬度" prop="latitude">--> <!-- <el-form-item label="纬度" prop="latitude">-->
<!-- <el-input v-model="formData.latitude" placeholder="请输入纬度" />--> <!-- <el-input v-model="formData.latitude" placeholder="请输入纬度" />-->
<!-- </el-form-item>--> <!-- </el-form-item>-->
<!-- <el-form-item label="定位静态图 URL" prop="locationImage">--> <!-- <el-form-item label="定位静态图 URL" prop="locationImage">-->
<!-- <UploadImg v-model="formData.locationImage" />--> <!-- <UploadImg v-model="formData.locationImage" />-->
<!-- </el-form-item>--> <!-- </el-form-item>-->
<el-form-item label="产品信息" prop="productNames"> <el-form-item label="产品信息" prop="productNames">
<el-input <el-input v-model="formData.productNames" placeholder="请点击右侧选择" readonly>
v-model="formData.productNames"
placeholder="请点击右侧选择"
readonly
>
<template #append v-if="formType !== 'detail'"> <template #append v-if="formType !== 'detail'">
<el-link type="primary" @click="openProduct">选择产品</el-link> <el-link type="primary" @click="openProduct">选择产品</el-link>
</template> </template>
...@@ -93,48 +96,58 @@ ...@@ -93,48 +96,58 @@
</el-form-item> </el-form-item>
</el-form> </el-form>
<template #footer> <template #footer>
<el-button @click="submitForm" type="primary" :disabled="formLoading" v-if="formType !== 'detail'">确 定</el-button> <el-button
@click="submitForm"
type="primary"
:disabled="formLoading"
v-if="formType !== 'detail'"
>确 定</el-button
>
<el-button @click="dialogVisible = false">取 消</el-button> <el-button @click="dialogVisible = false">取 消</el-button>
</template> </template>
</Dialog> </Dialog>
<productTable ref="productListRef" @update-product="handleUpdateProduct" :ids="formData.productIds"/> <productTable
ref="productListRef"
@update-product="handleUpdateProduct"
:ids="formData.productIds"
/>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { getIntDictOptions, getStrDictOptions, DICT_TYPE } from '@/utils/dict' import { getIntDictOptions, getStrDictOptions, DICT_TYPE } from '@/utils/dict'
import { CustomerInfoApi, CustomerInfoVO } from '@/api/visit/customerinfo' import { CustomerInfoApi, CustomerInfoVO } from '@/api/visit/customerinfo'
import { pcaTextArr } from 'element-china-area-data' import { pcaTextArr } from 'element-china-area-data'
import MapPicker from '../util/MapPicker.vue' import MapPicker from '../util/MapPicker.vue'
import productTable from './productTable.vue' import productTable from './productTable.vue'
import {homesApi} from "@/api/visit/home"; import { homesApi } from '@/api/visit/home'
/** 客户信息 表单 */ /** 客户信息 表单 */
defineOptions({ name: 'CustomerInfoForm' }) defineOptions({ name: 'CustomerInfoForm' })
const { t } = useI18n() // 国际化 const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗 const message = useMessage() // 消息弹窗
const isDetail = computed(() => formType.value === 'detail')//detail说明是查看详情,要只读 const isDetail = computed(() => formType.value === 'detail') //detail说明是查看详情,要只读
const dialogVisible = ref(false) // 弹窗的是否展示 const dialogVisible = ref(false) // 弹窗的是否展示
const dialogTitle = ref('') // 弹窗的标题 const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用 const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formType = ref('') // 表单的类型：create - 新增；update - 修改 const formType = ref('') // 表单的类型：create - 新增；update - 修改
const selectedOptions = ref<string[]>([]) const selectedOptions = ref<string[]>([])
interface CustomerFormData { interface CustomerFormData {
id?: number; id?: number
customerName?: string; customerName?: string
contact?: string; contact?: string
companyName?: string; companyName?: string
customerType?: string; customerType?: string
provinceName?: string; provinceName?: string
cityName?: string; cityName?: string
areaName?: string; areaName?: string
regionFullName?: string; regionFullName?: string
locationText?: string; locationText?: string
longitude?: number; longitude?: number
latitude?: number; latitude?: number
locationImage?: string; locationImage?: string
productIds?: string; productIds?: string
productNames?: string; productNames?: string
department?: string; department?: string
} }
const formData = ref<CustomerFormData>({ const formData = ref<CustomerFormData>({
id: undefined, id: undefined,
...@@ -152,7 +165,7 @@ const formData = ref<CustomerFormData>({ ...@@ -152,7 +165,7 @@ const formData = ref<CustomerFormData>({
locationImage: undefined, locationImage: undefined,
productIds: undefined, productIds: undefined,
productNames: undefined, productNames: undefined,
department: undefined, department: undefined
}) })
const formRules = reactive({ const formRules = reactive({
companyName: [{ required: true, message: '公司名称不能为空', trigger: 'blur' }], companyName: [{ required: true, message: '公司名称不能为空', trigger: 'blur' }],
...@@ -166,25 +179,28 @@ const formRules = reactive({ ...@@ -166,25 +179,28 @@ const formRules = reactive({
longitude: [{ required: true, message: '经度不能为空', trigger: 'blur' }], longitude: [{ required: true, message: '经度不能为空', trigger: 'blur' }],
latitude: [{ required: true, message: '纬度不能为空', trigger: 'blur' }], latitude: [{ required: true, message: '纬度不能为空', trigger: 'blur' }],
locationImage: [{ required: true, message: '定位静态图不能为空', trigger: 'blur' }], locationImage: [{ required: true, message: '定位静态图不能为空', trigger: 'blur' }],
productNames: [{ required: true, message: '产品信息名称不能为空', trigger: 'blur|change' }], productNames: [{ required: false, message: '产品信息名称不能为空', trigger: 'blur|change' }],
productIds: [{ required: true, message: '产品信息不能为空', trigger: 'blur|change' }], productIds: [{ required: true, message: '产品信息不能为空', trigger: 'blur|change' }]
}) })
const formRef = ref() // 表单 Ref const formRef = ref() // 表单 Ref
//===========================================选择产品相关操作================================= //===========================================选择产品相关操作=================================
const productListRef = ref<InstanceType<typeof productTable> | null>(null); // 产品列表 Ref const productListRef = ref<InstanceType<typeof productTable> | null>(null) // 产品列表 Ref
// 打开二级产品列表弹窗 // 打开二级产品列表弹窗
const openProduct=()=>{ const openProduct = () => {
productListRef.value?.open(); // 调用子组件暴露的方法 if (formData.value.productNames) {
return
}
productListRef.value?.open() // 调用子组件暴露的方法
} }
const handleUpdateProduct = (ids: string,names: string) => { const handleUpdateProduct = (ids: string, names: string) => {
//存入表单 //存入表单
formData.value.productIds = ids; formData.value.productIds = ids
formData.value.productNames = names; formData.value.productNames = names
formRef.value?.validateField('productNames') formRef.value?.validateField('productNames')
}; }
//===========================================地图相关操作================================= //===========================================地图相关操作=================================
const mapPickerRef = ref() const mapPickerRef = ref()
...@@ -209,31 +225,33 @@ const handleLocation = ({ lat, lng, address }) => { ...@@ -209,31 +225,33 @@ const handleLocation = ({ lat, lng, address }) => {
lat: lat, lat: lat,
lng: lng lng: lng
} }
homesApi.getMapGeocoder(params).then(res => { homesApi
console.log('逆地址解析结果:', res) .getMapGeocoder(params)
if (res.status === 0) { .then((res) => {
const comp = res.result.address_component console.log('逆地址解析结果:', res)
// 赋值到 formData if (res.status === 0) {
formData.value.provinceName = comp.province || '' const comp = res.result.address_component
formData.value.cityName = comp.city || '' // 赋值到 formData
formData.value.areaName = comp.district || '' formData.value.provinceName = comp.province || ''
formData.value.regionFullName = comp.province + comp.city + comp.district formData.value.cityName = comp.city || ''
const province = formData.value.provinceName ?? '' formData.value.areaName = comp.district || ''
let city = formData.value.cityName ?? '' formData.value.regionFullName = comp.province + comp.city + comp.district
const area = formData.value.areaName ?? '' const province = formData.value.provinceName ?? ''
//将省市区修改格式赋值给selectedOptions let city = formData.value.cityName ?? ''
if(province.match(/(北京|上海|天津|重庆)/)){ const area = formData.value.areaName ?? ''
city = '市辖区' //将省市区修改格式赋值给selectedOptions
if (province.match(/(北京|上海|天津|重庆)/)) {
city = '市辖区'
}
selectedOptions.value = [province, city, area] //专门回显用的
formRef.value?.validateField('regionFullName')
} else {
console.warn('逆地址解析失败:', res.data.message)
} }
selectedOptions.value = [province, city, area]//专门回显用的 })
formRef.value?.validateField('regionFullName') .catch((err) => {
} else { console.log(err)
console.warn('逆地址解析失败:', res.data.message) })
}
}).catch(err => {
console.log(err)
})
} }
/** 打开弹窗 */ /** 打开弹窗 */
const open = async (type: string, id?: number) => { const open = async (type: string, id?: number) => {
...@@ -245,8 +263,8 @@ const open = async (type: string, id?: number) => { ...@@ -245,8 +263,8 @@ const open = async (type: string, id?: number) => {
if (id) { if (id) {
formLoading.value = true formLoading.value = true
try { try {
formData.value = await CustomerInfoApi.getCustomerInfo(id)//进入页面根据id获取数据 formData.value = await CustomerInfoApi.getCustomerInfo(id) //进入页面根据id获取数据
restoreSelectedOptionsFromForm(); restoreSelectedOptionsFromForm()
} finally { } finally {
formLoading.value = false formLoading.value = false
} }
...@@ -258,7 +276,7 @@ function restoreSelectedOptionsFromForm() { ...@@ -258,7 +276,7 @@ function restoreSelectedOptionsFromForm() {
let city = formData.value.cityName ?? '' let city = formData.value.cityName ?? ''
const area = formData.value.areaName ?? '' const area = formData.value.areaName ?? ''
//如果是直辖市，cityName要重新赋值为市辖区，否则无法回显 //如果是直辖市，cityName要重新赋值为市辖区，否则无法回显
if(province.match(/(北京|上海|天津|重庆)/)){ if (province.match(/(北京|上海|天津|重庆)/)) {
city = '市辖区' city = '市辖区'
} }
selectedOptions.value = [province, city, area] selectedOptions.value = [province, city, area]
...@@ -273,7 +291,7 @@ const handleChange = (value: string[]) => { ...@@ -273,7 +291,7 @@ const handleChange = (value: string[]) => {
formData.value.areaName = area formData.value.areaName = area
formData.value.regionFullName = province + city + area formData.value.regionFullName = province + city + area
//直辖市需要将city赋值为province一样的值 //直辖市需要将city赋值为province一样的值
if(province.match(/(北京|上海|天津|重庆)/)){ if (province.match(/(北京|上海|天津|重庆)/)) {
formData.value.cityName = province formData.value.cityName = province
formData.value.regionFullName = province + province + area formData.value.regionFullName = province + province + area
} }
...@@ -323,10 +341,9 @@ const resetForm = () => { ...@@ -323,10 +341,9 @@ const resetForm = () => {
locationImage: undefined, locationImage: undefined,
productIds: undefined, productIds: undefined,
productNames: undefined, productNames: undefined,
department: undefined, department: undefined
} }
formRef.value?.resetFields() formRef.value?.resetFields()
selectedOptions.value = []; selectedOptions.value = []
} }
</script> </script>
yudao-ui/yudao-ui-admin-vue3/src/views/visit/info/InfoForm.vue
View file @ 3d0ac2cb
...@@ -33,13 +33,20 @@ ...@@ -33,13 +33,20 @@
@change="handleChange" @change="handleChange"
/> />
</el-form-item> </el-form-item>
<!-- <el-form-item label="详细地址" prop="locationText">
<el-input v-model="formData.locationText" placeholder="请点击右侧选择" readonly>
<template #append v-if="formType !== 'detail'">
<el-link type="primary" @click="openMapPicker">选择地址</el-link>
</template>
</el-input>
</el-form-item> -->
<el-form-item label="详细地址" prop="locationText"> <el-form-item label="详细地址" prop="locationText">
<el-input <el-input
v-model="formData.locationText" v-model="formData.locationText"
placeholder="请点击右侧选择" placeholder="点击右侧选择地址后可进行编辑"
readonly :readonly="formType === 'detail' || !formData.locationText"
> >
<template #append v-if="formType !== 'detail'" > <template #append v-if="formType !== 'detail'">
<el-link type="primary" @click="openMapPicker">选择地址</el-link> <el-link type="primary" @click="openMapPicker">选择地址</el-link>
</template> </template>
</el-input> </el-input>
...@@ -74,12 +81,8 @@ ...@@ -74,12 +81,8 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="拜访品种" prop="visitProductNames"> <el-form-item label="拜访品种" prop="visitProductNames">
<el-input <el-input v-model="formData.visitProductNames" placeholder="请点击右侧选择" readonly>
v-model="formData.visitProductNames" <template #append v-if="formType !== 'detail'">
placeholder="请点击右侧选择"
readonly
>
<template #append v-if="formType !== 'detail'" >
<el-link type="primary" @click="openProduct">选择产品</el-link> <el-link type="primary" @click="openProduct">选择产品</el-link>
</template> </template>
</el-input> </el-input>
...@@ -125,30 +128,46 @@ ...@@ -125,30 +128,46 @@
/> />
</el-form-item> </el-form-item>
<el-form-item label="服务记录图片" prop="serviceImages"> <el-form-item label="服务记录图片" prop="serviceImages">
<UploadImgs :class="{hide_box: isDetail}" v-model="formData.serviceImages" :limit="9" @change="onServiceImageChange" :disabled="isDetail" /> <UploadImgs
:class="{ hide_box: isDetail }"
v-model="formData.serviceImages"
:limit="9"
@change="onServiceImageChange"
:disabled="isDetail"
/>
</el-form-item> </el-form-item>
</el-form> </el-form>
<template #footer> <template #footer>
<el-button @click="submitForm" type="primary" :disabled="formLoading" v-if="formType !== 'detail'" >确 定</el-button> <el-button
@click="submitForm"
type="primary"
:disabled="formLoading"
v-if="formType !== 'detail'"
>确 定</el-button
>
<el-button @click="dialogVisible = false">取 消</el-button> <el-button @click="dialogVisible = false">取 消</el-button>
</template> </template>
</Dialog> </Dialog>
<productTable ref="productListRef" @updateProduct="handleUpdateProduct" :ids="formData.visitProductIds"/> <productTable
ref="productListRef"
@update-product="handleUpdateProduct"
:ids="formData.visitProductIds"
/>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import {DICT_TYPE, getIntDictOptions, getStrDictOptions} from '@/utils/dict' import { DICT_TYPE, getIntDictOptions, getStrDictOptions } from '@/utils/dict'
import {InfoApi, InfoVO} from '@/api/visit/info' import { InfoApi, InfoVO } from '@/api/visit/info'
import {CustomerInfoApi} from '@/api/visit/customerinfo' import { CustomerInfoApi } from '@/api/visit/customerinfo'
import productTable from "@/views/visit/customerinfo/productTable.vue"; import productTable from '@/views/visit/customerinfo/productTable.vue'
import {pcaTextArr} from 'element-china-area-data' import { pcaTextArr } from 'element-china-area-data'
import MapPicker from '../util/MapPicker.vue' import MapPicker from '../util/MapPicker.vue'
import {onMounted} from 'vue' import { onMounted } from 'vue'
import {homesApi} from "@/api/visit/home"; import { homesApi } from '@/api/visit/home'
/** 客户拜访记录 表单 */ /** 客户拜访记录 表单 */
defineOptions({ name: 'InfoForm' }) defineOptions({ name: 'InfoForm' })
const upload_btn = ref(true)//定义图片上传展示隐藏 const upload_btn = ref(true) //定义图片上传展示隐藏
const { t } = useI18n() // 国际化 const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗 const message = useMessage() // 消息弹窗
...@@ -158,7 +177,7 @@ const dialogTitle = ref('') // 弹窗的标题 ...@@ -158,7 +177,7 @@ const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用 const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formType = ref('') // 表单的类型：create - 新增；update - 修改；detail - 查看 const formType = ref('') // 表单的类型：create - 新增；update - 修改；detail - 查看
const selectedOptions = ref<string[]>([]) const selectedOptions = ref<string[]>([])
const isDetail = computed(() => formType.value === 'detail')//detail说明是查看详情,要只读 const isDetail = computed(() => formType.value === 'detail') //detail说明是查看详情,要只读
const formData = ref({ const formData = ref({
id: undefined, id: undefined,
customerName: undefined, customerName: undefined,
...@@ -181,7 +200,7 @@ const formData = ref({ ...@@ -181,7 +200,7 @@ const formData = ref({
visitType: undefined, visitType: undefined,
serviceContent: undefined, serviceContent: undefined,
customerFeedback: undefined, customerFeedback: undefined,
serviceImages: [], serviceImages: []
}) })
const formRules = reactive({ const formRules = reactive({
companyName: [{ required: true, message: '客户公司名称不能为空', trigger: 'blur|change' }], companyName: [{ required: true, message: '客户公司名称不能为空', trigger: 'blur|change' }],
...@@ -198,10 +217,16 @@ const formRules = reactive({ ...@@ -198,10 +217,16 @@ const formRules = reactive({
department: [{ required: true, message: '客户部门不能为空', trigger: 'change' }], department: [{ required: true, message: '客户部门不能为空', trigger: 'change' }],
visitMethod: [{ required: true, message: '拜访方式不能为空', trigger: 'change' }], visitMethod: [{ required: true, message: '拜访方式不能为空', trigger: 'change' }],
visitType: [{ required: true, message: '拜访类型不能为空', trigger: 'change' }], visitType: [{ required: true, message: '拜访类型不能为空', trigger: 'change' }],
visitProductNames: [{ required: true, message: '拜访品种名称不能为空', trigger: 'blur|change' }], visitProductNames: [{ required: true, message: '拜访品种名称不能为空', trigger: 'blur|change' }],
visitProductIds: [{ required: true, message: '拜访品种不能为空', trigger: 'blur|change' }], visitProductIds: [{ required: true, message: '拜访品种不能为空', trigger: 'blur|change' }],
serviceContent: [{ required: true, message: '请输入服务内容', trigger: 'blur' }, { max: 500, message: '最多输入 500 个字符', trigger: 'blur' }], serviceContent: [
customerFeedback: [{ required: true, message: '请输入客户反馈', trigger: 'blur' }, { max: 500, message: '最多输入 500 个字符', trigger: 'blur' }], { required: true, message: '请输入服务内容', trigger: 'blur' },
{ max: 500, message: '最多输入 500 个字符', trigger: 'blur' }
],
customerFeedback: [
{ required: true, message: '请输入客户反馈', trigger: 'blur' },
{ max: 500, message: '最多输入 500 个字符', trigger: 'blur' }
],
serviceImages: [{ required: true, message: '请上传服务记录图片', trigger: 'blur|change' }] serviceImages: [{ required: true, message: '请上传服务记录图片', trigger: 'blur|change' }]
}) })
const formRef = ref() // 表单 Ref const formRef = ref() // 表单 Ref
...@@ -222,9 +247,7 @@ const querySearch = (queryString: string, cb: any) => { ...@@ -222,9 +247,7 @@ const querySearch = (queryString: string, cb: any) => {
} }
const createFilter = (queryString: string) => { const createFilter = (queryString: string) => {
return (restaurant: RestaurantItem) => { return (restaurant: RestaurantItem) => {
return ( return restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0
restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0
)
} }
} }
const loadAll = async () => { const loadAll = async () => {
...@@ -237,7 +260,7 @@ const loadAll = async () => { ...@@ -237,7 +260,7 @@ const loadAll = async () => {
return return
} }
restaurants.value = res.map(item => ({ restaurants.value = res.map((item) => ({
value: item?.companyName || '', value: item?.companyName || '',
companyName: item?.companyName || '', companyName: item?.companyName || '',
contact: item?.contact || '', contact: item?.contact || '',
...@@ -250,8 +273,8 @@ const loadAll = async () => { ...@@ -250,8 +273,8 @@ const loadAll = async () => {
longitude: item?.longitude || '', longitude: item?.longitude || '',
latitude: item?.latitude || '', latitude: item?.latitude || '',
locationImage: item?.locationImage || '', locationImage: item?.locationImage || '',
customerStatus: item?.customerType??'', customerStatus: item?.customerType ?? '',
department: item?.department || '', department: item?.department || ''
})) }))
} catch (error) { } catch (error) {
console.error('加载公司信息失败:', error) console.error('加载公司信息失败:', error)
...@@ -261,20 +284,20 @@ const loadAll = async () => { ...@@ -261,20 +284,20 @@ const loadAll = async () => {
/** 选中后自动带出公司名称和联系方式 */ /** 选中后自动带出公司名称和联系方式 */
const handleSelect = (item: Record<string, any>) => { const handleSelect = (item: Record<string, any>) => {
formData.value.companyName = item.companyName; formData.value.companyName = item.companyName
formData.value.contact = item.contact; formData.value.contact = item.contact
formData.value.customerName = item.customerName; formData.value.customerName = item.customerName
formData.value.regionFullName = item.regionFullName; formData.value.regionFullName = item.regionFullName
formData.value.provinceName = item.provinceName; formData.value.provinceName = item.provinceName
formData.value.cityName = item.cityName; formData.value.cityName = item.cityName
formData.value.areaName = item.areaName; formData.value.areaName = item.areaName
formData.value.locationText = item.locationText; formData.value.locationText = item.locationText
formData.value.longitude = item.longitude; formData.value.longitude = item.longitude
formData.value.latitude = item.latitude; formData.value.latitude = item.latitude
formData.value.locationImage = item.locationImage; formData.value.locationImage = item.locationImage
formData.value.customerStatus = item.customerStatus; formData.value.customerStatus = item.customerStatus
formData.value.department = item.department; formData.value.department = item.department
restoreSelectedOptionsFromForm(); restoreSelectedOptionsFromForm()
formRef.value?.validateField('companyName') formRef.value?.validateField('companyName')
formRef.value?.validateField('regionFullName') formRef.value?.validateField('regionFullName')
formRef.value?.validateField('locationText') formRef.value?.validateField('locationText')
...@@ -282,20 +305,20 @@ const handleSelect = (item: Record<string, any>) => { ...@@ -282,20 +305,20 @@ const handleSelect = (item: Record<string, any>) => {
formRef.value?.validateField('department') formRef.value?.validateField('department')
} }
//===========================================选择产品相关操作================================= //===========================================选择产品相关操作=================================
const productListRef = ref<InstanceType<typeof productTable> | null>(null); // 产品列表 Ref const productListRef = ref<InstanceType<typeof productTable> | null>(null) // 产品列表 Ref
// 打开二级产品列表弹窗 // 打开二级产品列表弹窗
const openProduct=()=>{ const openProduct = () => {
productListRef.value?.open(); // 调用子组件暴露的方法 productListRef.value?.open() // 调用子组件暴露的方法
} }
const handleUpdateProduct = (ids: string,names: string) => { const handleUpdateProduct = (ids: string, names: string) => {
//存入表单 //存入表单
formData.value.visitProductIds = ids; formData.value.visitProductIds = ids
console.log(names) console.log(names)
formData.value.visitProductNames = names; formData.value.visitProductNames = names
formRef.value?.validateField('visitProductNames') formRef.value?.validateField('visitProductNames')
}; }
//===========================================地图相关操作================================= //===========================================地图相关操作=================================
const mapPickerRef = ref() const mapPickerRef = ref()
...@@ -319,31 +342,33 @@ const handleLocation = ({ lat, lng, address }) => { ...@@ -319,31 +342,33 @@ const handleLocation = ({ lat, lng, address }) => {
lat: lat, lat: lat,
lng: lng lng: lng
} }
homesApi.getMapGeocoder(params).then(res => { homesApi
console.log('逆地址解析结果:', res) .getMapGeocoder(params)
if (res.status === 0) { .then((res) => {
const comp = res.result.address_component console.log('逆地址解析结果:', res)
// 赋值到 formData if (res.status === 0) {
formData.value.provinceName = comp.province || '' const comp = res.result.address_component
formData.value.cityName = comp.city || '' // 赋值到 formData
formData.value.areaName = comp.district || '' formData.value.provinceName = comp.province || ''
formData.value.regionFullName = comp.province + comp.city + comp.district formData.value.cityName = comp.city || ''
const province = formData.value.provinceName ?? '' formData.value.areaName = comp.district || ''
let city = formData.value.cityName ?? '' formData.value.regionFullName = comp.province + comp.city + comp.district
const area = formData.value.areaName ?? '' const province = formData.value.provinceName ?? ''
//将省市区修改格式赋值给selectedOptions let city = formData.value.cityName ?? ''
if(province.match(/(北京|上海|天津|重庆)/)){ const area = formData.value.areaName ?? ''
city = '市辖区' //将省市区修改格式赋值给selectedOptions
if (province.match(/(北京|上海|天津|重庆)/)) {
city = '市辖区'
}
selectedOptions.value = [province, city, area] //专门回显用的
formRef.value?.validateField('regionFullName')
} else {
console.warn('逆地址解析失败:', res.data.message)
} }
selectedOptions.value = [province, city, area]//专门回显用的 })
formRef.value?.validateField('regionFullName') .catch((err) => {
} else { console.log(err)
console.warn('逆地址解析失败:', res.data.message) })
}
}).catch(err => {
console.log(err)
})
} }
/** 打开弹窗 */ /** 打开弹窗 */
...@@ -357,7 +382,7 @@ const open = async (type: string, id?: number) => { ...@@ -357,7 +382,7 @@ const open = async (type: string, id?: number) => {
formLoading.value = true formLoading.value = true
try { try {
formData.value = await InfoApi.getInfo(id) formData.value = await InfoApi.getInfo(id)
restoreSelectedOptionsFromForm(); restoreSelectedOptionsFromForm()
//将图片url数组从字符串转为数组 //将图片url数组从字符串转为数组
formData.value.serviceImages = formData.value.serviceImages.split(',') formData.value.serviceImages = formData.value.serviceImages.split(',')
console.log(formData.value.serviceImages) console.log(formData.value.serviceImages)
...@@ -367,13 +392,12 @@ const open = async (type: string, id?: number) => { ...@@ -367,13 +392,12 @@ const open = async (type: string, id?: number) => {
} }
} }
function restoreSelectedOptionsFromForm() { function restoreSelectedOptionsFromForm() {
const province = formData.value.provinceName ?? '' const province = formData.value.provinceName ?? ''
let city = formData.value.cityName ?? '' let city = formData.value.cityName ?? ''
const area = formData.value.areaName ?? '' const area = formData.value.areaName ?? ''
//如果是直辖市，cityName要重新赋值为市辖区，否则无法回显 //如果是直辖市，cityName要重新赋值为市辖区，否则无法回显
if(province.match(/(北京|上海|天津|重庆)/)){ if (province.match(/(北京|上海|天津|重庆)/)) {
city = '市辖区' city = '市辖区'
} }
selectedOptions.value = [province, city, area] selectedOptions.value = [province, city, area]
...@@ -388,7 +412,7 @@ const handleChange = (value: string[]) => { ...@@ -388,7 +412,7 @@ const handleChange = (value: string[]) => {
formData.value.areaName = area formData.value.areaName = area
formData.value.regionFullName = province + city + area formData.value.regionFullName = province + city + area
//直辖市需要将city赋值为province一样的值 //直辖市需要将city赋值为province一样的值
if(province.match(/(北京|上海|天津|重庆)/)){ if (province.match(/(北京|上海|天津|重庆)/)) {
formData.value.cityName = province formData.value.cityName = province
formData.value.regionFullName = province + province + area formData.value.regionFullName = province + province + area
} }
...@@ -403,9 +427,9 @@ const submitForm = async () => { ...@@ -403,9 +427,9 @@ const submitForm = async () => {
// 校验表单 // 校验表单
await formRef.value.validate() await formRef.value.validate()
//将图片url数组从数组变为string字符串 //将图片url数组从数组变为string字符串
const raw = formData.value; const raw = formData.value
if (Array.isArray(raw.serviceImages)) { if (Array.isArray(raw.serviceImages)) {
raw.serviceImages = raw.serviceImages.join(','); raw.serviceImages = raw.serviceImages.join(',')
} }
// 提交请求 // 提交请求
formLoading.value = true formLoading.value = true
...@@ -453,7 +477,7 @@ const resetForm = () => { ...@@ -453,7 +477,7 @@ const resetForm = () => {
serviceImages: [] serviceImages: []
} }
formRef.value?.resetFields() formRef.value?.resetFields()
selectedOptions.value = []; selectedOptions.value = []
} }
const onServiceImageChange = () => { const onServiceImageChange = () => {
// 强制触发校验 // 强制触发校验
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment