Skip to content
BranchesTags

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
.vscode
.vscode
 
 
client
client
 
 
sample
sample
 
 
server
server
 
 
.gitignore
.gitignore
 
 
README.md
README.md
 
 
demo.txt
demo.txt
 
 
package.json
package.json
 
 
start.bat
start.bat
 
 

Repository files navigation

🎓 Hệ thống Quản lý Giáo viên (QLGV)

Một ứng dụng web full-stack được xây dựng bằng MERN Stack để quản lý thông tin giáo viên và vị trí công tác trong trường học.

✨ Tính năng chính

📋 Quản lý Giáo viên

  • ✅ Xem danh sách giáo viên với thông tin đầy đủ
  • ✅ Tạo mới hồ sơ giáo viên
  • ✅ Chỉnh sửa thông tin giáo viên
  • ✅ Xóa mềm (soft delete) giáo viên
  • ✅ Tìm kiếm theo tên, email, số điện thoại
  • ✅ Phân trang và lọc dữ liệu
  • ✅ Quản lý học vị động (thêm/xóa nhiều học vị)
  • ✅ Upload ảnh đại diện
  • ✅ Gán nhiều vị trí công tác

🏢 Quản lý Vị trí công tác

  • ✅ CRUD đầy đủ cho vị trí công tác
  • ✅ Mã vị trí unique với validation
  • ✅ Trạng thái hoạt động/không hoạt động
  • ✅ Tìm kiếm và lọc

📊 Dashboard & Thống kê

  • ✅ Thống kê tổng quan (tổng số GV, đang làm việc, nghỉ việc)
  • ✅ Quick actions (tạo mới, quản lý)
  • ✅ Giao diện trực quan với biểu đồ

🛠️ Công nghệ sử dụng

Backend

  • Node.js - Runtime environment
  • Express.js - Web framework
  • MongoDB - Database NoSQL
  • Mongoose - Object Document Mapping
  • Express-validator - Input validation
  • CORS - Cross-Origin Resource Sharing

Frontend

  • React 18 - UI Library với Hooks
  • Ant Design - UI Component Library
  • React Router - Navigation
  • Axios - HTTP Client
  • Day.js - Date manipulation

Development Tools

  • Nodemon - Development server
  • React Scripts - Build tools

📁 Cấu trúc dự án

qlgv/
├── 📁 server/                 # Backend API
│   ├── 📁 controllers/        # Business logic
│   │   ├── teacher.controller.js
│   │   ├── teacherPosition.controller.js
│   │   └── user.controller.js
│   ├── 📁 models/             # Database schemas
│   │   ├── teacher.model.js
│   │   ├── teacherPosition.model.js
│   │   └── user.model.js
│   ├── 📁 routes/             # API routes
│   │   ├── teacher.routes.js
│   │   ├── teacherPosition.routes.js
│   │   └── user.routes.js
│   ├── server.js              # Main server file
│   └── package.json
├── 📁 client/                 # Frontend React App
│   ├── 📁 public/
│   ├── 📁 src/
│   │   ├── 📁 components/     # Reusable components
│   │   │   ├── 📁 common/
│   │   │   ├── 📁 layout/
│   │   │   ├── 📁 position/
│   │   │   └── 📁 teacher/
│   │   ├── 📁 pages/          # Page components
│   │   │   ├── 📁 position/
│   │   │   └── 📁 teacher/
│   │   ├── 📁 services/       # API services
│   │   ├── App.js
│   │   ├── App.css
│   │   └── index.js
│   └── package.json
├── start.bat                  # Script để chạy cả client và server
├── package.json               # Root package.json
└── README.md

🚀 Hướng dẫn cài đặt

1. Clone repository

git clone <repository-url>
cd qlgv

2. Cài đặt dependencies

Backend

cd server
npm install

Frontend

cd client
npm install

3. Cấu hình môi trường

Tạo file .env trong thư mục server/:

MONGODB_URI=mongodb://localhost:27017/teacher_management
PORT=5000

4. Chạy ứng dụng

Cách 1: Chạy từng phần riêng biệt

Backend (Terminal 1):

cd server
npm run dev

Frontend (Terminal 2):

cd client
npm start

Cách 2: Chạy cả hai cùng lúc (Windows)

start.bat

5. Truy cập ứng dụng

📚 API Documentation

Authentication

Hiện tại chưa có authentication. Tất cả endpoints đều public.

Endpoints chính

Teachers API (/api/teachers)

  • GET / - Lấy danh sách giáo viên (với pagination, search)
  • GET /:id - Lấy chi tiết một giáo viên
  • POST / - Tạo giáo viên mới
  • PUT /:id - Cập nhật thông tin giáo viên
  • DELETE /:id - Xóa mềm giáo viên
  • GET /stats - Thống kê giáo viên

Positions API (/api/positions)

  • GET / - Lấy danh sách vị trí công tác
  • GET /:id - Lấy chi tiết một vị trí
  • POST / - Tạo vị trí mới
  • PUT /:id - Cập nhật vị trí
  • DELETE /:id - Xóa mềm vị trí

Users API (/api/users)

  • GET / - Lấy danh sách người dùng
  • GET /:id - Lấy chi tiết người dùng
  • POST / - Tạo người dùng mới
  • PUT /:id - Cập nhật người dùng
  • DELETE /:id - Xóa mềm người dùng

🎨 Tính năng giao diện

🎯 Highlights

  • Responsive Design - Hoạt động tốt trên mọi thiết bị
  • Dark/Light Theme - Giao diện sáng/tối (sẵn sàng)
  • Loading States - Loading spinner cho tất cả operations
  • Error Handling - Xử lý lỗi với thông báo rõ ràng
  • Form Validation - Validation đầy đủ cho tất cả forms
  • Search & Filter - Tìm kiếm và lọc dữ liệu thông minh
  • Pagination - Phân trang với nhiều tùy chọn
  • Soft Delete - Xóa mềm, có thể khôi phục

📱 Components chính

  • Layout - Sidebar navigation với responsive
  • Dashboard - Trang chủ với thống kê và quick actions
  • TeacherTable - Bảng danh sách giáo viên với đầy đủ thông tin
  • TeacherForm - Form tạo/sửa giáo viên với quản lý học vị động
  • PositionTable - Bảng quản lý vị trí công tác
  • PositionForm - Form tạo/sửa vị trí công tác

🔧 Scripts có sẵn

Server scripts

npm start          # Chạy production server
npm run dev        # Chạy development server với nodemon

Client scripts

npm start          # Chạy development server
npm run build      # Build production
npm test           # Chạy tests

🎯 Tính năng nâng cao đã implement

🔥 Quản lý học vị động

  • Thêm/xóa nhiều học vị cho một giáo viên
  • Validation đầy đủ cho từng học vị
  • UI trực quan với drag & drop sẵn sảng

🎨 UI/UX cao cấp

  • Gradient backgrounds và shadows
  • Hover effects và animations
  • Icon set nhất quán
  • Color scheme chuyên nghiệp

📊 Thống kê real-time

  • Dashboard với số liệu cập nhật tự động
  • Charts sẵn sàng integrate
  • Quick actions để thao tác nhanh

🔍 Search & Filter nâng cao

  • Tìm kiếm real-time
  • Multiple filter options
  • Pagination với customizable page sizes

🚧 Roadmap phát triển

Phase 2 (Planned)

  • Authentication & Authorization với JWT
  • Role-based access control
  • File upload cho documents
  • Export Excel/PDF
  • Email notifications
  • Advanced reporting & charts
  • Audit logs
  • Backup & restore

Phase 3 (Future)

  • Mobile app (React Native)
  • Real-time notifications
  • Advanced analytics
  • Integration với các hệ thống khác
  • Multi-language support

🤝 Contributing

  1. Fork the project
  2. Create your feature branch (git checkout -b feature/AmazingFeature)
  3. Commit your changes (git commit -m 'Add some AmazingFeature')
  4. Push to the branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

📄 License

Distributed under the MIT License. See LICENSE for more information.

👨‍💻 Author

Your Name

🙏 Acknowledgments

  • Ant Design for the beautiful UI components
  • MongoDB for the flexible database
  • React for the powerful frontend framework
  • Express.js for the robust backend framework

About

No description, website, or topics provided.

Resources

Readme
Activity

Stars

0 stars

Watchers

0 watching

Forks

2 forks
Report repository

Releases

Packages

Contributors

Languages