WonderableAI/shaguabijia-app-server
10
0
Fork 0
Code Issues Pull Requests 8 Actions Packages Projects Releases Wiki Activity

修复 H5 顶栏莫名下移22px:清除 head 里字体注入残留的 \x01 控制字符(5页),并统一去掉 min-height:100vh

Browse Source 
:
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
陈世睿
2026-07-02 15:02:25 +08:00
parent 43f6f16a61
commit 3057955ea4
5 changed files with 36 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
h5/feedback/index.html
+2 -2
View File
@@ -1,7 +1,7 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>

<meta charset="UTF-8">
<link rel="stylesheet" href="../shared/fonts.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
@@ -22,7 +22,7 @@ body {
#feedback { position: absolute; inset: 0; display: flex; flex-direction: column; background: #F5F5F5; }
/* header —— 返回 | 标题 | 反馈历史（原型 .header space-between；去框后顶部内距由 40 改 10，状态栏交给原生） */
.header { display: flex; align-items: center; justify-content: space-between; padding: 10px 16px 12px; background: #F5F5F5; flex-shrink: 0; position: relative; }
.header { display: flex; align-items: center; justify-content: space-between; height: 48px; padding: 0 16px; background: #F5F5F5; flex-shrink: 0; position: relative; }
.btn-back { background: none; border: none; cursor: pointer; padding: 0; display: flex; align-items: center; }
.btn-back svg { width: 24px; height: 24px; display: block; }
.btn-back:active { opacity: .5; }
h5/feedback_history/index.html
+4 -4
View File
@@ -1,7 +1,7 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>

<meta charset="UTF-8">
<link rel="stylesheet" href="../shared/fonts.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
@@ -35,7 +35,7 @@
--font-num: 'DIN Alternate', 'DIN Pro', 'SF Pro Display', system-ui;
}
html, body { height: 100%; }
html, body { height: 100%; overflow: hidden; }
/* 【去框】原型 body 黑底 + flex 居中（浏览器预览用）→ 铺页面色、不居中。 */
body {
font-family: 'PuHuiTi', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Helvetica Neue', sans-serif;
@@ -43,13 +43,13 @@ body {
color: var(--color-ink);
}
/* 【去框】原型 .device 375x812 预览框 → 全屏自适应容器。 */
.device { position: relative; width: 100%; height: 100%; min-height: 100vh; background: var(--color-surface-page); overflow: hidden; }
.device { position: relative; width: 100%; height: 100%; background: var(--color-surface-page); overflow: hidden; }
.screen { position: absolute; inset: 0; display: flex; flex-direction: column; overflow: hidden; }
/* 隐藏原型假状态栏（顶部状态栏交给原生） */
.statusbar { display: none; }
.topnav { height: 44px; display: flex; align-items: center; padding: 0 12px; background: var(--color-surface-page); flex-shrink: 0; position: relative; }
.topnav { height: 48px; display: flex; align-items: center; padding: 0 12px; background: var(--color-surface-page); flex-shrink: 0; position: relative; }
.topnav-back { width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; cursor: pointer; background: none; border: none; padding: 0; }
.topnav-back:active { opacity: .5; }
.topnav-title { position: absolute; left: 50%; transform: translateX(-50%); font-size: 17px; font-weight: 600; color: var(--color-ink); }
h5/mine/index.html
+4 -2
View File
@@ -4,7 +4,7 @@

<meta charset="UTF-8">
<link rel="stylesheet" href="../shared/fonts.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
@@ -4685,6 +4685,8 @@ let isLoggedIn = (window.SGBridge ? !!SGBridge.getAuthState().loggedIn
// ===== webview 改造(阶段0)：我的页真实数据接入 =====
// 战绩卡(累计可省/完成比价/赚取金币)从 app-server 真接口拉；无桥/无后端环境静默降级，保留原型 mock 展示。
function sgFmtYuan(cents){ return (Number(cents||0)/100).toLocaleString('zh-CN',{minimumFractionDigits:2,maximumFractionDigits:2}); }
// 把"1,287.50"拆成 整数(大/粗,继承 .prof-amount)+ <span class="prof-cents">.50</span>(小, 对齐原型)
function sgYuanHtml(cents){ var y=sgFmtYuan(cents), d=y.lastIndexOf('.'); return d>=0 ? y.slice(0,d)+'<span class="prof-cents">'+y.slice(d)+'</span>' : y; }
// 【临时调试浮层 — 诊断数据接通,定位后删】顶部黑条显示登录态/token/各接口结果
// sgDbg:诊断输出改走 console.log → WebChromeClient 落 logcat "[H5]",不再在屏上画黑底绿字浮层。
// (顶部满屏后该浮层会顶到屏幕最上沿露脸;排 #1「数据没显示」仍可凭 logcat 里的 [sgDbg] 行诊断。)
@@ -4710,7 +4712,7 @@ function loadMineData(){
sgDbg('compare/stats OK compare_count='+(s&&s.compare_count)+' discovered_saved='+(s&&s.discovered_saved_cents));
if(!s) return;
var amt=document.querySelector('#profSavingsCard .prof-amount');
if(amt) amt.innerHTML='<span class="prof-currency">¥</span>'+sgFmtYuan(s.discovered_saved_cents);
if(amt) amt.innerHTML='<span class="prof-currency">¥</span>'+sgYuanHtml(s.discovered_saved_cents);
var nums=document.querySelectorAll('#profSavingsCard .prof-stat-num'); // [0]领券 [1]完成比价 [2]赚取金币
if(nums[1]) nums[1].innerHTML=(s.compare_count||0)+'<span class="prof-stat-unit">次</span>';
if(typeof applySavingsLock==='function') applySavingsLock((s.compare_count||0)===0);
h5/records/index.html
+21 -12
View File
@@ -1,7 +1,7 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>

<meta charset="UTF-8">
<link rel="stylesheet" href="../shared/fonts.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
@@ -37,7 +37,7 @@
}
* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { height: 100%; }
html, body { height: 100%; overflow: hidden; }
/* 【去框】原型 body 是黑底 + flex 居中（浏览器预览用）。WebView 里直接铺页面色、不居中。 */
body {
font-family: 'PuHuiTi', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Helvetica Neue', sans-serif;
@@ -47,15 +47,15 @@ body {
/* 【去框】原型 .device 是 375x812 的手机预览框（圆角 + 阴影 + 固定宽高）。
WebView 里改成全屏自适应容器：满宽、最少占满视口高、无圆角/阴影。 */
.device { position: relative; width: 100%; height: 100%; min-height: 100vh; background: #F5F5F5; overflow: hidden; }
.device { position: relative; width: 100%; height: 100%; background: #F5F5F5; overflow: hidden; }
/* status bar —— App 顶部有原生状态栏/标题栏，这里隐藏原型自带的假状态栏 */
.status-bar { display: none; }
/* header —— 标题居中 + 右侧搜索按钮 */
.hist-header { height: 44px; background: #F5F5F5; display: flex; align-items: center; justify-content: center; padding: 0 16px; position: relative; }
.hist-header { height: 48px; background: #F5F5F5; display: flex; align-items: center; justify-content: center; padding: 0 16px; position: relative; }
.hist-header-title { font-size: 17px; font-weight: 600; color: var(--color-ink); }
.hist-header-back { display: none; position: absolute; left: 0; top: 0; width: 44px; height: 44px; align-items: center; justify-content: center; background: transparent; border: none; padding: 0; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.hist-header-back { display: none; position: absolute; left: 0; top: 0; width: 44px; height: 48px; align-items: center; justify-content: center; background: transparent; border: none; padding: 0; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.hist-header-back:active { opacity: .5; }
.hist-header-back svg { width: 24px; height: 24px; display: block; }
.hist-header-search { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; cursor: pointer; }
@@ -70,14 +70,14 @@ body {
/* scroll area —— 【去框】原型用 absolute + 顶/底偏移定位（top:132 = header44+filter44+留白；bottom:60 = 给原生 tab-bar 留位）。
WebView 隐藏了底部 tab-bar，故 bottom 改 0。其余偏移沿用原型不动。 */
.hist-scroll { position: absolute; top: 88px; left: 0; right: 0; bottom: 0; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; padding: 8px 12px 24px; }
.hist-scroll { position: absolute; top: 92px; left: 0; right: 0; bottom: 0; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; padding: 8px 12px 24px; }
.device.profile-entry .hist-header-back { display: flex; }
.device.profile-entry .hist-scroll { bottom: 0; padding-bottom: 32px; }
.device.profile-entry .tab-bar { display: none; }
.device.profile-entry.logged-out .hist-empty-logout { bottom: 0; }
/* 顶部筛选 tab（仿淘宝订单页 tab + 下划线） */
.hist-filter { position: absolute; left: 0; right: 0; top: 44px; height: 44px; display: flex; align-items: center; padding: 0 16px; gap: 22px; background: #F5F5F5; z-index: 2; }
.hist-filter { position: absolute; left: 0; right: 0; top: 48px; height: 44px; display: flex; align-items: center; padding: 0 16px; gap: 22px; background: #F5F5F5; z-index: 2; }
/* tab 字号字重对齐店名 15/600，激活态只改颜色 + 黄下划线，不改字号字重（避免跳字） */
.hist-filter-tab { font-size: 15px; color: var(--color-ink-muted); font-weight: 600; cursor: pointer; position: relative; height: 44px; line-height: 44px; padding: 0 2px; transition: color .15s ease; }
.hist-filter-tab:active { opacity: .6; }
@@ -265,7 +265,7 @@ body.transitioning-tab { /* no animation */ }
/* ============ 未登录态：骨架模糊 + 居中登录卡（保留 tab / 上报 / 搜索骨架，点任意元素引导登录，不展示任何真实数据） ============ */
/* 骨架占位列表（模糊处理，不是真实记录）—— 【去框】bottom 60→0（无原生 tab-bar 占位） */
.hist-logout-skeleton { display: none; position: absolute; top: 88px; left: 0; right: 0; bottom: 0; overflow: hidden; padding: 8px 12px 24px; filter: blur(3px); pointer-events: none; }
.hist-logout-skeleton { display: none; position: absolute; top: 92px; left: 0; right: 0; bottom: 0; overflow: hidden; padding: 8px 12px 24px; filter: blur(3px); pointer-events: none; }
.device.logged-out .hist-logout-skeleton { display: block; }
.hist-sk-item { background: #FFFFFF; border-radius: 14px; padding: 14px; margin-bottom: 10px; box-shadow: 0 1px 3px rgba(0,0,0,.04); }
.hist-sk-line { height: 12px; border-radius: 6px; background: linear-gradient(90deg,#ECECEC 0%,#F4F4F4 50%,#ECECEC 100%); }
@@ -276,10 +276,10 @@ body.transitioning-tab { /* no animation */ }
.hist-sk-cells { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-top: 14px; }
.hist-sk-cell { height: 46px; border-radius: 10px; background: linear-gradient(90deg,#EEE 0%,#F6F6F6 50%,#EEE 100%); border: .5px solid #ECECEC; }
/* 半透明蒙层，压住骨架，提示"锁定" —— 【去框】bottom 60→0 */
.hist-logout-scrim { display: none; position: absolute; top: 88px; left: 0; right: 0; bottom: 0; background: rgba(245,245,245,.45); z-index: 6; cursor: pointer; }
.hist-logout-scrim { display: none; position: absolute; top: 92px; left: 0; right: 0; bottom: 0; background: rgba(245,245,245,.45); z-index: 6; cursor: pointer; }
.device.logged-out .hist-logout-scrim { display: block; }
/* 居中登录卡容器：本身不拦点击（让 tab / 上报 / 骨架区的点击穿透到下层引导登录），只有卡片可点 —— 【去框】bottom 60→0 */
.hist-empty-logout { display: none; position: absolute; top: 44px; left: 0; right: 0; bottom: 0; align-items: center; justify-content: center; padding: 0 24px; z-index: 8; pointer-events: none; }
.hist-empty-logout { display: none; position: absolute; top: 48px; left: 0; right: 0; bottom: 0; align-items: center; justify-content: center; padding: 0 24px; z-index: 8; pointer-events: none; }
.hist-login-card { pointer-events: auto; }
.device.logged-out .hist-empty-logout { display: flex; }
.device.logged-out .hist-scroll { display: none; }
@@ -316,11 +316,11 @@ body.transitioning-tab { /* no animation */ }
.device.selecting .hist-header-search { display: none; }
.device.selecting .hist-header-title { font-size: 0; }
.device.selecting .hist-header-title::before { content: '选择一条记录上报'; font-size: 17px; font-weight: 600; color: var(--color-ink); }
.select-task-panel { display: none; position: absolute; left: 0; right: 0; top: 44px; padding: 8px 16px 6px; background: #F5F5F5; z-index: 2; }
.select-task-panel { display: none; position: absolute; left: 0; right: 0; top: 48px; padding: 8px 16px 6px; background: #F5F5F5; z-index: 2; }
.select-task-panel .fb-task-card { margin: 0; }
.device.selecting .select-task-panel { display: block; }
/* 【去框】单选态滚动区 bottom 76→0（action bar 改为 fixed 浮在视口底） */
.device.selecting .hist-scroll { top: 154px; bottom: 0; padding-bottom: 92px; }
.device.selecting .hist-scroll { top: 158px; bottom: 0; padding-bottom: 92px; }
/* 单选模式顶部 3 步指引 */
.device.selecting .tab-bar { display: none; }
@@ -1068,6 +1068,15 @@ function goBackToProfile() {
else { console.log('[nav stub] goBackToProfile（浏览器预览）'); }
}
// 系统返回(REPORT_FLOW 开 backToH5 时由原生委托到此):上报表单(步骤2)→ 关表单回选记录(步骤1);
// 选记录态(从我的进)→ 退回我的;其余 → 关页。与表单自身返回键 closeFeedbackSheet 行为一致。
window.onBack = function () {
var sheet = document.getElementById('fbSheet');
if (sheet && sheet.classList.contains('show')) { closeFeedbackSheet(); return; }
if (cameFromProfile) { goBackToProfile(); return; }
if (window.SGBridge && SGBridge.closePage) { SGBridge.closePage(); }
};
// 导航占位：原型内部跳转（home/profile/reports/welfare/comparing…）在 App 里走不通，统一打 log
function navigateStub(id) {
console.log('[nav stub] go("' + id + '")（App 内由原生处理，H5 不跳转）');
h5/reports/index.html
+5 -6
View File
@@ -1,7 +1,7 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>

<meta charset="UTF-8">
<link rel="stylesheet" href="../shared/fonts.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
@@ -9,8 +9,9 @@
<style>
* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
/* 【去框】原型 html/body 是黑底 + flex 居中（浏览器手机框预览用）。WebView 里直接铺页面色、不居中。
height:100% 链让 .device/.screen 能拿到 WebView 真实高度（min-height:100vh 在 WebView 不可靠会坍缩）。 */
html, body { height: 100%; }
WebView 是 MATCH_PARENT，height:100% 链即可拿到真实视口高；不要再叠 min-height:100vh
—— 在 WebView 里 100vh≈整窗高（含状态栏区），比真实视口高一截，会把顶栏整体顶下去、与设置页不对齐。 */
html, body { height: 100%; overflow: hidden; }
html { background: var(--color-surface-page); }
body {
font-family: 'PuHuiTi', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Helvetica Neue', sans-serif;
@@ -57,7 +58,6 @@ body {
.device {
width: 100%;
height: 100%;
min-height: 100vh;
background: var(--color-surface-page);
overflow: hidden;
position: relative;
@@ -65,7 +65,6 @@ body {
.screen {
position: relative;
height: 100%;
min-height: 100vh;
display: flex;
flex-direction: column;
}
@@ -77,7 +76,7 @@ body {
.statusbar { display: none; }
.topnav {
height: 44px;
height: 48px;
display: flex;
align-items: center;
padding: 0 12px;