@heycar/heycars-map 0.9.19 → 0.9.20-querying2

package/README.md

@@ -59,6 +59,13 @@ export interface RecommendZonePlaces {
   zone?: Zone;
   places?: Place[];
 }
+
+export enum CenterPlaceStatus {
+  GEO_LOADING = "GEO_LOADING",
+  QUERYING_INFO = "QUERYING_INFO",
+  SERVICE_UNAVAILABLE = "SERVICE_UNAVAILABLE",
+  OK = "OK",
+}
 ```
 
 #### 在 入口文件添加 `MapProvider`
@@ -177,6 +184,8 @@ export default defineComponent({
         geoErrorOnceNotificationKey="BusinessRecomendPlaceMap"
         geoErrorOnceNotificationInterval={10 * 60 * 1000}
         unavailableTitle={"当前区域暂未开通服务"}
+        emptyTitle={"当前位置"}
+        queryingTitle={"正在获取地址信息"}
         recomendDescription={"您将在此处上车"}
         geoDefaultPosition={[139.777777, 35.777777]}
         mapContext={mapContext}
@@ -299,6 +308,8 @@ export default defineComponent({
       <BusinessReselectPlaceMap
         class={"demo"}
         unavailableTitle={"当前区域暂未开通服务"}
+        emptyTitle={"当前位置"}
+        queryingTitle={"正在获取地址信息"}
         recomendDescription={"您将在此处上车"}
         // 对于同一个 geoErrorOnceNotificationKey
         // geoErrorOnce 事件在 geoErrorOnceNotificationInterval 时间间隔内全局只会触发一次

package/dist/index.cjs

@@ -18,8 +18,152 @@ if (typeof GeolocationPositionError === "undefined") {
     TIMEOUT: 3
   };
 }
+var BRWOSER_PLATFORM = /* @__PURE__ */ ((BRWOSER_PLATFORM2) => {
+  BRWOSER_PLATFORM2["WECHAT"] = "WECHAT";
+  BRWOSER_PLATFORM2["WECHAT_MINIPROGRAM"] = "WECHAT_MINIPROGRAM";
+  BRWOSER_PLATFORM2["ALIPAY"] = "ALIPAY";
+  BRWOSER_PLATFORM2["ALIPAY_MINIPROGRAM"] = "ALIPAY_MINIPROGRAM";
+  BRWOSER_PLATFORM2["H5"] = "H5";
+  BRWOSER_PLATFORM2["NODE_JS"] = "NODE_JS";
+  return BRWOSER_PLATFORM2;
+})(BRWOSER_PLATFORM || {});
+var OS_PLATFORM = /* @__PURE__ */ ((OS_PLATFORM2) => {
+  OS_PLATFORM2["IOS"] = "IOS";
+  OS_PLATFORM2["ANDROID"] = "ANDROID";
+  OS_PLATFORM2["OTHER"] = "OTHER";
+  return OS_PLATFORM2;
+})(OS_PLATFORM || {});
+var WEBGL_STATUS = /* @__PURE__ */ ((WEBGL_STATUS2) => {
+  WEBGL_STATUS2["NOT_SUPPORTED"] = "NOT_SUPPORTED";
+  WEBGL_STATUS2["DISABLED"] = "DISABLED";
+  WEBGL_STATUS2["ENABLED"] = "ENABLED";
+  return WEBGL_STATUS2;
+})(WEBGL_STATUS || {});
+var ALIPAY_WALLET = /* @__PURE__ */ ((ALIPAY_WALLET2) => {
+  ALIPAY_WALLET2["TNGD"] = "TNGD";
+  ALIPAY_WALLET2["TMN"] = "TMN";
+  return ALIPAY_WALLET2;
+})(ALIPAY_WALLET || {});
+const detectAlipayWallet = () => {
+  if (!navigator)
+    return void 0;
+  const useragent = navigator.userAgent.toLowerCase();
+  if (!useragent.includes("alipay"))
+    return void 0;
+  if (useragent.includes("tngkit"))
+    return "TNGD";
+  if (useragent.includes("truemoney"))
+    return "TMN";
+};
+const detectBrowserPlatform = () => {
+  if (typeof navigator === "undefined")
+    return "NODE_JS";
+  const useragent = navigator.userAgent.toLowerCase();
+  if (useragent.includes("micromessenger")) {
+    return useragent.includes("miniprogram") ? "WECHAT_MINIPROGRAM" : "WECHAT";
+  }
+  if (useragent.includes("alipay")) {
+    return useragent.includes("miniprogram") ? "ALIPAY_MINIPROGRAM" : "ALIPAY";
+  }
+  return "H5";
+};
+const detectOSPlatform = () => {
+  if (typeof navigator === "undefined")
+    return "OTHER";
+  const userAgent = navigator.userAgent || navigator.vendor;
+  if (/android/i.test(userAgent)) {
+    return "ANDROID";
+  }
+  if (/iPad|iPhone|iPod/.test(userAgent) && !globalThis.MSStream) {
+    return "IOS";
+  }
+  return "OTHER";
+};
+function detectWebGL() {
+  if (typeof window === "undefined")
+    return "NOT_SUPPORTED";
+  if (window.WebGLRenderingContext) {
+    const canvas = document.createElement("canvas");
+    const names = ["webgl", "experimental-webgl", "moz-webgl", "webkit-3d"];
+    let context2 = null;
+    for (const name2 of names) {
+      try {
+        context2 = canvas.getContext(name2);
+        if (context2 && typeof context2.getParameter === "function") {
+          return "ENABLED";
+        }
+      } catch (e) {
+        console.error("MyError: detectWebGL catch e = ", e);
+        return "NOT_SUPPORTED";
+      }
+    }
+    return "DISABLED";
+  }
+  return "NOT_SUPPORTED";
+}
+const createMockWx = (opt) => {
+  const { timeout, lng, lat, status } = opt.getLocation;
+  const mockWx = {
+    ready(callback) {
+      callback();
+    },
+    error(callback) {
+      callback({ errCode: "mock error code", errMsg: "mock error message" });
+    },
+    getLocation(props) {
+      const { success, fail } = props;
+      if (status === "success") {
+        setTimeout(() => {
+          success({
+            longitude: String(lng),
+            latitude: String(lat),
+            accuracy: "30",
+            speed: "0",
+            errCode: "",
+            errMsg: ""
+          });
+        }, timeout);
+      }
+      if (status === "fail") {
+        setTimeout(() => {
+          fail == null ? void 0 : fail({ errCode: "mock error code", errMsg: "mock error message" });
+        }, timeout);
+      }
+    },
+    config() {
+      return;
+    },
+    miniProgram: {
+      redirectTo() {
+        return;
+      },
+      getEnv() {
+        const miniprogram = detectBrowserPlatform() === BRWOSER_PLATFORM.WECHAT_MINIPROGRAM;
+        return { miniprogram };
+      }
+    }
+  };
+  return mockWx;
+};
+const mockWxByUrl = () => {
+  const searchParams = new URLSearchParams(location.search);
+  const enable = searchParams.has("enableMockWx");
+  if (!enable)
+    return;
+  const lng = Number(searchParams.get("lng"));
+  const lat = Number(searchParams.get("lat"));
+  const timeout = Number(searchParams.get("timeout")) * 1e3;
+  const status = searchParams.get("status");
+  if (status !== "success" && status !== "fail" || isNaN(timeout)) {
+    console.error("MyError: createMockWxByUrl: wrong parameter from url");
+    return;
+  }
+  const mockWx = createMockWx({ getLocation: { lng, lat, timeout, status } });
+  window.wx = mockWx;
+};
+mockWxByUrl();
 const name = "@heycar/heycars-map";
-const version = "0.9.19";
+const version = "0.9.20-querying2";
 const type = "module";
 const bin = {
   checkVersion: "./bin/checkVersion.js"
@@ -1410,6 +1554,11 @@ const createRunOnce = (fn) => {
     return result;
   };
 };
+const createAsyncNoFailNonNullable = (fn, defaultValue) => {
+  return function noFailNoNullable(...args) {
+    return fn(...args).then((result) => result != null ? result : defaultValue).catch(() => defaultValue);
+  };
+};
 const MAX_ANIMATION_DISTANCE_VW = 300;
 const MIN_ANIMATION_DURATION = 300;
 const ANIMATION_DURATION_FOR_100VW = 200;
@@ -1428,89 +1577,6 @@ const ZINDEX_GREEN_ZONE = 10;
 const TRACKS_MATCH_MAX_LENGTH = 3;
 const IS_ENABLE_AUXILIARY_GRASP_ROAD = location.search.includes("enableAuxiliaryGraspRoad");
 const AMAP_DEFAULT_MARKER_ICON_URL = "https://webapi.amap.com/theme/v1.3/markers/b/mark_bs.png";
-var BRWOSER_PLATFORM = /* @__PURE__ */ ((BRWOSER_PLATFORM2) => {
-  BRWOSER_PLATFORM2["WECHAT"] = "WECHAT";
-  BRWOSER_PLATFORM2["WECHAT_MINIPROGRAM"] = "WECHAT_MINIPROGRAM";
-  BRWOSER_PLATFORM2["ALIPAY"] = "ALIPAY";
-  BRWOSER_PLATFORM2["ALIPAY_MINIPROGRAM"] = "ALIPAY_MINIPROGRAM";
-  BRWOSER_PLATFORM2["H5"] = "H5";
-  BRWOSER_PLATFORM2["NODE_JS"] = "NODE_JS";
-  return BRWOSER_PLATFORM2;
-})(BRWOSER_PLATFORM || {});
-var OS_PLATFORM = /* @__PURE__ */ ((OS_PLATFORM2) => {
-  OS_PLATFORM2["IOS"] = "IOS";
-  OS_PLATFORM2["ANDROID"] = "ANDROID";
-  OS_PLATFORM2["OTHER"] = "OTHER";
-  return OS_PLATFORM2;
-})(OS_PLATFORM || {});
-var WEBGL_STATUS = /* @__PURE__ */ ((WEBGL_STATUS2) => {
-  WEBGL_STATUS2["NOT_SUPPORTED"] = "NOT_SUPPORTED";
-  WEBGL_STATUS2["DISABLED"] = "DISABLED";
-  WEBGL_STATUS2["ENABLED"] = "ENABLED";
-  return WEBGL_STATUS2;
-})(WEBGL_STATUS || {});
-var ALIPAY_WALLET = /* @__PURE__ */ ((ALIPAY_WALLET2) => {
-  ALIPAY_WALLET2["TNGD"] = "TNGD";
-  ALIPAY_WALLET2["TMN"] = "TMN";
-  return ALIPAY_WALLET2;
-})(ALIPAY_WALLET || {});
-const detectAlipayWallet = () => {
-  if (!navigator)
-    return void 0;
-  const useragent = navigator.userAgent.toLowerCase();
-  if (!useragent.includes("alipay"))
-    return void 0;
-  if (useragent.includes("tngkit"))
-    return "TNGD";
-  if (useragent.includes("truemoney"))
-    return "TMN";
-};
-const detectBrowserPlatform = () => {
-  if (typeof navigator === "undefined")
-    return "NODE_JS";
-  const useragent = navigator.userAgent.toLowerCase();
-  if (useragent.includes("micromessenger")) {
-    return useragent.includes("miniprogram") ? "WECHAT_MINIPROGRAM" : "WECHAT";
-  }
-  if (useragent.includes("alipay")) {
-    return useragent.includes("miniprogram") ? "ALIPAY_MINIPROGRAM" : "ALIPAY";
-  }
-  return "H5";
-};
-const detectOSPlatform = () => {
-  if (typeof navigator === "undefined")
-    return "OTHER";
-  const userAgent = navigator.userAgent || navigator.vendor;
-  if (/android/i.test(userAgent)) {
-    return "ANDROID";
-  }
-  if (/iPad|iPhone|iPod/.test(userAgent) && !globalThis.MSStream) {
-    return "IOS";
-  }
-  return "OTHER";
-};
-function detectWebGL() {
-  if (typeof window === "undefined")
-    return "NOT_SUPPORTED";
-  if (window.WebGLRenderingContext) {
-    const canvas = document.createElement("canvas");
-    const names = ["webgl", "experimental-webgl", "moz-webgl", "webkit-3d"];
-    let context2 = null;
-    for (const name2 of names) {
-      try {
-        context2 = canvas.getContext(name2);
-        if (context2 && typeof context2.getParameter === "function") {
-          return "ENABLED";
-        }
-      } catch (e) {
-        console.error("MyError: detectWebGL catch e = ", e);
-        return "NOT_SUPPORTED";
-      }
-    }
-    return "DISABLED";
-  }
-  return "NOT_SUPPORTED";
-}
 const vec2lnglat = ([lng, lat]) => ({
   lng: Number(lng),
   lat: Number(lat)
@@ -6615,7 +6681,7 @@ const useAmapPlace = (props) => {
     place.displayName = value.displayName;
   };
   const getPlaceByRegeo = ([lng, lat]) => {
-    return new Promise((resolve, reject) => {
+    return new Promise((resolve) => {
       const geocoder = new AMap.Geocoder({ lang: language === "en" ? "en" : "zh_cn" });
       const isChina = inChina([lng, lat]);
       geocoder.getAddress(new AMap.LngLat(lng, lat), (status, result) => {
@@ -6627,14 +6693,13 @@ const useAmapPlace = (props) => {
             resolve({ lng, lat, name: name2, displayName });
             return;
           }
-          case "no_data": {
+          case "no_data":
+          case "error": {
             const name2 = emptyPlaceName;
             const displayName = emptyPlaceName;
             resolve({ lng, lat, name: name2, displayName });
             return;
           }
-          case "error":
-            reject(result);
         }
       });
     });
@@ -6673,13 +6738,17 @@ const useGmapPlace = (props) => {
     place.displayName = value.displayName;
   };
   const getPlaceByRegeo = ([lng, lat]) => {
-    return new Promise((resolve, reject) => {
+    return new Promise((resolve) => {
       const geocoder = new google.maps.Geocoder();
       geocoder.geocode({ language, location: { lng, lat } }).then(({ results }) => {
         const name2 = results[0].formatted_address ? results[0].formatted_address : emptyPlaceName;
         const displayName = name2;
         resolve({ lng, lat, name: name2, displayName });
-      }).catch(reject);
+      }).catch(() => {
+        const name2 = emptyPlaceName;
+        const displayName = emptyPlaceName;
+        resolve({ lng, lat, name: name2, displayName });
+      });
     });
   };
   Vue.watch(
@@ -6717,14 +6786,16 @@ const useMapRecomendPlace = (props) => {
     getLimit,
     context: context2,
     emptyPlaceName,
+    queryingPlaceName,
     onChange,
+    onQueryingPlace,
     onChangePlace
   } = props;
   const availableRef = Vue.ref(true);
   const placeCandidatesRef = Vue.ref([]);
   const zoneRef = Vue.ref();
   const { apiMapIsPointInRing, apiMapDistance } = useMapGeometry();
-  const { getPlaceByRegeo } = useAmapPlace({
+  const { getPlaceByRegeo } = useMapPlace({
     emptyPlaceName,
     pointRef: Vue.ref([...defaultPoint])
   });
@@ -6740,9 +6811,10 @@ const useMapRecomendPlace = (props) => {
       (candidate) => isPointEqual(place2point(candidate), recomendPoint)
     );
   });
+  const isQueryingRef = Vue.ref(false);
+  const getRecomendPlaceNoFail = createAsyncNoFailNonNullable(getRecomendPlace, {});
   const findAttachedPlace = async (place) => {
-    var _a;
-    const inputRecommendZonePlaces = (_a = await getRecomendPlace({ ...place }, context2)) != null ? _a : {};
+    const inputRecommendZonePlaces = await getRecomendPlaceNoFail({ ...place }, context2);
     const {
       places: placeCandidates,
       zone,
@@ -6775,7 +6847,7 @@ const useMapRecomendPlace = (props) => {
     const [lng, lat] = point;
     const { shortestPlace: resultPlace } = findNearestPlace(
       { lng, lat, name: "", displayName: "" },
-      placeCandidatesRef.value,
+      prevState.candidates,
       apiMapDistance
     );
     return {
@@ -6785,7 +6857,27 @@ const useMapRecomendPlace = (props) => {
       candidates: prevState.candidates
     };
   };
+  const updateIntermediateQueryingState = (point) => {
+    const zone = zoneRef.value;
+    if (zone && apiMapIsPointInRing(point, zone.path))
+      return;
+    const [lng, lat] = point;
+    const intermediateQueryingPlace = {
+      lng,
+      lat,
+      name: queryingPlaceName,
+      displayName: queryingPlaceName
+    };
+    isQueryingRef.value = true;
+    availableRef.value = true;
+    if (zone)
+      zoneRef.value = void 0;
+    placeCandidatesRef.value = [];
+    Object.assign(recomendPlace, { ...intermediateQueryingPlace });
+    onQueryingPlace == null ? void 0 : onQueryingPlace({ ...intermediateQueryingPlace });
+  };
   const updatePlace = async (point) => {
+    updateIntermediateQueryingState(point);
     const {
       place: resultPlace,
       candidates,
@@ -6798,6 +6890,7 @@ const useMapRecomendPlace = (props) => {
       zone: zoneRef.value
     });
     const isSameZone = !!zone && isZoneEqual(zone, zoneRef.value);
+    isQueryingRef.value = false;
     availableRef.value = available;
     zoneRef.value = zone;
     placeCandidatesRef.value = candidates;
@@ -6807,14 +6900,15 @@ const useMapRecomendPlace = (props) => {
     onChange == null ? void 0 : onChange({ place: { ...resultPlace }, inputPlace, isInZone: !!zone, isSameZone });
   };
   const updatePlaceCandidates = async (place) => {
-    var _a;
-    const inputRecommendZonePlaces = (_a = await getRecomendPlace({ ...place }, context2)) != null ? _a : {};
+    updateIntermediateQueryingState(place2point(place));
+    const inputRecommendZonePlaces = await getRecomendPlaceNoFail({ ...place }, context2);
     const {
       places: placeCandidates,
       zone,
       available = false
     } = toRecommendZonePlacesType(inputRecommendZonePlaces);
     const isSameZone = !!zone && isZoneEqual(zone, zoneRef.value);
+    isQueryingRef.value = false;
     availableRef.value = !!available;
     zoneRef.value = zone;
     placeCandidatesRef.value = placeCandidates != null ? placeCandidates : [];
@@ -6826,8 +6920,10 @@ const useMapRecomendPlace = (props) => {
     };
   };
   const updateRecommendPlace = async (place) => {
+    updateIntermediateQueryingState(place2point(place));
     const { place: resultPlace, candidates, available, zone } = await findAttachedPlace(place);
     const isSameZone = !!zone && isZoneEqual(zone, zoneRef.value);
+    isQueryingRef.value = false;
     availableRef.value = available;
     zoneRef.value = zone;
     placeCandidatesRef.value = candidates;
@@ -6841,9 +6937,11 @@ const useMapRecomendPlace = (props) => {
     });
   };
   const updateRecommendPlaceOnlyInZone = async (place) => {
+    updateIntermediateQueryingState(place2point(place));
     const { place: foundPlace, candidates, available, zone } = await findAttachedPlace(place);
     const resultPlace = zone ? foundPlace : place;
     const isSameZone = !!zone && isZoneEqual(zone, zoneRef.value);
+    isQueryingRef.value = false;
     availableRef.value = available;
     zoneRef.value = zone;
     placeCandidatesRef.value = candidates;
@@ -6871,6 +6969,7 @@ const useMapRecomendPlace = (props) => {
     placeCandidates: placeCandidatesRef,
     availableRef,
     isElectedRef,
+    isQueryingRef,
     updateRecommendPlace,
     updateRecommendPlaceOnlyInZone,
     updatePlaceCandidates,
@@ -6944,6 +7043,13 @@ const useMapZoom = (props) => {
   const { supplier } = useMapSupplier();
   return supplier === "gmap" ? useGmapZoom(props) : useAmapZoom(props);
 };
+var CenterPlaceStatus = /* @__PURE__ */ ((CenterPlaceStatus2) => {
+  CenterPlaceStatus2["GEO_LOADING"] = "GEO_LOADING";
+  CenterPlaceStatus2["QUERYING_INFO"] = "QUERYING_INFO";
+  CenterPlaceStatus2["SERVICE_UNAVAILABLE"] = "SERVICE_UNAVAILABLE";
+  CenterPlaceStatus2["OK"] = "OK";
+  return CenterPlaceStatus2;
+})(CenterPlaceStatus || {});
 const AmapPolygon = defineSetup(function AmapPolygon2(props) {
   const polygonRef = Vue.shallowRef();
   const mapRef = useAmap();
@@ -7598,7 +7704,6 @@ const RECOMMEND_PLACE_ICON_ZOOM_MIN = 16.25;
 const RECOMMEND_PLACE_TEXT_ZOOM_MIN = 16.25;
 const RECOMMEND_PLACE_ZONE_ICON_MIN = 12.75;
 const RECOMMEND_PLACE_ZONE_TEXT_MIN = 21;
-const DEFAULT_PLACE_NAME = "当前位置";
 const DEFAULT_ZOOM = 17;
 const ZONE_ZOOM = 13.75;
 const BusinessRecomendPlaceMap = defineLagecySetup(function BusinessRecomendPlaceMap2(props, {
@@ -7608,6 +7713,8 @@ const BusinessRecomendPlaceMap = defineLagecySetup(function BusinessRecomendPlac
   var _a, _b;
   const {
     geoLoadingTitle,
+    emptyTitle,
+    queryingTitle,
     geoDefaultPosition,
     geoErrorOnceNotificationKey = `BusinessRecomendPlaceMap_${Date.now()}`,
     geoErrorOnceNotificationInterval = 0,
@@ -7758,10 +7865,12 @@ const BusinessRecomendPlaceMap = defineLagecySetup(function BusinessRecomendPlac
     placeCandidates,
     zoneRef,
     availableRef,
-    isElectedRef
+    isElectedRef,
+    isQueryingRef
   } = useMapRecomendPlace({
     defaultPoint: place2point(centerPlace),
-    emptyPlaceName: DEFAULT_PLACE_NAME,
+    emptyPlaceName: emptyTitle,
+    queryingPlaceName: queryingTitle,
     context: centerSource,
     getRecomendPlace: pipedGetRecomendPlace,
     getLimit: (context2) => {
@@ -7777,6 +7886,9 @@ const BusinessRecomendPlaceMap = defineLagecySetup(function BusinessRecomendPlac
           throw new Error(`MyError: should not call getLimit on source: ${source}`);
       }
     },
+    onQueryingPlace: (place) => Object.assign(centerPlace, {
+      ...place
+    }),
     onChangePlace: (place) => emit("changePlace", place),
     onChange: async ({
       place,
@@ -7808,6 +7920,11 @@ const BusinessRecomendPlaceMap = defineLagecySetup(function BusinessRecomendPlac
   Vue.watchEffect(() => {
     mapContext.onChangeRecomendPlaces([...placeCandidates.value]);
   });
+  Vue.watchEffect(() => {
+    const centerPlaceStatus = geoLoading.value ? CenterPlaceStatus.GEO_LOADING : isQueryingRef.value ? CenterPlaceStatus.QUERYING_INFO : !availableRef.value ? CenterPlaceStatus.SERVICE_UNAVAILABLE : CenterPlaceStatus.OK;
+    mapContext.centerPlaceStatusRef.value = centerPlaceStatus;
+    console.log("centerPlaceStatus = ", centerPlaceStatus);
+  });
   return () => {
     var _a2, _b2;
     const {
@@ -7860,7 +7977,7 @@ const BusinessRecomendPlaceMap = defineLagecySetup(function BusinessRecomendPlac
       }
     })]);
   };
-}).props(["log", "geoLoadingTitle", "geoErrorOnceNotificationKey", "geoErrorOnceNotificationInterval", "unavailableTitle", "recomendDescription", "disableLocator", "fallback", "geoDefaultPosition", "getRecomendPlace", "getDefaultCenterPlace", "loading", "mapContext"]);
+}).props(["log", "geoLoadingTitle", "emptyTitle", "queryingTitle", "geoErrorOnceNotificationKey", "geoErrorOnceNotificationInterval", "unavailableTitle", "recomendDescription", "disableLocator", "fallback", "geoDefaultPosition", "getRecomendPlace", "getDefaultCenterPlace", "loading", "mapContext"]);
 const emptyPlace = {
   lng: 0,
   lat: 0,
@@ -7872,6 +7989,8 @@ const BusinessReselectPlaceMap = defineLagecySetup(function BusinessReselectPlac
   slots
 }) {
   const {
+    emptyTitle,
+    queryingTitle,
     geoErrorOnceNotificationKey = `BusinessRecomendPlaceMap_${Date.now()}`,
     geoErrorOnceNotificationInterval = 0,
     getRecomendPlace,
@@ -7998,10 +8117,12 @@ const BusinessReselectPlaceMap = defineLagecySetup(function BusinessReselectPlac
     placeCandidates,
     zoneRef,
     availableRef,
-    isElectedRef
+    isElectedRef,
+    isQueryingRef
   } = useMapRecomendPlace({
     defaultPoint: place2point(centerPlace),
-    emptyPlaceName: DEFAULT_PLACE_NAME,
+    emptyPlaceName: emptyTitle,
+    queryingPlaceName: queryingTitle,
     context: centerSource,
     getRecomendPlace: pipedGetRecomendPlace,
     getLimit: (context2) => {
@@ -8017,6 +8138,9 @@ const BusinessReselectPlaceMap = defineLagecySetup(function BusinessReselectPlac
           throw new Error(`MyError: should not call getLimit on source: ${source}`);
       }
     },
+    onQueryingPlace: (place) => Object.assign(centerPlace, {
+      ...place
+    }),
     onChangePlace: (place) => emit("changePlace", place),
     onChange: async ({
       place,
@@ -8049,6 +8173,9 @@ const BusinessReselectPlaceMap = defineLagecySetup(function BusinessReselectPlac
   Vue.watchEffect(() => {
     mapContext.onChangeRecomendPlaces([...placeCandidates.value]);
   });
+  Vue.watchEffect(() => {
+    mapContext.centerPlaceStatusRef.value = isQueryingRef.value ? CenterPlaceStatus.QUERYING_INFO : !availableRef.value ? CenterPlaceStatus.SERVICE_UNAVAILABLE : CenterPlaceStatus.OK;
+  });
   return () => {
     var _a, _b;
     const {
@@ -8099,7 +8226,7 @@ const BusinessReselectPlaceMap = defineLagecySetup(function BusinessReselectPlac
       }
     })]);
   };
-}).props(["loading", "fallback", "log", "defaultPlace", "unavailableTitle", "recomendDescription", "geoErrorOnceNotificationKey", "geoErrorOnceNotificationInterval", "disableLocator", "getRecomendPlace", "mapContext"]);
+}).props(["loading", "fallback", "log", "defaultPlace", "unavailableTitle", "emptyTitle", "queryingTitle", "recomendDescription", "geoErrorOnceNotificationKey", "geoErrorOnceNotificationInterval", "disableLocator", "getRecomendPlace", "mapContext"]);
 const assertPropNoEmptyArray = (list, funcName, propName) => {
   if (list.length > 0)
     return;
@@ -10147,6 +10274,7 @@ const useBusinessRecomendPlaceMap = () => {
   });
   const placeCandidates = Vue.ref([]);
   const geoPositionRef = Vue.ref();
+  const centerPlaceStatusRef = Vue.ref(CenterPlaceStatus.GEO_LOADING);
   const { apiMapDistance } = useMapGeometry();
   const { inChina } = useMapInChina();
   const panToGeoPositionByRecomend = (value) => mapContext.panToGeoPositionByRecomend(value);
@@ -10155,6 +10283,7 @@ const useBusinessRecomendPlaceMap = () => {
   const setCenterPlaceByUserSpecifiedInZone = (value) => mapContext.setCenterPlaceByUserSpecifiedInZone(value);
   const mapContext = {
     geoPositionRef,
+    centerPlaceStatusRef,
     panToGeoPositionByRecomend: () => {
       throw new Error("MyError: panToGeoPositionByRecomend used before assigned");
     },
@@ -10179,6 +10308,7 @@ const useBusinessRecomendPlaceMap = () => {
     centerPlace,
     placeCandidates,
     geoPosition: Vue.readonly(geoPositionRef),
+    centerPlaceStatus: Vue.readonly(centerPlaceStatusRef),
     panToGeoPositionByRecomend,
     setCenterPlaceDisplayNameOnce,
     setCenterPlaceByUserSpecified,
@@ -10206,6 +10336,7 @@ exports.BusinessRecomendPlaceMap = BusinessRecomendPlaceMap;
 exports.BusinessReselectPlaceMap = BusinessReselectPlaceMap;
 exports.BusinessTaxiEndMap = BusinessTaxiEndMap;
 exports.BusinessTaxiServiceMap = BusinessTaxiServiceMap;
+exports.CenterPlaceStatus = CenterPlaceStatus;
 exports.DrivingLine = DrivingLine;
 exports.DrivingRoute = DrivingRoute;
 exports.HeycarMap = HeycarMap;