persagy-vant 0.0.32 → 0.0.34

package/package.json

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

package/skills/use-persagy-vant/SKILL.md

@@ -13,9 +13,9 @@ description: 使用 Persagy Vant 为 Vue 3 移动端业务页面规划、实现
 2. 阅读 `references/design-interaction-baseline.md`，将其中适用的设计、状态和反馈规则落实到页面；如与产品需求冲突，以明确的产品需求为准并说明差异。
 3. 阅读 `references/business-component-catalog.md`，按用户任务先确定业务组件；再从 `references/component-catalog.md` 补齐基础组件。
 4. 按 `references/component-documentation.md` 的查阅流程读取每个被选中组件的 README 和 demo：在组件库仓库中使用 `packages/persagy-mobile/src/<component>/README.zh-CN.md`，在业务项目中使用 `node_modules/persagy-vant/es/<component>/README.zh-CN.md`。涉及视觉、插槽或类型扩展时，同时查阅 `var.less`、类型定义和 demo；API、事件、插槽和导入方式均以这些资料为准。
-5. 按 `references/page-recipes.md` 组合页面，补齐加载、空数据、错误、禁用和提交中状态。
+5. 按 `references/page-recipes.md` 组合页面，补齐加载、空数据、错误、禁用和提交中状态。用户要求“审查并优化当前页面”或语义等同的 UI 优化时，默认按 `references/reuse-policy.md` 的非侵入式优化规则执行：不得改变已有接口、请求/响应数据、字段映射、数据内容或业务事件。
 6. 使用组件提供的 props、事件、插槽、Less 变量或公开 class 扩展点；不得复制组件内部 DOM、样式或私有逻辑。
-7. 输出或提交前，按 `references/reuse-policy.md` 和 `references/design-interaction-baseline.md` 完成自查，并附上“组件复用清单”和“规范落实项”。
+7. 输出或提交前，按 `references/reuse-policy.md` 和 `references/design-interaction-baseline.md` 完成自查，并附上“组件复用清单”“规范落实项”和“业务与数据兼容核查”。组件复用清单必须按 `references/component-documentation.md` 使用官网中文名称和可点击的组件展示链接。
 
 ## 组件缺口
 

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

@@ -17,7 +17,7 @@
 | 工单列表的组合筛选 | `work-order-filter` | 项目、时间、排序、待办和工单类型筛选 |
 | 业务层级选项 | `tree-select` | 单选/多选树、父子联动和展开收起 |
 | 页面底部主次操作 | `bottom-action-bar` | 固定底栏、更多操作、按钮 loading/disabled |
-| 蓝色标识或业务标注 | `blue-mark` | 相同视觉的业务标签/标记 |
+| 页面一级标题或蓝色业务标识 | `blue-mark-header` / `blue-mark` | 一级标题使用位于白色卡片外层的 `blue-mark-header`；仅作业务标识时使用 `blue-mark` |
 | 展示字段或多类型详情字段 | `label` / `info-card` + `label` | 单个字段回显优先 `label`，左侧标签文本尽量自带冒号；字段成组或类型较多时用 `info-card` 承载，并支持接口字段可见性、更多信息与展开收起 |
 | 视频预览 | `video-preview` | 视频预览容器与交互 |
 | AI 对话面板/移动端 bot | `bot-mobile` 系列（`BotMobile`/`BotMobilePrompts`/`BotMobileContextTags`/`BotMobileSheet`/`BotMobileView`/`BotFab`/`BotHistoryDrawer`/`BotVoiceBar`/`BotSessionList`） | 对话流、消息渲染、示例输入、上下文标签、呼出面板、纯展示消息渲染、悬浮入口、会话历史抽屉、按住说话和全部会话列表 |

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

@@ -6,26 +6,28 @@
 
 - `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`、`cell-group`、`row`、`col`、`space`、`divider`：信息布局与分组；动态面板的页面触发器优先使用 `cell` 的【单元格】右图标样式（`right-icon="arrow"` + `click`），当前结果使用 `value` 或 `note` 回显。
 - `empty`、`loading`、`skeleton`、`overlay`、`pull-refresh`、`list`、`pagination`：加载、空态、刷新与列表分页；页面首次进入使用 `loading` 的 `type="illustration"`，并以纯色背景承载过渡。
 - `collapse-toggle`：卡片内容区的展开/收起触发器；需要两侧分割线时使用其公开 `divider` 能力，不要自绘“查看更多/收起”控件。
 - `bottom-action-bar`、`action-bar`、`submit-bar`：固定操作区；不要自行实现 fixed footer。
 
 ## 表单与通用选择
 
-- `form-panel` + `form` + `field`：多字段编辑的表单面板、校验、输入与只读选择入口；不要将同一编辑任务拆为零散弹层。
+- `form-panel` + `form` + `field`：多字段编辑的表单面板、校验、输入与只读选择入口；需要录入文本时统一采用【输入框】换行文本域样式：`type="textarea"`、`label-position="top"`、`maxlength="200"`、`show-word-limit`，并按内容使用 `rows`、`autosize`。不要将同一编辑任务拆为零散弹层，也不要自绘文本域。
+- `radio-panel`、`checkbox-panel`：动态面板内的单项和多项选择；单选使用 `radio-panel` 的 `v-model` 与 `select`，多选使用 `checkbox-panel` 的 `v-model` 与 `confirm`，不要自行拼接选择底部面板。
+- `uploader`：图片、视频和文件上传统一采用【文件上传】表单示例的字段标签、白色卡片、上传与预览布局；使用 `accept` 区分文件类型，使用 `multiple`、`max-count="9"` 和 `preview-size="70"` 配置多文件上传。上传状态、删除、大小校验和超限提示只使用其公开 Props、事件和插槽。
 - `checkbox`、`radio`、`switch`、`stepper`、`rate`、`slider`：布尔、单选、多选与数值录入。
 - `picker`、`datetime-picker`、`calendar`、`area`、`cascader`、`tree-select`：普通选项、日期、地区、级联与树形数据选择。
-- `search`、`filter-tag`、`dropdown-menu`、`dropdown-item`：搜索与轻量筛选；短选项的外露筛选优先使用 `filter-tag`，需要更大触达面积时选其大尺寸规格。
+- `search`、`filter-tag`、`dropdown-menu`、`dropdown-item`：搜索与轻量筛选；识别到搜索功能时，`search` 统一使用【搜索】纯净样式 `variant="pure"`，沿用 `v-model`、`search`、`cancel` 等公开能力连接既有筛选逻辑，不手写搜索区域。短选项的外露筛选优先使用 `filter-tag`，需要更大触达面积时选其大尺寸规格。
 
 ## 内容与反馈
 
 - `label`：字段名称与回显值的首选组件，覆盖默认、加粗、链接、标签、图片视频及纵向布局；需要字段展示时优先使用，除录入、选择入口等应使用 `field` 或 `cell` 的场景外，不要为同类字段自行拼接样式。左侧标签文本尽量自带冒号，保证名称和值之间的统一阅读间距；按字段内容选择其公开展示类型。
 - `info-card`：多种类型字段的白色信息卡片，可接收字段数组或插槽，并提供更多字段、固定分割线与展开收起能力；字段类型较多时优先使用，内部字段使用 `label` 呈现。
-- `blue-mark`、`blue-mark-header`：分组/卡片标题及标题栏操作；标题栏需要必填标识、右侧操作或展开收起时优先使用 `blue-mark-header`。
-- `title-bar`：卡片内的普通分组标题；用 `show-description`、`show-icon`、`show-arrow`、`size` 和 `expandable`/`v-model` 组合备注、图标、箭头和展开内容。视觉调整只使用其 `--van-title-bar-*` 公开变量。
+- `blue-mark`、`blue-mark-header`：一级标题和业务标识；页面一级标题统一使用放在白色卡片外层的 `blue-mark-header`，需要必填标识、右侧操作或展开收起时使用其公开能力，不手写同类标题栏。
+- `title-bar`：白色卡片内的二级标题统一使用默认样式（不使用 `mini`）；用 `show-description`、`show-icon`、`show-arrow` 和 `expandable`/`v-model` 组合备注、图标、箭头和展开内容。视觉调整只使用其 `--van-title-bar-*` 公开变量。
 - `card`、`tag`、`badge`、`notice-bar`、`image`、`icon`：内容展示与状态标识。
-- `popup`、`action-sheet`、`share-sheet`、`popover`：动作选择与自定义容器。
+- `popup`、`action-sheet`、`share-sheet`、`popover`：动作选择与自定义容器；动态面板必须先检查 `content-panel`、`form-panel`、`radio-panel`、`checkbox-panel`。四者不适用且自定义内容较多时，使用 `action-sheet` 的【动作面板】自定义面板样式，以 `title` 和默认插槽承载内容；仅少量轻量内容才使用 `popup`。
 - `content-panel`：承载需阅读确认的分组内容，使用 `v-model:show`、`title`、`confirm-text`、`show-footer` 和 `confirm`/`close` 事件完成打开、确认与关闭；用 `footer` 插槽替换默认确认区。内部优先组合 `cell`、`blue-mark-header`、`title-bar`、`material-display-bar`；视觉调整只使用 `--van-content-panel-background`、`--van-content-panel-radius`、`--van-content-panel-footer-padding`。
 - `dialog`、`toast`、`notify`：确认、短反馈与顶部通知；不得重复封装确认弹窗或全局提示。
 - `friendly-tip`、`popover`：基于触发元素的引导说明和轻量操作菜单。一次性友好引导使用 `friendly-tip`，点击空白处关闭；不要手写定位气泡。
@@ -33,10 +35,14 @@
 
 ## 选型规则
 
-- 需要承载自定义表单/内容：使用 `popup`；仅确认操作：使用 `dialog`；短暂提示：使用 `toast` 或 `notify`。
+- 动态面板选型顺序：阅读/确认内容使用 `content-panel`；表单编辑/提交使用 `form-panel`；单选使用 `radio-panel`；多选使用 `checkbox-panel`；四者均不适用且自定义内容较多时使用 `action-sheet` 的【动作面板】自定义面板样式；仅少量轻量内容才使用 `popup`。仅确认操作使用 `dialog`；短暂提示使用 `toast` 或 `notify`。
 - 可分页的业务列表：组合 `list`、`pull-refresh`、`empty`、`loading`，不要手写重复加载状态。
 - 页面首次进入：纯色页面背景叠加 `loading type="illustration"`，数据就绪后再展示内容；局部加载按实际范围使用 `loading` 或 `skeleton`。
 - 需要展示字段名称与回显值时优先使用 `label`，并让左侧标签文本尽量自带冒号；字段成组或类型较多时选择 `info-card` + `label`。只有简单、不需要统一字段样式或展开逻辑的内容才组合 `cell-group` 或 `card`。
-- 选择入口默认使用 `field` 或 `cell`，具体选择面板优先从 `business-component-catalog.md` 选择。
+- 标题层级：白色卡片外的一级标题使用 `blue-mark-header`；白色卡片内的二级标题使用默认样式的 `title-bar`。不以普通文本或自绘标题替代。
+- 上传内容：图片、视频、文件一律使用 `uploader` 的【文件上传】表单示例样式；已达 `9` 个时继续点击上传区域，提示“最多支持上传9个”。
+- 文本录入：一律使用 `field` 的【输入框】换行文本域样式（`type="textarea"` + `label-position="top"`）；最大 `200` 字并显示字数统计。
+- 搜索：一律使用 `search variant="pure"` 的【搜索】纯净样式；保留既有 `v-model`、`search` 和 `cancel` 事件语义。
+- 动态面板触发器优先使用 `cell` 的【单元格】右图标样式（`right-icon="arrow"` + `click`）；当前结果使用 `value` 或 `note` 回显。具体面板优先从 `business-component-catalog.md` 选择。
 - 页面有主操作时优先使用 `bottom-action-bar`；在表单提交语义明确时使用 `submit-bar`。
 - 非破坏性的局部快捷操作使用 `popover`；会影响全局数据或需要确认的操作不使用气泡菜单。

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

@@ -33,6 +33,25 @@
 使用 $use-persagy-vant 实现可编辑的工单详情。先从组件目录选择组件，再阅读所选组件说明后实现；交付时列出组件复用清单和实际使用的扩展能力。
 ```
 
+## 交付中的组件复用清单
+
+组件复用清单面向产品经理，组件名不得使用代码名（如 `label`、`bottom-action-bar`）或自行翻译。交付前执行以下规则：
+
+1. 从 `packages/persagy-mobile/vant.config.mjs` 的 `site.locales['zh-CN'].nav` 读取组件官网导航名称和 `path`；在已安装包项目中，从同包的 `vant.config.mjs` 或已发布文档导航读取。
+2. 使用官网导航名称中的中文名称作为链接文字，并链接到 `https://persagy-vant-ai.netlify.app/#/zh-CN/<path>`。例如：`[字段展示](https://persagy-vant-ai.netlify.app/#/zh-CN/label)`、`[动作栏](https://persagy-vant-ai.netlify.app/#/zh-CN/bottom-action-bar)`。
+3. 若官网导航本身展示“中文名称 + 英文名称”，可保留其完整名称，确保与网站完全一致；不得使用组件目录名替代名称。
+4. 若组件尚未出现在官网中文导航或未发布，禁止编造跳转地址；以官网中文名称（如可取得）标注“待官网发布”，并在交付中说明。
+
+清单格式如下：
+
+```md
+## 组件复用清单
+
+- [字段展示](https://persagy-vant-ai.netlify.app/#/zh-CN/label)：展示字段名称与回显值；左侧标签使用冒号。
+- [信息卡片](https://persagy-vant-ai.netlify.app/#/zh-CN/info-card)：承载成组详情字段。
+- [动作栏](https://persagy-vant-ai.netlify.app/#/zh-CN/bottom-action-bar)：承载页面级提交操作。
+```
+
 ## 组件 README 的维护标准
 
 每个组件 README 至少维护以下内容：

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

@@ -5,6 +5,8 @@
 ## 页面结构与导航
 
 - 应用外页面层级不超过 `5` 级；动态面板嵌套不超过 `2` 层。复杂且相对独立的功能使用独立页面；需要即时录入、查看或回显当前页面数据的轻量任务使用动态面板。
+- 识别到动态面板时，先按内容复用专用面板：阅读/确认内容使用 `content-panel`，编辑或提交表单使用 `form-panel`，单项选择使用 `radio-panel`，多项选择使用 `checkbox-panel`。四者均无法覆盖且自定义内容较多时，使用 `action-sheet` 的【动作面板】自定义面板样式（`title` + 默认插槽）；仅少量、轻量的自定义内容才使用 `popup` 等通用容器。微调只能使用所选面板公开的 Props、事件、插槽和样式变量，不得重写面板结构。
+- 有动态面板可触发时，页面触发器优先使用 `cell` 的【单元格】右图标样式：设置 `right-icon="arrow"` 并使用 `click` 事件打开面板；需要展示当前选择结果时使用 `value` 或 `note`。不得手写同类行入口或箭头图标。
 - 普通下钻页面进入和返回使用左右转场；从左上角关闭的页面优先使用上下转场；展开与收起提供缓动效果。优先复用组件内置动效。
 - 带返回箭头的页面支持从左侧边缘左滑返回；仅在宿主框架支持时启用，不得以页面 CSS 模拟系统手势。
 
@@ -17,15 +19,17 @@
 - 需要展示字段名称与回显值时，优先使用 `label`，不要手写同类标签和值的排版；左侧标签文本尽量自带冒号，保证名称和值之间的统一阅读间距。录入或选择入口仍使用 `field`、`cell` 等对应组件。多字段成组或存在多种字段展示类型（文字、强调文字、链接、标签、图片/视频或纵向字段）时，优先使用 `info-card` + `label`；按字段内容选择 `label` 的公开展示类型和纵向布局。字段无数据时整项隐藏，使用 `info-card` 时通过字段的 `visible: false` 实现。
 - 触发器没有内置按压态时，叠加 `5%` 黑色透明遮罩作为按压反馈；有内置按压态的组件不重复添加。
 - 字体跟随设备系统字体。常规层级使用：一级标题 `16px` 加粗、二级标题与正文 `14px`、补充说明 `12px`、底部菜单最小 `10px`；有明确业务需要时可调整。
-- 信息层级最多使用四级：一级标题优先采用 `blue-mark`，二级使用灰底加粗文本，三级使用白底加粗文本，四级使用弱化的卡片内容；特殊业务可按组件文档调整。
-- `blue-mark` 用作一级标题时优先选 `16px` 规格，作为二级分类时可选 `14px` 规格；与下方内容左对齐，长文本允许换行或省略，换行时顶部对齐。
+- 页面标题层级统一使用组件：一级标题使用 `blue-mark-header`（【小蓝标】标题栏），放在白色卡片外层，与卡片内容左对齐；二级标题使用 `title-bar` 默认样式，放在白色卡片内。不得以普通文本、手写竖标或灰底加粗文本替代这两级标题。
+- 一级标题需要必填标识、右侧操作或展开收起时，使用 `blue-mark-header` 的公开 `required`、`action-text`、`expandable`/`v-model` 能力；二级标题需要备注、图标、箭头或展开收起时，使用 `title-bar` 的默认规格及公开 Props。长文本允许换行或省略，换行时顶部对齐。
 - 即时反馈控件（如开关、单选、多选、滚轮、滑块）可不额外设置按压态；所有其他可点击文本和自定义触发器必须提供按压态。
 - 触控热区最小为 `24 × 24px`；视觉元素不足时用透明容器扩大热区，并在受限空间内尽量增大可点范围。
 
 ## 输入、上传与时间
 
-- 文本域最大输入 `200` 字，并在输入阶段限制或阻止超出内容。
-- 图片/视频上传最多 `9` 个。已达上限再次触发上传时，提示“最多支持上传9个”。
+- 识别到需要实际录入文本的字段时，统一使用 `field` 的【输入框】换行文本域样式：`type="textarea"` + `label-position="top"`，在白色表单卡片内展示标签与左对齐的输入内容；不要使用普通单行输入框或自绘文本域。按内容高度使用公开 `rows`、`autosize` 能力。
+- 换行文本域最大输入 `200` 字，使用 `maxlength="200"` 和 `show-word-limit`，并在输入阶段限制或阻止超出内容。
+- 识别到图片、视频、文件等上传内容时，统一使用 `uploader` 的【文件上传】表单示例样式：在白色表单卡片内以字段标签配合上传与预览区域呈现，不手写上传入口、预览网格或文件列表。按内容设置 `accept`，图片/视频可使用 `multiple`；样式沿用表单示例的 `preview-size="70"`，需要展示文件时仍使用同一表单布局。
+- 图片/视频上传最多 `9` 个；表单示例的布局可复用，但 `max-count` 必须按全局限制设为 `9`，不能沿用 demo 的 `4`。已达上限再次触发上传时，通过 `click-upload` 等公开事件提示“最多支持上传9个”。
 - 时间选择器默认定位到当前时间；需要时间节点时精确到秒。
 - 涉及多个字段的编辑时，使用 `form` 承载于表单面板中完成；不得将同一编辑任务拆散到多个零散入口。
 - 选项不超过 `3` 个且文案短时可外露单选；其他单选使用单选面板。多选枚举选项超过 `6` 个时，优先选用组件库提供的底部多选快捷操作能力。
@@ -39,6 +43,7 @@
 
 ## 搜索、列表与加载
 
+- 识别到搜索功能时，统一使用 `search` 的【搜索】纯净样式：设置 `variant="pure"`，不手写搜索输入区域或外层背景。使用既有 `v-model` 和 `search` 事件连接原有筛选逻辑；非业务必需时使用 `show-action` 和 `cancel` 事件提供取消操作。
 - 点击搜索入口后自动聚焦并唤起键盘；非业务必需时，在搜索态提供取消操作。键盘唤起后内容区不保留无关内容。
 - 列表使用 `pull-refresh` 处理下拉刷新，使用 `list` 处理滚动加载；无更多数据时展示明确的结束提示。
 - 整个页面首次进入时，先以纯色页面背景叠加 `loading` 的 `type="illustration"` 作为过渡；数据就绪后再展示正常页面内容。局部请求或后续请求超过 `500ms` 时，使用 `loading` 或 `skeleton` 等相应加载反馈，不以页面级插画加载替代局部反馈。

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

@@ -11,27 +11,29 @@
 ## 创建/编辑业务单据
 
 1. `nav-bar` 放置标题和返回操作。
-2. 多字段编辑在表单面板内使用 `form` + `field` 组织输入与校验；选择字段仅作为触发器。
-3. 需要人员、位置、对象或物料时，接入对应 Persagy 业务组件；物料选择使用 `material-add` 的数量数组双向绑定和 `change`/`confirm` 事件，已选物料用 `material-display-bar` 回显。
-4. 使用 `bottom-action-bar` 放置保存、提交或次操作；提交中禁用重复点击。
-5. 成功使用 `toast`，离开未保存页面使用 `dialog` 确认。
+2. 多字段编辑在表单面板内使用 `form` + `field` 组织输入与校验；需要文本录入时，`field` 统一采用【输入框】换行文本域样式：`type="textarea"`、`label-position="top"`、`maxlength="200"`、`show-word-limit`，并按内容使用 `rows`、`autosize`。选择字段仅作为触发器。
+3. 图片、视频、文件上传使用 `uploader` 的【文件上传】表单示例样式：字段标签与上传区域置于白色表单卡片内；按内容设置 `accept`，多文件使用 `multiple`、`max-count="9"` 和 `preview-size="70"`，达到上限再次点击提示“最多支持上传9个”。
+4. 需要人员、位置、对象或物料时，接入对应 Persagy 业务组件；物料选择使用 `material-add` 的数量数组双向绑定和 `change`/`confirm` 事件，已选物料用 `material-display-bar` 回显。
+5. 使用 `bottom-action-bar` 放置保存、提交或次操作；提交中禁用重复点击。
+6. 成功使用 `toast`，离开未保存页面使用 `dialog` 确认。
 
 ## 可筛选的业务列表
 
 1. 页面含白色卡片时，用 `background` 承载页面内容：一级页面使用 `theme="default"`，其他层级页面使用 `theme="gray"`。
-2. 顶部使用 `search` 或已有的筛选触发入口。
+2. 顶部搜索使用 `search variant="pure"` 的【搜索】纯净样式；沿用既有 `v-model` 与 `search` 事件连接筛选逻辑，不手写搜索输入区域。
 3. 工单场景使用 `work-order-filter`；其他复杂条件使用 `popup` + `form` + 现有选择组件。
-4. 搜索触发后自动聚焦；非业务必需时提供取消操作。使用 `pull-refresh` + `list` 呈现数据，首屏/分页加载使用 `loading`，无结果使用 `empty`，末页显示无更多数据提示。
+4. 搜索触发后自动聚焦；非业务必需时使用 `show-action` 和 `cancel` 提供取消操作。使用 `pull-refresh` + `list` 呈现数据，首屏/分页加载使用 `loading`，无结果使用 `empty`，末页显示无更多数据提示。
 5. 简单列表项使用 `cell` 或 `card`；工单需要展示标签、位置、展开详情或行内操作时使用 `work-order-card`，并与 `background` 组合；状态使用 `tag` 或 `badge`。
 
 ## 详情与处理页
 
 1. 页面含白色卡片时，用 `background` 承载页面内容：一级页面使用 `theme="default"`，其他层级页面使用 `theme="gray"`。
-2. 需要展示字段名称与回显值时优先使用 `label`，左侧标签文本尽量自带冒号；录入或选择入口仍使用 `field`、`cell` 等对应组件。
-3. 多字段成组或字段类型较多时用 `info-card` 承载 `label`；简单内容再用 `cell-group`、`card`、`divider` 组织分组。
-4. 按字段内容选择 `label` 的默认、加粗、链接、标签、图片视频或纵向布局；媒体点击接入 `image-preview` 或 `video-preview`。
-5. `info-card` 的接口字段使用 `visible: false` 隐藏无数据项。需要更多字段时优先使用其固定分割线或展开收起能力；其他卡片内容的展开收起使用 `collapse-toggle` 或 `blue-mark-header`，不自行绘制触发器。
-6. 主要处理动作使用 `bottom-action-bar`；可能造成数据变更的操作先经 `dialog`。
+2. 一级标题使用白色卡片外层的 `blue-mark-header`；卡片内部的二级标题使用默认样式的 `title-bar`，不要手写文本标题。
+3. 需要展示字段名称与回显值时优先使用 `label`，左侧标签文本尽量自带冒号；录入或选择入口仍使用 `field`、`cell` 等对应组件。
+4. 多字段成组或字段类型较多时用 `info-card` 承载 `label`；简单内容再用 `cell-group`、`card`、`divider` 组织分组。
+5. 按字段内容选择 `label` 的默认、加粗、链接、标签、图片视频或纵向布局；媒体点击接入 `image-preview` 或 `video-preview`。
+6. `info-card` 的接口字段使用 `visible: false` 隐藏无数据项。需要更多字段时优先使用其固定分割线或展开收起能力；其他卡片内容的展开收起使用 `collapse-toggle` 或 `blue-mark-header`，不自行绘制触发器。
+7. 主要处理动作使用 `bottom-action-bar`；可能造成数据变更的操作先经 `dialog`。
 
 ## 编辑与全局操作
 
@@ -47,10 +49,11 @@
 
 ## 选择型流程
 
-1. 使用 `field` 或 `cell` 显示当前选择结果并触发面板。
+1. 有动态面板可触发时，优先使用 `cell` 的【单元格】右图标样式（`right-icon="arrow"` + `click`）显示当前选择结果并触发面板；结果使用 `value` 或 `note` 回显。
 2. 选项不超过 3 个且文本短时可外露单选；其他单选及所有复杂选择均使用面板。多选枚举选项超过 6 个时，优先选择组件库的底部多选快捷操作能力。
-3. 使用业务组件完成选择；仅在通用场景选择 `picker`、`cascader`、`tree-select`、`calendar` 等。
-4. 使用对应 `change`、`confirm`、`select` 事件同步页面状态，不读取组件内部 DOM。
+3. 动态单选优先使用 `radio-panel`，通过 `v-model` 和 `select` 同步；动态多选优先使用 `checkbox-panel`，通过 `v-model` 和 `confirm` 同步。需要录入/提交时使用 `form-panel`，需要阅读确认时使用 `content-panel`。
+4. 使用业务组件完成选择；仅在通用场景选择 `picker`、`cascader`、`tree-select`、`calendar` 等。上述专用面板都不能覆盖且自定义内容较多时，使用 `action-sheet` 的【动作面板】自定义面板样式（`title` + 默认插槽）；仅少量轻量内容才使用 `popup`。
+5. 使用对应 `change`、`confirm`、`select` 事件同步页面状态，不读取组件内部 DOM。
 
 ## 楼层空间选择
 

package/skills/use-persagy-vant/references/reuse-policy.md

@@ -7,6 +7,16 @@
 - 必须处理 loading、empty、error、disabled 或 submitting 等与页面类型相关的状态；整个页面首次进入时，使用纯色背景叠加 `loading type="illustration"` 进行过渡。
 - 必须在最终回复、PR 描述或交付说明中附上组件复用清单。
 
+## 当前页面审查与优化：非侵入式规则
+
+当用户提出“审查并优化当前页面”、UI 优化、视觉改造或同义需求时，默认只优化页面布局、组件复用、样式、可访问性和既有状态的呈现；未经用户明确授权，不得改变业务逻辑或数据契约。
+
+1. 修改前识别并保留当前页面的接口调用、请求方法和参数、响应字段映射、数据转换、展示字段、加载/空态/错误状态、路由参数及业务事件。
+2. 禁止修改接口地址、请求方法、请求参数、响应结构假设、字段名称/含义、返回数据映射、数据展示内容、事件回调语义、权限判断或提交逻辑；不得为适配组件而改变接口返回值或业务数据结构。
+3. 仅允许将既有数据和事件原样传入 Persagy Vant 的公开 Props、事件和插槽；如组件所需数据形态不同，只能增加不改变原数据含义的页面级适配，且不得删除、改名、过滤或篡改原有数据。
+4. 如优化确实需要修改接口、数据模型、字段展示含义或业务流程，先停止实施并向用户说明影响，获得明确授权后再改动。
+5. 交付前检查代码差异和可用测试：确认接口调用与参数、响应字段映射、关键展示字段和业务事件未变；存在相关测试时运行，无法运行时说明原因和已完成的静态核对。
+
 ## 禁止事项
 
 - 禁止重写已有的按钮、字段、表单、选择器、树、弹层、提示、列表分页、固定底栏或业务选择面板。
@@ -24,14 +34,22 @@
 
 ```md
 ## 组件复用清单
-- <组件名>：<承担的页面职责>
-- <组件名>：<承担的页面职责>
+- [<官网中文组件名>](https://persagy-vant-ai.netlify.app/#/zh-CN/<组件路径>)：<承担的页面职责与关键公开能力>
+- [<官网中文组件名>](https://persagy-vant-ai.netlify.app/#/zh-CN/<组件路径>)：<承担的页面职责与关键公开能力>
+
+组件名和路径必须从 `component-documentation.md` 指定的官网中文导航读取；未发布组件标注“待官网发布”，不得编造链接。
 
 ## 页面状态
 - 加载：<处理方式>
 - 空数据：<处理方式>
 - 失败/提交中：<处理方式>
 
+## 业务与数据兼容核查
+- 接口调用、请求方法与参数：未改动 / <经授权的变更>
+- 响应字段映射与数据展示内容：未改动 / <经授权的变更>
+- 路由参数、业务事件、权限与提交逻辑：未改动 / <经授权的变更>
+- 验证：<已运行的相关测试或静态差异核对结果>
+
 ## 组件缺口
 - 无；或见组件缺口说明。
 ```

package/skills/use-persagy-vant/references/usage-patterns.md

@@ -6,20 +6,22 @@
 
 ## 表单页
 
-以 `form` 作为校验与提交边界，用 `field` 承载输入或只读选择入口。选择型字段连接已有选择组件；提交中通过按钮的 loading/disabled 状态防止重复提交。底部主操作优先使用 `bottom-action-bar` 或 `submit-bar`。
+以 `form` 作为校验与提交边界，用 `field` 承载输入或只读选择入口。需要文本录入时，统一使用【输入框】换行文本域样式：`type="textarea"` + `label-position="top"`，设置 `maxlength="200"`、`show-word-limit`，并按内容使用 `rows`、`autosize`。图片、视频、文件上传使用 `uploader` 的【文件上传】表单示例样式，置于白色表单卡片内并设置 `max-count="9"`；选择型字段连接已有选择组件。提交中通过按钮的 loading/disabled 状态防止重复提交。底部主操作优先使用 `bottom-action-bar` 或 `submit-bar`。
 
 ## 列表页
 
-组合 `pull-refresh`、`list`、`loading`、`empty` 表达首屏、刷新、分页、无数据和失败状态。筛选条件复杂时优先使用 `work-order-filter` 或 `popup` 承载已有表单组件，不将筛选逻辑分散在列表项内。
+搜索功能统一使用 `search variant="pure"` 的【搜索】纯净样式，并沿用 `v-model`、`search`、`cancel` 连接既有筛选逻辑。组合 `pull-refresh`、`list`、`loading`、`empty` 表达首屏、刷新、分页、无数据和失败状态。筛选条件复杂时优先使用 `work-order-filter`；需要动态表单时使用 `form-panel`，专用面板不适用且自定义内容较多时使用 `action-sheet` 的【动作面板】自定义面板样式，仅少量轻量内容才以 `popup` 承载，不将筛选逻辑分散在列表项内。
 
 ## 详情页
 
-字段名称与回显值优先使用 `label`，左侧标签文本尽量自带冒号；多字段成组或字段类型较多时使用 `info-card` + `label`。其余信息可用 `cell-group`、`card`、`tag` 组织，页面级动作放在 `bottom-action-bar` 或 `action-bar`。危险或不可逆操作必须经 `dialog` 确认，并在完成后用 `toast` 或 `notify` 反馈。
+白色卡片外层的一级标题使用 `blue-mark-header`，卡片内的二级标题使用默认样式的 `title-bar`。字段名称与回显值优先使用 `label`，左侧标签文本尽量自带冒号；多字段成组或字段类型较多时使用 `info-card` + `label`。其余信息可用 `cell-group`、`card`、`tag` 组织，页面级动作放在 `bottom-action-bar` 或 `action-bar`。危险或不可逆操作必须经 `dialog` 确认，并在完成后用 `toast` 或 `notify` 反馈。
 
 ## 物料流程与阅读确认
 
 选择物料、工具或备件使用 `material-add`；单项数量操作使用 `material-action-bar`，详情使用 `material-detail`，提交前或详情页回显使用 `material-display-bar`。执行前阅读与确认使用 `content-panel`，面板内以 `title-bar` 或 `blue-mark-header` 分组；除非需求另有规定，确认动作由 `confirm` 事件承接。
 
+动态面板入口优先使用 `cell` 的【单元格】右图标样式（`right-icon="arrow"` + `click`），并用 `value` 或 `note` 回显当前结果。
+
 ## 样式扩展
 
 先查目标组件的 `var.less` 与 `src/style/`。只通过公开变量或扩展点调整视觉；禁止依赖内部 DOM 层级、覆盖私有 class 或复制组件源码样式。