TABLE OF CONTENTS

• Steps to create a new DevExpress report
  • Setup/Configuration
  • Database Changes/Updates
  • API and Code level Customization
  • Adding a new report in the solution explorer/ Adding a   DevExpress item

Steps to create a new DevExpress report

Setup/Configuration

1. Get an instance that has the DevExpress setup and license installed and available or else contact the IT support team to help provide a similar instance. For reference check if the below desktop app is available.
    
2. Once the DevExpress setup is ready, clone the SDK project onto that instance. 
3. Open the SDK project in the visual studio and on the top menu section there is a menu for DevExpress as shown below which will confirm that the DevExpress setup is now available and ready to use.
   

Database Changes/Updates

1. Open the SSMS and select the database which needs to be used.
2. Below is the set of database tables that are responsible for the DevExpress report creation/updation.

   1. ZnodeReportCategories

   2. ZnodeReportDetails

   3. ZnodeReportSetting

   4. ZnodeReportStyleSheets

3. The ZnodeReportCategories table contains a list of report categories that are shown in the left side panel of the Advanced reports.
   Only those categories appear whose IsActive property is set to 1.

4. The ZnodeReportDetails table contains all the reports that fall under the above categories.
   For the Sales menu whose ZnodeCategoryId is 1, the admin will only display two reports Orders and Coupons since IsActive is 1 for them.
    

5. In order to add a new report lets say Vouchers under the sales category,

   1. The first entry that we will make is in the ZnodeReportDetails table where ZnodeCategoryId will be the Id of the menu under which the report should be shown. 

   2. ReportCode should be a unique name given to the report. Eg Vouchers, this is not used for displaying purpose but just for internal use.

   3. ReportName is the name that needs to be displayed in the admin section under that particular menu.

   4. Description is the information needed to be provided about the report. This again is displayed on admin.

   5. IsActive determines if that should be shown on admin or not.
      So with the above new entry we should be able to see the new sales report as
      

6. Next in the ZnodeReportSetting table we will have to add a new entry for Vouchers which will contain the SettingXML that displays the report grid.

   1. SettingXML - Copy any existing report’s SettingXML and make changes in the xml as per the columns needed in the grid.
      

   2. The header text is the column name of the report.

   3. Datatype determines the column’s datatype.

   4. The must-show column if set to y determines that the Store Name column will appear on the report grid. Else the column is hidden on the grid.

   5. The isallowsearch column if set to y confirms that this column will also appear in the preview parameter section as well for searching as shown below.
      

   6. DisplayMode is set to 1.

   7. ZnodeReportStyleSheets is the Id from ZnodeReportStyleSheets tables. It should be the one whose IsDefault flag is 1.

   8. DefaultLayoutXML is the default layout that appears if no layout is set for the report.

   9. ZnodeReportStyleSheets table contains XML containing the styling of the report. Only one style sheet can be set to Default which will appear for all the reports.

API and Code level Customization

1. The Znode base has a few DevExpress Reports already created. As a result, the flow for creating and viewing the reports is already available in the full source code.
2. In order to create a new report we will have to override a few methods and write some custom code.
3. In the full source code’s DevExpressReportAgent.cs file we have a method GetReportDataFromAPI which contains a switch case and on the basis of the report code that is passed from the controller, it calls the API flow for that particular report.
4. We will have to override this method by creating a Custom DevExpressReportAgent.cs file. We will introduce a new case in the switch case for our new report
   And from here we will create a custom API flow from the znode API client till the service gets the data for this new report.
    
5. The service call will have the logic that will get the data for this report either by writing a stored procedure or an entity called as per need.
6. For this, we will have to create the Model and ListModel for the API flow like we usually do as per the properties needed in it which is to be created in the Znode.API.Custom.Model.
7. Along with this, there are two very important models that are needed to be binded with the report structure. For this in the Libraries -> Znode.Libraries.DevExpress.Report-> ReportSchemaModels folder we will have to create a folder with the report name of our new report wherein we will be creating two models one of which is the YourReportNameInfo model ie. VoucherInfo model and the other one YourReportNameModel model ie. VoucherModel.
    
8. Now the VoucherInfo model will inherit from the BaseInfo model and will exactly contain all the properties as we created for the API model.
    
9. The real hero of the report model is the VoucherModel which contains two very important attributes HighlightedClass and HighlightedMember. The VoucherModel will inherit the List<VoucherInfo> and the HighlightedClass attribute will be provided above the class and HighlightedMember will be provided above the method. One important namespace that this class needs is DevExpress.DataAccess.ObjectBinding.
    
10. So for any new report we will have to create these two models in the Libraries -> Znode.Libraries.DevExpress.Report-> ReportSchemaModels folder. These models will be used to bind the report in the future steps when we add a new report in the SDK structure. (point no of below step ieAdding a DevExpress Item)
11. Rest all are the base methods that are being called.

Adding a new report in the solution explorer/ Adding a   DevExpress item

1. Open the solution explorer and navigate to Libraries->Znode.Libraries.DevExpress.Report-> Reports.
2. Right click on the Reports and click Add DevExpress Item and open XtraReport Wizard Web.
    
3. This opens up a popup that allows to provide a name to the report. Here the name Vouchers.cs is given.
    
4. On clicking OK it redirects to another pop up that is Report Wizard that allows to select the report type that needs to be created. Select Data-bound Report and click Next.
    
5. Now it is redirected to select the data source type. Select Object Binding and press Next.
    
6. Now it is redirected to another Report Wizard wherein the selection of the data model needs to be made that was created.
   This will be the highlighted model that we created in the Libraries -> Znode.Libraries.DevExpress.Report-> ReportSchemaModels folder for the Vouchers with the two highlighted attributes for class and method.
7. Select the Voucher model and click Next.
   It is redirected to selecting the data binding mode where the first option is selected which is Retrieve the data source schema and move to Next.
    
8. This will redirect you to another wizard where one or more data members need to be selected to assign to the report and its detailed reports. Click on Object Data Source on both sides and click next.
    
9. Click next for two more wizards till you reach the report title wizard. Specify the report title and click Finish. The report is ready.
    
10. Style the report by either copying the existing report’s style or creating your own. From the properties tab as shown below.
     
11. Also, it can save the styles of existing reports which will be saved with the extension .repss and use it for future reports if needed.
     
12. Run the application and check its appearance in the admin Advanced Reports.