# 项目长期记忆 ## 项目概述 - 微信小程序项目,使用 Taro + React + NutUI + TailwindCSS + SCSS - 项目名:南南佐顿门窗(门窗定制安装业务) - 品牌:网宿软件 ## 技术栈 - 框架:Taro (微信小程序) - UI:NutUI React Taro - 样式:TailwindCSS + SCSS - 语言:TypeScript ## 关键路径 - 首页入口:`src/pages/index/index.tsx` - 画册页:`src/pages/brochure/index.tsx`(当前为原生品牌画册展示页) - 分销商页面:`src/dealer/index.tsx` - 用户钱包:`src/user/wallet/wallet.tsx` - 客户管理:`src/dealer/customer/index` - 邀请码:`src/dealer/qrcode/index` - 导航工具:`src/utils/common.ts` (navTo函数) ## 首页结构 (2026-04-09 重大重构) - Header (吸顶搜索栏,深色渐变背景) - **Hero区域** (Banner + Grid 融合,圆角过渡) - **NoticeStrip** (自定义轻量公告条,黄色圆点+文字) - **BestSellers** (热销推荐 — 横向图文卡片,左图右信息) - **CatalogShowcase** (品牌画册 — 大面积渐变视觉卡片) - **TrustSection** (品质信任区 — 横向滑动渐变卡片:10年质保/15年经验/98%满意度) - **ContactSection** (联系我们 — 全宽深色沉浸式底部) - PopUpAd (弹窗广告) ### 设计特点 - 非豆腐块布局,差异化间距和视觉层次 - 页面背景:#f5f5f7 - 底部区域为深色渐变(#1e293b→#0f172a) - ~~CaseShowcase~~ (已注释隐藏) ## 图标使用注意事项 - NutUI图标库中不存在的图标: - `Right` → 使用 `ArrowRight` - `MapPin` → 使用 `Location` - `Wechat` → 使用 `Share` - `Users` → 使用 `People` - 所有图标必须从 `@nutui/icons-react-taro` 导入 - 构建前需验证图标名称是否在可用导出列表中 ## 字体大小规范 (2026-04-09 更新) - 微信小程序端按移动端标准设计,最小辅助文字 13-14px - 标签/辅助:14px - 正文/描述:15-16px - 小标题/按钮文字:16-17px - 区块标题:20-24px - 强调数字(价格、数据):28-36px - 所有图标必须从 `@nutui/icons-react-taro` 导入 ## 画册页正式版 (2026-04-01) - 首页已实际挂载 `src/pages/index/BrochureEntry.tsx` 入口,位置在 Banner 下方。 - `src/pages/brochure/index.tsx` 当前为原生正式版结构:主营方案、核心优势、升级关键词、服务承诺、案例方向、服务流程、预约咨询信息。 - 画册页优先读取 `configWebsiteField` 返回的 `siteName`、`tel`、`address`、`workDay` 作为品牌与联系信息;无配置时使用兜底文案。 - 当前页面提供“拨打热线 / 复制地址 / 返回首页”三类转化操作,后续可继续接真实案例图、门店定位与预约表单。 ## 外部 H5/画册接入约定 (2026-04-01) - 小程序首页如需承载外部画册、易企秀、云展网等 H5,优先采用独立 `web-view` 页面承载,再从首页增加入口卡片或 banner 跳转。 - 该方案的前提是目标域名可在小程序后台配置为业务域名,且满足 HTTPS、备案等微信限制。 - 外部 `web-view` 页面应提供失败兜底界面(如重新加载、返回首页、管理员配置提示),不要只保留 toast 提示。 - 当前 `book.yunzhan365.com` 无法配合放置微信业务域名校验文件,因此不能作为小程序正式业务域名接入。 - 如果目标链接是第三方不可控域名,无法完成业务域名配置,则改为将内容转成图片、PDF 切图或原生页面在小程序内展示,不依赖直接外链打开;若仍想保留在线翻页体验,需迁移到自有可验证域名承载。