Merge pull request #183 from mansurskTarento/events

Events
KB-iGOT · Feb 18, 2025 · 3ab07ce · 3ab07ce
2 parents 24e4332 + 274bea4
commit 3ab07ce
Show file tree

Hide file tree

Showing 13 changed files with 164 additions and 95 deletions.
diff --git a/...app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts b/...app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts
@@ -97,8 +97,8 @@ export class CreateEventComponent implements OnInit, AfterViewInit {
       startDate: startDate ? new Date(startDate) : startDate,
       startTime: _.get(this.eventDetails, 'startTime', ''),
       endTime: _.get(this.eventDetails, 'endTime', ''),
-      resourceUrl: resourceUploadType === 'url' ? _.get(this.eventDetails, 'resourceUrl', '') : '',
-      uploadUrl: resourceUploadType === 'upload' ? _.get(this.eventDetails, 'resourceUrl', '') : '',
+      resourceUrl: resourceUploadType === 'url' ? _.get(this.eventDetails, 'registrationLink', '') : '',
+      uploadUrl: resourceUploadType === 'upload' ? _.get(this.eventDetails, 'registrationLink', '') : '',
       resourceUploadType: resourceUploadType,
       appIcon: _.get(this.eventDetails, 'appIcon', '')
     }
@@ -109,7 +109,6 @@ export class CreateEventComponent implements OnInit, AfterViewInit {
     this.materialsList = _.get(this.eventDetails, 'eventHandouts', [])
     this.competencies = _.get(this.eventDetails, 'competencies_v6', [])
 
-    // this.updatedEventDetails = this.getFormBodyOfEvent(this.eventDetails['status']) //need to remove
   }
 
   ngAfterViewInit() {
@@ -122,6 +121,9 @@ export class CreateEventComponent implements OnInit, AfterViewInit {
   //#region (ui interactions)
   onSelectionChange(event: StepperSelectionEvent) {
     this.currentStepperIndex = event.selectedIndex
+    if (this.currentStepperIndex === 4) {
+      this.updatedEventDetails = this.getFormBodyOfEvent(this.eventDetails['status'])
+    }
   }
 
   navigateBack() {
@@ -137,11 +139,13 @@ export class CreateEventComponent implements OnInit, AfterViewInit {
   }
 
   preview() {
-    this.showPreview = true
-    this.updatedEventDetails = this.getFormBodyOfEvent(this.eventDetails['status'])
-    setTimeout(() => {
-      this.currentStepperIndex = 4
-    }, 100)
+    if (this.eventDetails && this.eventDetails['status']) {
+      this.showPreview = true
+      this.updatedEventDetails = this.getFormBodyOfEvent(this.eventDetails['status'])
+      setTimeout(() => {
+        this.currentStepperIndex = 4
+      }, 100)
+    }
   }
 
   publish() {
@@ -240,10 +244,14 @@ export class CreateEventComponent implements OnInit, AfterViewInit {
     eventDetails['startDate'] = eventBaseDetails.startDate ? this.datePipe.transform(eventBaseDetails.startDate, 'yyyy-MM-dd') : ''
     eventDetails['startTime'] = startTime
     eventDetails['endTime'] = endTime
-    eventDetails['resourceUrl'] = eventBaseDetails.resourceUploadType === 'url' ? eventBaseDetails.resourceUrl : eventBaseDetails.uploadUrl
+    eventDetails['registrationLink'] = eventBaseDetails.resourceUploadType === 'url' ? eventBaseDetails.resourceUrl : eventBaseDetails.uploadUrl
     eventDetails['resourceUploadType'] = eventBaseDetails.resourceUploadType
     eventDetails['appIcon'] = eventBaseDetails.appIcon
 
+    if (status === 'SentToPublish') {
+      eventDetails['submitedOn'] = this.datePipe.transform(new Date(), 'dd MMM, yyyy')
+    }
+
     if (this.speakersList) {
       eventDetails['speakers'] = this.speakersList
     }

diff --git a/...es/home/routes/events-2/components/event-basic-details/event-basic-details.component.html b/...es/home/routes/events-2/components/event-basic-details/event-basic-details.component.html
@@ -10,12 +10,14 @@
         <img src="/assets/icons/image.svg" alt="app icon">
         <span class="iconName">{{appIconName}}</span>
       </div>
-      <mat-icon class="remove-app-icon" (click)="removeFile('appIcon')">close</mat-icon>
+      <ng-container *ngIf="openMode === 'edit'">
+        <mat-icon class="remove-app-icon" (click)="removeFile('appIcon')">close</mat-icon>
+      </ng-container>
     </div>
   </ng-container>
   <ng-template #uploadIcon>
     <div class="upload flex justify-center items-center cursor-pointer dashed-border"
-      onclick="document.getElementById('upload-file').click();">
+      [ngClass]="{'disable': openMode === 'view'}" onclick="document.getElementById('upload-file').click();">
       <input #file type="file" name="upload-file" id="upload-file" class="hidden" accept=".png, .jpg, .jpeg"
         (change)="onFileSelected(file.files);">
       <div class="flex flex-column items-center gap-2">
@@ -58,15 +60,17 @@
         <img src="/assets/icons/image.svg" alt="app icon">
         <span class="iconName">{{uploadedVideoName}}</span>
       </div>
-      <mat-icon class="remove-app-icon" (click)="removeFile('uploadedVideo')">close</mat-icon>
+      <ng-container *ngIf="openMode === 'edit'">
+        <mat-icon class="remove-app-icon" (click)="removeFile('uploadedVideo')">close</mat-icon>
+      </ng-container>
     </div>
   </ng-container>
   <ng-template #uploadVideo>
-    <div class="upload flex justify-center items-center cursor-pointer dashed-border" cdkDropList
-      [cdkDropListData]="videoData" (cdkDropListDropped)="onVideoSelected($event)"
-      (dragover)="preventDefaultCDK($event)" (dragenter)="preventDefaultCDK($event, 'enter')"
-      (dragleave)="preventDefaultCDK($event, 'leave')" (drop)="onDrop($event)"
-      onclick="document.getElementById('upload-video').click();">
+    <div class="upload flex justify-center items-center cursor-pointer dashed-border"
+      [ngClass]="{'disable': openMode === 'view'}" cdkDropList [cdkDropListData]="videoData"
+      (cdkDropListDropped)="onVideoSelected($event)" (dragover)="preventDefaultCDK($event)"
+      (dragenter)="preventDefaultCDK($event, 'enter')" (dragleave)="preventDefaultCDK($event, 'leave')"
+      (drop)="onDrop($event)" onclick="document.getElementById('upload-video').click();">
       <input #file type="file" name="upload-video" id="upload-video" class="hidden"
         accept="video/mp4, video/mov, video/avi" (change)="onVideoSelected(file.files);">
       <div class="flex flex-column items-center gap-2">

diff --git a/...es/home/routes/events-2/components/event-basic-details/event-basic-details.component.scss b/...es/home/routes/events-2/components/event-basic-details/event-basic-details.component.scss
@@ -103,6 +103,11 @@
   }
 }
 
+.disable {
+  pointer-events: none;
+  opacity: 0.5;
+}
+
 ::ng-deep ngx-material-timepicker-content{
   --button-color: #1B4CA1 !important;
   --dial-background-color: #1B4CA1 !important;

diff --git a/...utes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts b/...utes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts
@@ -213,7 +213,7 @@ export class EventBasicDetailsComponent implements OnInit, OnChanges {
             let appIcon = createdUrl
             if (createdUrl.startsWith(urlToReplace)) {
               const urlSplice = createdUrl.slice(urlToReplace.length).split('/')
-              appIcon = `${environment.domainName}/assets/public/${urlSplice.slice(1).join('/')}`
+              appIcon = `${environment.domainName}assets/public/${urlSplice.slice(1).join('/')}`
             }
             if (mediaType === 'image') {
               if (this.eventDetails.controls.appIcon) {

diff --git a/...s/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.ts b/...s/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.ts
@@ -8,6 +8,7 @@ import { EventsService } from '../../services/events.service'
 import * as _ from 'lodash'
 import { MatLegacyDialog } from '@angular/material/legacy-dialog'
 import { RejectionReasonComponent } from '../../dialogs/rejection-reason/rejection-reason.component'
+import { DatePipe } from '@angular/common'
 
 @Component({
   selector: 'ws-app-events-list',
@@ -24,6 +25,7 @@ export class EventsListComponent implements OnInit, OnDestroy {
   showEventsLoader = false
   searchKey = ''
   pathUrl = ''
+  userProfile: any
   //#endregion
 
   //#region (constructor)
@@ -32,7 +34,8 @@ export class EventsListComponent implements OnInit, OnDestroy {
     private matSnackBar: MatSnackBar,
     private activatedRoute: ActivatedRoute,
     private route: Router,
-    private dialog: MatLegacyDialog
+    private dialog: MatLegacyDialog,
+    private datePipe: DatePipe
   ) { }
   //#endregion
 
@@ -43,6 +46,7 @@ export class EventsListComponent implements OnInit, OnDestroy {
 
   initialization() {
     this.pathUrl = _.get(this.activatedRoute, 'snapshot.url[0].path', 'pending-approval')
+    this.userProfile = _.get(this.activatedRoute, 'snapshot.data.configService.userProfile')
     switch (this.pathUrl) {
       case 'upcoming':
         this.tableData = {
@@ -117,10 +121,10 @@ export class EventsListComponent implements OnInit, OnDestroy {
             btnText: 'View',
             action: 'view',
           },
-          {
-            btnText: 'Edit',
-            action: 'edit',
-          },
+          // {
+          //   btnText: 'Edit',
+          //   action: 'edit',
+          // },
           {
             btnText: 'Cancel',
             action: 'cancel',
@@ -158,7 +162,7 @@ export class EventsListComponent implements OnInit, OnDestroy {
             { displayName: 'Created By', key: 'createdByName', cellType: 'text' },
             { displayName: 'Created On', key: 'createdOn', cellType: 'date' },
             { displayName: 'Cancelled On', key: 'cancelledOn', cellType: 'date' },
-            { displayName: 'Cancelled By', key: 'cancelledBy', cellType: 'text' },
+            { displayName: 'Cancelled By', key: 'cancelledByName', cellType: 'text' },
           ],
           showSearchBox: true,
           showPagination: true,
@@ -328,7 +332,10 @@ export class EventsListComponent implements OnInit, OnDestroy {
         event: {
           identifier: rowData.identifier,
           versionKey: rowData.versionKey,
-          status: 'Cancelled'
+          status: 'Cancelled',
+          cancelledOn: this.datePipe.transform(new Date(), 'yyyy-MM-dd'),
+          cancelledByName: _.get(this.userProfile, 'userName', ''),
+          cancelledBy: _.get(this.userProfile, 'userId', '')
         }
       }
     }

diff --git a/...c/lib/routes/home/routes/events-2/components/events-preview/events-preview.component.html b/...c/lib/routes/home/routes/events-2/components/events-preview/events-preview.component.html
@@ -58,14 +58,16 @@
                             (click)="getSelectedCompetecyThemes(competencie)">{{ competencie.competencyAreaName }}</div>
                         </ng-container>
                       </div>
-                      <owl-carousel-o class="event-carousel" [options]="customOptions">
-                        <ng-container *ngFor="let theme of selectedCompetecy?.themes">
-                          <ng-template carouselSlide>
-                            <ws-widget-card-competency [theme]="theme"
-                              [competencyArea]="selectedCompetecy?.competencyAreaName"></ws-widget-card-competency>
-                          </ng-template>
-                        </ng-container>
-                      </owl-carousel-o>
+                      <ng-container *ngIf="selectedCompetecy?.themes?.length">
+                        <owl-carousel-o class="event-carousel" [options]="customOptions">
+                          <ng-container *ngFor="let theme of selectedCompetecy?.themes">
+                            <ng-template carouselSlide>
+                              <ws-widget-card-competency [theme]="theme"
+                                [competencyArea]="selectedCompetecy?.competencyAreaName"></ws-widget-card-competency>
+                            </ng-template>
+                          </ng-container>
+                        </owl-carousel-o>
+                      </ng-container>
                     </div>
                   </div>
                 </div>

diff --git a/...src/lib/routes/home/routes/events-2/components/events-preview/events-preview.component.ts b/...src/lib/routes/home/routes/events-2/components/events-preview/events-preview.component.ts
@@ -1,10 +1,10 @@
 import { Component, ElementRef, HostListener, Input, OnChanges, OnInit, SimpleChanges, ViewChild } from '@angular/core'
-// import { MatLegacyDialog } from '@angular/material/legacy-dialog'
+import { MatLegacyDialog } from '@angular/material/legacy-dialog'
 import { NsWidgetResolver } from '@sunbird-cb/resolver'
 import { environment } from '../../../../../../../../../../../src/environments/environment'
 import { OwlOptions } from 'ngx-owl-carousel-o'
 import { EventsService } from '../../services/events.service'
-// import { YoutubePlayerComponent } from '../../dialogs/youtube-player/youtube-player.component'
+import { YoutubePlayerComponent } from '../../dialogs/youtube-player/youtube-player.component'
 
 @Component({
   selector: 'ws-app-events-preview',
@@ -97,17 +97,18 @@ export class EventsPreviewComponent implements OnInit, OnChanges {
     ],
     responsive: {
       0: {
-        items: 2
+        items: 1
       },
       768: {
-        items: 2
+        items: 1
       }
     },
     nav: true
   };
 
   constructor(
-    private eventsService: EventsService
+    private eventsService: EventsService,
+    private dialog: MatLegacyDialog
   ) { }
 
   ngOnInit(): void {
@@ -126,8 +127,11 @@ export class EventsPreviewComponent implements OnInit, OnChanges {
 
   loadCompetencies(): void {
     if (this.event && this.compentencyKey && this.event[this.compentencyKey.vKey] && this.event[this.compentencyKey.vKey].length) {
+      this.selectedCompetecy = []
       this.competenciesObject = this.eventsService.convertToTreeView(this.event[this.compentencyKey.vKey])
-      this.selectedCompetecy = this.competenciesObject[0]
+      setTimeout(() => {
+        this.selectedCompetecy = this.competenciesObject[0]
+      }, 100)
     }
   }
 
@@ -168,10 +172,10 @@ export class EventsPreviewComponent implements OnInit, OnChanges {
   }
 
   viewPlayer() {
-    // this.dialog.open(YoutubePlayerComponent, {
-    //   width: '900px',
-    //   disableClose: false,
-    //   data: { event: this.event }
-    // })
+    this.dialog.open(YoutubePlayerComponent, {
+      width: '900px',
+      disableClose: false,
+      data: { event: this.event }
+    })
   }
 }
diff --git a/...t/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.html b/...t/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.html
@@ -44,7 +44,7 @@
         </button>
         <button mat-flat-button class="flex justify-center items-center save-button" type="submit"
           [disabled]="(eventForm.invalid && !imgURL)">
-          <span class="font-bold text-sm">Save</span>
+          <span class="font-bold text-sm">Create</span>
         </button>
       </div>
 

diff --git a/...ect/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts b/...ect/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts
@@ -175,6 +175,7 @@ export class BasicInfoComponent implements OnInit {
       this.eventSvc.createEvent(requestBody).subscribe({
         next: res => {
           if (res) {
+            this.openSnackBar('Event created successfully')
             this.dialogRef.close(_.get(res, 'result.identifier', ''))
           }
         },
@@ -183,7 +184,6 @@ export class BasicInfoComponent implements OnInit {
           this.openSnackBar(errorMessage)
         }
       })
-      // this.dialogRef.close()
     }
   }
 

diff --git a/.../src/lib/routes/home/routes/events-2/dialogs/youtube-player/youtube-player.component.html b/.../src/lib/routes/home/routes/events-2/dialogs/youtube-player/youtube-player.component.html
@@ -1 +1,14 @@
-<div #youtubeTag id='youtubeTag'></div>
+<div class="flex flex-row pb-5 justify-between pt-4">
+  <div class="title font-bold">{{eventData?.name}}</div>
+  <mat-icon class="pointer" (click)="closeDialog()">close</mat-icon>
+</div>
+{{videoLink | json}}
+<div *ngIf="!youtubeURL" class="pb-4">
+  <video width="100%" height="500px" disablePictureInPicture="true" controls controlsList="nodownload"
+    [autoplay]="true">
+    <source [src]="videoLink.changingThisBreaksApplicationSecurity" type="video/mp4">
+  </video>
+</div>
+<div [hidden]='!youtubeURL' id='youtubeTag' class="pb-4">
+  <iframe class="uploadedVideo" width="100%" [src]="iframeSrc"></iframe>
+</div>
diff --git a/.../src/lib/routes/home/routes/events-2/dialogs/youtube-player/youtube-player.component.scss b/.../src/lib/routes/home/routes/events-2/dialogs/youtube-player/youtube-player.component.scss
@@ -0,0 +1,7 @@
+.pointer {
+  cursor: pointer;
+}
+
+.uploadedVideo {
+  height: 500px;
+}