@heycar/heycars-map 1.0.0-coordinate7 → 2.0.0-switchMap1

package/dist/v3/business-components/BusinessTaxiServiceMap/BusinessTaxiServiceMap.js

@@ -3,42 +3,52 @@ import { ref, watch } from "vue-demi";
 import { apiGetAuxiliaryGrapStatus } from "../../api/browser.js";
 import { setGlobalGoogleSnapRoadProxyUrl } from "../../api/googleSnapRoad.js";
 import { HeycarMap } from "../../components/MapProvider/MapProvider.js";
+import { createElement } from "../../demi-polyfill/demi-polyfill.js";
 import { useGeoLocation } from "../../hooks/useGeoLocation.js";
-import { useGoogleConnection } from "../../hooks/useGoogleConnection.js";
 import { useHeycarMap } from "../../hooks/useHeycarMap.js";
 import { useMapCoordinatify } from "../../hooks/useMapCoordinatify.js";
-import { defineLagecySetup } from "../../types/helper.js";
+import { useMapFitView } from "../../hooks/useMapFitView.js";
+import { useMapSupplier } from "../../hooks/useMapSupplier.js";
+import { defineSetup, defineLagecySetup } from "../../types/helper.js";
 import { assertNotEmptyArray } from "../../utils/helper.js";
-import { place2point, combineHandler, pipeDefer, lnglat2point } from "../../utils/transform.js";
+import { place2point, pipeDefer, lnglat2point } from "../../utils/transform.js";
 import { toCoordinatePlaceType, toCoordinateTrackPoint } from "../../utils/typeChecking.js";
 import { AuxiliaryGraspRoad } from "../AuxiliaryGraspRoad/AuxiliaryGraspRoad.js";
 import { DeviceOrientation } from "../DeviceOrientation/DeviceOrientation.js";
 import { SectionDispatching, SectionConfirmed, SectionDriverStartService, SectionBookDispatched, SectionInService, SectionDriverArrived, SectionCanceled, SectionEndService } from "./BusinessTaxiServiceSection.js";
 const STATUS_NEED_CAR_POSITION = ["book-driverStartService", "dispatched", "driverStartService", "inService", "driverArrived"];
+const BUSINESS_TAXI_SERVICE_FITVIEW_PANDING = [19, 36, 19, 26];
 const IS_ENABLE_AUXILIARY_GRASP_ROAD = apiGetAuxiliaryGrapStatus();
-const BusinessTaxiServiceMap = defineLagecySetup("BusinessTaxiServiceMap", function(props, {
-  attrs,
-  emit
+const BusinessTaxiServiceMapInner = defineSetup("BusinessTaxiServiceMapInner", function(props, {
+  attrs
 }) {
   const {
     interval,
     disablePassenger,
-    registerOverlay,
-    mapRef: outerSetMap,
+    mapContext,
     getDriverPositionTrack,
     renderStartSerivceTitle,
     renderInServiceTitle
   } = props;
   setGlobalGoogleSnapRoadProxyUrl(props.googleSnapRoadProxyUrl);
+  const {
+    mapRef,
+    setMap,
+    mapElementRef
+  } = useHeycarMap();
   const {
     unCoordinatifyPlace,
     unCoordinatifyTrackPoint
   } = useMapCoordinatify();
-  const deferedSetFitView = pipeDefer(() => registerOverlay.setFitView(true));
   const {
-    setMap,
-    mapElementRef
-  } = useHeycarMap();
+    registerFitVeiw: registerOverlay,
+    setFitView
+  } = useMapFitView({
+    mapRef,
+    padding: BUSINESS_TAXI_SERVICE_FITVIEW_PANDING
+  });
+  mapContext.setFitView = () => setFitView(false);
+  const deferedSetFitView = pipeDefer(() => registerOverlay.setFitView(true));
   const {
     geoLoading,
     geoPosition,
@@ -49,9 +59,6 @@ const BusinessTaxiServiceMap = defineLagecySetup("BusinessTaxiServiceMap", funct
   const carPositionRef = ref();
   const carAngleRef = ref();
   const carTrackPositionsRef = ref([]);
-  useGoogleConnection({
-    onChange: (status) => emit("changeGoogleConnection", status)
-  });
   watch(() => props.driverStatus, (status, _, onCleanup) => {
     if (!STATUS_NEED_CAR_POSITION.includes(status))
       return;
@@ -93,7 +100,7 @@ const BusinessTaxiServiceMap = defineLagecySetup("BusinessTaxiServiceMap", funct
       "style": attrs.style,
       "center": place2point(from),
       "zoom": 13,
-      "mapRef": combineHandler(outerSetMap, setMap),
+      "mapRef": setMap,
       "touchEnable": touchEnable,
       "onResize": deferedSetFitView
     }, {
@@ -180,7 +187,24 @@ const BusinessTaxiServiceMap = defineLagecySetup("BusinessTaxiServiceMap", funct
       }, null)]
     });
   };
-}).props(["bookDispatchingTitle", "dispatchingTitle", "driverArrivedTitle", "driverStatus", "googleSnapRoadProxyUrl", "fallback", "from", "getDriverPositionTrack", "interval", "disablePassenger", "loading", "mapRef", "renderInServiceTitle", "renderStartSerivceTitle", "to", "registerOverlay"]);
+});
+const BusinessTaxiServiceMap = defineLagecySetup("BusinessTaxiServiceMap", function(props, {
+  attrs
+}) {
+  const payload = useMapSupplier();
+  const instanceNo = Date.now();
+  return () => createElement(BusinessTaxiServiceMapInner, {
+    ...attrs.class ? {
+      class: attrs.class
+    } : {},
+    ...attrs.style ? {
+      style: attrs.style
+    } : {},
+    attrs: props,
+    key: `${payload.supplier}${instanceNo}`
+  });
+}).props(["bookDispatchingTitle", "dispatchingTitle", "driverArrivedTitle", "driverStatus", "googleSnapRoadProxyUrl", "fallback", "from", "getDriverPositionTrack", "interval", "disablePassenger", "loading", "mapContext", "renderInServiceTitle", "renderStartSerivceTitle", "to"]);
 export {
-  BusinessTaxiServiceMap
+  BusinessTaxiServiceMap,
+  BusinessTaxiServiceMapInner
 };

package/dist/v3/business-components/BusinessTaxiServiceMap/index.js

@@ -1,4 +1,5 @@
-import { BusinessTaxiServiceMap } from "./BusinessTaxiServiceMap.js";
+import { BusinessTaxiServiceMap, BusinessTaxiServiceMapInner } from "./BusinessTaxiServiceMap.js";
 export {
-  BusinessTaxiServiceMap
+  BusinessTaxiServiceMap,
+  BusinessTaxiServiceMapInner
 };

package/dist/v3/chunks/{BusinessRecomendPlaceMap.57b15c64.js → BusinessRecomendPlaceMap.39888296.js}

@@ -3,21 +3,22 @@ import { computed, watch, watchEffect } from "vue-demi";
 import { apiSaveCenterPlaceToCache } from "../api/browser.js";
 import { apiMemoryShouldSkipByKey } from "../api/memory.js";
 import { HeycarMap } from "../components/MapProvider/MapProvider.js";
+import { createElement } from "../demi-polyfill/demi-polyfill.js";
 import { useGeoLocation } from "../hooks/useGeoLocation.js";
-import { useGoogleConnection } from "../hooks/useGoogleConnection.js";
 import { useHeycarMap } from "../hooks/useHeycarMap.js";
 import { useMapCoordinatify } from "../hooks/useMapCoordinatify.js";
 import { useMapDrag } from "../hooks/useMapDrag.js";
+import { useMapGeometry } from "../hooks/useMapGeometry.js";
 import { useMapRecomendPlace } from "../hooks/useMapRecomendPlace.js";
 import { useMapSupplier } from "../hooks/useMapSupplier.js";
 import { useMapZoom } from "../hooks/useMapZoom.js";
-import { defineLagecySetup } from "../types/helper.js";
+import { defineSetup, defineLagecySetup } from "../types/helper.js";
 import { CenterPlaceStatus } from "../types/interface.js";
-import { watchPostEffectOnce } from "../utils/compare.js";
+import { watchPostEffectOnce, generateCreateElementV2PropsOn } from "../utils/compare.js";
 import { equalAssign, isPlacesInclude } from "../utils/helper.js";
 import { detectBrowserPlatform } from "../utils/platform.js";
 import { place2point, isPlaceEqual, pipeOnlyLastEffect, isZoneEqual, geoPositionError2businessTimeout } from "../utils/transform.js";
-import { toCoordinateRecommendZonePlacesType, toCoordinatePlaceType } from "../utils/typeChecking.js";
+import { toCoordinatePointType, toCoordinateRecommendZonePlacesType, toCoordinatePlaceType } from "../utils/typeChecking.js";
 import { AbsoluteAddressBox } from "../business-components/AbsoluteAddressBox/AbsoluteAddressBox.js";
 import { DeviceOrientation } from "../business-components/DeviceOrientation/DeviceOrientation.js";
 import { GreenZone } from "../business-components/GreenZone/GreenZone.js";
@@ -271,7 +272,7 @@ const EMPTY_PLACE = {
   name: "",
   displayName: ""
 };
-const BusinessRecomendPlaceMap = defineLagecySetup("BusinessRecomendPlaceMap", function(props, {
+const BusinessRecomendPlaceMapInner = defineSetup("BusinessRecomendPlaceMapInner", function(props, {
   emit,
   slots,
   attrs
@@ -287,6 +288,7 @@ const BusinessRecomendPlaceMap = defineLagecySetup("BusinessRecomendPlaceMap", f
   } = props;
   const {
     coordinatifyPoint,
+    unCoordinatifyPoint,
     coordinatifyPlace,
     unCoordinatifyPlace,
     unCoordinatifyRecommendZonePlaces,
@@ -295,6 +297,9 @@ const BusinessRecomendPlaceMap = defineLagecySetup("BusinessRecomendPlaceMap", f
   } = useMapCoordinatify();
   const pipedGetAvailable = getAvailable && pipeOnlyLastEffect((p) => getAvailable(coordinatifyPlace(p)));
   const pipedGetRecomendPlace = pipeOnlyLastEffect((p) => getRecomendPlace(coordinatifyPlace(p)).then((r) => r && unCoordinatifyRecommendZonePlaces(toCoordinateRecommendZonePlacesType(r))));
+  const {
+    apiMapDistance
+  } = useMapGeometry();
   const {
     mapRef,
     mapElementRef,
@@ -413,9 +418,9 @@ const BusinessRecomendPlaceMap = defineLagecySetup("BusinessRecomendPlaceMap", f
       emitGeoErrorOnce(error);
     }
   });
-  useGoogleConnection({
-    onChange: (status) => emit("changeGoogleConnection", status)
-  });
+  mapContext.apiMapDistance = (from, to) => {
+    return apiMapDistance(unCoordinatifyPoint(toCoordinatePointType(from)), unCoordinatifyPoint(toCoordinatePointType(to)));
+  };
   mapContext.setCenterPlaceByUserSpecified = setCenterPlaceByUserSpecified;
   mapContext.setCenterPlaceByUserSpecifiedInZone = setCenterPlaceByUserSpecifiedInZone;
   mapContext.panToGeoPositionByRecomend = () => {
@@ -495,22 +500,19 @@ const BusinessRecomendPlaceMap = defineLagecySetup("BusinessRecomendPlaceMap", f
     if (!isFirstLoad)
       updateRecommendPlaceOnlyInZone(defaultCenterPlace);
   });
-  watch(centerPlace, () => {
+  watch(centerPlace, (place) => {
     if (centerPlaceStatusRef.value === CenterPlaceStatus.OK) {
       apiSaveCenterPlaceToCache(coordinatifyPlace({
-        ...centerPlace
+        ...place
       }));
     }
-    mapContext.onChangeCenterPlace(coordinatifyPlace({
-      ...centerPlace
+    equalAssign(mapContext.centerPlace, coordinatifyPlace({
+      ...place
     }));
   }, {
     deep: true,
     flush: "post"
   });
-  watchEffect(() => {
-    mapContext.onChangeRecomendPlaces(placeCandidates.value.map(coordinatifyPlace));
-  });
   watchEffect(() => {
     mapContext.centerPlaceStatusRef.value = centerPlaceStatusRef.value;
   });
@@ -568,6 +570,26 @@ const BusinessRecomendPlaceMap = defineLagecySetup("BusinessRecomendPlaceMap", f
       }
     });
   };
+});
+const BusinessRecomendPlaceMap = defineLagecySetup("BusinessRecomendPlaceMap", function(props, {
+  slots,
+  attrs,
+  emit
+}) {
+  const payload = useMapSupplier();
+  const instanceNo = Date.now();
+  return () => createElement(BusinessRecomendPlaceMapInner, {
+    ...attrs.class ? {
+      class: attrs.class
+    } : {},
+    ...attrs.style ? {
+      style: attrs.style
+    } : {},
+    attrs: props,
+    scopedSlots: slots,
+    key: `${payload.supplier}${instanceNo}`,
+    on: generateCreateElementV2PropsOn(props, emit, ["loadGeoLocation", "loadDefaultGeoLocation", "changeByDrag", "changeGeoLocation", "changePlace", "changeRecomandPlace", "geoError", "geoErrorOnce", "clickLocatorText", "clickLocatorPhoto"])
+  });
 }).props(["log", "geoLoadingTitle", "emptyTitle", "queryingTitle", "defaultCenterPlace", "geoErrorOnceNotificationKey", "unavailableTitle", "recomendDescription", "disableLocator", "fallback", "getRecomendPlace", "getAvailable", "renderPlacePhoto", "renderPlaceTag", "loading", "mapContext"]);
 export {
   BusinessRecomendPlaceMap as B,
@@ -580,5 +602,6 @@ export {
   RECOMMEND_PLACE_ICON_ZOOM_MIN as c,
   RECOMMEND_PLACE_ZONE_TEXT_MIN as d,
   RECOMMEND_PLACE_TEXT_ZOOM_MIN as e,
+  BusinessRecomendPlaceMapInner as f,
   memoize as m
 };

package/dist/v3/components/AmapMarker/AmapMarker.js

@@ -11,7 +11,8 @@ const AmapMarker = defineSetup("AmapMarker", function(props, { emit }) {
   const mapRef = useAmap();
   onMounted(() => {
     referenceCount.add();
-    markerRef.value = new AMap.Marker({ ...props });
+    const { registerOverlay: registerOverlay2, onClick, ...option } = props;
+    markerRef.value = new AMap.Marker({ ...option });
   });
   useMapOverlay({ registerOverlay, overlayRef: markerRef });
   onUnmounted(() => {

package/dist/v3/components/GmapAdvancedMarkerElement/GmapAdvancedMarkerElement.js

@@ -11,7 +11,7 @@ const GmapAdvancedMarkerElement = defineSetup(
     const mapRef = useGmap();
     const handleGmpClick = (name) => emit(name, { target: markerRef.value });
     onMounted(() => {
-      const { registerOverlay: registerOverlay2, ...markerViewProps } = props;
+      const { registerOverlay: registerOverlay2, onClick, ...markerViewProps } = props;
       markerRef.value = new google.maps.marker.AdvancedMarkerElement({ ...markerViewProps });
     });
     onUnmounted(() => {

package/dist/v3/components/MapProvider/MapProvider.js

@@ -24,16 +24,13 @@ if (detectWebGL() === WEBGL_STATUS.ENABLED) {
 const MapProvider = defineLagecySetup("MapProvider", function(props, {
   slots
 }) {
-  const {
-    statusRef,
-    readyPromise
-  } = useMapLoader(props);
+  const payload = useMapLoader(props);
   const context = new Proxy(props, {
     get(target, name, receiver) {
       if (name === "status")
-        return statusRef.value;
+        return payload.statusRef.value;
       if (name === "readyPromise")
-        return readyPromise;
+        return payload.readyPromise;
       return Reflect.get(target, name, receiver);
     }
   });
@@ -70,7 +67,7 @@ const HeycarMap = defineLagecySetup("HeycarMap", function(props, {
   const handleResize = () => emit("resize");
   loadTraditionalChineseConvertOnce(payload.language === "zh-TW");
   return () => {
-    var _a, _b, _c, _d, _e, _f, _g, _h;
+    var _a, _b, _c, _d, _e, _f;
     const {
       supplier,
       gmapId,
@@ -85,12 +82,16 @@ const HeycarMap = defineLagecySetup("HeycarMap", function(props, {
       touchEnable = true,
       touchZoomCenter
     } = props;
-    if (status === Status.LOADING)
-      return (_b = (_a = slots.loading) == null ? void 0 : _a.call(slots)) != null ? _b : createVNode(Loading, null, null);
-    if (status === Status.FAILURE)
-      return (_d = (_c = slots.fallback) == null ? void 0 : _c.call(slots)) != null ? _d : createVNode(Loading, null, null);
-    const children = (_e = slots.default) == null ? void 0 : _e.call(slots);
-    const outArea = (_f = slots.outerArea) == null ? void 0 : _f.call(slots);
+    if (status === Status.LOADING) {
+      const node = (_a = slots.loading) == null ? void 0 : _a.call(slots);
+      return node ? createVNode("div", null, [node]) : createVNode(Loading, null, null);
+    }
+    if (status === Status.FAILURE) {
+      const node = (_b = slots.fallback) == null ? void 0 : _b.call(slots);
+      return node ? createVNode("div", null, [node]) : createVNode(Loading, null, null);
+    }
+    const children = (_c = slots.default) == null ? void 0 : _c.call(slots);
+    const outArea = (_d = slots.outerArea) == null ? void 0 : _d.call(slots);
     const mapId = patchGmapIdForAlipayCompatible({
       gmapId,
       gmapRasterId,
@@ -100,7 +101,7 @@ const HeycarMap = defineLagecySetup("HeycarMap", function(props, {
     switch (supplier) {
       case "gmap":
         return createVNode("div", {
-          "class": `${heycarMap} ${(_g = attrs.class) != null ? _g : ""}`,
+          "class": `${heycarMap} ${(_e = attrs.class) != null ? _e : ""}`,
           "lang": language,
           "style": attrs.style
         }, [createVNode(Gmap, {
@@ -125,7 +126,7 @@ const HeycarMap = defineLagecySetup("HeycarMap", function(props, {
         }, null), outArea]);
       default:
         return createVNode("div", {
-          "class": `${heycarMap} ${(_h = attrs.class) != null ? _h : ""}`,
+          "class": `${heycarMap} ${(_f = attrs.class) != null ? _f : ""}`,
           "lang": language,
           "style": attrs.style
         }, [createVNode(Amap, {

package/dist/v3/demi-polyfill/demi-polyfill.d.ts

@@ -6,6 +6,7 @@ import type { Slot as Slot_V2 } from "vue2/types/v3-setup-context";
 import type { ScopedSlot as ScopedSlot_V2 } from "vue2/types/vnode";
 import type { DefineComponent as DefineComponent_V3, HTMLAttributes as HTMLAttributes_V3, ImgHTMLAttributes as ImgHTMLAttributes_V3, Ref as Ref_V3, Slot as Slot_V3, StyleValue as StyleValue_V3, VNodeArrayChildren as VNodeArrayChildren_V3, VNodeChild as VNodeChild_V3, VNode as VNode_V3, WatchOptions as WatchOptions_V3 } from "vue3";
 export * from "vue-demi";
+export type { StyleValue_V2 };
 export type { Data } from "vue2";
 export type { EmitFn } from "vue2/types/v3-setup-context";
 export type { ComponentObjectPropsOptions, ObjectEmitsOptions, PublicProps, SlotsType } from "vue3";

package/dist/v3/hooks/useMapLoader.d.ts

@@ -1,7 +1,7 @@
 import { load as loadAmap } from "@amap/amap-jsapi-loader";
 import { type LoaderOptions } from "@googlemaps/js-api-loader";
 import { type Ref } from "vue-demi";
-import type { VueNode } from "../demi-polyfill";
+import type { VNodeChild } from "../demi-polyfill";
 import type { Language } from "../types/interface";
 export declare const DEFAULT_AMAP_PLUGINS: AmapLoaderProps["plugins"];
 export declare const DEFAULT_GMAP_LIBRARIES: LoaderOptions["libraries"];
@@ -25,20 +25,22 @@ export interface AmapLoaderProps extends Pick<GmapLoaderProps, "fallback" | "loa
     apiServiceHost?: string;
     version?: string;
     plugins?: `AMap.${AMap.PluginName}`[];
+    disableRef?: Ref<boolean>;
 }
 export declare const useAmapLoader: (props: AmapLoaderProps) => {
     statusRef: import("vue-demi").ShallowRef<Status>;
     readyPromise: Promise<undefined>;
 };
 export interface GmapLoaderProps extends LoaderOptions {
+    disableRef?: Ref<boolean>;
     /**
      * Render prop used to switch to loading component.
      */
-    loading?: () => VueNode;
+    loading?: () => VNodeChild;
     /**
      * Render prop used to switch to error fallback component.
      */
-    fallback?: () => VueNode;
+    fallback?: () => VNodeChild;
     /**
      * Callback prop used to access `@googlemaps/js-api-loader` and `Status`.
      *

package/dist/v3/hooks/useMapLoader.js

@@ -551,7 +551,7 @@ var Status = /* @__PURE__ */ ((Status2) => {
   return Status2;
 })(Status || {});
 const useAmapLoader = (props) => {
-  const { onChange } = props;
+  const { disableRef, onChange } = props;
   let resolveLoader;
   let rejectLoader;
   const readyPromise = new Promise((resolve, reject) => {
@@ -567,8 +567,10 @@ const useAmapLoader = (props) => {
     return { ...options, key: apiKey, version: version != null ? version : "2.0" };
   });
   watchPostEffectForDeepOption(
-    () => optionsRef.value,
-    (options) => {
+    () => [optionsRef.value, disableRef == null ? void 0 : disableRef.value],
+    ([options, disable]) => {
+      if (disable)
+        return;
       const setStatusAndExecuteCallback = (status) => {
         statusRef.value = status;
         if (status === "SUCCESS")
@@ -603,7 +605,7 @@ const loadGmapOnce = createRunOnce((opts) => {
   return loader.load();
 });
 const useGmapLoader = (props) => {
-  const { onChange } = props;
+  const { disableRef, onChange } = props;
   let resolveLoader;
   let rejectLoader;
   const readyPromise = new Promise((resolve, reject) => {
@@ -619,8 +621,10 @@ const useGmapLoader = (props) => {
     return options;
   });
   watchPostEffectForDeepOption(
-    () => optionsRef.value,
-    (options) => {
+    () => [optionsRef.value, disableRef == null ? void 0 : disableRef.value],
+    ([options, disable]) => {
+      if (disable)
+        return;
       const language = navigator.language;
       const setStatusAndExecuteCallback = (status) => {
         statusRef.value = status;
@@ -649,22 +653,33 @@ const useGmapLoader = (props) => {
   return { statusRef, readyPromise };
 };
 const useMapLoader = (props) => {
-  const { gmapKey, amapKey, amapSecret, amapServiceHost, supplier, language, onChange } = props;
-  return supplier === "gmap" ? useGmapLoader({
+  const { gmapKey, amapKey, amapSecret, amapServiceHost, language, onChange } = props;
+  const { statusRef: amapStatusRef, readyPromise: amapReadyPromise } = useAmapLoader({
+    apiKey: amapKey,
+    apiSecret: amapSecret,
+    apiServiceHost: amapServiceHost,
+    plugins: DEFAULT_AMAP_PLUGINS,
+    disableRef: computed(() => props.supplier !== "amap"),
+    onChange
+  });
+  const { statusRef: gmapStatusRef, readyPromise: gmapReadyPromise } = useGmapLoader({
     apiKey: gmapKey,
     language,
     version: "weekly",
     // todo: 需要提前设置 region
     // region: "CN",
     libraries: DEFAULT_GMAP_LIBRARIES,
-    onChange
-  }) : useAmapLoader({
-    apiKey: amapKey,
-    apiSecret: amapSecret,
-    apiServiceHost: amapServiceHost,
-    plugins: DEFAULT_AMAP_PLUGINS,
+    disableRef: computed(() => props.supplier !== "gmap"),
     onChange
   });
+  return {
+    get statusRef() {
+      return props.supplier === "gmap" ? gmapStatusRef : amapStatusRef;
+    },
+    get readyPromise() {
+      return props.supplier === "gmap" ? gmapReadyPromise : amapReadyPromise;
+    }
+  };
 };
 export {
   DEFAULT_AMAP_PLUGINS,

package/dist/v3/hooks-business/useBusinessAlarm.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @warning: 如果要支持动态地图切换， 外部引用 useBusinessAlarm 的组件必须利用 key={mapSupplier} 强制更新
+ */
 export interface useBusinessAlarmProps {
     emptyPlaceName: string;
 }