This commit is contained in:
lik
2026-10-02 11:56:08 +08:00
parent 55a9c7e3e8
commit 63ad613fab
6 changed files with 182 additions and 118 deletions
+42 -36
View File
@@ -11,58 +11,64 @@
</view>
</view>
<!-- ① 头部:参考图的大字标题排版。去掉整块色面板,标题直接落在暖白纸面上,
靠字号/字重建立重心,视觉更轻、更透气 -->
<!-- ① 头部:大字标题 + 信任数据条 + 主 CTA。
陪诊是高信任门槛决策,首屏先给可验证的事实(认证 / 覆盖 / 评价),
再给「立即预约」的直达入口;指南降为次级文字链 -->
<view class="hero">
<view class="hero-title">
<!-- 不用逗号断句:靠「暖橙强调 + 深墨正文」的色差自然切分两个短句 -->
<text class="hero-title-accent">专业陪诊</text>
<text class="hero-title-main">让就医更省心</text>
</view>
<text class="hero-sub">实名认证陪诊师 · 经验丰富 · 熟悉各大医院流程</text>
<!-- 主行动按钮:通栏胶囊。首屏先引导新用户了解服务(陪诊指南),
服务列表入口放在指南页底部,转化路径为「指南 → 查看服务」 -->
<view class="hero-cta" bindtap="goToGuide">
<text class="hero-cta-text">陪诊指南</text>
<!-- 信任数据条:三项硬事实并列,替代原先的形容词副标题 -->
<view class="trust-row">
<view class="trust-item">
<text class="trust-num">100%</text>
<text class="trust-label">实名认证</text>
</view>
<view class="trust-sep"></view>
<view class="trust-item">
<text class="trust-num">三甲</text>
<text class="trust-label">熟悉流程</text>
</view>
<view class="trust-sep"></view>
<view class="trust-item">
<text class="trust-num">24h</text>
<text class="trust-label">在线响应</text>
</view>
</view>
<!-- 主行动按钮:通栏胶囊,直达服务列表(下单路径最短化) -->
<view class="hero-cta" bindtap="goToBooking">
<text class="hero-cta-text">立即预约</text>
<t-icon name="chevron-right" size="28rpx" color="#FFFFFF" />
</view>
</view>
<!-- ② 客服与联系:两张同款白卡并排,图标统一走浅橙衬底 -->
<view class="contact-row">
<view class="contact-card" bindtap="goToAiChat">
<view class="contact-icon">
<!-- 用品牌 AI 图标(气泡内 AI 字),已按调色板着色为 #9A3412 -->
<image class="contact-icon-img" src="/images/ai-ink.png" mode="aspectFit" />
</view>
<view class="contact-info">
<text class="contact-name">在线咨询</text>
<text class="contact-en">AI 客服</text>
</view>
</view>
<!-- 联系我们不再是直接拨号,改为进入独立页(页内可拨号/复制/看工作时间) -->
<view class="contact-card" bindtap="goToContactPage">
<view class="contact-icon">
<t-icon name="call" size="32rpx" color="#9A3412" />
</view>
<view class="contact-info">
<text class="contact-name">联系我们</text>
<text class="contact-en">人工客服</text>
</view>
</view>
</view>
<!-- ③ 陪诊服务:白卡内 4 列两项宫格,浅橙衬底 + 暖橙线图标 -->
<!-- ② 陪诊服务:先一句话说清「陪诊是什么」,再列具体服务。
新用户往往不了解这个品类,介绍卡承担教育职责,
也是本区块的视觉锚点(浅橙衬底),下方宫格保持安静 -->
<view class="section">
<view class="section-head">
<view class="section-bar"></view>
<text class="section-title">陪诊服务</text>
</view>
<view class="intro-card" bindtap="goToGuide">
<text class="intro-desc">陪诊师全程陪同就医:代办挂号缴费、取药取报告,帮你向医生讲清病情要点,让家人看病不再手忙脚乱。</text>
<view class="intro-steps">
<text class="intro-step">线上约定</text>
<text class="intro-step-arrow">→</text>
<text class="intro-step">院内陪同</text>
<text class="intro-step-arrow">→</text>
<text class="intro-step">诊后反馈</text>
</view>
</view>
<view class="assist-card">
<view class="assist-grid">
<view class="assist-item" wx:for="{{ escortServices }}" wx:key="id" data-id="{{ item.id }}" bindtap="goToServiceDetail">
<!-- 细线图标:图形由 index.wxss 内嵌 SVG 提供,类名后缀是服务 id。
不加衬底方块,避免 8 个同色浅橙块平铺 -->
不加衬底方块,避免同色浅橙块平铺 -->
<view class="assist-icon {{ item.iconClass }}"></view>
<text class="assist-name">{{ item.name }}</text>
</view>
@@ -70,7 +76,7 @@
</view>
</view>
<!-- ④ 常用功能:待服务提醒 + 双列入口卡 -->
<!-- ③ 常用功能:待服务提醒 + 双列入口卡 -->
<view class="section">
<view class="section-head">
<view class="section-bar"></view>
@@ -85,8 +91,8 @@
</view>
<view class="quick-list">
<view class="quick-item" wx:for="{{ quickEntries }}" wx:key="id" data-item="{{ item }}" bindtap="onQuickEntryTap">
<!-- 两个入口统一走暖橙 + 浅橙衬底,不做色相区分 -->
<view class="quick-item {{ item.full ? 'quick-item-full' : '' }}" wx:for="{{ quickEntries }}" wx:key="id" data-item="{{ item }}" bindtap="onQuickEntryTap">
<!-- 入口统一走暖橙 + 浅橙衬底,不做色相区分;带 full 标记的卡通栏排布 -->
<view class="quick-icon">
<t-icon name="{{ item.icon }}" size="34rpx" color="#9A3412" />
</view>
@@ -98,7 +104,7 @@
</view>
</view>
<!-- ⑤ 页脚:B 端合作入口(商务合作 / 陪诊师入驻 / 陪诊师考证),
<!-- ④ 页脚:B 端合作入口(商务合作 / 陪诊师入驻 / 陪诊师考证),
点击统一转服务电话,与「我的」页页脚同构 -->
<view class="page-footer">
<view class="footer-links">