diff --git a/changelogs/2026-05/12_frontend_bug_admin_mappicker-citylimit-blocks-cross-city-search.md b/changelogs/2026-05/12_frontend_bug_admin_mappicker-citylimit-blocks-cross-city-search.md new file mode 100644 index 0000000..f7acd08 --- /dev/null +++ b/changelogs/2026-05/12_frontend_bug_admin_mappicker-citylimit-blocks-cross-city-search.md @@ -0,0 +1,113 @@ +--- +date: 2026-05-12 +type: frontend-bug +module: admin-map-picker +priority: high +notify: ["@mmg"] +status: pending +--- + +# 地图选点搜不到「阿尔山白狼峰景区」等异地地名 — citylimit 锁死了搜索范围 + +## 现象 + +管理后台资源管理(景区/酒店/活动/餐厅/服务)的「地图选点」弹框,搜索框输入 `阿尔山白狼峰景区` 没任何结果;但手机端高德地图 App 能正常搜到(白狼镇 203 省道,距海拉尔 244 公里)。 + +复现路径:资源管理 → 任一资源新建/编辑 → 点地图图标 → 搜索框输 `阿尔山白狼峰景区` → 下拉列表空,回车后 toast 提示「在呼伦贝尔未找到相关地点」。 + +## 根因(纯前端,后端无关) + +文件:`hl-ui/src/components/MapPicker.vue` + +```js +// 第 360-364 行 (AutoComplete - 输入自动补全) +const autoComplete = new window.AMap.AutoComplete({ + city: city, + citylimit: true, // ❌ 强制只搜当前城市 + datatype: 'all', +}) + +// 第 425-431 行 (PlaceSearch - 回车精确搜索) +const placeSearch = new window.AMap.PlaceSearch({ + pageSize: 20, + pageIndex: 1, + city: city, + citylimit: true, // ❌ 强制只搜当前城市 + extensions: 'base', +}) + +// 第 444-448 行 (PlaceSearch 结果二次过滤) +const cityName = city.replace(/市$/, '') +const filteredPois = pois.filter((poi) => { + const poiCity = poi.cityname || poi.pname || '' + return poiCity.includes(cityName) || cityName.includes(poiCity.replace(/市$/, '')) +}) // ❌ 即使高德返回了,前端再剔一次 +``` + +`currentCity` 在打开弹框时默认是「呼伦贝尔」(默认坐标 119.7581, 49.2112 落在海拉尔区),阿尔山白狼峰景区行政归属「**兴安盟阿尔山市**」,跟呼伦贝尔市平级,所以: + +1. 高德 AutoComplete/PlaceSearch 因 `citylimit:true` 直接返回 0 条 +2. 万一返回了也会被前端 `filteredPois` 二次过滤剔掉 +3. 用户得到「在呼伦贝尔未找到」的错觉,实际全国都没搜 + +## 业务背景 + +呼籁旅行的景点/酒店/活动资源**会跨内蒙古多个盟市,甚至跨省**(用户已确认场景:阿尔山在兴安盟,业务里就是要录)。硬把搜索锁在当前定位城市违反业务需求。手机端高德 App 不锁城市能搜到,后台同一份数据库却搜不到,体验割裂。 + +## 修复(前端,3 处改动) + +### 改法 A(推荐,最小改动) — 去掉 citylimit + 去掉二次过滤 + +```js +// AutoComplete +const autoComplete = new window.AMap.AutoComplete({ + // city: city, // 删掉或保留(只作提示,不约束) + // citylimit: true, // ❌ 删 + datatype: 'all', +}) + +// PlaceSearch +const placeSearch = new window.AMap.PlaceSearch({ + pageSize: 20, + pageIndex: 1, + // city: city, // 删掉或保留(只作排序加权) + // citylimit: true, // ❌ 删 + extensions: 'base', +}) + +// 删掉 filteredPois 二次过滤逻辑,直接用 pois.map(...) +``` + +`city` 参数即使保留也只影响**结果排序**(同城靠前),不会过滤异地结果 — 这是高德 SDK 默认行为。 + +### 改法 B(更友好) — 给 POI 下拉列表多显示一行省市 + +去掉 citylimit 后,搜索"白狼峰"可能返回多地同名结果。建议下拉项展示加一行 `pname + cityname + adname`,让用户区分: + +```vue +