Skip to content

技术架构

系统概述

沐霖工时管理系统是一个基于 Java + Go 双引擎 的企业级工时管理平台,支持项目工时 tracking、审核流程、数据统计等核心功能。

系统采用前后端分离架构,前端基于 Vue 3 + Element Plus,后端提供 Go 和 Java 两套实现,确保系统的高可用性和可维护性。


技术栈

前端技术栈

技术版本说明
Vue3.5.16渐进式 JavaScript 框架
Vite6.3.5下一代前端构建工具
Element Plus2.9.9Vue 3 组件库
Vue Router4.5.1Vue 官方路由管理器
Pinia3.0.2Vue 官方状态管理库
Axios1.9.0HTTP 客户端
ECharts5.6.0可视化图表库
Sass1.89.1CSS 预处理器

核心依赖

  • @element-plus/icons-vue: 2.3.1 - Element Plus 图标库
  • vue-cropper: 1.1.1 - 图片裁剪组件
  • vuedraggable: 4.1.0 - 拖拽组件
  • moment: 2.30.1 - 日期处理库
  • jsencrypt: 3.3.2 - RSA 加密库

后端技术栈(Go 版本)

技术版本说明
Go1.21编程语言
Gin1.10.0Web 框架
GORM1.25.12ORM 框架
MySQL-关系型数据库
Redisv8.11.5缓存数据库
JWTv4.5.1身份认证

核心依赖

  • gin-gonic/gin: 1.10.0 - HTTP Web 框架
  • gorm.io/gorm: 1.25.12 - ORM 框架
  • gorm.io/driver/mysql: 1.5.7 - MySQL 驱动
  • go-redis/redis/v8: 8.11.5 - Redis 客户端
  • golang-jwt/jwt/v4: 4.5.1 - JWT 认证
  • xuri/excelize/v2: 2.8.0 - Excel 处理
  • robfig/cron/v3: 3.0.1 - 定时任务
  • mojocn/base64Captcha: 1.3.6 - 验证码

后端技术栈(Java 版本)

技术说明
Spring Boot应用框架
Spring Security安全框架
MyBatisORM 框架
MySQL关系型数据库
Redis缓存数据库
JWT身份认证

系统架构

整体架构

┌─────────────────────────────────────────────────────┐
│                   前端层 (Vue 3)                     │
│  ┌──────────┐  ┌──────────┐  ┌──────────┐          │
│  │ 工时管理 │  │ 项目管理 │  │ 数据统计 │  ...      │
│  └──────────┘  └──────────┘  └──────────┘          │
└─────────────────────────────────────────────────────┘
                        ↓ HTTP/HTTPS
┌─────────────────────────────────────────────────────┐
│              API 网关层 (Nginx)                      │
│         反向代理 / 负载均衡 / 静态资源                │
└─────────────────────────────────────────────────────┘

┌──────────────────┬──────────────────────────────────┐
│   Go 后端服务    │      Java 后端服务               │
│   (mulin-go)     │    (mulin-server)                │
│                  │                                  │
│  ┌────────────┐  │  ┌────────────┐                 │
│  │ Gin 路由   │  │  │ Controller │                 │
│  ├────────────┤  │  ├────────────┤                 │
│  │ 中间件     │  │  │ Service    │                 │
│  ├────────────┤  │  ├────────────┤                 │
│  │ Controller │  │  │ Mapper     │                 │
│  ├────────────┤  │  └────────────┘                 │
│  │ Service    │  │                                  │
│  ├────────────┤  │                                  │
│  │ DAO/GORM   │  │                                  │
│  └────────────┘  │                                  │
└──────────────────┴──────────────────────────────────┘

┌──────────────────┬──────────────────────────────────┐
│     MySQL        │          Redis                    │
│   (主数据库)     │      (缓存/会话)                  │
└──────────────────┴──────────────────────────────────┘

前端架构

mulin-ui/
├── src/
│   ├── api/              # API 接口层
│   │   ├── hour/         # 工时相关接口
│   │   ├── project/      # 项目相关接口
│   │   ├── task/         # 任务相关接口
│   │   └── system/       # 系统管理接口
│   ├── views/            # 页面组件
│   │   ├── hour/         # 工时管理页面
│   │   │   ├── week/     # 周报页面
│   │   │   └── review/   # 审核页面
│   │   ├── project/      # 项目管理页面
│   │   └── task/         # 任务管理页面
│   ├── components/       # 公共组件
│   ├── router/           # 路由配置
│   ├── store/            # 状态管理 (Pinia)
│   ├── utils/            # 工具函数
│   └── assets/           # 静态资源
├── vite.config.js        # Vite 配置
└── package.json          # 依赖配置

前端特色

  • 三种部署模式:
    • 独立部署 (dev)
    • 生产环境 (build:prod)
    • 嵌入式部署 (build:embedded)
  • 按需加载: 路由懒加载,提升首屏性能
  • 响应式设计: 适配多种屏幕尺寸

Go 后端架构

mulin-go/
├── main.go               # 应用入口
├── config/               # 配置文件
│   ├── config.go         # 配置加载
│   └── application.yaml  # 应用配置
├── framework/            # 框架层
│   ├── dal/              # 数据访问层
│   ├── middleware/       # 中间件
│   ├── router/           # 路由配置
│   ├── security/         # 安全模块
│   └── response/         # 统一响应
├── internal/             # 业务层
│   ├── mulin/            # 工时业务
│   │   ├── controller/   # 控制器
│   │   ├── service/      # 服务层
│   │   ├── dao/          # 数据访问
│   │   ├── dto/          # 数据传输对象
│   │   └── model/        # 数据模型
│   └── app/              # 应用模块
├── common/               # 公共模块
│   ├── captcha/          # 验证码
│   ├── notify/           # 通知服务
│   ├── upload/           # 文件上传
│   └── utils/            # 工具函数
└── logs/                 # 日志目录

Go 后端特色

  • Gin 框架: 高性能 HTTP 框架
  • GORM: 强大的 ORM 支持
  • 分层架构: Controller → Service → DAO
  • 中间件: JWT 认证、日志记录、CORS 等
  • 定时任务: cron 定时调度

数据库架构

MySQL 数据库

数据库: mulin_cost

核心表:
├── mh_project            # 项目表
├── mh_task               # 任务表
├── mh_hour               # 工时记录表
├── mh_hour_review        # 工时审核表
├── mh_user               # 用户表
├── mh_department         # 部门表
└── mh_dict               # 字典表

Redis 缓存

用途:
├── Session 存储         # 用户会话
├── Token 黑名单         # JWT Token 管理
├── 验证码缓存           # Captcha 存储
├── 配置缓存             # 系统配置
└── 分布式锁             # 并发控制

核心模块

1. 工时管理模块

功能:

  • 工时填报(普通工时/任务工时)
  • 工时审核(通过/驳回)
  • 周报/月报查看
  • 工时统计

技术实现:

  • 前端: views/hour/ 目录
  • 后端: internal/mulin/ 目录
  • 接口: RESTful API

2. 项目管理模块

功能:

  • 项目创建与配置
  • 项目成员管理
  • 项目状态跟踪
  • 项目工时统计

技术实现:

  • 前端: views/project/ 目录
  • 后端: internal/mulin/ 目录

3. 任务管理模块

功能:

  • 任务创建与分配
  • 任务状态管理
  • 任务工时统计
  • 任务日记

技术实现:

  • 前端: views/task/ 目录
  • 后端: internal/mulin/ 目录

4. 数据统计模块

功能:

  • 个人工时统计
  • 项目工时统计
  • 团队工时统计
  • 图表展示(ECharts)

技术实现:

  • 前端: ECharts 可视化
  • 后端: 聚合查询接口

安全机制

1. 身份认证

  • JWT Token: 无状态认证
  • Token 刷新: 自动续期机制
  • Token 黑名单: 注销管理

2. 权限控制

  • RBAC: 基于角色的访问控制
  • 菜单权限: 动态菜单加载
  • 按钮权限: 细粒度权限控制

3. 数据安全

  • 密码加密: bcrypt 加密存储
  • SQL 防护: GORM 参数化查询
  • XSS 防护: 输入过滤

4. 接口安全

  • CORS: 跨域资源共享
  • 限流: 接口频率限制
  • 验证码: 防止暴力破解

部署架构

1. 独立部署

前端 (Nginx) + 后端 (Go/Java) + MySQL + Redis

2. Docker 部署

yaml
services:
  frontend:     # 前端 Nginx
  backend:      # Go 后端
  mysql:        # MySQL 数据库
  redis:        # Redis 缓存

3. 嵌入式部署

单程序部署 (Go 二进制 + 嵌入式前端资源)

性能优化

前端优化

  • 路由懒加载: 按需加载页面
  • 组件懒加载: 动态导入组件
  • Gzip 压缩: 减少传输体积
  • CDN 加速: 静态资源加速

后端优化

  • 数据库索引: 查询优化
  • Redis 缓存: 热点数据缓存
  • 连接池: 数据库连接复用
  • 分页查询: 避免全表扫描

开发规范

前端规范

  • Vue 3 Composition API: 组合式 API
  • ESLint: 代码质量检查
  • Prettier: 代码格式化
  • 组件命名: PascalCase

后端规范

  • 分层架构: Controller → Service → DAO
  • 统一响应: 标准响应格式
  • 错误处理: 统一异常处理
  • 日志记录: 结构化日志

技术亮点

1. 双后端架构

  • Go 版本: 高性能、轻量级
  • Java 版本: 功能完善、生态丰富
  • 接口对齐: 统一的 API 规范

2. 多种部署方式

  • 独立部署: 传统部署方式
  • Docker 部署: 容器化部署
  • 嵌入式部署: 单程序部署

3. 完善的权限体系

  • 角色管理: 灵活的权限配置
  • 数据权限: 数据范围控制
  • 操作审计: 操作日志记录

4. 强大的统计功能

  • 多维度统计: 个人/项目/团队
  • 可视化图表: ECharts 展示
  • 数据导出: Excel 导出支持

技术演进

v1.0 - 初始版本

  • Java 后端实现
  • 基础工时管理功能

v2.0 - Go 版本

  • Go 后端迁移
  • 性能优化

v3.0 - 功能增强

  • 审核流程完善
  • 统计功能增强
  • 多种部署方式

v4.0 - 当前版本

  • 前端 Vue 3 升级
  • 嵌入式部署支持
  • 文档体系完善

相关资源


技术支持

如有技术问题,请通过以下方式联系:

  • 💬 微信公众号: wuyusoft
  • 📝 问题反馈: Gitee Issues

Released under the MIT License.