@heycar/heycars-map 0.3.3 → 0.3.4

package/dist/types/interface.d.ts

@@ -13,6 +13,7 @@ export type Place = {
 export interface AutoCompletePlace extends Place {
     placeId?: string;
     description: string;
+    distance?: number;
 }
 export type Region = {
     bound?: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@heycar/heycars-map",
-  "version": "0.3.3",
+  "version": "0.3.4",
   "type": "module",
   "scripts": {
     "dev": "vite -c vite.config.dev.ts",

package/src/Demo/DemoBusinessRecomendPlace.tsx

@@ -18,7 +18,7 @@ const SomeAutoComplete = defineSetup(function SomeAutoComplete(props: { cityName
   return () => {
     const list = autoCompletePlaces.value.map((place) => (
       <div>
-        {place.lng} | {place.lat} | {place.name} | {place.description}
+        {place.lng} | {place.lat} | {place.name} | {place.description} | {place.distance}
       </div>
     ));
     return (

package/src/hooks/useMapAutoComplete.ts

@@ -1,5 +1,7 @@
 import { ref, watch } from "vue-demi";
 import type { AutoCompletePlace, Region } from "../types/interface";
+import { useGeoLocation } from "./useGeoLocation";
+import { useMapGeometry } from "./useMapGeometry";
 import { MapLogProps, useMapLogVariable } from "./useMapLog";
 import { useMapSupplier } from "./useMapSupplier";
 import { useUpdate } from "./useUdate";
@@ -13,6 +15,8 @@ export const useAmapAutoComplete = (props: UseMapAutoCompleteProps) => {
   const cityRef = ref(city);
   useMapLogVariable(props, "useAmapAutoComplete", cityRef, "cityRef");
   const { readyPromise } = useMapSupplier();
+  const { apiMapDistance } = useMapGeometry();
+  const { geoPosition } = useGeoLocation();
   const keywordRef = ref("");
   const autoCompletePlacesRef = ref<AutoCompletePlace[]>([]);
   const { update, idx: updateKey } = useUpdate();
@@ -31,15 +35,20 @@ export const useAmapAutoComplete = (props: UseMapAutoCompleteProps) => {
       await readyPromise;
       const amapPlaceSearch = new AMap.PlaceSearch({ city: cityRef.value.name });
       amapPlaceSearch.search(keywordRef.value, (status, result) => {
+        const from = geoPosition.value;
         switch (status) {
           case "complete": {
             autoCompletePlacesRef.value = (result as AMap.PlaceSearchResult).poiList.pois.map(
-              (poi) => ({
-                lat: poi.location.lat,
-                lng: poi.location.lng,
-                name: poi.name,
-                description: poi.address,
-              })
+              (poi) => {
+                const { lat, lng } = poi.location;
+                return {
+                  lat,
+                  lng,
+                  name: poi.name,
+                  description: poi.address,
+                  distance: from ? apiMapDistance(from, [lng, lat]) : undefined,
+                };
+              }
             );
             return;
           }
@@ -62,6 +71,8 @@ export const useGmapAutoComplete = (props: UseMapAutoCompleteProps) => {
   const { city } = props;
   const cityRef = ref({ ...city });
   const { readyPromise } = useMapSupplier();
+  const { apiMapDistance } = useMapGeometry();
+  const { geoPosition } = useGeoLocation();
   const keywordRef = ref("");
   const autoCompletePlacesRef = ref<AutoCompletePlace[]>([]);
   const { update, idx: updateKey } = useUpdate();
@@ -86,16 +97,20 @@ export const useGmapAutoComplete = (props: UseMapAutoCompleteProps) => {
           bounds: cityRef.value.bound,
         },
         (result, status) => {
+          const from = geoPosition.value;
           switch (status) {
             case google.maps.places.PlacesServiceStatus.OK:
-              autoCompletePlacesRef.value = result!.map(
-                ({ geometry, name, formatted_address }) => ({
-                  lng: geometry?.location?.lng() ?? 0,
-                  lat: geometry?.location?.lat() ?? 0,
+              autoCompletePlacesRef.value = result!.map(({ geometry, name, formatted_address }) => {
+                const lng = geometry?.location?.lng() ?? 0;
+                const lat = geometry?.location?.lat() ?? 0;
+                return {
+                  lng,
+                  lat,
                   name: name ?? "",
                   description: formatted_address ?? "",
-                })
-              );
+                  distance: from ? apiMapDistance(from, [lng, lat]) : undefined,
+                };
+              });
               return;
             case google.maps.places.PlacesServiceStatus.ZERO_RESULTS:
             case google.maps.places.PlacesServiceStatus.NOT_FOUND:

package/src/types/interface.ts

@@ -14,6 +14,7 @@ export type Place = {
 export interface AutoCompletePlace extends Place {
   placeId?: string;
   description: string;
+  distance?: number;
 }
 
 export type Region = {