feat: #635 Spatial submission overview FAQ (#657)

* Building new app-submission-overview-faq component and replace SubmissionFormatOverviewComponent. * Add more faq sections * Add more sections for overview * Dummy change to trigger api deploy * Some styling changes. * add style to highlight dropdown item. * Minor wording update * Rename/remove previous submission-format-overview component * Revert accidently committed local setting. * Remove comment out code. * Add download faq pdf * Fix file name typo and add missing <a> hover color. * Document update. * Minor doc update. * update pdf file * Additional changes for minor wording license to licence. * Minor label change. * Minor adjustment lable again.
bcgov · Aug 7, 2024 · c356942 · c356942
1 parent 1c1a325
commit c356942
Show file tree

Hide file tree

Showing 23 changed files with 429 additions and 466 deletions.
diff --git a/admin/src/app/foms/fom-add-edit/fom-add-edit.component.html b/admin/src/app/foms/fom-add-edit/fom-add-edit.component.html
@@ -204,11 +204,11 @@ <h1 class="text-muted">{{isCreate ? 'Add New' : 'Edit'}} FOM {{isCreate ? '' : '
             </div>
           </div>
 
-          <!-- Woodlot License Number Input -->
+          <!-- Woodlot Licence Number Input -->
           <div class="form-group col"
             *ngIf="fg.get('projectPlanCode').value == projectPlanCodeEnum.Woodlot">
             <label for="woodlot-id" [ngClass]="{'required': true}" style="white-space: nowrap;"
-            >Woodlot License Number</label>
+            >Woodlot Licence Number</label>
             <input
               type="text"
               class="form-control"

diff --git a/admin/src/app/foms/fom-add-edit/fom-add-edit.component.ts b/admin/src/app/foms/fom-add-edit/fom-add-edit.component.ts
@@ -15,12 +15,12 @@ import { AttachmentUploadService } from "@admin-core/utils/attachmentUploadServi
 import { MAX_FILEUPLOAD_SIZE } from '@admin-core/utils/constants/constantUtils';
 import { DatePipe, NgClass, NgFor, NgIf } from '@angular/common';
 import {
-  AttachmentResponse, DistrictResponse, ForestClientResponse,
-  ForestClientService,
-  ProjectCreateRequest,
-  ProjectPlanCodeEnum,
-  ProjectResponse,
-  ProjectService, WorkflowStateEnum
+    AttachmentResponse, DistrictResponse, ForestClientResponse,
+    ForestClientService,
+    ProjectCreateRequest,
+    ProjectPlanCodeEnum,
+    ProjectResponse,
+    ProjectService, WorkflowStateEnum
 } from '@api-client';
 import { RxFormBuilder, RxFormGroup } from '@rxweb/reactive-form-validators';
 import { User } from "@utility/security/user";
@@ -61,7 +61,7 @@ export class FomAddEditComponent implements OnInit, AfterViewInit, OnDestroy {
   districts: DistrictResponse[] = this.stateSvc.getCodeTable('district');
   projectPlanOptions: ICodeTable[] = [
     {"code": this.projectPlanCodeEnum.Fsp, "description": "Forest Stewardship Plan"},
-    {"code": this.projectPlanCodeEnum.Woodlot, "description": "Woodlot License Plan"}
+    {"code": this.projectPlanCodeEnum.Woodlot, "description": "Woodlot Licence Plan"}
   ];
   forestClients: ForestClientResponse[] = [];
   public supportingDocuments: any[] = [];

diff --git a/admin/src/app/foms/fom-add-edit/fom-add-edit.form.ts b/admin/src/app/foms/fom-add-edit/fom-add-edit.form.ts
@@ -53,7 +53,7 @@ export class FomAddEditForm implements Pick<ProjectResponse,
 
   @prop()
   @required({
-    message: 'Woodlot License Plan Number is required.',
+    message: 'Woodlot Licence Plan Number is required.',
 		conditionalExpression: (x) => {
 			return x.projectPlanCode == ProjectPlanCodeEnum.Woodlot
 		}

diff --git a/admin/src/app/foms/fom-detail/fom-detail.component.html b/admin/src/app/foms/fom-detail/fom-detail.component.html
@@ -97,7 +97,7 @@ <h2>Details</h2>
                       </span>
                     </li>
                     <li *ngIf="project.projectPlanCode == projectPlanCodeEnum.Woodlot">
-                      <span class="name">Woodlot License Number:</span>
+                      <span class="name">Woodlot Licence Number:</span>
                       <span
                         class="value">
                         {{project?.woodlotLicenseNumber}}

diff --git a/admin/src/app/foms/fom-submission/fom-submission.component.html b/admin/src/app/foms/fom-submission/fom-submission.component.html
@@ -79,7 +79,7 @@ <h1 class="text-muted">FSP ID: {{project.fspId}}</h1>
 
         <div class="sample-spatial-download" ngbDropdown>
           <button ngbDropdownToggle class="btn btn-sm btn-outline-primary" type="button">
-            Download Spatial Templates
+            Download Sample Spatial Files
           </button>
           <div ngbDropdownMenu>
             <a class="dropdown-item" href="assets/sample-spatial-files/sample_cut_block_file.json" download>Cut block</a>
@@ -167,8 +167,10 @@ <h1 class="text-muted">FSP ID: {{project.fspId}}</h1>
         </ul>
       </fieldset>
 
-      <div style="margin-top: 2.3rem;">
-        <app-submission-format-overview></app-submission-format-overview>
+      <hr/>
+
+      <div>
+        <app-submission-overview-faq></app-submission-overview-faq>
       </div>
 
     </form>

diff --git a/admin/src/app/foms/fom-submission/fom-submission.component.scss b/admin/src/app/foms/fom-submission/fom-submission.component.scss
@@ -128,4 +128,13 @@ table tr:nth-child(even) {
   span.action {
     @include flex(1 1 auto);
   }
+}
+
+.dropdown-menu {
+    .dropdown-item {
+        &:hover {
+            color: #fff;
+            background: #007bff;
+        }
+    }
 }
diff --git a/admin/src/app/foms/fom-submission/fom-submission.component.ts b/admin/src/app/foms/fom-submission/fom-submission.component.ts
@@ -1,19 +1,19 @@
+import { CognitoService } from "@admin-core/services/cognito.service";
+import { ModalService } from '@admin-core/services/modal.service';
+import { StateService } from '@admin-core/services/state.service';
 import { MAX_FILEUPLOAD_SIZE } from '@admin-core/utils/constants/constantUtils';
 import { DatePipe, NgFor, NgIf } from '@angular/common';
 import { AfterViewInit, Component, OnDestroy, OnInit } from '@angular/core';
 import { MatSnackBar, MatSnackBarRef, SimpleSnackBar } from '@angular/material/snack-bar';
 import { ActivatedRoute, Router } from '@angular/router';
-import { NgbDropdown, NgbDropdownMenu, NgbDropdownToggle } from '@ng-bootstrap/ng-bootstrap';
 import { ProjectResponse, ProjectService, SpatialObjectCodeEnum, SubmissionDetailResponse, SubmissionRequest, SubmissionService, SubmissionTypeCodeEnum, WorkflowStateEnum } from '@api-client';
+import { NgbDropdown, NgbDropdownMenu, NgbDropdownToggle } from '@ng-bootstrap/ng-bootstrap';
 import { RxFormBuilder, RxFormGroup } from '@rxweb/reactive-form-validators';
 import { User } from '@utility/security/user';
 import { Observable, Subject } from 'rxjs';
 import { map, switchMap, takeUntil } from 'rxjs/operators';
-import { CognitoService } from "@admin-core/services/cognito.service";
-import { ModalService } from '@admin-core/services/modal.service';
-import { StateService } from '@admin-core/services/state.service';
 import { FomSubmissionForm } from './fom-submission.form';
-import { SubmissionFormatOverviewComponent } from './submission-format-overview.component';
+import { SubmissionOverviewFaqComponent } from './submission-overview-faq.component';
 
 import { UploadBoxComponent } from '@admin-core/components/file-upload-box/file-upload-box.component';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
@@ -26,7 +26,7 @@ import { FormsModule, ReactiveFormsModule } from '@angular/forms';
         FormsModule, 
         ReactiveFormsModule, 
         NgFor, 
-        SubmissionFormatOverviewComponent, 
+        SubmissionOverviewFaqComponent, 
         DatePipe, 
         UploadBoxComponent,
         NgbDropdown,