因为工作需要,每天需要打很多次卡,然后忙起来就忘了,忙完了就会想,刚才打卡了吗?弄错就会漏打卡了,漏打卡会有处罚。就想到写一个程序来解决这个痛点。就有了本次发布的这个程序。
PHP项目,修改起来也简单,也方便二开。本来就是H5页面布局,部署好,直接手机浏览器打开,或者使用封装工具,封装成apk。本人已打包为微信小程序,使用起来很方便。
项目简介
本项目是一个多用户打卡记录系统,基于 PHP + MySQL 开发,提供简洁的用户打卡功能和记录管理。
核心功能
功能模块 描述
用户认证 支持用户注册、登录、密码修改、密码重置
打卡功能 用户可进行每日打卡,记录打卡时间
记录查询 支持按日期查询打卡记录
用户管理 支持头像上传、个人信息查看
数据统计 提供打卡统计功能
技术特点
轻量级架构:纯 PHP 开发,无需框架依赖,部署简单
响应式设计:移动端友好的 UI 界面,支持触摸操作
安全性:
使用 prepare + bind_param 防止 SQL 注入
密码采用哈希加密存储
Session 会话管理用户状态
模块化设计:API 接口与前端分离,便于扩展
项目结构
Plain Text
├── api/ # RESTful API 接口
│ ├── checkin.php # 打卡接口
│ ├── login.php # 登录接口
│ ├── register.php # 注册接口
│ ├── records.php # 记录查询接口
│ ├── stats.php # 统计接口
│ └── ...
├── config/ # 配置文件
│ ├── database.php # 数据库配置
│ └── auth.php # 认证配置
├── sql/ # 数据库脚本
│ └── init.sql # 初始化脚本
├── avatars/ # 头像存储目录
├── index.php # 首页(打卡页面)
├── records.php # 记录查询页面
├── profile.php # 用户中心
└── install.php # 数据库安装页面
数据库设计
users 表:存储用户信息(用户名、密码、邮箱、手机号、头像)
checkin_records 表:存储打卡记录(用户ID、打卡时间、照片路径)
使用方式
访问 install.php 初始化数据库
注册账号并登录
在首页点击"立即打卡"按钮完成打卡
通过底部导航查看打卡记录和个人信息
下面是部分源码:
[PHP] 纯文本查看 复制代码 <?php
session_start();
?>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>打卡记录</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
background: linear-gradient(135deg, #fff5f0 0%, #ffa76e 50%, #ff8c42 100%);
min-height: 100vh;
height: 100vh;
display: flex;
flex-direction: column;
overflow: hidden;
}
html {
height: 100%;
}
.header {
padding: 40px 20px 20px 20px;
text-align: center;
color: white;
flex-shrink: 0;
}
.header h1 {
font-size: 24px;
font-weight: 600;
}
.header p {
font-size: 14px;
margin-top: 8px;
opacity: 0.9;
}
.main-content {
flex: 1;
position: relative;
overflow: visible;
}
下面是手机h5页面展示:
部署方法:
本人使用的nas上安装的宝塔面板部署的后端,部署方法参考我另外一篇帖子:会员管理系统php+Nginx+mysql版以及部署步骤
https://www.52pojie.cn/thread-2110457-1-1.html
(出处: 吾爱破解论坛)
|