1

src/api/CommonContent.ts

@@ -349,6 +349,22 @@ export class CommonContentApi extends AppServerRequestModule<DataModel> {
     );
   }
   /**
+   * 地址下拉带搜索
+   * @param pid 父级
+   * @returns 
+   */
+  async searchRegion(keywords?: string) {
+    const res = await this.get('/content/category/searchRegion', '地址搜索', {
+      keywords,
+    });
+    return transformArrayDataModel<CategoryListItem>(
+      CategoryListItem, 
+      transformSomeToArray(res.data), 
+      `地址下拉带搜索`, 
+      true
+    );
+  }
+  /**
    * 主体栏目列表
    * @param params 参数 
    * @param querys 额外参数

src/api/map/MapApi.ts

@@ -49,7 +49,7 @@ export class MapApi extends MapServerRequestModule<DataModel> {
     return this.get(`/v3/place/text?keywords=${encodeURIComponent(name)}&citylimit=true&offset=${size}&page=${page}`, `搜索POI ${name} 第${page}页`, {
       ...querys,
     })
-      .then(res => transformArrayDataModel(Poi, res.data ?? [], ''))
+      .then(res => transformArrayDataModel<Poi>(Poi, res.data ?? [], ''))
       .catch(e => { throw e });
   }
   regeo(lat: number, lng: number, querys?: QueryParams) {

src/pages/home/components/LightMap.vue

@@ -13,11 +13,16 @@
       class="light-map-map"
       :enable-poi="false"
       :scale="12"
-      :longitude="AppCofig.defaultLonLat[0]"
-      :latitude="AppCofig.defaultLonLat[1]"
-      @markertap="onMarkerTap"
-      
+      :longitude="currentLonlat.longitude"
+      :latitude="currentLonlat.latitude"
+      @markertap="onMarkerTap" 
     />
+    <FlexCol v-if="isEmptyRegion" gap="gap.md" position="absolute" inset="0" center backgroundColor="mask.default">
+      <Text>您选择的地区还未开通亮乡源数据，可联系客服开通</Text>
+      <button open-type="contact" class="remove-button-style">
+        <Button type="primary" text="联系客服"></Button>
+      </button>
+    </FlexCol>
     <SimpleDropDownPicker 
       class="light-map-region-picker" 
       :modelValue="selectedRegion" 
@@ -39,19 +44,20 @@
 </template>
 
 <script setup lang="ts">
-import { getCurrentInstance, onMounted, ref, watch } from 'vue';
+import { computed, getCurrentInstance, onMounted, ref, watch } from 'vue';
+import { navTo } from '@/components/utils/PageAction';
+import { waitTimeOut } from '@imengyu/imengyu-utils';
+import { useVillageStore } from '@/store/village';
 import { useSimpleDataLoader } from '@/components/composeabe/loader/SimpleDataLoader';
-import { geoJsonToWechatMapShapes } from '@/common/utils/geoJsonToWechatMap';
 import LightVillageApi, { VillageListItem } from '@/api/light/LightVillageApi';
+import type { MapMarker } from '@/types/Map';
 import MapApi from '@/api/map/MapApi';
 import AppCofig from '@/common/config/AppCofig';
-import type { MapMarker, MapPolygon, MapPolyline } from '@/types/Map';
 import SimpleDropDownPicker from '@/common/components/SimpleDropDownPicker.vue';
 import Button from '@/components/basic/Button.vue';
-import { navTo } from '@/components/utils/PageAction';
+import FlexCol from '@/components/layout/FlexCol.vue';
+import Text from '@/components/basic/Text.vue';
 import CommonContent from '@/api/CommonContent';
-import { waitTimeOut } from '@imengyu/imengyu-utils';
-import { useVillageStore } from '@/store/village';
 
 const instance = getCurrentInstance();
 const mapCtx = uni.createMapContext('prevMap', instance);
@@ -59,15 +65,21 @@ const selectedRegion = ref<number>();
 const nextNeedAutoFocus = ref(false);
 const currentAddress = ref<string>('');
 const currentLonlat = ref<{ longitude: number, latitude: number }>({ 
-  longitude: AppCofig.defaultLonLat[0], 
-  latitude: AppCofig.defaultLonLat[1],
+  longitude: 0, 
+  latitude: 0,
 });
 const villageData = new Map<number, VillageListItem>();
-const emit = defineEmits(['getedCurrentLonlat','update:isLightMode', 'selectVillage']);
+const emit = defineEmits([
+  'getedCurrentLonlat',
+  'update:isLightMode', 
+  'selectVillage',
+  'changedCity',
+]);
 
 const props = defineProps<{
   startLonlat?: { longitude: number, latitude: number } | undefined;
   isLightMode?: boolean;
+  limitCity?: string;
   small?: boolean;
   full?: boolean;
 }>();
@@ -75,7 +87,7 @@ const props = defineProps<{
 const villageStore = useVillageStore();
 
 const regionLoader = useSimpleDataLoader(async () => {
-  return (await CommonContent.getCategoryChildList(5)).map(p => ({
+  return (await CommonContent.searchRegion(props.limitCity)).map(p => ({
     id: p.id,
     name: p.title,
   }));
@@ -86,6 +98,11 @@ const mapLoader = useSimpleDataLoader<MapMarker[]>(async () => {
   })
   villageData.clear();
 
+  if (!selectedRegion.value)
+    return [];
+
+    console.log('selectedRegion.value', selectedRegion.value);
+
   await waitTimeOut(200);
   const res = (await LightVillageApi.getVillageList(undefined, selectedRegion.value, undefined, 1, 100)).map((p, i) => {
     villageData.set(p.id, p);
@@ -158,6 +175,10 @@ const mapLoader = useSimpleDataLoader<MapMarker[]>(async () => {
   return res;
 }, false, false, true);
 
+const isEmptyRegion = computed(() => {
+  return !selectedRegion.value || !mapLoader.content.value?.length;
+});
+
 function onMarkerTap(e: any) {
   if (props.isLightMode) {
     emit('update:isLightMode', false);
@@ -194,6 +215,7 @@ function getCurrentLonlat() {
       villageStore.setCurrentRegion(address.district);
       setCurrentRegion(address.district);
       emit('getedCurrentLonlat', currentLonlat.value);
+      emit('changedCity', address.city);
       mapCtx.moveToLocation({
         latitude: currentLonlat.value.latitude,
         longitude: currentLonlat.value.longitude,
@@ -201,6 +223,19 @@ function getCurrentLonlat() {
     },
   });
 }
+watch(() => props.limitCity, (newVal) => {
+  regionLoader.reload();
+  mapLoader.reload();
+});
+watch(() => props.startLonlat, (newVal) => {
+  if (newVal) {
+    currentLonlat.value = newVal;
+    mapCtx.moveToLocation({
+      latitude: currentLonlat.value.latitude,
+      longitude: currentLonlat.value.longitude,
+    });
+  }
+}, { deep: true });
 
 onMounted(async () => {
   mapCtx.initMarkerCluster({
@@ -247,16 +282,31 @@ onMounted(async () => {
   await regionLoader.reload();
 
   if (!props.startLonlat) {
-    const res = await LightVillageApi.getIpAddress();
-    currentLonlat.value = {
-      longitude: Number(res.point.x),
-      latitude: Number(res.point.y),
-    };
-    villageStore.setCurrentLonlat(currentLonlat.value);
+
+    if (props.limitCity) {
+      const res = await MapApi.searchPoi(props.limitCity);
+      if (res.length > 0) {
+        currentLonlat.value = {
+          longitude: res[0].location[0],
+          latitude: res[0].location[1],
+        };
+        villageStore.setCurrentLonlat(currentLonlat.value);
+        regionLoader.reload();
+        mapLoader.reload();
+      }
+    } else {
+      const res = await LightVillageApi.getIpAddress();
+      currentLonlat.value = {
+        longitude: Number(res.point.x),
+        latitude: Number(res.point.y),
+      };
+      villageStore.setCurrentLonlat(currentLonlat.value);
+      currentAddress.value = res.address_detail.district;
+      setCurrentRegion(res.address_detail.district);
+      villageStore.setCurrentRegion(res.address_detail.district);
+      emit('changedCity', res.address_detail.city);
+    }
     await waitTimeOut(100);
-    currentAddress.value = res.address_detail.district;
-    setCurrentRegion(res.address_detail.district);
-    villageStore.setCurrentRegion(res.address_detail.district);
     emit('getedCurrentLonlat', currentLonlat.value);
     mapCtx.moveToLocation({
       latitude: currentLonlat.value.latitude,

src/pages/home/index.vue

@@ -41,6 +41,9 @@
 
     <LightMap
       small
+      :limitCity="currentCity"
+      :startLonlat="currentLonlat"
+      @changedCity="handleChangedCity"
       @selectVillage="goDetails"
     >
       <NoticeBar 
@@ -178,6 +181,7 @@ const themeContext = useTheme();
 const searchKeywords = ref('');
 const showCityPopup = ref(false);
 const showMyFollowPopup = ref(false);
+const currentLonlat = ref<{ longitude: number, latitude: number }>();
 
 const { value: currentCity } = useStorageVar('currentCityName', '厦门市');
 const currentCityCode = ref('');
@@ -207,9 +211,20 @@ function goDetails(item: VillageListItem) {
   villageStore.setCurrentVillage(item);
   emit('goVillage')
 }
+async function handleChangedCity(city: string) {
+  currentCity.value = city;
+  const res = await MapApi.searchPoi(city);
+  if (res.length > 0) {
+    currentLonlat.value = {
+      longitude: res[0].location[0],
+      latitude: res[0].location[1],
+    };
+  }
+}
 function handleSelectCity(city: CityItem) {
   currentCity.value = city.name;
   showCityPopup.value = false;
+  handleChangedCity(city.name);
 }
 
 onMounted(async () => {