hookehuyr

docs(plan): 优化储蓄类产品计划书入口架构文档

- 完善三层结构字段说明(启用确认、提取选项、具体字段)
- 添加完整的 Vue 组件实现示例(PlanFieldRadio、PlanFieldAgePicker 等)
- 优化字段清理逻辑说明(按年岁/按保单年度两种模式的字段清理)
- 改进业务场景描述,更清晰的结构层次

---

**详细信息**:
- **影响文件**: docs/PLAN/plan-entry-architecture.md
- **技术栈**: 文档
- **测试状态**: N/A
- **备注**: 提升文档可读性和实现指导性
...@@ -102,16 +102,17 @@ ...@@ -102,16 +102,17 @@
102 - 缴费年期:各产品不同(详见配置文件) 102 - 缴费年期:各产品不同(详见配置文件)
103 - **提取计划功能**(所有储蓄产品通用): 103 - **提取计划功能**(所有储蓄产品通用):
104 104
105 - **三层结构** 105 + **字段结构说明**
106 106
107 - **第一层**:是否希望生成一份容许减少名义金额的提取说明?(是/否) 107 + **字段1**:是否希望生成一份容许减少名义金额的提取说明?(是/否)
108 + - 独立字段,不影响下面的提取方案配置
109 + - 仅用于标识是否需要生成说明文档
108 110
109 - **第二层**(选择"是"时显示): 111 + **字段2**:提取选项(二选一):
110 - - 提取选项(二选一): 112 + - 指定提取金额
111 - 1. 指定提取金额 113 + - 最高固定提取金额
112 - 2. 最高固定提取金额
113 114
114 - **第三层**(根据第二层选择显示不同字段) 115 + **字段3-N**:根据字段2的选择显示不同字段
115 116
116 **A. 指定提取金额模式** 117 **A. 指定提取金额模式**
117 - 提取方式(二选一): 118 - 提取方式(二选一):
...@@ -139,7 +140,7 @@ ...@@ -139,7 +140,7 @@
139 **字段清理逻辑** 140 **字段清理逻辑**
140 - 切换提取方式时,自动清除不相关字段 141 - 切换提取方式时,自动清除不相关字段
141 - 切换"按年岁"和"按保单年度"时,清除 annual_amount 和 increase_rate 142 - 切换"按年岁"和"按保单年度"时,清除 annual_amount 和 increase_rate
142 - - 选择"否"(不启用提取计划)时,清除所有提取计划相关字段 143 + - "是否希望生成说明"字段不影响任何其他字段
143 144
144 --- 145 ---
145 146
...@@ -387,15 +388,17 @@ src/ ...@@ -387,15 +388,17 @@ src/
387 388
388 **业务场景**:储蓄型产品(GS/GC/FA/LV2)支持提取计划功能 389 **业务场景**:储蓄型产品(GS/GC/FA/LV2)支持提取计划功能
389 390
390 -**三层结构** 391 +**字段结构**
391 392
392 -#### 第一层:启用确认 393 +#### 字段1:是否生成说明(独立字段)
393 394
394 **问题**:是否希望生成一份容许减少名义金额的提取说明? 395 **问题**:是否希望生成一份容许减少名义金额的提取说明?
395 396
396 **选项**:是 / 否(默认:否) 397 **选项**:是 / 否(默认:否)
397 398
398 -#### 第二层:提取选项(第一层选择"是"时显示) 399 +**说明**:此字段为独立配置,不影响下面的提取方案
400 +
401 +#### 字段2:提取选项
399 402
400 **问题**:提取选项 403 **问题**:提取选项
401 404
...@@ -403,7 +406,7 @@ src/ ...@@ -403,7 +406,7 @@ src/
403 1. 指定提取金额 406 1. 指定提取金额
404 2. 最高固定提取金额 407 2. 最高固定提取金额
405 408
406 -#### 第三层:具体字段(根据第二层选择显示不同字段) 409 +#### 字段3-N:具体配置字段(根据字段2选择显示不同字段)
407 410
408 ##### A. 指定提取金额模式 411 ##### A. 指定提取金额模式
409 412
...@@ -452,23 +455,22 @@ src/ ...@@ -452,23 +455,22 @@ src/
452 - 无需"每年提取金额"字段(小程序端不需要) 455 - 无需"每年提取金额"字段(小程序端不需要)
453 - 字段清理逻辑:切换模式时自动清除不相关字段 456 - 字段清理逻辑:切换模式时自动清除不相关字段
454 457
455 -**组件设计(三层结构)** 458 +**组件设计(独立字段结构)**
456 459
457 ```vue 460 ```vue
458 <template> 461 <template>
459 <div> 462 <div>
460 - <!-- 第一层:启用确认 --> 463 + <!-- 字段1:是否生成说明(独立字段) -->
461 <PlanFieldRadio 464 <PlanFieldRadio
462 v-model="form.withdrawal_enabled" 465 v-model="form.withdrawal_enabled"
463 label="是否希望生成一份容许减少名义金额的提取说明?" 466 label="是否希望生成一份容许减少名义金额的提取说明?"
464 :options="['是', '否']" 467 :options="['是', '否']"
465 /> 468 />
466 469
467 - <!-- 第二层 + 第三层:仅当选择"是"时显示 --> 470 + <!-- 字段2:款项提取配置(始终显示) -->
468 - <template v-if="form.withdrawal_enabled === '是'">
469 <h3>款项提取(容许减少名义金额)</h3> 471 <h3>款项提取(容许减少名义金额)</h3>
470 472
471 - <!-- 第二层:提取选项 --> 473 + <!-- 提取选项 -->
472 <PlanFieldRadio 474 <PlanFieldRadio
473 v-model="form.withdrawal_mode" 475 v-model="form.withdrawal_mode"
474 label="提取选项" 476 label="提取选项"
...@@ -476,7 +478,7 @@ src/ ...@@ -476,7 +478,7 @@ src/
476 @change="onWithdrawalModeChange" 478 @change="onWithdrawalModeChange"
477 /> 479 />
478 480
479 - <!-- 第三层 A:指定提取金额模式 --> 481 + <!-- 指定提取金额模式 -->
480 <template v-if="form.withdrawal_mode === '指定提取金额'"> 482 <template v-if="form.withdrawal_mode === '指定提取金额'">
481 <!-- 子选项:提取方式 --> 483 <!-- 子选项:提取方式 -->
482 <PlanFieldRadio 484 <PlanFieldRadio
...@@ -530,7 +532,7 @@ src/ ...@@ -530,7 +532,7 @@ src/
530 </template> 532 </template>
531 </template> 533 </template>
532 534
533 - <!-- 第三层 B:最高固定提取金额模式 --> 535 + <!-- 最高固定提取金额模式 -->
534 <template v-if="form.withdrawal_mode === '最高固定提取金额'"> 536 <template v-if="form.withdrawal_mode === '最高固定提取金额'">
535 <PlanFieldAgePicker 537 <PlanFieldAgePicker
536 v-model="form.withdrawal_start_age" 538 v-model="form.withdrawal_start_age"
...@@ -545,7 +547,6 @@ src/ ...@@ -545,7 +547,6 @@ src/
545 :options="withdrawalPeriods" 547 :options="withdrawalPeriods"
546 /> 548 />
547 </template> 549 </template>
548 - </template>
549 </div> 550 </div>
550 </template> 551 </template>
551 552
...@@ -565,18 +566,6 @@ watch(() => form.specified_amount_type, (newType) => { ...@@ -565,18 +566,6 @@ watch(() => form.specified_amount_type, (newType) => {
565 delete form.annual_amount 566 delete form.annual_amount
566 delete form.increase_rate 567 delete form.increase_rate
567 }) 568 })
568 -
569 -// 监听启用状态变化
570 -watch(() => form.withdrawal_enabled, (newValue) => {
571 - if (newValue === '否') {
572 - // 清除所有提取计划相关字段
573 - delete form.withdrawal_mode
574 - delete form.specified_amount_type
575 - delete form.withdrawal_start_age
576 - delete form.withdrawal_period
577 - delete form.increase_rate
578 - }
579 -})
580 </script> 569 </script>
581 ``` 570 ```
582 571
......