zhywpt-sp/subpackage/after-sale/activation-once-again/README.md

# 车辆详情页面

## 功能说明

新创建的 `vehicle-details.vue` 页面用于显示车辆的详细信息，包括：

### 主要功能
1. **车辆基本信息展示**
   - 车牌号
   - 车牌颜色
   - 所有人
   - 车辆类型
   - 车辆识别代号
   - 发动机号码
   - 核定载人数
   - 整备质量
   - 外廊尺寸
   - 总质量
   - 车轴数

2. **行驶证图片展示**
   - 行驶证主页
   - 行驶证副页
   - 支持图片预览

3. **车牌选择功能**
   - 车牌号输入框
   - 车牌颜色选择（蓝色/渐变绿）
   - 添加新车牌功能

4. **车头照上传**
   - 支持从相册或相机选择图片
   - 图片预览功能

5. **底部操作按钮**
   - 下一步按钮
   - 车辆信息变更按钮

## 使用方法

### 从select-car页面跳转
在 `select-car.vue` 页面的 `choose` 方法中，点击车辆列表项时会跳转到车辆详情页面：

```javascript
const choose = (i, item) => {
    console.log(item.id);
    // 跳转到车辆详情页面，携带item.id参数
    uni.navigateTo({
        url: `/subpackage/after-sale/activation-once-again/vehicle-details?id=${item.id}`
    });
}
```

### 页面参数
- `id`: 车辆ID，用于获取车辆详细信息

### 页面路由
页面路径：`/subpackage/after-sale/activation-once-again/vehicle-details`

## 技术实现

### 文件结构
```
subpackage/after-sale/activation-once-again/
├── select-car.vue          # 车辆选择页面
├── vehicle-details.vue     # 车辆详情页面（新增）
└── README.md              # 说明文档
```

### 主要组件
- 使用 Vue 3 Composition API
- 响应式数据管理
- 图片上传和预览功能
- 车牌输入组件

### 样式特点
- 现代化UI设计
- 响应式布局
- 渐变色按钮
- 卡片式布局

## 注意事项

1. **API集成**: 当前使用模拟数据，实际使用时需要集成真实的API接口
2. **图片处理**: 行驶证图片需要从后端API获取
3. **权限控制**: 根据实际业务需求添加相应的权限控制
4. **错误处理**: 需要添加网络请求失败等异常情况的处理

## 后续优化

1. 添加车辆信息编辑功能
2. 集成真实的API接口
3. 添加图片压缩和上传进度
4. 优化页面加载性能
5. 添加更多的车辆信息字段