# 考勤管理系统

**Repository Path**: Ppwindf/attendance-management

## Basic Information

- **Project Name**: 考勤管理系统
- **Description**: Vue框架项目练习
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-11-22
- **Last Updated**: 2025-11-22

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

## 项目模块功能详述

### 1. 登录模块 (`src/views/login/`)
- 功能：用户身份验证
- 特性：
  - 账号密码登录（使用 Vant 表单组件）
  - 表单校验（账号、密码必填）
  - 登录成功后保存 token 到 localStorage
  - 自动跳转到首页
  - 页面加载时清空 localStorage
  - 背景图片与响应式布局

### 2. 路由模块 (`src/router/`)
- 路由配置：
  - `/` - 登录页
  - `/home` - 首页（打卡页面）
- 路由守卫 (`guards/index.js`)：
  - 自动设置页面标题（格式：`路由标题 | 智能考勤管理系统`）
  - Token 验证：访问非登录页时检查 token，无 token 则跳转登录
  - 登录页访问控制：已登录用户访问登录页时允许通过

### 3. API 请求模块 (`src/api/`)
- HTTP 封装 (`utils/http.js`)：
  - 封装 GET/POST 方法
- 请求拦截器 (`utils/request.js`)：
  - 自动添加 token 到请求头
  - 开发环境代理（`/api` -> `http://localhost:8088`）
  - 统一错误处理（使用 Vant Notify 提示）
  - Token 失效自动跳转登录（code 999 或 401）
  - 请求超时 10 秒
- 登录接口 (`login.js`)：
  - `logIn()` - 用户登录
  - `getUserInfo()` - 获取用户信息
  - `publicUpload()` - 上传个人信息（支持文件上传）

### 4. 工具模块 (`src/utils/`)
- 百度定位 (`baiduLocation.js`)：
  - 动态加载百度地图 API
  - 支持回调函数获取 BMap 对象
  - 用于考勤位置验证
- JS Bridge (`JSbridge.js`)：
  - 支持 Android/iOS 与原生 App 通信
  - 提供 `callHandler()`（JS 调用原生方法）
  - 提供 `registerHandler()`（原生调用 JS 方法）
  - 自动识别平台类型并初始化

### 5. 首页模块 (`src/views/home/`)
- 当前状态：基础框架（显示“打卡页面”）
- 资源准备：包含多个图标（如：打卡、请假、统计、我的等），功能待实现

### 6. 人脸识别模块 (`src/views/faceRecognition/`)
- 当前状态：目录存在，包含 AI 相关图片资源，功能待实现

### 7. 全局配置模块
- 主入口 (`main.js`)：
  - 初始化 Vue 3 应用
  - 注册 Vant UI 组件库
  - 注册路由
  - 全局注册 JS Bridge
- 根组件 (`App.vue`)：
  - 路由视图容器
  - 引入全局样式
- 样式系统 (`style/index.scss`)：
  - CSS 重置样式
  - 统一字体设置（PingFang SC）

### 8. 构建配置模块
- Vue 配置 (`vue.config.js`)：
  - 开发服务器代理配置
  - 生产环境路径配置
- PostCSS 配置 (`postcss.config.js`)：
  - 移动端适配（px 转 vw）
- Babel 配置 (`babel.config.js`)：
  - JavaScript 转译配置

### 技术栈总结
- 框架：Vue 3 + Vue Router 4
- UI 库：Vant 3
- HTTP：Axios
- 地图：百度地图 API
- 样式：SCSS + PostCSS（移动端适配）
- 图表：ECharts（已安装，待使用）
- 日期：Day.js
- 跨平台：JS Bridge（支持 Android/iOS 原生通信）

### 项目特点
1. 移动端优先：使用 Vant 组件库和移动端适配方案
2. 原生 App 集成：通过 JS Bridge 与原生交互
3. 位置验证：集成百度地图用于考勤定位
4. 安全机制：Token 认证与路由守卫
5. 扩展性：预留人脸识别、统计等功能模块

项目目前处于基础框架阶段，登录与路由已实现，核心考勤功能（打卡、人脸识别、统计等）待完善。