250 lines
5.5 KiB
Markdown
250 lines
5.5 KiB
Markdown
# 订单系统 - 补单支付功能
|
||
|
||
## 功能说明
|
||
|
||
订单支付功能已升级，现在支持两种支付方式：
|
||
- ✅ **正常支付**: 从订单列表选择订单进行支付
|
||
- ✅ **补单支付**: 输入订单号进行支付（用于补单场景）
|
||
|
||
---
|
||
|
||
## 前端实现
|
||
|
||
### 支付弹窗
|
||
|
||
支付弹窗现在包含两种支付类型选择：
|
||
|
||
```vue
|
||
<el-form-item label="支付类型" required>
|
||
<el-radio-group v-model="payForm.payType">
|
||
<el-radio label="normal">正常支付</el-radio>
|
||
<el-radio label="supplement">补单支付</el-radio>
|
||
</el-radio-group>
|
||
</el-form-item>
|
||
```
|
||
|
||
### 正常支付
|
||
|
||
显示订单号和订单金额：
|
||
|
||
```vue
|
||
<template v-if="payForm.payType === 'normal'">
|
||
<el-form-item label="订单号">
|
||
<span>{{ payForm.order_no }}</span>
|
||
</el-form-item>
|
||
<el-form-item label="订单金额">
|
||
<span class="text-red-500 font-semibold">¥{{ payForm.amount }}</span>
|
||
</el-form-item>
|
||
</template>
|
||
```
|
||
|
||
### 补单支付
|
||
|
||
输入支付订单号：
|
||
|
||
```vue
|
||
<template v-if="payForm.payType === 'supplement'">
|
||
<el-form-item label="支付订单号" required>
|
||
<el-input
|
||
v-model="payForm.supplement_order_no"
|
||
placeholder="请输入支付订单号"
|
||
/>
|
||
</el-form-item>
|
||
</template>
|
||
```
|
||
|
||
### 支付方式
|
||
|
||
两种支付类型都支持选择支付方式：
|
||
|
||
```vue
|
||
<el-form-item label="支付方式" required>
|
||
<el-radio-group v-model="payForm.payment_method">
|
||
<el-radio label="alipay">支付宝</el-radio>
|
||
<el-radio label="wechat">微信</el-radio>
|
||
<el-radio label="bank">银行卡</el-radio>
|
||
</el-radio-group>
|
||
</el-form-item>
|
||
```
|
||
|
||
### 支付表单数据结构
|
||
|
||
```typescript
|
||
const payForm = ref({
|
||
order_id: 0, // 订单ID（正常支付）
|
||
order_no: '', // 订单号（显示用）
|
||
amount: 0, // 订单金额（显示用）
|
||
payment_method: 'alipay', // 支付方式
|
||
payType: 'normal', // 支付类型：normal/supplement
|
||
supplement_order_no: '' // 补单订单号（补单支付）
|
||
})
|
||
```
|
||
|
||
### 支付逻辑
|
||
|
||
```typescript
|
||
const confirmPay = async () => {
|
||
// 验证补单支付的订单号
|
||
if (payForm.value.payType === 'supplement' && !payForm.value.supplement_order_no) {
|
||
feedback.msgWarning('请输入支付订单号')
|
||
return
|
||
}
|
||
|
||
if (payForm.value.payType === 'normal') {
|
||
// 正常支付：使用订单ID
|
||
await orderPay({
|
||
id: payForm.value.order_id,
|
||
payment_method: payForm.value.payment_method
|
||
})
|
||
} else {
|
||
// 补单支付：使用订单号
|
||
await orderPay({
|
||
order_no: payForm.value.supplement_order_no,
|
||
payment_method: payForm.value.payment_method,
|
||
is_supplement: 1
|
||
})
|
||
}
|
||
}
|
||
```
|
||
|
||
---
|
||
|
||
## 后端实现
|
||
|
||
### 验证规则更新
|
||
|
||
`OrderValidate` 中的 pay 场景验证已更新：
|
||
|
||
```php
|
||
'pay' => ['payment_method'], // 只验证支付方式
|
||
```
|
||
|
||
支持的参数：
|
||
- `id`: 订单ID（正常支付）
|
||
- `order_no`: 订单号（补单支付）
|
||
- `payment_method`: 支付方式（必填）
|
||
- `is_supplement`: 是否补单支付（0/1）
|
||
|
||
### 控制器逻辑
|
||
|
||
`OrderController::pay()` 方法现在支持两种支付方式：
|
||
|
||
```php
|
||
public function pay()
|
||
{
|
||
$params = (new OrderValidate())->post()->goCheck('pay');
|
||
|
||
// 判断是否是补单支付
|
||
if (!empty($params['is_supplement']) && $params['is_supplement'] == 1) {
|
||
// 补单支付：通过订单号查找订单
|
||
if (empty($params['order_no'])) {
|
||
return $this->fail('补单支付需要提供订单号');
|
||
}
|
||
$order = Order::where('order_no', $params['order_no'])->find();
|
||
if (!$order) {
|
||
return $this->fail('订单不存在');
|
||
}
|
||
$orderId = $order->id;
|
||
} else {
|
||
// 正常支付：通过订单ID
|
||
if (empty($params['id'])) {
|
||
return $this->fail('订单ID不能为空');
|
||
}
|
||
$orderId = (int)$params['id'];
|
||
}
|
||
|
||
$result = OrderLogic::pay($orderId, $params['payment_method']);
|
||
if (!$result) {
|
||
return $this->fail(OrderLogic::getError());
|
||
}
|
||
|
||
return $this->success('支付成功');
|
||
}
|
||
```
|
||
|
||
---
|
||
|
||
## API 调用示例
|
||
|
||
### 正常支付
|
||
|
||
```bash
|
||
POST /order.order/pay
|
||
{
|
||
"id": 1,
|
||
"payment_method": "alipay"
|
||
}
|
||
```
|
||
|
||
### 补单支付
|
||
|
||
```bash
|
||
POST /order.order/pay
|
||
{
|
||
"order_no": "ORD20260310123456789",
|
||
"payment_method": "wechat",
|
||
"is_supplement": 1
|
||
}
|
||
```
|
||
|
||
---
|
||
|
||
## 使用流程
|
||
|
||
### 正常支付流程
|
||
|
||
1. 用户在订单列表中点击"支付"按钮
|
||
2. 弹窗打开，默认选择"正常支付"
|
||
3. 显示订单号和订单金额
|
||
4. 选择支付方式
|
||
5. 点击"确认支付"
|
||
|
||
### 补单支付流程
|
||
|
||
1. 用户打开支付弹窗
|
||
2. 选择"补单支付"
|
||
3. 输入支付订单号
|
||
4. 选择支付方式
|
||
5. 点击"确认支付"
|
||
|
||
---
|
||
|
||
## 错误处理
|
||
|
||
### 前端验证
|
||
|
||
- 补单支付时必须输入订单号
|
||
- 支付方式必须选择
|
||
|
||
### 后端验证
|
||
|
||
- 补单支付时订单号必须存在
|
||
- 订单必须存在于数据库中
|
||
- 支付方式必须有效
|
||
|
||
---
|
||
|
||
## 相关文件
|
||
|
||
### 前端
|
||
- `admin/src/views/order/index.vue` - 订单列表页面
|
||
- `admin/src/api/order.ts` - 订单API接口
|
||
|
||
### 后端
|
||
- `server/app/adminapi/controller/order/OrderController.php` - 订单控制器
|
||
- `server/app/adminapi/validate/order/OrderValidate.php` - 订单验证
|
||
- `server/app/adminapi/logic/order/OrderLogic.php` - 订单业务逻辑
|
||
|
||
---
|
||
|
||
## 版本信息
|
||
|
||
- **功能版本**: 1.4.0
|
||
- **实现日期**: 2026-03-10
|
||
- **功能类型**: 支付功能扩展
|
||
- **状态**: ✅ 完成
|
||
|
||
---
|
||
|
||
**功能实现完成** ✅
|