Merge pull request #2991 from SEED-platform/2930/mapping-uiux

2930/mapping uiux
SEED-platform · Nov 5, 2021 · b95ac1b · b95ac1b
2 parents c4ad5fc + 02339df
commit b95ac1b
Show file tree

Hide file tree

Showing 3 changed files with 47 additions and 15 deletions.
diff --git a/seed/static/seed/js/controllers/data_upload_modal_controller.js b/seed/static/seed/js/controllers/data_upload_modal_controller.js
@@ -651,7 +651,15 @@ angular.module('BE.seed.controller.data_upload_modal', [])
                   // this only occurs in buildingsync, where we are not actually merging properties
                   // thus we will always end up at step 10
                   $scope.step_10_style = 'danger';
-                  $scope.step_10_file_message = 'Warning(s)/Error(s) occurred while processing the file(s):\n' + JSON.stringify(progress_data.file_info, null, 2);
+                  $scope.step_10_file_message = 'Warnings and/or errors occurred while processing the file(s).';
+                  $scope.match_issues = []
+                  for (let file_name in progress_data.file_info) {
+                    $scope.match_issues.push({
+                      'file': file_name,
+                      'errors': progress_data.file_info[file_name].errors,
+                      'warnings': progress_data.file_info[file_name].warnings
+                    });
+                  }
                 }
 
                 // Toggle a meter import button if the imported file also has a meters tab

diff --git a/seed/static/seed/partials/data_upload_modal.html b/seed/static/seed/partials/data_upload_modal.html
@@ -155,7 +155,7 @@ <h4 class="modal-title" ng-switch-when="16" translate>PM_METER_IMPORT_RESULTS</h
         </div>
         <div class="row" ng-if="buildingsync_issues != null && buildingsync_issues.length > 0">
             <div class="col-sm-12">
-                <div ng-repeat="file_issues in buildingsync_issues">
+                <div ng-repeat="issues in buildingsync_issues">
                     <ng-include src="::urls.static_url + 'seed/partials/import_messages.html'"></ng-include>
                 </div>
             </div>
@@ -299,10 +299,14 @@ <h4 class="modal-title" ng-switch-when="16" translate>PM_METER_IMPORT_RESULTS</h
             </div>
             <div class="alert alert-{$ step_10_style $}">
                 <span ng-show="step_10_error_message">{$ step_10_error_message | translate $}</span>
-                <span ng-show="step_10_file_message"><pre>{$ step_10_file_message $}</pre></span>
+                <span ng-show="step_10_file_message">{$ step_10_file_message $}</span>
                 <span ng-hide="step_10_error_message || step_10_file_message" translate="IMPORT_ANOTHER_QUESTION"></span>
             </div>
-            <div class="form-group col-sm-12"></div>
+            <div class="col-sm-12">
+                <div ng-repeat="issues in match_issues">
+                    <ng-include src="::urls.static_url + 'seed/partials/import_messages.html'"></ng-include>
+                </div>
+            </div>
         </div>
     </div>
     <!-- Step 11: Save Mappings Permanently  -->
@@ -319,7 +323,7 @@ <h4 class="modal-title" ng-switch-when="16" translate>PM_METER_IMPORT_RESULTS</h
                 <pre class="text-wrap" ng-class="{'pre-scrollable': step_12_error_message.length >= 300}" ng-show="step_12_error_message && !step_12_buildingsync_validation_error">{$ step_12_error_message | json $}</pre>
                 <span ng-if="step_12_buildingsync_validation_error">
                     <div class="alert alert-danger">BuildingSync file(s) failed to validate. No files were imported. Please fix the errors and re-upload the corrected file(s).</div>
-                    <div ng-repeat="file_issues in buildingsync_issues">
+                    <div ng-repeat="issues in buildingsync_issues">
                         <ng-include src="::urls.static_url + 'seed/partials/import_messages.html'"></ng-include>
                     </div>
                 </span>

diff --git a/seed/static/seed/partials/import_messages.html b/seed/static/seed/partials/import_messages.html
@@ -1,33 +1,53 @@
-<h4>{$ file_issues.file $}</h4>
+<h4>{$ issues.file $}</h4>
 <uib-accordion>
 
-    <div uib-accordion-group ng-if="file_issues.schema_errors.length > 0" class="panel-danger" is-open="schema_errors[$index].open">
+    <div uib-accordion-group ng-if="issues.errors.length > 0" class="panel-danger" is-open="errors[$index].open">
         <uib-accordion-heading>
-            <b>Schema Errors</b> <small>({$:: file_issues.schema_errors.length $})</small>
+            <b>Errors</b> <small>({$:: issues.errors.length $})</small>
+            <i class="pull-right glyphicon" ng-class="{'glyphicon-chevron-down': errors[$index].open, 'glyphicon-chevron-right': !errors[$index].open}"></i>
+        </uib-accordion-heading>
+        <div class="clean-list">
+            <div ng-repeat="error in issues.errors" class="row">{$ error $}</div>
+        </div>
+    </div>
+
+    <div uib-accordion-group ng-if="issues.warnings.length > 0" class="panel-warning" is-open="warnings[$index].open">
+        <uib-accordion-heading>
+            <b>Warnings</b> <small>({$:: issues.warnings.length $})</small>
+            <i class="pull-right glyphicon" ng-class="{'glyphicon-chevron-down': warnings[$index].open, 'glyphicon-chevron-right': !warnings[$index].open}"></i>
+        </uib-accordion-heading>
+        <div class="clean-list">
+            <div ng-repeat="warn in issues.warnings" class="row">{$ warn $}</div>
+        </div>
+    </div>
+
+    <div uib-accordion-group ng-if="issues.schema_errors.length > 0" class="panel-danger" is-open="schema_errors[$index].open">
+        <uib-accordion-heading>
+            <b>Schema Errors</b> <small>({$:: issues.schema_errors.length $})</small>
             <i class="pull-right glyphicon" ng-class="{'glyphicon-chevron-down': schema_errors[$index].open, 'glyphicon-chevron-right': !schema_errors[$index].open}"></i>
         </uib-accordion-heading>
         <div class="clean-list">
-            <div ng-repeat="error in file_issues.schema_errors" class="row">{$ error $}</div>
+            <div ng-repeat="error in issues.schema_errors" class="row">{$ error $}</div>
         </div>
     </div>
 
-    <div uib-accordion-group ng-if="file_issues.use_case_errors.length > 0" class="panel-danger" is-open="use_case_errors[$index].open">
+    <div uib-accordion-group ng-if="issues.use_case_errors.length > 0" class="panel-danger" is-open="use_case_errors[$index].open">
         <uib-accordion-heading>
-            <b>Use Case Errors</b> <small>({$:: file_issues.use_case_errors.length $})</small>
+            <b>Use Case Errors</b> <small>({$:: issues.use_case_errors.length $})</small>
             <i class="pull-right glyphicon" ng-class="{'glyphicon-chevron-down': use_case_errors[$index].open, 'glyphicon-chevron-right': !use_case_errors[$index].open}"></i>
         </uib-accordion-heading>
         <div class="clean-list">
-            <div ng-repeat="error in file_issues.use_case_errors" class="row">{$ error $}</div>
+            <div ng-repeat="error in issues.use_case_errors" class="row">{$ error $}</div>
         </div>
     </div>
 
-    <div uib-accordion-group ng-if="file_issues.use_case_warnings.length > 0" class="panel-warning" is-open="use_case_warnings[$index].open">
+    <div uib-accordion-group ng-if="issues.use_case_warnings.length > 0" class="panel-warning" is-open="use_case_warnings[$index].open">
         <uib-accordion-heading>
-            <b>Use Case Warnings</b> <small>({$:: file_issues.use_case_warnings.length $})</small>
+            <b>Use Case Warnings</b> <small>({$:: issues.use_case_warnings.length $})</small>
             <i class="pull-right glyphicon" ng-class="{'glyphicon-chevron-down': use_case_warnings[$index].open, 'glyphicon-chevron-right': !use_case_warnings[$index].open}"></i>
         </uib-accordion-heading>
         <div class="clean-list">
-            <div ng-repeat="warn in file_issues.use_case_warnings" class="row">{$ warn $}</div>
+            <div ng-repeat="warn in issues.use_case_warnings" class="row">{$ warn $}</div>
         </div>
     </div>