CMS(Content Manager System)模块

动态配置规则

动态配置分为3步：从组件到位置和内容，再到动态页面

按照下图, 反向流程走，就能解析出对应的自定义页面内容。

页面动态配置.png

页面整体设计

淘宝的“千人千面”，这种方式对CMS系统提出更高的技术要求。根据数据挖掘分析用户的特征, 动态调整CMS策略.

动态页面设置的主要是首页、自定义活动页面, 根据渠道来源不同, 又有不同的策略

1. 装修模板可以减少在新建活动时从0到1逐步配置的巨大工作量。直接套用模板中的内容，进行替换、新增部分内容，可以快速新建活动。
2. 可以提供自定义页面的复制功能，从已有的自定义页面中复制出新页面

基础组件

组件相当于一个有固定形态的容器，往里添加详细的图片、文本、商品、优惠券等内容

1. 类型: 图片轮播、商品推荐、商品分类、宝贝排行、图标（ICON）这几种形式，另外还有富文本、客服、优惠券、满减活动、满赠活动、自定义区域、商品搜索、文字、公告、倒计时、Tab组件（顶部、底部）等
2. 样式: 选择展示的内容或者自定义, 需要独立设计
3. 点击组件跳转的位置

图片

• 类型: 单图, 双图, 轮播图, 多图, 9宫图
• 点击图片后跳转的地址: 自定义链接, 购物车页, 商品列表页等等...

商品列表

• 类型: 单列商品、双列商品、多商品等

公告栏

商品排行榜

• 类型: 全品类销售榜单、类目商品榜单、收藏量榜单
• 使用方式: 选择类型以及布局方式

导航栏

• 类型: 中间导航栏，顶部或底部导航栏

自定义模块(内嵌HTML代码)

位置+内容

动态页面

定义一些关于整个页面的基础信息，包括活动页面名称、活动起止时间、所属活动分组等内容，甚至是活动宣传图，分享图片、活动描述等内容。设置之后给活动进行编号，生成相应的链接进行预览。

动态页面是由不同的组件内容构成，首先按照各组件位置去解析，然后再去解析组件的内容（样式、图片或商品、背景、链接等）

技术设计

五张表(页表，关联表，模板表，模板数据表，数据池表) 包含页面配置

原表	目标表
页表	关联表
关联表	模板表
关联表	模板数据表
模板数据表	数据池表

• 一个页面(装修模板) 可以关联多个模板，每个模板里面包含一个模板数据，而一个模板数据 里面的具体数据是通过 String-Json 进行保存，不同的 模板 对应的 Json结构和数据是不相同的（如果商品超过20个，使用扩展的数据池表）
• 每个模板(组件) 的前端具体展示，由前端制作对应 h5代码 保存，返回数据 h5代码 由前端进行渲染
• 每个模板数据 里面保存的结构可以是 商品，图片，文案 等等，前端写死 模板 解析方案，进行渲染（这里需要二次调用，因为能直接拿到sku）
• 每个数据池 里面保存的是具体商品信息，为了缓解模板数据json字段过大，而做的扩展（这就需要二次调用，查到具体的sku并且获取详细信息）

---

界面配置需要大量的点击查看，选择，需求方案是 提供 export/import excel 批量导入方案

---

• 管理端
  • 支持发布功能(一旦发布后，只能更新后发布，不能删除和下架)
  • 支持克隆功能，配置一个面板很费时，大多数面板只是商品类型不同，整体框架很少变
• 前端
  • 根据不同的 面板类型，获取页面数据(内嵌有skuIds/图片地址)及面板模型，渲染面板模型的同时，获取具体的内嵌sku
  • 根据传入的skuId/图片地址 获取详细的信息，批量渲染商品对应值