From 3d0ac2cb6cdf7114e99422d8a6134f26295cd788 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B5=B5=E4=B9=90?= <1179574483@qq.com>
Date: Wed, 11 Jun 2025 11:07:42 +0800
Subject: [PATCH] =?UTF-8?q?=E9=80=89=E6=8B=A9=E5=9C=B0=E5=9D=80=E4=BF=AE?=
 =?UTF-8?q?=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 yudao-ui/yudao-ui-admin-vue3/.env.local       |   3 +-
 .../visit/customerinfo/CustomerInfoForm.vue   | 197 ++++++++++--------
 .../src/views/visit/info/InfoForm.vue         | 192 +++++++++--------
 3 files changed, 217 insertions(+), 175 deletions(-)

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