209 lines
4.7 KiB
Markdown
209 lines
4.7 KiB
Markdown
## **一、基本信息**
|
||
|
||
- **项目技术栈**：Vue2（前端） + SQL Server（数据库/存储过程）
|
||
- **开发日期**：2026-05-22
|
||
- **开发人员**：\[填写姓名]
|
||
- **任务总数**：2
|
||
|
||
***
|
||
|
||
## **二、任务一：存储过程 – 采购单历史价格曲线图数据**
|
||
|
||
### **2.1 需求描述**
|
||
|
||
编写/修改一个存储过程，统计指定采购单（或指定物料）的历史采购价格，返回用于前端绘制曲线图的数据结构（时间 + 价格）。
|
||
|
||
### **2.2 技术目标**
|
||
|
||
- 输入参数：`@MaterialID`（物料ID） 或 `@PurchaseOrderID`（采购单号）
|
||
- 输出数据集：`HistoryDate`（日期）、`UnitPrice`（单价）
|
||
- 按时间升序排列
|
||
|
||
### **2.3 存储过程实现（SQL Server）**
|
||
|
||
sql
|
||
|
||
```
|
||
CREATE OR ALTER PROC usp_GetPurchasePriceHistory
|
||
@MaterialID INT
|
||
AS
|
||
BEGIN
|
||
SET NOCOUNT ON;
|
||
SELECT
|
||
CONVERT(DATE, po.OrderDate) AS HistoryDate,
|
||
pod.UnitPrice
|
||
FROM PurchaseOrderDetail pod
|
||
INNER JOIN PurchaseOrder po ON pod.PurchaseOrderID = po.PurchaseOrderID
|
||
WHERE pod.MaterialID = @MaterialID
|
||
AND pod.UnitPrice IS NOT NULL
|
||
AND po.OrderDate IS NOT NULL
|
||
GROUP BY CONVERT(DATE, po.OrderDate), pod.UnitPrice
|
||
ORDER BY HistoryDate ASC;
|
||
END
|
||
```
|
||
|
||
### **2.4 前端调用示例（Vue2 + axios）**
|
||
|
||
javascript
|
||
|
||
```
|
||
// API 服务层
|
||
getPriceHistory(materialId) {
|
||
return axios.post('/api/getPriceHistory', { materialId });
|
||
}
|
||
|
||
// 组件中使用
|
||
async loadChartData() {
|
||
const res = await getPriceHistory(this.selectedMaterialId);
|
||
const chartData = {
|
||
dates: res.data.map(item => item.HistoryDate),
|
||
prices: res.data.map(item => item.UnitPrice)
|
||
};
|
||
this.renderLineChart(chartData);
|
||
}
|
||
```
|
||
|
||
### **2.5 曲线图组件建议**
|
||
|
||
- 使用 `echarts` 或 `chart.js`
|
||
- X轴：日期，Y轴：单价
|
||
|
||
***
|
||
|
||
## **三、任务二：员工组件 – 必填项改为选填项 + 存储过程修改**
|
||
|
||
### **3.1 需求描述**
|
||
|
||
员工信息组件中原有字段（如：手机号、备用邮箱等）为必填，现改为**选填**，并修改对应的**存储过程**以兼容空值写入/更新。
|
||
|
||
### **3.2 前端修改（Vue2）**
|
||
|
||
#### **3.2.1 表单校验规则调整**
|
||
|
||
javascript
|
||
|
||
```
|
||
// 原 rules
|
||
rules: {
|
||
phone: [{ required: true, message: '请填写手机号' }],
|
||
email: [{ required: true, message: '请填写邮箱' }]
|
||
}
|
||
|
||
// 改为选填（删除 required 或设为 false）
|
||
rules: {
|
||
phone: [{ required: false, message: '请填写手机号' }],
|
||
email: [{ required: false, message: '请填写邮箱' }]
|
||
}
|
||
```
|
||
|
||
#### **3.2.2 必填标识（星号）移除**
|
||
|
||
vue
|
||
|
||
```
|
||
<el-form-item label="手机号" prop="phone">
|
||
<!-- 原 <span class="required-star">*</span> 移除或条件显示 -->
|
||
</el-form-item>
|
||
```
|
||
|
||
### **3.3 后端存储过程修改（SQL Server）**
|
||
|
||
#### **3.3.1 原存储过程（假设示例）**
|
||
|
||
sql
|
||
|
||
```
|
||
CREATE PROC usp_InsertEmployee
|
||
@Name NVARCHAR(50),
|
||
@Phone VARCHAR(20),
|
||
@Email VARCHAR(100)
|
||
AS
|
||
BEGIN
|
||
INSERT INTO Employee (Name, Phone, Email)
|
||
VALUES (@Name, @Phone, @Email);
|
||
END
|
||
```
|
||
|
||
#### **3.3.2 修改后（支持选填字段）**
|
||
|
||
sql
|
||
|
||
```
|
||
ALTER PROC usp_InsertEmployee
|
||
@Name NVARCHAR(50),
|
||
@Phone VARCHAR(20) = NULL, -- 允许为空
|
||
@Email VARCHAR(100) = NULL -- 允许为空
|
||
AS
|
||
BEGIN
|
||
INSERT INTO Employee (Name, Phone, Email)
|
||
VALUES (@Name, @Phone, @Email);
|
||
END
|
||
```
|
||
|
||
> 注：`ALTER PROC` 需确认参数名、顺序与原存储过程一致。
|
||
|
||
### **3.4 数据库表字段允许 NULL**
|
||
|
||
确保 `Phone`、`Email` 字段已设置为 `NULL`（若此前为 `NOT NULL` 需执行改表语句）：
|
||
|
||
sql
|
||
|
||
```
|
||
ALTER TABLE Employee ALTER COLUMN Phone VARCHAR(20) NULL;
|
||
ALTER TABLE Employee ALTER COLUMN Email VARCHAR(100) NULL;
|
||
```
|
||
|
||
***
|
||
|
||
## **四、测试要点**
|
||
|
||
**任务**
|
||
|
||
**测试项**
|
||
|
||
**预期结果**
|
||
|
||
曲线图
|
||
|
||
输入有效物料ID
|
||
|
||
返回正确的时间-价格序列
|
||
|
||
曲线图
|
||
|
||
输入无历史价格的物料
|
||
|
||
返回空数据集，前端提示无数据
|
||
|
||
员工组件
|
||
|
||
手机号、邮箱不填写提交
|
||
|
||
可成功提交，数据库对应字段为 NULL
|
||
|
||
员工组件
|
||
|
||
原有必填逻辑（如姓名）
|
||
|
||
仍保持必填
|
||
|
||
***
|
||
|
||
## **五、部署与回滚注意事项**
|
||
|
||
- **存储过程**：先备份原存储过程（`DROP` 前先 `CREATE` 备份脚本）
|
||
- **前端**：仅移除校验规则，不涉及路由或组件结构大改
|
||
- **数据库字段**：`ALTER COLUMN NULL` 操作不可逆，建议先在测试库执行
|
||
|
||
***
|
||
|
||
## **六、完成确认（Checklist）**
|
||
|
||
- 存储过程 `usp_GetPurchasePriceHistory` 已创建/修改并通过测试
|
||
- 前端曲线图可正常展示历史价格
|
||
- 员工组件校验规则已改为选填
|
||
- 员工组件对应存储过程已支持 `NULL`
|
||
- 数据库字段已允许 `NULL`
|
||
- 提交代码并备注今日工作计划完成
|
||
|