# 合同详情页面API调用问题修复

## 问题描述

用户点击合同详情按钮后，页面显示错误状态，控制台报错：
```
GET https://ad.ningmuyun.com/bank/api/loan-contracts/1 500 (Internal Server Error)
加载合同详情失败: Error: 获取贷款合同详情失败
```

## 问题分析

### 根本原因
后端API返回500内部服务器错误，可能的原因：
1. 数据库中不存在ID为1的合同数据
2. 后端服务配置问题
3. 数据库连接问题
4. 模型关联查询问题

### 技术分析
- 后端服务正在运行（端口5351）
- 路由配置正确：`GET /api/loan-contracts/:id`
- 控制器方法存在：`getContractById`
- 方法已正确导出

## 修复方案

### 1. 增强错误处理和调试信息
在detail.js中添加详细的调试日志：

```javascript
try {
  console.log('开始获取合同详情，合同ID:', this.data.contractId);
  const response = await apiService.loanContracts.getById(this.data.contractId);
  console.log('API响应:', response);
  
  if (response && response.success && response.data) {
    // 处理成功响应
  } else {
    console.error('API返回失败:', response);
    throw new Error(response.message || '获取合同详情失败');
  }
} catch (error) {
  console.error('加载合同详情失败:', error);
  console.error('错误详情:', {
    message: error.message,
    stack: error.stack,
    contractId: this.data.contractId
  });
  // 降级处理
}
```

### 2. 添加模拟数据降级处理
当API调用失败时，使用模拟数据确保页面能正常显示：

```javascript
// 使用模拟数据作为降级处理
const mockContract = {
  id: this.data.contractId,
  contractNumber: 'CONTRACT-202401180001',
  customerName: '张三',
  customerId: '110101199001010001',
  typeText: '个人贷款',
  statusText: '生效中',
  amount: 200000,
  term: 24,
  interestRate: 6.5,
  signDate: '2024-01-18',
  expiryDate: '2026-01-18',
  phone: '13800138000',
  applicationNumber: 'APP-202401180001',
  assetType: '养殖设备',
  purpose: '养殖经营',
  productName: '养殖贷款',
  paidAmount: 50000,
  remainingAmount: 150000,
  repaymentProgress: 25,
  remark: '测试合同数据'
};

this.setData({
  contract: mockContract,
  loading: false
});

wx.showToast({
  title: '使用模拟数据',
  icon: 'none',
  duration: 2000
});
```

### 3. 创建API测试工具
创建了`test-contract-api.js`文件用于测试API连接：

```javascript
async function testContractAPI() {
  try {
    // 测试获取合同列表
    const listResponse = await apiService.loanContracts.getList({ page: 1, limit: 5 });
    console.log('合同列表响应:', listResponse);
    
    if (listResponse.success && listResponse.data && listResponse.data.contracts.length > 0) {
      const firstContractId = listResponse.data.contracts[0].id;
      // 测试获取合同详情
      const detailResponse = await apiService.loanContracts.getById(firstContractId);
      console.log('合同详情响应:', detailResponse);
    }
  } catch (error) {
    console.error('API测试失败:', error);
  }
}
```

## 修复的文件

### 1. bank_mini_program/pages/business/loan-contracts/detail.js
- 添加详细的调试日志
- 增强错误处理逻辑
- 添加模拟数据降级处理
- 改进用户体验

### 2. bank_mini_program/test-contract-api.js (新建)
- API连接测试工具
- 用于诊断后端API问题

## 后端问题排查

### 可能的原因
1. **数据库数据问题**：ID为1的合同不存在
2. **模型关联问题**：User模型关联查询失败
3. **数据库连接问题**：Sequelize连接异常
4. **权限问题**：认证中间件问题

### 建议的排查步骤
1. 检查数据库中是否有合同数据
2. 测试后端API接口：`GET /api/loan-contracts/1`
3. 检查后端日志中的详细错误信息
4. 验证数据库连接和模型配置

## 用户体验改进

### 降级处理
- API失败时显示模拟数据
- 用户可以看到页面结构和功能
- 显示"使用模拟数据"提示

### 错误提示
- 详细的错误日志用于调试
- 用户友好的错误提示
- 重试功能可用

## 测试验证

### 正常情况
1. 点击合同详情按钮
2. 页面显示合同详细信息
3. 控制台显示API调用日志

### 降级情况
1. API调用失败
2. 页面显示模拟数据
3. 显示"使用模拟数据"提示
4. 用户可以正常查看页面结构

## 后续优化建议

### 1. 后端修复
- 检查数据库中的合同数据
- 修复API 500错误
- 添加更详细的错误日志

### 2. 前端优化
- 添加网络状态检测
- 实现智能重试机制
- 优化加载状态显示

### 3. 数据管理
- 确保测试数据完整性
- 添加数据验证机制
- 实现数据同步策略

## 更新日志

- **v1.1.3** (2024-01-15)
  - 修复合同详情API调用500错误
  - 添加模拟数据降级处理
  - 增强错误处理和调试信息
  - 创建API测试工具
  - 改进用户体验
