From 37e1f65dc60acaf22d361839e313bbca867ba98f Mon Sep 17 00:00:00 2001 From: cwchen <1048842385@qq.com> Date: Thu, 22 Jan 2026 09:32:33 +0800 Subject: [PATCH] =?UTF-8?q?=E5=9C=B0=E5=9B=BE=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/projectSelect/index.vue | 20 +- src/static/map.html | 1349 +++++++---------------------- 2 files changed, 328 insertions(+), 1041 deletions(-) diff --git a/src/pages/projectSelect/index.vue b/src/pages/projectSelect/index.vue index df6c4cc..32b359a 100644 --- a/src/pages/projectSelect/index.vue +++ b/src/pages/projectSelect/index.vue @@ -17,6 +17,7 @@ const webViewUrl = ref('') const webViewKey = ref(0) // 用于强制重新渲染 web-view const memberStore = useMemberStore() + // 获取项目列表信息 const getProjectList = async () => { const { data: res } = await getAllProjectListApi() @@ -110,7 +111,22 @@ const handleWebViewMessage = (event) => { projectId: projectInfo.proId, token: memberStore.token, }, - (result) => { }, + (result) => { + console.log("收到原生回调:", result); + + // 增加非空判断 + if (!result) return; + + // 根据原生传回的 status 字段判断逻辑 + if (result.status === 'closed') { + console.log("监听到三维模型关闭"); + uni.$u.toast('三维模型已关闭'); + // 在这里处理你需要的业务逻辑,比如刷新列表 + } + else if (result.status === 'success') { + // 处理保存成功的逻辑 + } + }, ) } else { uni.$u.toast('该工程暂无模型数据') @@ -139,6 +155,7 @@ const buildProjectInfo = (items) => { }); }; + onLoad(() => { getProjectList().then(() => { if (projectList.value.length > 0) { @@ -152,4 +169,5 @@ onLoad(() => { } }) }) + diff --git a/src/static/map.html b/src/static/map.html index 909744a..44adec7 100644 --- a/src/static/map.html +++ b/src/static/map.html @@ -32,7 +32,6 @@ padding: 0; overflow: hidden; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; - /* 确保 body 背景色与地图底色一致,防止加载前的白屏 */ background-color: #F5F3F0; } @@ -40,32 +39,17 @@ width: 100vw; height: 100vh; position: relative; - - /* --- 核心修复代码 START --- */ - - /* 1. 设置背景色:使用百度地图默认的陆地颜色(#F5F3F0 或 #FCF9F2) - 这样即使瓦片没加载出来,用户看到的也是地图的底色,而不是刺眼的白屏闪烁 */ background-color: #F5F3F0; - - /* 2. 开启硬件加速,减少渲染层重绘 */ transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); - - /* 3. 防止在某些 iOS 设备上出现灰色背景 */ -webkit-tap-highlight-color: rgba(0, 0, 0, 0); - - /* --- 核心修复代码 END --- */ } - /* 4. 针对 WebGL 生成的 Canvas 元素进行优化 */ #map-container canvas { - /* 强制 GPU 合成 */ will-change: transform; - /* 避免图片渲染时的锯齿和闪动 */ image-rendering: -webkit-optimize-contrast; } - /* 去除百度地图的水印和logo */ .BMap_cpyCtrl, .anchorBL { display: none !important; @@ -90,7 +74,6 @@ max-height: 80vh; margin: 5% 0 0 2%; background: rgba(30, 30, 30, 0.85); - /*稍微加深背景增加可读性*/ border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 8px; overflow-y: auto; @@ -102,7 +85,6 @@ color: #fff; } - /* 滚动条样式 */ .model-preview-tree::-webkit-scrollbar { width: 6px; } @@ -391,7 +373,7 @@ /* 重置地图按钮 */ .reset-map-btn { position: fixed; - bottom: 70px; /* 定位在定位按钮上方:20px + 32px + 18px间距 */ + bottom: 70px; right: 20px; width: 32px; height: 32px; @@ -416,7 +398,41 @@ transform: scale(0.95); } - /* 地图 Label 样式 - 提取至 CSS */ + /* 网络状态显示 */ + .network-status { + position: fixed; + bottom: 20px; + left: 20px; + background-color: rgba(30, 30, 30, 0.7); + color: #fff; + padding: 8px 14px; + border-radius: 20px; + font-size: 13px; + font-weight: 500; + z-index: 999; + pointer-events: none; + display: flex; + align-items: center; + gap: 8px; + backdrop-filter: blur(5px); + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2); + transition: all 0.3s; + } + + .network-status-dot { + width: 8px; + height: 8px; + border-radius: 50%; + background-color: #4cd964; + box-shadow: 0 0 5px #4cd964; + } + + /* 断网状态下的样式 */ + .network-status.offline .network-status-dot { + background-color: #ff3b30; + box-shadow: 0 0 5px #ff3b30; + } + .map-project-label { color: #002db6 !important; background-color: transparent !important; @@ -427,11 +443,9 @@ font-size: 16px !important; font-weight: bold !important; text-shadow: 1px 1px 2px #fff, -1px -1px 2px #fff, 1px -1px 2px #fff, -1px 1px 2px #fff; - /* 增加描边效果提升可见度 */ transform: translateX(-45%); } - /* 菜单样式 */ .action-menu { background: rgba(255, 255, 255, 0.95); border-radius: 12px; @@ -467,7 +481,6 @@ font-size: 18px; } - /* 百度地图 InfoWindow 修正 */ .BMap_bubble_title { display: none; } @@ -486,7 +499,6 @@ display: none; } - /* 隐藏自带关闭按钮 */ .BMap_bubble_center { top: 0 !important; } @@ -514,31 +526,30 @@