From 428fb7c52c2539ee443ec4ead8383ebdac8f352f Mon Sep 17 00:00:00 2001 From: lik Date: Sun, 4 Oct 2026 19:06:45 +0800 Subject: [PATCH] =?UTF-8?q?AI=E5=92=8CMine=E9=A1=B5=E9=9D=A2=E7=9A=84?= =?UTF-8?q?=E6=A0=B7=E5=BC=8F=E6=94=B9=E6=88=90=E6=96=B0=E6=A0=B7=E5=BC=8F?= =?UTF-8?q?=E4=BA=86=E3=80=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- _verify.ps1 | 7 - app.json | 2 +- app.wxss | 34 ++++- custom-tab-bar/index.js | 14 +- custom-tab-bar/index.wxml | 10 +- custom-tab-bar/index.wxss | 9 +- doc/DESIGN.md | 179 ++++++++++++---------- doc/PROJECT_GUIDE.md | 127 ++++++---------- doc/RERACT_PLAN.md | 83 +++++++++++ images/ai-ink.png | Bin 3303 -> 3302 bytes images/home-ink.png | Bin 0 -> 3807 bytes pages/ai/aichat.wxml | 150 +++++++++---------- pages/ai/aichat.wxss | 294 +++++++++++++++++++++---------------- pages/escort/itemlist.js | 6 +- pages/escort/itemlist.wxml | 8 +- pages/escort/itemlist.wxss | 50 +++---- pages/home/index.wxml | 2 +- pages/home/index.wxss | 67 +++------ pages/mine/mine.js | 5 +- pages/mine/mine.wxml | 13 +- pages/mine/mine.wxss | 167 ++++++++++----------- 21 files changed, 643 insertions(+), 584 deletions(-) delete mode 100644 _verify.ps1 create mode 100644 doc/RERACT_PLAN.md create mode 100644 images/home-ink.png diff --git a/_verify.ps1 b/_verify.ps1 deleted file mode 100644 index fa65c5a..0000000 --- a/_verify.ps1 +++ /dev/null @@ -1,7 +0,0 @@ -Add-Type -AssemblyName System.Drawing -$bmp = [System.Drawing.Bitmap]::FromFile('d:\work\health\code\ws_health\ui\wxapp_escort\images\home-green.png') -$p = $bmp.GetPixel(64, 64) -Write-Host "home-green center: $($p.R),$($p.G),$($p.B)" -$bmp.Dispose() -Remove-Item 'd:\work\health\code\ws_health\ui\wxapp_escort\_reicon.ps1', 'd:\work\health\code\ws_health\ui\wxapp_escort\_sample.ps1' -ErrorAction SilentlyContinue -Write-Host 'temp scripts cleaned' \ No newline at end of file diff --git a/app.json b/app.json index df6bab4..379840a 100644 --- a/app.json +++ b/app.json @@ -27,7 +27,7 @@ "tabBar": { "custom": true, "color": "#999999", - "selectedColor": "#C2410C", + "selectedColor": "#B8520A", "backgroundColor": "#FFFFFF", "borderStyle": "black", "list": [ diff --git a/app.wxss b/app.wxss index f7113ed..012c688 100644 --- a/app.wxss +++ b/app.wxss @@ -1,7 +1,39 @@ /**app.wxss**/ page { - /* 品牌翠绿:#22A45D 为基准色(第 7 档),向浅/深各展开数档。 + /* ===== 全站配色令牌 · 唯一来源(改配色只改这里)===== + 各页 page{} 不再重复定义这份色板。本文件先注入、页面 wxss 后注入, + 同特异度下页面胜出,所以某页确需例外时仍可在自己的 page{} 里覆盖同名变量。 + 仍有四处硬编码走不了变量,改色时须一并手改(清单见 doc/DESIGN.md §7.3): + t-icon 的 color 属性、app.json 的 tabBar.selectedColor、 + 首页 base64 内嵌线图标的 stroke、images/ai-ink.png 位图。 + 主色沿革(#C2410C H18/L40 → #B8520A H25/L38)与逐文件回滚清单见 DESIGN.md §七 */ + --brand-strong: #B8520A; /* 主按钮 / 选中态 / 实心强调块:白字 4.94:1、纸面 4.66:1、白卡 4.94:1,过 AA */ + --brand-soft: #FFF4E8; /* 浅橙衬底:图标底、标签底、按钮按下态 */ + --brand-line: #FFE0C2; /* 浅橙衬底的描边 */ + --brand-ink: #9B4508; /* 浅橙底 / 纸面上的文字与线图标:浅橙底 5.96:1、纸面 6.10:1,过 AA */ + + /* 中性:暖灰阶,与暖白纸面同温(冷灰会让白卡边缘发青) */ + --ink: #2B2521; + --ink-2: #4A4038; + --muted: #6F655C; /* 纸面 5.37:1 / 白卡 5.69:1 / 浅橙底 5.24:1,过 AA 正文。 + 历史值 #7A7068 落在纸面上只有 4.56:1,已废弃 */ + --faint: #A79C92; /* 仅用于非文字装饰 */ + --line: #ECE3D6; /* 米色发丝边。原 #F0E9E0 在纸面上只有 1.12:1,而白卡与纸面的 + 填充差本身只有 1.06:1——边界全靠这条边,故压深一档: + 纸面 1.20:1 / 白卡 1.27:1 */ + --sep: #E5DACC; /* 分隔线专用:比 --line 深一档,浅橙底上才看得见 */ + --paper: #FAF8F5; /* 暖白纸面。原 #FAF6F0 的 R−B=10,黄度偏重、大面积铺开会被读成 + "旧纸/发闷";压到 R−B=5 后黄度减半,明度反而略升 + (L* 97.0 → 97.7),暖白身份保留 */ + --white: #FFFFFF; + + /* 阴影:偏移与模糊半径都保持"小偏移、小模糊"的锐利档 */ + --shadow-card: 0 2rpx 10rpx rgba(63, 43, 25, 0.07); /* 白面一律走中性阴影 */ + --shadow-cta: 0 2rpx 8rpx rgba(184, 82, 10, 0.16); /* 只给实心 CTA、品牌印记这类小体量元素 */ + + /* --- 以下与上面的色板无关,是待收口的历史遗留(见 DESIGN.md §5.2)--- + 品牌翠绿:#22A45D 为基准色(第 7 档),向浅/深各展开数档。 首页主视觉已确定该绿为品牌主色,全站令牌与之对齐, 避免二级页沿用旧橙色造成首页与内页两套配色。 */ --td-brand-color-1: #f0faf3; diff --git a/custom-tab-bar/index.js b/custom-tab-bar/index.js index 8034c78..c811df0 100644 --- a/custom-tab-bar/index.js +++ b/custom-tab-bar/index.js @@ -1,11 +1,12 @@ // 自定义 tabBar:固定在底部,选中态只换颜色、不换图形。 -// 「首页 / 我的」走 TDesign 线性图标字体;「AI客服」用品牌 AI 图标 -// (气泡内 AI 字位图):灰色版 ai.png 为未选中态,暖橙版 ai-ink.png 为选中态, -// 与文字颜色同步切换,保持选中可辨 +// 三个 tab 统一走 TDesign 线性图标字体:home / chat-bubble / user。 +// 「AI客服」曾用位图(气泡内嵌 AI 字:灰色 ai.png、暖橙 ai-ink.png)当图标, +// 其轮廓笔画比图标字体细一档,与另外两个并排时粗细不搭,故弃用。 +// 位图文件仍留在 images/ 下未删(app.json 的 tabBar 项也在引用,见 DESIGN.md §5.2) Component({ data: { selected: 0, // 当前选中项,由各 tab 页在 onShow 里同步 - activeColor: '#C2410C', // 选中:暖橙深一档,白底 4.69:1,过 WCAG AA 正文标准 + activeColor: '#B8520A', // 选中:暖橙(色相 25°、保住原亮度),白底 4.94:1,过 WCAG AA 正文标准 inactiveColor: '#7A7068', // 未选中:暖灰,白底 4.83:1,过 WCAG AA 正文标准 list: [{ pagePath: '/pages/home/index', @@ -14,9 +15,8 @@ Component({ }, { pagePath: '/pages/ai/aichat', text: 'AI客服', - // 图片图标:配置了 imgPath 时优先于 icon 渲染 - imgPath: '/images/ai.png', - imgActivePath: '/images/ai-ink.png' + // 标准「聊天」图标:线性,与 home / user 同族 + icon: 'chat' }, { pagePath: '/pages/mine/mine', text: '我的', diff --git a/custom-tab-bar/index.wxml b/custom-tab-bar/index.wxml index 96a5fbc..ce24618 100644 --- a/custom-tab-bar/index.wxml +++ b/custom-tab-bar/index.wxml @@ -7,16 +7,8 @@ data-path="{{ item.pagePath }}" bindtap="onTap" > - - + `构建 npm` -4. 构建成功后,勾选 `将 JS 编译成 ES5` - -### 3. 添加底部导航图标 -需要在 `images` 目录下添加以下图标文件(PNG格式): -- `home.png` - 首页图标(未选中) -- `home-active.png` - 首页图标(选中) -- `mine.png` - 我的图标(未选中) -- `mine-active.png` - 我的图标(选中) - -### 4. 添加默认头像 -在 `images` 目录下添加 `default-avatar.png` 作为默认头像图片 - -## 项目结构 +## 目录结构 ``` -attendant-wechat/ -├── app.js # 小程序主入口 -├── app.json # 小程序全局配置 -├── app.wxss # 小程序全局样式 -├── sitemap.json # 站点地图配置 -├── package.json # 项目依赖配置 -├── project.config.json # 项目配置文件 -├── pages/ # 页面目录 -│ ├── index/ # 首页 -│ │ ├── index.wxml # 页面结构 -│ │ ├── index.wxss # 页面样式 -│ │ ├── index.js # 页面逻辑 -│ │ └── index.json # 页面配置 -│ └── mine/ # 我的页面 -│ ├── mine.wxml # 页面结构 -│ ├── mine.wxss # 页面样式 -│ ├── mine.js # 页面逻辑 -│ └── mine.json # 页面配置 -└── images/ # 图片资源目录 - ├── home.png # 首页图标 - ├── home-active.png # 首页图标(选中) - ├── mine.png # 我的图标 - ├── mine-active.png # 我的图标(选中) - └── default-avatar.png # 默认头像 +app.js / app.json / app.wxss 全局入口、页面与 tabBar 配置、色板令牌 +custom-tab-bar/ 自定义底部导航(fixed 在底部,各 tab 页需自备底部占位) +pages/ 页面(清单见下) +utils/ + request.js HTTP 封装(基址、appId、token 头) + api.js 接口定义 + chatmsg.js AI 客服 WebSocket +doc/ + DESIGN.md 配色规范(全站唯一色板来源) + PROJECT_GUIDE.md 本文件 ``` -## 页面说明 +## 页面 -### 首页 (pages/index) -- 欢迎卡片:显示应用名称和欢迎语 -- 快捷功能:今日值班、值班表、值班记录 -- 统计信息:显示值班相关统计数据 +| 路径 | 说明 | +|---|---| +| `pages/home/index` | 首页 | +| `pages/ai/aichat` | AI 客服 | +| `pages/escort/itemlist` | 陪诊服务列表 | +| `pages/escort/itemdetail` | 服务详情 / 下单 | +| `pages/escort/attendantlist` | 陪诊师列表 | +| `pages/escort/recordlist` | 订单记录 | +| `pages/escort/recorddetail` | 订单详情 | +| `pages/escort/agreement` | 用户协议 | +| `pages/escort/guide` | 服务指南 | +| `pages/health/profilelist` | 健康档案列表 | +| `pages/health/profileedit` | 档案编辑 | +| `pages/mine/mine` | 我的 | +| `pages/mine/about` | 关于 | +| `pages/mine/contact` | 联系我们 | +| `pages/hospital/contact` | 医院联系 | +| `pages/hospital/ranking` | 医院排行 | +| `pages/home/webview` | 网页容器 | -### 我的 (pages/mine) -- 用户信息卡片:显示用户头像和昵称 -- 功能菜单:个人信息、我的值班、值班统计、设置、帮助与反馈、关于 -- 退出登录:退出当前账号 +## 约定 -## 使用的 TDesign 组件 -- `t-button`: 按钮组件 -- `t-cell`: 单元格组件 -- `t-cell-group`: 单元格组组件 -- `t-icon`: 图标组件 -- `t-avatar`: 头像组件 -- `t-card`: 卡片组件 -- `t-divider`: 分割线组件 -- `t-badge`: 徽标组件 - -## 注意事项 -1. 确保微信开发者工具的基础库版本 >= 2.12.0 -2. 安装依赖后必须执行"构建 npm"操作 -3. 建议在真机上测试,部分功能可能与模拟器有差异 -4. 图标文件尺寸建议:未选中状态 81x81px,选中状态 81x81px - -## 下一步开发建议 -1. 实现用户登录功能 -2. 对接后端 API,获取真实的值班数据 -3. 添加数据缓存机制,提升用户体验 -4. 实现消息通知功能 -5. 添加数据导出功能 +- **配色**:见 `doc/DESIGN.md`。色板令牌集中在 `app.wxss` 的 `page{}`,改配色只改这一处。 +- **接口**:统一走 `utils/request.js`,基址 `https://api.huashengtec.com`(本地调试可改用文件内注释的 `127.0.0.1:9004`);请求自动携带 `appId=wxapp-escort` 与登录 token。 +- **登录**:`app.js` 的 `onShow` 调 `wx.login` 换 token,存于 `globalData.user`。 +- **全局数据**:服务列表 / 协议 / 医院信息 / 排行在 `onLaunch` 预取,挂到 `globalData` 供各页取用。 \ No newline at end of file diff --git a/doc/RERACT_PLAN.md b/doc/RERACT_PLAN.md new file mode 100644 index 0000000..7f51995 --- /dev/null +++ b/doc/RERACT_PLAN.md @@ -0,0 +1,83 @@ +# 页面重构进度台账 + +**用途**:记录哪些页面已并入暖橙体系、哪些还停在旧体系,以及下一步的推进顺序。 +**分工**:配色标准、令牌表、状态色、回滚方法一律以 [DESIGN.md](./DESIGN.md) 为准(本文不重复);本文只管「进度 + 顺序 + 每页动作」。 + +--- + +## 一、已完成(4 页) + +| 页面 | 完成 | 主要动作 | +|---|---|---| +| `home/index`(首页) | 更早 | 暖白纸面 + 白卡语言重建:hero(大标题 / 场景行 / 通栏主 CTA)→ 陪诊服务(白卡宫格 + 浅橙介绍卡)→ 常用功能(青绿待服务条 + 双列 / 通栏卡)→ 页脚文字链。页内旧令牌副本已删 | +| `escort/itemlist`(陪诊服务列表) | 更早 | 页首短横色标 + 引导,说明白卡(开通城市 / 费用披露 + 两个入口),三组「通栏白底 + 章线」价目表,空心环「预约」按钮,浅橙收口页脚卡。页内旧令牌副本已删 | +| `mine/mine`(我的) | 2026-10-04 | 并入暖橙体系 + 首页白卡语言:纸面底、头像与昵称直接落纸面、菜单白卡(图标走 `--brand-ink`)、页脚细竖线分隔。默认头像改用暖墨品牌标记 `images/home-ink.png`。删掉一批死样式(`.user-phone`、`.avatar-btn`、昵称输入等) | +| `ai/aichat`(AI 陪诊助手) | 2026-10-04 | 整页重设计:纸面底 + 消息列表(头像行在上、气泡在下,用户消息整条靠右并把时间镜像到头像左侧);AI 与用户头像统一底座(浅橙底 + 暖橙描边),身份只由图形区分(品牌标记 / 人像);AI 声明由页底常驻行改为挂在每条 AI 气泡下方;清空入口移到输入框下方做成空心描边小按钮;全页圆角统一 20rpx。附带修复滚动布局(`.message-list` 补 `min-height: 0`,消息超一屏后输入区不再被顶出视口) | + +> DESIGN.md §5.1 已同步登记 `mine/mine.wxss`、`ai/aichat.wxss` 两页迁移完成。 + +--- + +## 二、待重构(13 页 / 22 个文件) + +按"离规范的距离"分三档,**建议从上往下推进**——同档内先易后难。 + +### A. 旧暖橙副本(最接近,只差删副本 + 对值)|4 页 8 文件 + +页内各带一份 `page{}` 令牌副本,停在 `#C2410C` / `#9A3412`;结构基本可用。 + +| 页面 | 文件 | 动作 | +|---|---|---| +| `escort/itemdetail` | `.wxss` `.wxml` | 删页内令牌副本(改读 app.wxss),`t-icon` 的 `color` 手改 `#9B4508` | +| `escort/attendantlist` | `.wxss` `.wxml` | 同上 | +| `escort/guide` | `.wxss` `.wxml` | 同上 | +| `mine/contact` | `.wxss` `.wxml` | 同上 | + +### B. 旧金色体系(`#D4A853` 系,改动最大)|9 页 + 3 组件/JS + +| 页面 | 文件 | 动作 | +|---|---|---| +| `mine/about` | `.wxss` | 按 §5.3 映射表整体换色 | +| `mine/comp_address` | `.wxss` `.wxml`(`switch` 属性值需硬编码) | 同上 | +| `mine/comp_profile` | `.wxss` | 同上 | +| `health/profilelist` | `.wxss` `.wxml` `.js`(`confirmColor`) | 同上 | +| `health/profileedit` | `.wxss` | 同上 | +| `escort/recordlist` | `.wxss` | 换色 + 状态四档 | +| `escort/recorddetail` | `.wxss` `.wxml` | 换色 + 状态四档 | +| `escort/agreement` | `.wxss` | 底 `#FAF6F1` → `--paper`,其余按映射表 | + +### C. 绿灰系(另一套冷色,需整体并入)|2 页 + +| 页面 | 文件 | 动作 | +|---|---|---| +| `hospital/contact` | `.wxss` | 底 `#F5F7F6`、字 `#1F2937`、绿灰线一并换成纸面 / 暖墨 / 暖线 | +| `hospital/ranking` | `.wxss` | 同上 | + +### D. 无需处理 + +| 页面 | 说明 | +|---|---| +| `home/webview` | 仅一个 ``,无色值 | + +### 组件与 JS 里的硬编码(易漏) + +`comp_address.wxml` 的 `switch` 属性、`profilelist.js` 的 `confirmColor` 走的是**属性值**,读不到 CSS 变量,必须硬编码暖橙。 + +--- + +## 三、系统级收口(不属任何页面) + +沿用 DESIGN.md §5.2,共 4 项:`app.json` 的 tabBar 绿色选中图标、tabBar `color: #999999`、`app.wxss` 里整套翠绿死代码(`--td-brand-color-1..10`、`--c-ink`)、`custom-tab-bar` 未选中灰 `#7A7068`。建议放在页面重构全部完成后一次做完,避免边改边漏。 + +--- + +## 四、每页收工自检 + +1. 灰度化后层级是否仍清楚(去掉颜色不散架)。 +2. 色相数量:暖橙 + 暖墨 + 至多一个状态色。 +3. 最浅的那行字是否 `--muted` 或更深。 +4. 中文最小 24rpx、正文对比度 ≥ 4.5:1(大字 ≥ 3:1)、图标 ≥ 3:1。 +5. 可点项是否有显性暗示,热区是否 ≥ 56rpx。 +6. 页面是否还有 `page{}` 级令牌副本;有则删掉,回归 app.wxss 唯一来源。 + +> 详细判据见 DESIGN.md「六、一句话检验」。 \ No newline at end of file diff --git a/images/ai-ink.png b/images/ai-ink.png index 51b9e15b890716f55c3372f8bb7d8542c8ebdf9e..5bc5f0e865d317d93341313f66da9374563526d9 100644 GIT binary patch delta 2689 zcmZ9OdpOgJAIDwVl)2=RyCf%anUFhE6xBKD=qOgRWwMYB8=Fb`%0eMdt%i_WsWfbE zV_`O-ERyTo*}`)S6>=%*IDh<}-*e9AkI(bGp3n37{PlU>&udn5M)OY}AokR8*K=gl z!dTE7sIO+y)aIY$(@Z<-<4mxP8vSg5YeJ*4)2ew2G-ZD+oY6j>ARBOQUY7zhx!Nbt zmQ4Z0-eGFb{=@%9*rYN(YSbt_gDQNmPPlG&Lz$Dx$xj4SL_gQ%IR}#cItt7>s@bGR z;OIB{_#fnx4JIzyL9c;pZbN;p$i7o!)!gA)6>EF^;N53!vn{qg8ZNpScU~sf#8g__ zyV|8^z6Mw=w#^T&+nm`sjOAMyYvtZfecd8dL7QGv?bcq^v_uuNN`_n`KcI-bzr@>t1_IboQdVj$|l7utU| z+sx7U*&e9KvHlOfZ@Un#ndzc;|JlAZY! z(2@Q024tHR6KhrseH9a=qveA#vKHKfv^%O_3%~OrJQdt*RY|W^csD5g1C7CXQgkOD zvlkY0-*6ZD$;Cten%8i9B9-%`KYe{`)T+wzF?iku{SE;1aP`EX4i!^+QcL9 z;7ShzOpCKLi)Idg=M7*q#p47-@1z#_CR*O~I~l%Mq*+mf%cJ4GDxac2@gJ7>439nI zDzsO@pFGjx+Gbn9deKD+w9%68ns}&{z-7S(^u;{`_?tL%{atH;)Tib$eGF?SA4$(3 zhKTFZZ~^r-fVIG_Hx$YK9ggRJB;+2OYlNz>SbXM|6839wNf%z1uoBp{C_ zE)B?mqoDG((p= zq~EqrYYYZ0n21X=T#@6URjvCN~JP~gxDWaEQd%n@!3_xC< zm+;p`(ke$l^L0{_5QiUdM&@EGG%^@Env;X7)+Py3TFP{rzAIA&KyeK`QHMl`gf6mM~^? zm4#K`FfZWl$vVn4X;I-3l6qFWO6Mk+3lF~uw)aQp+TOPix?HJiJN8Qj6;riA29kHF zM?iZ2fIsLL$s5!}kiD}xJVkRx>N#zs?Hnndl~f~nH#$g*{=DgnN$fdz*Y3H+)AsY3 z06&iNL&3;ngN5_N$dIqYwVP|Ja(_@aKnEqCQTKxnNcK`sf(>_uFoYTCMA0Ud1l}k4 zgPI98-0n@_S>Q5nZV{qlebK3-gdr{0W3ZFB_C6oN|Eq`3n`ewYk+^gikI z7D$4{DuO7jIv+SneYG`%HwU_;RMlYUyUVnq*|*uO!eUjyBDli859YD392Org1<&)( z%ABtLI>I1)dCSP<37nb>L{eVSTK?{<{SMV(?IR?hVD@lJ2h`8VO!4w32}*{X(AsNF zz3OY)`Gog11C8n9t0JXb7y2l#innAjqhQe?IQrQ}?j?iq*9Liy%V^-&__xZ?AmsG| zZimd8fJU*5jz8-mLm7I$E~q>&r!YukyA7O8tmyp zH(!8y%mz74vWX=19!@%cd1t#o(j#Aghi@8t*($t%ofUsGCbH~$6l`yyGF>EZ5w67MJpN~{WvLLgnubbFBy7nDhUnL@%y_<@@g0t%vo#jH&E-9u0`l!glxRKR70;=Mj9T7@e?+hb;AO;Qog< z)S=HH`GM!!87KfgTd4SBG>7fHP$}%fq;04oK1|B86cKMKYpEU|_{6--eW0!TK5_f5 znvk0SH#y6rQK4F@e%6*B1!{HOeM6MHUB?wY)iYj3?1Xj*y*m1rWkeNdj-Ik!fpCB1 zN-CQe;#K`uzK_d0!Umm@>cV zEzn2fhIeg8P0j&&b76k$XBKE;ia9|~HJ|=nA=F!il;s3gyqDE-8{!)#lX}*p0bOi& zSTRduzGJ?yq4UYhJ(1!FBVJzD7uN~|=}J;50_o&Q*|YMIDc`4V>#P`0#$8>w5OtEW zhbWo_UcIL183w|m$G2M5tl?Y(H!!1tqA?~(6uMrloFXEIl_bm?g#tqsiGrV z^vPCPZN9CLoz;{(yF{cOf`Xs8;@<`zzW6jHn~u^+cKToL_HS4Fui5=?+S(+&1$prX@%jEhNwmav NopL{Oyxh${;cpHYLvjEB delta 2690 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 IN5eAy0-&iw^#A|> diff --git a/images/home-ink.png b/images/home-ink.png new file mode 100644 index 0000000000000000000000000000000000000000..3f190e8d214d9e94456f4052844106de1ad5901f GIT binary patch literal 3807 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 literal 0 HcmV?d00001 diff --git a/pages/ai/aichat.wxml b/pages/ai/aichat.wxml index 12c37a4..3f1a213 100644 --- a/pages/ai/aichat.wxml +++ b/pages/ai/aichat.wxml @@ -1,93 +1,82 @@ - - + - + AI陪诊助手 我是您的智能陪诊助手,可以为您解答陪诊相关问题 - {{item}} + - + - - - - - - - {{item.content}} - - - {{item.time}} + + + + - + + + + + {{item.time}} + - - - - + + + + {{item.content}} + - - - - {{item.content}} - - - {{item.time}} - - + + 内容由AI生成,仅供参考 + - + - + + + + + @@ -103,36 +92,29 @@ - - - - 清空聊天 - - - + - - - - - - - + + + - - - 本服务为AI生成内容,结果仅供参考。 + + + + 清空聊天 \ No newline at end of file diff --git a/pages/ai/aichat.wxss b/pages/ai/aichat.wxss index 1139f12..90df033 100644 --- a/pages/ai/aichat.wxss +++ b/pages/ai/aichat.wxss @@ -1,45 +1,65 @@ +/* 配色令牌来自 app.wxss(全站唯一来源),本页不留副本。 + 整体沿用首页的「暖白纸面 + 白卡 + 浅橙衬底」语言: + AI 气泡走白卡(白面 + 2rpx 发丝边),用户气泡走浅橙衬底,避免实心橙泛滥。 */ .chat-container { display: flex; flex-direction: column; height: 100vh; box-sizing: border-box; - /* 给 fixed 的自定义 tabBar 留位;安全区由这里统一承担,输入区不再重复加 */ - padding-bottom: calc(140rpx + env(safe-area-inset-bottom)); - background-color: #F5F5F5; - position: relative; + /* 页面自身不滚,滚动只交给中间的消息区; + overflow: hidden 是兜底,避免任何子项溢出到视口外变成"看得见滑不到" */ + overflow: hidden; + /* 给 fixed 的自定义 tabBar 留位;安全区由这里统一承担,输入区不再重复加。 + tabBar 实测高度 = 12+12 内距 + 44 图标 + 6 间距 + 24 文字 + 2 边框 = 100rpx(+安全区)。 + 140 → 120 → 112rpx:按钮下边只剩 12rpx(6px) 空隙,已贴近下限—— + 再往下(<100rpx)胶囊就会被 tabBar 盖住;这 12rpx 同时是防微信字体放大 + 把 tabBar 撑高的缓冲,不宜再压 */ + padding-bottom: calc(112rpx + env(safe-area-inset-bottom)); + background-color: var(--paper); } -/* 清空按钮 */ +/* ===== 清空入口(在输入区下方)===== */ +/* 空心描边小按钮:2rpx 暖橙描边、无填充。 + 清空是低频破坏性动作,用"只描边"与输入区右侧那个浅橙底发送键区分开; + 描边在纸面上 4.66:1、文字 6.10:1,均过线。 + 圆角 20rpx 与输入框、发送键、气泡同档——全页统一为圆角矩形,不再有胶囊 + 容器是 column,靠 align-self: flex-end 右对齐,不必再套一层行容器 */ .clear-btn { + align-self: flex-end; display: flex; align-items: center; - justify-content: flex-end; - gap: 6rpx; - padding: 12rpx 24rpx; - background-color: #FFFFFF; - border-top: 1rpx solid #EEEEEE; + gap: 8rpx; + flex-shrink: 0; + /* 上 12 贴住输入区,右 32 对齐页面页边距;下不留边距,底部空气统一交给容器 */ + margin: 12rpx 32rpx 0; + padding: 10rpx 26rpx; + border-radius: 20rpx; + border: 2rpx solid var(--brand-strong); + transition: transform 0.15s ease; } .clear-btn:active { - opacity: 0.7; + transform: scale(0.96); } -.clear-text { - font-size: 22rpx; - color: #999999; +.clear-btn-text { + font-size: 24rpx; + font-weight: 500; + color: var(--brand-ink); + letter-spacing: 1rpx; } -/* 消息列表区域 */ +/* ===== 消息列表 ===== */ .message-list { flex: 1; + /* 关键:flex 子项的自动最小高度是「内容高度」,消息多于一屏后它就不肯收缩, + 会把 100vh 的容器撑破、把下方输入区顶出视口(且因容器锁死高度而滑不回来)。 + 置 0 后它才能正确收缩到剩余空间,并触发 scroll-view 自身滚动 */ + min-height: 0; padding: 20rpx 0; } -.message-list.has-messages { - padding-top: 20rpx; -} - -/* 欢迎区域 */ +/* ===== 欢迎区 ===== */ .welcome-area { display: flex; flex-direction: column; @@ -48,30 +68,31 @@ text-align: center; } +/* 空态图标:浅橙衬底 + 暖陶土图标,替代原橙/绿渐变与彩色辉光 */ .welcome-icon { - width: 160rpx; - height: 160rpx; - border-radius: 50%; - background: linear-gradient(135deg, #D4A853 0%, #D4A853 100%); + width: 140rpx; + height: 140rpx; + margin-bottom: 32rpx; display: flex; align-items: center; justify-content: center; - margin-bottom: 40rpx; - box-shadow: 0 8rpx 32rpx rgba(255, 155, 51, 0.3); + border-radius: 40rpx; + background: var(--brand-soft); + border: 2rpx solid var(--brand-line); } .welcome-title { + margin-bottom: 12rpx; font-size: 40rpx; - font-weight: 600; - color: #333333; - margin-bottom: 16rpx; + font-weight: 700; + color: var(--ink); } .welcome-desc { + margin-bottom: 56rpx; font-size: 28rpx; - color: #999999; - margin-bottom: 60rpx; line-height: 1.6; + color: var(--muted); } .quick-questions { @@ -81,113 +102,142 @@ gap: 20rpx; } +/* 常见问题:首页白卡语言 + 右侧 chevron 做点击暗示 */ .quick-item { - background-color: #FFFFFF; - padding: 28rpx 32rpx; - border-radius: 16rpx; + display: flex; + align-items: center; + justify-content: space-between; + gap: 16rpx; + padding: 28rpx 28rpx 28rpx 32rpx; + background: var(--white); + border: 2rpx solid var(--line); + border-radius: 20rpx; + box-shadow: var(--shadow-card); font-size: 28rpx; - color: #333333; + color: var(--ink-2); text-align: left; - box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.06); - transition: all 0.2s ease; + transition: transform 0.15s ease; } .quick-item:active { transform: scale(0.98); - background-color: #FFF8F0; + background: var(--brand-soft); } -/* 消息项 */ +/* ===== 消息项 ===== */ +/* 头像在上、气泡在下;用户消息整条靠右 */ .message-item { display: flex; flex-direction: column; padding: 16rpx 24rpx; } -.message-item.ai { - align-items: flex-start; -} - .message-item.user { align-items: flex-end; } -/* 头像 */ +/* 头像行:头像在左,时间紧跟其右 */ +.message-head { + display: flex; + align-items: center; + gap: 12rpx; + margin-bottom: 10rpx; +} + +/* 用户侧镜像为「时间 → 头像」:整行仍贴右边缘,于是头像正好落在气泡右边缘上, + 与 AI 侧头像对齐气泡左边缘形成对称;时间退到头像左侧,不再顶在最右 */ +.message-item.user .message-head { + flex-direction: row-reverse; +} + +/* 头像底座:AI 与用户同构——浅橙衬底 + 2rpx 暖橙描边 + (浅橙块落在纸面上只有约 1.03:1,必须靠描边托形)。 + 身份只由图形区分:AI 是品牌标记,用户是人像图标; + 左右位置本来就把两者分开了,不必再用"实心橙 vs 浅橙"区分, + 否则同一列里两种底板并排出现会读成没做完 */ .avatar { - width: 72rpx; - height: 72rpx; - border-radius: 40%; + width: 64rpx; + height: 64rpx; display: flex; align-items: center; justify-content: center; + border-radius: 20rpx; + background: var(--brand-soft); + border: 2rpx solid var(--brand-line); flex-shrink: 0; } -.ai-avatar { - background: linear-gradient(135deg, #FF9B33 0%, #FF7A33 100%); - margin-bottom: 12rpx; - padding: 16rpx; - width: 46rpx; - height: 46rpx; +/* AI 的品牌标记用暖墨版 home-ink.png:白色版 home-w.png 只能压在实心色块上, + 落在浅橙底会看不见。 + 36rpx 与用户侧的 t-icon 同尺寸(两个图形的笔画都约占画布 95%),视觉齐平 */ +.avatar-img { + width: 36rpx; + height: 36rpx; } -.user-avatar { - background: linear-gradient(135deg, #4CAF50 0%, #45A049 100%); - margin-bottom: 12rpx; +/* 头像行里的时间:放头像右侧 */ +.message-time { + font-size: 22rpx; + color: var(--muted); } -/* 消息内容 */ +/* 头像已移到气泡上方,气泡不再被头像占位挤压,版心随之放宽: + 84% → 92%(约 646rpx),仍留一档余量不顶到屏幕边缘 */ .message-content { display: flex; flex-direction: column; - max-width: 95%; + min-width: 0; + max-width: 92%; } .message-item.user .message-content { align-items: flex-end; } -.message-item.ai .message-content { - align-items: flex-start; -} - -/* 消息气泡 */ +/* ===== 气泡 ===== */ .message-bubble { padding: 20rpx 24rpx; - border-radius: 16rpx; + border-radius: 20rpx; word-wrap: break-word; word-break: break-all; } +/* AI:白卡(白面 + 发丝边),安静、不与用户消息争色 */ .message-item.ai .message-bubble { - background-color: #FFFFFF; - border-top-left-radius: 4rpx; + background: var(--white); + border: 2rpx solid var(--line); + border-top-left-radius: 6rpx; } +/* 用户:浅橙衬底 + 暖陶土字,避免一排实心橙(浅橙底 5.96:1,过 AA)。 + 气泡落在纸面上,浅橙底与纸面明度差仅约 1.03:1,必须靠 2rpx --brand-line 描边托形 */ .message-item.user .message-bubble { - background: linear-gradient(135deg, #FF9B33 0%, #FF7A33 100%); - border-top-right-radius: 4rpx; + background: var(--brand-soft); + border: 2rpx solid var(--brand-line); + border-top-right-radius: 6rpx; } +/* 气泡正文 28 → 30rpx(15px):长回答连续阅读时 14px 偏吃力,上调一号。 + markdown 与纯文本两条路径同步,避免同一气泡里两种字号 */ .message-text { - font-size: 28rpx; + font-size: 30rpx; line-height: 1.6; } .message-item.ai .message-text { - color: #333333; + color: var(--ink-2); } .message-item.user .message-text { - color: #FFFFFF; + color: var(--brand-ink); } -/* Markdown 渲染区域 */ +/* Markdown 渲染区:字号与 .message-text 对齐(30rpx) */ .message-markdown { width: 100%; - font-size: 28rpx; - color: #333333; + font-size: 30rpx; line-height: 1.6; + color: var(--ink-2); } /* 表格在聊天气泡中的样式覆盖 */ @@ -196,7 +246,7 @@ max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; - border: 1rpx solid #E5E5E5; + border: 2rpx solid var(--line); border-radius: 8rpx; } @@ -223,16 +273,16 @@ } .message-markdown .t-chat-markdown-table__th { - background-color: #F5F5F5; + background-color: var(--brand-soft); font-weight: 600; - color: #333333; + color: var(--ink); } .message-markdown .t-chat-markdown-table__tr:nth-child(2n) { - background-color: #FAFAFA; + background-color: var(--paper); } -/* 代码块样式覆盖 */ +/* 代码块 */ .message-markdown .t-chat-markdown-codespan, .message-markdown .t-chat-markdown-code { font-size: 24rpx; @@ -241,16 +291,10 @@ .message-image { max-width: 400rpx; - border-radius: 8rpx; + border-radius: 12rpx; } -.message-time { - font-size: 20rpx; - color: #999999; - margin-top: 8rpx; -} - -/* 正在输入指示器 */ +/* ===== 正在输入 ===== */ .typing-bubble { padding: 24rpx 32rpx; } @@ -262,10 +306,10 @@ } .dot { - width: 16rpx; - height: 16rpx; + width: 14rpx; + height: 14rpx; border-radius: 50%; - background-color: #CCCCCC; + background-color: var(--brand-ink); animation: typing 1.4s infinite ease-in-out both; } @@ -288,62 +332,64 @@ } } -/* 输入区域 */ +/* ===== 输入区 ===== */ .input-area { - background-color: #FFFFFF; - padding: 20rpx 24rpx; - border-top: 1rpx solid #EEEEEE; -} - -.input-wrapper { display: flex; align-items: center; gap: 16rpx; + /* 钉在容器底部,不被消息区挤压 */ + flex-shrink: 0; + padding: 16rpx 24rpx; + background: var(--white); + border-top: 2rpx solid var(--line); } .message-input { flex: 1; - height: 72rpx; - background-color: #F5F5F5; - border-radius: 16rpx; + height: 76rpx; padding: 0 28rpx; + background: var(--paper); + border: 2rpx solid var(--line); + /* 20rpx = 10px:与气泡、常见问题卡、用户徽记的统一圆角档, + 比原 999rpx 胶囊更贴合"输入条"的体量(76rpx 高≈38px,10px 圆角约占四分之一) */ + border-radius: 20rpx; font-size: 28rpx; - color: #333333; + color: var(--ink); } .input-placeholder { - color: #AAAAAA; -} - -.input-actions { - display: flex; - align-items: center; - gap: 16rpx; + color: var(--muted); } +/* 发送按钮:默认浅橙底 + 描边,有内容时转实心暖橙(全页唯一的实心橙块)。 + 默认态落在白面输入区上,浅橙底同样靠 --brand-line 描边托形。 + 圆角由正圆(50%)改为 20rpx,与左侧输入框、上方气泡同档,成对出现 */ .action-btn { - width: 72rpx; - height: 72rpx; - border-radius: 50%; + width: 76rpx; + height: 76rpx; display: flex; align-items: center; justify-content: center; - background-color: #F5F5F5; - transition: all 0.2s ease; + border-radius: 20rpx; + background: var(--brand-soft); + border: 2rpx solid var(--brand-line); + flex-shrink: 0; + transition: all 0.15s ease; } .send-btn.active { - background: linear-gradient(135deg, #FF9B33 0%, #FF7A33 100%); + background: var(--brand-strong); + border-color: var(--brand-strong); } -/* AI声明 */ -.ai-disclaimer { - padding: 12rpx 24rpx; - text-align: center; - background-color: #F5F5F5; -} - -.ai-disclaimer text { - font-size: 22rpx; - color: #CCCCCC; +/* ===== AI 声明注释 ===== */ +/* 原为页面底部一行常驻声明,改为挂在每条 AI 回复的气泡正下方: + 既省下底部固定高度,又让声明紧贴它要限定的内容。 + 无背景无边框,靠 muted 小字安静收尾; + 24rpx 是中文最小可用字号下限(12px),不能再小 */ +.message-note { + margin-top: 8rpx; + font-size: 24rpx; + line-height: 1.5; + color: var(--muted); } \ No newline at end of file diff --git a/pages/escort/itemlist.js b/pages/escort/itemlist.js index 8e85d35..1283ed1 100644 --- a/pages/escort/itemlist.js +++ b/pages/escort/itemlist.js @@ -13,13 +13,13 @@ const SERVICE_GROUPS = [{ key: 'accompany', title: '陪同就医', - note: '老人、异地就医,或不便独自就诊的情况都适合。陪诊师提前确认院区路线与科室位置,就诊当天全程在场。', + note: '不熟悉医院流程、上班脱不开身、不便独自就诊的情况都适合,就诊当天有人全程陪着。', ids: [1, 2] // 全天陪诊 / 半天陪诊 }, { key: 'errand', title: '就医代办', - note: '本人不必到场。排队取号、递送材料、取报告这些跑动的事都可以交给我们,办完的结果原样带回。', + note: '代问诊、预约检查时间、取报告、办手续、开药等跑腿服务都可以代劳,本人不必到场。', ids: [3, 4, 5, 6] // 代问诊 / 检查预约 / 出入院代办 / 跑腿服务 }, { @@ -30,7 +30,7 @@ const SERVICE_GROUPS = [{ // 沿革:这里放过「打算长期使用」,因与另外两组的"要办的事"不同轴被改回口语, // 现在三组标题统一改成 4 字短语,它也就不再是异类 title: '多次使用', - note: '需要多次复诊或长期治疗时,一次买多次,省去反复下单的麻烦,每次按次使用。', + note: '需要多次复诊或长期治疗时,一次买多次,省去反复下单的麻烦。', ids: [7, 8] // VIP 5次 半天陪诊 / VIP 5次代买药 // 注:条目改单行横排后名称不再被半栏宽度挤压,这两个"VIP 5次 XXX"已恢复原名, // "买多次"由名称自己交代;组标题与副题仍负责讲清"什么情况选这一组" diff --git a/pages/escort/itemlist.wxml b/pages/escort/itemlist.wxml index 8b5a9e1..e8a7aec 100644 --- a/pages/escort/itemlist.wxml +++ b/pages/escort/itemlist.wxml @@ -22,12 +22,12 @@ 服务指南 - + 用户协议 - + @@ -87,13 +87,13 @@ 做成一张浅橙收口卡——与首页「常用功能」区块尾部的「联系我们」卡 (.quick-item-full)同源:--brand-soft 底 + 2rpx --brand-line 描边 + 去阴影。 首页每个区块都收在暖色卡上,本页原先四张白面一张暖色面都没有, - 暖色只剩"线"(竖条 / 按钮环 / 暖陶土字),整页因此比首页轻一档; + 暖色只剩"线"(竖条 / 按钮环 / 暖橙字),整页因此比首页轻一档; 这张卡就是补回来的那张"面",也是页尾唯一的暖色落点 --> 没有合适的? 联系人工客服 - + diff --git a/pages/escort/itemlist.wxss b/pages/escort/itemlist.wxss index 46e03d8..d753b72 100644 --- a/pages/escort/itemlist.wxss +++ b/pages/escort/itemlist.wxss @@ -25,11 +25,11 @@ - 项间虚线挂在 .ledger-row 上、通栏到卡的内边缘;每组最后一行不画 (.ledger-row:last-child)——卡的底边已经替它收了口,留着会叠出 "虚线 + 28rpx + 卡边发丝线"的双线。章线开、卡边收,每章仍是一张闭合的表 - - 按钮走"空心胶囊":3rpx --brand-strong 环 + 满圆角 + 暖陶土字(纸面 6.89:1), + - 按钮走"空心胶囊":3rpx --brand-strong 环 + 满圆角 + 暖橙字(纸面 6.10:1), 无填充无阴影,按下填 --brand-line。之所以不用填充,是因为按钮挪到价格左边后 与规格签撞了形——签是"浅橙底 + 小圆角",按钮若也做成"浅橙底 + 圆角", 同一行就出现两个同形物体,读起来是两个标签,分不清哪个能点。 - 现在签 = 暖陶土小字、按钮 = 满圆角空心环,一行只剩一个填充物。 + 现在签 = 暖橙小字、按钮 = 满圆角空心环,一行只剩一个填充物。 字重也从 700 降到 500:可点性改由环承担,字不必再靠粗度喊话 (代价是 500 在部分 Android 上会落回常规,详见 .book-btn 注释) - 价格按用户要求弱化:--muted + 字重 500(本页对 §2.1「价格数字」的例外,已登记) @@ -49,25 +49,11 @@ 落差只剩一处,且是分工使然:首页「立即预约」是实心 --brand-strong 胶囊(1 个主 CTA), 本页「预约」是 3rpx 空心环(8 个并列动作)——8 个实心橙排一列会撞 §2.1,故不跟 */ page { - --brand-strong: #C2410C; /* 按钮环、区块竖条:纸面上 4.89:1,过 AA 与非文本 3:1 */ - --brand-soft: #FFF4E8; /* 浅橙衬底,暖色的第二档;也是规格签的底 */ - --brand-line: #FFE0C2; /* 浅橙衬底描边;也是按钮按下时的填充 */ - --brand-ink: #9A3412; /* 浅橙衬底/纸面上的文字链:6.8:1,过 AA */ - - --ink: #2B2521; - --ink-2: #4A4038; - --muted: #6F655C; /* 纸面 5.28:1 / 白卡 5.69:1,过 AA 正文 */ - --line: #ECE3D6; /* 米色发丝边:纸面 1.20:1 */ - --sep: #E5DACC; /* 分隔线专用:竖分隔线 - (比 --line 深一档才看得见) */ - --paper: #FAF8F5; - --white: #FFFFFF; - - /* 白卡托形阴影:与首页 --shadow-card 同值,全站一套。 - 用中性暖墨而不是暖橙——DESIGN.md §2.3 把彩色阴影登记给"浅橙块托形", - 白面一律走中性;暖橙阴影会让白卡边缘泛出一圈暖晕,与首页的白卡不是同一种东西 */ - --shadow-card: 0 2rpx 10rpx rgba(63, 43, 25, 0.07); - + /* 配色令牌已上移到 app.wxss(全站唯一来源,改配色只改那一处),本页不再留副本; + 以下两段注释只作沿革留档。 + 主色:暖橙(色相 25°、明度 38°)。 + 曾试过右移到琥珀 #A85A00 以避开"锈橙 ≈ 干血",但为凑白字 AA 压低了明度(40%→33%), + 画面变闷、失掉醒目度;故折中定在 #B8520A——微出色相、保住原亮度与饱和 */ background-color: var(--paper); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; } @@ -297,13 +283,13 @@ page { color: var(--muted); } -/* ===== 规格签:暖陶土小字(按用户要求去掉左竖条) ===== +/* ===== 规格签:暖橙小字(按用户要求去掉左竖条) ===== 沿革:整圈描边 → 4rpx 左竖条 + 浅橙底(色标式)→ 现在只剩字 + 一层极浅的底。 去竖条的原因:页面上已经有一套竖条语言——三个组头的 8×36rpx 实心竖条。 每行再插一道 4rpx 小竖条,全页竖向重音就从 3 处涨到 11 处,与组头抢同一个记号。 签退回纯文字后,每行的竖条只剩组头一处,记号重新变回"章"级。 代价要记住:底仍是 --brand-soft,它落在白卡上只有 1.08:1(纸面上 1.02:1), - 实际都看不出来——签现在是"暖陶土字 + 一层几乎不可见的暖底", + 实际都看不出来——签现在是"暖橙字 + 一层几乎不可见的暖底", 辨识全部由字色承担。这也正是它当初选 --brand-ink(白卡 7.31:1)而不是 --brand-strong 的原因。 若日后想要一个看得见的签形,两条路: @@ -406,30 +392,30 @@ page { line-height: 1.7; } -/* ===== 预约:空心胶囊(鲜橙环 + 暖陶土字) ===== +/* ===== 预约:空心胶囊(暖橙环 + 暖橙字) ===== 沿革:描边版 → 实心 --brand-strong → 软色块 → 现在这版空心胶囊,第四次调整。 为什么又回到"无填充":上一版软色块本身没问题,问题是它挪到价格左边之后, - 和紧邻的规格签撞了形——签是"浅橙底 + 暖陶土字 + 小圆角",按钮也是 - "浅橙底 + 暖陶土字 + 圆角",两个同形物体在同一行相距 450rpx,读起来像两个标签。 + 和紧邻的规格签撞了形——签是"浅橙底 + 暖橙字 + 小圆角",按钮也是 + "浅橙底 + 暖橙字 + 圆角",两个同形物体在同一行相距 450rpx,读起来像两个标签。 签和按钮的身份不同:签是标签(静态、可无边界),按钮是控件(必须一眼看出能点)。 两者只能靠"形"分开,靠"深浅"分不开。于是这里把按钮做成一行里唯一的"环": - 签 = 浅橙底 + 暖陶土字,无框,也不再有左竖条; + 签 = 浅橙底 + 暖橙字,无框,也不再有左竖条; 按钮 = 满圆角空心环,无底。 同时它也不再是行内第二个浅色实心块,一行只剩一个填充物(签),主次不再打架。 为什么是满圆角:圆角 6rpx 是签的语言,12rpx 与签仍在同一族; 28rpx(= 高度 56rpx 的一半)让它成为胶囊,轮廓与签一眼可分。 为什么环 3rpx 而不是 2rpx:按钮是本页唯一的转化入口,56rpx 高度下 2rpx 的环 - 在真机强光里发虚;3rpx 的 --brand-strong 在纸面上 4.89:1,稳稳过非文本 3:1。 - 字走 --brand-ink(纸面上 6.89:1),比环的 --brand-strong(4.89:1)再稳一档: + 在真机强光里发虚;3rpx 的 --brand-strong 在纸面上 4.66:1,稳稳过非文本 3:1。 + 字走 --brand-ink(纸面上 6.10:1),比环的 --brand-strong(4.66:1)再稳一档: 环承担"这是动作"的色,字承担"读得清"的对比度。 去掉填充与阴影:原先的暖色紧阴影是为了把 1.02:1 的浅橙底托出形状, 没有底就不需要拖形,8 圈阴影一并撤掉,整页顺带更轻。 按下把胶囊填上 --brand-line:同色阶、可感知(1.19:1→填充可见), - 暖陶土字在其上 5.80:1,仍过 AA。不引入新色。 + 暖橙字在其上 5.14:1,仍过 AA。不引入新色。 注意"淡"仍不能走"提亮填充 + 白字"——白字对 #EA6A2E 只剩约 3.2:1、 对 #F97316 约 2.8:1,都不达 AA。 与 DESIGN.md §3 的禁用态不撞:禁用是 --muted 字 + --sep 描边 + 透明底, - 本按钮是暖陶土字 + 鲜橙环,字色与环色两个维度都不同,不会被读成不可点。 + 本按钮是暖橙字 + 暖橙环,字色与环色两个维度都不同,不会被读成不可点。 真机若觉得环太空、抓力不够,下一顺位是只把 background 换成 --brand-line (就是现在的按下色),形不动——那是一步就能上的台阶,不必换风格。 字重按用户要求 700 → 500。要记住 500 在中文里不稳定:iOS 的苹方有 Medium(500), @@ -479,7 +465,7 @@ page { 同一套做法:--brand-soft 底 + 2rpx --brand-line 描边 + 去阴影 + 28rpx 圆角。 为什么页尾要有一张暖色面:首页的节奏是"白卡 … 白卡 … 一张浅橙卡收口" (陪诊服务收在介绍卡上,常用功能收在联系我们上)。本页原先 4 张白面 - 一张暖色收口都没有,暖色只剩"线"——竖条、按钮环、暖陶土字, + 一张暖色收口都没有,暖色只剩"线"——竖条、按钮环、暖橙字, 整页因此比首页轻一大截;这张卡就是补回来的那一张"面"。 浅橙底与纸面的填充差只有约 1.03:1,但面积够大,大面积暖色自身可辨, 再配 --brand-line 描边就够,与首页那张一样不加阴影 */ diff --git a/pages/home/index.wxml b/pages/home/index.wxml index 195f852..f6deb41 100644 --- a/pages/home/index.wxml +++ b/pages/home/index.wxml @@ -116,7 +116,7 @@ - + {{ item.name }} diff --git a/pages/home/index.wxss b/pages/home/index.wxss index f2b3bd2..d5ebad2 100644 --- a/pages/home/index.wxss +++ b/pages/home/index.wxss @@ -6,43 +6,12 @@ - 大字号标题直接落在纸面上,不用整块色面板压首屏 */ page { - /* 暖橙主色阶:strong 是实心块/按钮(白字需 ≥4.5:1、白图标需 ≥3:1), - soft 是衬底,ink 是浅衬底上的文字与线图标 */ - --brand: #F97316; /* 主色:仅装饰性小色块 */ - --brand-strong: #C2410C; /* 实心按钮 / 选中态:白字 4.69:1,过 AA 正文 */ - --brand-soft: #FFF4E8; /* 图标衬底、标签底 */ - --brand-line: #FFE0C2; /* 浅橙衬底的描边 */ - --brand-ink: #9A3412; /* 浅橙衬底上的文字/图标:6.8:1,过 AA */ - - /* 状态色:全页唯一的冷色,只用在「待服务订单」提醒条上。 - 作用是制造唯一焦点——整页暖橙平铺时需要一个"该看这里"的落点 */ + /* 配色令牌已上移到 app.wxss(全站唯一来源,改配色只改那一处),本页不再留副本。 + 这里只剩本页专属的一样:「待服务订单」提醒条的状态色——全页唯一的冷色, + 语义由 DESIGN.md §3 管,不随主色走 */ --status-soft: #ECF7F4; --status-line: #C7E5DF; --status-ink: #0F766E; /* #ECF7F4 上 5.0:1,过 AA 正文 */ - - /* 中性:暖灰阶,与暖白纸面同温(冷灰会让白卡边缘发青) */ - --ink: #2B2521; - --ink-2: #4A4038; - --muted: #6F655C; /* 纸面(--paper) 5.28:1 / 白卡 5.69:1,过 AA 正文。 - 原 #7A7068 在白卡上 4.83:1 达标,但落在暖白纸面上只有 4.49:1,压线不过 */ - --faint: #A79C92; /* 仅用于非文字装饰 */ - --line: #ECE3D6; /* 米色发丝边。原 #F0E9E0 落在纸面上只有 1.12:1,等于"看得见但看不清", - 而白卡与纸面的填充差本身只有 1.08:1——边界全靠这条边,它必须站得住。 - 压深一档后:纸面 1.20:1 / 白卡 1.27:1 */ - --paper: #FAF8F5; /* 暖白纸面。原 #FAF6F0 的 R−B=10,黄度偏重,大面积铺开会被读成 - "旧纸/发闷"而不是"暖白干净"(感知亮度受色饱和度影响, - 同明度下越黄越显沉)。压到 R−B=5,黄度减半, - 明度反而略升(L* 97.0 → 97.7),暖白身份保留 */ - --white: #FFFFFF; - - /* 紧阴影:偏移与模糊半径不变(仍是"小偏移、小模糊"的锐利档),只提不透明度。 - 原因:上面的纸面去黄后,白卡与纸面的填充差从 1.08:1 降到 1.06:1, - 卡片需要阴影来补回"浮在纸面上"的层级,否则整页更平。 - 0.04 时阴影几乎不可见,提到 0.07 后边缘压深约等于那道填充差本身 */ - --shadow-card: 0 2rpx 10rpx rgba(63, 43, 25, 0.07); - /* 彩色阴影原为 0 6rpx 16rpx/22%:全页只有它与品牌印记两处彩色阴影,且都在首屏, - 是首屏显重的主要来源,也与"小偏移、小模糊"的锐利阴影偏好相悖,故收小一档 */ - --shadow-cta: 0 2rpx 8rpx rgba(194, 65, 12, 0.16); } .page-bg { @@ -78,7 +47,7 @@ page { display: flex; align-items: center; justify-content: center; - box-shadow: 0 2rpx 8rpx rgba(194, 65, 12, 0.16); + box-shadow: 0 2rpx 8rpx rgba(184, 82, 10, 0.16); } .brand-logo { @@ -119,7 +88,7 @@ page { 两段合计 11 字 × (48rpx + 2rpx 字距) + 10rpx 间隔 ≈ 560rpx, 小于容器内宽 686rpx(750 - 32×2 页边距),不会折行 */ .hero-title-accent { - color: var(--brand-strong); /* 暖白纸面上 5.0:1,过 AA */ + color: var(--brand-strong); /* 暖白纸面上 4.66:1,过 AA(50rpx/700 属大字,3:1 门槛之上) */ } .hero-title-main { @@ -128,7 +97,7 @@ page { } /* 场景行:三项核心场景两行排布(场景词 + 补充),纯展示不点击。 - 场景词走暖陶土 --brand-ink 做暖色标签,与标题深墨半句靠色相拉开层级, + 场景词走暖橙 --brand-ink 做暖色标签,与标题深墨半句靠色相拉开层级, 避免两条深色带叠在一起;补充走 muted 保持安静。 28 → 40rpx:补充语由 8 字收到 5 字后横向已有空气,纵向再拉开一档 */ .scene-row { @@ -147,9 +116,9 @@ page { .scene-name { font-size: 30rpx; font-weight: 700; - /* 暖陶土 --brand-ink:与标题深墨半句「让就医更省心」同屏时靠色相拉开层级, + /* 暖橙 --brand-ink:与标题深墨半句「让就医更省心」同屏时靠色相拉开层级, 避免两段 ink+700 连排成"两条深色带";比标题的 --brand-strong 低一档分量, - 标题仍是首屏唯一的亮橙焦点。纸面上 6.8:1,过 AA */ + 标题仍是首屏唯一的暖色焦点。纸面上 6.10:1,过 AA */ color: var(--brand-ink); letter-spacing: 1rpx; } @@ -231,7 +200,7 @@ page { .intro-trust-item { font-size: 24rpx; font-weight: 700; - color: var(--brand-ink); /* 浅橙底 6.8:1,过 AA */ + color: var(--brand-ink); /* 浅橙底 5.96:1,过 AA */ letter-spacing: 1rpx; } @@ -344,7 +313,7 @@ page { transform: scale(0.94); } -/* 纤细线图标:24x24 网格、stroke-width 1.5、暖橙 #C2410C,base64 内嵌避免引入图标字体。 +/* 纤细线图标:24x24 网格、stroke-width 1.5、暖橙 #B8520A,base64 内嵌避免引入图标字体。 60rpx(30px) 是过 WCAG 非文本 3:1 后兼顾真机清晰度、减少白卡空荡感的尺寸。 图标直接落在白卡上、不加衬底方块:衬底层级已让给上方主推卡,小宫格保持安静 */ .assist-icon { @@ -358,43 +327,43 @@ page { /* 1 全天陪诊:整圈表盘 + 指针 */ .assist-icon-1 { - background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQzI0MTBDIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSI4LjUiLz48cGF0aCBkPSJNMTIgNi42VjEybDMuOCAyLjIiLz48L3N2Zz4="); + background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQjg1MjBBIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSI4LjUiLz48cGF0aCBkPSJNMTIgNi42VjEybDMuOCAyLjIiLz48L3N2Zz4="); } /* 2 半天陪诊:整圈表盘 + 右半实心填充,与 1 的"空心全圈"形成"全 / 半"对照, 避免原半月形在小尺寸下被误读为字母 D */ .assist-icon-2 { - background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQzI0MTBDIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSI4LjUiLz48cGF0aCBkPSJNMTIgMy41YTguNSA4LjUgMCAwIDEgMCAxN1oiIGZpbGw9IiNDMjQxMEMiIHN0cm9rZT0ibm9uZSIvPjwvc3ZnPg=="); + background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQjg1MjBBIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSI4LjUiLz48cGF0aCBkPSJNMTIgMy41YTguNSA4LjUgMCAwIDEgMCAxN1oiIGZpbGw9IiNCODUyMEEiIHN0cm9rZT0ibm9uZSIvPjwvc3ZnPg=="); } /* 3 代问诊:对话气泡 + 医疗十字 */ .assist-icon-3 { - background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQzI0MTBDIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cGF0aCBkPSJNMjAgMTQuNWEyLjUgMi41IDAgMCAxLTIuNSAyLjVIOGwtNCAzLjVWNmEyLjUgMi41IDAgMCAxIDIuNS0yLjVoMTFBMi41IDIuNSAwIDAgMSAyMCA2WiIvPjxwYXRoIGQ9Ik0xMiA3LjZ2NS4yTTkuNCAxMC4yaDUuMiIvPjwvc3ZnPg=="); + background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQjg1MjBBIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cGF0aCBkPSJNMjAgMTQuNWEyLjUgMi41IDAgMCAxLTIuNSAyLjVIOGwtNCAzLjVWNmEyLjUgMi41IDAgMCAxIDIuNS0yLjVoMTFBMi41IDIuNSAwIDAgMSAyMCA2WiIvPjxwYXRoIGQ9Ik0xMiA3LjZ2NS4yTTkuNCAxMC4yaDUuMiIvPjwvc3ZnPg=="); } /* 4 检查预约:日历 + 对勾 */ .assist-icon-4 { - background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQzI0MTBDIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cmVjdCB4PSIzLjUiIHk9IjUiIHdpZHRoPSIxNyIgaGVpZ2h0PSIxNS41IiByeD0iMi41Ii8+PHBhdGggZD0iTTggM3Y0TTE2IDN2NE0zLjUgOS41aDE3Ii8+PHBhdGggZD0ibTkuNCAxNSAxLjkgMS45IDMuNy00Ii8+PC9zdmc+"); + background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQjg1MjBBIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cmVjdCB4PSIzLjUiIHk9IjUiIHdpZHRoPSIxNyIgaGVpZ2h0PSIxNS41IiByeD0iMi41Ii8+PHBhdGggZD0iTTggM3Y0TTE2IDN2NE0zLjUgOS41aDE3Ii8+PHBhdGggZD0ibTkuNCAxNSAxLjkgMS45IDMuNy00Ii8+PC9zdmc+"); } /* 5 出入院代办:医院楼 + 地面 + 十字 */ .assist-icon-5 { - background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQzI0MTBDIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cGF0aCBkPSJNNC41IDIwLjVWNi41YTIgMiAwIDAgMSAyLTJoMTFhMiAyIDAgMCAxIDIgMnYxNCIvPjxwYXRoIGQ9Ik0yLjUgMjAuNWgxOSIvPjxwYXRoIGQ9Ik0xMiA4LjZ2NU05LjUgMTEuMWg1Ii8+PC9zdmc+"); + background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQjg1MjBBIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cGF0aCBkPSJNNC41IDIwLjVWNi41YTIgMiAwIDAgMSAyLTJoMTFhMiAyIDAgMCAxIDIgMnYxNCIvPjxwYXRoIGQ9Ik0yLjUgMjAuNWgxOSIvPjxwYXRoIGQ9Ik0xMiA4LjZ2NU05LjUgMTEuMWg1Ii8+PC9zdmc+"); } /* 6 跑腿服务:包裹箱 */ .assist-icon-6 { - background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQzI0MTBDIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cGF0aCBkPSJNMjAuNSA4LjJ2Ny42YTEuNiAxLjYgMCAwIDEtLjg0IDEuNDJsLTYuOSAzLjhhMS42IDEuNiAwIDAgMS0xLjUyIDBsLTYuOS0zLjhBMS42IDEuNiAwIDAgMSAzLjUgMTUuOFY4LjJhMS42IDEuNiAwIDAgMSAuODQtMS40Mmw2LjktMy44YTEuNiAxLjYgMCAwIDEgMS41MiAwbDYuOSAzLjhBMS42IDEuNiAwIDAgMSAyMC41IDguMloiLz48cGF0aCBkPSJNMy45IDcuMyAxMiAxMS43bDguMS00LjRNMTIgMTEuN1YyMSIvPjwvc3ZnPg=="); + background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQjg1MjBBIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cGF0aCBkPSJNMjAuNSA4LjJ2Ny42YTEuNiAxLjYgMCAwIDEtLjg0IDEuNDJsLTYuOSAzLjhhMS42IDEuNiAwIDAgMS0xLjUyIDBsLTYuOS0zLjhBMS42IDEuNiAwIDAgMSAzLjUgMTUuOFY4LjJhMS42IDEuNiAwIDAgMSAuODQtMS40Mmw2LjktMy44YTEuNiAxLjYgMCAwIDEgMS41MiAwbDYuOSAzLjhBMS42IDEuNiAwIDAgMSAyMC41IDguMloiLz48cGF0aCBkPSJNMy45IDcuMyAxMiAxMS43bDguMS00LjRNMTIgMTEuN1YyMSIvPjwvc3ZnPg=="); } /* 7 陪诊套餐:礼盒 */ .assist-icon-7 { - background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQzI0MTBDIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cmVjdCB4PSIzIiB5PSI3LjUiIHdpZHRoPSIxOCIgaGVpZ2h0PSI0LjUiIHJ4PSIxLjIiLz48cGF0aCBkPSJNNC41IDEydjcuNUExLjUgMS41IDAgMCAwIDYgMjFoMTJhMS41IDEuNSAwIDAgMCAxLjUtMS41VjEyIi8+PHBhdGggZD0iTTEyIDcuNVYyMSIvPjxwYXRoIGQ9Ik0xMiA3LjVIOS4yYTIuMyAyLjMgMCAxIDEgMC00LjZDMTAuNyAyLjkgMTIgNy41IDEyIDcuNVoiLz48cGF0aCBkPSJNMTIgNy41aDIuOGEyLjMgMi4zIDAgMSAwIDAtNC42QzEzLjMgMi45IDEyIDcuNSAxMiA3LjVaIi8+PC9zdmc+"); + background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQjg1MjBBIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cmVjdCB4PSIzIiB5PSI3LjUiIHdpZHRoPSIxOCIgaGVpZ2h0PSI0LjUiIHJ4PSIxLjIiLz48cGF0aCBkPSJNNC41IDEydjcuNUExLjUgMS41IDAgMCAwIDYgMjFoMTJhMS41IDEuNSAwIDAgMCAxLjUtMS41VjEyIi8+PHBhdGggZD0iTTEyIDcuNVYyMSIvPjxwYXRoIGQ9Ik0xMiA3LjVIOS4yYTIuMyAyLjMgMCAxIDEgMC00LjZDMTAuNyAyLjkgMTIgNy41IDEyIDcuNVoiLz48cGF0aCBkPSJNMTIgNy41aDIuOGEyLjMgMi4zIDAgMSAwIDAtNC42QzEzLjMgMi45IDEyIDcuNSAxMiA3LjVaIi8+PC9zdmc+"); } /* 8 买药套餐:45° 斜置胶囊 + 中缝,避免原横置胶囊被误读为"链接"图标 */ .assist-icon-8 { - background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQzI0MTBDIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cmVjdCB4PSI0LjIiIHk9IjguMiIgd2lkdGg9IjE1LjYiIGhlaWdodD0iNy42IiByeD0iMy44IiB0cmFuc2Zvcm09InJvdGF0ZSgtNDUgMTIgMTIpIi8+PHBhdGggZD0iTTkuMyA5LjNsNS40IDUuNCIvPjwvc3ZnPg=="); + background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQjg1MjBBIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cmVjdCB4PSI0LjIiIHk9IjguMiIgd2lkdGg9IjE1LjYiIGhlaWdodD0iNy42IiByeD0iMy44IiB0cmFuc2Zvcm09InJvdGF0ZSgtNDUgMTIgMTIpIi8+PHBhdGggZD0iTTkuMyA5LjNsNS40IDUuNCIvPjwvc3ZnPg=="); } /* 宫格项名统一走 28rpx 标题档(与 .quick-name 同级)。 diff --git a/pages/mine/mine.js b/pages/mine/mine.js index df6fb69..453f3f8 100644 --- a/pages/mine/mine.js +++ b/pages/mine/mine.js @@ -3,7 +3,10 @@ const API = require('../../utils/api.js') Page({ data: { userInfo: { - avatar: '/images/home-yellow.png', + // 默认头像:暖墨色品牌标记(home-ink #9B4508)。 + // home.png 本体是 tabBar 未选中态的灰色 #8A8A8A,故另存一份重上色位图; + // 与 ai-ink.png 同一做法(位图着色走不了 CSS 变量,改色须手改,见 DESIGN.md §7.3) + avatar: '/images/home-ink.png', name: '用户', phone: '', sex: '', diff --git a/pages/mine/mine.wxml b/pages/mine/mine.wxml index 425955b..1e8a0ba 100644 --- a/pages/mine/mine.wxml +++ b/pages/mine/mine.wxml @@ -24,13 +24,18 @@ 企业/机构合作 - · + 陪诊师入驻 - · + 商务合作 - 版本号:V 1.1.3 - © 2026 北京奕华盛科技 版权所有 + + + © 2026 北京奕华盛科技 版权所有 + + 版本号:V 1.1.3 +