feat:工单添加位置

张含笑

2026-02-27 4dcb11dddbae2d466255e153c2638c2dd2030f61

feat:工单添加位置

 applications/mobile-web-view/src/appComponents/workMap/index.vue

@@ -103,9 +103,9 @@
let locationFlag = false
let watchId = null
let userLocationMarker = null
const setMapLocation = () => {
    locationFlag = true

// 初始化实时位置监听
const initLocationWatch = () => {
    // 在WebView加载的网页中
    // 检查浏览器是否支持 geolocation
    if (navigator.geolocation) {
@@ -121,11 +121,10 @@
                const lat = position.coords.latitude // 纬度
                const lng = position.coords.longitude // 经度

                // 确保位置标记存在并更新位置
                if (userLocationMarker) {
                    userLocationMarker.setLatLng([lat, lng])
                }

                if (locationFlag) {
                } else {
                    userLocationMarker = L.marker([lat, lng], {
                        icon: L.icon({
                            iconUrl: userLocationIcon, // 图片路径
@@ -133,7 +132,10 @@
                            iconAnchor: [12, 12], // 锚点位置
                        }),
                    }).addTo(map)
                }

                // 如果是点击定位按钮触发的，将地图视图定位到当前位置
                if (locationFlag) {
                    mapSetView({
                        lat,
                        lng,
@@ -154,20 +156,25 @@
            }
        )
    } else {
        console.log('Geolocation is not supported by this browser.')
        console.log('该浏览器不支持地理定位功能。')
    }

    // 获取定位信息
    // uni.getLocation({
    //     type: 'wgs84', // 返回的经纬度是 WGS84 坐标系（适合地图定位）
    //     isHighAccuracy: true,
    //     success: function (res) {
    //         location.value = res
    //     },
    //     fail: function (err) {
    //         console.log('定位失败：', err)
    //     },
    // })
const setMapLocation = () => {
    locationFlag = true
    // 如果还没有开始监听位置，先初始化监听
    if (!watchId) {
        initLocationWatch()
    } else {
        // 已经在监听位置，会自动定位到当前位置
        // 可以添加一个视觉反馈，比如位置标记闪烁效果
        if (userLocationMarker) {
            // 添加闪烁效果
            userLocationMarker.getElement().classList.add('location-blink')
            setTimeout(() => {
                userLocationMarker.getElement().classList.remove('location-blink')
            }, 1000)
        }
    }
}

let lastLocationMarker = null
@@ -312,10 +319,24 @@
    initMap()
    map.addLayer(layers[0].map)

    // 初始化实时位置监听
    initLocationWatch()

    EventBus.on('mapSetView', mapSetView)
})

onUnmounted(() => {
    // 清理位置监听
    if (watchId) {
        navigator.geolocation.clearWatch(watchId)
        watchId = null
    }
    // 移除位置标记
    if (userLocationMarker) {
        map.removeLayer(userLocationMarker)
        userLocationMarker = null
    }
	
    EventBus.off('mapSetView', mapSetView)
    if (map) {
        map.remove()
@@ -362,4 +383,24 @@
        bottom: 76px;
    }
}

// 位置标记闪烁效果
.location-blink {
    animation: blink 1s ease-in-out;
}

@keyframes blink {
    0% {
        transform: scale(1);
        opacity: 1;
    }
    50% {
        transform: scale(1.2);
        opacity: 0.8;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}
</style>