深浅模式
笔记列表组件（完整手册）
路径：UI管理 → 页面配置 → 设计 → 左侧 社区内容 → 笔记列表
笔记列表（xiaoyi-note-list-section）是首页、发现页、圈子页的核心 Feed 组件，负责分页展示笔记/帖子，支持下拉加载、与筛选标签联动。
移动端宽度与左右留白
灵萌客户端基于 uni-app，移动端设计稿逻辑宽度为 750rpx，编辑器画布预览与真机一致。只需设置宽度与左边距即可，不必再单独填右边距。适用于卡片、轮播、图片等需要距屏幕边缘一点距离的块级组件。
- 750rpx = 屏幕逻辑全宽
- 若希望组件两侧留空且整体居中：在样式 Tab 将宽度设为 720rpx，左边距设为 15rpx
- 720 + 15 + 15 = 750，即左右各 15rpx 边距
互斥规则
同一页面只能有一个笔记列表、圈子列表或瀑布流，三选一。建议放在画布最底部。
- 首页/发现页：常与筛选标签 + 结束文本（homeListFooter）组合
- 圈子页（forum）：画布仅可添加筛选标签 + 笔记列表；联动目标固定为笔记，不可改为圈子列表
- 与圈子列表、瀑布流互斥；重复添加时编辑器会提示或置灰
数据从哪来
你在属性里改的是卡片长什么样、显示哪些字段，不能手动增删线上某条笔记。
编辑器画布演示笔记（可切换单图/多图/视频/音频预览）
用户 App接口自动分页拉取，按区域、排序、筛选参数返回
属性面板结构（15 个分组）
① 预览示例编辑器内看不同笔记类型效果
② 筛选联动与筛选标签配合刷新列表；见下方验收清单
②b 视频笔记详情页纯视频帖点击去向（平台详情页 / 视频播放页）
③ 整体布局底栏样式（传统双行/评论条/简洁一行）、正文宽度、封面尺寸、卡片间距
④ 显示哪些内容媒体/话题/正文/热评等开关
⑤～⑧ 作者区/昵称下行/标题正文/底栏互动字号、颜色、行高
⑨ 评论条外观仅模板 2 时显示
⑩～⑮ 位置圈子行/音频/图标/用户标签/预览作者/点击卡片用户标签样式在 UI管理 → 自定义标签 统一配置，笔记列表内无需单独设
① 预览示例
预览只改画布演示内容，不会覆盖已配好的颜色、字号等样式；也不会影响线上数据。
单图 / 多图 / 视频 / 音频画布塞对应类型笔记演示
恢复默认回到编辑器默认示例
② 筛选联动
与上方「筛选标签」使用相同「联动标识」时，用户切换 Tab 会按该 Tab 的排序/筛选参数重新请求笔记列表（GET /api/notes）。联动标识不一致是最常见原因：两边必须一字不差。圈子页只能联动笔记列表，不能联动圈子列表。
联动标识须与筛选标签填完全相同的字符串；两边都留空则默认为 default。管理端属性面板显示为「联动标识」，技术字段名 filterLinkKey
- 【编辑器】画布上方已添加筛选标签，且全页仅 1 个
- 【编辑器】筛选标签「下方内容模式」= 列表 API 联动（不是 Tab 独立内容区）
- 【编辑器】筛选标签「联动目标」= 笔记列表（圈子页固定为笔记，不可选圈子）
- 【编辑器】筛选标签与笔记列表的「联动标识」完全一致（如 home-feed）
- 【编辑器】筛选标签每个 Tab 已配置排序、笔记类型、圈子/话题等参数
- 【编辑器】笔记列表放在筛选标签正下方，且与圈子列表/瀑布流三选一
- 【发布】页面已保存并在列表中启用，客户端区域与编辑区域一致
- 【客户端】切换「推荐/最新/视频」等 Tab，列表内容或排序明显变化
- 【客户端】切换 Tab 时出现加载态，切换后页脚（homeListFooter）同步进入加载中
- 【客户端】下拉刷新、上拉加载更多均正常
筛选标签侧常用参数
在筛选标签组件里，展开每个 Tab 项配置。以下字段名与后台属性面板一致。个性化推荐需后台开启推荐能力；不可用时自动降级为智能热度。
显示文字Tab 上显示的名称，如推荐、最新、视频
排序（笔记）智能热度、个性化推荐、创建时间、点赞、浏览、评论等；最新一般用降序
圈子 / 话题留空=不限；可点选择器指定只看某圈子或话题下的笔记
笔记类型全部 / 图文 / 视频 / 语音；「视频」Tab 选 type=视频
排除置顶「最新」类 Tab 可开启，避免置顶帖占满首屏
②b 视频笔记详情页
平台详情页进入标准笔记详情页
视频播放页进入沉浸式视频播放页（需功能开通）
③ 整体布局
底栏样式 — 传统双行互动数据与时间分两行展示
底栏样式 — 评论条底部装饰性假评论输入条（模板 2 专属样式分组）
底栏样式 — 简洁一行一行图标 + 数字（默认，推荐）
正文区域宽度跟随底栏 / 与头像对齐 / 撑满整行
封面边长 thumbSize封面图边长 rpx，默认约 176
卡片间距 listItemGap每条笔记卡片之间的间距，默认 20 rpx
④ 显示哪些内容（开关一览）
showCover图片视频 — 关闭后不显示封面/视频/多图
hideTopic / hideContent / hideHotComment话题标签 / 正文摘要 / 热评预览
authorSublineTimeCircle昵称下行 — 日期 | 来自 · 圈子
hideAuthorMetaRow / hideLocationCircleRow / hideFooterTime认证标签 / 位置圈子 / 底栏时间
multiImageScroll / imageCollageTemplate多图横滑 / 拼图样式
⑤～⑧ 样式类属性
作者区avatarSize 68rpx、avatarRadius、nicknameFontSize 26、nicknameFontWeight 700
昵称下行authorSublineFontSize 18、authorSublineCircleLogoSize 22、胶囊内边距等
标题与正文titleFontSize 30、contentFontSize 26、mutedColor #999999
底栏互动likeLabel 赞、commentLabel 评、browseLabel 浏览、actionLikeActiveColor 已赞色
⑬ 用户标签与自定义标签
笔记卡片上作者昵称旁的角标（热帖、认证、性别、圈主等）不在笔记列表里逐条配置，而是由业务规则决定「显示什么」，由「自定义标签」决定「长什么样」。- 业务决定显示：如笔记被标为热帖、作者已认证、来自某圈子 — 由笔记/圈子/用户体系自动带上 tag_name
- 样式决定外观：UI管理 → 自定义标签，按 tag_name 配置背景、文字、图标等，App 通过 /api/system/tag-styles 拉取
- 笔记列表属性里「用户标签」分组仅有说明，与后台 note-list-card-props 一致：此处无需单独设置
- 「预览作者信息」仅影响编辑器画布演示，线上以接口返回的作者数据为准
- 改完标签样式后建议客户端强刷；区域专属样式需在对应区域下配置或「从平台同步」
自定义标签配置文档
⑨ 评论条外观（仅模板 2）
评论条仅装饰，用户点击会进详情页评论，不能在此直接发文。
commentPlaceholder如写评论...
miniAvatarSize默认 48 rpx
输入框背景色/圆角/内边距灰底圆角条
样式 Tab 分层说明
- 列表与上方模块间距 → 样式 marginTop 20～30
- 卡片白底圆角 → 样式背景 #FFF、圆角 16、内边距 24
- 标题字号 → 属性标题字号 30，不是样式 Tab
尺寸、外边距整个列表区域（section 外壳）
内边距、背景、圆角、边框每一条卡片内部的外壳
属性 Tab卡片里文字、图标、开关
⑮ 点击卡片
clickAction整条笔记点击跳转；留空时进入笔记详情页
三套推荐配置方案
- 方案 A 标准校园首页：uiTemplate 3 + 联动 Key home-feed + 筛选三 Tab + 媒体/话题/正文/热评/位置圈子全开
- 方案 B 轻量瀑布信息流：uiTemplate 3 + 关热评 + 关底栏时间 + thumbSize 200
- 方案 C 重互动社区：uiTemplate 2 评论条 + 占位说点什么... + 热评开
保存与验收
- 1保存并启用保存页面 → 列表启用 → App 切到对应区域
- 2列表基础首屏加载、上拉加载更多、点击笔记进详情、点赞变已赞色
- 3筛选联动按上方「② 筛选联动」验收清单逐项在客户端验证
- 切换筛选 Tab 后列表数据/排序发生变化
- 「视频」Tab 仅展示视频笔记（若已配置笔记类型筛选）
- 圈子页笔记列表受圈子上下文约束，联动目标不可改为圈子列表
- 用户角标（热帖/认证等）样式与「自定义标签」配置一致
常见问题
切换 Tab 列表不变联动 Key 不一致 — 标签与列表填相同标识。
列表空白区域无笔记或筛选过严 — 发测试帖；检查 circle_id、topic_id。
改了样式线上没变未启用或区域不对 — 启用配置；核对区域。
推荐排序无效Gorse 未部署 — 换智能热度或部署推荐服务。
认证标签样式不对去 UI管理 → 自定义标签 配置。