Skip to content

MrSeaWave/holidays-web

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

17 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

🎯 智能休假方案计算器

📋 功能简介

这是一个基于中国节假日政策的智能休假方案计算器,能够根据用户设定的参数和约束条件,自动推荐最佳的休假方案。采用现代化的React技术栈,提供直观的可视化界面和智能算法优化。

✨ 主要特性

🎯 核心功能

  • 🤖 智能计算最佳休假方案 - 多种算法策略,自动推荐最优方案
  • 📅 中国节假日政策支持 - 准确识别法定节假日和调休安排
  • ⚙️ 多种约束条件设置 - 灵活的休假规则配置
  • 🏆 实时方案评分和排序 - 智能评分系统,方案优劣一目了然
  • 📊 连续休假天数统计 - 自动计算最长连续假期天数
  • 🚫 连续休假天数限制 - 支持设置最大连续休假天数约束

🎨 界面特色

  • 🌈 现代化响应式设计 - 适配各种屏幕尺寸
  • 🎭 渐变色彩搭配 - 美观的视觉体验
  • 🎪 平滑动画效果 - 流畅的交互动画
  • 🌙 深色主题适配 - 支持系统主题自动切换
  • 📱 移动端优化 - 触摸友好的移动端体验
  • 📅 Mac风格年视图日历 - 直观的可视化日历展示
  • 🔄 多方案切换对比 - 支持多个方案的实时对比

🚀 用户体验优化

  • ⚡ 防抖技术 - 避免频繁计算,提升性能
  • ✅ 实时表单验证 - 智能提示,减少用户输入错误
  • 🔍 智能提示系统 - 详细的功能说明和使用指导
  • ⚠️ 友好的错误处理 - 清晰的错误提示和解决建议
  • 🎯 一键删除确认 - 防止误操作的安全措施

📖 使用指南

🔧 基础设置

1. 📅 日期范围

  • 选择计划休假的起始和结束日期
  • 支持的日期范围:当前日期至未来1年内
  • 自动验证日期有效性

2. 📊 休假天数

  • 设定总共需要休假的天数
  • 支持范围:1-30天
  • 实时计算休假效率

⚙️ 约束条件设置

1. 🚫 不可休假日期

  • 指定特定日期不能休假
  • 支持批量添加和删除
  • 可视化标记在日历中

2. 📋 强制休假区间

  • 在指定时间段内必须休满一定天数
  • 支持多个区间同时设置
  • 灵活的天数要求配置

3. 🔒 连续休假天数限制

  • 设置最大连续休假天数
  • 支持0-15天的范围设置
  • 0表示不允许连续休假
  • 留空表示不限制

🎮 操作流程

  1. 📝 设置基础参数 - 日期范围和休假天数
  2. ⚙️ 配置约束条件 - 根据需要添加限制条件
  3. 🔄 点击计算方案 - 系统自动生成最佳方案
  4. 📊 查看推荐结果 - 对比不同方案的优劣
  5. 📅 日历视图确认 - 通过可视化界面最终确认

📈 结果说明

📊 统计信息

  • 📅 总工作日 - 日期范围内的工作日数量
  • 🎉 总节假日 - 国家法定节假日数量
  • 🏖️ 总周末 - 周末休息日数量
  • 🌴 计划休假 - 设定的休假天数

🏆 方案推荐

  • 🥇 智能排序 - 按评分从高到低排列
  • 💯 评分机制 - 综合考虑连续性、节假日连接等因素
  • ⭐ 最佳方案 - 金色标识的推荐方案
  • 📋 详细信息 - 显示具体日期、连续天数、安排描述

📅 可视化日历

  • 🎨 直观展示 - 清晰的日历形式显示休假安排
  • 🌈 颜色标识 - 不同颜色区分各类日期
  • 🔄 方案切换 - 支持在多个方案之间切换对比
  • 🏷️ 日期标记 - 特殊日期显示对应的标识符号

🧮 智能算法

🎯 核心评分规则

  • 📅 基础休假日得分 - 每个休假日基础分数
  • 🔗 连续休假奖励 - 连续假期的额外奖励
  • 🎉 节假日连接奖励 - 与国家法定节假日相邻的高分奖励
  • 🏖️ 周末连接奖励 - 与周末连接的合理奖励
  • ⚡ 效率系数 - 总假期天数与实际休假天数的比值

🤖 智能策略算法

  1. 🏅 节假日连接优先策略 - 优先与节假日连接获取长假
  2. 🎯 周末连接策略 - 智能连接周末获取最优休假体验
  3. 💡 效率优化策略 - 寻找最高效的休假组合
  4. 🔗 节假日桥接策略 - 桥接不同节假日形成超长假期
  5. 📈 贪心算法 - 快速找到局部最优解

🔒 约束验证

  • 🚫 严格遵守不可休假日期 - 确保合规性
  • ✅ 强制休假区间验证 - 满足必要的休假要求
  • 🔒 连续休假天数限制 - 控制连续休假长度
  • 🎯 自动过滤不符合条件的方案 - 确保所有方案都可行

🎨 界面功能详解

🌈 日历颜色说明

  • 🔴 红色边框 - 计划休假日期,右上角显示"休"字标记
  • 🟠 橙色边框 - 不可休假日期,右上角显示"禁"字标记
  • 🔵 蓝色背景 - 周末休息日
  • 🟢 绿色背景 - 选择的日期范围
  • 🟣 紫色背景 - 节假日,右上角显示"假"字标记
  • 🔵 蓝色标记 - 周末上班(调休),右上角显示"班"字标记
  • 🔵 蓝色边框 - 今天的日期标记
  • 🌫️ 半透明 - 超出选择范围的日期

🎮 交互功能

  • 📅 年份切换 - 支持查看不同年份的日历
  • 🔄 方案切换 - 多个方案时可通过下拉选择器切换查看
  • 🖱️ 悬停效果 - 鼠标悬停显示详细信息和动画效果
  • 📖 图例说明 - 日历上方提供完整的颜色图例说明
  • 🎯 删除确认 - 重要操作前的确认提示

🎛️ 参数配置优化

  • ✅ 实时验证 - 表单输入实时验证,及时提示错误
  • 🔍 智能提示 - Tooltip提示详细说明功能用途
  • ⚡ 防抖计算 - 300ms防抖延迟,避免频繁计算
  • 📊 状态管理 - 智能的加载状态和错误状态处理

🛠️ 技术实现

🎯 前端技术栈

  • ⚛️ React 18 + TypeScript - 现代化的前端框架
  • 🎨 Ant Design - 企业级UI组件库
  • 🎭 SCSS - 强大的CSS预处理器
  • 🎪 classnames - 动态类名管理
  • 📅 dayjs - 轻量级日期处理库
  • 🔧 ahooks - 高质量的React Hooks库

🧠 核心算法库

  • 🎯 智能休假方案计算 - 多策略算法引擎
  • 📅 中国节假日识别 - 基于@swjs/chinese-holidays
  • 🔒 约束条件验证 - 复杂规则验证系统
  • 📊 方案评分排序 - 智能评分算法

🎨 组件架构

  • 🎯 主页面组件 - VacationPlannerPage
  • 📝 参数表单组件 - ParameterForm
  • 📊 统计信息组件 - StatisticsCard
  • 🏆 推荐方案组件 - RecommendationCard
  • 🔒 约束条件组件 - ConstraintsCard
  • 📅 年视图日历组件 - YearCalendar
  • 🎯 方案状态图标 - PlanStatusIcon

⚡ 性能优化

  • 🔄 防抖技术 - 避免频繁计算请求
  • 🧠 智能缓存 - 节假日数据缓存机制
  • 📱 组件懒加载 - 按需加载提升性能
  • 🎯 React.memo - 减少不必要的重渲染
  • 🔧 useMemo/useCallback - 优化计算和事件处理

📝 使用示例

🚀 快速开始

🎯 简单场景

📅 日期范围:2024-05-01 至 2024-05-31
🌴 休假天数:5天
🎯 约束条件:无
📊 预期结果:自动推荐最佳5天休假方案

🔧 复杂场景

📅 日期范围:2024-07-01 至 2024-12-31
🌴 休假天数:15天
🚫 不可休假:2024-08-15(重要会议)
📋 强制休假:2024-10-01至2024-10-07必须休3天
🔒 连续限制:最多连续休假5天
📊 预期结果:在复杂约束下找到最优方案

🎨 高级功能示例

🎯 节假日连接策略

// 推荐与国庆节连接的休假方案
日期范围: 2024-09-01  2024-10-31
休假天数: 8
算法会优先推荐与国庆假期连接的方案,
形成超长假期获得更高的休假效率。

🔒 连续休假限制

// 公司政策不允许连续休假超过3天
连续休假限制: 3
算法会自动分散休假日期,
确保没有连续超过3天的休假安排。

📊 评分系统示例

🏆 高分方案特征

  • 🎉 节假日连接 - 与法定节假日紧密连接
  • 🏖️ 周末桥接 - 巧妙利用周末形成长假
  • ⚡ 高效率比 - 少量休假获得大量假期
  • 🔗 连续性良好 - 形成有意义的连续假期

📉 低分方案特征

  • 🔀 分散零碎 - 休假日期过于分散
  • ❌ 孤立日期 - 单独的休假日缺乏连接
  • ⚠️ 违反约束 - 不符合设定的约束条件
  • 📉 效率低下 - 休假天数多但总假期少

⚠️ 注意事项

🔒 使用限制

  1. 📅 日期范围限制 - 只能选择当前日期之后的时间,最长不超过1年
  2. ⚙️ 约束条件验证 - 确保各约束条件之间不产生冲突
  3. ⚡ 性能考虑 - 大范围或复杂约束的计算可能需要较长时间
  4. 🌐 浏览器兼容 - 建议使用Chrome、Firefox、Safari等现代浏览器

📱 设备适配

  • 🖥️ 桌面端 - 完整功能体验,推荐使用
  • 📱 移动端 - 基础功能支持,部分高级功能可能受限
  • 📟 平板端 - 良好的触摸体验,功能完整

🔧 数据说明

  • 📅 节假日数据 - 基于国家官方发布的节假日安排
  • 🔄 调休数据 - 自动处理工作日调休和周末上班
  • ⚡ 实时更新 - 数据会根据年份自动更新

🐛 故障排除

❓ 常见问题

Q: 为什么没有找到合适的方案? A: 可能的原因包括:

  • 约束条件过于严格,尝试调整休假天数
  • 日期范围内可选工作日不足
  • 连续休假限制过于严格
  • 建议逐步放宽约束条件后重试

Q: 如何理解评分机制? A: 评分系统综合考虑多个因素:

  • 基础分数:每个休假日的基础分值
  • 连续性奖励:连续休假的额外奖励
  • 节假日连接:与法定节假日连接的高分奖励
  • 周末连接:与周末连接的合理奖励
  • 效率系数:总假期天数与休假天数的比值

Q: 支持哪些节假日? A: 完整支持中国大陆法定节假日:

  • 🧧 春节(农历新年)
  • 🌸 清明节
  • 🎉 五一劳动节
  • 🐲 端午节
  • 🌕 中秋节
  • 🎯 国庆节
  • 🎊 元旦节

Q: 如何处理调休安排? A: 系统自动处理调休政策:

  • 周末上班日按工作日处理
  • 平时调休日按休息日处理
  • 基于@swjs/chinese-holidays库的准确数据

Q: 页面加载缓慢或计算时间长? A: 优化建议:

  • 适当缩小日期范围
  • 简化约束条件
  • 减少休假天数进行测试
  • 检查网络连接状态

📊 更新日志

🚀 v2.0.0 - 重大更新

  • ✨ 新增连续休假天数限制功能 - 灵活控制连续休假长度
  • ⚡ 防抖技术优化 - 300ms防抖延迟,提升用户体验
  • 🎨 组件化重构 - 拆分为多个独立组件,提高可维护性
  • 🔍 智能表单验证 - 实时验证,减少用户输入错误
  • 🎯 增强错误处理 - 详细的错误提示和解决建议
  • 🎪 UI/UX大幅提升 - 更现代化的界面设计和交互体验

🎯 v1.2.0 - 功能增强

  • 🤖 智能算法升级 - 新增多种休假选择策略
  • 🏆 节假日连接优化 - 优化与节假日的连接策略
  • 🏖️ 周末连接策略 - 智能周末连接算法
  • 📊 评分系统改进 - 更精确的方案评分机制

📅 v1.1.0 - 日历功能

  • ✨ 新增Mac风格年视图日历 - 美观的可视化展示
  • 🎨 可视化假期安排展示 - 直观的日历标记
  • 🔄 支持多方案切换对比 - 实时方案对比功能
  • 📅 日历中的日期类型标识 - 清晰的颜色标识系统
  • 🎯 交互式操作 - 流畅的用户交互体验
  • 📖 完善的图例说明 - 详细的功能说明

🎨 v1.0.0 - 基础版本

  • 🎯 基础功能实现 - 核心算法和计算逻辑
  • 🎨 UI界面完成 - 现代化的用户界面
  • ⚙️ 约束条件支持 - 灵活的约束条件设置
  • 📊 示例功能完善 - 丰富的使用示例

🎯 开发团队

基于React + TypeScript + Ant Design构建的现代化Web应用,致力于为用户提供最佳的休假规划体验。

🚀 快速体验

立即访问应用,开始您的智能休假规划之旅!


💡 提示:本应用完全基于客户端运行,不会上传您的任何个人信息,请放心使用。

About

基于中国节假日政策,智能推荐最佳休假方案,支持多种约束条件设置

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published