@zeyue0329/xiaoma-cli 1.21.0 → 1.22.0

package/src/zqyl-skills/backend/components/xiaoma-zqyl-title-backend/SKILL.md

@@ -0,0 +1,145 @@
+---
+name: xiaoma-zqyl-title-backend
+description: 后台页面标题、返回、副标题、右侧操作区与标题下 Tabs 的 Vue2 + zqyl-component-base 实现规范（ylTitle）。在用户提及 ylTitle、页面标题、二级标题、带标签页的标题、返回按钮、sticky 标题，或需要在后台实现该组件时使用。适用于后台管理端仓库（如 zqyl-manager，platformType `yxManager`；页头/表格用 ylTitle + ylTableSimple）。 Use when implementing or reviewing the title (ylTitle) component on a ZQYL backend page.
+---
+
+# 标题（后台）
+
+你是一个前端组件实现与改造助手。你必须严格按本技能的规则输出。
+
+## 适用范围
+- 平台：后台
+- platformType：`yxManager`
+- 组件条目：`title`
+
+## 目标
+- 当用户提到该组件/场景时，给出可落地的 Vue2 + Element UI + zqyl-component-base 代码片段与参数建议。
+- 不改变业务行为，仅替换/补齐结构与交互规范。
+
+## 组件注册（必读）
+
+- `zqyl-component-base` 公共组件在**项目入口**按组件名逐个 `import 'zqyl-component-base/lib/<ComponentName>'` + `Vue.component` 注册；样式在入口引入 `component.css`。
+- **禁止** `import zqylComponentBase from 'zqyl-component-base'` + `Vue.use(zqylComponentBase)`；页面模板直接使用 `<yl-*>`，**勿**单页重复 import。
+- 生成前先检查入口是否已注册本页用到的组件；缺失则仅在入口补注册。
+
+## 输出要求
+- 回答用户时：根据用户输入与页面场景，只输出**一段**最符合需求的 Vue 代码（可直接粘贴），并简要说明关键 props/注意事项。
+- 不要在一次回答中罗列多种候选实现；不要输出“变体 A/B/C/D”或“方案一/方案二”等对比式内容。
+- 本技能文档「示例」章节含多种参考写法，仅供你内部分析选型；**不得**把多个示例原样全部贴给用户。
+- 示例代码必须可直接粘贴使用（Vue2 单文件组件片段）。
+
+## 数据与接口（禁止 mock）
+
+- **禁止**在生成业务页面中填充 mock、演示、假数据或静态业务行（如手写 `loadData: [{ companyName: 'xxx' }]`、`reqData` 示例值、`mounted` 里写死 `total` 等）。
+- 列表/表格：`tableData.loadData` 保持 `[]`，数据由 `ylTableSimple` / `ylMpsTable` 通过 `searchParmas.request` / `queryListUrl` **调接口**获取；`request.url` / `queryListUrl` 写项目已有 `INTERFACE.xxx`，未知时留 `''` 并注释 `// TODO: 补充接口常量`。
+- 查询区：`searchParmas.request` 配置 `url`、`type`、`method`、`options`；有 `url` 时 `:load="true"`（或省略，默认加载），由组件触发查询。
+- 表单详情：`reqData` / 表单 model 初始 `{}` 或字段空值；在 `created` / `mounted` 调详情接口赋值；**禁止**预填示例姓名、金额等。
+- 下拉/枚举：`select` 的 `data` 从字典或接口加载，无数据时 `data: []`；**禁止**写死 `{ name: '待审核', code: '1' }` 类占位项（除非需求明确给定静态枚举）。
+- 统计区 `ylDataCensus`：`:list` 由接口或 `computed` 赋值，**禁止**手写示例金额/数量。
+- 动态行表格：`detailRows` 等初始 `[]`，由接口回显或用户操作增删。
+- 本 skill「示例」章节的静态数据**仅供理解组件 API**；生成业务页面时**不得**照搬进 `data()`。
+
+## 何时使用（智能体选择规则）
+
+当需求/页面出现以下任一信号时，必须优先调用本 skills 并按规则产出代码：
+- 需求中出现：页面标题、二级标题、返回、右侧操作按钮、标题下 Tabs/标签页、置顶/sticky。
+- 标题区域需要承载跨模块的全局操作（新增/导出/创建等）。
+- 用户提到“ylTitle”、“规范标题”、“带标签页的标题”时。
+- Tabs 需要展示数量（如“待办（3）”）或红点提醒（需要确认/推进流程）。
+
+不适用：纯内容区的小标题/段落标题（应使用普通文本/分组标题，而非 `ylTitle`）。
+- **中台页面**（列表/详情/表单/反馈等）默认页头为 **`ylManagerTitle`**；**勿默认使用本组件**。仅当用户**明确要求** `ylTitle` 时，中台页头才改用本组件。
+
+### 方案选择（内部分析用，勿在回答中罗列）
+- 入口页/不允许返回：参考「基础用法」，`disabledBack: true`。
+- 详情/子页需返回：参考「带返回 + 右侧操作区」，不设 `disabledBack` 或设为 `false`。
+- 标题左侧文本按钮（导出/说明等）：使用 `btnText` + `@titleBtnEvent`。
+- 标题下维度切换/数量/红点：参考「标题下方带标签页」，与 `ylTitle` 组合使用。
+
+## API（ylTitle）
+
+> 标签：`<yl-title>` / `ylTitle`；须在入口 `import ylTitle from 'zqyl-component-base/lib/ylTitle'` + `Vue.component('ylTitle', ylTitle)` 注册；页面模板直接使用，**勿**单页 import；**禁止**全量 `Vue.use(zqylComponentBase)`。
+
+### Props
+- `subTitle: string` 副标题内容
+- `btnText: string` 操作按钮文字（显示在标题左侧）
+- `redirect: string` 返回跳转路由（不传则 `go(-1)`）
+- `disabledBack: boolean` 是否禁用返回按钮（默认 `false`）
+- `custReturn: Function|null` 自定义返回事件（只触发，不执行跳转）
+- `platformType: String` 平台类型（默认 `yx`；后台 `yxManager`；中台 `mps`；另有 `yz`）
+
+### 事件
+- `titleBtnEvent` 点击 `btnText` 对应按钮时触发
+
+### 插槽
+- `default` 右侧自定义内容
+- `left` 左侧自定义内容
+
+### 方法
+- `back()` 返回按钮事件
+- `btnClick()` 操作按钮事件（内部触发 `titleBtnEvent`）
+
+## 示例（参考写法，回答用户时只选用其中一种）
+
+### 基础用法
+```vue
+<ylTitle
+  platformType="yxManager"
+  title="页面标题"
+  subTitle="副标题（可选）"
+  :disabledBack="true"
+/>
+```
+
+### 带返回 + 右侧操作区
+```vue
+<ylTitle
+  platformType="yxManager"
+  title="二级标题"
+  subTitle="支持返回按钮"
+>
+  <el-button size="small" type="primary">主操作</el-button>
+</ylTitle>
+```
+
+### 标题下方带标签页（含数量/红点）
+```vue
+<template>
+  <div>
+    <ylTitle
+      platformType="yxManager"
+      title="页面标题"
+      :disabledBack="true"
+    />
+    <el-card class="yl-title_tabs">
+      <el-tabs v-model="activeName">
+        <el-tab-pane :label="pending > 0 ? `待办任务（${pending}）` : '待办任务'" name="todo" />
+        <el-tab-pane :label="pended > 0 ? `已办任务（${pended}）` : '已办任务'" name="finished" />
+        <el-tab-pane label="需要确认" name="needConfirm" />
+      </el-tabs>
+    </el-card>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      activeName: 'todo',
+      pending: 3,
+      pended: 12,
+    }
+  }
+}
+</script>
+```
+
+- `yl-title_tabs`：建议使用项目公共样式（避免每个页面重复定义）。
+- 标签文案：数量需在文字后用括号展示（例：`待办任务（3）`），便于用户预判是否有内容。
+- 红点：用于“需要确认/推进流程”等强提醒场景，避免在所有标签上滥用。
+
+## 注意事项
+- 返回行为：默认 `go(-1)`；也可通过 `redirect` 指定路由，或 `custReturn` 自定义返回逻辑。
+- `btnText` 会在标题左侧追加一个文本按钮，触发事件：`titleBtnEvent`。
+- **中台页面**页头默认 **`ylManagerTitle`**；**中台列表**主表格默认 **`ylMpsTable`**；未明确要求时**勿用** `ylTitle` / `ylTableSimple` 作页头或主列表。
+- **例外**：用户**明确要求**使用 `ylTitle` 或 `ylTableSimple` 时，可按指定组件替换对应区块。

package/src/zqyl-skills/backend/xiaoma-zqyl-feedback-page-backend/SKILL.md

@@ -0,0 +1,30 @@
+---
+name: xiaoma-zqyl-feedback-page-backend
+description: 后台反馈页页面规范及骨架（反馈页（结果页 / 数据异常页 / 弹窗无数据；无公共反馈组件）；配套组件：ylTitle、ylDialog、ylTableSimple、ylEmptyPage、ylButton、ylTips）。在用户新建或改造后台反馈页、或根据需求/原型生成该类型页面时使用；组件细节读取同模块的 xiaoma-zqyl-<组件>-backend skill（完整组件清单见 xiaoma-zqyl-ui-spec 的 components-index.md）。适用于后台管理端仓库（如 zqyl-manager，platformType `yxManager`；页头/表格用 ylTitle + ylTableSimple）。 Use when building or reviewing a ZQYL backend feedback/result page.
+---
+
+# 反馈页（后台）
+
+本整包提供**后台反馈页**的页面骨架与拼装规范。组件 Props / 列配置 / 查询项等细节从已安装的独立组件 skill 读取（同模块已一并安装）。使用时先读 **xiaoma-zqyl-ui-spec**，再按下方知识库层次展开。
+
+`zqyl-component-base` 须在**项目入口文件**按**组件名逐个** `import` 并以 `Vue.component` 注册；样式在入口 `import 'zqyl-component-base/lib/theme-chalk/component.css'`。**禁止** `import zqylComponentBase from 'zqyl-component-base'` + `Vue.use(zqylComponentBase)` 全量注册。页面内直接使用 `<yl-*>`，勿单页重复 import。
+
+## 知识库层次
+
+| 层级 | skill / 路径 | 用途 |
+| --- | --- | --- |
+| 页面模板 | [pages/feedbackPage.md](./pages/feedbackPage.md) | 反馈页 页面骨架与拼装顺序 |
+| 配套组件 | `xiaoma-zqyl-title-backend` | ylTitle · 标题 |
+| 配套组件 | `xiaoma-zqyl-dialog-backend` | ylDialog · 弹窗 |
+| 配套组件 | `xiaoma-zqyl-table-simple-backend` | ylTableSimple · 表格（简版） |
+| 配套组件 | `xiaoma-zqyl-empty-page-backend` | ylEmptyPage · 空页面 |
+| 配套组件 | `xiaoma-zqyl-button-backend` | ylButton · 按钮 |
+| 配套组件 | `xiaoma-zqyl-tips-backend` | ylTips · 提示 |
+
+## 执行顺序
+
+0. 若用户提供需求/原型，先按 **xiaoma-zqyl-ui-spec**「从需求/原型生成页面」提取字段与操作，再读本整包
+1. 先读 [pages/feedbackPage.md](./pages/feedbackPage.md) 搭**反馈页**页面骨架
+2. 按需求出现的组件，读取已安装的 `xiaoma-zqyl-{组件key}-backend` 组件 skill（如上表；同模块已一并安装）
+3. 组件细节以组件 skill 为准，不得与页面骨架冲突
+4. 交付前对照 **xiaoma-zqyl-ui-spec** 交付自检清单

package/src/zqyl-skills/backend/xiaoma-zqyl-feedback-page-backend/pages/feedbackPage.md

@@ -0,0 +1,124 @@
+---
+title: 反馈页（后台）
+---
+
+
+# 反馈页（后台）
+
+你是一个前端页面实现助手。以本技能描述的反馈页骨架为**基线**；**无公共反馈组件**，需自定义居中布局 + Element UI 图标与按钮；弹窗无数据场景配合 `ylDialog` + `ylTableSimple`。
+
+## 平台与参考
+
+- 平台：后台
+- platformType（ylTitle / ylSearchForm）：`yxManager`
+- 模板数据名：`feedbackPage`
+- 布局类型：**跳转新页面反馈**（`ylTitle` → 居中反馈面板：状态图标 + 标题 + 说明 + 操作按钮；弹窗场景用 `ylDialog` + 空数据 `ylTableSimple`）
+- **无公共反馈组件**，页面结构自行实现，勿虚构不存在的 `ylPageFeedback`。
+
+## 页面说明
+
+跳转新页面反馈：结果页面、数据异常页面、弹窗无数据页面；无公共反馈组件，使用居中布局 + 状态图标 + 操作按钮
+
+## 何时使用
+
+- 操作完成后**跳转新页面**展示结果（操作成功 / 操作失败）。
+- 列表或详情加载失败、无数据、网络异常等需**整页引导**的场景。
+- 弹窗内表格**暂无数据**时，需保留标题与表头，避免用户误以为仍在加载。
+- 用户提到「结果页/反馈页/提交成功页/暂无数据/网络异常/页面异常/操作完成跳转」等信号时。
+
+## 重要说明
+
+- **无公共反馈组件**（如 `ylPageFeedback`），需按场景自行拼装 DOM 结构。
+- 轻量操作反馈（Toast）用 `Message`；打断式确认用 `MessageBox`；**整页反馈**才用本模板。
+
+## 页头与返回（按需求/原型）
+
+- **是否带返回以需求/原型为准**；规范平台预览示例默认**不带返回**（操作完成跳转页常见）。
+- 需页头/返回时：前台/后台用 **`ylTitle`**，返回落位与 `disabledBack` 见 `xiaoma-zqyl-title-backend` skill。
+
+## 场景一：结果页面
+
+1. **`el-card`** 内可用 `el-tabs` 切换「操作成功 / 操作失败」（预览用；业务页按路由或状态渲染单一结果）。
+2. **操作成功**：
+   - 图标：`el-icon-success`（48px，`#67c23a`）+ 标题「操作成功」
+   - 说明区：`success-text max-w500`，14px / `#606266`，可展示补充说明
+   - 按钮：`返回首页`（primary）+ `查看详情`（primary plain）
+3. **操作失败**：
+   - 图标：`el-icon-error`（48px，`#f56c6c`）+ 标题「操作失败」
+   - 副标题：`请核对并修改以下信息后，再重新提交。`（14px / `#909399`）
+   - 按钮：`返回修改`（primary）
+   - **错误信息框** `error-info-box`：灰底 `#f5f7fa`、虚线边框、左对齐；标题「您提交的内容有如下错误：」+ 多条 `<p>` 错误说明（可含链接文字）
+
+## 场景二：数据异常页面
+
+1. 使用 **`ylEmptyPage`**（见 `xiaoma-zqyl-empty-page-backend` skill）展示插画与提示文案。
+2. **暂无数据**：`type="noData"`，使用组件内置插画与默认文案；外层按钮如「新建」+「返回列表」。
+3. **404 页面**：`type="notFoundRequet"`，文案如「别担心，返回首页」；外层「返回首页」按钮。
+4. 可通过 `text` 覆盖默认文案；操作按钮放在组件**外层**（组件无插槽/事件）。
+
+## 场景三：弹窗无数据页面
+
+1. 使用 **`ylDialog`** + **`ylTableSimple`**（见 `xiaoma-zqyl-dialog-backend` / `xiaoma-zqyl-table-simple-backend` skill）。
+2. 弹窗保留**标题**与表格**表头**；`loadData: []` 时展示 Element 默认「暂无数据」占位。
+3. 禁止只显示空白区域或 loading 不结束，防止用户误以为刷新缓慢。
+
+## 布局与样式
+
+| 元素 | 规则 |
+| --- | --- |
+| 页面根容器 | 前台/后台默认；中台加 `yl_manager_container` |
+| 页头 | 按需求决定是否带返回；规则见「页头与返回」 |
+| 反馈面板 | 外边距 16px；内边距约 48px 24px 40px；白底 + 轻阴影 |
+| 状态图标 | 48px（`ft48`），与标题间距 16px |
+| 成功说明区 | `max-width: 504px`，居中，距标题 24px |
+| 失败错误框 | `max-width: 894px`，距按钮区 80px，padding 24px |
+
+## 示例骨架（结果页 · 无公共组件）
+
+```vue
+<div class="feedback-page">
+  <ylTitle :platformType="'yxManager'" title="操作结果" :disabledBack="true" />
+  <div class="feedback-panel">
+    <i class="el-icon-success feedback-panel__icon" style="color: #67c23a" />
+    <div class="feedback-panel__title">提交成功</div>
+    <div class="feedback-panel__desc">您的申请已提交，24 小时内通知审核结果。</div>
+    <div class="feedback-panel__actions">
+      <el-button type="primary" @click="onView">查看详情</el-button>
+      <el-button @click="onBack">返回列表</el-button>
+    </div>
+  </div>
+</div>
+```
+
+- 上例为**预览默认**（无返回）；需求带返回时按「页头与返回」及对应页头组件 skill 调整。
+- platformType：`yxManager`
+
+## 引入与注册
+
+> **zqyl-component-base**：公共组件须在**项目入口文件**（如 `entry_main.js`、`main.js`）按**真实组件名**逐个 `import` 并以 `Vue.component` 全局注册；样式在入口 `import 'zqyl-component-base/lib/theme-chalk/component.css'`。**禁止** `import zqylComponentBase from 'zqyl-component-base'` + `Vue.use(zqylComponentBase)` 全量注册。
+
+生成前先检查项目入口：
+- 入口**已**按组件名注册所需 `yl*` 组件 → 页面直接使用 `<yl-*>`，**勿**在页面 SFC 重复 import
+- 入口**缺少**本页用到的组件 → **仅**在入口补注册缺失项（按组件名逐个 import），**勿**改页面 SFC 做局部注册，**勿**用全量 `Vue.use`
+
+入口按组件名注册示例（仅列举本任务用到的组件，勿全量 `Vue.use`）：
+
+```js
+import 'zqyl-component-base/lib/theme-chalk/component.css';
+import ylTitle from 'zqyl-component-base/lib/ylTitle';
+import ylDialog from 'zqyl-component-base/lib/ylDialog';
+import ylTableSimple from 'zqyl-component-base/lib/ylTableSimple';
+import ylEmptyPage from 'zqyl-component-base/lib/ylEmptyPage';
+
+Vue.component('ylTitle', ylTitle);
+Vue.component('ylDialog', ylDialog);
+Vue.component('ylTableSimple', ylTableSimple);
+Vue.component('ylEmptyPage', ylEmptyPage);
+// 项目 legacy 组件（如 ylManagerTitle）可同样 Vue.component，勿覆盖 base 同名组件
+```
+
+页面 script 只需业务逻辑与接口，模板直接使用全局组件，例如：
+
+```vue
+<yl-title platformType="yx" title="列表页标题" :disabledBack="true" />
+```

package/src/zqyl-skills/backend/xiaoma-zqyl-form-detail-page-backend/SKILL.md

@@ -0,0 +1,39 @@
+---
+name: xiaoma-zqyl-form-detail-page-backend
+description: 后台表单详情页页面规范及骨架（表单详情页（返回默认 ylTitle 右侧；其他页面级操作 ylTitle 右侧；卡片模块操作小标题行右侧；ylFormView + ylFormEditor + ylTips；按需 ylContainerFoot）；配套组件：ylTitle、ylFormEditor、ylFormView、ylFileUpload、ylPreview、ylTips、ylCollapse、ylModule、ylContainerFoot、ylButton、ylDialog、ylTableSimple）。在用户新建或改造后台表单详情页、或根据需求/原型生成该类型页面时使用；组件细节读取同模块的 xiaoma-zqyl-<组件>-backend skill（完整组件清单见 xiaoma-zqyl-ui-spec 的 components-index.md）。适用于后台管理端仓库（如 zqyl-manager，platformType `yxManager`；页头/表格用 ylTitle + ylTableSimple）。 Use when building or reviewing a ZQYL backend form detail page.
+---
+
+# 表单详情页（后台）
+
+本整包提供**后台表单详情页**的页面骨架与拼装规范。组件 Props / 列配置 / 查询项等细节从已安装的独立组件 skill 读取（同模块已一并安装）。使用时先读 **xiaoma-zqyl-ui-spec**，再按下方知识库层次展开。
+
+`zqyl-component-base` 须在**项目入口文件**按**组件名逐个** `import` 并以 `Vue.component` 注册；样式在入口 `import 'zqyl-component-base/lib/theme-chalk/component.css'`。**禁止** `import zqylComponentBase from 'zqyl-component-base'` + `Vue.use(zqylComponentBase)` 全量注册。页面内直接使用 `<yl-*>`，勿单页重复 import。
+
+## 知识库层次
+
+| 层级 | skill / 路径 | 用途 |
+| --- | --- | --- |
+| 页面模板 | [pages/formDetailPage.md](./pages/formDetailPage.md) | 表单详情页 页面骨架与拼装顺序 |
+| 配套组件 | `xiaoma-zqyl-title-backend` | ylTitle · 标题 |
+| 配套组件 | `xiaoma-zqyl-form-editor-backend` | ylFormEditor · 表单编辑 |
+| 配套组件 | `xiaoma-zqyl-form-view-backend` | ylFormView · 表单查看 |
+| 配套组件 | `xiaoma-zqyl-file-upload-backend` | ylFileUpload · 文件上传 |
+| 配套组件 | `xiaoma-zqyl-preview-backend` | ylPreview · 文件预览 |
+| 配套组件 | `xiaoma-zqyl-tips-backend` | ylTips · 提示 |
+| 配套组件 | `xiaoma-zqyl-collapse-backend` | ylCollapse · 折叠 |
+| 配套组件 | `xiaoma-zqyl-module-backend` | ylModule · 折叠模块 |
+| 配套组件 | `xiaoma-zqyl-container-foot-backend` | ylContainerFoot · 页面底部 |
+| 配套组件 | `xiaoma-zqyl-button-backend` | ylButton · 按钮 |
+| 配套组件 | `xiaoma-zqyl-dialog-backend` | ylDialog · 弹窗 |
+| 配套组件 | `xiaoma-zqyl-table-simple-backend` | ylTableSimple · 表格（简版） |
+
+## 执行顺序
+
+0. 若用户提供需求/原型，先按 **xiaoma-zqyl-ui-spec**「从需求/原型生成页面」提取字段与操作，再读本整包
+1. 先读 [pages/formDetailPage.md](./pages/formDetailPage.md) 搭**表单详情页**页面骨架
+2. **操作按钮落位（必做）**：返回未说明位置 → `ylTitle` 右侧（`:disabledBack="true"`）；其他页面级未说明位置 → `ylTitle` 右侧；卡片/模块级未说明位置 → **小标题行右侧**（`el-row.mb16` + `yl_manager_subheading` + `text-right`）；仅需求明确置底 → `ylContainerFoot`
+3. **字段块组件绑定（必做）**：标准字段块（如「基础信息」）→ 必读 `xiaoma-zqyl-form-editor-backend` / `xiaoma-zqyl-form-view-backend`；数据表格 → 必读 `xiaoma-zqyl-table-simple-backend` / `ylTableSimple`（**禁止**默认 `el-table`；中台列表主表除外）；**禁止**整块基础信息用手写 `el-form` / `view-item` 替代
+4. 按需求读取其余配套组件 skill（须已安装组件规范整包）
+5. 生成前检查**项目入口**是否已按组件名注册 `ylFormEditor`、`ylFormView` 等；缺失则在入口补注册，**不得**因此退回手写表单，**禁止**全量 `Vue.use(zqylComponentBase)`
+6. 组件细节以组件 skill 为准，不得与页面骨架冲突
+7. 交付前对照 **xiaoma-zqyl-ui-spec** 交付自检清单