Adapting GUI for error report managing

Change-Id: Idb3f5750596334990b030bfdf2f6551ad4d1c8e3
Issue-ID: VID-488
Signed-off-by: Bartosz Gardziejewski <bartosz.gardziejewski@nokia.com>

23 files changed, 571 insertions, 16 deletions

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/constants/componentConstants.js b/vid-app-common/src/main/webapp/app/vid/scripts/constants/componentConstants.js
index fc3d8f792..5c5801805 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/constants/componentConstants.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/constants/componentConstants.js
@@ -258,7 +258,8 @@ appDS2
       FLAG_1810_CR_ADD_CLOUD_OWNER_TO_MSO_REQUEST: "FLAG_1810_CR_ADD_CLOUD_OWNER_TO_MSO_REQUEST",
       FLAG_1810_CR_LET_SELECTING_COLLECTOR_TYPE_UNCONDITIONALLY: "FLAG_1810_CR_LET_SELECTING_COLLECTOR_TYPE_UNCONDITIONALLY",
       FLAG_1810_CR_SOFT_DELETE_ALACARTE_VF_MODULE: "FLAG_1810_CR_SOFT_DELETE_ALACARTE_VF_MODULE",
-      FLAG_HANDLE_SO_WORKFLOWS: "FLAG_HANDLE_SO_WORKFLOWS"
+      FLAG_HANDLE_SO_WORKFLOWS: "FLAG_HANDLE_SO_WORKFLOWS",
+      FLAG_CREATE_ERROR_REPORTS: "FLAG_CREATE_ERROR_REPORTS"
     }
 
   };
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/controller/ServiceModelController.js b/vid-app-common/src/main/webapp/app/vid/scripts/controller/ServiceModelController.js
index 0705812f7..62ef1a4f2 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/controller/ServiceModelController.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/controller/ServiceModelController.js
@@ -22,8 +22,8 @@
 (function () {

 	'use strict';

 

-	appDS2.controller("ServiceModelController", function ($scope, $http, $location, COMPONENT, VIDCONFIGURATION, FIELD, DataService, vidService,

-			PropertyService, UtilityService, AsdcService,$timeout) {

+	appDS2.controller("ServiceModelController",function ($uibModal, $scope, $http, $location, COMPONENT, VIDCONFIGURATION, FIELD, DataService, vidService,

+			PropertyService, UtilityService, AsdcService, $timeout, featureFlags) {

 

 		$scope.popup = {};

 		var defaultViewPerPage = 10;

@@ -132,7 +132,24 @@
 			$scope.currentPage++;

 		};

 

+		$scope.showReportWindow = function() {

 

+			const modalWindow = $uibModal.open({

+				templateUrl: 'app/vid/scripts/modals/report-modal/report-modal.html',

+				controller: 'reportModalController',

+				controllerAs: 'vm',

+				resolve: {

+					errorMsg: function () {

+						return $scope.status;

+					}

+				}

+			});

+

+		};

+

+		$scope.isShowErrorReport = function() {

+			return featureFlags.isOn(COMPONENT.FEATURE_FLAGS.FLAG_CREATE_ERROR_REPORTS);

+		};

 		

 		$scope.createType = COMPONENT.A_LA_CARTE;

 		$scope.deployService = function(service) {

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/controller/aaiSubscriberController.js b/vid-app-common/src/main/webapp/app/vid/scripts/controller/aaiSubscriberController.js
index 16ec01dfd..191251860 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/controller/aaiSubscriberController.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/controller/aaiSubscriberController.js
@@ -24,6 +24,20 @@
 appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER", "DataService", "PropertyService", "$scope", "$http", "$timeout", "$location", "$log", "$route", "$uibModal", "VIDCONFIGURATION", "UtilityService", "vidService", "AaiService", "MsoService", "OwningEntityService", "AsdcService","featureFlags", "$q", "_",

     function (COMPONENT, FIELD, PARAMETER, DataService, PropertyService, $scope, $http, $timeout, $location, $log, $route, $uibModal, VIDCONFIGURATION, UtilityService, vidService, AaiService, MsoService, OwningEntityService, AsdcService, featureFlags, $q, _) {

 

+        $scope.showReportWindow = function() {

+

+            const modalWindow = $uibModal.open({

+                templateUrl: 'app/vid/scripts/modals/report-modal/report-modal.html',

+                controller: 'reportModalController',

+                controllerAs: 'vm',

+                resolve: {

+                    errorMsg: function () {

+                        return $scope.errorMsg;

+                    }

+                }

+            });

+        };

+

         $scope.showVnfDetails = function (vnf) {

             console.log("showVnfDetails");

             DataService.setVnfInstanceId(COMPONENT.VNF_INSTANCE_ID);

@@ -728,6 +742,10 @@ appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER",
             return featureFlags.isOn(COMPONENT.FEATURE_FLAGS.FLAG_SHOW_VERIFY_SERVICE);

         }

 

+        $scope.isShowErrorReport = function() {

+            return featureFlags.isOn(COMPONENT.FEATURE_FLAGS.FLAG_CREATE_ERROR_REPORTS);

+        }

+

         $scope.isEnableVerifyService = function () {

             //Button should only be enabled when the service type is A la carte

             if (DataService.getALaCarte()) {

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/controller/creationDialogController.js b/vid-app-common/src/main/webapp/app/vid/scripts/controller/creationDialogController.js
index 57bf54bb6..15627835e 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/controller/creationDialogController.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/controller/creationDialogController.js
@@ -21,15 +21,46 @@
 "use strict";

 

 var creationDialogController = function (COMPONENT, FIELD, PARAMETER, $scope, $http, $timeout, $log,

-                                         CreationService, UtilityService, DataService, VIDCONFIGURATION, $location) {

+                                         CreationService, UtilityService, DataService, VIDCONFIGURATION, $location, $uibModal, featureFlags) {

 

     $scope.isDialogVisible = false;

+    $scope.isServiceError = false;

     $scope.summaryControl = {};

     $scope.userProvidedControl = {};

 

+

     var callbackFunction = undefined;

     var componentId = undefined;

 

+    $scope.showReportWindow = function() {

+

+        let errorMsg;

+

+        if($scope.error !== undefined && $scope.error != null) {

+            errorMsg = $scope.error;

+        } else {

+            errorMsg = "";

+        }

+

+        const modalWindow = $uibModal.open({

+            templateUrl: 'app/vid/scripts/modals/report-modal/report-modal.html',

+            controller: 'reportModalController',

+            controllerAs: 'vm',

+            resolve: {

+                errorMsg: function () {

+                    return errorMsg;

+                }

+            }

+        });

+

+        $scope.isDialogVisible = false;

+        $scope.popup.isVisible = false;

+    };

+

+    $scope.isShowErrorReport = function() {

+        return featureFlags.isOn(COMPONENT.FEATURE_FLAGS.FLAG_CREATE_ERROR_REPORTS);

+    };

+

     $scope.shouldShowOldPopup = function () {

         return !DataService.getShouldIncludeInAsyncInstantiationFlow();

     };

@@ -68,6 +99,7 @@ var creationDialogController = function (COMPONENT, FIELD, PARAMETER, $scope, $h
             CreationService.initializeComponent(request.componentId);

 

             CreationService.setHttpErrorHandler(function (response) {

+                $scope.isServiceError = true;

                 showError(FIELD.ERROR.SYSTEM_FAILURE, UtilityService

                     .getHttpErrorMessage(response));

             });

@@ -373,4 +405,5 @@ var creationDialogController = function (COMPONENT, FIELD, PARAMETER, $scope, $h
 

 appDS2.controller("creationDialogController", ["COMPONENT", "FIELD", "PARAMETER", "$scope", "$http",

     "$timeout", "$log", "CreationService", "UtilityService", "DataService", "VIDCONFIGURATION", "$location",

+    "$uibModal", "featureFlags",

     creationDialogController]);

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/controller/msoCommitController.js b/vid-app-common/src/main/webapp/app/vid/scripts/controller/msoCommitController.js
index 9bb439fe3..a5c038830 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/controller/msoCommitController.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/controller/msoCommitController.js
@@ -63,8 +63,8 @@
  * "$scope.popup".

  */

 

-var msoCommitController = function(COMPONENT, FIELD, $scope, $http, $timeout, $window, $log,

-		MsoService, PropertyService, UtilityService, TestEnvironmentsService) {

+var msoCommitController = function(COMPONENT, FIELD, $scope, $http, $timeout, $window, $log, $uibModal,

+		MsoService, PropertyService, UtilityService, TestEnvironmentsService, DataService) {

 

 	$scope.isViewVisible = false;

 	$scope.progressBarControl = {};

@@ -72,6 +72,29 @@ var msoCommitController = function(COMPONENT, FIELD, $scope, $http, $timeout, $w
     var getRequestStatusFunc = getOrchestrationRequestStatus; //default

 	var _this = this;

 

+	$scope.showReportWindow = function() {

+		let requestInfo = {};

+		requestInfo.requestId = _this.requestId;

+		requestInfo.serviceUuid = $scope.instanceId;

+

+		const modalWindow = $uibModal.open({

+			templateUrl: 'app/vid/scripts/modals/report-modal/report-modal.html',

+			controller: 'reportModalInstanceController',

+			controllerAs: 'vm',

+			resolve: {

+				errorMsg: function () {

+					return $scope.log;

+				},

+				requestInfo: function () {

+					return requestInfo;

+				}

+			}

+		});

+

+		$scope.isViewVisible = false;

+		$scope.popup.isVisible = false;

+	};

+

 	$scope.$on("createInstance", function(event, request) {

 		init(request, COMPONENT.MSO_CREATE_REQ, getOrchestrationRequestStatus );

 		MsoService.createInstance(request, handleInitialResponse);

@@ -318,5 +341,5 @@ var msoCommitController = function(COMPONENT, FIELD, $scope, $http, $timeout, $w
 }

 

 appDS2.controller("msoCommitController", [ "COMPONENT", "FIELD", "$scope", "$http", "$timeout",

-		"$window", "$log", "MsoService", "PropertyService", "UtilityService", "TestEnvironmentsService",

+		"$window", "$log", "$uibModal", "MsoService", "PropertyService", "UtilityService", "TestEnvironmentsService", "DataService",

 		msoCommitController ]);

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.controller.js b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.controller.js
index 2eaa7513e..eea501f15 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.controller.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.controller.js
@@ -26,8 +26,10 @@
 
     function newChangeManagementModalController($uibModalInstance, $uibModal,$q, AaiService, changeManagementService, Upload, $log, $scope, _, COMPONENT, VIDCONFIGURATION, DataService, featureFlags) {
 
+
         var vm = this;
         vm.hasScheduler = !!VIDCONFIGURATION.SCHEDULER_PORTAL_URL;
+        vm.errorMsg='';
 
         vm.wizardStep = 1;
         vm.nextStep = function(){
@@ -43,6 +45,24 @@
 
         var attuid;
 
+        $scope.showReportWindow = function() {
+            const modalWindow = $uibModal.open({
+                templateUrl: 'app/vid/scripts/modals/report-modal/report-modal.html',
+                controller: 'reportModalController',
+                controllerAs: 'vm',
+                resolve: {
+                    errorMsg: function () {
+                        return vm.errorMsg.message;
+                    }
+                }
+            });
+
+        };
+
+        $scope.isShowErrorReport = function() {
+            return featureFlags.isOn(COMPONENT.FEATURE_FLAGS.FLAG_CREATE_ERROR_REPORTS);
+        };
+
         function fetchAttUid() {
             var defer = $q.defer();
             if (attuid) {
@@ -54,6 +74,7 @@
                     },
                     function (err) {
                         defer.reject(err);
+                        vm.errorMsg = err;
                     });
             }
             return defer.promise;
@@ -75,6 +96,7 @@
                 })
                 .catch(function (error) {
                     $log.error(error);
+                    vm.errorMsg = err;
                 })
         };
 
@@ -132,6 +154,7 @@
                                     newVNFName.availableVersions = _.sortBy(_.uniq(versions, response.data.service, true),"modelInfo.modelVersion");
                                 }).catch(function (error) {
                                 $log.error(error);
+                                vm.errorMsg = error;
                             });
                         });
                     }
@@ -372,6 +395,7 @@
                 }
 				}catch(err){
 					$log.error('SchedulerCtrl::extractChangeManagementCallbackDataStr error: ' + err);
+					vm.errorMsg = err;
 				}
 
 				result.requestDetails.push(data);
@@ -475,6 +499,7 @@
                 })
                 .catch(function (error) {
                     $log.error(error);
+                    vm.errorMsg = error;
                 });
         };
 
@@ -602,6 +627,7 @@
                     })
                     .catch(function (error) {
                         reject(error);
+                        vm.errorMsg = error;
                     });
             });
         }
@@ -708,6 +734,7 @@
             vm.localWorkflows = response.data.workflows || [];
           }).catch(function (error) {
             $log.error(error);
+            vm.errorMsg = error;
           });
         };
 
@@ -718,6 +745,7 @@
             vm.remoteWorkflows = response.data || [];
           }).catch(function (error) {
             $log.error(error);
+            vm.errorMsg = error;
           });
         };
 
@@ -734,6 +762,7 @@
           })
           .catch(function (error) {
             $log.error(error);
+            vm.errorMsg = error;
           });
         };
 
@@ -826,6 +855,7 @@
                         vnfName[0].selectedFile = JSON.parse(lines);
                     } catch (error) {
                         $log.error(error);
+                        vm.errorMsg = error;
                     }
                 };
                 fileReader.readAsText(file);
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.html b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.html
index 611b8e5ef..7ccddbafd 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.html
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.html
@@ -22,6 +22,7 @@
 <div class="modal-header">
     <h3 class="modal-title" id="modal-title">New VNF Change</h3>
     <span ng-click="vm.close()" class="pull-right modal-close" aria-hidden="true">&times;</span>
+    <div ng-if="vm.errorMsg!==''"><font color='red'>{{vm.errorMsg.message}}</font></div>
 </div>
 <form class="form-create" name="newChangeManagement" ng-submit="vm.openModal();vm.close();" novalidate>
     <div class="modal-body step1" ng-show="vm.wizardStep === 1" >
@@ -156,6 +157,7 @@
             <button type="button" id="cancel" name="cancel" class="btn btn-white" ng-click="vm.close()">Cancel</button>
             <button ng-if="!vm.isScaleOut() || (vm.isScaleOut() && vm.wizardStep === 2)" type="submit" id="submit" name="submit" class="btn btn-primary" data-ng-disabled="newChangeManagement.$invalid">{{vm.hasScheduler ? "Schedule" : "Confirm"}}</button>
             <button ng-if="vm.isScaleOut() && vm.wizardStep === 1" ng-click="vm.nextStep();" type="button" id="next" name="next" class="btn btn-primary" data-ng-disabled="newChangeManagement.$invalid">Next</button>
+            <button ng-if="isShowErrorReport() && vm.errorMsg!==''" ng-click="showReportWindow()" type="button" class="btn btn-danger" >Create report</button>
         </div>
     </div>
 </form>
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/report-modal/report-modal-request.controller.js b/vid-app-common/src/main/webapp/app/vid/scripts/modals/report-modal/report-modal-request.controller.js
new file mode 100644
index 000000000..bee3a4c27
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/report-modal/report-modal-request.controller.js
@@ -0,0 +1,64 @@
+/*-
+ * ============LICENSE_START=======================================================
+ * VID
+ * ================================================================================
+ * Copyright (C) 2019 NOKIA Intellectual Property. All rights reserved.
+ * ================================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ============LICENSE_END=========================================================
+ */
+
+(function () {
+    'use strict';
+
+    appDS2.controller("reportModalInstanceController", ["$uibModalInstance", "$scope", "$window", "ReportService", "errorMsg", "requestInfo", reportModalInstanceController]);
+
+    function reportModalInstanceController($uibModalInstance, $scope, $window, ReportService, errorMsg, requestInfo) {
+        const vm = this;
+
+        const init = function() {
+            vm.timestamp =  ReportService.getReportTimeStamp();
+            vm.downloadEnable = false;
+            ReportService.getReportData(requestInfo).then(
+                response => {
+                    vm.saveReportData(response);
+                }, response => {
+                    vm.printReportFail(response);
+                });
+        };
+
+        vm.saveReportData = function(response) {
+            vm.report = errorMsg + "\n\n Collected data from API:\n" + JSON.stringify(response.data,  null, "\t") ;
+
+            const blob = new Blob([ vm.report ], { type : 'text/plain' });
+            vm.download = ($window.URL || $window.webkitURL).createObjectURL( blob );
+            vm.downloadEnable = true;
+        };
+
+        vm.printReportFail = function(response) {
+            vm.downloadEnable = false;
+            vm.report = errorMsg + "\n\n API error:\n" + JSON.stringify(response.data,  null, "\t") ;
+        };
+
+
+        vm.close = function () {
+            $uibModalInstance.close();
+        };
+
+        vm.ok = function () {
+            $uibModalInstance.close(true);
+        };
+
+        init();
+    }
+})();
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/report-modal/report-modal-request.controller.test.js b/vid-app-common/src/main/webapp/app/vid/scripts/modals/report-modal/report-modal-request.controller.test.js
new file mode 100644
index 000000000..87edca319
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/report-modal/report-modal-request.controller.test.js
@@ -0,0 +1,107 @@
+/*-
+ * ============LICENSE_START=======================================================
+ * VID
+ * ================================================================================
+ * Copyright (C) 2019 Nokia Intellectual Property. All rights reserved.
+ * ================================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ============LICENSE_END=========================================================
+ */
+
+require('./report-modal-request.controller');
+const jestMock = require('jest-mock');
+
+describe('Testing error report creation', () => {
+    let $notNeeded;
+    let $controller;
+
+    let mockHttp;
+
+    let mockModalInstance;
+    let mockWindow;
+    let mockReportService;
+    let testErrorMsg;
+
+    let correctResponse;
+    let failResponse;
+
+    let mockInfo;
+
+    beforeEach(
+        angular.mock.module('app')
+    );
+
+    beforeEach(inject(function (_$controller_) {
+        $notNeeded = jestMock.fn();
+        mockHttp = jestMock.fn();
+
+        mockModalInstance = {};
+        mockWindow = {
+            webkitURL: {
+                createObjectURL: function (blob) {
+                    return blob;
+                }
+            }
+        };
+
+        correctResponse = {data:{report:"test-error-report",status:202}};
+        failResponse = {data:{report:"test-fail-report",status:404}};
+
+        mockReportService = {
+
+            getReportData: function(info) {
+                return Promise.resolve(correctResponse);
+            },
+            getReportTimeStamp: function () {
+                return "testTime";
+            }
+        };
+
+        testErrorMsg = 'testing message';
+
+        $controller = _$controller_('reportModalInstanceController',{
+            $uibModalInstance: mockModalInstance,
+            $scope: $notNeeded,
+            $window: mockWindow,
+            ReportService: mockReportService,
+            errorMsg: testErrorMsg,
+            requestInfo: mockInfo
+        });
+    }));
+
+    test('Verify close will call close in modal instance', () => {
+        mockModalInstance.close = jestMock.fn();
+
+        $controller.close();
+
+        expect(mockModalInstance.close).toHaveBeenCalled();
+    });
+
+    test('Verify report was constructed properly', () => {
+
+        $controller.saveReportData(correctResponse);
+
+        expect($controller.report).toEqual(testErrorMsg + "\n\n Collected data from API:\n" + JSON.stringify(correctResponse.data,  null, "\t"));
+        expect($controller.downloadEnable).toBeTruthy();
+        expect($controller.download).toEqual(new Blob([ $controller.report ], { type : 'text/plain' }));
+    });
+
+    test('Verify report contains error if API did not respond', () => {
+
+        $controller.printReportFail(failResponse);
+
+        expect($controller.report).toEqual(testErrorMsg + "\n\n API error:\n" + JSON.stringify(failResponse.data,  null, "\t"));
+        expect($controller.downloadEnable).toBeFalsy();
+    });
+
+});
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/report-modal/report-modal.controller.js b/vid-app-common/src/main/webapp/app/vid/scripts/modals/report-modal/report-modal.controller.js
new file mode 100644
index 000000000..6ec5c4154
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/report-modal/report-modal.controller.js
@@ -0,0 +1,63 @@
+/*-
+ * ============LICENSE_START=======================================================
+ * VID
+ * ================================================================================
+ * Copyright (C) 2019 NOKIA Intellectual Property. All rights reserved.
+ * ================================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ============LICENSE_END=========================================================
+ */
+
+(function () {
+    'use strict';
+
+    appDS2.controller("reportModalController", ["$uibModalInstance", "$scope", "$window", "ReportService", "errorMsg", reportModalController]);
+
+    function reportModalController($uibModalInstance, $scope, $window, ReportService, errorMsg) {
+        const vm = this;
+
+        const init = function() {
+            vm.timestamp =  ReportService.getReportTimeStamp();
+            vm.downloadEnable = false;
+            ReportService.getReportData({}).then(
+                response => {
+                    vm.saveReportData(response);
+                }, response => {
+                    vm.printReportFail(response);
+                });
+        };
+
+        vm.saveReportData = function(response) {
+            vm.report = errorMsg + "\n\n Collected data from API:\n" + JSON.stringify(response.data,  null, "\t") ;
+
+            const blob = new Blob([ vm.report ], { type : 'text/plain' });
+            vm.download = ($window.URL || $window.webkitURL).createObjectURL( blob );
+            vm.downloadEnable = true;
+        };
+
+        vm.printReportFail = function(response) {
+            vm.downloadEnable = false;
+            vm.report = errorMsg + "\n\n API error:\n" + JSON.stringify(response.data,  null, "\t") ;
+        };
+
+        vm.close = function () {
+            $uibModalInstance.close();
+        };
+
+        vm.ok = function () {
+            $uibModalInstance.close(true);
+        };
+
+        init();
+    }
+})();
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/report-modal/report-modal.controller.test.js b/vid-app-common/src/main/webapp/app/vid/scripts/modals/report-modal/report-modal.controller.test.js
new file mode 100644
index 000000000..da834ba69
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/report-modal/report-modal.controller.test.js
@@ -0,0 +1,104 @@
+/*-
+ * ============LICENSE_START=======================================================
+ * VID
+ * ================================================================================
+ * Copyright (C) 2019 Nokia Intellectual Property. All rights reserved.
+ * ================================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ============LICENSE_END=========================================================
+ */
+
+require('./report-modal.controller');
+const jestMock = require('jest-mock');
+
+describe('Testing error report creation', () => {
+    let $notNeeded;
+    let $controller;
+
+    let mockHttp;
+
+    let mockModalInstance;
+    let mockWindow;
+    let mockReportService;
+    let testErrorMsg;
+
+    let correctResponse;
+    let failResponse;
+
+    beforeEach(
+        angular.mock.module('app')
+    );
+
+    beforeEach(inject(function (_$controller_) {
+        $notNeeded = jestMock.fn();
+        mockHttp = jestMock.fn();
+
+        mockModalInstance = {};
+        mockWindow = {
+            webkitURL: {
+                    createObjectURL: function (blob) {
+                        return blob;
+                }
+            }
+        };
+
+        correctResponse = {data:{report:"test-error-report",status:202}};
+        failResponse = {data:{report:"test-fail-report",status:404}};
+
+        mockReportService = {
+
+            getReportData: function() {
+                return Promise.resolve(correctResponse);
+            },
+            getReportTimeStamp: function () {
+                return "testTime";
+            }
+        };
+
+        testErrorMsg = 'testing message';
+
+        $controller = _$controller_('reportModalController',{
+            $uibModalInstance: mockModalInstance,
+            $scope: $notNeeded,
+            $window: mockWindow,
+            ReportService: mockReportService,
+            errorMsg: testErrorMsg
+        });
+    }));
+
+    test('Verify close will call close in modal instance', () => {
+        mockModalInstance.close = jestMock.fn();
+
+        $controller.close();
+
+        expect(mockModalInstance.close).toHaveBeenCalled();
+    });
+
+    test('Verify report was constructed properly', () => {
+
+        $controller.saveReportData(correctResponse);
+
+        expect($controller.report).toEqual(testErrorMsg + "\n\n Collected data from API:\n" + JSON.stringify(correctResponse.data,  null, "\t"));
+        expect($controller.downloadEnable).toBeTruthy();
+        expect($controller.download).toEqual(new Blob([ $controller.report ], { type : 'text/plain' }));
+    });
+
+    test('Verify report contains error if API did not respond', () => {
+
+        $controller.printReportFail(failResponse);
+
+        expect($controller.report).toEqual(testErrorMsg + "\n\n API error:\n" + JSON.stringify(failResponse.data,  null, "\t"));
+        expect($controller.downloadEnable).toBeFalsy();
+    });
+
+});
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/report-modal/report-modal.css b/vid-app-common/src/main/webapp/app/vid/scripts/modals/report-modal/report-modal.css
new file mode 100644
index 000000000..77b935413
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/report-modal/report-modal.css
@@ -0,0 +1,4 @@
+.download-button{
+    text-decoration: none !important;
+    text-underline: none;
+}
\ No newline at end of file
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/report-modal/report-modal.html b/vid-app-common/src/main/webapp/app/vid/scripts/modals/report-modal/report-modal.html
new file mode 100644
index 000000000..58e4c499e
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/report-modal/report-modal.html
@@ -0,0 +1,35 @@
+<!--
+  ============LICENSE_START=======================================================
+  VID
+  ================================================================================
+  Copyright (C) 2019 NOKIA Intellectual Property. All rights reserved.
+  ================================================================================
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+  ============LICENSE_END=========================================================
+  -->
+
+<link rel="stylesheet" type="text/css" href="app/vid/styles/modals.css">
+<link rel="stylesheet" type="text/css" href="app/vid/styles/modal-create-new.css" />
+<link rel="stylesheet" type="text/css" href="app/vid/scripts/modals/report-modal/report-modal.css" />
+
+<div class="modal-header">
+    <h3 id="modal-title">Error report</h3>
+</div>
+<div class="modal-body">
+    <textarea style="height: 500px">{{vm.report}}</textarea>
+</div>
+<div class="modal-footer">
+    <a ngx-enabled="{{vm.downloadEnable}}" att-button download="VID_fault_report_{{vm.timestamp}}.txt" ng-href="{{vm.download}}" btn-type="primary" size="small" class="download-button" >Download report</a>
+    <button type="button" data-tests-id="cancelButton" ng-click="vm.close();" att-button
+            btn-type="primary" size="small" >Close</button>
+</div>
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/services/reportService.js b/vid-app-common/src/main/webapp/app/vid/scripts/services/reportService.js
new file mode 100644
index 000000000..0b401dcb2
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/services/reportService.js
@@ -0,0 +1,27 @@
+"use strict";
+
+var ReportService = function ( $http ) {
+
+    return {
+
+        getReportData: function(requestInfo) {
+            return $http.post("error-report",requestInfo);
+        },
+
+        getReportTimeStamp: function () {
+            const today = new Date();
+            const se = String(today.getSeconds()).padStart(2, '0');
+            const mi = String(today.getMinutes()).padStart(2, '0');
+            const hr = String(today.getHours()).padStart(2, '0');
+            const dd = String(today.getDate()).padStart(2, '0');
+            const mm = String(today.getMonth() + 1).padStart(2, '0');
+            const yyyy = today.getFullYear();
+
+            return hr + '-' + mi + '-' + se + "_" + dd + '-' + mm + '-' + yyyy;
+        }
+
+    }
+
+};
+
+appDS2.factory("ReportService", ["$http", ReportService]);
\ No newline at end of file
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiGetSubs.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiGetSubs.htm
index 3597e57b5..ba9960f0b 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiGetSubs.htm
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiGetSubs.htm
@@ -29,7 +29,8 @@
             <label>Status:</label><span class="status">{{status}}</span>

         </div>

 

-        <div ng-if="errorMsg != null"><font color='red'>{{errorMsg}}

+        <div ng-if="errorMsg != null"><font color='red'>{{errorMsg}}<br/>

+            <button class="btn btn-danger" ng-click="showReportWindow()" ng-if="isShowErrorReport()">create report</button>

             <pre>{{errorDetails | json}}</pre>

         </font></div>

 

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiGetSubscriberList.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiGetSubscriberList.htm
index 2d04067f1..7081fdba0 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiGetSubscriberList.htm
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiGetSubscriberList.htm
@@ -29,7 +29,8 @@
             <label>Status:</label><span class="status">{{status}}</span>

         </div>

 

-        <div ng-if="errorMsg != null"><font color='red'>{{errorMsg}}

+        <div ng-if="errorMsg != null"><font color='red'>{{errorMsg}}<br/>

+            <button class="btn btn-danger" ng-click="showReportWindow()" ng-if="isShowErrorReport()">create report</button>

             <pre>{{errorDetails | json}}</pre>

         </font></div>

 

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiServiceTypes.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiServiceTypes.htm
index cc69fb580..68aaec50e 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiServiceTypes.htm
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiServiceTypes.htm
@@ -28,7 +28,11 @@
 			<img src="app/vid/images/spinner.gif"></img>

 			<label>Status:</label><span class="status">{{status}}</span>

 		</div>

-		<div ng-if="errorMsg != null"><font color='red'>{{errorMsg}}<pre>{{errorDetails | json}}</pre></font></div>

+		<div ng-if="errorMsg != null">

+			<font color='red'>{{errorMsg}}<br/>

+			<button class="btn btn-danger" ng-click="showReportWindow()" ng-if="isShowErrorReport()">Create report</button>

+			<pre>{{errorDetails | json}}</pre></font>

+		</div>

 		<h2 class="heading2"><center>Create New Service Instance</center></h2>

 		

 		<table class="create-instance-service ">

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiSubDetails.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiSubDetails.htm
index 6c2dfc67a..4b9f8b03c 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiSubDetails.htm
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiSubDetails.htm
@@ -27,7 +27,10 @@
 				<label>Status:</label><span class="status">{{status}}</span>

 			</div>

 

-			<div data-tests-id="subDetailsErrMsg" ng-if="errorMsg != null"><font color='red'>{{errorMsg}}<pre>{{errorDetails | json}}</pre></font></div>

+			<div data-tests-id="subDetailsErrMsg" ng-if="errorMsg != null">

+				<font color='red'>{{errorMsg}}<pre>{{errorDetails | json}}</pre></font>

+				<button class="btn btn-danger" ng-click="showReportWindow()" ng-if="isShowErrorReport()">Create report</button>

+			</div>

 	

 			 <h1 class="heading1"><center>Subscriber Details for {{selectedSubscriberId}} ({{selectedSubscriberName}})</center></h1>

 	     		<br>

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiSubViewEdit.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiSubViewEdit.htm
index 158c831e7..0e0bb94c7 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiSubViewEdit.htm
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiSubViewEdit.htm
@@ -27,6 +27,13 @@
         <div ng-include="'app/vid/scripts/view-models/detailsDialog.htm'"></div>

     </div>

 

+    <div ng-if="errorMsg != null">

+        <font color='red'>{{errorMsg}}<br/>

+            <button class="btn btn-danger" ng-click="showReportWindow()" ng-if="isShowErrorReport()">Create report</button>

+            <pre>{{errorDetails | json}}</pre>

+        </font>

+    </div>

+

     <div>

         <div class="statusLine">

             <img src="app/vid/images/spinner.gif"

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/createInstanceServiceModels.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/createInstanceServiceModels.htm
index 819f79d97..4aa37c9db 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/createInstanceServiceModels.htm
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/createInstanceServiceModels.htm
@@ -33,7 +33,12 @@
 			<img src="app/vid/images/spinner.gif"></img>

 			</span>

 			<span class="statusLine" ng-class="{true:'progVisible', false:'progHidden'}[isProgressVisible]">

-			<label>Status:</label><span class="status"><span ng-show="error"><font color='red'><b>Error: </b></font></span>{{status}}</span>

+			<label>Status:</label><span class="status">

+				<span ng-show="error"><font color='red'><b>Error: </b></font>{{status}}<br/>

+				<button class="btn btn-danger" ng-click="showReportWindow()" ng-if="isShowErrorReport()">Create report</button>

+				</span>

+			</span>

+

 		</span>

 	<br><br>

 	

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/creationDialog.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/creationDialog.htm
index 75f6b68af..49d3ef868 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/creationDialog.htm
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/creationDialog.htm
@@ -33,9 +33,11 @@
 			</div>

 			<div class="buttonRow">

 				<button data-tests-id="confirmButton" ngx-enabled="{{isConfirmEnabled}}" att-button size="small"

-					ng-click="confirm();">Confirm</button>

+						ng-click="confirm();">Confirm</button>

 				<button type="button" data-tests-id="cancelButton" ng-click="cancel();" att-button

-					btn-type="primary" size="small">Cancel</button>

+						btn-type="primary" size="small">Cancel</button>

+				<button class="btn-danger" ng-if="isShowErrorReport() && isServiceError" att-button size="small"

+						ng-click="showReportWindow()">Create report</button>

 			</div>

 		</div>

 	</div>

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/msoCommit.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/msoCommit.htm
index 14851f9e2..10179243e 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/msoCommit.htm
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/msoCommit.htm
@@ -43,6 +43,8 @@
 	<div class="buttonRow">

 		<button data-tests-id="msoCommitDialogCloseButton" ngx-enabled="{{isCloseEnabled}}" att-button size="small"

 			ng-click="close();">Close</button>

+		<button class="btn-danger" att-button size="small" ng-show="!isProgressVisible"

+				ng-click="showReportWindow()">Create report</button>

 	</div>

 </div>

-</div>

+</div>
\ No newline at end of file
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/serviceModels.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/serviceModels.htm
index 06cccfcd9..4570a0b08 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/serviceModels.htm
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/serviceModels.htm
@@ -30,7 +30,9 @@
 			<img src="app/vid/images/spinner.gif"></img>

 			</span>

 			<span class="statusLine" ng-class="{true:'progVisible', false:'progHidden'}[isProgressVisible]">

-			<label>Status:</label><span class="status"><span ng-show="error"><font color='red'><b>Error: </b></font></span>{{status}}</span>

+			<label>Status:</label><span class="status"><span ng-show="error"><font color='red'><b>Error: </b></font></span>{{status}} <br/>

+			<button ng-show="error" class="btn btn-danger" ng-click="showReportWindow()" ng-if="isShowErrorReport()">create report</button>

+			</span>

 		</span>

 	<br><br>