💊 微信付费医患系统

🏥 基于微信端的医患在线咨询与支付系统

📱 在线预览

---

📋 项目简介

这是一个微信端 H5 页面项目，提供完整的医患在线咨询和支付功能。患者可以通过微信浏览医生信息、发起咨询、确认订单并完成支付，实现便捷的线上医疗服务。

✨ 核心功能

👨‍⚕️ 医生模块

• 🔍 医生列表 - 浏览所有可咨询医生
• 📄 医生详情 - 查看医生专长、简介、出诊时间
• 🎯 医生筛选 - 按科室、职称等条件筛选

💬 咨询模块

• 📝 发起咨询 - 填写病情描述，选择咨询方式
• 📋 确认订单 - 核对咨询信息和费用
• 💾 草稿保存 - 未完成的咨询可保存为草稿

📦 订单模块

• 📊 订单列表 - 查看所有咨询订单
• 🔎 订单详情 - 查看订单状态和详细信息
• ⏳ 待支付订单 - 管理待支付的咨询订单
• ✅ 已完成订单 - 查看已完成的咨询记录
• 💡 订单提示 - 订单状态变更提醒

👤 个人中心

• 🧑 个人信息 - 查看和编辑个人资料
• 🖼️ 头像管理 - 上传和更换头像
• ℹ️ 关于页面 - 应用信息和版本说明

📝 草稿箱

• 💾 草稿列表 - 管理所有保存的咨询草稿
• ✏️ 继续编辑 - 从草稿继续完成咨询

🗂️ 项目结构

📦 comm/
├── 👨‍⚕️ doctor/          # 医生模块
│   ├── doctorList.html      # 医生列表页
│   ├── doctorDetail.html    # 医生详情页
│   ├── doctorMenu.html      # 医生菜单页
│   └── resources/           # 资源文件
│       ├── css/            # 样式文件
│       ├── js/             # 脚本文件
│       ├── img/            # 图片资源
│       └── json/           # 数据接口
│
├── 💬 consult/         # 咨询模块
│   ├── consult.html         # 咨询页面
│   ├── firmOrder.html       # 确认订单页
│   └── resources/           # 资源文件
│       ├── css/
│       ├── js/
│       ├── img/
│       └── json/
│
├── 📦 order/           # 订单模块
│   ├── orderList.html       # 订单列表页
│   ├── orderDetail.html     # 订单详情页
│   ├── orderInPayment.html  # 待支付订单页
│   ├── orderDone.html       # 已完成订单页
│   ├── orderTips.html       # 订单提示页
│   └── resources/           # 资源文件
│
├── 👤 personal/        # 个人中心模块
│   ├── personal.html        # 个人中心页
│   ├── personalEdit.html    # 编辑资料页
│   ├── img.html            # 头像管理页
│   ├── about.html          # 关于页面
│   └── resources/           # 资源文件
│
└── 📝 draft/           # 草稿箱模块
    ├── draftList.html       # 草稿列表页
    └── resources/           # 资源文件

🛠️ 技术栈

• 📱 前端框架: 原生 HTML5 + CSS3 + JavaScript
• 🎨 UI 交互: 自定义 CSS 动画和 Ripple 效果
• 🔄 数据交互: JSON 数据格式
• 💳 支付集成: 微信支付
• 📲 运行环境: 微信浏览器

🚀 快速开始

环境要求

• 🌐 Web 服务器（如 Nginx、Apache）
• 📱 微信开发者工具（用于调试）
• 🔑 微信公众号配置

本地运行

1. 克隆项目

   git clone <repository-url>

2. 部署到 Web 服务器

   # 将项目文件放置到 Web 服务器目录
   cp -r comm/ /var/www/html/

3. 配置微信参数

   • 修改相关 JS 文件中的微信公众号配置
   • 配置微信支付参数

4. 访问应用

   • 在微信中打开项目 URL
   • 或使用微信开发者工具调试

📝 开发说明

目录规范

每个模块都遵循统一的目录结构：

• *.html - 页面文件
• resources/css/ - 样式文件
• resources/js/ - 脚本文件
• resources/img/ - 图片资源
• resources/json/ - 模拟数据接口

命名规范

• 文件名使用驼峰命名法
• CSS 类名使用小写字母和连字符
• JavaScript 变量使用驼峰命名法

🤝 贡献指南

欢迎提交 Issue 和 Pull Request 来改进项目！

📄 许可证

本项目仅供学习和参考使用。

---

💡 如有问题或建议，欢迎提出 Issue

Made with ❤️ for better healthcare experience