地图修改
This commit is contained in:
parent
37e1f65dc6
commit
4d3be95b2d
|
|
@ -112,18 +112,16 @@ const handleWebViewMessage = (event) => {
|
|||
token: memberStore.token,
|
||||
},
|
||||
(result) => {
|
||||
console.log("收到原生回调:", result);
|
||||
|
||||
// 增加非空判断
|
||||
if (!result) return;
|
||||
|
||||
// 根据原生传回的 status 字段判断逻辑
|
||||
if (result.status === 'closed') {
|
||||
console.log("监听到三维模型关闭");
|
||||
uni.$u.toast('三维模型已关闭');
|
||||
uni.$u.toast('模型已关闭');
|
||||
// 在这里处理你需要的业务逻辑，比如刷新列表
|
||||
}
|
||||
else if (result.status === 'success') {
|
||||
}else if(result.status === 'opened'){
|
||||
uni.$u.toast('模型已开启');
|
||||
}else if (result.status === 'success') {
|
||||
// 处理保存成功的逻辑
|
||||
}
|
||||
},
|
||||
|
|
|
|||
|
|
@ -589,9 +589,6 @@
|
|||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* 网络请求类
|
||||
*/
|
||||
const Network = {
|
||||
baseUrl: '/api',
|
||||
token: '',
|
||||
|
|
@ -634,47 +631,33 @@
|
|||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 增强版网络检测：用心跳请求检测真实互联网连接
|
||||
* 解决热点有连接但无网络的问题
|
||||
*/
|
||||
checkInternetConnectivity() {
|
||||
return new Promise((resolve) => {
|
||||
// 如果浏览器已经认为离线，直接返回 false
|
||||
if (!navigator.onLine) {
|
||||
resolve(false);
|
||||
return;
|
||||
}
|
||||
|
||||
// 创建一个微小的请求来测试互联网
|
||||
// 使用 favicon.ico 或一个极小的静态资源，加上时间戳防缓存
|
||||
// 这里使用百度地图的一个极小图标，因为它本身就在白名单里，且速度快
|
||||
const testImg = new Image();
|
||||
const timeout = 3000; // 3秒超时
|
||||
const timeout = 3000;
|
||||
let timer = null;
|
||||
|
||||
testImg.onload = () => {
|
||||
clearTimeout(timer);
|
||||
resolve(true); // 加载成功，有网
|
||||
resolve(true);
|
||||
};
|
||||
|
||||
testImg.onerror = () => {
|
||||
clearTimeout(timer);
|
||||
// 图片加载失败，尝试请求一下当前页面的HTML头部（同源策略允许）
|
||||
// 这是一个降级方案
|
||||
fetch(window.location.href, { method: 'HEAD', cache: 'no-cache' })
|
||||
.then(() => resolve(true))
|
||||
.catch(() => resolve(false));
|
||||
};
|
||||
|
||||
// 设置超时
|
||||
timer = setTimeout(() => {
|
||||
testImg.src = ''; // 停止请求
|
||||
testImg.src = '';
|
||||
resolve(false);
|
||||
}, timeout);
|
||||
|
||||
// 发起请求：使用百度地图的一个静态资源，或者您服务器上的一个小文件
|
||||
// 加上随机数防止缓存
|
||||
testImg.src = 'https://api.map.baidu.com/images/blank.gif?t=' + Date.now();
|
||||
});
|
||||
}
|
||||
|
|
@ -695,11 +678,12 @@
|
|||
watchOrientationId: null,
|
||||
watchLocationTimer: null,
|
||||
mapLoaded: false,
|
||||
// 网络相关
|
||||
networkDebounceTimer: null,
|
||||
isNetworkRecovering: false,
|
||||
heartbeatTimer: null // 心跳检测定时器
|
||||
heartbeatTimer: null
|
||||
},
|
||||
// 增加 isCreatingMarker 锁，防止多图标问题
|
||||
isCreatingMarker: false,
|
||||
locationIconCache: null,
|
||||
baiduGeolocation: null,
|
||||
lastHeading: null,
|
||||
|
|
@ -725,8 +709,6 @@
|
|||
this.initMap(this.state.projectInfo);
|
||||
this.renderProjectList();
|
||||
this.handleUrlActions(params);
|
||||
|
||||
// 重要：初始化增强版网络监听
|
||||
this.setupNetworkListeners();
|
||||
},
|
||||
|
||||
|
|
@ -767,53 +749,29 @@
|
|||
window.drawModel = this.drawModel.bind(this);
|
||||
},
|
||||
|
||||
/**
|
||||
* 增强版网络状态监听：包含心跳检测
|
||||
*/
|
||||
setupNetworkListeners() {
|
||||
// 1. 先进行一次立即检测
|
||||
this.performNetworkCheck();
|
||||
|
||||
// 2. 监听浏览器原生的 online/offline 事件（作为基础触发器）
|
||||
window.addEventListener('online', () => {
|
||||
console.log('浏览器报告在线，正在验证真实连接...');
|
||||
this.updateNetworkUIText('验证中...');
|
||||
this.performNetworkCheck();
|
||||
});
|
||||
|
||||
window.addEventListener('offline', () => {
|
||||
console.log('浏览器报告离线');
|
||||
this.updateNetworkUI(false);
|
||||
});
|
||||
|
||||
// 3. 开启心跳检测定时器 (每5秒检查一次)
|
||||
// 这是解决“热点假连接”的关键
|
||||
if (this.state.heartbeatTimer) clearInterval(this.state.heartbeatTimer);
|
||||
this.state.heartbeatTimer = setInterval(() => {
|
||||
this.performNetworkCheck();
|
||||
}, 5000);
|
||||
},
|
||||
|
||||
/**
|
||||
* 执行真实网络检查
|
||||
*/
|
||||
async performNetworkCheck() {
|
||||
const isConnected = await Network.checkInternetConnectivity();
|
||||
|
||||
// 获取当前显示的文本，判断是否还在“检查中”
|
||||
const textSpan = this.elements.networkStatus?.querySelector('.network-status-text');
|
||||
const isChecking = textSpan && textSpan.innerText.includes('检查中');
|
||||
|
||||
// 获取当前样式状态 (是否有 offline 类)
|
||||
// 注意：默认没有 offline 类，所以 isCurrentlyOnline 默认为 true
|
||||
const isCurrentlyOnline = !this.elements.networkStatus?.classList.contains('offline');
|
||||
|
||||
// 修复：除了状态改变外，如果还在“检查中”状态，也必须更新 UI
|
||||
if (isConnected !== isCurrentlyOnline || isChecking) {
|
||||
this.updateNetworkUI(isConnected);
|
||||
|
||||
// 逻辑细化：只有在真正从“断网”恢复到“有网”时（且不是初始检查），才触发地图刷新
|
||||
// 初始检查(isChecking=true)如果是在线的，通常不需要刷新地图
|
||||
if (isConnected && !isCurrentlyOnline && !isChecking) {
|
||||
this.handleNetworkRecovered();
|
||||
}
|
||||
|
|
@ -821,21 +779,14 @@
|
|||
},
|
||||
|
||||
handleNetworkRecovered() {
|
||||
console.log('真实网络连接已恢复，等待稳定...');
|
||||
|
||||
if (this.state.networkDebounceTimer) {
|
||||
clearTimeout(this.state.networkDebounceTimer);
|
||||
}
|
||||
|
||||
this.state.networkDebounceTimer = setTimeout(() => {
|
||||
if (this.map && !this.state.isNetworkRecovering) {
|
||||
console.log('网络稳定，执行地图刷新');
|
||||
this.state.isNetworkRecovering = true;
|
||||
|
||||
const zoom = this.map.getZoom();
|
||||
// 触发瓦片重载
|
||||
this.map.setZoom(zoom + 0.000001);
|
||||
|
||||
setTimeout(() => {
|
||||
this.map.setZoom(zoom);
|
||||
this.state.isNetworkRecovering = false;
|
||||
|
|
@ -847,7 +798,6 @@
|
|||
updateNetworkUI(isOnline) {
|
||||
if (!this.elements.networkStatus) return;
|
||||
const textSpan = this.elements.networkStatus.querySelector('.network-status-text');
|
||||
|
||||
if (isOnline) {
|
||||
this.elements.networkStatus.classList.remove('offline');
|
||||
if (textSpan) textSpan.innerText = '网络: 正常';
|
||||
|
|
@ -1125,6 +1075,7 @@
|
|||
},
|
||||
|
||||
_doUpdateLocationMarker() {
|
||||
if (!this.map) return;
|
||||
const { lng, lat } = this.state.currentLocation;
|
||||
const point = new BMapGL.Point(lng, lat);
|
||||
if (this.overlays.locationMarker) {
|
||||
|
|
@ -1170,11 +1121,21 @@
|
|||
}
|
||||
},
|
||||
|
||||
// 【优化点】加锁防止创建多个 Marker
|
||||
_createNewMarker(point) {
|
||||
if (this.isCreatingMarker) return;
|
||||
this.isCreatingMarker = true;
|
||||
|
||||
this.createRotatedLocationIcon(this.state.currentHeading).then((icon) => {
|
||||
// 安全检查：如果在此期间有其他逻辑添加了 Marker，先清理
|
||||
if (this.overlays.locationMarker) {
|
||||
try { this.map.removeOverlay(this.overlays.locationMarker); } catch (e) {}
|
||||
}
|
||||
this.overlays.locationMarker = new BMapGL.Marker(point, { icon });
|
||||
this.map.addOverlay(this.overlays.locationMarker);
|
||||
this.lastHeading = this.state.currentHeading;
|
||||
}).finally(() => {
|
||||
this.isCreatingMarker = false;
|
||||
});
|
||||
},
|
||||
|
||||
|
|
@ -1430,7 +1391,6 @@
|
|||
clearTimeout(this.state.networkDebounceTimer);
|
||||
this.state.networkDebounceTimer = null;
|
||||
}
|
||||
// 清理心跳检测定时器
|
||||
if (this.state.heartbeatTimer) {
|
||||
clearInterval(this.state.heartbeatTimer);
|
||||
this.state.heartbeatTimer = null;
|
||||
|
|
|
|||
Loading…
Reference in New Issue