---
name: deppon-pro-form-advanced-customer
description: >-
    生成多块 el-card + pro-form 的「客户类」高级页：只读/编辑切换、card 头部自定义操作按钮（含样式与
    handler）。在用户提到多卡片高级表单、只读模式、表单头部操作、多表单配置数组时应用。
---

# deppon-pro-form-advanced-customer

## 依据来源（私有 npm）

-   **`deppon-npm-private-registry`**。
-   **`@deppon/deppon-template`**：`ProForm`（`readonly` 等 props 以 `*.d.ts` 为准）。
-   **`@deppon/deppon-ui`**：`ElCard`、`ElRadioGroup`、`ElButton` 等。
-   **`deppon-npm-skills`**。不默认读取 `deppon-npm` 的 `site/`。

## 结构要点

-   `el-radio-group` 或同类控件切换 `isReadonly`，传给各 `pro-form` 的 `:readonly`（props 名以 **`ProForm` 类型定义** 为准）。
-   `v-for="form in formConfigs"`：`el-card` 的 `#header` 左侧标题 + 右侧 `form.headerActions` 渲染 `el-button`（支持自定义 border/color/hover 回调）。
-   每个 `pro-form`：`ref`、`columns`、`initial-values`、`rules`、`@submit` 等与 **`@deppon/deppon-template`** 文档及类型一致。

## 生成清单

-   [ ] `headerActions` 为数据驱动：`:key`、`handler(form.key)`、可选箭头图标。
-   [ ] 只读切换后校验与提交策略与业务一致（默认可参照 `ProForm` 文档行为）。
-   [ ] 多表单时 `formConfigs` 可扩展为从接口拉取的配置。