医院预约挂号小程序

基于 Taro 4.x + React + TypeScript 的医院预约挂号小程序，配套 Node.js + Express 后端 API。

功能概览

医院简介（轮播 Banner + 详细介绍 + 联系方式）
分栏展示：医院简介 / 科室设置 / 医院荣誉
预约挂号：选择科室 → 选择医生 → 选择日期时段 → 填写姓名电话
我的预约：查看列表 / 查看详情 / 取消预约
预约成功页与温馨提示

目录结构

.
├── src/                  # 小程序前端（Taro + React + TS）
│   ├── pages/            # 5 个页面（3 tabBar + 2 二级页）
│   ├── components/       # 通用组件
│   ├── services/         # API 请求封装
│   ├── store/            # Zustand 状态
│   ├── data/             # Mock 数据
│   ├── types/            # TS 类型定义
│   ├── styles/           # 全局样式
│   └── utils/            # 工具函数
├── server/               # Node.js 后端 API
│   ├── src/
│   │   ├── routes/       # 业务路由
│   │   ├── data.js       # Mock 数据
│   │   └── index.js      # 入口
│   ├── package.json
│   └── README.md
└── README.md

快速开始

1. 小程序预览

项目根目录已配置 Taro 模板，可直接通过 IDE 内的预览服务打开二维码，在微信开发者工具中扫码体验。

2. 启动后端

cd server
npm install
npm start
# 监听 http://localhost:3000

后端 API

详见 server/README.md。

主要接口：

GET /api/hospitals — 医院列表
GET /api/departments — 科室列表
GET /api/doctors?departmentId= — 医生列表
POST /api/appointments — 创建预约
GET /api/appointments?phone= — 我的预约
PUT /api/appointments/:id/cancel — 取消预约

小程序接入真实后端

修改 src/services/request.ts 中的 BASE_URL：

const BASE_URL = 'http://localhost:3000';

然后把 src/services/*.ts 中返回 mock 数据的函数改为调用 request()，并把 src/data/*.ts 删除即可完成对接。

技术栈

前端：Taro 4.1.9、React 18、TypeScript 5、Sass
后端：Node.js、Express 4、CORS

数据存储

当前为内存 Mock，重启服务后预约数据会清空。生产环境请替换为 MySQL / PostgreSQL / MongoDB 等持久化方案。

2.4 KiB Raw Blame History Unescape Escape