@microi.net/cli 6.2.1 → 6.2.3

package/skills/microi-ui/references/progressive-01-/347/247/273/345/212/250/347/253/257/345/234/272/346/231/257/350/223/235/345/233/276.md

@@ -1,183 +1,183 @@
-# microi-ui 详细参考 1
-
-> 按需读取；本文件由 SKILL.md 的原章节无损拆分。
-
-<!-- microi-progressive:chunk id=microi-ui-006 sha256=640cefe2522ed4fa107299f8cebd22f9adb123f2cfa137841483aa43dc2ab446 -->
-## 移动端场景蓝图
-
-### 登录/注册
-
-- 除非业务明确有独立登录系统，否则不要强制用户切换角色。
-- H5/App 登录通常应是一个账号或手机号 + 密码表单，不要把账号登录块和手机号登录块并列展示。
-- 微信小程序登录默认使用 `<button open-type="getPhoneNumber">` 手机号授权；需要员工登录时，账号/密码兜底可以作为折叠或次级选项存在。
-- Microi 账号登录要正确使用平台登录流程，不要调用不存在的方法。
-- Microi 账号登录成功必须同时拿到成功码、有效 token 和有效用户 `Id`。token 可能在响应头，用户信息可能在响应体 `Data`；任一缺失都要清理本地会话并展示失败，不能留下“显示用户名但仍未登录”的半登录状态。
-- 登录状态、头像姓名、角色文本、未登录提示和页面权限必须来自统一 session store。不要让单个页面直接读取旧 storage 显示用户名称。
-- 微信小程序客户登录要支持手机号授权和注册/绑定。
-- 登录页/个人中心不要向终端用户展示当前租户、OsClient、API host、移动端版本或调试元数据块。
-- 使用顶部氛围加悬浮表单面板。
-- 输入框要厚实、圆润、清晰，并成组呈现。
-- 主登录、去登录、手机号登录按钮必须图标加文字，高对比，并在合适场景下满宽。
-- 只有真实可用时才显示社交/快捷登录入口。
-
-### 首页/工作台
-
-- 首屏展示下一步操作：待处理订单、到期计划、报告、报修、审批或快捷操作。
-- 使用 `MciHeroPanel` 或 `.mci-mobile-hero`。
-- 使用带图标的悬浮快捷操作。
-- 使用指标卡展示数量和状态。
-- 使用富卡片展示近期任务或报告。
-- 首屏文字必须适配 375px 和 430px 宽度。出现难看换行前，先减小标题字号。
-- 悬浮面板不得覆盖首屏按钮。
-
-### 个人中心/我的
-
-- 使用身份头部，包含头像、姓名、角色/客户、状态和至少一个视觉徽章。
-- 未登录时不得展示旧缓存用户名；头像、姓名和状态必须同时回到未登录态。
-- 使用两个以上高亮快捷卡或服务宫格。
-- 设置项和业务入口要分组成面板。
-- 主题切换可以放在这里；如果未登录也能访问个人中心，则登录前也必须可用。
-- 设置/信息行必须使用真实图标。租户、版本、主题或账号入口不要用单字徽章当图标。
-- 公司简介、关于我们、资质介绍等内容如果不是页面主内容，在个人中心只放一个紧凑图标 + 标题 + 简短说明的导航项，点击进入详情。不要在“我的”首页直接铺大标题、摘要和预览图，避免和身份卡、主题、快捷入口抢视觉层级。
-- 除非产品明确是极简工具型，否则不要把个人中心渲染成纯列表。
-
-### 主题选项
-
-- 如果客户在已接受旧设计后要求新视觉风格，除非用户明确要求移除，否则要把旧设计保留为一个命名主题。
-- 主题名称应描述视觉意图，例如 `清新绿红`、`品牌经典`、`专业深色`。
-- 如果产品定义默认主题，主题运行时的默认值必须与之匹配；用户切换过后优先读取本地持久化主题，不能启动后强行覆盖用户选择。
-- 持久化已选主题，并应用到页面根、固定底部导航、按钮、卡片、空状态、骨架屏、加载过渡、表单、报告详情和 H5 桌面手机壳。
-- uni-app 和微信小程序不能只依赖 `document.documentElement`；小程序端要通过项目级主题服务在每个页面根绑定主题类或变量。H5 端优先把主题写到 `html/body` 的属性、class 和 CSS 变量，再让页面、`uni-page-body` 与 fixed 组件继承变量。
-- H5 uni-app 不要用 `querySelectorAll('.mci-page')`、`MutationObserver` 或延迟扫描去修改 `.mci-page`、`uni-page-body`、`uni-page`、`RouterView` 下的 class；这些节点由 Vue/uni 管理，运行中改 class 可能导致 `Cannot assign to read only property '_'`、`Cannot read properties of null (reading 'type')`、`parentNode` 或 `scheduler flush` 错误。
-- 固定底部导航、固定提交栏、悬浮操作条等 fixed 组件在 H5 中优先使用 `--mci-*` 变量，不要为了换主题让组件自己订阅 store 并动态切换根 class；小程序端可以绑定稳定主题 class，但要避免主题切换时改变路由根节点结构。
-- 个人中心/设置页上的主题切换应是紧凑操作，打开底部面板或弹窗。除非页面明确是完整设置页，否则不要把所有主题选项直接渲染在个人中心首页。
-- H5 uni-app 主题切换不能破坏路由补丁。如果切主题后导航出现 `parentNode`、`scheduler flush`、`updateSlots`、`read only property '_'` 或 `null (reading 'type')` 错误，先停止改写 Vue/uni 托管节点，保持页面 class 稳定，并改为 `html/body` 变量驱动。
-- 切换主题后，底部导航仍必须正常路由。要拦截当前路由点击、对重复点击防抖，并在必要时短暂延迟导航。
-- 每个命名主题都要对 `pages.json` 中每个路由截图。快捷卡片、报告卡片、报告详情、骨架屏、加载过渡、空状态、弹窗和底部导航中的文字必须保持高对比。
-
-### 列表
-
-- 移动端列表应使用业务卡片，而不是表格式行。
-- 每张卡片需要标题、状态胶囊、关键元数据、时间和主操作。
-- 数据类型不同的列表上方要增加筛选/搜索/标签。
-- 加载时使用骨架卡片，空数据时使用有意义的空状态。
-- 长标题和元数据要有意截断或换行，不能撑坏卡片高度。
-
-### 详情/报告
-
-- 从概览首屏/状态块开始。
-- 然后展示事实信息、时间线/步骤、媒体、富报告内容和操作区。
-- 重要状态必须无需滚动即可看到。
-- 报告应使用 `MciRichText`、可读行高、图片最大宽度，以及分享/阅读/确认操作。
-- 报告详情的封面、英文标识（如 `INSPECTION REPORT`）、状态胶囊、印章/水印、摘要卡和正文容器必须全部使用主题变量，不能把浅色文字固定在浅色背景上。
-- 如果页面预期有操作，使用 `MciActionBar` 或固定安全区提交栏。
-- 从列表到详情要保留查看者身份：员工报告卡打开员工鉴权详情数据，客户卡片打开 CustomerToken 详情数据，分享链接打开 ShareToken 详情数据。不要让已登录用户点击本来可见的卡片后被重定向到登录。
-
-### 表单/上传
-
-- 使用带小图标标记的分区标题。
-- 使用大而清爽的输入区域和足够垂直间距。
-- 重要选项使用彩色选项胶囊或选项卡片。
-- 上传区域必须支持重新选择/替换、预览、关闭预览、进度、重试和失败提示。
-- 长表单需要固定安全区提交栏。
-
-### 底部导航
-
-- 当原生 tabbar 限制视觉质量或造成运行时问题时，优先使用 `MciBottomNav`。
-- 必须包含图标、文字、激活态和稳定点击区域。
-- 创建、扫码、报修、报告等操作允许使用凸起中间按钮。
-- 不要使用纯文字导航。
-
-### 弹窗/底部面板/对话框
-
-- 使用暗色遮罩、明确的面板圆角、底部面板拖拽线和紧凑操作层级。
-- 底部面板不应在没有确认的情况下遮住不可逆操作。
-- 确认对话框应显示清晰图标/状态和一个主操作。
-
-### 图表/仪表盘
-
-- 数字优先于图表。
-- 首屏使用 2-4 个高信号指标。
-- 使用少量配色，不要把每张图都做成彩虹。
-- 密集仪表盘应选择清爽浅色分析风格或深色指挥中心风格，不要随意混搭。
-
-### 消息/社交/资讯
-
-- 消息需要头像/图标、类型、标题、摘要、时间、未读标记，以及必要操作。
-- 社交/内容流需要稳定媒体比例、作者身份、标签和互动操作。
-- 资讯/内容页需要分类标签、首屏或精选故事，以及可读卡片。
-
-### 商城/活动
-
-- 使用图片主导卡片、价格/状态锚点、促销标签和底部购买/操作区。
-- 购物车/订单页需要可见选择状态、数量控件、合计和固定结算栏。
-- 活动页需要活动首屏、进度/状态、奖励/操作面板和规则面板。
-
-<!-- /microi-progressive:chunk -->
-<!-- microi-progressive:chunk id=microi-ui-007 sha256=7160d9b28fb119dc5ee9c0a59e6a0a333defee6dab7dce52f5e56a8354e597e7 -->
-## 网站/PC 站标准
-
-- 构建真实产品/站点体验，不要做通用落地页外壳。
-- 首屏必须让品牌、产品、地点或对象足够明确。
-- 落地页首屏在合适时使用真实/生成位图或沉浸式互动场景，不要只依赖装饰渐变。
-- 首屏文字不要放在卡片里。
-- SaaS/CRM/运营站点应安静、密集、易扫读、聚焦工作。
-- 产品/场馆/作品集站点可以更视觉化，但主要对象必须可检查。
-- 写页面局部 CSS 前优先使用 `MciHeroPanel`、`MciSection`、`MciCard`、`MciMetricCard` 和 `MciButton`。
-
-<!-- /microi-progressive:chunk -->
-<!-- microi-progressive:chunk id=microi-ui-008 sha256=4f6b3174c3353ba42388b1c2cdbeea5262adfbbccbd1021667ae642c80bf7a60 -->
-## 后台菜单配套
-
-创建 Microi 低代码系统时，后台菜单不应全部是一层菜单。真实系统至少使用两级：
-
-- 客户中心：客户、联系人、绑定。
-- 资产/设备中心：设备、资产。
-- 运营中心：计划、订单、记录、报修。
-- 报告中心：报告、阅读日志。
-- 系统/配置中心：字典、设置、模板。
-
-移动端信息架构在可行时应与这些业务域匹配。
-
-<!-- /microi-progressive:chunk -->
-<!-- microi-progressive:chunk id=microi-ui-009 sha256=741009676a3161ce7aed258306b759ffb8eeca3ee681c55fd4fc5b4fcc823059 -->
-## AI 实施清单
-
-- Microi 前端、网站、H5、uni-app、小程序、客户门户、员工端、会员中心、仪表盘、报告、活动和视觉重设计任务要自动识别本 skill。
-- 设计界面前读取本 skill 和 `microi.skills/ui-design/SKILL.md`。
-- 写页面前检查 logo/品牌色，并推导色板。
-- 先选场景蓝图，再选组件，最后写 CSS。
-- 优先使用 Microi.UI 组件或项目级 `mci-*` 封装，而不是直接套第三方视觉样式。
-- 当可复用模式跨项目出现时，更新 `Microi.UI`。
-- 当 Microi.UI 行为或标准变化时，更新 `microi.doc/docs/doc/system-engine/microi-ui.md`。
-- 可行时用 `npm run check`、`npm run pack:check` 和文档构建验证。
-- 对 UI/前端工作，只要有浏览器/H5/devtools 目标，就使用截图视觉验证。
-- 对命名主题，在每个主题下截图验证所有 `pages.json` 路由，并在切换主题再导航后检查控制台日志。
-- 使用真实账号登录后截图验证“我的”页姓名、角色和状态一致；不得出现缓存用户名和“未登录”同时存在。
-- 截图必须包含底部导航和首页快捷入口，确认容器背景、选中态、未选中态、圆形图标底色和内部图标色都随主题变化且高对比。
-- 移动端页面检查 375px 和 430px 宽度。
-- 检查首屏标题换行、操作可见性、悬浮面板重叠、底部导航图标、空状态、表单提交栏和按钮居中。
-- 检查未登录/未授权提示卡片是否在 header 与 tabBar/底栏之间的可用内容区上下左右居中，不能贴在顶部。
-
-<!-- /microi-progressive:chunk -->
-<!-- microi-progressive:chunk id=microi-ui-010 sha256=fe2debba61f4ebdab4d67df7df972c5c7456a2eea4e3b4fef6a04256165e999d -->
-## 禁止输出
-
-- Microi.UI 文件或文档内不得出现外部 UI 库身份或复制来的类名前缀。
-- 不得使用纯文字底部导航。
-- 设置/个人中心/主题/信息入口不得使用单字假图标。
-- 不得使用泛化全局 CSS 选择器。
-- 不得出现重复 `OsClient` 请求头值。
-- 不得让未登录/授权提示只贴在 header 下方；它必须在剩余可用区域居中。
-- 不得调用未定义的登录接口。
-- 不得把缺 token 或缺用户 `Id` 的返回当作登录成功，也不得留下半登录缓存。
-- 除非明确要求，一个登录页不得同时展示重复登录系统。
-- 不得向用户展示当前租户、API host 或移动端版本调试块。
-- 不得做只影响单页、导航或重启后消失的主题切换。
-- 当“切换按钮 + 面板/弹窗”更清爽时，不得在个人中心页内联堆出所有主题选项。
-- 不得在个人中心把公司简介/关于我们做成大资讯卡，除非该页面明确是资讯流或品牌介绍页。
-- 主题切换不得在底部导航后造成 uni-app 路由/scheduler 错误。
-- 报告/列表详情路由不得丢失员工/客户/分享鉴权上下文，并把可见项目重定向到登录。
-- 业务系统后台菜单不得全部规划为一级菜单。
-- 面向客户/员工的产品页面不得只有普通列表、普通按钮且没有视觉锚点。
-<!-- /microi-progressive:chunk -->
+# microi-ui 详细参考 1
+
+> 按需读取；本文件由 SKILL.md 的原章节无损拆分。
+
+<!-- microi-progressive:chunk id=microi-ui-006 sha256=40ae240fde9553bb813fcce576d090ade894cb920da1b3f4f45975f819a10d50 -->
+## 移动端场景蓝图
+
+### 登录/注册
+
+- 除非业务明确有独立登录系统，否则不要强制用户切换角色。
+- H5/App 登录通常应是一个账号或手机号 + 密码表单，不要把账号登录块和手机号登录块并列展示。
+- 微信小程序登录默认使用 `<button open-type="getPhoneNumber">` 手机号授权；需要员工登录时，账号/密码兜底可以作为折叠或次级选项存在。
+- Microi 账号登录要正确使用平台登录流程，不要调用不存在的方法。
+- Microi 账号登录成功必须同时拿到成功码、有效 token 和有效用户 `Id`。token 可能在响应头，用户信息可能在响应体 `Data`；任一缺失都要清理本地会话并展示失败，不能留下“显示用户名但仍未登录”的半登录状态。
+- 登录状态、头像姓名、角色文本、未登录提示和页面权限必须来自统一 session store。不要让单个页面直接读取旧 storage 显示用户名称。
+- 微信小程序客户登录要支持手机号授权和注册/绑定。
+- 登录页/个人中心不要向终端用户展示当前租户、OsClient、API host、移动端版本或调试元数据块。
+- 使用顶部氛围加悬浮表单面板。
+- 输入框要清晰、紧凑并成组呈现；触控命中至少 44px，但不要求厚重边框、大圆角或额外空白。
+- 主登录、去登录、手机号登录按钮必须图标加文字，高对比，并在合适场景下满宽。
+- 只有真实可用时才显示社交/快捷登录入口。
+
+### 首页/工作台
+
+- 首屏展示下一步操作：待处理订单、到期计划、报告、报修、审批或快捷操作。
+- 使用 `MciHeroPanel` 或 `.mci-mobile-hero`。
+- 使用带图标的悬浮快捷操作。
+- 使用指标卡展示数量和状态。
+- 使用富卡片展示近期任务或报告。
+- 首屏文字必须适配 375px 和 430px 宽度。出现难看换行前，先减小标题字号。
+- 悬浮面板不得覆盖首屏按钮。
+
+### 个人中心/我的
+
+- 使用身份头部，包含头像、姓名、角色/客户、状态和至少一个视觉徽章。
+- 未登录时不得展示旧缓存用户名；头像、姓名和状态必须同时回到未登录态。
+- 使用两个以上高亮快捷卡或服务宫格。
+- 设置项和业务入口要分组成面板。
+- 主题切换可以放在这里；如果未登录也能访问个人中心，则登录前也必须可用。
+- 设置/信息行必须使用真实图标。租户、版本、主题或账号入口不要用单字徽章当图标。
+- 公司简介、关于我们、资质介绍等内容如果不是页面主内容，在个人中心只放一个紧凑图标 + 标题 + 简短说明的导航项，点击进入详情。不要在“我的”首页直接铺大标题、摘要和预览图，避免和身份卡、主题、快捷入口抢视觉层级。
+- 除非产品明确是极简工具型，否则不要把个人中心渲染成纯列表。
+
+### 主题选项
+
+- 如果客户在已接受旧设计后要求新视觉风格，除非用户明确要求移除，否则要把旧设计保留为一个命名主题。
+- 主题名称应描述视觉意图，例如 `清新绿红`、`品牌经典`、`专业深色`。
+- 如果产品定义默认主题，主题运行时的默认值必须与之匹配；用户切换过后优先读取本地持久化主题，不能启动后强行覆盖用户选择。
+- 持久化已选主题，并应用到页面根、固定底部导航、按钮、卡片、空状态、骨架屏、加载过渡、表单、报告详情和 H5 桌面手机壳。
+- uni-app 和微信小程序不能只依赖 `document.documentElement`；小程序端要通过项目级主题服务在每个页面根绑定主题类或变量。H5 端优先把主题写到 `html/body` 的属性、class 和 CSS 变量，再让页面、`uni-page-body` 与 fixed 组件继承变量。
+- H5 uni-app 不要用 `querySelectorAll('.mci-page')`、`MutationObserver` 或延迟扫描去修改 `.mci-page`、`uni-page-body`、`uni-page`、`RouterView` 下的 class；这些节点由 Vue/uni 管理，运行中改 class 可能导致 `Cannot assign to read only property '_'`、`Cannot read properties of null (reading 'type')`、`parentNode` 或 `scheduler flush` 错误。
+- 固定底部导航、固定提交栏、悬浮操作条等 fixed 组件在 H5 中优先使用 `--mci-*` 变量，不要为了换主题让组件自己订阅 store 并动态切换根 class；小程序端可以绑定稳定主题 class，但要避免主题切换时改变路由根节点结构。
+- 个人中心/设置页上的主题切换应是紧凑操作，打开底部面板或弹窗。除非页面明确是完整设置页，否则不要把所有主题选项直接渲染在个人中心首页。
+- H5 uni-app 主题切换不能破坏路由补丁。如果切主题后导航出现 `parentNode`、`scheduler flush`、`updateSlots`、`read only property '_'` 或 `null (reading 'type')` 错误，先停止改写 Vue/uni 托管节点，保持页面 class 稳定，并改为 `html/body` 变量驱动。
+- 切换主题后，底部导航仍必须正常路由。要拦截当前路由点击、对重复点击防抖，并在必要时短暂延迟导航。
+- 每个命名主题都要对 `pages.json` 中每个路由截图。快捷卡片、报告卡片、报告详情、骨架屏、加载过渡、空状态、弹窗和底部导航中的文字必须保持高对比。
+
+### 列表
+
+- 移动端列表应使用业务卡片，而不是表格式行。
+- 每张卡片需要标题、状态胶囊、关键元数据、时间和主操作。
+- 数据类型不同的列表上方要增加筛选/搜索/标签。
+- 加载时使用骨架卡片，空数据时使用有意义的空状态。
+- 长标题和元数据要有意截断或换行，不能撑坏卡片高度。
+
+### 详情/报告
+
+- 从概览首屏/状态块开始。
+- 然后展示事实信息、时间线/步骤、媒体、富报告内容和操作区。
+- 重要状态必须无需滚动即可看到。
+- 报告应使用 `MciRichText`、可读行高、图片最大宽度，以及分享/阅读/确认操作。
+- 报告详情的封面、英文标识（如 `INSPECTION REPORT`）、状态胶囊、印章/水印、摘要卡和正文容器必须全部使用主题变量，不能把浅色文字固定在浅色背景上。
+- 如果页面预期有操作，使用 `MciActionBar` 或固定安全区提交栏。
+- 从列表到详情要保留查看者身份：员工报告卡打开员工鉴权详情数据，客户卡片打开 CustomerToken 详情数据，分享链接打开 ShareToken 详情数据。不要让已登录用户点击本来可见的卡片后被重定向到登录。
+
+### 表单/上传
+
+- 使用带小图标标记的分区标题。
+- 输入区按内容和触控需求确定尺寸，字段间距通常 8–12px；不以“大而宽松”作为视觉目标。
+- 重要选项使用彩色选项胶囊或选项卡片。
+- 上传区域必须支持重新选择/替换、预览、关闭预览、进度、重试和失败提示。
+- 长表单需要固定安全区提交栏。
+
+### 底部导航
+
+- 当原生 tabbar 限制视觉质量或造成运行时问题时，优先使用 `MciBottomNav`。
+- 必须包含图标、文字、激活态和稳定点击区域。
+- 创建、扫码、报修、报告等操作允许使用凸起中间按钮。
+- 不要使用纯文字导航。
+
+### 弹窗/底部面板/对话框
+
+- 使用暗色遮罩、明确的面板圆角、底部面板拖拽线和紧凑操作层级。
+- 底部面板不应在没有确认的情况下遮住不可逆操作。
+- 确认对话框应显示清晰图标/状态和一个主操作。
+
+### 图表/仪表盘
+
+- 数字优先于图表。
+- 首屏使用 2-4 个高信号指标。
+- 使用少量配色，不要把每张图都做成彩虹。
+- 密集仪表盘应选择清爽浅色分析风格或深色指挥中心风格，不要随意混搭。
+
+### 消息/社交/资讯
+
+- 消息需要头像/图标、类型、标题、摘要、时间、未读标记，以及必要操作。
+- 社交/内容流需要稳定媒体比例、作者身份、标签和互动操作。
+- 资讯/内容页需要分类标签、首屏或精选故事，以及可读卡片。
+
+### 商城/活动
+
+- 使用图片主导卡片、价格/状态锚点、促销标签和底部购买/操作区。
+- 购物车/订单页需要可见选择状态、数量控件、合计和固定结算栏。
+- 活动页需要活动首屏、进度/状态、奖励/操作面板和规则面板。
+
+<!-- /microi-progressive:chunk -->
+<!-- microi-progressive:chunk id=microi-ui-007 sha256=cd73bb934f8531154f73f5ed197c7379c5d9c4f37c60d8275272df4a05bcbe81 -->
+## 网站/PC 站标准
+
+- 构建真实产品/站点体验，不要做通用落地页外壳。
+- 首屏必须让品牌、产品、地点或对象足够明确。
+- 落地页首屏在合适时使用真实/生成位图或沉浸式互动场景，不要只依赖装饰渐变。
+- 品牌展示的首屏文字通常直接组织在页面栅格中；数据工作台标题、指标和筛选按任务组合，不把此展示建议变成禁止后台分组。
+- SaaS/CRM/运营站点应安静、密集、易扫读、聚焦工作。
+- 产品/场馆/作品集站点可以更视觉化，但主要对象必须可检查。
+- 写页面局部 CSS 前按任务选择现有组件；官网/展示可用 `MciHeroPanel`，后台优先紧凑标题、筛选与数据区。后台满宽、字体、间距与容器断点统一读取 `../ui-design/references/data-workspace-density.md`，不要把品牌页最大宽度或移动端触控尺寸直接套入鼠标工作台。
+
+<!-- /microi-progressive:chunk -->
+<!-- microi-progressive:chunk id=microi-ui-008 sha256=77e0a70e1131fe90354eba315727bbd2f49c5929a98c767cb3dfef71f0c55234 -->
+## 后台菜单配套
+
+创建 Microi 低代码系统时，后台菜单不应全部是一层菜单。真实系统至少使用两级：
+
+- 客户中心：客户、联系人、绑定。
+- 资产/设备中心：设备、资产。
+- 运营中心：计划、订单、记录、报修。
+- 报告中心：报告、阅读日志。
+- 系统/配置中心：字典、设置、模板。
+
+移动端信息架构在可行时应与这些业务域匹配。
+
+<!-- /microi-progressive:chunk -->
+<!-- microi-progressive:chunk id=microi-ui-009 sha256=2fe8adfc7c7d422a94ad667934c71113bbfced5df199a2a7ff0c14ceddb32373 -->
+## AI 实施清单
+
+- Microi 前端、网站、H5、uni-app、小程序、客户门户、员工端、会员中心、仪表盘、报告、活动和视觉重设计任务要自动识别本 skill。
+- 设计界面前读取本 skill 和 `microi.skills/ui-design/SKILL.md`。
+- 写页面前检查 logo/品牌色，并推导色板。
+- 先选场景蓝图，再选组件，最后写 CSS。
+- 优先使用 Microi.UI 组件或项目级 `mci-*` 封装，而不是直接套第三方视觉样式。
+- 当可复用模式跨项目出现时，更新 `Microi.UI`。
+- 当 Microi.UI 行为或标准变化时，更新 `microi.doc/docs/doc/system-engine/microi-ui.md`。
+- 可行时用 `npm run check`、`npm run pack:check` 和文档构建验证。
+- 对 UI/前端工作，只要有浏览器/H5/devtools 目标，就使用截图视觉验证。
+- 对命名主题，在每个主题下截图验证所有 `pages.json` 路由，并在切换主题再导航后检查控制台日志。
+- 使用真实账号登录后截图验证“我的”页姓名、角色和状态一致；不得出现缓存用户名和“未登录”同时存在。
+- 截图必须包含底部导航和首页快捷入口，确认容器背景、选中态、未选中态、圆形图标底色和内部图标色都随主题变化且高对比。
+- 移动端页面检查 375px 和 430px 宽度。
+- 检查首屏标题换行、操作可见性、悬浮面板重叠、底部导航图标、空状态、表单提交栏和按钮居中。
+- 检查未登录/未授权提示卡片是否在 header 与 tabBar/底栏之间的可用内容区上下左右居中，不能贴在顶部。
+
+<!-- /microi-progressive:chunk -->
+<!-- microi-progressive:chunk id=microi-ui-010 sha256=4cba6feaad134c973d51943e622199c944d12b67a860894a5415cfcd7eeb831f -->
+## 禁止输出
+
+- Microi.UI 文件或文档内不得出现外部 UI 库身份或复制来的类名前缀。
+- 不得使用纯文字底部导航。
+- 设置/个人中心/主题/信息入口不得使用单字假图标。
+- 不得使用泛化全局 CSS 选择器。
+- 不得出现重复 `OsClient` 请求头值。
+- 不得让未登录/授权提示只贴在 header 下方；它必须在剩余可用区域居中。
+- 不得调用未定义的登录接口。
+- 不得把缺 token 或缺用户 `Id` 的返回当作登录成功，也不得留下半登录缓存。
+- 除非明确要求，一个登录页不得同时展示重复登录系统。
+- 不得向用户展示当前租户、API host 或移动端版本调试块。
+- 不得做只影响单页、导航或重启后消失的主题切换。
+- 当“切换按钮 + 面板/弹窗”更清爽时，不得在个人中心页内联堆出所有主题选项。
+- 不得在个人中心把公司简介/关于我们做成大资讯卡，除非该页面明确是资讯流或品牌介绍页。
+- 主题切换不得在底部导航后造成 uni-app 路由/scheduler 错误。
+- 报告/列表详情路由不得丢失员工/客户/分享鉴权上下文，并把可见项目重定向到登录。
+- 业务系统后台菜单不得全部规划为一级菜单。
+- 面向客户/员工的产品页面不得只有普通列表、普通按钮且没有视觉锚点。
+<!-- /microi-progressive:chunk -->

package/skills/microi-uniapp-frontend/SKILL.md

@@ -38,7 +38,7 @@ UniApp/H5/小程序必须通过项目统一 `microi.v8.js` 的 `V8.uploadFile` /
 创建、重构或修复任何 Microi 移动端项目前，必须同时应用 `microi.skills/microi-mobile-app-quality/SKILL.md`，并读取其[首版交付与外部服务验收](../microi-mobile-app-quality/references/mobile-first-delivery.md)。手机号快捷登录、会话续签、导航几何、真实地图、页面动效和公开发布回读从首版纳入需求与测试，不能先交静态占位版，再等待用户逐页指出问题。涉及后台与第三方服务时按实际业务范围执行，既有授权和租户策略优先。
 
 <!-- /microi-progressive:chunk -->
-<!-- microi-progressive:chunk id=microi-uniapp-frontend-001 sha256=8b6124cf7267beae98f0321780bc1aece9494c669e0337a96a61f50f5cbf62e6 -->
+<!-- microi-progressive:chunk id=microi-uniapp-frontend-001 sha256=de245aa65643e8bbb5d9cfd5256066295b4857bfa2fc8ef2689161eee9b2bc25 -->
 ## 标准产品、视图协议与租户扩展
 
 地图提供行政区与附近距离两类筛选时，应复用省市区字典，并允许省、市、区逐级选“全部”；省级“全部”须显式启用，不能改变普通地址录入的默认值。行政区域查询不依赖手机定位、不叠加附近半径，空地区仍可保留既有附近模式。范围筛选必须在原有菜单/租户/行权限内执行，分批读取并丢弃迟到响应；来源列表存在同表不同菜单时，地图入口与查询应保留准确的来源菜单和固定业务条件。验收覆盖全国、全省、全市、区县、直辖市、定位拒绝、旧接口兼容和快速切换。
@@ -49,6 +49,8 @@ UniApp/H5/小程序必须通过项目统一 `microi.v8.js` 的 `V8.uploadFile` /
 
 Microi 标准小程序必须采用“平台内核 + 版本化元数据 + Profile + 租户插件”架构，不能把某个交付项目直接写死成平台产品：
 
+JSON 历史字段的只读展示使用 `Config.ReadonlyView.Type=Timeline`，通过 `TitleField/TimeField/Fields[{Name,Label}]/ToneMap/EmptyText` 声明；复用 `mci-record-timeline` 与 `record-timeline.mjs`。只展示映射的标量字段，不泄露内部 ID，不执行 HTML 或 V8；模块详情整行布局，最近三条和逐批展开，空值及损坏数据均有可读提示。通用组件不得按客户表名或字段名硬编码。更新后验证旧记录、排序、长说明及两套小程序构建。
+
 - `src/platform/`、通用 `mci-*` 组件、动态模块页和动态表单页只实现平台能力，不得出现租户表名、字段名、品牌文案、素材或客户路由。
 - `src/tenants/<tenant>/` 存放客户专属业务组合、首页统计、表单联动、子表规则、扫码/定位/相机和复杂原生流程；`profiles/<id>/` 管理 OsClient、API、品牌、功能开关、路由和真实编译范围。
 - `src/generated/`、`pages.json`、`manifest.json` 等 Profile 产物由脚本生成，不能作为人工定制入口。多人合并冲突时以 Profile 与租户源码为准重新生成。

package/skills/microi.v8.js

@@ -569,7 +569,7 @@ function installDatePrototypeCompat() {
   }
 }
 
-// BEGIN GENERATED PUBLIC RESOURCE ROUTER; source SHA256 d90207991f19b46429dc21a654e2915e1b4fd6e96f191cede20485d823f3a975
+// BEGIN GENERATED PUBLIC RESOURCE ROUTER; source SHA256 94e9f239a70d003f6513a205d02e5d3dcaf3e80268bb3735523047949518ce9a
 const createSdkPublicResourceClient = (() => {
 // 公有资源路由的纯校验器与实际消费者桥接；私有分支继续走既有授权接口。
 const HASH = /^[a-f0-9]{64}$/;
@@ -583,10 +583,10 @@ function key(value) {
   return value;
 }
 const encodeKey = value => value.split('/').map(encodeURIComponent).join('/');
-function plainBase(value, originOnly = false) {
+function plainBase(value, originOnly = false, legacyPrimary = false) {
   if (typeof value !== 'string' || /[\\%?#@\u0000-\u0020\u007f]/.test(value)) throw Error('InvalidPublicBinding');
   const parsed = new URL(value);
-  if (parsed.protocol !== 'https:' || parsed.username || parsed.password || parsed.search || parsed.hash
+  if ((parsed.protocol !== 'https:' && !(legacyPrimary && parsed.protocol === 'http:')) || parsed.username || parsed.password || parsed.search || parsed.hash
       || (originOnly && parsed.pathname !== '/')) throw Error('InvalidPublicBinding');
   return value.replace(/\/+$/, '');
 }
@@ -617,7 +617,9 @@ function legacyPublicFallback(input, binding) {
     const rawKey = decoratedAt < 0 ? relative : relative.slice(0, decoratedAt);
     const suffix = decoratedAt < 0 ? '' : relative.slice(decoratedAt);
     const objectKey = key(rawKey.split('/').map(part => decodeURIComponent(part)).join('/'));
-    return plainBase(binding?.primaryBase) + '/' + encodeKey(objectKey) + suffix;
+    // Preserve the tenant's existing HTTP FileServer only for the original
+    // public fallback. Verified backup/alias bindings remain HTTPS-only.
+    return plainBase(binding?.primaryBase, false, true) + '/' + encodeKey(objectKey) + suffix;
   } catch { return ''; }
 }
 function identify(input, binding) {

package/skills/module-engine/SKILL.md

@@ -44,6 +44,10 @@ PC 卡片优先选择当前终端 Card 视图，没有时复用 Mobile Card；
 与展开图标，不能只剩三点；卡片高度由内容与密度决定，不用大段留白代替缺失字段。
 普通与树形列表的显式查询列均须补齐视图依赖字段，未配置/星号全列查询不能被窄化；
 空白与空多选在展示态隐藏，`0/false` 保留，行内编辑空字段继续可录入。
+复合列 `TrailingFields` 同样隐藏无值、空字符串及仅空白的标签；不能渲染空 tag，`0/false`
+是有效值。普通列单元格使用 `diy_field.TableAlign=auto/left/center/right`；空/auto 自动按
+控件语义对齐，显式复合列 `Layout.List.Columns[].Align` 独立优先。字段说明模式归属
+`diy_table.FieldDescriptionMode`，不新增同义模块属性，详见 `../microi-form-engine/SKILL.md`。
 验收覆盖小/标准/大密度、长文本、多个行外按钮、明暗主题与桌面/移动布局。
 
 ## 必读参考
@@ -83,7 +87,7 @@ PC 卡片优先选择当前终端 Card 视图，没有时复用 Mobile Card；
   `TableChild`、28 个以上字段且含大型子表，或 7 个以上子表/富文本/代码编辑/上传/地图等
   重型控件。达到阈值仍应先用 `diy_table.Tabs` 与 CollapseGroup 整理信息架构。
 - 用户显式指定 `Dialog/Drawer/Page` 或宽度时以用户配置为准。Drawer 是贴边直角容器；
-  Dialog 使用平台统一大圆角、可拖动、居中弹层，遮罩服从正向开关 `sys_config.FormMaskBlur`，缺失或 `0/false` 默认关闭毛玻璃。
+  Dialog 使用当前宿主统一壳、可拖动、居中弹层，圆角遵循 ui-design 的紧凑适度默认，遮罩服从正向开关 `sys_config.FormMaskBlur`，缺失或 `0/false` 默认关闭毛玻璃。
 7. 为管理员/目标角色分配菜单权限，并以真实登录用户验收。
 
 ## AI 开发菜单先行与占位切换（强制）
@@ -136,6 +140,11 @@ HTTP 成功或菜单字段非空不足以证明统计有效。
 
 ## AI 模块视觉交付门禁（强制）
 
+涉及编号、长串编码或来源/去向时，读取
+[业务编号与追溯契约](../microi-form-engine/references/business-numbering.md)。
+默认采用业务名称配业务编号，正常 Code 不按字段名隐藏；外部/历史编码保持来源映射，
+真实追溯核对目标菜单、记录和权限，不能只给文字加蓝色。显式布局与隐藏配置先回读再合并。
+
 对每个 `Display=1` 或 `AppDisplay=1` 且绑定业务表的 Diy 模块，AI 不能只依赖 CRUD
 默认页，也不能只写 `Name/DiyTableId` 后结束。至少完成以下设计和回读：
 
@@ -298,6 +307,9 @@ PageTabs 通过 `TargetSysMenuId` 切换不同模块/表时，入口模块必须
 - PC 和移动端分别验证；MicroService 还要验证运行时、页面路由和宿主上下文。
 ### 多级表头与顶部 Banner
 
+- UniApp 通用模块行按钮使用 `MoreBtns[].ActionSchema` 进入列表“更多”；详情合并 `FormBtns`、`MoreBtns` 与视图 `Layout.Actions`，按 `Key` 去重，常用动作与编辑并排放到底部固定栏，其余进入“更多”。仅 PC `V8CodeShow` 不构成移动端显隐条件，必须另给 `VisibleWhen`；接口继续鉴权。该渲染行为需重新编译 UniApp 客户端，不能把菜单保存当作客户端已更新。
+- `Layout.Hero` 辅助文字使用 `MetaField`，不使用未支持的 `SubtitleField`；图片、背景、设备/客户字段由模块元数据提供，禁止写死到通用页面。无业务图标的统计卡只居中展示条数，不显示平台占位图标。
+
 - 字段权限使用模块 `FieldPermissions`（Manifest `fieldPermissions`），Version=1；按 Everyone/Roles/Users/Departments/Jobs 与 Fields 配置 Visible/Editable，授权对象数组保存 Id。多个匹配组限制取交集，隐藏同时不可编辑；普通用户按最终能力执行，超级管理员按原管理边界。岗位来自 `diy_job`（显示 `JobName`），匹配权威 `sys_user.Jobs` 中的岗位 Id；岗位与角色 `RoleIds` 分开，不得相互替代。
 - 不能只做前端隐藏：FormEngine 查询、隐藏字段条件/排序/统计、导出、写入和导入均须校验。生成代码使用服务端 `DataAppend.FieldAccess`；未传菜单的客户端不能绕过该表已启用的模块限制。验收应覆盖普通账号、直接请求、角色/人员/部门/岗位匹配与只读写入失败。
 - 树模块拖动排序配置 `TreeDragSortEnabled`、`TreeDragSortField`（Manifest 同名小驼峰），排序字段必须为已注册数值字段。业务由 Managed、非匿名接口引擎 `mci-tree-drag-sort` 执行，可信原子仅负责固定引擎的模块解析、权限和白名单写入。

package/skills/scripts/sync-embedded-skills.mjs

@@ -38,6 +38,19 @@ for (const name of names) {
       text += `\n\n${fs.readFileSync(source, 'utf8')}`;
     }
   }
+  // 常规责任 Skill 也会把必读决策和源码索引放到 references；平台 AI 无法访问工作区路径，
+  // 必须把显式链接的同目录参考一并嵌入，不能只同步一张指向不可读文件的入口。
+  const included = new Set(references.map(reference => reference.path));
+  const entry = fs.readFileSync(path.join(skillsRoot, name, 'SKILL.md'), 'utf8');
+  const localReferences = [...new Set([...entry.matchAll(/(?:\(|`)(references\/[^\s)`#]+\.md)(?:#[^\s)`]*)?(?:\)|`)/g)].map(match => match[1]))].sort();
+  for (const reference of localReferences) {
+    if (included.has(reference)) continue;
+    const source = path.resolve(skillsRoot, name, reference);
+    const relative = path.relative(path.join(skillsRoot, name), source);
+    if (relative.startsWith('..') || path.isAbsolute(relative)) throw new Error('参考文件越过 Skill 目录。');
+    text += `\n\n${fs.readFileSync(source, 'utf8')}`;
+    included.add(reference);
+  }
   text = `${stripMarkers(text).replace(/\r\n/g, '\n').trimEnd()}\n`;
   const target = path.join(serverRoot, 'Resource', file);
   const before = fs.existsSync(target) ? fs.readFileSync(target, 'utf8') : '';