修改细节问题

src/pages.json

@@ -53,6 +53,13 @@
       }
     },
     {
+      "path": "pages/home/light/submit-map",
+      "style": {
+        "navigationBarTitleText": "选择点亮村落",
+        "enablePullDownRefresh": false
+      }
+    },
+    {
       "path": "pages/dig/details",
       "style": {
         "navigationBarTitleText": "村社文化资源挖掘平台-详情",

src/pages/components/LightMap.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="light-map">
+  <div class="light-map" :class="{ 'full': full }">
     <map 
       id="prevMap"
       map-id="prevMap"
@@ -59,7 +59,9 @@ const villageData = new Map<number, VillageListItem>();
 const emit = defineEmits(['getedCurrentLonlat','update:isLightMode']);
 
 const props = defineProps<{
-  isLightMode: boolean;
+  startLonlat?: { longitude: number, latitude: number } | undefined;
+  isLightMode?: boolean;
+  full?: boolean;
 }>();
 
 const regionLoader = useSimpleDataLoader(async () => {
@@ -227,21 +229,35 @@ onMounted(async () => {
     });
   });
 
+  if (props.startLonlat) {
+    currentLonlat.value = props.startLonlat;
+    mapCtx.moveToLocation({
+      latitude: currentLonlat.value.latitude,
+      longitude: currentLonlat.value.longitude,
+    });
+  }
+
   await regionLoader.loadData(undefined, true);
 
-  const res = await LightVillageApi.getIpAddress();
-  currentLonlat.value = {
-    longitude: Number(res.point.x),
-    latitude: Number(res.point.y),
-  };
-  await waitTimeOut(100);
-  currentAddress.value = res.address_detail.district;
-  setCurrentRegion(res.address_detail.district);
-  emit('getedCurrentLonlat', currentLonlat.value);
-  mapCtx.moveToLocation({
-    latitude: currentLonlat.value.latitude,
-    longitude: currentLonlat.value.longitude,
-  });
+  if (!props.startLonlat) {
+    const res = await LightVillageApi.getIpAddress();
+    currentLonlat.value = {
+      longitude: Number(res.point.x),
+      latitude: Number(res.point.y),
+    };
+    await waitTimeOut(100);
+    currentAddress.value = res.address_detail.district;
+    setCurrentRegion(res.address_detail.district);
+    emit('getedCurrentLonlat', currentLonlat.value);
+    mapCtx.moveToLocation({
+      latitude: currentLonlat.value.latitude,
+      longitude: currentLonlat.value.longitude,
+    });
+  } else {
+    const address = await MapApi.regeo(currentLonlat.value.latitude, currentLonlat.value.longitude);
+    currentAddress.value = address.district;
+    setCurrentRegion(address.district);
+  }
 });
 
 </script>
@@ -254,6 +270,15 @@ onMounted(async () => {
   border-radius: 30rpx;
   overflow: hidden;
 
+  &.full {
+    height: 100vh;
+    border-radius: 0;
+
+    .light-map-map {
+      height: 100vh;
+    }
+  }
+
   .light-map-map {
     width: 100%;
     height: 600rpx;

src/pages/home/index.vue

@@ -5,7 +5,7 @@
     backgroundSize: '100% auto',
     backgroundRepeat: 'no-repeat',
     backgroundPosition: 'top center',
-    backgroundColor: '#d4e8b4',
+    backgroundColor: '#7bda82',
   }">
     <Height height="100px" />
     <FlexCol :gap="4" align="center">
@@ -13,13 +13,12 @@
       <Image src="https://mncdn.wenlvti.net/app_static/xiangyuan/images/home/ButtonSubTitle.png" width="290rpx" mode="widthFix" />
     </FlexCol>
     <Box icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/home/icon-pin-distance.png" :padding="false">
-      <LightMap 
-        v-model:isLightMode="isLightMode"
+      <LightMap
         @getedCurrentLonlat="getedCurrentLonlat"
       />
       <FlexRow justify="space-between" :padding="10">
         <ImageButton src="https://mn.wenlvti.net/app_static/xiangyuan/images/home/ButtonMainAction.png" :width="230" :height="155" @click="goCommonContentList({ modelId: 18, mainBodyColumnId: 361 })" />
-        <ImageButton src="https://mn.wenlvti.net/app_static/xiangyuan/images/home/ButtonMainLight.png" :innerStyle="{ marginLeft: '-10rpx' }" :width="230" :height="155" @click="handleLight()" />
+        <ImageButton src="https://mn.wenlvti.net/app_static/xiangyuan/images/home/ButtonMainLight.png" :innerStyle="{ marginLeft: '-10rpx' }" :width="230" :height="155" @click="navTo('/pages/home/light/submit-map', { latitude: currentLonlat.latitude, longitude: currentLonlat.longitude })" />
         <ImageButton src="https://mn.wenlvti.net/app_static/xiangyuan/images/home/ButtonMainSupport.png" :innerStyle="{ marginLeft: '-10rpx' }" :width="230" :height="155" @click="goCommonContentList({ modelId: 18, mainBodyColumnId: 362 })" />
       </FlexRow>
     </Box>
@@ -144,11 +143,6 @@ import { toast } from '@/components/utils/DialogAction';
 const currentLonlat = ref<{ longitude: number, latitude: number }>({ longitude: 0, latitude: 0 });
 const isLightMode = ref(false);
 
-function handleLight() {
-  isLightMode.value = true;
-  toast('请在地图上选择你要点亮的村落哦');
-}
-
 function getedCurrentLonlat(lonlat: { longitude: number, latitude: number }) {
   currentLonlat.value = lonlat;
   recommendedNearbySitesLoader.loadData();

src/pages/home/light/submit-map.vue

@@ -0,0 +1,19 @@
+<script setup lang="ts">
+import { useLoadQuerys } from '@/common/composeabe/LoadQuerys';
+import LightMap from '@/pages/components/LightMap.vue';
+
+const { querys } = useLoadQuerys({
+  latitude: 0,
+  longitude: 0,
+}, async (querys) => {
+});
+
+</script>
+
+<template>
+  <LightMap 
+    full
+    :startLonlat="{ latitude: querys.latitude, longitude: querys.longitude }"
+    :isLightMode="true" 
+  />
+</template>