Files
wxapp_escort/pages/escort/guide.wxml
T
2026-10-06 17:58:18 +08:00

82 lines
3.3 KiB
Plaintext

<!--pages/escort/guide.wxml-->
<view class="page-bg">
<view class="container">
<!-- 头部:小色带 + 白底(内页规范,不做整块主色面板) -->
<view class="page-header">
<view class="header-accent"></view>
<text class="header-title">陪诊指南</text>
<text class="header-subtitle">第一次用陪诊?三分钟看懂全流程</text>
</view>
<!-- ① 服务流程:下单到完成的通用环节 -->
<view class="card">
<view class="card-head">
<!-- 卡片头标识走全站「浅橙衬底 + 暖橙图标」语言,实心橙只留给底部 CTA(DESIGN.md §2.1)。
t-icon 的 color 读不到 CSS 变量,硬编码对应 --brand-ink #9B4508 -->
<view class="card-mark">
<!-- 图标名须能在 tdesign 的 icon.wxss 里找到 .t-icon-{name},否则渲染为空:
原 name="list" 并不存在(只有 list-numbered / list-bug 等),故换成 list-numbered -->
<t-icon name="list-numbered" size="26rpx" color="#9B4508" />
</view>
<text class="card-title">服务流程</text>
</view>
<view class="step-list">
<view class="step-item" wx:for="{{ steps }}" wx:key="title">
<view class="step-index">{{ index + 1 }}</view>
<view class="step-body">
<text class="step-title">{{ item.title }}</text>
<text class="step-desc">{{ item.desc }}</text>
</view>
</view>
</view>
</view>
<!-- ② 就诊前准备:到院前建议提前办妥或备齐的事项 -->
<view class="card">
<view class="card-head">
<view class="card-mark">
<!-- 原 info-circle 只是个「信息」圆标,与「准备清单」无关;
换成 task-checked(勾选清单),与卡内逐条勾对的读法一致 -->
<t-icon name="task-checked" size="26rpx" color="#9B4508" />
</view>
<text class="card-title">就诊前准备</text>
</view>
<view class="dot-list">
<view class="dot-item" wx:for="{{ preparations }}" wx:key="*this">
<view class="dot"></view>
<text class="dot-text">{{ item }}</text>
</view>
</view>
</view>
<!-- ③ 温馨提示:通用注意事项,不涉及具体规则 -->
<view class="card">
<view class="card-head">
<view class="card-mark">
<t-icon name="error-circle" size="26rpx" color="#9B4508" />
</view>
<text class="card-title">温馨提示</text>
</view>
<view class="dot-list">
<view class="dot-item" wx:for="{{ tips }}" wx:key="*this">
<view class="dot"></view>
<text class="dot-text">{{ item }}</text>
</view>
</view>
</view>
<!-- 底部出口:看完指南直接去下单,兜底可转人工客服 -->
<view class="guide-cta" bindtap="goToServiceList">
<text class="guide-cta-text">查看陪诊服务</text>
<t-icon name="chevron-right" size="28rpx" color="#FFFFFF" />
</view>
<view class="guide-help" bindtap="goToContact">
<t-icon name="call" size="28rpx" color="#9B4508" />
<text class="guide-help-text">还有疑问?联系人工客服</text>
</view>
<view class="footer-space"></view>
</view>
</view>