The presented functionality is part of the SchedulePro WebViewer web application, a product created on behalf of Intelligen Inc. in order to monitor production schedule in process-based production plants. The application is currently used for running the operations in several well-known, multi-national pharmaceutical companies across the globe. The application was built gradually during the course of almost ten years, thereby encompassing a number of different technologies that were becoming popular as the application evolved.
Building the WebViewer took place in three distinct phases:
- Phase 1: A Web Forms application was created from scratch, providing most of its functionality via the ReportViewer control in the Microsoft.Reporting.WebForms namespace.
- Phase 2: The back-end was extended with Web API functionality and the front-end was developed using various libraries such as JQuery and Knockout.
- Phase 3: A React build pipeline was integrated into the solution (link to blog post) and new functionality was implemented in the form of React components (link to Web Forms/React integration).
This is functionality created as part of phase 1 of the WebViewer development.
Functionality at a glance:
- A main page lists the available data and allows for setting the options and bringing up the desired report.
- Several report pages that include the actual reports.
Technical highlights:
- The MS ReportViewer server control allows for displaying template-based reports (in .rdlc format) in Web Forms applications.
- A number of pre-existing .rdlc reports are served over the web. These reports were already displayed in a desktop application via the Windows Forms version of the ReportViewer.
- A custom data access layer draws data from the database and feeds them to the ReportViewer control.
- Both the data access layer and the .rdlc templates are implemented in a common library, referenced by both the desktop and the web applications.
- The main interface created as part of Phase 1 uses typical Web Forms controls prefixed with “asp:” such as LinkButton, CheckBox, TextBox, RadioButton, GridView, etc.
- Report pages are occupied almost entirely by a ReportViewer control.
- The application layout uses Bootstrap css.
The main application interface is shown in the below screenshot:
Bottom part (grid):
- List with the database “campaigns” (set of activities associated with producing some product quantity).
- The list allows for selecting any number of the available campaigns.
Top part (panel):
- The orange “Show” buttons display the four available reports for the selected campaigns.
- Reports options can be set from radio buttons prior to clicking the “Show” button.
Below we include an indicative screenshot for each of the four report types.
