Skip to content

23 crmeb visual baseline audit

Jump to bottom
技术老胡 edited this page Jul 30, 2026 · 1 revision

CRMEB 四端视觉与运行配置基线审计

本文档记录 SmartFarm 当前 CRMEB 底座的可验证事实，作为信息架构、Figma 原型和前端任务拆解的视觉依据。文档不定义新的业务规则，也不表示已经开始业务代码开发。

审计日期：2026-07-30

一、审计状态

项目 状态 说明
平台管理端运行态与 DOM 已核验 已进入当前登录页面并核对菜单、筛选、表格和操作布局
商户后台运行态与 DOM 已核验 已核对控制台、一级菜单和常用页面结构
用户端运行态与 DOM 已核验 已核对首页装修、导航、商品卡片和底部导航
服务端运行态与源码 已核验 已确认当前工程主要是桌面客服工作台
四端前端源码 已核验 已核对主题、布局、路由、页面和代表性样式
数据库菜单、主题、站点和装修 已核验 已只读查询菜单树、配置项、DIY 页面及导航数据
Figma 基线文件 已完成 9 个顶级页面、低/高保真、组件、流程与交付页已建立
四端视觉参考 已完成结构化基线 01 Current CRMEB References 记录运行态、源码和数据库审计事实；登录态原始截图可在开发阶段补录，不冒充当前证据
用户端组件级复用审计 已完成 详见 25-user-uniapp-reuse-audit.md，29 个用户端高保真页面已按复用边界落图

结论：

  • 已冻结“视觉方向和设计约束”，并完成四端 108 个高保真主状态。
  • Figma 参考页属于结构化运行态复刻和事实摘要，不标记为浏览器原始截图。
  • 后续实现必须继续以现有源码组件、数据库配置和真实运行页面为准，不以设计稿反向重做 CRMEB。

二、审计来源

范围 来源
平台管理端 smartfarm_admin 源码、http://www.smartfarm.com/admin/dashboard 运行态
商户后台 smartfarm_mer 源码、http://www.smartfarm.com/merchant/dashboard 运行态
用户端 smartfarm_user 源码、http://www.smartfarm.com/ 运行态
服务端 smartfarm_service 源码、http://www.smartfarm.com/kefu/dashboard 运行态
后端主题 smartfarm 中 DIY/主题解析逻辑、公开 /api/config 运行配置
数据库 www_smartfarm_co 中 eb_system_menu、eb_system_config、eb_system_config_value、eb_diy、eb_system_group、eb_system_group_data

本次只执行读取和设计文档工作，没有修改业务源码、数据库和运行配置。

三、平台管理端基线

1. 技术和布局事实

  • Vue 2 + Element UI。
  • 使用双层侧栏、顶部业务分组、面包屑和标签页组成的 CRMEB 后台壳。
  • 常见列表页结构为：页面容器、筛选表单、状态标签页、批量操作、数据表格、分页。
  • 常见编辑页结构为：el-form、分组标题、表单项、图片/商品选择器、底部保存操作。
  • 页面内容区常见内边距约 16px。
  • 正文通常为 14px，表格、表单控件和辅助信息通常为 12px 至 13px。
  • 后台常见圆角为 4px，页面背景主要为 #F3F5F7 或相近的 #F3F5FA。

2. 后台壳主题事实

管理端源码中存在 9 组后台壳主题组合，代表性色包括：

用途 颜色
蓝色主题 #4073FA
绿色主题选项 #41B584
紫色主题选项 #6954F0
红色主题选项 #F34D37

这些是后台壳可选主题，不等于当前用户商城运行主题。智慧农业页面不得因为业务名称带“农业”就自行把后台统一改成绿色。

3. 当前一级菜单

首页、店铺、商品、订单、分销、营销、用户、内容、财务、应用、装修、客服、设置、维护

平台“营销 > 秒杀”的真实分层为：

营销
└─ 秒杀
   ├─ 秒杀配置      /marketing/seckill/seckillConfig
   ├─ 秒杀管理      /marketing/seckill/list
   └─ 秒杀活动      /marketing/seckill/store_seckill/list

云仓秒杀应作为营销体系下与普通秒杀并列的独立业务组，复用页面节奏和控件模式，不复用普通秒杀的业务状态表。

四、商户后台基线

1. 技术和布局事实

  • Vue 2 + Element UI。
  • 与平台端使用相同的 CRMEB 后台设计语言和主题机制。
  • 控制台由经营指标、订单/商品统计和待办事项组成。
  • 商品、订单、营销和财务页面均以紧凑筛选、表格、弹窗和批量操作为主。
  • 商户云仓供货应嵌入现有商品与营销工作流，不建立另一套供应链后台壳。

2. 当前一级菜单

首页、商品、订单、营销、财务、用户、员工、装修、设置、公告

商户“营销 > 秒杀”的真实分层为：

营销
└─ 秒杀
   ├─ 秒杀活动      /marketing/seckill/store_seckill/list
   └─ 秒杀商品      /marketing/seckill/product/list

推荐把“云仓供货”作为商户营销下的独立业务组，同时在商品列表提供“提交云仓供货”的快捷操作。主入口和商品快捷入口指向同一组业务页面，避免两套数据口径。

五、用户端基线

1. 技术事实

  • 用户端是 uni-app。
  • App.vue 启动后读取 /api/config，把 global_theme.theme 和 global_theme.type 写入全局状态。
  • 页面和导航同时受 pages.json 静态配置、数据库 DIY 装修和运行接口影响。
  • 用户端设计不能只读取 pages.json 后直接重画首页。

2. 当前运行主题

公开运行接口当前返回：

配置 当前值
站点名称 智慧农场
主题类型 default
主题主色 #E93323
主题辅助色 #FF7612

数据库没有发现 global_theme 的显式配置值，当前结果来自后端默认主题解析。设计上以当前运行结果为事实；开发时需要保留“数据库显式配置 > 后端默认值”的来源说明。

3. 当前视觉模式

  • 页面背景常见 #F5F5F5 或 #F8F8F8。
  • 白色商品、订单和功能卡片常用 16rpx 至 24rpx 圆角。
  • 页面常见间距为 20rpx、24rpx、30rpx。
  • 正文和状态信息常见 24rpx 至 30rpx。
  • 商品价格常见 26rpx 至 34rpx，使用红色价格语义。
  • 秒杀页面使用红色主色与橙色辅助色表达倒计时、抢购和价格，不应直接把普通商城全局改为绿色。

4. 当前 DIY 页面事实

eb_diy 当前有 3 条页面记录：

页面 状态 结构
平台首页 启用 homeComb → menus → coupon → goodList → pageFoot
平台首页草稿 未启用 homeComb → menus → coupon → seckill → goodList → pageFoot
商户店铺页 启用 店铺头部、导航、优惠券、标题、热点、商品列表、页脚

当前启用的平台底部导航为：

首页、分类、逛逛、购物车、我的

当前启用的平台首页导航包含：

积分商城、商品分类、我的等级、种草社区、每日签到、新人专区、SVIP、地址管理、领优惠券、我的订单

已发现的现状问题：

  • “种草社区”当前错误指向 /pages/activity/goods_seckill/index。
  • 该问题应进入现有装修修复清单，不能在智慧农业原型中照抄。
  • pages.json 原生 tabBar 与数据库 DIY 页脚数量不一致时，当前运行态以 DIY 配置为准。

六、服务端基线

1. 当前事实

  • 当前固定路由主要是 /kefu/dashboard，未登录时实际进入 /kefu/login?redirect=%2Fkefu%2Fdashboard。
  • 当前页面是三栏桌面客服工作台，不是通用农业现场作业系统。
  • 工作区常见宽度约为视口的 90%，最小宽度约 1000px，最大宽度约 1200px。
  • 视觉上使用灰色页面背景、白色主面板、14px 正文和 Element UI 蓝色 #1890FF。

2. 设计影响

  • 客服查询和订单上下文可以继续保留在现有桌面客服工作区。
  • 农事记录、产出录入、仓库核销和异常上报需要移动优先页面。
  • 不应强行把现有三栏客服工作台压缩成移动端。
  • SPIKE-006 已冻结：保留原 PC 客服页，在 smartfarm_service 内新增农业桌面与独立移动现场布局；两个新布局复用现有主题、Token、请求和上传能力。

七、基础视觉令牌

1. 已验证值

语义 值 来源
用户端主操作/价格 #E93323 当前 /api/config 与用户端运行态
用户端辅助强调 #FF7612 当前 /api/config
平台后台代表性蓝色 #4073FA 管理端主题配置
服务端代表性蓝色 #1890FF 服务端 Element UI 配置
用户端页面背景 #F5F5F5、#F8F8F8 用户端页面和 DIY
管理端页面背景 #F3F5F7 管理端布局样式
表面 #FFFFFF 四端常用
主要文字 #282828、#333333 四端常用
次要文字 #666666、#999999 四端常用
边框 #EBEEF5、#DCDFE6 Element UI/页面样式
管理端圆角 4px 现有后台组件
用户端卡片圆角 16rpx 至 24rpx 现有用户端页面

2. Figma 令牌状态

Figma 已建立：

  • 3 个变量集合。
  • 61 个颜色和布局变量。
  • 10 个 CRMEB 桌面/移动文本样式。
  • --view-theme、--view-priceColor 对应现有 CRMEB 运行变量。
  • 其余 --sf-* 是设计交接建议名，尚未写入工程。

八、组件复用分级

1. 优先直接复用

  • 平台和商户端后台壳、面包屑、标签页、筛选表单、表格、分页、弹窗、抽屉、上传和商品选择。
  • 普通商品、购物车、地址、支付、订单、退款、物流和用户中心的既有交易能力。
  • 普通秒杀的时间场次、倒计时、活动氛围、列表密度和抢购反馈模式。
  • 当前 DIY 首页、菜单和页脚的配置机制。

2. 轻度扩展复用

  • 秒杀活动编辑页扩展云仓批次、去向、结算模式和回购规则。
  • 普通订单列表和详情增加云仓来源、去向和持仓跳转。
  • 商户商品列表增加云仓供货状态和快捷操作。
  • 用户“我的”增加土地、认养、待选择和我的云仓入口。

3. 必须新增领域表达

  • 云仓持仓、真实二次销售进度、结算节点和到期回购。
  • 用户本金、收益、回购、冻结和冲正账本。
  • 地块分配、地块占用、生产时间线和农业异常。
  • 认养个体或批次份额。
  • 溯源档案、版本、证书和报告组合展示。

这里的“必须新增”表示现有组件无法直接表达业务，不代表必须从零开发所有视觉基础控件。领域组件仍应组合现有按钮、表格、列表、标签、弹窗和图片组件。

九、Figma 基线文件

文件：

SmartFarm V1 - CRMEB Baseline & Product Design

当前页面：

00 Cover & Change Log
01 Current CRMEB References
02 Components & Tokens
03 Platform Admin
04 Merchant
05 User H5 Mini Program
06 Service & Field
07 Prototype Flows
08 Handoff & Assets

当前已完成：

  • 封面与阶段说明。
  • 四端结构化参考审计。
  • 颜色、字体、间距、圆角和控件尺寸基线。
  • 基础令牌页截图校验。
  • 平台 55、商户 10、用户 29、服务 14，共 108 个高保真主状态。
  • Button、StatusTag、ProgressBar、DomainCard 共 4 个高保真组件集、45 个 Variant。
  • 15 个 Flow 画板、60 个流程副本、15 个唯一 Prototype 起点及前进/返回连线。
  • 08 Handoff & Assets 的覆盖、组件、状态、流程、资产、QA 和 RC-1 交付记录。

十、设计硬约束

  • 不整体重做 CRMEB 后台壳和用户商城视觉。
  • 不以绿色替换当前全站红橙主题。
  • 不把 Figma 社区模板直接套入项目。
  • 不复制普通秒杀页面后只改标题。
  • 不重复实现 uni-app 已有商品、订单、支付、地址、物流和售后组件。
  • 不把客服 PC 布局直接缩放为移动现场作业页。
  • 状态必须同时有颜色和文字。
  • 金额、长编号、长商品名和异常原因必须验证溢出。
  • 现状缺陷与智慧农业新功能分别登记。
  • 登录密码、验证码、访问令牌不得进入 Figma、源码、文档或 Skill。

十一、高保真完成结果与后续

  • 以运行态、源码和数据库证据建立四端结构化视觉参考页。
  • 完成用户端 uni-app 页面、公共组件、DIY 组件和交易链路复用审计，见 25-user-uniapp-reuse-audit.md。
  • 把每个用户端新页面映射到“现有页面模板 + 复用组件 + 必须新增领域组件”。
  • 冻结服务端原客服、农业桌面与移动现场作业的承载方式。
  • 冻结 24-g3-g4-decision-register.md 中的 UI/架构决定。
  • 统一 Figma 顶级页面命名，并明确 17/18 页面编号使用 Frame 名称映射。
  • 完成 108 个高保真页面、统一状态板、15 条 Prototype Flow 和设计交付页。
  • 可选补录四端登录态原始截图，供开发阶段像素级回看；该项不改变已冻结的结构与视觉方向。

十二、关联文档

SmartFarm 文档

Clone this wiki locally