persagy-vant 0.0.40 → 0.0.41

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "persagy-vant",
-  "version": "0.0.40",
+  "version": "0.0.41",
   "description": "Lightweight Mobile UI Components built on Vue",
   "main": "lib/vant.cjs.js",
   "module": "es/index.mjs",

package/skills/use-persagy-vant/references/component-catalog.md

@@ -6,7 +6,7 @@
 
 - `background`：含白色卡片的页面优先使用此容器；一级页面使用 `theme="default"`，其他层级页面使用 `theme="gray"`。仅在没有白色卡片且无明确背景设计时使用 `--van-gray-1`。
 - `nav-bar`、`tabbar`、`tab`、`tabs`、`sidebar`：页面与分区导航。标签较多时优先使用 `tabs` 的滚动或更多面板能力；筛选型分区选择 `type="filter"`。
-- `cell`、`cell-group`、`row`、`col`、`space`、`divider`：信息布局与分组；动态面板的页面触发器优先使用 `cell` 的【单元格】右图标样式（`right-icon="arrow"` + `click`），当前结果使用 `value` 或 `note` 回显。白色卡片内的最后一个可见 `cell` 或 `field` 设置 `border="false"`，不保留末尾分割线。
+- `cell`、`cell-group`、`row`、`col`、`space`、`divider`：信息布局与分组；动态面板的页面触发器优先使用 `cell` 的【单元格】右图标样式（`right-icon="arrow"` + `click`），当前结果使用 `value` 或 `note` 回显。白色卡片内有多个独立信息模块时，模块优先使用 `cell` 公开 `background` 能力承接 `--van-gradient-gray` 或 `--van-gradient-blue` 二次卡片背景；其他容器只使用 `gradient-gray` / `gradient-blue` 公共工具类。白色卡片内的最后一个可见 `cell` 或 `field` 设置 `border="false"`，不保留末尾分割线。
 - `empty`、`loading`、`skeleton`、`overlay`、`pull-refresh`、`list`、`pagination`：加载、空态、刷新与列表分页；页面首次进入使用 `loading` 的 `type="illustration"`，并以纯色背景承载过渡。
 - `collapse-toggle`：卡片内容区的展开/收起触发器；需要两侧分割线时使用其公开 `divider` 能力，不要自绘“查看更多/收起”控件。
 - `bottom-action-bar`、`action-bar`、`submit-bar`：固定操作区；不要自行实现 fixed footer。

package/skills/use-persagy-vant/references/design-interaction-baseline.md

@@ -17,6 +17,7 @@
 - 卡片内容与页面左右边缘保持 `16px` 间距；卡片之间间距 `8px`。
 - 页面含白色卡片时，在滚动内容的最后一张卡片之后必须保留**唯一且恰好 `24px` 高**的页面级空白容器，避免卡片视觉贴近页面底部；该容器不承载业务内容、不计入卡片间距，也不使用自定义组件实现。滚动到末尾时，该 `24px` 即为滚动内容的终点；不得再叠加 `padding-bottom`、安全区占位、空白节点或额外卡片间距，避免出现超过 `24px` 的可滚动空白。存在固定底部操作栏时，空白容器仍位于可滚动内容末尾、操作栏之前；操作栏自身的安全区只作用于操作栏，不得计入或叠加到滚动内容末尾。
 - 模块之间、控件之间使用 `8px` 或 `12px` 间距；仅左右排布的两组字段，纵向间距不得小于 `8px`。
+- 白色卡片内容中存在两个及以上语义独立的信息模块时，每个模块必须以二次卡片封装：普通、中性模块使用 `--van-gradient-gray`，当前重点、选中或待处理模块使用 `--van-gradient-blue`。优先通过组件公开 `background` 能力或 `gradient-gray` / `gradient-blue` 公共工具类实现；不得自行调整渐变、圆角、边框或组件样式。单字段、同一模块内连续字段，以及已由 `info-card`、`work-order-card` 等提供层级的内容不重复封装。
 - 白色卡片内有分割线的控件列表，最后一个可见控件必须隐藏末尾分割线；使用组件公开能力实现，例如 `cell`/`field` 设置 `border="false"`、`material-display-bar` 设置 `divider="false"`。根据条件渲染或 `visible` 判定最后一个实际可见项，不使用 CSS 强行隐藏分割线。
 - 需要展示字段名称与回显值时，优先使用 `label`，不要手写同类标签和值的排版；左侧标签文本尽量自带冒号，保证名称和值之间的统一阅读间距。录入或选择入口仍使用 `field`、`cell` 等对应组件。多字段成组或存在多种字段展示类型（文字、强调文字、链接、标签、图片/视频或纵向字段）时，优先使用 `info-card` + `label`；按字段内容选择 `label` 的公开展示类型和纵向布局。字段无数据时整项隐藏，使用 `info-card` 时通过字段的 `visible: false` 实现。
 - 触发器没有内置按压态时，叠加 `5%` 黑色透明遮罩作为按压反馈；有内置按压态的组件不重复添加。

package/skills/use-persagy-vant/references/element-component-matching.md

@@ -47,6 +47,7 @@
 组件确定后，再根据元素盘点的字段、状态与视觉结构选择 README/demo 中的具体示例。优先使用已有 Props、事件和插槽；不得将 CSS 变量或页面样式作为第一选择。
 
 - **标题**：一级标题固定选 `blue-mark-header`；二级标题固定选默认 `title-bar`。仅在存在真实必填、操作、备注、箭头或展开状态时开启相应 Props。
+- **白色卡片内模块**：先按字段归属划分语义独立模块；出现两个及以上模块时，每个模块使用二次卡片承载。普通、中性模块使用 `--van-gradient-gray`，当前重点、选中或待处理模块使用 `--van-gradient-blue`；优先给支持该能力的组件传入公开 `background`，其他模块容器仅使用 `gradient-gray` / `gradient-blue` 工具类。单字段、同一模块的连续字段及已经由业务卡片承载的内容不再叠加二次卡片，不手写渐变或覆盖组件样式。
 - **单元格**：跳转/打开面板选箭头变体；真实单选/多选选前置或后置选择变体；对象识别选头像；稳定三层信息选三行；多个分类/状态选标签组。单选对象/空间列表为左侧圆点、对象名称和一条位置/说明时，使用「单选单元格-双行样式」：原单选状态绑定 `v-model:left-select`，设置 `select-type="radio"`、`show-left-select`，名称传入 `title`，位置或说明传入 `label`；有位置图标时使用 `show-label-icon` 与 `label-icon="location-o"`。仅原标题已强调时才使用 `title-bold`，并保留原 `click`、可选数量与禁用逻辑，不通过原生 radio 或手写列表行替代。任务或检查项为单行标题、下方标签可因数量换行、右侧同时有状态与下钻入口时，使用「换行标签栏」示例的 `title`、`wrap-tags`、`show-wrap-tags`、`value`、`right-icon="arrow"` 与原有 `click`；只有任务标题在原页面需强调时才加 `title-bold`。分组标题下有多条同级说明（如动作项、执行顺序、执行要求、检查内容）时，使用「多行备注」示例：`title` 保持分组标题，`multi-line-notes` 保持原始说明数组，并开启 `show-multi-line-notes`；一个分组对应一个单元格，保留说明顺序，不合并成自定义段落或手写列表。只有原界面确实支持分组展开/收起时，才启用 `show-title-collapse-icon`、`default-multi-line-notes-collapsed` 及 `update:multi-line-notes-collapsed`；静态说明不要增加折叠或右图标。多个此类单元格位于同一白色卡片时沿用 `cell-group` 分割逻辑，卡片最后一个实际单元格隐藏分割线（`border=false`）。详见 `component-variant-selection.md`。
 - **输入框**：分组标题只服务于一块自由文本录入时（如执行反馈、处理说明、备注），合并为【输入框】「换行文本域」而不是“标题 + 自定义文本框”：用原标题作为 `label`，`type="textarea"`、`label-position="top"`、`input-align="left"`，按既有内容高度使用 `rows` 与 `autosize`，并保留原 `v-model`、`name`、`rules`、`required`、禁用/只读状态和提交校验。文本最大 `200` 字时使用 `maxlength="200"` 与 `show-word-limit`；不为同一字段额外添加 `title-bar`。
 - **文件上传**：图片/视频采集使用【文件上传】模拟器示例「图片/视频表单」；用组件 `label` 承接原标题、`required` 承接必填，`v-model` 保留原文件列表映射，`accept="image/*,video/*"`、`multiple`、`max-count="9"` 和 `preview-size="70"` 承接类型、数量和布局。保留既有 `after-read` 上传处理、上传状态、删除、回显和视频预览事件；不得拆成独立标题、手写“拍照/上传”按钮或自定义预览网格。

package/skills/use-persagy-vant/references/page-recipes.md

@@ -35,6 +35,7 @@
 2. 一级标题使用白色卡片外层的 `blue-mark-header`；卡片内部的二级标题使用默认样式的 `title-bar`，不要手写文本标题。
 3. 需要展示字段名称与回显值时优先使用 `label`，左侧标签文本尽量自带冒号；录入或选择入口仍使用 `field`、`cell` 等对应组件。
 4. 多字段成组或字段类型较多时用 `info-card` 承载 `label`；简单内容再用 `cell-group`、`card`、`divider` 组织分组。
+4.1 白色卡片内有多个语义独立模块时，为每个模块增加二次卡片：普通模块使用 `--van-gradient-gray`，重点、选中或待处理模块使用 `--van-gradient-blue`。优先使用组件公开 `background` 能力，其他容器使用 `gradient-gray` / `gradient-blue` 工具类；不要自定义渐变或重复包裹已有业务卡片。
 5. 按字段内容选择 `label` 的默认、加粗、链接、标签、图片视频或纵向布局；媒体点击接入 `image-preview` 或 `video-preview`。
 6. `info-card` 的接口字段使用 `visible: false` 隐藏无数据项。需要更多字段时优先使用其固定分割线或展开收起能力；其他卡片内容的展开收起使用 `collapse-toggle` 或 `blue-mark-header`，不自行绘制触发器。白色卡片内最后一个实际可见控件如有分割线，使用公开属性隐藏：`cell`/`field` 设 `border="false"`，`material-display-bar` 设 `divider="false"`。
 7. 主要处理动作使用 `bottom-action-bar`；可能造成数据变更的操作先经 `dialog`。

package/skills/use-persagy-vant/references/public-style-system.md

@@ -82,6 +82,12 @@
 | 卡片内容末尾 | 最后一个可见项隐藏分割线 |
 | 卡片页面滚动终点 | 最后卡片后唯一 `24px` 空白容器；不得叠加额外可滚动留白 |
 
+### 白色卡片内的二次信息卡片
+
+白色卡片内容中出现两个及以上语义独立的信息模块时，每个模块需要采用二次卡片承载。二次卡片背景只可使用公共渐变变量：普通、中性的信息模块使用 `--van-gradient-gray`；需要蓝色弱强调的当前重点、选中或待处理模块使用 `--van-gradient-blue`。优先使用目标组件已提供的 `background` 等公开能力（例如【单元格】），或使用 `gradient-gray` / `gradient-blue` 公共工具类承载模块容器；不得自行重配渐变色、透明度、圆角、边框或创建近似卡片样式。
+
+单个字段、同一信息模块内的连续字段或已经由【信息卡片】、【工单卡片】等业务组件提供卡片层级的内容，不额外叠加二次卡片。二次卡片之间仍遵循 `8px` 或 `12px` 的组件/模块间距，内部最后一个实际可见控件照常隐藏末尾分割线。
+
 完整页面规则以 `design-interaction-baseline.md` 为准。
 
 ## 组件级样式索引