本节课开启了一个全新的章节内容——用例设计。
前言：
先思考一个问题：如何利用deepseek来辅助生成测试用例？
在初期，许多学习者可能会直接把原始需求文档扔给AI，期望它一键输出完整的测试用例。但实际效果往往不尽如人意：生成的格式杂乱无章，内容覆盖不全，遗漏关键测试点，甚至出现重复或逻辑错误的用例。
因此，不少同学开始尝试优化这一流程：
例如，在生成后通过强制规范输出格式，便于后续自动化处理，比如整理、去重、统计、导出和阅读。
又或者，在输入前对需求进行预处理。面对冗长复杂的功能描述，AI理解容易偏差，于是有人提出先将大需求拆解为多个子功能点，分别生成后再合并结果。
还有人意识到不同功能模块适合不同的用例设计方法，因此尝试为每个功能点配置专属的设计策略（如等价类、边界值、场景法等）。
随着优化点不断叠加，系统逐渐复杂化，最终催生出一个完整的AI驱动的自动化用例生成平台——而这正是本教程所构建的内容。
该平台主要分为三个阶段：
- 生成前：需求解析与准备
- 生成中：测试用例的实际生成
- 生成后：用例的整理与应用
那么目前我们进行到了哪个阶段呢？答案是：第二阶段，即“生成中”。
接下来，正式进入用例生成模块的开发环节：
正文：
首先，回顾一下当前平台的整体界面：
图片我们先从页面设计入手。
我们需要明确当前有多少个待生成的任务：
查看如下图所示：
图片共有13个生成任务。每个任务我计划使用独立的子线程执行，采用并发方式运行。每个线程需携带三项核心数据：原始需求、具体的用例设计策略、以及对应的功能点列表。
因此，在用例生成页面中，我们首先要展示这些基本信息，让用户在等待过程中能清晰掌握进度状态。
现在开始创建用例生成的子页面：
新建文件：CaseMake.vue
图片代码内容如下（复制后请自行调整换行）：
<template> （生成结果较慢，请耐心等待，不要刷新或关闭页面） <br></br> <el-card> <template> <el-button absolute="">开始生成</el-button> 基本生成信息（请确保无误后点击右侧'开始生成按钮'） </template> </el-card> </template> import axios from 'axios' export default { name: "CaseMake", data(){ return{ old_srs:'', new_srs:'', } }, methods:{ }, watch: { 'project.id': { immediate: true, // 立即执行一次 handler(newId) { if (newId) { axios.get('http://localhost:8000/get_old_srs/?project_id='+this.project.id).then(res=>{ this.old_srs = res.data }) axios.get('http://localhost:8000/get_new_srs/?project_id='+this.project.id).then(res=>{ this.new_srs = res.data }) } } } }, props:["project"], computed: { name: { get() { return this.project.id; // 从prop获取初始值 }, } } }.card-content{ margin-bottom: 5px;}.input-group { display: flex; /* 启用 Flex 布局 */ align-items: center; /* 垂直居中 */ gap: 5px; /* 元素间距 */ /* 如果不需要响应式可以固定高度 */ height: 40px;}接着，在 ProjectDetail.vue 中配置路由跳转入口：
图片配置完成后效果如下：
图片界面初具雏形，效果良好！
接下来是数据接入部分。以下是一段已准备好的代码片段（你复制的版本也包含此内容）：
图片实际上，我们已经可以通过父组件传入 old_srs、new_srs 和 project.id，无需额外请求接口，直接使用即可。
图片最终呈现效果如下（可根据个人喜好进一步美化）：
图片由于篇幅所限，本节内容到此为止，敬请持续关注后续更新！
如需课程咨询或培训，请添加微信：qingwanjianhua
现正招生第十三期，提供多种套餐选择：单期购买 / 老学员优惠升级 / 新老课程打包 / 全课程永久授权 等。
图片
图片任选一期课程实录截图如下：
图片
图片
图片
