图标映射表

全局图标映射，TDesign 优先。自定义图标放 apps/miniprogram/miniprogram/assets/icons/。复杂内联 SVG 统一导出为图片资源，避免小程序中维护大段 SVG 代码。

全局通用图标

H5 中的图标描述	处理方式	小程序引用
Logo 台球图标	自定义 SVG → 文件	`/assets/icons/logo-billiard.svg`
微信图标	自定义 SVG → 文件	`/assets/icons/icon-wechat.svg`
返回箭头	TDesign	`<t-icon name="chevron-left" />`
右箭头	TDesign	`<t-icon name="chevron-right" />`
关闭	TDesign	`<t-icon name="close" />`
搜索	TDesign	`<t-icon name="search" />`
更多（三点）	TDesign	`<t-icon name="ellipsis" />`

原型中所有 Banner 使用 banner.css 的 CSS 渐变 + texture-aurora SVG 丝带纹理，结构复杂（多层渐变+伪元素+内联 SVG path）。

处理方式： 统一用 Playwright 截取各主题 Banner 区域，导出为图片资源。

Banner 主题	使用页面	导出文件
`theme-blue texture-aurora`	task-list, performance	`/assets/images/banner-blue.png`
`theme-red texture-aurora`	task-detail（高优先召回）	`/assets/images/banner-red.png`
`theme-orange texture-aurora`	task-detail（优先召回）	`/assets/images/banner-orange.png`
`theme-pink texture-aurora`	task-detail-relationship（关系构建）	`/assets/images/banner-pink.png`
`theme-teal texture-aurora`	task-detail-callback（客户回访）	`/assets/images/banner-teal.png`
`theme-coral texture-aurora`	coach-detail	`/assets/images/banner-coral.png`
`theme-dark-gold`	customer-detail	`/assets/images/banner-dark-gold.png`

小程序中 Banner 区域使用 <image> 组件 + 绝对定位文字叠加，替代 CSS 渐变方案。

H5 中的图标	实际 SVG 内容	处理方式	小程序引用
reviewing 主图标	amber→orange 渐变方块 + 白色时钟（圆形表盘+时针分针）	导出 SVG	`/assets/icons/icon-clock-circle.svg`
reviewing 进度对勾	绿色圆圈内白色对勾 polyline	TDesign	`<t-icon name="check-circle-filled" />`
reviewing 信息图标	Material 风格 info（圆+感叹号）	TDesign	`<t-icon name="info-circle-filled" />`
reviewing 聊天气泡	聊天气泡 path	TDesign	`<t-icon name="chat" />`
reviewing 登出箭头	右箭头+门框 path	TDesign	`<t-icon name="logout" />`
no-permission 主图标	rose→red 渐变方块 + 白色禁止符号（圆+对角线）	导出 SVG	`/assets/icons/icon-forbidden.svg`
no-permission 问号	问号圆圈 path	TDesign	`<t-icon name="help-circle-filled" />`

Tab	处理方式	小程序引用
任务（未选中）	自定义 SVG（剪贴板+勾选，stroke 灰色）	`/assets/icons/tab-task.png`
任务（选中）	自定义 SVG（剪贴板+勾选，fill 蓝色）	`/assets/icons/tab-task-active.png`
看板（未选中）	自定义 SVG（三柱状图，stroke 灰色）	`/assets/icons/tab-board.png`
看板（选中）	自定义 SVG（三柱状图，fill 蓝色）	`/assets/icons/tab-board-active.png`
我的（未选中）	自定义 SVG（人物头像，stroke 灰色）	`/assets/icons/tab-my.png`
我的（选中）	自定义 SVG（人物头像，fill 蓝色）	`/assets/icons/tab-my-active.png`

TabBar 图标由 bottom-nav.js 定义，包含完整的 active/inactive SVG。建议统一导出为 PNG 图片对。

H5 中的图标描述	实际 SVG 内容	处理方式	小程序引用
AI 悬浮按钮	可爱机器人（圆角矩形身体+天线+紫蓝色大眼睛+微笑+粉色腮红+小耳朵），渐变动画背景	截图导出按钮整体	`/assets/icons/icon-ai-float.png`
AI 内联图标（卡片中）	同上机器人 SVG，小尺寸	截图导出	`/assets/icons/icon-ai-inline.png`
AI 标题徽章	同上机器人 + 随机配色 class	截图导出	`/assets/icons/icon-ai-badge.png`
对话发送	TDesign	TDesign	`<t-icon name="send" />`
语音输入	TDesign	TDesign	`<t-icon name="sound" />`

AI 图标由 ai-icons.js 统一管理，页面加载时随机分配配色（red/orange/yellow/blue/indigo/purple）。小程序中可固定一种配色或实现随机逻辑。

原型中星级评价由 ai-icons.js 渲染：读取 data-score（0-10），转换为 5 颗星（支持半星）。