# MED-Uni

**Repository Path**: codesdev/med-uni

## Basic Information

- **Project Name**: MED-Uni
- **Description**: 云医通uniapp
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-08-12
- **Last Updated**: 2025-08-24

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 医疗预约小程序

这是一个基于 uniapp 开发的医院线上预约挂号和线上门诊的微信小程序。

## 功能特性

### 医生选择页面 (`pages/appointment/doctor-select.vue`)

该页面实现了完整的医生选择功能，包括：

#### 1. 号源选择功能
- **未来一周号源展示**：显示今天到下周一的号源情况
- **日期选择器**：可横向滚动的日期选择条
- **号源状态**：每个日期显示"有号"或"无号"状态
- **全部号源**：一键查看所有可用号源

#### 2. 医生信息展示
- **医生头像**：圆形头像展示
- **基本信息**：姓名、职称、科室
- **专业信息**：亚专业、擅长领域
- **号源状态**：实时显示是否有号

#### 3. 筛选功能
- **仅显示有号**：开关控制是否只显示有号的医生
- **日期筛选**：选择特定日期查看该日排班的医生
- **智能过滤**：根据选择条件动态过滤医生列表

#### 4. 操作功能
- **在线门诊**：跳转到在线问诊页面
- **预约挂号**：跳转到时间选择页面
- **分页导航**：支持分页浏览更多医生

## 技术实现

### 前端技术栈
- **框架**：Vue 3 + TypeScript
- **UI组件**：Vant Weapp
- **状态管理**：Pinia
- **开发工具**：uniapp

### 数据结构

#### 医生信息接口
```typescript
interface Doctor {
  id: number
  name: string
  title: string
  department: string
  subSpecialty: string
  expertise: string
  avatar: string
  available: boolean
  schedule: Record<string, boolean> // 日期对应的排班情况
}
```

#### 日期信息接口
```typescript
interface WeekDate {
  key: string
  day: string
  date: string
  hasSlots: boolean
}
```

### 核心功能

#### 智能过滤算法
```typescript
const filteredDoctors = computed(() => {
  let result = doctors.value
  
  // 根据选择的日期过滤
  if (selectedDate.value !== 'all') {
    result = result.filter((doctor: Doctor) => doctor.schedule[selectedDate.value])
  }
  
  // 根据筛选条件过滤
  if (onlyShowAvailable.value) {
    result = result.filter((doctor: Doctor) => doctor.available)
  }
  
  return result
})
```

## 页面样式

### 设计特点
- **响应式布局**：适配不同屏幕尺寸
- **现代化UI**：采用卡片式设计，层次分明
- **交互友好**：点击反馈、状态变化等用户体验优化
- **色彩搭配**：使用医疗行业常用的绿色主题色

### 样式结构
- 顶部导航栏（固定定位）
- 号源选择区域（横向滚动）
- 筛选控制区域
- 医生列表（卡片式布局）
- 底部分页导航

## 使用方法

### 1. 页面跳转
```typescript
// 从科室选择页面跳转
uni.navigateTo({
  url: `/pages/appointment/doctor-select?departmentId=${deptId}&departmentName=${deptName}`
})
```

### 2. 参数传递
- `departmentId`：科室ID
- `departmentName`：科室名称

### 3. 返回数据
页面会跳转到相应功能页面：
- 在线门诊：`/pages/online-consultation/info`
- 预约挂号：`/pages/appointment/time-select`

## 开发说明

### 环境要求
- Node.js 16+
- uniapp CLI
- 微信开发者工具

### 安装依赖
```bash
npm install
```

### 运行项目
```bash
# 开发模式
npm run dev:mp-weixin

# 构建生产版本
npm run build:mp-weixin
```

## 注意事项

1. **图片资源**：确保 `/static/logo.png` 文件存在
2. **页面路由**：确保相关页面已在 `pages.json` 中配置
3. **组件依赖**：确保 Vant 组件库已正确引入
4. **类型支持**：项目使用 TypeScript，需要正确配置类型声明

## 更新日志

### v1.0.0 (2024-08-12)
- 实现完整的医生选择页面
- 支持未来一周号源查看
- 集成筛选和过滤功能
- 优化用户交互体验