This repository showcases the work I completed during my internship at Softher. The project focused on developing a novel calendar-based representation for ERP Panthera grids using Angular. It aimed to improve data visualization and accessibility for ERP users.
This project plays a pivotal role as one of the main new features in the recently released and highly anticipated major update, ERP Panthera version 5.0.
A live demo of the project is not available yet.
A video presentation is available at YoutubeLink (the presentation is in Italian, enabling subtitles is recommended)
- Angular
- TypeScript
- HTML
- CSS
- Java
The primary objective of my internship was to create a new representation of Panthera's ERP grids in the form of a calendar. This calendar would offer a more comprehensive and practical view when handling date-related operations. Users would have the flexibility to switch between the traditional grid view and the new calendar view based on their specific requirements.
It's crucial to note that the calendar needed to support all entities within Panthera that possess at least one date field. Furthermore, each entity is unique, making it necessary to find a generalized solution.
I leveraged Angular's CalendarComponent and tailored it to Panthera's style and our specific needs. The result is as follows: The calendar offers three primary views: Month View, Week View, and Day View.
-
Month View*
-
Week View
- Day View
All three views facilitate event manipulation through drag and drop. A single click on an item opens an event editing page, and a tooltip displays event details.
The transformation from the grid to the calendar works as follows: Each row in the grid is represented by an event in the calendar.
- A column of type String (or int) represents the event's title.
- A column of type Date or Timestamp, or two columns (one Date and one Time) as needed, represents the event's date.
- A column of type Enum specifies the color of the event in various views. These colors are consistent with those in the original grid.
The choice of columns is customizable by the end user, each user has their own settings.
At the bottom of the page, another grid appears upon clicking on a day displaying items for the activated date. This allows for the simultaneous copying of one or more items to a specific date in the calendar.
This grid also enables the copying of one or more items and allows for navigation to another month before pasting, a feature not possible with drag and drop alone.
A simplified mobile version is also available (the style was not updated to the last version). For the active day, users can switch between a view containing a list of events and a grid.
I also developed additional versions that can simplify data manipulation by displaying two views simultaneously, enabling drag and drop between distant dates.
