企业官网建设流程全解析

莱阳网站建设,百度推广的优化软件,信息门户登录入口,网站建设和实现在中小企业的日常管理中#xff0c;考勤和午餐统计往往是一件琐碎但必须处理好的小事。市面上的SaaS软件要么功能过于臃肿#xff0c;要么价格昂贵#xff1b;而纯手工的Excel记录又容易出错且难以协同。 C:\myApp\attendance-enterprise 本文将详细复盘如何使用 Node.js S…在中小企业的日常管理中考勤和午餐统计往往是一件琐碎但必须处理好的小事。市面上的SaaS软件要么功能过于臃肿要么价格昂贵而纯手工的Excel记录又容易出错且难以协同。C:\myApp\attendance-enterprise本文将详细复盘如何使用Node.js SQLite 原生前端技术从零开始构建一个轻量、实用且具备高度定制化如客饭统计、多Sheet导出、日历设置的考勤系统。一、 背景 (Background)最初的需求很明确一个Web端的应用程序能够管理员工信息记录每日上下班时间统计订饭人数含客饭并支持周视图录入和Excel月度报表导出。但在开发过程中我们遇到了几个典型的业务挑战数据准确性如何避免考勤和订饭数据在联合查询时出现“笛卡尔积”导致的统计翻倍交互体验HR习惯按周批量补录如何提供直观的“周矩阵”视图并自动高亮周末和节假日时区陷阱如何确保周视图中的日期在不同浏览器中永远显示正确不会因为UTC时差导致“周日变周六”二、 目标 (Goal)我们将构建一个包含以下核心模块的单页应用SPA风格Dashboard实时概览出勤率、订饭总数、下个假期提示。每日考勤支持开关式打卡实时计算“员工餐客饭”总数。周考勤录入矩阵式表格支持批量勾选自动识别并高亮粉色周末与节假日。报表统计支持自定义日期范围导出包含“汇总”与“明细”双Sheet的Excel文件。系统设置员工管理以及可视化日历形式的节假日配置。三、 方法 (Method)为了保证部署简单无需安装MySQL等大型数据库且开发迅速我们选用了以下技术栈Runtime: Node.jsWeb Framework: Express.jsDatabase: SQLite3 (文件型数据库零配置极易迁移)Excel Engine:node-xlsxFrontend: 原生 HTML5 CSS3 Vanilla JavaScript (无构建工具修改即生效)四、 过程 (Process)1. 数据库设计与迭代最初的设计较为简单但在处理“客饭”和“节假日”时进行了迭代users: 基础员工表。attendance: 记录clock_in,clock_out。meals: 记录员工个人的订饭状态。holidays: 存储节假日日期。daily_extras(新增): 专门用于存储每日手动的“客饭/额外份数”与员工个人数据解耦。2. 攻克统计报表的“笛卡尔积”难题在早期版本中我们尝试直接LEFT JOIN考勤表和订饭表结果发现如果某人同一天有多条记录异常数据统计结果会成倍增加。解决方案采用子查询 (Subqueries)。/* 优化后的 SQL 逻辑 */SELECTu.id,u.name,(SELECTCOUNT(*)FROMattendance aWHEREa.user_idu.id...ANDa.clock_inISNOTNULL)asdays_worked,(SELECTCOUNT(*)FROMmeals mWHEREm.user_idu.id...ANDm.taken1)asmeals_countFROMusers u这样确保了考勤和订饭的计数互不干扰绝对准确。3. 周视图日期偏差与视觉优化这是前端逻辑最复杂的模块。时区问题直接使用date.toISOString()会导致在中国时区UTC8的周日早上被转换为前一天的日期。修正放弃 UTC 方法使用本地时间拼接YYYY-MM-DD字符串。视觉反馈HR 需要一眼看出哪些天是休息日。逻辑视觉优先级 今天(蓝) 节假日(粉) 周末(粉) 工作日(白)。我们在后端返回holidays数组前端weekly.js在渲染每一列时进行比对匹配。4. 导出功能的深度定制单一的汇总表无法满足财务核对需求。我们利用node-xlsx构建了多 Sheet 输出Sheet 1 汇总姓名、部门、总天数、总饭数。Sheet 2 明细日期、姓名、打卡时间、是否订饭。5. 设置页面的交互升级最初的节假日设置是枯燥的列表。为了提升体验我们手写了一个JS 日历组件支持月份切换。点击日期即可“增加/删除”节假日。日历格子与周视图保持一致的视觉语言休息日显示粉红背景。五、 结果 (Result)经过数次迭代系统达到了生产可用标准首页 (Dashboard)清晰展示今日核心指标。每日操作加入了“客饭”输入框系统会自动计算员工勾选数 手动输入数 总订饭数数据实时入库。周考勤界面直观周六日及设定的“春节”等假期背景自动变粉防止误操作。Excel 报表一键导出标准格式文件不仅有统计数据还有每日明细供查账。