Merge pull request #145 from sunbird-cb/onboarding

Onboarding
sunbird-cb · Jul 7, 2022 · e5f339a · e5f339a
2 parents 75101a9 + 82d6324
commit e5f339a
Show file tree

Hide file tree

Showing 6 changed files with 134 additions and 22 deletions.
diff --git a/project/ws/app/src/lib/routes/state-profile/routes/consultancy/consultancy.component.ts b/project/ws/app/src/lib/routes/state-profile/routes/consultancy/consultancy.component.ts
@@ -26,6 +26,7 @@ export class ConsultancyComponent implements OnInit {
     deleteBodyRef: ElementRef | null = null
     editValue: any
     textBoxActive = false
+    isConsultancy = false
 
     constructor(
         private orgSvc: OrgProfileService,
@@ -46,15 +47,28 @@ export class ConsultancyComponent implements OnInit {
         // If projects are added then only validation is required, so by default validation is true, so that user can go to next tab
         this.orgSvc.updateFormStatus('consultancy', true)
 
+    }
+
+    ngOnInit() {
         // pre poluate form fields when data is available (edit mode)
         if (this.configSvc.unMappedUser && this.configSvc.unMappedUser.orgProfile) {
             const consultancyData = _.get(this.configSvc.unMappedUser.orgProfile, 'profileDetails.consultancy')
             this.addedconsultancies = _.get(consultancyData, 'projects') || []
             this.orgSvc.updateFormStatus('consultancy', true)
         }
-    }
 
-    ngOnInit() {
+        // if Roles and functions tab has "Research" checked then check for atleast 1 prject
+        let rolesAndFunctions: any
+        if (JSON.stringify(this.orgSvc.formValues.rolesAndFunctions) === '{}') {
+            rolesAndFunctions = _.get(this.configSvc.unMappedUser.orgProfile, 'profileDetails.rolesAndFunctions')
+        } else {
+            rolesAndFunctions = _.get(this.orgSvc.formValues, 'rolesAndFunctions')
+        }
+        if (rolesAndFunctions.consultancy) {
+            this.isConsultancy = true
+            // this.removeValidators()
+            this.orgSvc.updateFormStatus('consultancy', (this.addedconsultancies.length > 0))
+        }
     }
 
     addProject() {
@@ -141,7 +155,12 @@ export class ConsultancyComponent implements OnInit {
         }
         this.orgSvc.updateLocalFormValue('consultancy', localData)
         // this.orgSvc.updateFormStatus('consultancy', (this.addedconsultancies.length > 0))
-        this.orgSvc.updateFormStatus('consultancy', true)
+        if (this.isConsultancy) {
+            // tslint:disable-next-line: max-line-length
+            this.orgSvc.updateFormStatus('consultancy', (this.addedconsultancies.length > 0))
+        } else {
+            this.orgSvc.updateFormStatus('consultancy', true)
+        }
     }
 
     resetConsultancyForm() {

diff --git a/project/ws/app/src/lib/routes/state-profile/routes/research/research.component.ts b/project/ws/app/src/lib/routes/state-profile/routes/research/research.component.ts
@@ -34,6 +34,7 @@ export class ResearchComponent implements OnInit {
     editPaperValue: any
     textBoxActive = false
     textBoxActive1 = false
+    isResearch = false
 
     constructor(
         private orgSvc: OrgProfileService,
@@ -58,6 +59,9 @@ export class ResearchComponent implements OnInit {
         // setting this to true so that form validation is not required based on number added projects or papers
         this.orgSvc.updateFormStatus('research', true)
 
+    }
+
+    ngOnInit() {
         // pre poluate form fields when data is available (edit mode)
         if (this.configSvc.unMappedUser && this.configSvc.unMappedUser.orgProfile) {
             const researchData = _.get(this.configSvc.unMappedUser.orgProfile, 'profileDetails.research')
@@ -67,9 +71,19 @@ export class ResearchComponent implements OnInit {
             // this.orgSvc.updateFormStatus('research', (this.addedPapers.length > 0 && this.addedPrograms.length > 0))
             this.orgSvc.updateFormStatus('research', true)
         }
-    }
 
-    ngOnInit() {
+        // if Roles and functions tab has "Research" checked then check for atleast 1 prject
+        let rolesAndFunctions: any
+        if (JSON.stringify(this.orgSvc.formValues.rolesAndFunctions) === '{}') {
+            rolesAndFunctions = _.get(this.configSvc.unMappedUser.orgProfile, 'profileDetails.rolesAndFunctions')
+        } else {
+            rolesAndFunctions = _.get(this.orgSvc.formValues, 'rolesAndFunctions')
+        }
+        if (rolesAndFunctions.research) {
+            this.isResearch = true
+            // this.removeValidators()
+            this.orgSvc.updateFormStatus('research', (this.addedPrograms.length > 0))
+        }
     }
 
     addProgram() {
@@ -234,7 +248,13 @@ export class ResearchComponent implements OnInit {
             researchPapers: this.addedPapers,
         }
         this.orgSvc.updateLocalFormValue('research', localData)
-        this.orgSvc.updateFormStatus('research', true)
+        if (this.isResearch) {
+            // tslint:disable-next-line: max-line-length
+            this.orgSvc.updateFormStatus('research', (this.addedPrograms.length > 0))
+        } else {
+            this.orgSvc.updateFormStatus('research', true)
+        }
+
         // this.orgSvc.updateFormStatus('research', (this.addedPapers.length > 0 && this.addedPrograms.length > 0))
     }
 

diff --git a/.../app/src/lib/routes/state-profile/routes/training-rograms/training-rograms.component.html b/.../app/src/lib/routes/state-profile/routes/training-rograms/training-rograms.component.html
@@ -13,9 +13,9 @@ <h2>Training Programs</h2>
             <div class="input-wrapper margin-top-s flex flex-col flex-1 margin-bottom-m">
                 <div class="flex flex-col">
                     <div class="flex flex-col">
-                        <label class="margin-remove-bottom form-label flex mat-subheading-2 required"
+                        <label class="margin-remove-bottom form-label flex mat-subheading-2 "
                             i18n="Subjects on which the institute imparts training Label" i18n-aria-label
-                            aria-label="Subjects label">
+                            aria-label="Subjects label" [ngClass]="{'required': hasRequiredField('subjectName')}">
                             Add the subjects on which the institute imparts training
                         </label>
                     </div>
@@ -51,8 +51,8 @@ <h2>Training Programs</h2>
             </div>
 
             <div class="input-wrapper flex flex-col flex-1 margin-bottom-xl">
-                <label class=" form-label flex mat-subheading-2 required margin-remove-bottom" i18n="" i18n-aria-label
-                    aria-label="">
+                <label class=" form-label flex mat-subheading-2  margin-remove-bottom" i18n="" i18n-aria-label
+                    aria-label="" [ngClass]="{'required': hasRequiredField('conductDigitalPrograms')}">
                     Does the institute conduct Digital Programs?
                 </label>
                 <div class="flex button_box flex-row margin-top-m">
@@ -75,7 +75,7 @@ <h2>Training Programs</h2>
 
             <div class="input-wrapper flex flex-col flex-1 margin-bottom-xl ">
                 <label class="margin-remove-bottom form-label flex mat-subheading-2 required" i18n="" i18n-aria-label
-                    aria-label="">
+                    aria-label="" [ngClass]="{'required': hasRequiredField('prepareDigitalContent')}">
                     Does the institute prepare digital content?
                 </label>
                 <div class="flex button_box flex-row margin-top-m">
@@ -101,9 +101,10 @@ <h2>Training Programs</h2>
                 <div class="flex flex-col">
                     <div class="flex flex-col">
                         <div class="flex flex-1">
-                            <label class=" margin-remove-bottom form-label flex mat-subheading-2 required"
+                            <label class=" margin-remove-bottom form-label flex mat-subheading-2"
                                 i18n="Number of videos label|Label which explains the user to Number of videos"
-                                i18n-aria-label aria-label="Number of videos label">
+                                i18n-aria-label aria-label="Number of videos label"
+                                [ngClass]="{'required': hasRequiredField('videoCount')}">
                                 Number of videos
                             </label>
                         </div>
@@ -121,9 +122,10 @@ <h2>Training Programs</h2>
 
                     <div class="flex flex-col">
                         <div class="flex flex-1">
-                            <label class=" margin-remove-bottom form-label flex mat-subheading-2 required"
+                            <label class=" margin-remove-bottom form-label flex mat-subheading-2"
                                 i18n="Number of slide decks label|Label which explains the user to enter Number of slide decks"
-                                i18n-aria-label aria-label="Number of slide decks label">
+                                i18n-aria-label aria-label="Number of slide decks label"
+                                [ngClass]="{'required': hasRequiredField('pptCount')}">
                                 Number of slide decks (like Powerpoints or ppts)
                             </label>
                         </div>
@@ -141,9 +143,10 @@ <h2>Training Programs</h2>
 
                     <div class="flex flex-col">
                         <div class="flex flex-1">
-                            <label class=" margin-remove-bottom form-label flex mat-subheading-2 required required"
+                            <label class=" margin-remove-bottom form-label flex mat-subheading-2"
                                 i18n="Number of online reading materials label|Label which explains the user to enter Number of online reading materials"
-                                i18n-aria-label aria-label="Number of online reading materials label">
+                                i18n-aria-label aria-label="Number of online reading materials label"
+                                [ngClass]="{'required': hasRequiredField('otherMaterialCount')}">
                                 Number of online reading materials (like case studies, pdfs etc.)
                             </label>
                         </div>
@@ -164,7 +167,8 @@ <h2>Training Programs</h2>
                         <div class="flex flex-1">
                             <label class=" margin-remove-bottom form-label flex mat-subheading-2"
                                 i18n="Other information label|Label which explains the user to enter Other information"
-                                i18n-aria-label aria-label="Other information label">
+                                i18n-aria-label aria-label="Other information label"
+                                [ngClass]="{'required': hasRequiredField('otherInfo')}">
                                 Others (Add information on any other types of digital content that the institute
                                 prepares)
                             </label>
@@ -195,4 +199,4 @@ <h2>Training Programs</h2>
     </div> -->
 
 
-</div>
+</div>
diff --git a/...ws/app/src/lib/routes/state-profile/routes/training-rograms/training-rograms.component.ts b/...ws/app/src/lib/routes/state-profile/routes/training-rograms/training-rograms.component.ts
@@ -1,5 +1,5 @@
 import { Component, OnInit } from '@angular/core'
-import { FormControl, FormGroup, Validators } from '@angular/forms'
+import { AbstractControl, FormControl, FormGroup, Validators } from '@angular/forms'
 import { debounceTime, switchMap, takeUntil } from 'rxjs/operators'
 import { OrgProfileService } from '../../services/org-profile.service'
 import { Subject } from 'rxjs'
@@ -22,6 +22,7 @@ export class TrainingRogramsComponent implements OnInit {
     trainingProgramForm!: FormGroup
     selectedSubjects: any[] = []
     separatorKeysCodes: number[] = [ENTER, COMMA]
+    isTraining = false
     private unsubscribe = new Subject<void>()
     constructor(
         private orgSvc: OrgProfileService,
@@ -45,7 +46,12 @@ export class TrainingRogramsComponent implements OnInit {
                     if (formValue) {
                         formValue.selectedSubjects = this.selectedSubjects
                         this.orgSvc.updateLocalFormValue('trainingPrograms', formValue)
-                        this.orgSvc.updateFormStatus('trainingPrograms', this.trainingProgramForm.valid && this.selectedSubjects.length > 0)
+                        if (this.isTraining) {
+                            this.orgSvc.updateFormStatus('trainingPrograms', true)
+                        } else {
+                            // tslint:disable-next-line: max-line-length
+                            this.orgSvc.updateFormStatus('trainingPrograms', this.trainingProgramForm.valid && this.selectedSubjects.length > 0)
+                        }
                     }
                 }),
                 takeUntil(this.unsubscribe)
@@ -73,6 +79,29 @@ export class TrainingRogramsComponent implements OnInit {
             this.orgSvc.updateFormStatus('trainingPrograms', this.trainingProgramForm.valid)
         }
 
+        // if Roles and functions tab has "training" checked then only make this form valid else remove validation
+        let rolesAndFunctions: any
+        if (JSON.stringify(this.orgSvc.formValues.rolesAndFunctions) === '{}') {
+            rolesAndFunctions = _.get(this.configSvc.unMappedUser.orgProfile, 'profileDetails.rolesAndFunctions')
+        } else {
+            rolesAndFunctions = _.get(this.orgSvc.formValues, 'rolesAndFunctions')
+        }
+        if (!rolesAndFunctions.training) {
+            this.isTraining = true
+            this.removeValidators()
+            this.orgSvc.updateFormStatus('trainingPrograms', true)
+        }
+    }
+
+    public removeValidators() {
+        for (const key in this.trainingProgramForm.controls) {
+            if (key) {
+                // tslint:disable-next-line: no-non-null-assertion
+                this.trainingProgramForm!.get(key)!.clearValidators()
+                // tslint:disable-next-line: no-non-null-assertion
+                this.trainingProgramForm!.get(key)!.updateValueAndValidity()
+            }
+        }
     }
 
     addSubject(event: MatChipInputEvent) {
@@ -98,6 +127,10 @@ export class TrainingRogramsComponent implements OnInit {
         if (index >= 0) {
             this.selectedSubjects.splice(index, 1)
         }
+        if (this.trainingProgramForm.get('subjectName')) {
+            // tslint:disable-next-line: no-non-null-assertion
+            this.trainingProgramForm.get('subjectName')!.setValue(null)
+        }
     }
 
     openActivityDialog() {
@@ -114,4 +147,22 @@ export class TrainingRogramsComponent implements OnInit {
         })
     }
 
+    // isRequired(name: string): boolean {
+
+    //     // tslint:disable-next-line: no-non-null-assertion
+    //     return this.trainingProgramForm.get(name)!.validator(Validators.required) ?? false
+    //     // return !!this.trainingProgramForm.controls[name]!.validator(validator)!.hasOwnProperty(validator)
+    // }
+
+    hasRequiredField(name: string): boolean {
+        const abstractControl = this.trainingProgramForm.get(name)
+        if (abstractControl && abstractControl.validator) {
+            const validator = abstractControl.validator({} as AbstractControl)
+            if (validator && validator.required) {
+                return true
+            }
+        }
+        return false
+    }
+
 }
diff --git a/src/app/component/app-nav-bar/app-nav-bar.component.html b/src/app/component/app-nav-bar/app-nav-bar.component.html
@@ -77,10 +77,16 @@
 <mat-toolbar *ngIf="!showAppNavBar">
   <div class="fix-ww" id="root-tool-bar" title="toolbar" i18n-aria-label role="toolbar">
     <ng-container *ngIf="mode === 'top'">
-      <a class="logo-dim" role="link" title="Home" i18n-aria-title i18n-aria-label>
+      <a class="logo-dim" role="link" title="Home" i18n-aria-title i18n-aria-label routerLink="/app/home"
+        *ngIf="isSetUpPage">
+        <img [src]="appIcon" alt="Application Logo" class="app-logo" />
+      </a>
+      <a class="logo-dim" role="link" title="Home" i18n-aria-title i18n-aria-label routerLink="/public/home"
+        *ngIf="!isSetUpPage">
         <img [src]="appIcon" alt="Application Logo" class="app-logo" />
       </a>
     </ng-container>
+
   </div>
 </mat-toolbar>
 <ng-template #navbarSide let-item="item">

diff --git a/src/app/component/app-nav-bar/app-nav-bar.component.ts b/src/app/component/app-nav-bar/app-nav-bar.component.ts
@@ -32,6 +32,7 @@ export class AppNavBarComponent implements OnInit, OnChanges {
   isTourGuideAvailable = false
   isTourGuideClosed = false
   showAppNavBar = false
+  isSetUpPage = false
   popupTour: any
   constructor(
     private domSanitizer: DomSanitizer,
@@ -47,6 +48,7 @@ export class AppNavBarComponent implements OnInit, OnChanges {
       if (event instanceof NavigationStart) {
         this.cancelTour()
       } else if (event instanceof NavigationEnd) {
+        this.routeSubs(event)
         this.cancelTour()
       }
     })
@@ -93,6 +95,16 @@ export class AppNavBarComponent implements OnInit, OnChanges {
     })
   }
 
+  routeSubs(e: NavigationEnd) {
+    // this.router.events.subscribe((e: Event) => {
+    //   if (e instanceof NavigationEnd) {
+    if (e.url.includes('/app/setup')) {
+      this.isSetUpPage = true
+    } else {
+      this.isSetUpPage = false
+    }
+  }
+
   ngOnChanges(changes: SimpleChanges) {
     for (const property in changes) {
       if (property === 'mode') {