深浅模式
运营模块组件
运营模块包含 3 个组件，适用于 应用首页、功能页面、自定义页面。在 服务表单（errand_service） 页不可用。
组件库分类：运营模块。
首页榜单（xiaoyi-home-rank-cards）
说明
横向滑动的 三榜卡片：热帖榜、话题榜、优质用户榜。每榜展示若干条排行内容，有数据才显示对应卡片。
支持两种数据来源：
| 模式 | 说明 |
|---|---|
| 静态配置 | 榜单数据写入页面配置；编辑器画布始终展示演示数据 |
| 区域发现接口 | 用户端运行时请求接口，一次返回热帖、话题、优质用户等数据并覆盖静态配置 |
开启接口后，可按 当前用户区域 或 固定区域 ID 拉取数据；留空区域 ID 表示全站统计。
适用场景
首页运营位、发现页热点引导。常与笔记列表、筛选标签搭配使用。
属性
| 属性 | 说明 | 默认值 / 备注 |
|---|---|---|
| 区域发现接口 | ||
| 使用接口数据 | 开启后用户端请求接口 | 关闭 |
| 跟随当前区域 | 为「是」时传用户当前区域 ID | 是 |
| 固定 region_id | 不跟随区域时填写；留空=全站 | — |
| 接口 limit | 四段数据各取 Top N，服务端上限 50 | 10 |
| 榜单 | ||
| 总开关 | 显示 / 隐藏整个榜单区域 | 显示 |
| 每类条数 limit | 卡片内展示行数（与接口 limit 独立） | 3 |
| 滑动提示 | ||
| 显示提示 | 至少 2 张卡片可见且可横滑时出现 | 显示 |
| 提示文案 | 底部滑动引导文字 | 左右滑动查看更多 |
| 提示字号 / 字重 / 颜色 | 滑动提示样式 | 20rpx / 500 / #999999 |
| 卡片外观 | ||
| 卡片间距 | 横向卡片间距 | 20rpx |
| 卡片圆角 | 单张榜单卡片圆角 | 24rpx |
| 各榜（热帖 / 话题 / 优质） | 分别配置 | |
| 启用 | 是否显示该榜 | 默认均启用 |
| 顺序 order | 横向排列顺序 | 热帖 1、话题 2、优质 3 |
| 标题文案 | 卡片顶部标题 | 热帖榜 / 话题榜 / 优质榜单 |
| 显示标题图标 | 标题左侧图标 | 显示 |
| 标题图标名 | 留空用默认（热帖 fire-o、话题 chat-o、优质 star-o） | — |
| 图标大小 / 颜色 | 标题图标样式 | 22rpx / #000000 |
| 标题字号 / 颜色 / 字重 | 标题文字样式 | 26rpx / #000000 / 700 |
| 点击动作 | ||
| 话题榜卡片 / 热帖榜卡片 / 优质榜卡片 | 点击整张卡片 | 可选 |
| 话题行 / 热帖行 / 优质用户行 | 点击列表某一行 | 可选 |
内嵌样式分组
组件根容器（宽高、外边距、内边距、背景、圆角、边框、透明度、阴影等）请在右侧顶部切换到 「样式」 Tab 编辑，与画布其他组件一致。
属性 Tab 内可配：滑动提示、卡片外观、各榜标题与图标。
约束
- 仅 home / feature / custom 页面可添加
- 接口模式下，编辑器画布仍显示演示数据，需保存后在客户端验证
- 榜单 type 对应：热帖
note、话题topic、优质user
双卡行动（xiaoyi-dual-action-cards）
说明
左右 两张行动卡片 并排展示，用于引导用户完成两个并列操作（如「完善资料」「邀请分享」）。每张卡含气泡图标/图片、标题、描述；右卡可额外配置右侧插图。
两卡宽度按 flex 比例 分配（如左 42、右 58）。
属性
| 属性 | 说明 | 默认值 / 备注 |
|---|---|---|
| 布局 | ||
| 两卡间距 | 左右卡片间距 | 12rpx |
| 单卡内边距 | 卡片内部留白 | 24rpx |
| 左卡宽度占比 | flex 比例 | 42 |
| 右卡宽度占比 | flex 比例 | 58 |
| 左卡 | ||
| 背景色 / 圆角 | 左卡外观 | — / 24rpx |
| 气泡内容 | 字体图标 或 图片（二选一） | 字体图标 |
| 图标名 / 前缀 / 颜色 | 选图标时配置 | label-o 等 |
| 图片 URL | 选图片时配置 | — |
| 气泡宽 / 高 | 留空自适应 | — |
| 标题 / 描述 | 主副文案 | — |
| 标题字号 / 描述字号 | 文字大小 | — |
| 标题颜色 / 描述颜色 | 文字颜色 | — |
| 标题字重 | 标题粗细 | — |
| 右卡 | 字段同左卡，另增： | |
| 右侧插图 URL | 卡片右侧装饰图 | — |
| 插图宽 / 高 / 圆角 | 插图尺寸 | — |
| 文与图间距 | 文字区与插图间距 | — |
| 气泡公共 | 左右卡共用 | |
| 气泡背景 | 图标/图片容器背景 | — |
| 气泡内边距 / 圆角 | 气泡容器样式 | — |
| 气泡内图标字号 | 字体图标大小 | — |
| 点击动作 | ||
| 左卡 leftClickAction | 点击左卡 | 可选 |
| 右卡 rightClickAction | 点击右卡 | 可选 |
内嵌样式分组
根容器宽高、外边距、内边距、背景、圆角、边框等 → 「样式」 Tab。
属性 Tab 内：布局、左卡、右卡、气泡公共、点击动作。
约束
- 仅 home / feature / custom 页面可添加
- 左、右卡气泡内容为 图标或图片二选一，不可同时生效
小程序广告（xiaoyi-mp-ad）
说明
用于在页面中插入 微信小程序流量主广告，同时在 H5 / App 端展示 占位图，便于编辑器预览与非小程序环境投放自定义素材。
| 运行端 | 展示内容 |
|---|---|
| 微信小程序 | 原生模板广告（ad-custom），需配置 unit-id |
| H5 / App | 占位图 + 可选点击动作 |
前置条件
unit-id 须在微信公众平台 流量主 后台创建广告位后获取。未开通流量主时小程序端无广告展示。
属性
| 属性 | 说明 | 默认值 / 备注 |
|---|---|---|
| 小程序广告 | ||
| 广告位 unit-id | 流量主后台获取的广告单元 ID | 必填（小程序端） |
| 自动刷新间隔（秒） | 0 表示不刷新；≥30 才生效 | 0 |
| 占位图（H5/App） | ||
| 图片地址 | 占位图 URL 或静态路径 | — |
| 显示模式 | 图片缩放模式（如 widthFix 等） | widthFix |
| 占位图高度 | 留空则随宽度自适应 | — |
| 占位图圆角 | 占位图圆角 | 0 |
| 点击事件 | ||
| 占位图点击动作 | H5/App 端点击占位图时的跳转 | 可选 |
内嵌样式分组
根容器样式（宽、高、外边距、内边距、背景等）→ 「样式」 Tab。
属性 Tab 内：小程序广告、占位图、点击事件。
约束
- 仅 home / feature / custom 页面可添加
- unit-id 仅影响微信小程序端；H5/App 始终显示占位图
- 占位图点击动作 不作用于 微信小程序原生广告（由微信 SDK 处理）
- 自动刷新间隔须 ≥30 秒 才会生效