|
|
# 按钮位置统一调整执行文档
|
|
|
|
|
|
## 一、目的
|
|
|
|
|
|
将 \产品影响因素分析\ 和 \产品开发流程\ 实训页面的工具栏按钮（素材按钮 + 导出按钮）从 \workbench-head\ 内移到 \ ask-header\ 同级别的 \ ask-action-strip\ 区域，参考页面 \新产品需求调研\ 的标准布局。
|
|
|
|
|
|
## 二、参考页面结构
|
|
|
|
|
|
\
|
|
|
ew-product-survey.vue\ 的标准布局：
|
|
|
|
|
|
\\\html
|
|
|
<main class=\"xxx-core\">
|
|
|
<section class=\"task-header\"> <!-- 任务头部信息 + 标题 -->
|
|
|
...
|
|
|
</section>
|
|
|
|
|
|
<section class=\"task-action-strip\"> <!-- 工具栏操作按钮区 -->
|
|
|
<TrainingTaskToolbar :task-key=\"TASK_KEY\" :on-export=\"exportOutcome\" />
|
|
|
</section>
|
|
|
|
|
|
<section class=\"xxx-workbench\"> <!-- 工作台内容 + 步骤 -->
|
|
|
...
|
|
|
</section>
|
|
|
</main>
|
|
|
\\\
|
|
|
|
|
|
---
|
|
|
|
|
|
## 七、删除下方步骤中重复的\"提交任务\"按钮
|
|
|
|
|
|
### 问题描述
|
|
|
|
|
|
顶部 \TrainingTaskToolbar\ 组件已包含\"提交任务\"按钮，但 Step 4 步骤下方也出现了相同的按钮，导致按钮重复。
|
|
|
|
|
|
### 调整方案
|
|
|
|
|
|
| 按钮 | 位置 | 操作 |
|
|
|
|------|------|------|
|
|
|
| \"提交任务\" | 顶部 \TrainingTaskToolbar\ | 保留 |
|
|
|
| \"提交任务\" | 步骤下方 | **删除**（重复） |
|
|
|
| \"清空填写\"/\"清空本步\" | 步骤下方 | 保留 |
|
|
|
|
|
|
### 删除前必须检查的事项
|
|
|
|
|
|
> **重要**：删除按钮前，必须确认该按钮绑定的 \submitTraining\ 方法名是否与顶部组件一致，避免误删导致提交功能失效。
|
|
|
|
|
|
#### 检查清单
|
|
|
|
|
|
1. **确认方法名一致性**：
|
|
|
- 检查步骤内按钮绑定的提交方法名（如 \@click=\"submitTraining\"\）
|
|
|
- 对比 \TrainingTaskToolbar\ 组件内部的提交方法名
|
|
|
- **两者方法名必须一致才能安全删除重复按钮**
|
|
|
|
|
|
2. **检查功能绑定**：
|
|
|
- 确认删除后提交功能的调用链路是否完整
|
|
|
- 确保顶部组件的提交方法与当前页面的数据状态关联正确
|
|
|
|
|
|
3. **保留清空功能**：
|
|
|
- \"清空填写\"/\"清空本步\"按钮不调用提交方法，可以保留
|
|
|
|
|
|
### 具体修改
|
|
|
|
|
|
#### \product-development-factors.vue\（第133行附近）
|
|
|
|
|
|
**当前代码：**
|
|
|
\\\html
|
|
|
<div class=\"task-actions\">
|
|
|
<button type=\"button\" class=\"btn-nav btn-submit\" :disabled=\"saving\" @click=\"submitTraining\">
|
|
|
提交任务<el-icon><CircleCheck /></el-icon>
|
|
|
</button>
|
|
|
<button type=\"button\" class=\"btn-nav\" :disabled=\"saving\" @click=\"resetTraining\">
|
|
|
清空填写
|
|
|
</button>
|
|
|
</div>
|
|
|
\\\
|
|
|
|
|
|
**修改为：**
|
|
|
\\\html
|
|
|
<div class=\"task-actions\">
|
|
|
<button type=\"button\" class=\"btn-nav\" :disabled=\"saving\" @click=\"resetTraining\">
|
|
|
清空填写
|
|
|
</button>
|
|
|
</div>
|
|
|
\\\
|
|
|
|
|
|
#### \product-development-process.vue\（第170行附近）
|
|
|
|
|
|
**当前代码：**
|
|
|
\\\html
|
|
|
<div class=\"task-actions\">
|
|
|
<button type=\"button\" class=\"btn-nav btn-submit\" :disabled=\"checking || !stepThreePassed\" @click=\"submitTraining\">
|
|
|
提交任务<el-icon><CircleCheck /></el-icon>
|
|
|
</button>
|
|
|
<button type=\"button\" class=\"btn-nav\" :disabled=\"checking\" @click=\"resetStepFour\">
|
|
|
清空本步
|
|
|
</button>
|
|
|
</div>
|
|
|
\\\
|
|
|
|
|
|
**修改为：**
|
|
|
\\\html
|
|
|
<div class=\"task-actions\">
|
|
|
<button type=\"button\" class=\"btn-nav\" :disabled=\"checking\" @click=\"resetStepFour\">
|
|
|
清空本步
|
|
|
</button>
|
|
|
</div>
|
|
|
\\\
|
|
|
|
|
|
### 调整对照表
|
|
|
|
|
|
| 文件 | 位置 | 操作 | 保留功能 |
|
|
|
|------|------|------|----------|
|
|
|
| \product-development-factors.vue\ | Step 4 下方 task-actions | 删除\"提交任务\"按钮 | \"清空填写\"按钮 |
|
|
|
| \product-development-process.vue\ | Step 4 下方 task-actions | 删除\"提交任务\"按钮 | \"清空本步\"按钮 |
|
|
|
|
|
|
### 执行检查清单
|
|
|
|
|
|
- [ ] 确认步骤内按钮绑定的 \@click=\"submitTraining\"\ 与 \TrainingTaskToolbar\ 组件内的提交方法名一致
|
|
|
- [ ] 确认顶部 \TrainingTaskToolbar\ 的提交功能正常可用
|
|
|
- [ ] 确认删除后\"清空填写\"/\"清空本步\"按钮仍然保留
|
|
|
- [ ] 删除重复的\"提交任务\"按钮代码
|
|
|
- [ ] 测试提交功能是否正常工作
|