You need to sign in or sign up before continuing.
hookehuyr

docs(plan): 完善计划书表单字段配置使用文档

### 新增
- 添加计划书模块入口与配置地图(页面、组件、配置、API)
- 添加计划书表单字段容器使用示例
- 添加字段组件、模板组件、配置文件的详细说明

### 文档
- README 更新计划书模块定位与优化建议
- CHANGELOG 记录文档更新
- plan-form-schema-usage.md 完善计划书模块配置文档

---

**详细信息**:
- **影响文件**: docs/PLAN/plan-form-schema-usage.md, README.md, docs/CHANGELOG.md
- **技术栈**: Vue 3, Taro
- **测试状态**: npm lint(存在历史警告)
- **备注**: 文档补齐,便于快速定位计划书模块配置与入口

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
......@@ -70,6 +70,10 @@ pnpm lint
-**新人指南更新** - 入口文档从工具生成器调整为业务上手流程
-**文档导航同步** - docs/README 快速导航修正与补充
### 计划书模块定位
-**配置与入口整理** - 补充计划书模块入口、配置与 API 位置说明
-**优化建议** - 新增产品时优先补齐 form_sn 与 plan_config,避免模板缺失
### 计划书模块优化补齐
-**字段分组补齐** - 补齐基本信息/保障/提取字段分组
-**错误回调兼容** - 支持 onError 回调并保持 onViewError 兼容
......
#### [2026-02-14] - 计划书模块配置定位文档整理
### 变更
- 补充计划书模块入口、配置与 API 位置说明
- 增加计划书模块使用流程与容器组件使用示例
- README 更新计划书模块定位与优化建议
### 测试
- pnpm lint(存在历史警告)
---
**详细信息**
- **影响文件**: docs/plan/plan-form-schema-usage.md, README.md, docs/CHANGELOG.md
- **技术栈**: Vue 3, Taro
- **测试状态**: lint 存在历史警告
- **备注**: 文档补齐,便于快速定位计划书模块配置与入口
---
#### [2026-02-14] - 计划书必填校验与提示优化
### 修复
......
......@@ -175,3 +175,76 @@ const template_config = {
- 新字段:仅在 form_schema 增加字段并补充 submit_mapping
- 新联动:在 show_when 与 reset_map 中定义条件
- 新模板:复用现有字段组件,保持 schema 结构一致
## 12. 计划书模块入口与配置地图
### 12.1 页面入口
- 产品详情:`src/pages/product-detail/index.vue`(按钮打开计划书弹窗)
- 产品中心:`src/pages/product-center/index.vue`(列表内“计划书”按钮)
- 搜索页:`src/pages/search/index.vue`(搜索结果卡片“计划书”按钮)
- 计划书列表:`src/pages/plan/index.vue`(查看/删除计划书)
- 提交结果页:`src/pages/plan-submit-result/index.vue`
### 12.2 组件与模板
- 弹窗容器:`src/components/plan/PlanPopupNew.vue`
- 计划书容器:`src/components/plan/PlanFormContainer.vue`
- 模板组件:
- `src/components/plan/PlanTemplates/LifeInsuranceTemplate.vue`
- `src/components/plan/PlanTemplates/CriticalIllnessTemplate.vue`
- `src/components/plan/PlanTemplates/SavingsTemplate.vue`
- 字段组件:`src/components/plan/PlanFields/*`
### 12.3 配置与数据处理
- 模板映射:`src/config/plan-templates.js`
- 字段定义与映射:`src/config/plan-fields.js`
- 字段转换函数:`src/utils/planFieldTransformers.js`
- 字段转换入口:`src/composables/useFieldValueTransform.js`
- 字段联动规则:`src/composables/useFieldDependencies.js`
- 字段校验工具:`src/utils/planFieldValidation.js`
- 订单状态常量:`src/config/constants/orderStatus.js`
### 12.4 API 入口
- 计划书 API:`src/api/plan.js`
- 新增:`addAPI`
- 列表:`listAPI`
- 删除:`deleteAPI`
- 查看:`viewAPI`
### 12.5 技术书/附件预览关联
- 产品详情附件列表:`src/pages/product-detail/index.vue`
- 文件预览能力:`src/composables/useFileOperation.js`
## 13. 计划书模块使用流程
1. 产品详情/产品中心/搜索页获取产品对象(至少包含 `id``form_sn`,可选 `plan_config`
2. 打开 `PlanFormContainer` 并传入 `product`
3. `PlanFormContainer` 根据 `form_sn``plan-templates` 选择模板并合并 `plan_config`
4. 模板组件基于 `form_schema` 渲染字段,调用自身 `validate` 完成校验
5. 提交时使用 `submit_mapping` 生成请求参数,并通过 `addAPI` 提交
6. 提交完成后通过 `usePlanSubmit` 跳转到提交结果页
7. 在计划书列表中用 `listAPI` 拉取数据,使用 `viewAPI` 标记为已查看
## 14. 计划书容器使用示例
```vue
<template>
<PlanFormContainer
v-model:visible="show_plan_popup"
:product="selected_product"
@close="show_plan_popup = false"
@submit="handle_plan_submit"
/>
</template>
<script setup>
import { ref } from 'vue'
import PlanFormContainer from '@/components/plan/PlanFormContainer.vue'
import { usePlanSubmit } from '@/composables/usePlanSubmit'
const show_plan_popup = ref(false)
const selected_product = ref(null)
const { handlePlanSubmit: handle_plan_submit } = usePlanSubmit({
getPopupState: () => show_plan_popup.value,
setPopupState: (state) => { show_plan_popup.value = state },
pageName: 'Plan Entry'
})
</script>
```
......