Merge pull request #368 from GSuma21/release-2.6.0-changes

issue #feat session details page

src/app/app.component.ts

@@ -176,7 +176,7 @@ export class AppComponent {
   languageSetting() {
     this.localStorage.getLocalData(localKeys.SELECTED_LANGUAGE).then(data =>{
       if(data){
-        this.translate.use(data.value);
+        this.translate.use(data);
       } else {
       this.setLanguage('en');
       }

src/app/core/constants/urlConstants.ts

@@ -57,6 +57,7 @@ export const urlConstants = {
         MENTEES_LIST: "/mentoring/v1/mentees/list?page=",
         MENTORS_LIST: "/mentoring/v1/mentors/list?page=",
         FILTER_LIST: "/mentoring/v1/profile/filterList?",
-        DOWNLOAD_CREATED_SESSION_LIST_BY_SESSION_MANAGER:"/mentoring/v1/manage-sessions/downloadSessions?"
+        DOWNLOAD_CREATED_SESSION_LIST_BY_SESSION_MANAGER:"/mentoring/v1/manage-sessions/downloadSessions?",
+        ENROLLED_MENTEES_LIST:"/mentoring/v1/sessions/enrolledMentees/",
     }
 };

src/app/core/services/admin-workspace/admin-workapce.service.ts

@@ -64,5 +64,18 @@ export class AdminWorkapceService {
     } 
   }
 
+  async downloadMenteeList(id:any){
+    const config = {
+      url:  `${urlConstants.API_URLS.ENROLLED_MENTEES_LIST}${id}?csv=true`
+    };
+    try { 
+      let result = await this.httpService.getFile(config);
+      this.utilService.parseAndDownloadCSV(result.data, "manage_session_list")
+    }
+    catch (error) {  
+    } 
+  }
+
+
 
 }

src/app/core/services/auth/auth.service.ts

@@ -76,7 +76,7 @@ export class AuthService {
     this.profileService.isMentor = (this.user?.user_roles[0]?.title === 'mentor')
     this.userService.userEvent.next(this.user);
     await this.localStorage.setLocalData(localKeys.USER_DETAILS, this.user);
-    await this.localStorage.setLocalData(localKeys.SELECTED_LANGUAGE, this.user.preferred_language);
+    await this.localStorage.setLocalData(localKeys.SELECTED_LANGUAGE, this.user.preferred_language.value);
     this.translate.use(this.user.preferred_language)
     return this.user;
   }

src/app/core/services/session/session.service.ts

@@ -225,4 +225,18 @@ export class SessionService {
     catch (error) {
     }
   }
+
+  async getEnrolledMenteeList(id){
+    const config = {
+      url:  `${urlConstants.API_URLS.ENROLLED_MENTEES_LIST}${id || ''}`,
+      payload: {}
+    };
+    try {
+      let data = await this.httpService.get(config);
+      return data.result;
+    }
+    catch (error) {
+    }
+
+  }
 }

src/app/modules/admin/components/manage-session/manage-session.component.html

@@ -31,7 +31,7 @@
 
 </div>
 <div *ngIf="tableData">
-    <app-generic-table [headingText]="headingText" [columnData]="columnData" [noDataMessage]="noDataMessage"  [tableData]="tableData" [totalCount]="totalCount" (onClickEvent)='onCLickEvent($event)' (paginatorChanged)="onPaginatorChange($event)" (onSorting)="onSorting($event)">
+    <app-generic-table [headingText]="headingText" [columnData]="columnData" [noDataMessage]="noDataMessage"  [tableData]="tableData" [totalCount]="totalCount" (onClickEvent)='onCLickEvent($event)' (paginatorChanged)="onPaginatorChange($event)" (onSorting)="onSorting($event)" [showPaginator]="true">
       <div class="download"  (click)="onClickDownload()">{{ download | translate}}</div>
     </app-generic-table>
 </div>

src/app/pages/create-session/create-session.page.ts

@@ -247,11 +247,11 @@ export class CreateSessionPage implements OnInit {
       this.formData.controls[i].value =
         existingData[this.formData.controls[i].name];
       if (this.formData.controls[i].type=='search'){
-        this.formData.controls[i].meta.searchData = []
-        this.formData.controls[i].meta.searchData.push({
-          label: existingData.mentor_name+ ', '+existingData.organization.name,
-          value: existingData[this.formData.controls[i].name]
-        })
+        // this.formData.controls[i].meta.searchData = []
+        // this.formData.controls[i].meta.searchData.push({
+        //   label: existingData.mentor_name+ ', '+existingData.organization.name,
+        //   value: existingData[this.formData.controls[i].name]
+        // })
       }
       this.formData.controls[i].options = _.unionBy(
         this.formData.controls[i].options,

src/app/pages/language/language.page.ts

@@ -30,7 +30,7 @@ export class LanguagePage implements OnInit {
 
   ngOnInit() {
     this.localStorage.getLocalData(localKeys.SELECTED_LANGUAGE).then(data =>{
-      this.selectedLanguage = data.value;
+      this.selectedLanguage = data;
     })
   }
 

src/app/pages/session-detail/session-detail.page.html

@@ -21,15 +21,19 @@ <h6 class="title-font">{{detailData?.data?.title}}</h6>
         <ion-label *ngIf="startDate && detailData?.data?.status?.value=='LIVE'" class="date-label">{{"STARTED_ON"|translate}} {{startDate|date:'dd/MM/yyyy'}} {{"AT"|translate}} {{startDate|date:'shortTime'}}</ion-label>
         <ion-label *ngIf="endDate && detailData?.data?.status?.value=='COMPLETED'" class="date-label">{{"COMPLETED_ON"|translate}} {{endDate|date:'dd/MM/yyyy'}} {{"AT"|translate}} {{endDate|date:'shortTime'}}</ion-label>
       </ion-item>
+      <div class="d-flex ion-no-padding" *ngIf="sessionManagerText">
+        <ion-icon class="person-container" name="person"></ion-icon>
+        <p class="manager-text-container">{{ sessionManagerText | translate}} <span>{{detailData.data.manager_name}}</span></p> 
+      </div>
     </div>
-    <app-generic-details [sessionData]='detailData'></app-generic-details>
+    <app-generic-details [sessionData]='detailData' (onViewList)="onViewList($event)"></app-generic-details>
   </ion-col>
 </ion-row>
 </ion-grid>
   </div>
 </ion-content>
 <ion-footer class="ion-no-border" *ngIf="isLoaded && !this.userCantAccess">
-  <ion-item *ngIf="isCreator; else elseBlockFooter">
+  <ion-item *ngIf="isConductor; else elseBlockFooter">
       <ion-button *ngIf="detailData?.data?.status?.value=='PUBLISHED' || detailData?.data?.status?.value=='LIVE'" [disabled]="!isEnabled || platformOff" class="load-more-button" expand="full"
       (click)="onStart(detailData?.data?.id)">{{"START_SESSIONS" | translate}}</ion-button>
 

src/app/pages/session-detail/session-detail.page.scss

@@ -53,4 +53,21 @@ ion-item {
 }
 .image-container{
     height: 200px;
+}
+.person-container{
+    font-size: 20px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding-right: 10px;
+}
+
+.manager-text-container{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    font-size: 16px;
+    color: rgb(0, 0, 0);
+    margin-left: 6px;
+    margin-bottom: 4px;
 }

src/app/pages/session-detail/session-detail.page.ts

@@ -6,10 +6,11 @@ import { CommonRoutes } from 'src/global.routes';
 import *  as moment from 'moment';
 import { localKeys } from 'src/app/core/constants/localStorage.keys';
 import { Location } from '@angular/common';
-import { ToastController } from '@ionic/angular';
+import { ModalController, ToastController } from '@ionic/angular';
 import { TranslateService } from '@ngx-translate/core';
 import { App, AppState } from '@capacitor/app';
 import { Clipboard } from '@capacitor/clipboard';
+import { MenteeListPopupComponent } from 'src/app/shared/components/mentee-list-popup/mentee-list-popup.component';
 
 
 @Component({
@@ -20,6 +21,7 @@ import { Clipboard } from '@capacitor/clipboard';
 export class SessionDetailPage implements OnInit {
   id: any;
   showEditButton: any;
+  isConductor:any =false;
   isCreator:any = false;
   userDetails: any;
   isEnabled: boolean;
@@ -33,10 +35,12 @@ export class SessionDetailPage implements OnInit {
   isLoaded : boolean = false
   public isMobile:any
   userCantAccess:any = true;
+  enrolledMenteeList:any;
+  sessionManagerText="";
 
   constructor(private localStorage: LocalStorageService, private router: Router,
     private activatedRoute: ActivatedRoute, private sessionService: SessionService,
-    private utilService: UtilService, private toast: ToastService, private user: UserService ,private toaster: ToastController,private translate : TranslateService,) {
+    private utilService: UtilService, private toast: ToastService, private user: UserService ,private toaster: ToastController,private translate : TranslateService,private modalCtrl: ModalController) {
     this.id = this.activatedRoute.snapshot.paramMap.get('id')
     this.isMobile = utilService.isMobile()
   }
@@ -76,7 +80,12 @@ export class SessionDetailPage implements OnInit {
       {
         title: 'MEDIUM',
         key: 'medium',
-      }
+      },
+      {
+        title: 'MENTOR',
+        key: 'mentor_name',
+      },
+
     ],
     data: {
       id:'',
@@ -129,7 +138,11 @@ export class SessionDetailPage implements OnInit {
       is_enrolled:null,
       title:"",
       start_date:"",
-      meeting_info:""
+      meeting_info:"",
+      mentee_count:0,
+      isCreator:false,
+      isConductor:false,
+      manager_name:"",
     },
   };
 
@@ -138,6 +151,9 @@ export class SessionDetailPage implements OnInit {
     this.sessionDatas = response?.result;
     this.isLoaded = true ;
     this.userCantAccess = response?.responseCode == 'OK' ? false:true
+    this.isCreator = response.result.created_by == this.userDetails.id ? true:false;
+    this.isConductor = this.userDetails.id == response.result.mentor_id ? true : false;
+    this.sessionManagerText =  this.isConductor ? "ASSIGNED_BY":"INVITED_BY"
     if (!this.userCantAccess) {
       response = response.result;
       this.setPageHeader(response);
@@ -151,11 +167,21 @@ export class SessionDetailPage implements OnInit {
       this.detailData.data = Object.assign({}, response);
       this.detailData.data.start_date = readableStartDate;
       this.detailData.data.meeting_info = response.meeting_info?.platform;
+      this.detailData.data.mentee_count = response.seats_limit - response.seats_remaining
       this.startDate = (response.start_date>0)?moment.unix(response.start_date).toLocaleString():this.startDate;
       this.endDate = (response.end_date>0)?moment.unix(response.end_date).toLocaleString():this.endDate;
       this.platformOff = (response?.meeting_info?.platform == 'OFF') ? true : false;
+      if(this.isCreator){
+        this.detailData.form.push(
+          {
+            title: 'MENTEE_COUNT',
+            key: 'mentee_count',
+          },
+        );
+      }
+
     }
-    if((response?.meeting_info?.platform == 'OFF') && this.isCreator && response?.status?.value=='PUBLISHED'){
+    if((response?.meeting_info?.platform == 'OFF') && this.isConductor && response?.status?.value=='PUBLISHED'){
       this.showToasts('ADD_MEETING_LINK', 0 , [
           {
             text: 'Add meeting link',
@@ -180,7 +206,7 @@ export class SessionDetailPage implements OnInit {
       this.headerConfig.share = response?.status?.value=="COMPLETED"?false:true;
       this.id = response.id;
       if(this.userDetails){
-        this.isCreator = this.userDetails.id == response.mentor_id ? true : false;
+        this.isConductor = this.userDetails.id == response.mentor_id ? true : false;
       }
       this.headerConfig.edit = (this.isCreator && response?.status?.value=="PUBLISHED"&& !this.isEnabled)?true:null;
       this.headerConfig.delete = (this.isCreator && response?.status?.value=="PUBLISHED" && !this.isEnabled)?true:null;
@@ -312,4 +338,18 @@ export class SessionDetailPage implements OnInit {
   goToHome() {
     this.router.navigate([`/${CommonRoutes.TABS}/${CommonRoutes.HOME}`]);
   }
+
+  async onViewList($event){
+
+    let modal = await this.modalCtrl.create({
+      component: MenteeListPopupComponent,
+      cssClass: 'search-popover-config',
+      componentProps: { id:this.id }
+    });
+
+    modal.onDidDismiss().then(async (dataReturned) => {
+
+    });
+    modal.present()
+  }
 }

src/app/shared/components/generic-details/generic-details.component.html

@@ -13,6 +13,12 @@
       <p *ngIf="item?.key=='startDate' || item?.key=='endDate';else elseBlock3" class="value">{{sessionData.data[item.key] | date:'MMM d, y, h:mm a'}}</p>
     </ng-template>
     <ng-template #elseBlock3>
+      <div class="d-flex" *ngIf="item?.key=='mentee_count';else elseBlock4">
+        <p class="mentee-count">{{sessionData.data[item.key] }}</p>
+        <ion-button class="view-mentee-list" color="white" (click)="onClickViewList()">View list</ion-button>
+      </div>
+    </ng-template>
+    <ng-template #elseBlock4>
       <p *ngIf="item?.key=='experience'" class="value">{{sessionData.data[item.key]}} {{"YEARS"|translate}}</p>
       <p *ngIf="item?.key!='experience'" class="value">{{sessionData.data[item.key]}}</p>
     </ng-template>

src/app/shared/components/generic-details/generic-details.component.scss

@@ -20,4 +20,16 @@ ion-chip{
       font-weight: bold;
       color: var(--dark-grey);
       margin-bottom: 5px;
-  }
+  }
+
+.view-mentee-list{
+    color: #832915;
+    border: 1px solid #832915;
+    border-radius: 10px;
+}
+.mentee-count{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding-right: 10px;
+}

src/app/shared/components/generic-details/generic-details.component.ts

@@ -1,4 +1,4 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 
 @Component({
   selector: 'app-generic-details',
@@ -8,6 +8,7 @@ import { Component, Input, OnInit } from '@angular/core';
 export class GenericDetailsComponent implements OnInit {
   @Input() sessionData: any;
   @Input() isMentor: any;
+  @Output() onViewList = new EventEmitter();
 
   constructor() { }
   public isArray(arr:any ) {
@@ -16,4 +17,7 @@ export class GenericDetailsComponent implements OnInit {
 
   ngOnInit() {}
 
+  onClickViewList(){
+    this.onViewList.emit()
+  }
 }

src/app/shared/components/generic-table/generic-table.component.html

@@ -1,8 +1,8 @@
 <div class="header-container d-flex flex-justify-space-between">
   <div class="header">{{ headingText | translate}}</div>
-  <div *ngIf="pageSize && pageSizeOptions" class="d-flex flex-justify-space-between">
+  <div *ngIf="pageSize && pageSizeOptions" class="d-flex flex-justify-space-between ion-padding">
     <ng-content></ng-content>
-    <mat-paginator class="paginator" [length]="totalCount" [pageSize]="pageSize" [pageSizeOptions]="pageSizeOptions"
+    <mat-paginator *ngIf="showPaginator" class="paginator" [length]="totalCount" [pageSize]="pageSize" [pageSizeOptions]="pageSizeOptions"
     (page)="onPageChange($event)">
   </mat-paginator>
   </div>

src/app/shared/components/generic-table/generic-table.component.ts

@@ -17,6 +17,7 @@ export class GenericTableComponent implements OnInit {
   @Input() headingText;
   @Input() totalCount;
   @Input() noDataMessage;
+  @Input() showPaginator
   @Output() onClickEvent = new EventEmitter();
   @Output() paginatorChanged = new EventEmitter();
   @Output() onSorting = new EventEmitter();

src/app/shared/components/mentee-list-popup/mentee-list-popup.component.html

@@ -0,0 +1,7 @@
+<ion-content>
+<div *ngIf="enrolledMenteeList">
+  <app-generic-table [headingText]="headingText" [columnData]="columnData" [tableData]="enrolledMenteeList" [showPaginator]="false">
+    <div class="download"  (click)="onClickDownload()">{{ download | translate}}</div>
+  </app-generic-table>
+</div>
+</ion-content>

src/app/shared/components/mentee-list-popup/mentee-list-popup.component.scss

@@ -0,0 +1,9 @@
+.download{
+    display: grid;
+    align-items: center;
+    justify-content: flex-end;
+    font-weight:700;
+    color: #6da6f2;
+    text-decoration: underline;
+    cursor: pointer;
+  }

src/app/shared/components/mentee-list-popup/mentee-list-popup.component.spec.ts

@@ -0,0 +1,24 @@
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
+
+import { MenteeListPopupComponent } from './mentee-list-popup.component';
+
+describe('MenteeListPopupComponent', () => {
+  let component: MenteeListPopupComponent;
+  let fixture: ComponentFixture<MenteeListPopupComponent>;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ MenteeListPopupComponent ],
+      imports: [IonicModule.forRoot()]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(MenteeListPopupComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  }));
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});