Architecture Overview

Relevant source files

The following files were used as context for generating this wiki page:

• README.md
• pom.xml
• src/main/java/com/example/demo/config/SecurityConfig.java
• src/main/java/com/example/demo/controllers/AdminController.java
• src/main/java/com/example/demo/services/AttachmentService.java
• src/main/resources/static/js/api.js
• src/main/java/com/example/demo/controllers/AnalyticsController.java

The Dashboard Task Management (DTM) system is a corporate task management application designed with a decoupled architecture. It utilizes a Java-based backend powered by Spring Boot and a frontend utilizing Vue.js and Thymeleaf templates. The system provides robust task tracking, role-based access control, real-time analytics, and file attachment capabilities.

Sources: README.md:1-10, pom.xml:1-40

System Stack and Dependencies

The application is built on a modern Java stack using Spring Boot 3.2.5. It manages data persistence through PostgreSQL and JPA, while security is handled via Spring Security and JWT for stateless authentication.

Component	Technology	Description
Backend Framework	Spring Boot 3.2.5	Core application logic and API
Database	PostgreSQL	Relational data storage
Security	Spring Security + JWT	Authentication and Authorization
Documentation	SpringDoc OpenAPI	Swagger UI for API documentation
Frontend	Vue.js / Thymeleaf	UI rendering and client-side logic

Sources: pom.xml:10-85, README.md:1-10

Security and Authentication Architecture

The system implements a dual-layer security configuration to handle both REST API traffic and traditional web page requests.

Authentication Flow

Authentication is stateless for API requests, utilizing JSON Web Tokens (JWT). The SecurityConfig defines two distinct filter chains:

1. API Chain (/api/**): Stateless, uses JwtFilter before UsernamePasswordAuthenticationFilter.
2. Web Chain (HTML pages): Session-based, manages form login and logout.

Authorization Roles

The system enforces a hierarchical Permission Model:

• ADMIN: Full access to departments, users, and all projects.
• MANAGER: Access to department-specific projects and analytics.
• PM: Management of specific assigned projects and tasks.
• TEAM: Execution and commenting on assigned tasks.

Sources: README.md:25-45, src/main/java/com/example/demo/controllers/AdminController.java:25-30

Backend Services and Logic

Attachment Management

The AttachmentService manages file lifecycles. It includes a multi-stage upload process where files are first stored in a temporary directory and then bound to specific entities (Tasks or Comments).

Key Constraints:

• Max Size: 10 MB.
• Allowed Formats: JPG, PNG, PDF, DOCX, XLSX, TXT, ZIP, RAR.
• Storage Strategy: Files are moved from temp to entity-specific directories (e.g., /task/{id}/) upon binding.

Analytics and Reporting

The AnalyticsController exposes endpoints for processing task data into meaningful metrics. It supports filtering by project and department.

Available Metrics:

• Task distribution by status (NEW, IN_PROGRESS, REVIEW, DONE).
• Task distribution by priority (LOW, MEDIUM, HIGH).
• Employee Performance: Total assigned, completed, and overdue percentages.
• Task History: Audit trail of changes per task.

Sources: src/main/java/com/example/demo/controllers/AnalyticsController.java:30-90, README.md:165-185

Frontend-Backend Communication

The client communicates with the server through a central API module (api.js) that wraps the fetch API. It automatically attaches the JWT from localStorage to the Authorization header of every request.

// Central Request Handler in api.js
async function request(method, url, body = null) {
  const options = { method, headers: headers() };
  if (body) options.body = JSON.stringify(body);
  const res = await fetch(BASE + url, options);
  if (res.status === 401) {
    localStorage.removeItem('dtm_token');
    window.location.href = '/login';
    return;
  }
  return res.json();
}

Sources: src/main/resources/static/js/api.js:15-35

Kanban Data Flow

The Kanban board utilizes Drag & Drop logic to trigger state changes in the backend. When a task card is dropped into a new column, the frontend calls API.updateStatus, which updates the task's state in the PostgreSQL database.

Sources: src/main/resources/static/js/kanban.js:10-35, README.md:90-110

Conclusion

The Dashboard Task Management architecture provides a secure, scalable foundation for team collaboration. By separating the API concerns from the view logic and implementing a strict service-layer pattern for file handling and analytics, the system ensures data integrity and role-based security across all organizational levels.