WorkBuddy
1fc34f1bcd
问题 1：五个导航页顶部与右上角胶囊按钮（··· ⊙）重合 - 根因：自定义导航用 env(safe-area-inset-top) 取的是设备物理安全区， 在 Android 上常为 0，完全不反映胶囊位置；且右对齐元素从未为胶囊让出宽度。 - 新增 miniapp/utils/nav-metrics.js 作为唯一事实源：以 wx.getMenuButtonBoundingClientRect() 实测胶囊矩形，反推并导出四个 CSS 变量 --nav-status / --nav-h / --nav-right / --nav-top，并提供无接口时的兜底值。 - nav-bar 组件改为自行获取导航度量（attached + observer 双触发）， 标题按胶囊垂直居中并收窄 max-width；外部传参降级为兜底。 - index / discover / messages / activity / mine 五页根结点注入同一组变量， WXSS 里的 env(safe-area-inset-top)、硬编码 88rpx 与右对齐 right:0 全量替换。 问题 2：首页「善缘公益服务」「善缘安全提醒」两个栏目过宽 - 根因：封面 <image> 只声明 width 未声明 height，小程序默认按 240px 计算， 实际把卡片撑到约 480rpx 高。 - 按「整体等比缩到 1/3」重构：两栏改为 mini-card 小卡，宽度 calc((100% - 2*gap)/3)、高度写死 168rpx，封面 height:100%； 公益服务一行三卡横向排布，安全提醒为「标题小卡 + 右侧文案条」， 长文案收进详情页，安全提示原文保留。 守卫与验证 - 新增 ui-tests/miniapp-capsule-safe-contracts.mjs： A 层多机型断言导航行与胶囊垂直居中、右对齐让位、navTop 与兜底值； B 层纯函数审计五个自带导航行页面（页面清单由文件系统推导，失配直接报红）； C 层断言首页小卡宽为 1/3 且显式声明高度，并钉住旧 service-/safety- 选择器回归。 审计前剥离注释，避免守卫被自身示例文本误伤。 - 新增 scripts/audit-image-height.mjs：按属性名精确比对，审计全仓 「有 width 无 height」的 <image>，当前 30 个类 0 命中。 - 负向注入 N1~N7（含 nav-safe 未接入、旧选择器回归、极小屏幕、无胶囊兜底等） 全部被守卫咬住并 exit 1，还原后复跑通过。 - 真编译（wcc/wcsc）：WXSS 88 / WXML 86，失败 0； tsc --noEmit 通过；UI 契约门控 21/21 PASS（新增第 21 个守卫并抬高 MIN_GUARDS）。 - 渲染探针实测：单卡 213rpx x 168rpx；五页右对齐元素右缘 423~528px， 均在胶囊右缘 365px 之外。 未纳入本次提交：miniapp/project.config.json（微信开发者工具自动改写， 仅追加若干布尔开关并删掉文件末换行）与生成的预览页 artifacts preview.html （约 7900 行生成产物），以免淹没代码评审视线。
80 lines
7.3 KiB
Plaintext
80 lines
7.3 KiB
Plaintext
<view class="page app-page reference-page" style="{{navVars}}">
|
|
<view wx:if="{{!isLoggedIn}}" class="mine-guest">
|
|
<view class="guest-brand"><image src="/assets/brand/logo-mark.png" mode="aspectFit" /><text>善缘丹阳</text><text class="guest-subtitle">公益婚恋服务平台</text></view>
|
|
<ui-empty illustration="default" title="登录后查看我的服务" description="管理资料、缘分与公益服务记录" actions="{{loginActions}}" bind:action="onLoginAction" />
|
|
</view>
|
|
<ui-loading wx:elif="{{loadStatus === 'loading' && !profile}}" mode="skeleton" rows="6" />
|
|
<block wx:else>
|
|
<view class="profile-hero">
|
|
<view class="mine-nav"><text>我的</text><image src="/assets/icons/home/service-station.png" mode="aspectFit" bindtap="onGoSettings" /></view>
|
|
<view class="profile-main">
|
|
<ui-avatar src="{{profile.avatarUrl || ''}}" size="xl" default-text="{{profile.displayName || '善缘用户'}}" verified="{{isRealNameVerified}}" reviewed="{{isProfileApproved}}" />
|
|
<view class="profile-copy">
|
|
<view class="profile-name-row"><text class="profile-name">{{profile.displayName || '未填写昵称'}}</text><text class="profile-status">{{relationshipText}}</text></view>
|
|
<text class="profile-meta">资料完整度 {{profileCompleteness}}%</text>
|
|
<view class="profile-progress"><view style="width:{{profileCompleteness}}%"></view></view>
|
|
<view class="profile-badges"><ui-status-badge kind="{{isRealNameVerified ? 'success' : 'warning'}}" label="{{isRealNameVerified ? '已实名' : '未实名'}}" /><ui-status-badge kind="{{isProfileApproved ? 'success' : 'warning'}}" label="{{isProfileApproved ? '资料已审核' : '资料待审核'}}" /></view>
|
|
</view>
|
|
<text class="edit-profile" bindtap="onEditProfile">编辑资料</text>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="profile-stats">
|
|
<view class="profile-stat"><text class="stat-value">{{profileCompleteness}}%</text><text class="stat-label">资料完整</text></view>
|
|
<view class="profile-stat" bindtap="onGoLikers"><text class="stat-value">{{likersCount}}</text><text class="stat-label">喜欢我的</text></view>
|
|
<view class="profile-stat" bindtap="onGoFate"><text class="stat-value">{{matchCount}}</text><text class="stat-label">当前缘分</text></view>
|
|
<view class="profile-stat"><text class="stat-value stat-value--text">{{reviewStatusText}}</text><text class="stat-label">资料状态</text></view>
|
|
</view>
|
|
|
|
<view class="public-identity-card" bindtap="onEditProfile">
|
|
<image src="/assets/brand/logo-mark.png" mode="aspectFit" />
|
|
<view><text class="identity-title">我在善缘丹阳</text><text class="identity-desc">用真诚遇见美好，让爱在丹阳绽放</text></view>
|
|
<image class="identity-arrow" src="/assets/icons/ui/chevron-right.png" mode="aspectFit" />
|
|
</view>
|
|
|
|
<!-- 分组一：我的资料与缘分（U37 四组结构）-->
|
|
<ui-section-header title="我的资料与缘分" subtitle="资料、择偶条件与当前缘分" />
|
|
<view class="list-group">
|
|
<view class="list-row" bindtap="onEditProfile"><text class="list-label">我的资料</text><text class="list-value">{{reviewStatusText}}</text><image class="list-arrow" src="/assets/icons/ui/chevron-right.png" mode="aspectFit" /></view>
|
|
<view class="list-row" bindtap="onEditPreference"><text class="list-label">择偶条件</text><image class="list-arrow" src="/assets/icons/ui/chevron-right.png" mode="aspectFit" /></view>
|
|
<view class="list-row" bindtap="onGoFate"><text class="list-label">我的缘分</text><image class="list-arrow" src="/assets/icons/ui/chevron-right.png" mode="aspectFit" /></view>
|
|
</view>
|
|
|
|
<!-- 分组二：公益服务（U49 公益服务中心入口 + 四类服务 + 服务记录）-->
|
|
<ui-section-header title="我的公益服务" subtitle="服务进度与预约记录" />
|
|
<view class="list-group">
|
|
<view class="list-row" bindtap="onGoServiceCenter"><text class="list-label">公益服务中心</text><text class="list-value">咨询 · 预约 · 课堂</text><image class="list-arrow" src="/assets/icons/ui/chevron-right.png" mode="aspectFit" /></view>
|
|
</view>
|
|
<view class="service-grid">
|
|
<view class="service-entry" bindtap="onGoMatchmaker"><view class="service-icon rose"><image src="/assets/icons/home/matchmaker.png" mode="aspectFit" /></view><text>我的红娘</text></view>
|
|
<view class="service-entry" bindtap="onGoCounseling"><view class="service-icon blue"><image src="/assets/icons/home/counseling.png" mode="aspectFit" /></view><text>我的咨询</text></view>
|
|
<view class="service-entry" bindtap="onGoActivities"><view class="service-icon amber"><image src="/assets/icons/home/activity.png" mode="aspectFit" /></view><text>我的活动</text></view>
|
|
<view class="service-entry" bindtap="onGoAppointments"><view class="service-icon green"><image src="/assets/icons/home/service-station.png" mode="aspectFit" /></view><text>我的预约</text></view>
|
|
</view>
|
|
<view class="list-group">
|
|
<view class="list-row" bindtap="onGoServiceHistory"><text class="list-label">公益服务记录</text><text class="list-value">仅本人可见</text><image class="list-arrow" src="/assets/icons/ui/chevron-right.png" mode="aspectFit" /></view>
|
|
</view>
|
|
|
|
<!-- 分组三：安全与隐私 -->
|
|
<ui-section-header title="安全与隐私" subtitle="隐私、黑名单与账号" />
|
|
<view class="list-group secondary-list">
|
|
<view class="list-row" bindtap="onGoPrivacy"><text class="list-label">隐私设置</text><image class="list-arrow" src="/assets/icons/ui/chevron-right.png" mode="aspectFit" /></view>
|
|
<view class="list-row" bindtap="onGoBlacklist"><text class="list-label">黑名单</text><image class="list-arrow" src="/assets/icons/ui/chevron-right.png" mode="aspectFit" /></view>
|
|
<view class="list-row" bindtap="onGoSafety"><text class="list-label">举报与安全</text><image class="list-arrow" src="/assets/icons/ui/chevron-right.png" mode="aspectFit" /></view>
|
|
<view class="list-row" bindtap="onGoSettings"><text class="list-label">账号设置</text><image class="list-arrow" src="/assets/icons/ui/chevron-right.png" mode="aspectFit" /></view>
|
|
</view>
|
|
|
|
<!-- 分组四：公益信息 -->
|
|
<ui-section-header title="公益信息" subtitle="课堂、反诈与服务站" />
|
|
<view class="service-grid">
|
|
<view class="service-entry" bindtap="onGoClassroom"><view class="service-icon amber"><image src="/assets/icons/home/classroom.png" mode="aspectFit" /></view><text>婚恋课堂</text></view>
|
|
<view class="service-entry" bindtap="onGoAntiFraud"><view class="service-icon rose"><image src="/assets/icons/home/anti-fraud.png" mode="aspectFit" /></view><text>婚恋反诈</text></view>
|
|
<view class="service-entry" bindtap="onGoStation"><view class="service-icon green"><image src="/assets/icons/home/service-station.png" mode="aspectFit" /></view><text>善缘服务站</text></view>
|
|
<view class="service-entry" bindtap="onGoAbout"><view class="service-icon blue"><image src="/assets/brand/logo-mark.png" mode="aspectFit" /></view><text>关于善缘丹阳</text></view>
|
|
</view>
|
|
|
|
<view class="logout-row" bindtap="onLogout">退出登录</view>
|
|
<ui-danger-action-dialog visible="{{showLogoutDialog}}" action="{{logoutAction}}" bind:confirm="onConfirmLogout" bind:cancel="onCancelLogout" />
|
|
</block>
|
|
</view>
|