在日常工作和学习中,我们经常面临以下困扰:
- 任务遗忘:事情太多,容易遗漏重要任务
- 进度不清:不清楚哪些任务完成了,哪些还在进行中
- 管理混乱:任务分散在邮件、聊天工具、笔记本中,难以统一管理
TaskManager 是一款轻量级任务管理工具,旨在帮助用户:
- ✅ 快速记录:随时添加任务,不错过任何想法
- ✅ 一目了然:清晰查看所有任务及其完成状态
- ✅ 高效管理:快速编辑、删除、搜索任务
- ✅ 简单易用:无需复杂配置,开箱即用
- 📚 个人学习:规划学习计划,跟踪学习进度
- 💼 工作事务:管理日常工作事项,提高工作效率
- 🏠 生活琐事:记录生活中的待办事项,让生活更有条理
┌─────────────────────────────────────────────────────────────┐
│ 用户访问 │
│ http://localhost:3000 │
└─────────────────────────┬───────────────────────────────────┘
│
┌─────────────────────────▼───────────────────────────────────┐
│ Vue 3 前端应用 │
│ 单页应用 (SPA) │
└─────────────────────────┬───────────────────────────────────┘
│ HTTP/REST
┌─────────────────────────▼───────────────────────────────────┐
│ Spring Cloud Gateway │
│ API 网关 (:9191) │
│ 统一入口 • 路由转发 • 跨域处理 │
└─────────────────────────┬───────────────────────────────────┘
│ /api/**
┌─────────────────────────▼───────────────────────────────────┐
│ tm-core 微服务 │
│ (:8080) │
│ ┌────────────┐ ┌────────────┐ ┌────────────────────┐ │
│ │ Controller │→ │ Service │→ │ Dao │ │
│ │ 控制器 │ │ 业务逻辑 │ │ 数据访问层 │ │
│ └────────────┘ └────────────┘ └────────────────────┘ │
│ ↓ │
│ ┌────────────────────────┐ │
│ │ MySQL 数据库 │ │
│ │ task_management │ │
│ └────────────────────────┘ │
└─────────────────────────────────────────────────────────────┘
| 技术 | 版本 | 说明 |
|---|---|---|
| Java | 17+ | 编程语言 |
| Spring Boot | 3.3.5 | 基础框架 |
| SpringCloud | 2023.0.3 | 微服务框架 |
| MyBatis-Plus | 3.5.5 | 数据访问层 |
| MySQL | 8.0+ | 关系型数据库 |
| Dubbo | 3.x | RPC 远程调用(可选) |
| 技术 | 版本 | 说明 |
|---|---|---|
| Vue | 3.x | 渐进式 JavaScript 框架 |
| Vue Router | 4.x | 官方路由管理 |
| Axios | - | HTTP 客户端 |
| Vite | 5.x | 下一代前端构建工具 |
TaskManager/
├── pom.xml # 父工程配置
├── README.md # 项目说明文档
│
├── tm-core/ # 核心微服务
│ ├── pom.xml
│ └── src/main/
│ ├── java/com/sustar/
│ │ ├── controller/ # REST 控制器
│ │ ├── service/ # 业务逻辑接口
│ │ │ └── impl/ # 业务逻辑实现
│ │ ├── dao/ # 数据访问层 (MyBatis-Plus)
│ │ ├── entity/ # 数据库实体
│ │ ├── dto/ # 数据传输对象
│ │ ├── vo/ # 视图对象
│ │ ├── config/ # 配置类
│ │ └── exception/ # 异常处理
│ └── resources/
│ ├── application.yaml # 应用配置
│ ├── mapper/ # MyBatis XML 映射
│ └── schema.sql # 数据库脚本
│
├── tm-gateway/ # API 网关服务
│ ├── pom.xml
│ └── src/main/
│ └── java/com/sustar/gateway/
│ └── GatewayApplication.java
│
└── web/ # Vue 前端应用
├── package.json
├── vite.config.js
└── src/
├── api/ # API 接口封装
├── views/ # 页面组件
├── router/ # 路由配置
├── App.vue # 根组件
└── main.js # 应用入口
TaskManager 专为以下用户群体设计:
| 用户群体 | 使用场景 | 核心价值 |
|---|---|---|
| 学生 | 管理课程作业、考试复习计划 | 避免遗漏,跟踪学习进度 |
| 职场人士 | 处理日常工作、项目任务 | 提高效率,清晰管理多任务 |
| 自由职业者 | 规划客户项目和个人事务 | 灵活管理,平衡多项目 |
| 团队负责人 | 分配和跟踪团队任务 | (未来扩展)协作功能 |
- ✅ 需要简单工具:不想要复杂的学习曲线,开箱即用
- ✅ 轻量级管理:不需要企业级项目管理软件的复杂性
- ✅ 快速上手:希望几分钟内就开始使用
- ✅ 数据自己掌控:希望数据存储在自己可访问的地方
| 特点 | 说明 |
|---|---|
| 🎯 轻量简洁 | 没有冗余功能,专注任务管理核心 |
| 🚀 快速响应 | 前后端分离架构,操作流畅 |
| 🔧 易于定制 | 开源项目,可根据需求二次开发 |
| 📦 易于部署 | Docker 支持,一键部署 |
| 💾 数据安全 | 数据存储在本地 MySQL,可控可管 |
- 📋 任务列表:查看所有任务
- ➕ 创建任务:添加新任务(标题、描述)
- ✏️ 编辑任务:修改任务信息
- 🗑️ 删除任务:移除不需要的任务
- ✅ 完成任务:一键切换完成状态
- 🔍 关键词搜索:快速定位任务
- 前后端分离:独立开发,独立部署
- 微服务架构:便于扩展和维护
- RESTful API:标准化的接口设计
- 统一异常处理:规范的错误响应
- JDK 17+
- Node.js 16+
- Maven 3.6+
- MySQL 8.0+
1. 配置数据库
CREATE DATABASE task_management DEFAULT CHARACTER SET utf8mb4;2. 启动后端服务
# 编译项目
mvn clean compile
# 启动核心微服务 (端口 8080)
mvn spring-boot:run -pl tm-core
# 新开终端,启动网关服务 (端口 9191)
mvn spring-boot:run -pl tm-gateway3. 启动前端应用
cd web
npm install
npm run dev4. 访问应用
- 前端地址:http://localhost:3000
- API 网关:http://localhost:9191
- API 接口:http://localhost:9191/api/tasks
| 方法 | 路径 | 说明 |
|---|---|---|
| GET | /api/tasks | 获取所有任务 |
| GET | /api/tasks/{id} | 根据 ID 获取任务 |
| GET | /api/tasks/search?keyword=xxx | 关键词搜索 |
| POST | /api/tasks | 创建新任务 |
| PUT | /api/tasks | 更新任务 |
| DELETE | /api/tasks | 删除任务 |
- 命名规范:变量名/方法名使用小驼峰,类名/接口名使用大驼峰
- 分层结构:严格区分 PO/VO/DTO,职责清晰
- 包组织:
service包下包含impl子包 - 公共组件:
common包下包含 utils、constants、exceptions 子包
MIT License - 欢迎自由使用和修改!