# 预约系统排班检查功能

## 功能说明

只有医生有排班的日期才会显示在日期选择器中，确保患者只能预约有排班的时间。

## 实现逻辑

### 1. 选择医生时
- 自动查询该医生未来7天的排班信息
- 只显示有排班（status=1）的日期
- 如果医生没有排班，显示"该医生暂无排班"提示

### 2. 日期选择
- 只显示医生有排班的日期按钮
- 自动选择第一个有排班的日期
- 日期按钮显示格式：MM月DD日 (星期X)

### 3. 时间段显示
- 选择日期后，显示该日期的所有时间段（9:00-18:00，每15分钟）
- 已被预约的时间段显示为灰色"已约"
- 可预约的时间段显示为白色"可约"

## 前端修改

### appointment.vue

#### 新增状态
```typescript
const doctorRosterDates = ref<string[]>([])  // 医生有排班的日期列表
```

#### 修改的函数

1. **dateOptions** (computed)
   - 从固定生成7天改为根据排班数据生成
   - 只返回有排班的日期

2. **handleDoctorChange**
   - 选择医生时调用 `loadDoctorRoster()`
   - 重置日期和时间段选择

3. **loadDoctorRoster** (新增)
   - 查询医生未来7天的排班
   - 提取有排班的日期列表
   - 自动选择第一个有排班的日期

4. **open**
   - 移除自动选择今天的逻辑
   - 等待用户选择医生后再加载排班

#### 模板修改
```vue
<!-- 未选择医生 -->
<el-empty v-if="!selectedDoctorId" description="请先选择医生" />

<!-- 医生无排班 -->
<el-empty v-else-if="selectedDoctorId && doctorRosterDates.length === 0" 
  description="该医生暂无排班" />

<!-- 有排班时显示日期和时间段 -->
<template v-else>
  <!-- 日期选择器 -->
  <!-- 时间段网格 -->
</template>
```

## 后端支持

### RosterLists.php
已支持以下查询参数：
- `doctor_id`: 医生ID
- `start_date`: 开始日期
- `end_date`: 结束日期
- `status`: 排班状态（1=出诊）

### API 调用示例
```typescript
const res = await rosterLists({
  doctor_id: 3,
  start_date: '2026-03-03',
  end_date: '2026-03-09',
  status: 1
})
```

## 用户体验流程

1. 打开预约界面
2. 显示"请先选择医生"提示
3. 选择医生后：
   - 如果医生有排班：显示有排班的日期按钮
   - 如果医生无排班：显示"该医生暂无排班"
4. 选择日期后，显示该日期的时间段
5. 选择可用时间段，填写备注，确认预约

## 注意事项

1. 排班查询范围：当前日期 + 未来6天（共7天）
2. 只显示状态为"出诊"（status=1）的排班
3. 日期按升序排列
4. 自动去重（同一天可能有上午和下午两个排班）
5. 时间段生成不再依赖排班的 period 字段，统一生成 9:00-18:00

## 数据库要求

确保已执行 `update_appointment_period.sql` 修改 period 字段：
```sql
ALTER TABLE `la_doctor_appointment` 
MODIFY COLUMN `period` varchar(20) NOT NULL DEFAULT 'all';
```