From c292ec6367229342fa16720d2264fc09e1f76414 Mon Sep 17 00:00:00 2001 From: mansurskTarento Date: Tue, 28 Jan 2025 11:11:32 +0530 Subject: [PATCH 01/14] adding components and modules for events --- .../lib/routes/home/home.rounting.module.ts | 4 + .../create-event/create-event.component.html | 1 + .../create-event/create-event.component.scss | 0 .../create-event.component.spec.ts | 21 ++ .../create-event/create-event.component.ts | 10 + .../event-basic-details.component.html | 1 + .../event-basic-details.component.scss | 0 .../event-basic-details.component.spec.ts | 21 ++ .../event-basic-details.component.ts | 10 + .../event-competencies.component.html | 1 + .../event-competencies.component.scss | 0 .../event-competencies.component.spec.ts | 21 ++ .../event-competencies.component.ts | 10 + .../event-materials.component.html | 1 + .../event-materials.component.scss | 0 .../event-materials.component.spec.ts | 21 ++ .../event-materials.component.ts | 10 + .../events-table/events-table.component.html | 86 +++++++ .../events-table/events-table.component.scss | 220 ++++++++++++++++++ .../events-table.component.spec.ts | 21 ++ .../events-table/events-table.component.ts | 94 ++++++++ .../components/events/events.component.html | 1 + .../components/events/events.component.scss | 0 .../events/events.component.spec.ts | 21 ++ .../components/events/events.component.ts | 10 + .../speakers/speakers.component.html | 1 + .../speakers/speakers.component.scss | 0 .../speakers/speakers.component.spec.ts | 21 ++ .../components/speakers/speakers.component.ts | 10 + .../basic-info/basic-info.component.html | 1 + .../basic-info/basic-info.component.scss | 0 .../basic-info/basic-info.component.spec.ts | 21 ++ .../basic-info/basic-info.component.ts | 10 + .../events-2/events-2-routing.module.ts | 28 +++ .../home/routes/events-2/events-2.module.ts | 42 ++++ .../events-2/services/events.service.spec.ts | 16 ++ .../events-2/services/events.service.ts | 9 + 37 files changed, 744 insertions(+) create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.html create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.scss create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.scss create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.html create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.scss create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.html create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.scss create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.html create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.scss create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.html create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.scss create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.html create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.scss create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.html create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.scss create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.ts diff --git a/project/ws/app/src/lib/routes/home/home.rounting.module.ts b/project/ws/app/src/lib/routes/home/home.rounting.module.ts index b1937959d..69bcc7a0d 100644 --- a/project/ws/app/src/lib/routes/home/home.rounting.module.ts +++ b/project/ws/app/src/lib/routes/home/home.rounting.module.ts @@ -325,6 +325,10 @@ const routes: Routes = [ module: 'Home', }, }, + { + path: 'events', + loadChildren: () => import('./routes/events-2/events-2.module').then(m => m.Events2Module), + }, { path: 'reports-section', component: ReportsSectionComponent, diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.html new file mode 100644 index 000000000..e37ac1936 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.html @@ -0,0 +1 @@ +

create-event works!

diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.spec.ts new file mode 100644 index 000000000..88cd9e1c4 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { CreateEventComponent } from './create-event.component'; + +describe('CreateEventComponent', () => { + let component: CreateEventComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [CreateEventComponent] + }); + fixture = TestBed.createComponent(CreateEventComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts new file mode 100644 index 000000000..f05c32ac1 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'ws-app-create-event', + templateUrl: './create-event.component.html', + styleUrls: ['./create-event.component.scss'] +}) +export class CreateEventComponent { + +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html new file mode 100644 index 000000000..6bbf336ce --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html @@ -0,0 +1 @@ +

event-basic-details works!

diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.spec.ts new file mode 100644 index 000000000..9a0830394 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { EventBasicDetailsComponent } from './event-basic-details.component'; + +describe('EventBasicDetailsComponent', () => { + let component: EventBasicDetailsComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [EventBasicDetailsComponent] + }); + fixture = TestBed.createComponent(EventBasicDetailsComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts new file mode 100644 index 000000000..d2ed60978 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'ws-app-event-basic-details', + templateUrl: './event-basic-details.component.html', + styleUrls: ['./event-basic-details.component.scss'] +}) +export class EventBasicDetailsComponent { + +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.html new file mode 100644 index 000000000..03683b504 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.html @@ -0,0 +1 @@ +

event-competencies works!

diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.spec.ts new file mode 100644 index 000000000..36ffff83a --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { EventCompetenciesComponent } from './event-competencies.component'; + +describe('EventCompetenciesComponent', () => { + let component: EventCompetenciesComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [EventCompetenciesComponent] + }); + fixture = TestBed.createComponent(EventCompetenciesComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.ts new file mode 100644 index 000000000..4beb3ab89 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'ws-app-event-competencies', + templateUrl: './event-competencies.component.html', + styleUrls: ['./event-competencies.component.scss'] +}) +export class EventCompetenciesComponent { + +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.html new file mode 100644 index 000000000..7bdb020d1 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.html @@ -0,0 +1 @@ +

event-materials works!

diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.spec.ts new file mode 100644 index 000000000..72aa4115b --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { EventMaterialsComponent } from './event-materials.component'; + +describe('EventMaterialsComponent', () => { + let component: EventMaterialsComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [EventMaterialsComponent] + }); + fixture = TestBed.createComponent(EventMaterialsComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.ts new file mode 100644 index 000000000..ae0bebcb3 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'ws-app-event-materials', + templateUrl: './event-materials.component.html', + styleUrls: ['./event-materials.component.scss'] +}) +export class EventMaterialsComponent { + +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.html new file mode 100644 index 000000000..db20421ba --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.html @@ -0,0 +1,86 @@ +
+
+ +
+
+ search + +
+
+ +
+ +
+ + + + + + + {{col.displayName}} + + + + logo + + + {{element[col.key]}} + + + + + + + + + + + more_horiz + + + + +
+ +
+ + + + + + + + + + + + + + + +
+
No results found
+
Try adjusting your search to find what you are looking for.
+
+ + {{noDataMessage}} + + + +
+ +
+ +
+ + + + \ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.scss new file mode 100644 index 000000000..68f9bb96f --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.scss @@ -0,0 +1,220 @@ +.rsearch { + display: flex; + position: relative; + flex: 1 1 auto; +} + +.sinput { + width: 315px; + border-radius: 4px; + border: 1px solid #d5d0d0; + padding: 9px 9px 9px 35px; + margin-bottom: 0px; + margin-top: 0; + /* stylelint-enable */ + font: normal 14px Lato; + /* stylelint-disable */ + font-weight: 400; +} + +.search-icon { + position: absolute; + top: 9px; + font-size: 20px; + left: 10px; +} + +.delete-all { + background-color: #1B4CA1 !important; + border-radius: 4px; + color: #FFFFFF !important; + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ + + .delete-all-icon { + font-size: 18px; + width: 14px; + height: 18px; + color: #ffffff; + } +} + +.imageCell { + width: 63px; + margin-right: 15px; +} + +.delete-btn { + background-color: #1B4CA1 !important; + min-width: 40px; + height: 40px; + border-radius: 4px; +} + +.delete-icon{ + font-size: 18px; + height: 18px; + width: 18px; + color: #FFFFFF; +} + +.cources-table-cell { + color: #000000DE; + /* stylelint-enable */ + font: 400 14px Lato; + /* stylelint-disable */ + width: 150px; +} + +.text-overflow-elipse { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} + +.header-info-icon { + color: #6C757D; + font-size: 14px; + height: 14px; + width: 14px; + margin-left: 5px; +} + +.authenticated { + background-color: #1D8923; + height: 26px; + width: 124px; + border-radius: 4px; + padding: 4px 8px; + color: #FFFFFF; + /* stylelint-enable */ + font: 400 14px Lato; + /* stylelint-disable */ + + .checkCircle{ + color: #E8EAED; + font-size: 20px; + width: 20px; + height: 20px; + } +} + +.not-authenticated { + background-color: #D13924; + height: 26px; + width: 124px; + border-radius: 4px; + padding: 4px 8px; + color: #FFFFFF; + /* stylelint-enable */ + font: 400 14px Lato; + /* stylelint-disable */ + + .pending-img{ + width: 24px; + height: 24px; + } +} + +.statusLive { + height: 33px; + width: 58px; + background-color: #1D892333; + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ + color: #1D8923; + border-radius: 4px; +} + +.statusFailed { + height: 33px; + border-radius: 4px; + background-color: #D1392466; + padding: 0px 16px; + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ + color: #D13924; +} + +.statusPending { + height: 33px; + border-radius: 4px; + background-color: #fad8b4; + padding: 0px 16px; + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ + color: #fb8400; +} + +.refreshIcon { + color: #1B4CA1; + margin-left: 5px; + cursor: pointer; +} + +.horizontalMenu { + color: #00000099; + cursor: pointer; +} + +.item-btn { + color: #00000099 !important; + /* stylelint-enable */ + font: 400 14px Lato; + /* stylelint-disable */ + width: 160px; + + .menu-item-icon { + color: #00000099; + margin-right: 5px; + } +} + +.table-menu-column { + flex: 0 0 200px; + .disableMenu { + opacity: 0.5; + } +} + +.table-header-text { + color: #0000008A !important; + font-size: 14px !important; +} + +.coursesTableLoader { + height: calc(100vh - 300px); + + .coursesTableSpinner { + position: unset !important; + margin: 0px !important; + } +} + + +:host ::ng-deep .courses-table { + .mat-header-row { + background-color: #F5F5F5 !important; + } +} + +:host ::ng-deep .disableCheckBosx { + .mat-checkbox-inner-container-no-side-margin { + background-color: #D9D9D9; + } + + .theme-igot.day-mode .mat-header-cell { + color: #0000008A; + /* stylelint-enable */ + font: 400 14px Lato + /* stylelint-disable */ + } +} + +:host ::ng-deep .mat-paginator-container { + justify-content: center !important; +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.spec.ts new file mode 100644 index 000000000..5aa4e6baf --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { EventsTableComponent } from './events-table.component'; + +describe('EventsTableComponent', () => { + let component: EventsTableComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [EventsTableComponent] + }); + fixture = TestBed.createComponent(EventsTableComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.ts new file mode 100644 index 000000000..7cd8dc511 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.ts @@ -0,0 +1,94 @@ +import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core' +import { FormControl } from '@angular/forms' +import { PageEvent } from '@angular/material/paginator' +import { MatTableDataSource } from '@angular/material/table' +import _ from 'lodash' +import { debounceTime } from 'rxjs/operators' + +@Component({ + selector: 'ws-app-events-table', + templateUrl: './events-table.component.html', + styleUrls: ['./events-table.component.scss'] +}) +export class EventsTableComponent implements OnInit, OnChanges { + @Input() tableData!: any + @Input() data?: [] + @Input() paginationDetails: any = { + startIndex: 0, + lastIndes: 20, + pageSize: 20, + pageIndex: 0, + totalCount: 20, + } + @Input() menuItems = [] + @Input() showLoader = false + @Output() actionsClick = new EventEmitter() + @Output() searchKey = new EventEmitter() + @Output() pageChange = new EventEmitter() + + searchControl = new FormControl() + showSearchBox = true + displayedColumns: any + dataSource!: any + pageSizeOptions = [20, 30, 40] + columnsList: any = [] + tableColumns = [] + noDataMessage = 'No data found' + showPagination = true + + constructor() { + this.dataSource = new MatTableDataSource() + } + + ngOnInit() { + if (this.tableData) { + this.displayedColumns = this.tableData.columns + this.showSearchBox = _.get(this.tableData, 'showSearchBox', true) + this.noDataMessage = _.get(this.tableData, 'noDataMessage', 'No data found') + this.showPagination = _.get(this.tableData, 'showPagination', true) + } + + this.searchControl.valueChanges + .pipe(debounceTime(300)) // Adjust the debounce time as needed + .subscribe(value => this.searchKey.emit(value)) + } + + ngOnChanges(changes: SimpleChanges): void { + if (changes.tableData) { + this.getFinalColumns() + } + if (changes.data) { + this.dataSource.data = this.data + } + } + + getFinalColumns() { + this.columnsList = [] + const columns = JSON.parse(JSON.stringify(this.tableData.columns)) + if (this.tableData.needCheckBox) { + const selectColumn = { displayName: '', key: 'select', cellType: 'select' } + columns.splice(0, 0, selectColumn) + } + if (this.menuItems.length > 0) { + const selectColumn = { displayName: '', key: 'menu', cellType: 'menu' } + columns.push(selectColumn) + } + this.tableColumns = columns + this.columnsList = _.map(columns, c => c.key) + } + + buttonClick(action: string, rows: any) { + if (this.tableData) { + this.actionsClick.emit({ action, rows }) + } + } + + onChangePage(pe: PageEvent) { + this.paginationDetails.startIndex = pe.pageIndex * pe.pageSize + this.paginationDetails.lastIndex = (pe.pageIndex + 1) * pe.pageSize + this.paginationDetails.pageSize = pe.pageSize + this.paginationDetails.pageIndex = pe.pageIndex + + this.pageChange.emit(this.paginationDetails) + } +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.html new file mode 100644 index 000000000..f2f77fd03 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.html @@ -0,0 +1 @@ +

events works!

diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.spec.ts new file mode 100644 index 000000000..c18bbd5be --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { EventsComponent } from './events.component'; + +describe('EventsComponent', () => { + let component: EventsComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [EventsComponent] + }); + fixture = TestBed.createComponent(EventsComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.ts new file mode 100644 index 000000000..398462989 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'ws-app-events', + templateUrl: './events.component.html', + styleUrls: ['./events.component.scss'] +}) +export class EventsComponent { + +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.html new file mode 100644 index 000000000..9c2edcbcc --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.html @@ -0,0 +1 @@ +

speakers works!

diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.spec.ts new file mode 100644 index 000000000..a3fe01b74 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SpeakersComponent } from './speakers.component'; + +describe('SpeakersComponent', () => { + let component: SpeakersComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [SpeakersComponent] + }); + fixture = TestBed.createComponent(SpeakersComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.ts new file mode 100644 index 000000000..af462c84e --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'ws-app-speakers', + templateUrl: './speakers.component.html', + styleUrls: ['./speakers.component.scss'] +}) +export class SpeakersComponent { + +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.html new file mode 100644 index 000000000..7ea6c4a86 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.html @@ -0,0 +1 @@ +

basic-info works!

diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.spec.ts new file mode 100644 index 000000000..28c966c5c --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { BasicInfoComponent } from './basic-info.component'; + +describe('BasicInfoComponent', () => { + let component: BasicInfoComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [BasicInfoComponent] + }); + fixture = TestBed.createComponent(BasicInfoComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts new file mode 100644 index 000000000..2d59a5fde --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'ws-app-basic-info', + templateUrl: './basic-info.component.html', + styleUrls: ['./basic-info.component.scss'] +}) +export class BasicInfoComponent { + +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts b/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts new file mode 100644 index 000000000..169d43bab --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts @@ -0,0 +1,28 @@ +import { NgModule } from '@angular/core' +import { RouterModule, Routes } from '@angular/router' +import { EventsComponent } from './components/events/events.component' +import { CreateEventComponent } from './components/create-event/create-event.component' + +const routes: Routes = [ + { + path: '', + pathMatch: 'full', + component: EventsComponent, + data: { + pageId: 'home/events', + module: 'events-2', + pageType: 'feature', + pageKey: 'events', + }, + }, { + path: 'create-event/:id', + pathMatch: 'full', + component: CreateEventComponent + } +] + +@NgModule({ + imports: [RouterModule.forChild(routes)], + exports: [RouterModule] +}) +export class Events2RoutingModule { } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts b/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts new file mode 100644 index 000000000..02d028f9a --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts @@ -0,0 +1,42 @@ +import { NgModule } from '@angular/core' +import { CommonModule } from '@angular/common' + +import { Events2RoutingModule } from './events-2-routing.module' +import { EventsComponent } from './components/events/events.component' +import { CreateEventComponent } from './components/create-event/create-event.component' +import { EventBasicDetailsComponent } from './components/event-basic-details/event-basic-details.component' +import { SpeakersComponent } from './components/speakers/speakers.component' +import { EventMaterialsComponent } from './components/event-materials/event-materials.component' +import { EventCompetenciesComponent } from './components/event-competencies/event-competencies.component' +import { FormsModule, ReactiveFormsModule } from '@angular/forms' +import { MatLegacyButtonModule } from '@angular/material/legacy-button' +import { MatLegacyDialogModule } from '@angular/material/legacy-dialog' +import { MatLegacyProgressSpinnerModule } from '@angular/material/legacy-progress-spinner' +import { MatLegacyFormFieldModule } from '@angular/material/legacy-form-field' +import { MatLegacyTooltipModule } from '@angular/material/legacy-tooltip'; +import { EventsTableComponent } from './components/events-table/events-table.component' + + +@NgModule({ + declarations: [ + EventsComponent, + CreateEventComponent, + EventBasicDetailsComponent, + SpeakersComponent, + EventMaterialsComponent, + EventCompetenciesComponent, + EventsTableComponent + ], + imports: [ + CommonModule, + FormsModule, + ReactiveFormsModule, + MatLegacyButtonModule, + MatLegacyDialogModule, + MatLegacyProgressSpinnerModule, + MatLegacyFormFieldModule, + MatLegacyTooltipModule, + Events2RoutingModule, + ] +}) +export class Events2Module { } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.spec.ts new file mode 100644 index 000000000..162cd5c35 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.spec.ts @@ -0,0 +1,16 @@ +import { TestBed } from '@angular/core/testing'; + +import { EventsService } from './events.service'; + +describe('EventsService', () => { + let service: EventsService; + + beforeEach(() => { + TestBed.configureTestingModule({}); + service = TestBed.inject(EventsService); + }); + + it('should be created', () => { + expect(service).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.ts b/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.ts new file mode 100644 index 000000000..1bc4b1b82 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.ts @@ -0,0 +1,9 @@ +import { Injectable } from '@angular/core'; + +@Injectable({ + providedIn: 'root' +}) +export class EventsService { + + constructor() { } +} From 66f594190a9280e407959c2737cf13b952b0d4d3 Mon Sep 17 00:00:00 2001 From: mansurskTarento Date: Wed, 29 Jan 2025 12:35:11 +0530 Subject: [PATCH 02/14] adding events list pages --- .../draft-events/draft-events.component.html | 5 + .../draft-events/draft-events.component.scss | 0 .../draft-events.component.spec.ts | 21 +++ .../draft-events/draft-events.component.ts | 137 ++++++++++++++++++ .../events-table/events-table.component.html | 20 ++- .../events-table/events-table.component.scss | 27 ++-- .../events-table/events-table.component.ts | 17 +-- .../components/events/events.component.html | 30 +++- .../components/events/events.component.scss | 38 +++++ .../components/events/events.component.ts | 52 ++++++- .../past-events/past-events.component.html | 5 + .../past-events/past-events.component.scss | 0 .../past-events/past-events.component.spec.ts | 21 +++ .../past-events/past-events.component.ts | 137 ++++++++++++++++++ .../pending-approval-events.component.html | 5 + .../pending-approval-events.component.scss | 0 .../pending-approval-events.component.spec.ts | 21 +++ .../pending-approval-events.component.ts | 137 ++++++++++++++++++ .../rejected-events.component.html | 5 + .../rejected-events.component.scss | 0 .../rejected-events.component.spec.ts | 21 +++ .../rejected-events.component.ts | 137 ++++++++++++++++++ .../upcoming-events.component.html | 5 + .../upcoming-events.component.scss | 0 .../upcoming-events.component.spec.ts | 21 +++ .../upcoming-events.component.ts | 137 ++++++++++++++++++ .../events-2/events-2-routing.module.ts | 54 ++++++- .../home/routes/events-2/events-2.module.ts | 26 +++- .../routes/events-2/models/events.model.ts | 30 ++++ .../events-2/services/events.service.ts | 15 +- 30 files changed, 1089 insertions(+), 35 deletions(-) create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.html create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.scss create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.html create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.scss create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.html create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.scss create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.html create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.scss create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.html create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.scss create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/models/events.model.ts diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.html new file mode 100644 index 000000000..544175913 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.html @@ -0,0 +1,5 @@ +
+ +
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.spec.ts new file mode 100644 index 000000000..852fc79fe --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { DraftEventsComponent } from './draft-events.component'; + +describe('DraftEventsComponent', () => { + let component: DraftEventsComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [DraftEventsComponent] + }); + fixture = TestBed.createComponent(DraftEventsComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.ts new file mode 100644 index 000000000..add3efaab --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.ts @@ -0,0 +1,137 @@ +//#region (imports) +import { Component, OnDestroy, OnInit } from '@angular/core' +import { events } from '../../models/events.model' +import { EventsService } from '../../services/events.service' +import { Subscription } from 'rxjs' +import * as _ from 'lodash' +import { HttpErrorResponse } from '@angular/common/http' +import { MatSnackBar } from '@angular/material/snack-bar' +//#endregion + +@Component({ + selector: 'ws-app-draft-events', + templateUrl: './draft-events.component.html', + styleUrls: ['./draft-events.component.scss'] +}) +export class DraftEventsComponent implements OnInit, OnDestroy { + //#region (global variables) + tableData!: events.tableData + paginationDetails!: events.pagination + menuItems!: events.menuItems[] + eventsList: any[] = [] + getEventSubscription!: Subscription + showEventsLoader = false + searchKey = '' + //#endregion + + //#region (constructor) + constructor( + private eventSvc: EventsService, + private matSnackBar: MatSnackBar + ) { } + //#endregion + + //#region (onInint) + ngOnInit(): void { + this.initialization() + this.getEvents() + } + + initialization() { + this.tableData = { + columns: [ + { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, + { displayName: 'Start Date', key: 'startDate', cellType: 'text' }, + { displayName: 'Created On', key: 'createdOn', cellType: 'text' }, + { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, + { displayName: 'Submitted On', key: 'submitedOn', cellType: 'text' }, + ], + showSearchBox: true, + showPagination: true, + noDataMessage: 'There are no draft events.' + } + + this.paginationDetails = { + startIndex: 0, + lastIndex: 20, + pageSize: 20, + pageIndex: 0, + totalCount: 20, + } + + this.menuItems = [ + { + btnText: 'Edit', + action: 'edit', + }, + ] + } + + getEvents() { + const requestObj = { + locale: [ + 'en', + ], + request: { + query: this.searchKey, + limit: _.get(this.paginationDetails, 'pageSize', 20), + offset: _.get(this.paginationDetails, 'pageIndex', 0), + filters: { + status: ['Live'], + contentType: 'Event', + }, + sort_by: { + startDate: 'desc', + }, + }, + } + + if (this.getEventSubscription) { + this.getEventSubscription.unsubscribe() + } + this.showEventsLoader = true + this.getEventSubscription = this.eventSvc.getEvents(requestObj).subscribe( + { + next: (res: any) => { + this.showEventsLoader = false + this.eventsList = _.get(res, 'result.Event', []) + this.paginationDetails['totalCount'] = _.get(res, 'result.count', 0) + }, + error: (error: HttpErrorResponse) => { + this.showEventsLoader = false + const errorMessage = _.get(error, 'error.message', 'Some thing went wrong') + this.openSnackBar(errorMessage) + } + } + ) + } + //#endregion + + //#region (ui interactions like click) + searchEvents(searchKey: string) { + this.searchKey = searchKey + this.getEvents() + } + + onPageChange(paginationDetails: events.pagination) { + this.paginationDetails = paginationDetails + this.getEvents() + } + + contentEvents(events: any) { + console.log(events) + } + + //#endregion + + private openSnackBar(message: string) { + this.matSnackBar.open(message) + } + + ngOnDestroy(): void { + if (this.getEventSubscription) { + this.getEventSubscription.unsubscribe() + } + } + +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.html index db20421ba..d2782f7df 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.html @@ -4,7 +4,8 @@
search - +
@@ -30,9 +31,20 @@ + + + {{col.displayName}} + + + + {{element[col.key]}} + + + + - - + + {{col.displayName}} @@ -75,7 +87,7 @@
- +
diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.scss index 68f9bb96f..47b801501 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.scss @@ -5,10 +5,10 @@ } .sinput { - width: 315px; - border-radius: 4px; + width: 385px; + border-radius: 18px; border: 1px solid #d5d0d0; - padding: 9px 9px 9px 35px; + padding: 9px 9px 9px 45px; margin-bottom: 0px; margin-top: 0; /* stylelint-enable */ @@ -19,9 +19,9 @@ .search-icon { position: absolute; - top: 9px; - font-size: 20px; - left: 10px; + top: 8px; + font-size: 22px; + left: 16px; } .delete-all { @@ -174,6 +174,10 @@ } } +.table-menu-header { + flex: 0 0 200px; +} + .table-menu-column { flex: 0 0 200px; .disableMenu { @@ -182,17 +186,14 @@ } .table-header-text { - color: #0000008A !important; - font-size: 14px !important; + color: #666666 !important; + /* stylelint-enable */ + font: 400 12px Lato !important; + /* stylelint-disable */ } .coursesTableLoader { height: calc(100vh - 300px); - - .coursesTableSpinner { - position: unset !important; - margin: 0px !important; - } } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.ts index 7cd8dc511..42c49b7ae 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.ts @@ -4,6 +4,7 @@ import { PageEvent } from '@angular/material/paginator' import { MatTableDataSource } from '@angular/material/table' import _ from 'lodash' import { debounceTime } from 'rxjs/operators' +import { events } from '../../models/events.model' @Component({ selector: 'ws-app-events-table', @@ -11,16 +12,16 @@ import { debounceTime } from 'rxjs/operators' styleUrls: ['./events-table.component.scss'] }) export class EventsTableComponent implements OnInit, OnChanges { - @Input() tableData!: any + @Input() tableData!: events.tableData @Input() data?: [] - @Input() paginationDetails: any = { + @Input() paginationDetails: events.pagination = { startIndex: 0, - lastIndes: 20, + lastIndex: 20, pageSize: 20, pageIndex: 0, totalCount: 20, } - @Input() menuItems = [] + @Input() menuItems: events.menuItems[] = [] @Input() showLoader = false @Output() actionsClick = new EventEmitter() @Output() searchKey = new EventEmitter() @@ -49,7 +50,7 @@ export class EventsTableComponent implements OnInit, OnChanges { } this.searchControl.valueChanges - .pipe(debounceTime(300)) // Adjust the debounce time as needed + .pipe(debounceTime(500)) // Adjust the debounce time as needed .subscribe(value => this.searchKey.emit(value)) } @@ -65,12 +66,8 @@ export class EventsTableComponent implements OnInit, OnChanges { getFinalColumns() { this.columnsList = [] const columns = JSON.parse(JSON.stringify(this.tableData.columns)) - if (this.tableData.needCheckBox) { - const selectColumn = { displayName: '', key: 'select', cellType: 'select' } - columns.splice(0, 0, selectColumn) - } if (this.menuItems.length > 0) { - const selectColumn = { displayName: '', key: 'menu', cellType: 'menu' } + const selectColumn = { displayName: 'Actions', key: 'menu', cellType: 'menu' } columns.push(selectColumn) } this.tableColumns = columns diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.html index f2f77fd03..76744d6d4 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.html @@ -1 +1,29 @@ -

events works!

+
+
+ Event + +
+
+
+ Upcoming + + Draft + + Pending Approval + + Past + + Rejected + +
+
+ +
+ +
+
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.scss index e69de29bb..ac56f1255 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.scss @@ -0,0 +1,38 @@ +.createEventBtn { + background-color: #1B4CA1 !important; + height: 32px; + border-radius: 17px; + color: #FFFFFF !important; + /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ +} + +.filter { + border-bottom: 2px solid #ebebeb; + + .filter-option { + // margin: $size-s 0; + border-radius: 0; + border-bottom-width: 2px; + border-top-width: 0; + border-left-width: 0; + border-right-width: 0; + + color: #00000099; + /* stylelint-disable */ + font: 400 14px Lato; + /* stylelint-enable */ + } + + .ws-mat-accent-border-active { + color: #1B4CA1 !important; + /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ + } + + .filter-option:first-child { + margin-left: 0; + } +} \ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.ts index 398462989..06af3d62c 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.ts @@ -1,10 +1,58 @@ -import { Component } from '@angular/core'; +//#region (imports) +import { Component, OnDestroy, OnInit } from '@angular/core' +import { NavigationEnd, Router } from '@angular/router' +import { Subscription } from 'rxjs' + +//#endregion @Component({ selector: 'ws-app-events', templateUrl: './events.component.html', styleUrls: ['./events.component.scss'] }) -export class EventsComponent { +export class EventsComponent implements OnInit, OnDestroy { + + //#region (global variables) + currentRoute = 'pending-approval' + routeSubscription: Subscription = new Subscription() + //#endregion + + //#region (constructor) + constructor( + private router: Router, + ) { } + + //#endregion + + //#region (onint) + ngOnInit(): void { + this.initialization() + } + + initialization() { + this.updateCurrentRoute() + this.getRouteSubscription() + } + + getRouteSubscription() { + this.routeSubscription = this.router.events.subscribe(event => { + if (event instanceof NavigationEnd) { + this.updateCurrentRoute() + } + }) + } + + updateCurrentRoute(): void { + const urlSegments = this.router.url.split('/') + this.currentRoute = urlSegments[urlSegments.length - 1] + } + + //#endregion + + ngOnDestroy(): void { + if (this.routeSubscription) { + this.routeSubscription.unsubscribe() + } + } } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.html new file mode 100644 index 000000000..544175913 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.html @@ -0,0 +1,5 @@ +
+ +
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.spec.ts new file mode 100644 index 000000000..ec04e0b01 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { PastEventsComponent } from './past-events.component'; + +describe('PastEventsComponent', () => { + let component: PastEventsComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [PastEventsComponent] + }); + fixture = TestBed.createComponent(PastEventsComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.ts new file mode 100644 index 000000000..10ff8923b --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.ts @@ -0,0 +1,137 @@ +//#region (imports) +import { Component, OnDestroy, OnInit } from '@angular/core' +import { events } from '../../models/events.model' +import { EventsService } from '../../services/events.service' +import { Subscription } from 'rxjs' +import * as _ from 'lodash' +import { HttpErrorResponse } from '@angular/common/http' +import { MatSnackBar } from '@angular/material/snack-bar' +//#endregion + +@Component({ + selector: 'ws-app-past-events', + templateUrl: './past-events.component.html', + styleUrls: ['./past-events.component.scss'] +}) +export class PastEventsComponent implements OnInit, OnDestroy { + //#region (global variables) + tableData!: events.tableData + paginationDetails!: events.pagination + menuItems!: events.menuItems[] + eventsList: any[] = [] + getEventSubscription!: Subscription + showEventsLoader = false + searchKey = '' + //#endregion + + //#region (constructor) + constructor( + private eventSvc: EventsService, + private matSnackBar: MatSnackBar + ) { } + //#endregion + + //#region (onInint) + ngOnInit(): void { + this.initialization() + this.getEvents() + } + + initialization() { + this.tableData = { + columns: [ + { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, + { displayName: 'Start Date', key: 'startDate', cellType: 'text' }, + { displayName: 'Created On', key: 'createdOn', cellType: 'text' }, + { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, + { displayName: 'Submitted On', key: 'submitedOn', cellType: 'text' }, + ], + showSearchBox: true, + showPagination: true, + noDataMessage: 'There are no past events.' + } + + this.paginationDetails = { + startIndex: 0, + lastIndex: 20, + pageSize: 20, + pageIndex: 0, + totalCount: 20, + } + + this.menuItems = [ + { + btnText: 'Edit', + action: 'edit', + }, + ] + } + + getEvents() { + const requestObj = { + locale: [ + 'en', + ], + request: { + query: this.searchKey, + limit: _.get(this.paginationDetails, 'pageSize', 20), + offset: _.get(this.paginationDetails, 'pageIndex', 0), + filters: { + status: ['Live'], + contentType: 'Event', + }, + sort_by: { + startDate: 'desc', + }, + }, + } + + if (this.getEventSubscription) { + this.getEventSubscription.unsubscribe() + } + this.showEventsLoader = true + this.getEventSubscription = this.eventSvc.getEvents(requestObj).subscribe( + { + next: (res: any) => { + this.showEventsLoader = false + this.eventsList = _.get(res, 'result.Event', []) + this.paginationDetails['totalCount'] = _.get(res, 'result.count', 0) + }, + error: (error: HttpErrorResponse) => { + this.showEventsLoader = false + const errorMessage = _.get(error, 'error.message', 'Some thing went wrong') + this.openSnackBar(errorMessage) + } + } + ) + } + //#endregion + + //#region (ui interactions like click) + searchEvents(searchKey: string) { + this.searchKey = searchKey + this.getEvents() + } + + onPageChange(paginationDetails: events.pagination) { + this.paginationDetails = paginationDetails + this.getEvents() + } + + contentEvents(events: any) { + console.log(events) + } + + //#endregion + + private openSnackBar(message: string) { + this.matSnackBar.open(message) + } + + ngOnDestroy(): void { + if (this.getEventSubscription) { + this.getEventSubscription.unsubscribe() + } + } + +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.html new file mode 100644 index 000000000..544175913 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.html @@ -0,0 +1,5 @@ +
+ +
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.spec.ts new file mode 100644 index 000000000..d05e97f69 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { PendingApprovalEventsComponent } from './pending-approval-events.component'; + +describe('PendingApprovalEventsComponent', () => { + let component: PendingApprovalEventsComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [PendingApprovalEventsComponent] + }); + fixture = TestBed.createComponent(PendingApprovalEventsComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.ts new file mode 100644 index 000000000..2bf322ffd --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.ts @@ -0,0 +1,137 @@ +//#region (imports) +import { Component, OnDestroy, OnInit } from '@angular/core' +import { events } from '../../models/events.model' +import { EventsService } from '../../services/events.service' +import { Subscription } from 'rxjs' +import * as _ from 'lodash' +import { HttpErrorResponse } from '@angular/common/http' +import { MatSnackBar } from '@angular/material/snack-bar' +//#endregion + +@Component({ + selector: 'ws-app-pending-approval-events', + templateUrl: './pending-approval-events.component.html', + styleUrls: ['./pending-approval-events.component.scss'] +}) +export class PendingApprovalEventsComponent implements OnInit, OnDestroy { + //#region (global variables) + tableData!: events.tableData + paginationDetails!: events.pagination + menuItems!: events.menuItems[] + eventsList: any[] = [] + getEventSubscription!: Subscription + showEventsLoader = false + searchKey = '' + //#endregion + + //#region (constructor) + constructor( + private eventSvc: EventsService, + private matSnackBar: MatSnackBar + ) { } + //#endregion + + //#region (onInint) + ngOnInit(): void { + this.initialization() + this.getEvents() + } + + initialization() { + this.tableData = { + columns: [ + { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, + { displayName: 'Start Date', key: 'startDate', cellType: 'text' }, + { displayName: 'Created On', key: 'createdOn', cellType: 'text' }, + { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, + { displayName: 'Submitted On', key: 'submitedOn', cellType: 'text' }, + ], + showSearchBox: true, + showPagination: true, + noDataMessage: 'There are no pending events.' + } + + this.paginationDetails = { + startIndex: 0, + lastIndex: 20, + pageSize: 20, + pageIndex: 0, + totalCount: 20, + } + + this.menuItems = [ + { + btnText: 'Edit', + action: 'edit', + }, + ] + } + + getEvents() { + const requestObj = { + locale: [ + 'en', + ], + request: { + query: this.searchKey, + limit: _.get(this.paginationDetails, 'pageSize', 20), + offset: _.get(this.paginationDetails, 'pageIndex', 0), + filters: { + status: ['Live'], + contentType: 'Event', + }, + sort_by: { + startDate: 'desc', + }, + }, + } + + if (this.getEventSubscription) { + this.getEventSubscription.unsubscribe() + } + this.showEventsLoader = true + this.getEventSubscription = this.eventSvc.getEvents(requestObj).subscribe( + { + next: (res: any) => { + this.showEventsLoader = false + this.eventsList = _.get(res, 'result.Event', []) + this.paginationDetails['totalCount'] = _.get(res, 'result.count', 0) + }, + error: (error: HttpErrorResponse) => { + this.showEventsLoader = false + const errorMessage = _.get(error, 'error.message', 'Some thing went wrong') + this.openSnackBar(errorMessage) + } + } + ) + } + //#endregion + + //#region (ui interactions like click) + searchEvents(searchKey: string) { + this.searchKey = searchKey + this.getEvents() + } + + onPageChange(paginationDetails: events.pagination) { + this.paginationDetails = paginationDetails + this.getEvents() + } + + contentEvents(events: any) { + console.log(events) + } + + //#endregion + + private openSnackBar(message: string) { + this.matSnackBar.open(message) + } + + ngOnDestroy(): void { + if (this.getEventSubscription) { + this.getEventSubscription.unsubscribe() + } + } + +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.html new file mode 100644 index 000000000..544175913 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.html @@ -0,0 +1,5 @@ +
+ +
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.spec.ts new file mode 100644 index 000000000..dd7350edd --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { RejectedEventsComponent } from './rejected-events.component'; + +describe('RejectedEventsComponent', () => { + let component: RejectedEventsComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [RejectedEventsComponent] + }); + fixture = TestBed.createComponent(RejectedEventsComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.ts new file mode 100644 index 000000000..94e112b38 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.ts @@ -0,0 +1,137 @@ +//#region (imports) +import { Component, OnDestroy, OnInit } from '@angular/core' +import { events } from '../../models/events.model' +import { EventsService } from '../../services/events.service' +import { Subscription } from 'rxjs' +import * as _ from 'lodash' +import { HttpErrorResponse } from '@angular/common/http' +import { MatSnackBar } from '@angular/material/snack-bar' +//#endregion + +@Component({ + selector: 'ws-app-rejected-events', + templateUrl: './rejected-events.component.html', + styleUrls: ['./rejected-events.component.scss'] +}) +export class RejectedEventsComponent implements OnInit, OnDestroy { + //#region (global variables) + tableData!: events.tableData + paginationDetails!: events.pagination + menuItems!: events.menuItems[] + eventsList: any[] = [] + getEventSubscription!: Subscription + showEventsLoader = false + searchKey = '' + //#endregion + + //#region (constructor) + constructor( + private eventSvc: EventsService, + private matSnackBar: MatSnackBar + ) { } + //#endregion + + //#region (onInint) + ngOnInit(): void { + this.initialization() + this.getEvents() + } + + initialization() { + this.tableData = { + columns: [ + { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, + { displayName: 'Start Date', key: 'startDate', cellType: 'text' }, + { displayName: 'Created On', key: 'createdOn', cellType: 'text' }, + { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, + { displayName: 'Submitted On', key: 'submitedOn', cellType: 'text' }, + ], + showSearchBox: true, + showPagination: true, + noDataMessage: 'There are no rejected events.' + } + + this.paginationDetails = { + startIndex: 0, + lastIndex: 20, + pageSize: 20, + pageIndex: 0, + totalCount: 20, + } + + this.menuItems = [ + { + btnText: 'Edit', + action: 'edit', + }, + ] + } + + getEvents() { + const requestObj = { + locale: [ + 'en', + ], + request: { + query: this.searchKey, + limit: _.get(this.paginationDetails, 'pageSize', 20), + offset: _.get(this.paginationDetails, 'pageIndex', 0), + filters: { + status: ['Live'], + contentType: 'Event', + }, + sort_by: { + startDate: 'desc', + }, + }, + } + + if (this.getEventSubscription) { + this.getEventSubscription.unsubscribe() + } + this.showEventsLoader = true + this.getEventSubscription = this.eventSvc.getEvents(requestObj).subscribe( + { + next: (res: any) => { + this.showEventsLoader = false + this.eventsList = _.get(res, 'result.Event', []) + this.paginationDetails['totalCount'] = _.get(res, 'result.count', 0) + }, + error: (error: HttpErrorResponse) => { + this.showEventsLoader = false + const errorMessage = _.get(error, 'error.message', 'Some thing went wrong') + this.openSnackBar(errorMessage) + } + } + ) + } + //#endregion + + //#region (ui interactions like click) + searchEvents(searchKey: string) { + this.searchKey = searchKey + this.getEvents() + } + + onPageChange(paginationDetails: events.pagination) { + this.paginationDetails = paginationDetails + this.getEvents() + } + + contentEvents(events: any) { + console.log(events) + } + + //#endregion + + private openSnackBar(message: string) { + this.matSnackBar.open(message) + } + + ngOnDestroy(): void { + if (this.getEventSubscription) { + this.getEventSubscription.unsubscribe() + } + } + +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.html new file mode 100644 index 000000000..544175913 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.html @@ -0,0 +1,5 @@ +
+ +
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.spec.ts new file mode 100644 index 000000000..4b51ddead --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { UpcomingEventsComponent } from './upcoming-events.component'; + +describe('UpcomingEventsComponent', () => { + let component: UpcomingEventsComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [UpcomingEventsComponent] + }); + fixture = TestBed.createComponent(UpcomingEventsComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.ts new file mode 100644 index 000000000..621d5af9f --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.ts @@ -0,0 +1,137 @@ +//#region (imports) +import { Component, OnDestroy, OnInit } from '@angular/core' +import { events } from '../../models/events.model' +import { EventsService } from '../../services/events.service' +import { Subscription } from 'rxjs' +import * as _ from 'lodash' +import { HttpErrorResponse } from '@angular/common/http' +import { MatSnackBar } from '@angular/material/snack-bar' +//#endregion + +@Component({ + selector: 'ws-app-upcoming-events', + templateUrl: './upcoming-events.component.html', + styleUrls: ['./upcoming-events.component.scss'] +}) +export class UpcomingEventsComponent implements OnInit, OnDestroy { + //#region (global variables) + tableData!: events.tableData + paginationDetails!: events.pagination + menuItems!: events.menuItems[] + eventsList: any[] = [] + getEventSubscription!: Subscription + showEventsLoader = false + searchKey = '' + //#endregion + + //#region (constructor) + constructor( + private eventSvc: EventsService, + private matSnackBar: MatSnackBar + ) { } + //#endregion + + //#region (onInint) + ngOnInit(): void { + this.initialization() + this.getEvents() + } + + initialization() { + this.tableData = { + columns: [ + { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, + { displayName: 'Start Date', key: 'startDate', cellType: 'text' }, + { displayName: 'Created On', key: 'createdOn', cellType: 'text' }, + { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, + { displayName: 'Submitted On', key: 'submitedOn', cellType: 'text' }, + ], + showSearchBox: true, + showPagination: true, + noDataMessage: 'There are no upcoming events.' + } + + this.paginationDetails = { + startIndex: 0, + lastIndex: 20, + pageSize: 20, + pageIndex: 0, + totalCount: 20, + } + + this.menuItems = [ + { + btnText: 'Edit', + action: 'edit', + }, + ] + } + + getEvents() { + const requestObj = { + locale: [ + 'en', + ], + request: { + query: this.searchKey, + limit: _.get(this.paginationDetails, 'pageSize', 20), + offset: _.get(this.paginationDetails, 'pageIndex', 0), + filters: { + status: ['Live'], + contentType: 'Event', + }, + sort_by: { + startDate: 'desc', + }, + }, + } + + if (this.getEventSubscription) { + this.getEventSubscription.unsubscribe() + } + this.showEventsLoader = true + this.getEventSubscription = this.eventSvc.getEvents(requestObj).subscribe( + { + next: (res: any) => { + this.showEventsLoader = false + this.eventsList = _.get(res, 'result.Event', []) + this.paginationDetails['totalCount'] = _.get(res, 'result.count', 0) + }, + error: (error: HttpErrorResponse) => { + this.showEventsLoader = false + const errorMessage = _.get(error, 'error.message', 'Some thing went wrong') + this.openSnackBar(errorMessage) + } + } + ) + } + //#endregion + + //#region (ui interactions like click) + searchEvents(searchKey: string) { + this.searchKey = searchKey + this.getEvents() + } + + onPageChange(paginationDetails: events.pagination) { + this.paginationDetails = paginationDetails + this.getEvents() + } + + contentEvents(events: any) { + console.log(events) + } + + //#endregion + + private openSnackBar(message: string) { + this.matSnackBar.open(message) + } + + ngOnDestroy(): void { + if (this.getEventSubscription) { + this.getEventSubscription.unsubscribe() + } + } + +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts b/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts index 169d43bab..27abad770 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts @@ -2,18 +2,70 @@ import { NgModule } from '@angular/core' import { RouterModule, Routes } from '@angular/router' import { EventsComponent } from './components/events/events.component' import { CreateEventComponent } from './components/create-event/create-event.component' +import { UpcomingEventsComponent } from './components/upcoming-events/upcoming-events.component' +import { DraftEventsComponent } from './components/draft-events/draft-events.component' +import { PendingApprovalEventsComponent } from './components/pending-approval-events/pending-approval-events.component' +import { PastEventsComponent } from './components/past-events/past-events.component' +import { RejectedEventsComponent } from './components/rejected-events/rejected-events.component' const routes: Routes = [ { path: '', - pathMatch: 'full', component: EventsComponent, data: { pageId: 'home/events', module: 'events-2', pageType: 'feature', pageKey: 'events', + path: '', }, + children: [ + { + path: '', + redirectTo: 'pending-approval', + pathMatch: 'full', + }, + { + path: 'upcoming', + component: UpcomingEventsComponent, + data: { + pageId: 'app/home/events/upcoming', + module: 'events-2', + }, + }, + { + path: 'draft', + component: DraftEventsComponent, + data: { + pageId: 'app/home/events/draft', + module: 'events-2', + }, + }, + { + path: 'pending-approval', + component: PendingApprovalEventsComponent, + data: { + pageId: 'app/home/events/pending-approval', + module: 'events-2', + }, + }, + { + path: 'past', + component: PastEventsComponent, + data: { + pageId: 'app/home/events/past', + module: 'events-2', + }, + }, + { + path: 'rejected', + component: RejectedEventsComponent, + data: { + pageId: 'app/home/events/rejected', + module: 'events-2', + }, + }, + ], }, { path: 'create-event/:id', pathMatch: 'full', diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts b/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts index 02d028f9a..af826cad6 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts @@ -13,8 +13,19 @@ import { MatLegacyButtonModule } from '@angular/material/legacy-button' import { MatLegacyDialogModule } from '@angular/material/legacy-dialog' import { MatLegacyProgressSpinnerModule } from '@angular/material/legacy-progress-spinner' import { MatLegacyFormFieldModule } from '@angular/material/legacy-form-field' -import { MatLegacyTooltipModule } from '@angular/material/legacy-tooltip'; +import { MatLegacyTooltipModule } from '@angular/material/legacy-tooltip' +import { MatLegacyMenuModule as MatMenuModule } from '@angular/material/legacy-menu' import { EventsTableComponent } from './components/events-table/events-table.component' +import { UpcomingEventsComponent } from './components/upcoming-events/upcoming-events.component' +import { DraftEventsComponent } from './components/draft-events/draft-events.component' +import { PendingApprovalEventsComponent } from './components/pending-approval-events/pending-approval-events.component' +import { PastEventsComponent } from './components/past-events/past-events.component' +import { RejectedEventsComponent } from './components/rejected-events/rejected-events.component' +import { MatCardModule } from '@angular/material/card' +import { MatSnackBarModule } from '@angular/material/snack-bar' +import { MatTableModule } from '@angular/material/table' +import { MatIconModule } from '@angular/material/icon' +import { MatPaginatorModule } from '@angular/material/paginator' @NgModule({ @@ -25,7 +36,12 @@ import { EventsTableComponent } from './components/events-table/events-table.com SpeakersComponent, EventMaterialsComponent, EventCompetenciesComponent, - EventsTableComponent + EventsTableComponent, + UpcomingEventsComponent, + DraftEventsComponent, + PendingApprovalEventsComponent, + PastEventsComponent, + RejectedEventsComponent ], imports: [ CommonModule, @@ -36,7 +52,13 @@ import { EventsTableComponent } from './components/events-table/events-table.com MatLegacyProgressSpinnerModule, MatLegacyFormFieldModule, MatLegacyTooltipModule, + MatMenuModule, Events2RoutingModule, + MatCardModule, + MatSnackBarModule, + MatTableModule, + MatIconModule, + MatPaginatorModule, ] }) export class Events2Module { } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/models/events.model.ts b/project/ws/app/src/lib/routes/home/routes/events-2/models/events.model.ts new file mode 100644 index 000000000..d0e99ae95 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/models/events.model.ts @@ -0,0 +1,30 @@ +export namespace events { + export interface tableData { + columns: columnData[], + showSearchBox: boolean, + showPagination: boolean, + noDataMessage?: string + } + + export interface columnData { + displayName: string, + key: string, + cellType: string, + imageKey?: string, + cellClass?: string + } + + export interface pagination { + startIndex: number, + lastIndex: number, + pageSize: number, + pageIndex: number, + totalCount: number, + } + + export interface menuItems { + icon?: string, + btnText: string, + action: string, + } +} \ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.ts b/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.ts index 1bc4b1b82..ebe35ec53 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.ts @@ -1,9 +1,20 @@ -import { Injectable } from '@angular/core'; +import { HttpClient } from '@angular/common/http' +import { Injectable } from '@angular/core' + +const API_END_POINTS = { + GET_EVENTS: '/apis/proxies/v8/sunbirdigot/search', +} @Injectable({ providedIn: 'root' }) export class EventsService { - constructor() { } + constructor( + private http: HttpClient + ) { } + + getEvents(req: any) { + return this.http.post(`${API_END_POINTS.GET_EVENTS}`, req) + } } From f0ab18cb5d1c51078d572cd23cad3be805c5634b Mon Sep 17 00:00:00 2001 From: mansurskTarento Date: Fri, 31 Jan 2025 12:45:34 +0530 Subject: [PATCH 03/14] added create event --- .../home/resolvers/config-resolve.service.ts | 3 +- .../create-event/create-event.component.ts | 67 +++++- .../draft-events/draft-events.component.ts | 12 +- .../events-table/events-table.component.html | 12 +- .../events-table/events-table.component.scss | 21 +- .../components/events/events.component.html | 56 ++--- .../components/events/events.component.scss | 2 + .../components/events/events.component.ts | 24 ++- .../past-events/past-events.component.ts | 12 +- .../pending-approval-events.component.ts | 12 +- .../rejected-events.component.ts | 12 +- .../upcoming-events.component.ts | 12 +- .../basic-info/basic-info.component.html | 104 ++++++++- .../basic-info/basic-info.component.scss | 201 ++++++++++++++++++ .../basic-info/basic-info.component.ts | 182 +++++++++++++++- .../events-2/events-2-routing.module.ts | 6 +- .../home/routes/events-2/events-2.module.ts | 24 ++- .../routes/events-2/models/events.model.ts | 13 ++ .../events-2/services/events.service.ts | 45 +++- .../custom-self-registration.component.ts | 2 +- 20 files changed, 735 insertions(+), 87 deletions(-) diff --git a/project/ws/app/src/lib/routes/home/resolvers/config-resolve.service.ts b/project/ws/app/src/lib/routes/home/resolvers/config-resolve.service.ts index 787feff20..1117dcf4a 100644 --- a/project/ws/app/src/lib/routes/home/resolvers/config-resolve.service.ts +++ b/project/ws/app/src/lib/routes/home/resolvers/config-resolve.service.ts @@ -3,8 +3,7 @@ import { Injectable, SkipSelf } from '@angular/core' import { Observable, of } from 'rxjs' import { ConfigurationsService } from '@sunbird-cb/utils' @Injectable() -export class ConfigResolveService - { +export class ConfigResolveService { constructor( @SkipSelf() private confService: ConfigurationsService, ) { } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts index f05c32ac1..528d71855 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts @@ -1,10 +1,73 @@ -import { Component } from '@angular/core'; +import { Component, OnDestroy, OnInit } from '@angular/core' +import { EventsService } from '../../services/events.service' +import { ActivatedRoute } from '@angular/router' +import * as _ from 'lodash' +import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms' +import { material, speaker } from '../../models/events.model' @Component({ selector: 'ws-app-create-event', templateUrl: './create-event.component.html', styleUrls: ['./create-event.component.scss'] }) -export class CreateEventComponent { +export class CreateEventComponent implements OnInit, OnDestroy { + //#region (global varialbles) + eventId = '' + eventIconUrl = '' + eventDetails!: FormGroup + speakersList: speaker[] = [] + materialsList: material[] = [] + competencies: any + //#endregion + + constructor( + private eventSvc: EventsService, + private activatedRoute: ActivatedRoute, + private formBuilder: FormBuilder + ) { } + + //#region (onInit) + ngOnInit(): void { + this.initializeFormAndParams() + // this.getEventId() + } + + initializeFormAndParams() { + this.eventDetails = this.formBuilder.group({ + eventName: new FormControl('', [Validators.required]), + description: new FormControl('', [Validators.required]), + eventCategory: new FormControl('', [Validators.required]), + streamType: new FormControl('', [Validators.required]), + startDate: new FormControl('', [Validators.required]), + startTime: new FormControl('', [Validators.required]), + endTime: new FormControl('', [Validators.required]) + }) + } + + getEventId() { + this.eventId = _.get(this.activatedRoute, 'snapshot.paramMap.params.eventId') + if (this.eventId) { + this.getEventDetails() + } + } + + getEventDetails() { + this.eventSvc.getEventDetailsByid(this.eventId).subscribe({ + next: res => { + if (res) { + this.patchEventDetails(res) + } + } + }) + } + + patchEventDetails(res: any) { + console.log('event details: ', res) + } + + //#endregion + + ngOnDestroy(): void { + } } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.ts index add3efaab..770573a18 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.ts @@ -5,7 +5,7 @@ import { EventsService } from '../../services/events.service' import { Subscription } from 'rxjs' import * as _ from 'lodash' import { HttpErrorResponse } from '@angular/common/http' -import { MatSnackBar } from '@angular/material/snack-bar' +import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar' //#endregion @Component({ @@ -41,10 +41,10 @@ export class DraftEventsComponent implements OnInit, OnDestroy { this.tableData = { columns: [ { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, - { displayName: 'Start Date', key: 'startDate', cellType: 'text' }, - { displayName: 'Created On', key: 'createdOn', cellType: 'text' }, + { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, + { displayName: 'Created On', key: 'createdOn', cellType: 'date' }, { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, - { displayName: 'Submitted On', key: 'submitedOn', cellType: 'text' }, + { displayName: 'Submitted On', key: 'submitedOn', cellType: 'date' }, ], showSearchBox: true, showPagination: true, @@ -94,8 +94,8 @@ export class DraftEventsComponent implements OnInit, OnDestroy { { next: (res: any) => { this.showEventsLoader = false - this.eventsList = _.get(res, 'result.Event', []) - this.paginationDetails['totalCount'] = _.get(res, 'result.count', 0) + this.eventsList = _.get(res, 'Event', []) + this.paginationDetails['totalCount'] = _.get(res, 'count', 0) }, error: (error: HttpErrorResponse) => { this.showEventsLoader = false diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.html index d2782f7df..2d5a068e0 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.html @@ -1,4 +1,4 @@ -
+
@@ -21,9 +21,9 @@ {{col.displayName}} - + - logo + logo {{element[col.key]}} @@ -32,10 +32,10 @@ - + {{col.displayName}} - + {{element[col.key]}} @@ -86,7 +86,7 @@ -
+
diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.scss index 47b801501..88723dbe7 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.scss @@ -41,8 +41,8 @@ } .imageCell { - width: 63px; - margin-right: 15px; + width: 130px; + border-radius: 3px; } .delete-btn { @@ -64,7 +64,7 @@ /* stylelint-enable */ font: 400 14px Lato; /* stylelint-disable */ - width: 150px; + // width: 150px; } .text-overflow-elipse { @@ -174,6 +174,14 @@ } } +.table-date-header { + flex: 0 0 125px; +} + +.table-date-column { + flex: 0 0 125px; +} + .table-menu-header { flex: 0 0 200px; } @@ -192,14 +200,15 @@ /* stylelint-disable */ } -.coursesTableLoader { +.eventsTableLoader { height: calc(100vh - 300px); } -:host ::ng-deep .courses-table { - .mat-header-row { +:host ::ng-deep .events-table { + .mat-mdc-header-row { background-color: #F5F5F5 !important; + min-height: 40px !important; } } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.html index 76744d6d4..786cc8103 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.html @@ -1,29 +1,33 @@ -
-
- Event - -
-
-
- Upcoming - - Draft - - Pending Approval - - Past - - Rejected - +
+ +
+ Event +
-
+ +
+
+ Upcoming + + Draft + + Pending Approval + + Past + + Rejected + +
+
-
- -
+
+ +
+ +
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.scss index ac56f1255..87221a42b 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.scss @@ -23,6 +23,7 @@ /* stylelint-disable */ font: 400 14px Lato; /* stylelint-enable */ + // margin-bottom: 5px } .ws-mat-accent-border-active { @@ -34,5 +35,6 @@ .filter-option:first-child { margin-left: 0; + margin-bottom: 5px } } \ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.ts index 06af3d62c..08912802d 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.ts @@ -1,7 +1,10 @@ //#region (imports) import { Component, OnDestroy, OnInit } from '@angular/core' -import { NavigationEnd, Router } from '@angular/router' +import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog' +import { ActivatedRoute, NavigationEnd, Router } from '@angular/router' import { Subscription } from 'rxjs' +import { BasicInfoComponent } from '../../dialogs/basic-info/basic-info.component' +import * as _ from 'lodash' //#endregion @@ -15,11 +18,14 @@ export class EventsComponent implements OnInit, OnDestroy { //#region (global variables) currentRoute = 'pending-approval' routeSubscription: Subscription = new Subscription() + userProfile: any //#endregion //#region (constructor) constructor( private router: Router, + private dialog: MatDialog, + private activeRoute: ActivatedRoute ) { } //#endregion @@ -27,6 +33,7 @@ export class EventsComponent implements OnInit, OnDestroy { //#region (onint) ngOnInit(): void { this.initialization() + this.getRouteSubscription } initialization() { @@ -40,15 +47,28 @@ export class EventsComponent implements OnInit, OnDestroy { this.updateCurrentRoute() } }) + if (_.get(this.activeRoute, 'snapshot.data.configService.userProfile')) { + this.userProfile = _.get(this.activeRoute, 'snapshot.data.configService.userProfile') + } } updateCurrentRoute(): void { const urlSegments = this.router.url.split('/') this.currentRoute = urlSegments[urlSegments.length - 1] } - //#endregion + openBasicInfoDialog() { + const dialgRrf = this.dialog.open(BasicInfoComponent, { + panelClass: 'create-event-dialog', + data: this.userProfile, + }) + + dialgRrf.afterClosed().subscribe((event: any) => { + if (event) { } + }) + } + ngOnDestroy(): void { if (this.routeSubscription) { this.routeSubscription.unsubscribe() diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.ts index 10ff8923b..400507208 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.ts @@ -5,7 +5,7 @@ import { EventsService } from '../../services/events.service' import { Subscription } from 'rxjs' import * as _ from 'lodash' import { HttpErrorResponse } from '@angular/common/http' -import { MatSnackBar } from '@angular/material/snack-bar' +import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar' //#endregion @Component({ @@ -41,10 +41,10 @@ export class PastEventsComponent implements OnInit, OnDestroy { this.tableData = { columns: [ { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, - { displayName: 'Start Date', key: 'startDate', cellType: 'text' }, - { displayName: 'Created On', key: 'createdOn', cellType: 'text' }, + { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, + { displayName: 'Created On', key: 'createdOn', cellType: 'date' }, { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, - { displayName: 'Submitted On', key: 'submitedOn', cellType: 'text' }, + { displayName: 'Submitted On', key: 'submitedOn', cellType: 'date' }, ], showSearchBox: true, showPagination: true, @@ -94,8 +94,8 @@ export class PastEventsComponent implements OnInit, OnDestroy { { next: (res: any) => { this.showEventsLoader = false - this.eventsList = _.get(res, 'result.Event', []) - this.paginationDetails['totalCount'] = _.get(res, 'result.count', 0) + this.eventsList = _.get(res, 'Event', []) + this.paginationDetails['totalCount'] = _.get(res, 'count', 0) }, error: (error: HttpErrorResponse) => { this.showEventsLoader = false diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.ts index 2bf322ffd..18ae7c8fc 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.ts @@ -5,7 +5,7 @@ import { EventsService } from '../../services/events.service' import { Subscription } from 'rxjs' import * as _ from 'lodash' import { HttpErrorResponse } from '@angular/common/http' -import { MatSnackBar } from '@angular/material/snack-bar' +import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar' //#endregion @Component({ @@ -41,10 +41,10 @@ export class PendingApprovalEventsComponent implements OnInit, OnDestroy { this.tableData = { columns: [ { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, - { displayName: 'Start Date', key: 'startDate', cellType: 'text' }, - { displayName: 'Created On', key: 'createdOn', cellType: 'text' }, + { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, + { displayName: 'Created On', key: 'createdOn', cellType: 'date' }, { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, - { displayName: 'Submitted On', key: 'submitedOn', cellType: 'text' }, + { displayName: 'Submitted On', key: 'submitedOn', cellType: 'date' }, ], showSearchBox: true, showPagination: true, @@ -94,8 +94,8 @@ export class PendingApprovalEventsComponent implements OnInit, OnDestroy { { next: (res: any) => { this.showEventsLoader = false - this.eventsList = _.get(res, 'result.Event', []) - this.paginationDetails['totalCount'] = _.get(res, 'result.count', 0) + this.eventsList = _.get(res, 'Event', []) + this.paginationDetails['totalCount'] = _.get(res, 'count', 0) }, error: (error: HttpErrorResponse) => { this.showEventsLoader = false diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.ts index 94e112b38..2484ebe24 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.ts @@ -5,7 +5,7 @@ import { EventsService } from '../../services/events.service' import { Subscription } from 'rxjs' import * as _ from 'lodash' import { HttpErrorResponse } from '@angular/common/http' -import { MatSnackBar } from '@angular/material/snack-bar' +import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar' //#endregion @Component({ @@ -41,10 +41,10 @@ export class RejectedEventsComponent implements OnInit, OnDestroy { this.tableData = { columns: [ { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, - { displayName: 'Start Date', key: 'startDate', cellType: 'text' }, - { displayName: 'Created On', key: 'createdOn', cellType: 'text' }, + { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, + { displayName: 'Created On', key: 'createdOn', cellType: 'date' }, { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, - { displayName: 'Submitted On', key: 'submitedOn', cellType: 'text' }, + { displayName: 'Submitted On', key: 'submitedOn', cellType: 'date' }, ], showSearchBox: true, showPagination: true, @@ -94,8 +94,8 @@ export class RejectedEventsComponent implements OnInit, OnDestroy { { next: (res: any) => { this.showEventsLoader = false - this.eventsList = _.get(res, 'result.Event', []) - this.paginationDetails['totalCount'] = _.get(res, 'result.count', 0) + this.eventsList = _.get(res, 'Event', []) + this.paginationDetails['totalCount'] = _.get(res, 'count', 0) }, error: (error: HttpErrorResponse) => { this.showEventsLoader = false diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.ts index 621d5af9f..f3c1734ae 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.ts @@ -5,7 +5,7 @@ import { EventsService } from '../../services/events.service' import { Subscription } from 'rxjs' import * as _ from 'lodash' import { HttpErrorResponse } from '@angular/common/http' -import { MatSnackBar } from '@angular/material/snack-bar' +import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar' //#endregion @Component({ @@ -41,10 +41,10 @@ export class UpcomingEventsComponent implements OnInit, OnDestroy { this.tableData = { columns: [ { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, - { displayName: 'Start Date', key: 'startDate', cellType: 'text' }, - { displayName: 'Created On', key: 'createdOn', cellType: 'text' }, + { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, + { displayName: 'Created On', key: 'createdOn', cellType: 'date' }, { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, - { displayName: 'Submitted On', key: 'submitedOn', cellType: 'text' }, + { displayName: 'Submitted On', key: 'submitedOn', cellType: 'date' }, ], showSearchBox: true, showPagination: true, @@ -94,8 +94,8 @@ export class UpcomingEventsComponent implements OnInit, OnDestroy { { next: (res: any) => { this.showEventsLoader = false - this.eventsList = _.get(res, 'result.Event', []) - this.paginationDetails['totalCount'] = _.get(res, 'result.count', 0) + this.eventsList = _.get(res, 'Event', []) + this.paginationDetails['totalCount'] = _.get(res, 'count', 0) }, error: (error: HttpErrorResponse) => { this.showEventsLoader = false diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.html index 7ea6c4a86..3c7bfc30f 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.html @@ -1 +1,103 @@ -

basic-info works!

+
+
+
+
+

+ Basic + Information

+
+
+ Event Name + * + +
+ + + Only ( a-z/A-Z , 0-9 . - _ $ / : [ ]' ' !) characters are supported + + event name is mandatory + + + Only ( a-z/A-Z , 0-9 . _ - $ / : [ ]' ' !) characters are supported + + +
+ + +
+ Event Type + * +
+ + + Live Event + + + Recorded Event + + +
+
+ + +
+ +
+
+ +
+
+ + +
+ + +
+ icon + Upload Images * + Supported file types: PNG, JPG + Max Size - 400MB +
+ + +
+ image +
+ +
+ +
+
+ event icon + + Event + +
+
+ + + + + + +
+
+ + Karmayogi Bharat +
+
+ + +
+
+
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.scss index e69de29bb..004a8444c 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.scss @@ -0,0 +1,201 @@ +@import 'ws-vars'; +$secondary-color: #F3962F; +$primary-color: #1B4CA1; + +::ng-deep .create-event-dialog { + .mat-form-field-appearance-outline .mat-form-field-infix { + padding: 5px 0px 10px; + } + + .mat-form-field-appearance-outline .mat-form-field-outline-end { + border-left-style: solid !important; + border-radius: 25px !important; + } + + .mat-form-field-appearance-outline .mat-form-field-outline-start { + display: none; + } + + .mat-dialog-container { + padding: 0 !important; + border-radius: 8px !important; + } + + &::-webkit-scrollbar { + width: 12px; + } + + &::-webkit-scrollbar-track { + background: #fff; + } + + &::-webkit-scrollbar-thumb { + background-color: #E9ECEF; + border-radius: 8px; + border: 3px solid transparent; + } + + &::-webkit-scrollbar-thumb:hover { + background-color: #ccc; + } +} + +.search-c ::ng-deep.mat-form-field-infix { + display: flex; + flex-direction: row-reverse; + gap: 9px; + align-items: center; +} + +.event-input-wrapper p { + line-height: 24.38px; +} + +.height-480 { + height: 480px !important; +} + +.create-cont { + height: 451px; + width: 1016px !important; +} + +.cancel-button { + width: 74px; + height: 32px !important; + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ + border-radius: 17px; +} + +.save-button { + width: 62px; + height: 32px !important; + background-color: #1B4CA1 !important; + color: #FFFFFF !important; + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ + border-radius: 17px; +} + +.save-event { + position: absolute; + bottom: 16px; + left: 0; + right: 0; +} + +.event-img { + height: 16px; + width: 16px; + margin-bottom: 2px; +} + + + +.upload-event-details { + // background-color: #a4b7d9; + height: 100%; + background: url('/assets/icons/Card BG png.png') no-repeat center center/cover; + + .upload-card { + padding: 0; + width: 350px; + margin: 47px 41px 48px 41px; + border-radius: 16px; + + + .upload { + background: linear-gradient(0deg, #EDF7FF 0%, #EDF7FF 100%), #FFF; + + min-height: 201px; + height: 201px; + overflow: hidden; + position: relative; + border-top-left-radius: 16px; + border-top-right-radius: 16px; + + + span:first-child { + color: $primary-color; + } + + span:last-child { + line-height: 14.4px; + color: #666666; + } + } + + .preview-img { + width: 100%; + height: auto; + object-fit: cover; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + } + + mat-icon { + color: $secondary-color; + } + + .details-event { + .content-type { + border: 1px solid $secondary-color; + padding: 3.5px 8.5px 3.5px 7.5px; + background-color: #FEFAF4; + border-radius: 15px; + } + } + } + + .custome-title { + /* stylelint-enable */ + font-family: 'Montserrat'; + /* stylelint-disable */ + font-weight: 600; + font-size: 20px; + color: rgba(0, 0, 0, 0.40); + overflow: hidden; + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2; + line-height: 24.38px; + max-height: 2.4em; + text-overflow: ellipsis; + } + + + +} + + ::ng-deep .new-toolTip { + background: #000000 !important; + font-size: 14px; + } + +.text-blue { + color: #1B4CA1 +} + +.dashed-border { + border: 2px dashed #1B4CA1; + +} + +.favicon { + width: 38px; + height: 38px; + border-radius: 5px; + border: 1px solid #00000029; +} + +.karmayogi-text { + color: #1B2133; + /* stylelint-enable */ + font: 400 14px Lato; + /* stylelint-disable */ +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts index 2d59a5fde..f9e2c7540 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts @@ -1,10 +1,188 @@ -import { Component } from '@angular/core'; +import { Component, Inject, OnInit } from '@angular/core' +import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms' +import { MatLegacyDialogRef as MatDialogRef, MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA, } from '@angular/material/legacy-dialog' +import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar' +import { events } from '../../models/events.model' +import * as _ from 'lodash' +import { EventsService } from '../../services/events.service' +import { map, mergeMap } from 'rxjs/operators' +import { HttpErrorResponse } from '@angular/common/http' +import { environment } from '../../../../../../../../../../../src/environments/environment' @Component({ selector: 'ws-app-basic-info', templateUrl: './basic-info.component.html', styleUrls: ['./basic-info.component.scss'] }) -export class BasicInfoComponent { +export class BasicInfoComponent implements OnInit { + + eventForm!: FormGroup + imgURL: string | ArrayBuffer | null = null + imagePath: any + userProfile: any + + constructor( + private dialogRef: MatDialogRef, + @Inject(MAT_DIALOG_DATA) data: any, + private formBuilder: FormBuilder, + private matSnackBar: MatSnackBar, + private eventSvc: EventsService + ) { + this.userProfile = data + } + + ngOnInit(): void { + this.createForm() + } + + createForm() { + const noSpecialChar = new RegExp( + /^[\u0900-\u097F\u0980-\u09FF\u0C00-\u0C7F\u0B80-\u0BFF\u0C80-\u0CFF\u0D00-\u0D7F\u0A80-\u0AFF\u0B00-\u0B7F\u0A00-\u0A7Fa-zA-Z0-9\(\)\$\[\]\.\-,:!' _\/]*$/ // NOSONAR + ) + this.eventForm = this.formBuilder.group({ + eventName: new FormControl('', [Validators.required, Validators.pattern(noSpecialChar)]), + eventType: new FormControl('recorded', [Validators.required]), + }) + } + + onFileSelected(files: any) { + if (files.length === 0) { + return + } + const mimeType = files[0].type + if (mimeType.match(/image\/*/) == null) { + this.openSnackBar('Only JPG and PNG files are supported') + return + } + const reader = new FileReader() + this.imagePath = files[0] + if (this.imagePath && this.imagePath.size > events.IMAGE_MAX_SIZE) { + this.openSnackBar('Selected image size is more') + this.imagePath = '' + return + } + reader.readAsDataURL(files[0]) + reader.onload = _event => { + this.imgURL = reader.result + } + } + + onSave() { + if (this.eventForm.valid && this.imgURL) { + this.saveImage() + } + } + + saveImage() { + if (this.imagePath) { + const org = [] + const createdforarray: any[] = [] + createdforarray.push(_.get(this.userProfile, 'rootOrgId', '')) + org.push(_.get(this.userProfile, 'departmentName', '')) + + const request = { + request: { + content: { + name: 'image asset', + creator: _.get(this.userProfile, 'userName', ''), + createdBy: _.get(this.userProfile, 'userId', ''), + code: 'image asset', + mimeType: this.imagePath.type, + mediaType: 'image', + contentType: 'Asset', + primaryCategory: 'Asset', + organisation: org, + createdFor: createdforarray, + }, + }, + } + this.eventSvc.createContent(request).pipe(mergeMap((res: any) => { + const contentID = _.get(res, 'result.identifier') + const formData: FormData = new FormData() + formData.append('data', this.imagePath) + if (contentID) { + return this.eventSvc.uploadContent(contentID, formData).pipe(map((fdata: any) => { + return _.get(fdata, 'result.artifactUrl', '') + })) + } else { + throw new Error('Something went wrong please try again') + } + })).subscribe({ + next: res => { + if (res) { + const createdUrl = res + const urlToReplace = 'https://storage.googleapis.com/igot' + let appIcon = createdUrl + if (createdUrl.startsWith(urlToReplace)) { + const urlSplice = createdUrl.slice(urlToReplace.length).split('/') + appIcon = `${environment.karmYogiPath}/assets/public/${urlSplice.slice(1).join('/')}` + } + this.createEvent(appIcon) + } + }, + error: (error: HttpErrorResponse) => { + const errorMessage = _.get(error, 'error.message', 'Something went wrong please try again') + this.openSnackBar(errorMessage) + } + }) + } + } + + createEvent(appIcon: string) { + if (this.eventForm.valid && this.imgURL) { + const createdforarray: any[] = [] + createdforarray.push(_.get(this.userProfile, 'rootOrgId', '')) + const requestBody = { + request: { + event: { + mimeType: 'application/html', + locale: 'en', + isExternal: true, + name: _.get(this.eventForm, 'controls.eventName.value', ''), + description: '', + appIcon: appIcon, + category: 'Event', + createdBy: _.get(this.userProfile, 'userId', ''), + authoringDisabled: false, + isContentEditingDisabled: false, + isMetaEditingDisabled: false, + learningObjective: '', + expiryDate: '', + duration: 0, + registrationLink: '', + resourceType: '', + categoryType: 'Article', + creatorDetails: '', + sourceName: _.get(this.userProfile, 'departmentName', ''), + startDate: '', + endDate: '', + startTime: '', + endTime: '', + code: '', // what is this + eventType: 'Online', + registrationEndDate: '', + owner: _.get(this.userProfile, 'departmentName', ''), + createdFor: createdforarray, + } + } + } + this.eventSvc.createEvent(requestBody).subscribe({ + next: res => { + if (res) { + this.dialogRef.close(res) + } + }, + error: (error: HttpErrorResponse) => { + const errorMessage = _.get(error, 'error.message', 'Something went wrong while creating event, please try again') + this.openSnackBar(errorMessage) + } + }) + // this.dialogRef.close() + } + } + + private openSnackBar(message: string) { + this.matSnackBar.open(message) + } } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts b/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts index 27abad770..5543cc9f3 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts @@ -7,6 +7,7 @@ import { DraftEventsComponent } from './components/draft-events/draft-events.com import { PendingApprovalEventsComponent } from './components/pending-approval-events/pending-approval-events.component' import { PastEventsComponent } from './components/past-events/past-events.component' import { RejectedEventsComponent } from './components/rejected-events/rejected-events.component' +import { ConfigResolveService } from '../../resolvers/config-resolve.service' const routes: Routes = [ { @@ -19,6 +20,9 @@ const routes: Routes = [ pageKey: 'events', path: '', }, + resolve: { + configService: ConfigResolveService, + }, children: [ { path: '', @@ -67,7 +71,7 @@ const routes: Routes = [ }, ], }, { - path: 'create-event/:id', + path: 'edit-event/:eventId', pathMatch: 'full', component: CreateEventComponent } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts b/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts index af826cad6..8aefc7e1b 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts @@ -1,5 +1,5 @@ import { NgModule } from '@angular/core' -import { CommonModule } from '@angular/common' +import { CommonModule, DatePipe } from '@angular/common' import { Events2RoutingModule } from './events-2-routing.module' import { EventsComponent } from './components/events/events.component' @@ -10,22 +10,27 @@ import { EventMaterialsComponent } from './components/event-materials/event-mate import { EventCompetenciesComponent } from './components/event-competencies/event-competencies.component' import { FormsModule, ReactiveFormsModule } from '@angular/forms' import { MatLegacyButtonModule } from '@angular/material/legacy-button' -import { MatLegacyDialogModule } from '@angular/material/legacy-dialog' +import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog' import { MatLegacyProgressSpinnerModule } from '@angular/material/legacy-progress-spinner' import { MatLegacyFormFieldModule } from '@angular/material/legacy-form-field' import { MatLegacyTooltipModule } from '@angular/material/legacy-tooltip' import { MatLegacyMenuModule as MatMenuModule } from '@angular/material/legacy-menu' +import { MatLegacyInputModule as MatInputModule } from '@angular/material/legacy-input' +import { MatLegacyRadioModule as MatRadioModule } from '@angular/material/legacy-radio' +// import { MatLegacySnackBarModule as MatSnackBarModule } from '@angular/material/legacy-snack-bar' +import { MatSnackBarModule } from '@angular/material/snack-bar' import { EventsTableComponent } from './components/events-table/events-table.component' import { UpcomingEventsComponent } from './components/upcoming-events/upcoming-events.component' import { DraftEventsComponent } from './components/draft-events/draft-events.component' import { PendingApprovalEventsComponent } from './components/pending-approval-events/pending-approval-events.component' import { PastEventsComponent } from './components/past-events/past-events.component' import { RejectedEventsComponent } from './components/rejected-events/rejected-events.component' -import { MatCardModule } from '@angular/material/card' -import { MatSnackBarModule } from '@angular/material/snack-bar' +import { MatLegacyCardModule as MatCardModule } from '@angular/material/legacy-card' import { MatTableModule } from '@angular/material/table' import { MatIconModule } from '@angular/material/icon' import { MatPaginatorModule } from '@angular/material/paginator' +import { EventsService } from './services/events.service' +import { BasicInfoComponent } from './dialogs/basic-info/basic-info.component' @NgModule({ @@ -41,24 +46,31 @@ import { MatPaginatorModule } from '@angular/material/paginator' DraftEventsComponent, PendingApprovalEventsComponent, PastEventsComponent, - RejectedEventsComponent + RejectedEventsComponent, + BasicInfoComponent ], imports: [ CommonModule, FormsModule, ReactiveFormsModule, MatLegacyButtonModule, - MatLegacyDialogModule, + MatDialogModule, MatLegacyProgressSpinnerModule, MatLegacyFormFieldModule, MatLegacyTooltipModule, MatMenuModule, + MatInputModule, + MatRadioModule, Events2RoutingModule, MatCardModule, MatSnackBarModule, MatTableModule, MatIconModule, MatPaginatorModule, + ], + providers: [ + DatePipe, + EventsService ] }) export class Events2Module { } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/models/events.model.ts b/project/ws/app/src/lib/routes/home/routes/events-2/models/events.model.ts index d0e99ae95..f674cc861 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/models/events.model.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/models/events.model.ts @@ -27,4 +27,17 @@ export namespace events { btnText: string, action: string, } + + export const IMAGE_MAX_SIZE = (400 * 1024 * 1024) +} + +export interface speaker { + name: string, + email: string, + description: string +} + +export interface material { + fileName: string, + fileUrl: string } \ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.ts b/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.ts index ebe35ec53..fea3f76ff 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.ts @@ -1,8 +1,16 @@ import { HttpClient } from '@angular/common/http' import { Injectable } from '@angular/core' +import { map } from 'rxjs/operators' +import * as _ from 'lodash' +import { DatePipe } from '@angular/common' +import { Observable } from 'rxjs' const API_END_POINTS = { GET_EVENTS: '/apis/proxies/v8/sunbirdigot/search', + CREATE_CONTENT: 'apis/proxies/v8/action/content/v3/create', + UPLOAD_CONTENT: 'apis/proxies/v8/upload/action/content/v3/upload', + CREATE_EVENT: '/apis/proxies/v8/event/v4/create', + EVENT_READ: (eventId: string) => `apis/proxies/v8/event/v4/read/${eventId}` } @Injectable({ @@ -11,10 +19,43 @@ const API_END_POINTS = { export class EventsService { constructor( - private http: HttpClient + private http: HttpClient, + private datePipe: DatePipe ) { } getEvents(req: any) { - return this.http.post(`${API_END_POINTS.GET_EVENTS}`, req) + return this.http.post(`${API_END_POINTS.GET_EVENTS}`, req).pipe(map((res: any) => { + const formatedData = { + Event: _.get(res, 'result.Event', []), + count: _.get(res, 'result.count', 0) + } + formatedData.Event.forEach((event: any) => { + event['startDate'] = event['startDate'] ? this.datePipe.transform(event['startDate'], 'dd MMM, yyyy') : '' + event['createdOn'] = event['createdOn'] ? this.datePipe.transform(event['createdOn'], 'dd MMM, yyyy') : '' + }) + return formatedData + })) } + + createContent(req: any): Observable { + return this.http.post(`${API_END_POINTS.CREATE_CONTENT}`, req) + } + + uploadContent(val: any, formdata: any): Observable { + this.http.post(`${API_END_POINTS.UPLOAD_CONTENT}/${val}`, formdata, { + headers: { + 'content-type': 'application/json', + }, + }) + return this.http.post(`${API_END_POINTS.UPLOAD_CONTENT}/${val}`, formdata) + } + + createEvent(req: any): Observable { + return this.http.post(API_END_POINTS.CREATE_EVENT, req) + } + + getEventDetailsByid(eventId: string) { + return this.http.get(API_END_POINTS.EVENT_READ(eventId)) + } + } diff --git a/project/ws/app/src/lib/routes/home/routes/onboarding/custom-self-registration/custom-self-registration.component.ts b/project/ws/app/src/lib/routes/home/routes/onboarding/custom-self-registration/custom-self-registration.component.ts index f93aa43dd..08d3d6a62 100644 --- a/project/ws/app/src/lib/routes/home/routes/onboarding/custom-self-registration/custom-self-registration.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/onboarding/custom-self-registration/custom-self-registration.component.ts @@ -3,7 +3,7 @@ import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog' import { ActivatedRoute, Router } from '@angular/router' import { ICustomRegistrationQRCodeResponse, IOnBoardingConfig, IRegisteredLinksList } from '../interface/onboarding.interface' import { FormBuilder, FormGroup, Validators } from '@angular/forms' -import { MatSnackBar } from '@angular/material/snack-bar' +import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar' import { Clipboard } from '@angular/cdk/clipboard' import { LoadingPopupComponent } from '../loading-popup/loading-popup.component' import { OnboardingService } from '../../../services/onboarding.service' From b87cbc1b35e29452c2e0e2a3fe3f0a3cff7f1615 Mon Sep 17 00:00:00 2001 From: mansurskTarento Date: Fri, 31 Jan 2025 12:59:17 +0530 Subject: [PATCH 04/14] events list changes for all tabs --- .../draft-events/draft-events.component.ts | 9 ++++++--- .../past-events/past-events.component.ts | 11 ++++++----- .../pending-approval-events.component.ts | 10 +++++++++- .../rejected-events.component.ts | 8 ++++++-- .../upcoming-events.component.ts | 17 +++++++++++++---- 5 files changed, 40 insertions(+), 15 deletions(-) diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.ts index 770573a18..8b47ab883 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.ts @@ -42,9 +42,8 @@ export class DraftEventsComponent implements OnInit, OnDestroy { columns: [ { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, - { displayName: 'Created On', key: 'createdOn', cellType: 'date' }, { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, - { displayName: 'Submitted On', key: 'submitedOn', cellType: 'date' }, + { displayName: 'Created On', key: 'createdOn', cellType: 'date' }, ], showSearchBox: true, showPagination: true, @@ -60,10 +59,14 @@ export class DraftEventsComponent implements OnInit, OnDestroy { } this.menuItems = [ + { + btnText: 'View', + action: 'view', + }, { btnText: 'Edit', action: 'edit', - }, + } ] } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.ts index 400507208..9e9356260 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.ts @@ -42,9 +42,10 @@ export class PastEventsComponent implements OnInit, OnDestroy { columns: [ { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, - { displayName: 'Created On', key: 'createdOn', cellType: 'date' }, { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, - { displayName: 'Submitted On', key: 'submitedOn', cellType: 'date' }, + { displayName: 'Published On', key: 'publishedOn', cellType: 'date' }, + { displayName: 'Enrollments', key: 'enrollments', cellType: 'text' }, + { displayName: 'Certificates', key: 'certificates', cellType: 'text' }, ], showSearchBox: true, showPagination: true, @@ -61,9 +62,9 @@ export class PastEventsComponent implements OnInit, OnDestroy { this.menuItems = [ { - btnText: 'Edit', - action: 'edit', - }, + btnText: 'View', + action: 'view', + } ] } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.ts index 18ae7c8fc..dac982886 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.ts @@ -42,8 +42,8 @@ export class PendingApprovalEventsComponent implements OnInit, OnDestroy { columns: [ { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, + { displayName: 'Created By', key: 'createrEmail', cellType: 'text' }, { displayName: 'Created On', key: 'createdOn', cellType: 'date' }, - { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, { displayName: 'Submitted On', key: 'submitedOn', cellType: 'date' }, ], showSearchBox: true, @@ -60,10 +60,18 @@ export class PendingApprovalEventsComponent implements OnInit, OnDestroy { } this.menuItems = [ + { + btnText: 'View', + action: 'view', + }, { btnText: 'Edit', action: 'edit', }, + { + btnText: 'Cancel', + action: 'cancel', + }, ] } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.ts index 2484ebe24..4c50ab552 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.ts @@ -42,9 +42,9 @@ export class RejectedEventsComponent implements OnInit, OnDestroy { columns: [ { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, - { displayName: 'Created On', key: 'createdOn', cellType: 'date' }, { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, - { displayName: 'Submitted On', key: 'submitedOn', cellType: 'date' }, + { displayName: 'Created On', key: 'createdOn', cellType: 'date' }, + { displayName: 'Rejected On', key: 'rejectedOn', cellType: 'date' }, ], showSearchBox: true, showPagination: true, @@ -64,6 +64,10 @@ export class RejectedEventsComponent implements OnInit, OnDestroy { btnText: 'Edit', action: 'edit', }, + { + btnText: 'View Remarks', + action: 'remarks', + }, ] } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.ts index f3c1734ae..44164551f 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.ts @@ -42,9 +42,10 @@ export class UpcomingEventsComponent implements OnInit, OnDestroy { columns: [ { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, - { displayName: 'Created On', key: 'createdOn', cellType: 'date' }, { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, - { displayName: 'Submitted On', key: 'submitedOn', cellType: 'date' }, + { displayName: 'Published On', key: 'publishedOn', cellType: 'date' }, + { displayName: 'Enrollments', key: 'enrollments', cellType: 'text' }, + { displayName: 'Certificates', key: 'certificates', cellType: 'text' }, ], showSearchBox: true, showPagination: true, @@ -61,8 +62,16 @@ export class UpcomingEventsComponent implements OnInit, OnDestroy { this.menuItems = [ { - btnText: 'Edit', - action: 'edit', + btnText: 'View', + action: 'view', + }, + { + btnText: 'Start Broadcast', + action: 'broadcast', + }, + { + btnText: 'Cancel', + action: 'cancel', }, ] } From 344ddd868c2ca4f0b86a698e56dec17fb56f5a66 Mon Sep 17 00:00:00 2001 From: mansurskTarento Date: Wed, 5 Feb 2025 11:08:28 +0530 Subject: [PATCH 05/14] added basic details, add speakers ui --- .../create-event/create-event.component.html | 40 ++++++- .../create-event/create-event.component.scss | 77 +++++++++++++ .../create-event/create-event.component.ts | 42 ++++++- .../event-basic-details.component.html | 109 +++++++++++++++++- .../event-basic-details.component.scss | 36 ++++++ .../event-basic-details.component.ts | 32 ++++- .../event-materials.component.html | 16 ++- .../event-materials.component.scss | 44 +++++++ .../event-materials.component.ts | 7 +- .../speakers/speakers.component.html | 36 +++++- .../speakers/speakers.component.scss | 53 +++++++++ .../components/speakers/speakers.component.ts | 73 +++++++++++- .../add-speakers/add-speakers.component.html | 42 +++++++ .../add-speakers/add-speakers.component.scss | 71 ++++++++++++ .../add-speakers.component.spec.ts | 21 ++++ .../add-speakers/add-speakers.component.ts | 38 ++++++ .../basic-info/basic-info.component.scss | 3 - .../home/routes/events-2/events-2.module.ts | 14 ++- src/styles/styles.scss | 11 ++ 19 files changed, 748 insertions(+), 17 deletions(-) create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.html create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.scss create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.ts diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.html index e37ac1936..cb367ecca 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.html @@ -1 +1,39 @@ -

create-event works!

+
+
+
+ arrow_back + Event + chevron_right + Event Builder +
+
+ + +
+
+ + + + Basic Details + + + + + Add Speaker + + + + + Add Material + + + + + Add Competency + + + +
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.scss index e69de29bb..3024c853f 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.scss @@ -0,0 +1,77 @@ +.breadcrum { + height: 65px; + border-bottom: 1px solid #00000014; + + .back-arrow { + color: #000000DE !important; + font-size: 24px; + } + + .event-text { + /* stylelint-enable */ + font: 400 14px Lato; + /* stylelint-disable */ + } + + .chevron-arrow { + color: #1B4CA1; + } + + .event-builder-text { + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ + color: #1B4CA1; + } + + .save-and-exit { + width: 140px; + height: 32px; + border-radius: 17px; + border: 1px solid #1B4CA1; + color: #1B4CA1 !important; + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ + } + + .next-btn { + width: 65px; + height: 32px; + border-radius: 17px; + background-color: #1B4CA1 !important; + color: #FFFFFF !important; + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ + } +} + +:host ::ng-deep .events { + .mat-step-icon { + width: 25px; + height: 25px; + border-radius: 12.5px; + color: #FFFFFF; + // background-color: #96ADD4!important; + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ + } + + .mat-step-icon-selected { + background-color: #F3962F!important; + } + + // .mat-step-icon-active { + // background-color: #F3962F!important; /* Active color */ + // } + + // .mat-step-icon-completed { + // background-color: #1D8923!important; + // } + + .mat-step-icon:not(.mat-step-icon-selected):not(.mat-step-icon-completed) { + background-color: #96ADD4!important; + } +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts index 528d71855..296e37449 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts @@ -1,23 +1,43 @@ -import { Component, OnDestroy, OnInit } from '@angular/core' +import { AfterViewInit, Component, OnDestroy, OnInit, ViewChild } from '@angular/core' import { EventsService } from '../../services/events.service' import { ActivatedRoute } from '@angular/router' import * as _ from 'lodash' import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms' import { material, speaker } from '../../models/events.model' +import { StepperSelectionEvent } from '@angular/cdk/stepper' +import { MatStepper } from '@angular/material/stepper' @Component({ selector: 'ws-app-create-event', templateUrl: './create-event.component.html', styleUrls: ['./create-event.component.scss'] }) -export class CreateEventComponent implements OnInit, OnDestroy { +export class CreateEventComponent implements OnInit, AfterViewInit, OnDestroy { //#region (global varialbles) + @ViewChild(MatStepper) stepper: MatStepper | undefined eventId = '' eventIconUrl = '' eventDetails!: FormGroup - speakersList: speaker[] = [] + speakersList: speaker[] = [ + { + name: 'Puran', + email: 'puran123[at]yopmail[dot]com', + description: 'Praesent in mauris eu tortor porttitor accumsan. Mauris suscipit, ligula sit amet pharetra semper,' + }, + { + name: 'Puran', + email: 'puran123[at]yopmail[dot]com', + description: 'Praesent in mauris eu tortor porttitor accumsan. Mauris suscipit, ligula sit amet pharetra semper,' + }, + { + name: 'Puran', + email: 'puran123[at]yopmail[dot]com', + description: 'Praesent in mauris eu tortor porttitor accumsan. Mauris suscipit, ligula sit amet pharetra semper,' + }, + ] materialsList: material[] = [] competencies: any + currentStepperIndex = 0 //#endregion constructor( @@ -32,10 +52,16 @@ export class CreateEventComponent implements OnInit, OnDestroy { // this.getEventId() } + ngAfterViewInit() { + if (this.stepper) { + this.stepper._getIndicatorType = () => 'number' + } + } + initializeFormAndParams() { this.eventDetails = this.formBuilder.group({ eventName: new FormControl('', [Validators.required]), - description: new FormControl('', [Validators.required]), + description: new FormControl('', [Validators.required, Validators.maxLength(250)]), eventCategory: new FormControl('', [Validators.required]), streamType: new FormControl('', [Validators.required]), startDate: new FormControl('', [Validators.required]), @@ -64,6 +90,14 @@ export class CreateEventComponent implements OnInit, OnDestroy { patchEventDetails(res: any) { console.log('event details: ', res) } + //#endregion + + //#region (ui interactions) + onChange(event: StepperSelectionEvent) { + this.currentStepperIndex = event.selectedIndex + } + + saveAndExit() { } //#endregion diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html index 6bbf336ce..3fdbf29bd 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html @@ -1 +1,108 @@ -

event-basic-details works!

+
+
+ Basic Details +
+ +
+
+ Event Name +
+ + + + event name is mandatory + + +
+ +
+
+ Description +
+ + + + description is mandatory + + + {{eventDetails?.value?.description?.length}}/250 +
+ +
+
+
+ Event Category +
+ + + + + {{category}} + + + + + event category is mandatory + + +
+
+
+ Stream Type +
+ + + + + + + stream type is mandatory + + +
+
+ +
+
+
+ Date +
+ + + + + + date is mandatory + + +
+
+
+ Start Time +
+ + + + + start time is mandatory + + +
+
+
+ Start Time +
+ + + + start time is mandatory + + +
+
+ +
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.scss index e69de29bb..f4b733d0c 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.scss @@ -0,0 +1,36 @@ +.event-details { + border: 1px solid #1B4CA1; + border-radius: 12px; + + .event-header { + color: #1B4CA1; + /* stylelint-enable */ + font: 600 14px Montserrat; + /* stylelint-disable */ + } +} + +.form-lable { + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ +} + +.description-count { + margin-top: -30px; +} + +:host ::ng-deep .event-form { + .mat-form-field-appearance-outline .mat-form-field-infix { + padding: 5px 0px 10px; + } + + .mat-form-field-appearance-outline .mat-form-field-outline-end { + border-left-style: solid !important; + border-radius: 25px !important; + } + + .mat-form-field-appearance-outline .mat-form-field-outline-start { + display: none; + } +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts index d2ed60978..cb275a817 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts @@ -1,10 +1,38 @@ -import { Component } from '@angular/core'; +import { Component, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core' +import { FormGroup } from '@angular/forms' +import * as _ from 'lodash' @Component({ selector: 'ws-app-event-basic-details', templateUrl: './event-basic-details.component.html', styleUrls: ['./event-basic-details.component.scss'] }) -export class EventBasicDetailsComponent { +export class EventBasicDetailsComponent implements OnInit, OnChanges { + + //#region (global variables) + @Input() eventDetails!: FormGroup + + evntCategorysList = ['Webinar', 'Karmayogi Talks', 'Karmayogi Saptah'] + todayDate = new Date() + //#endregion + + constructor() { } + + ngOnInit(): void { + + } + + ngOnChanges(changes: SimpleChanges): void { + if (changes) { } + } + + showValidationMsg(controlName: string, validationType: string): Boolean { + let showMsg = false + const control = _.get(this.eventDetails, `controls.${controlName}`) + if (control && control.touched && control.invalid && control.hasError(validationType)) { + showMsg = true + } + return showMsg + } } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.html index 7bdb020d1..a687af3d2 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.html @@ -1 +1,15 @@ -

event-materials works!

+
+
+ Add Material +
+ +
+ upload icon +
+ Add File + Add pdfs, doc, ppt +
+ chevron_right +
+
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.scss index e69de29bb..3400753ae 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.scss @@ -0,0 +1,44 @@ +.event-details { + border: 1px solid #1B4CA1; + border-radius: 12px; + + .event-header { + color: #1B4CA1; + /* stylelint-enable */ + font: 600 14px Montserrat; + /* stylelint-disable */ + } +} + +.add-file-card { + height: 65px; + width: 260px; + border-radius: 8px; + border: 1px solid #00000014; + + .upload-icon-card { + height: 48px; + width: 48px; + background-color: #1B4CA114; + border-radius: 8px; + } + + .add-file-text { + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ + width: 148px; + } + + .add-file-type { + /* stylelint-enable */ + font: 400 10px Lato; + /* stylelint-disable */ + width: 148px; + } + + .right-arrow { + color: #1B4CA1 !important; + font-size: 24px; + } +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.ts index ae0bebcb3..3bd50dd5b 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.ts @@ -1,4 +1,5 @@ -import { Component } from '@angular/core'; +import { Component, Input } from '@angular/core' +import { material } from '../../models/events.model' @Component({ selector: 'ws-app-event-materials', @@ -7,4 +8,8 @@ import { Component } from '@angular/core'; }) export class EventMaterialsComponent { + @Input() materialsList: material[] = [] + + constructor() { } + } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.html index 9c2edcbcc..0fc505ccb 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.html @@ -1 +1,35 @@ -

speakers works!

+
+
+ Add Speakers +
+ + + + + + + + + + + + + + + + + + + + + + +
NameEmailBioAction
{{ speaker.name ? speaker.name : '-' }} {{ speaker.email ? speaker.email : '-' }} {{ speaker.description ? speaker.description : '-' }} + edit + delete +
+ +
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.scss index e69de29bb..6d359cfd0 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.scss @@ -0,0 +1,53 @@ +.event-details { + border: 1px solid #1B4CA1; + border-radius: 12px; + + .event-header { + color: #1B4CA1; + /* stylelint-enable */ + font: 600 14px Montserrat; + /* stylelint-disable */ + } + + .add-event { + color: #1B4CA1; + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ + height: 32px; + padding: 0px !important; + width: 120px; + } +} + +.speakers-table { + border-spacing: 0px; + .table-header { + background-color: #1B4CA1; + height: 35px; + color: #FEFEFE; + /* stylelint-enable */ + font: 400 12px Inter; + /* stylelint-disable */ + border-bottom: 10px solid #FFFFFF; + min-width: 225px; + } + + .table-header-border { + border-right: 1px solid #FFFFFF; + } + + .speaker-table-cell{ + height: 35px; + border: 1px solid #00000014; + margin-top: -1px; + font: 400 12px Inter; + padding-left: 10px; + } + + .edit-icon { + font-size: 16px; + color: #666666; + cursor: pointer; + } +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.ts index af462c84e..8d523a315 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.ts @@ -1,10 +1,79 @@ -import { Component } from '@angular/core'; +import { Component, Input, OnChanges, OnInit } from '@angular/core' +import { speaker } from '../../models/events.model' +import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog' +import { AddSpeakersComponent } from '../../dialogs/add-speakers/add-speakers.component' @Component({ selector: 'ws-app-speakers', templateUrl: './speakers.component.html', styleUrls: ['./speakers.component.scss'] }) -export class SpeakersComponent { +export class SpeakersComponent implements OnInit, OnChanges { + @Input() speakersList: speaker[] = [ + { + email: 'puran123[at]yopmail[dot]com', + name: 'Puran', + description: 'Praesent in mauris eu tortor porttitor accumsan. Mauris suscipit, ligula sit amet pharetra semper,' + }, + { + email: 'puran123[at]yopmail[dot]com', + name: 'Puran', + description: '' + }, + { + email: 'puran123[at]yopmail[dot]com', + name: '', + description: 'Praesent in mauris eu tortor porttitor accumsan. Mauris suscipit, ligula sit amet pharetra semper,' + }, + { + email: 'puran123[at]yopmail[dot]com', + name: 'Puran', + description: 'Praesent in mauris eu tortor porttitor accumsan. Mauris suscipit, ligula sit amet pharetra semper,' + }, + ] + constructor( + private dialog: MatDialog, + ) { } + + ngOnInit(): void { + } + + ngOnChanges(): void { + } + + openAddSpeakerPopu() { + const dialogRef = this.dialog.open(AddSpeakersComponent, { + panelClass: 'dialog_sidenav', + width: '600px' + }) + + dialogRef.afterClosed().subscribe((speakerDetails: speaker) => { + if (speakerDetails) { + this.speakersList.push(speakerDetails) + } + }) + } + + editSpeaker(index: number) { + if (this.speakersList && this.speakersList[index]) { + const dialogRef = this.dialog.open(AddSpeakersComponent, { + panelClass: 'dialog_sidenav', + data: this.speakersList[index], + width: '600px' + }) + + dialogRef.afterClosed().subscribe((speakerDetails: speaker) => { + if (speakerDetails) { + this.speakersList[index] = speakerDetails + } + }) + } + } + + delete(index: number) { + if (this.speakersList && this.speakersList[index]) { + this.speakersList.splice(index, 1) + } + } } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.html new file mode 100644 index 000000000..1fa6249a4 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.html @@ -0,0 +1,42 @@ +
+
+ Add Speaker + close +
+
+
+
+ Email +
+ + + + email is mandatory + + +
+
+
+ Name +
+ + + +
+
+
+ Description +
+ + + + {{speakerForm?.controls?.description.value?.length}}/250 +
+
+ +
+ + +
+
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.scss new file mode 100644 index 000000000..3aa45c0b3 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.scss @@ -0,0 +1,71 @@ +.add-speaker-header { + border-bottom: 1px solid #00000014; + height: 70px; + + .add-speaker-text { + /* stylelint-enable */ + font: 600 16px Montserrat; + /* stylelint-disable */ + } + + .close-icon { + color: #666666; + cursor: pointer; + } +} + +.add-speaker-content { + height: calc(100vh - 195px); + border-bottom: 1px solid #00000014; + overflow-y: auto; +} + +.form-lable { + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ +} + +.add-speaker-footer { + height: 50px; + + .cancelBtn { + border: 1px solid #1B4CA1; + border-radius: 17px; + height: 32px; + width: 75px; + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ + color: #1B4CA1 !important; + } + + .add-user-btn { + border-radius: 17px; + height: 32px; + background-color: #1B4CA1; + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ + color: #FFFFFF !important; + } +} + +.description-count { + margin-top: -30px; +} + +:host ::ng-deep .event-form { + .mat-form-field-appearance-outline .mat-form-field-infix { + padding: 5px 0px 10px; + } + + .mat-form-field-appearance-outline .mat-form-field-outline-end { + border-left-style: solid !important; + border-radius: 25px !important; + } + + .mat-form-field-appearance-outline .mat-form-field-outline-start { + display: none; + } +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.spec.ts new file mode 100644 index 000000000..729f042a4 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { AddSpeakersComponent } from './add-speakers.component'; + +describe('AddSpeakersComponent', () => { + let component: AddSpeakersComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [AddSpeakersComponent] + }); + fixture = TestBed.createComponent(AddSpeakersComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.ts new file mode 100644 index 000000000..8eca8056d --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.ts @@ -0,0 +1,38 @@ +import { Component, Inject, OnInit } from '@angular/core' +import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms' +import { MatLegacyDialogRef, MAT_LEGACY_DIALOG_DATA } from '@angular/material/legacy-dialog' +import * as _ from 'lodash' + +@Component({ + selector: 'ws-app-add-speakers', + templateUrl: './add-speakers.component.html', + styleUrls: ['./add-speakers.component.scss'] +}) +export class AddSpeakersComponent implements OnInit { + + speakerDetails: any + speakerForm: FormGroup | undefined + + constructor( + private dialogRef: MatLegacyDialogRef, + @Inject(MAT_LEGACY_DIALOG_DATA) data: any, + private formBuilder: FormBuilder + ) { + this.speakerDetails = data + } + + ngOnInit(): void { + this.speakerForm = this.formBuilder.group({ + email: new FormControl(_.get(this.speakerDetails, 'email', ''), [Validators.required]), + name: new FormControl(_.get(this.speakerDetails, 'name', '')), + description: new FormControl(_.get(this.speakerDetails, 'description', '')) + }) + } + + addSpeaker() { + if (this.speakerForm && this.speakerForm.valid) { + this.dialogRef.close(this.speakerForm.value) + } + } + +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.scss index 004a8444c..be4b8a295 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.scss @@ -167,9 +167,6 @@ $primary-color: #1B4CA1; max-height: 2.4em; text-overflow: ellipsis; } - - - } ::ng-deep .new-toolTip { diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts b/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts index 8aefc7e1b..fecc3d02f 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts @@ -17,6 +17,8 @@ import { MatLegacyTooltipModule } from '@angular/material/legacy-tooltip' import { MatLegacyMenuModule as MatMenuModule } from '@angular/material/legacy-menu' import { MatLegacyInputModule as MatInputModule } from '@angular/material/legacy-input' import { MatLegacyRadioModule as MatRadioModule } from '@angular/material/legacy-radio' +import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select' +import { MatLegacyFormFieldModule as MatFormFieldModule } from '@angular/material/legacy-form-field' // import { MatLegacySnackBarModule as MatSnackBarModule } from '@angular/material/legacy-snack-bar' import { MatSnackBarModule } from '@angular/material/snack-bar' import { EventsTableComponent } from './components/events-table/events-table.component' @@ -31,6 +33,10 @@ import { MatIconModule } from '@angular/material/icon' import { MatPaginatorModule } from '@angular/material/paginator' import { EventsService } from './services/events.service' import { BasicInfoComponent } from './dialogs/basic-info/basic-info.component' +import { MatStepperModule } from '@angular/material/stepper' +// import { NgxMaterialTimepickerModule } from 'ngx-material-timepicker' +import { MatDatepickerModule } from '@angular/material/datepicker'; +import { AddSpeakersComponent } from './dialogs/add-speakers/add-speakers.component' @NgModule({ @@ -47,7 +53,8 @@ import { BasicInfoComponent } from './dialogs/basic-info/basic-info.component' PendingApprovalEventsComponent, PastEventsComponent, RejectedEventsComponent, - BasicInfoComponent + BasicInfoComponent, + AddSpeakersComponent ], imports: [ CommonModule, @@ -61,12 +68,17 @@ import { BasicInfoComponent } from './dialogs/basic-info/basic-info.component' MatMenuModule, MatInputModule, MatRadioModule, + MatSelectModule, Events2RoutingModule, MatCardModule, MatSnackBarModule, MatTableModule, MatIconModule, MatPaginatorModule, + MatStepperModule, + // NgxMaterialTimepickerModule, + MatFormFieldModule, + MatDatepickerModule, ], providers: [ DatePipe, diff --git a/src/styles/styles.scss b/src/styles/styles.scss index c3fb6e6e8..d87409dad 100644 --- a/src/styles/styles.scss +++ b/src/styles/styles.scss @@ -851,4 +851,15 @@ h3.shepherd-title { border-radius: 8px !important; box-shadow: 0px 8px 24px 0px #0000003d !important; padding: 0 24px !important; +} + +.dialog_sidenav { + height: 100vh; + position: fixed !important; + right: 0px; + + .mat-dialog-container { + border-radius: 0px !important; + padding: 0px !important; + } } \ No newline at end of file From ae8d4f5bdb6a2a337e1fdadbc360f7f81f4b3785 Mon Sep 17 00:00:00 2001 From: mansurskTarento Date: Thu, 6 Feb 2025 10:59:59 +0530 Subject: [PATCH 06/14] adding add material ui --- .../create-event/create-event.component.ts | 11 +- .../event-materials.component.html | 17 +- .../event-materials.component.scss | 11 ++ .../event-materials.component.ts | 149 +++++++++++++++++- .../material-details.component.html | 42 +++++ .../material-details.component.scss | 96 +++++++++++ .../material-details.component.spec.ts | 21 +++ .../material-details.component.ts | 67 ++++++++ .../events-2/events-2-routing.module.ts | 5 +- .../home/routes/events-2/events-2.module.ts | 11 +- .../routes/events-2/models/events.model.ts | 2 +- 11 files changed, 418 insertions(+), 14 deletions(-) create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.html create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.scss create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.ts diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts index 296e37449..65cfade91 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts @@ -35,7 +35,16 @@ export class CreateEventComponent implements OnInit, AfterViewInit, OnDestroy { description: 'Praesent in mauris eu tortor porttitor accumsan. Mauris suscipit, ligula sit amet pharetra semper,' }, ] - materialsList: material[] = [] + materialsList: material[] = [ + { + fullName: 'event name 1', + fileUrl: 'its url' + }, + { + fullName: 'event name 2', + fileUrl: 'its url' + } + ] competencies: any currentStepperIndex = 0 //#endregion diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.html index a687af3d2..f45d943a4 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.html @@ -3,13 +3,24 @@ Add Material
-
- upload icon +
+ +
+ upload icon +
Add File Add pdfs, doc, ppt
chevron_right
+ + + +
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.scss index 3400753ae..76a3982b6 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.scss @@ -10,17 +10,28 @@ } } +.disableAddFile { + opacity: 0.6; + pointer-events: none; +} + .add-file-card { height: 65px; width: 260px; border-radius: 8px; border: 1px solid #00000014; + cursor: pointer; .upload-icon-card { height: 48px; width: 48px; background-color: #1B4CA114; border-radius: 8px; + + .uploadIcon { + width: 24px; + height: 24px; + } } .add-file-text { diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.ts index 3bd50dd5b..d3b874f21 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.ts @@ -1,15 +1,158 @@ -import { Component, Input } from '@angular/core' +import { Component, Input, OnInit } from '@angular/core' import { material } from '../../models/events.model' +import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar' +import { EventsService } from '../../services/events.service' +import { map, mergeMap } from 'rxjs/operators' +import * as _ from 'lodash' +import { ActivatedRoute } from '@angular/router' +import { environment } from '../../../../../../../../../../../src/environments/environment' +import { HttpErrorResponse } from '@angular/common/http' + @Component({ selector: 'ws-app-event-materials', templateUrl: './event-materials.component.html', styleUrls: ['./event-materials.component.scss'] }) -export class EventMaterialsComponent { +export class EventMaterialsComponent implements OnInit { @Input() materialsList: material[] = [] - constructor() { } + userProfile: any + filePath: any + fileURL: any + currentIndex = -1 + currentMaterialSaved = true + + constructor( + private matSnackBar: MatSnackBar, + private eventSvc: EventsService, + private activeRoute: ActivatedRoute + ) { } + + ngOnInit(): void { + if (_.get(this.activeRoute, 'snapshot.data.configService.userProfile')) { + this.userProfile = _.get(this.activeRoute, 'snapshot.data.configService.userProfile') + } + } + + onFileSelected(files: any) { + if (files.length === 0) { + return + } + const mimeType = files[0].type + if (mimeType.match(/application\/(pdf|vnd.ms-powerpoint|msword)/) == null) { + this.openSnackBar('Invalid file type. Please upload a PDF, PPT, or DOC file.') + return + } + const reader = new FileReader() + this.filePath = files[0] + // if (this.filePath && this.filePath.size > events.IMAGE_MAX_SIZE) { + // this.openSnackBar('Selected image size is more') + // this.filePath = '' + // return + // } + reader.readAsDataURL(files[0]) + reader.onload = _event => { + this.fileURL = reader.result + this.saveFile() + } + } + + saveFile() { + if (this.filePath) { + const org = [] + const createdforarray: any[] = [] + createdforarray.push(_.get(this.userProfile, 'rootOrgId', '')) + org.push(_.get(this.userProfile, 'departmentName', '')) + + const request = { + request: { + content: { + name: 'image asset', + creator: _.get(this.userProfile, 'userName', ''), + createdBy: _.get(this.userProfile, 'userId', ''), + code: 'image asset', + mimeType: this.filePath.type, + mediaType: 'image', + contentType: 'Asset', + primaryCategory: 'Asset', + organisation: org, + createdFor: createdforarray, + }, + }, + } + this.eventSvc.createContent(request).pipe(mergeMap((res: any) => { + const contentID = _.get(res, 'result.identifier') + const formData: FormData = new FormData() + formData.append('data', this.filePath) + if (contentID) { + return this.eventSvc.uploadContent(contentID, formData).pipe(map((fdata: any) => { + return _.get(fdata, 'result.artifactUrl', '') + })) + } else { + throw new Error('Something went wrong please try again') + } + })).subscribe({ + next: res => { + if (res) { + const createdUrl = res + const urlToReplace = 'https://storage.googleapis.com/igot' + let fileUrl = createdUrl + if (createdUrl.startsWith(urlToReplace)) { + const urlSplice = createdUrl.slice(urlToReplace.length).split('/') + fileUrl = `${environment.karmYogiPath}/assets/public/${urlSplice.slice(1).join('/')}` + } + this.addNewFileToList(fileUrl) + } + }, + error: (error: HttpErrorResponse) => { + const errorMessage = _.get(error, 'error.message', 'Something went wrong please try again') + this.openSnackBar(errorMessage) + } + }) + } + } + + addNewFileToList(fileUrl: string) { + const fileDetails: material = { + fullName: '', + fileUrl: fileUrl + } + this.materialsList.unshift(fileDetails) + this.currentIndex = 0 + this.currentMaterialSaved = false + } + + updateMaterial(materialDetails: material, index: number) { + this.materialsList[index] = materialDetails + this.currentMaterialSaved = true + } + + closeOrOpenMaterial(openStatus: boolean, index: number) { + if (openStatus) { + if (this.currentMaterialSaved) { + this.currentIndex = index + } else { + this.openSnackBar('please save the details before') + } + } else if (openStatus === false) { + this.currentIndex = -1 + } + } + + currentMaterialSaveUpdate(event: boolean) { + this.currentMaterialSaved = event + } + + deleteMaterialFromList(event: boolean, index: number) { + if (event) { + this.materialsList.splice(index, 1) + } + } + + private openSnackBar(message: string) { + this.matSnackBar.open(message) + } } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.html new file mode 100644 index 000000000..de699b205 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.html @@ -0,0 +1,42 @@ +
+
+
{{materialDetails?.fullName}}
+
+ edit + delete +
+
+
+ +
+
+
+ Full Name +
+ + + + Name is mandatory + + +
+ +
+
+ Uploaded File +
+
+
+ pdf +
pdf.pdf
+
+
+
+ +
+ + +
+ +
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.scss new file mode 100644 index 000000000..61e1057ed --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.scss @@ -0,0 +1,96 @@ +.hideElement { + display: none !important; + // visibility: hidden; +} + +.closedCard { + height: 20px; + background-color: #0000000A; + padding: 10px; + border: 1px solid #00000029; + border-radius: 8px; + + .pdfName { + color: #000000; + /* stylelint-enable */ + font: 600 14px Montserrat; + /* stylelint-disable */ + } + + .edit-icon { + color: #00000099; + font-size: 15px; + cursor: pointer; + } +} + +.openCard { + border: 1px solid #00000029; + border-radius: 8px; + background-color: #1B4CA10A; + + .form-lable { + color: #212529; + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ + } + + .file-card { + background-color: #1B4CA114; + border-radius: 4px; + + .pdfName { + color: #1B4CA1; + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ + } + } + +} + +.cancel-btn { + height: 32px; + padding: 7px 0px; + border-radius: 17px; + border: 1px solid #1B4CA1 !important; + color: #1B4CA1 !important; + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ +} + +.save-btn { + height: 32px; + padding: 7px 0px; + border-radius: 17px; + background-color: #1B4CA1 !important; + color: #FFFFFF !important; + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ +} + +:host ::ng-deep .event-form { + .mat-form-field-wrapper { + padding-bottom: 0px !important; + } + + .mat-form-field-appearance-outline .mat-form-field-infix { + padding: 5px 0px 10px; + } + + .mat-form-field-appearance-outline .mat-form-field-outline { + border-radius: 25px; + } + + .mat-form-field-appearance-outline .mat-form-field-outline-end { + border-left-style: solid !important; + border-radius: 25px !important; + } + + .mat-form-field-appearance-outline .mat-form-field-outline-start { + display: none; + } +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.spec.ts new file mode 100644 index 000000000..21023d875 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { MaterialDetailsComponent } from './material-details.component'; + +describe('MaterialDetailsComponent', () => { + let component: MaterialDetailsComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [MaterialDetailsComponent] + }); + fixture = TestBed.createComponent(MaterialDetailsComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.ts new file mode 100644 index 000000000..0e2d257ab --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.ts @@ -0,0 +1,67 @@ +import { Component, EventEmitter, Input, OnChanges, Output, SimpleChanges } from '@angular/core' +import { material } from '../../models/events.model' +import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms' +import * as _ from 'lodash' + +@Component({ + selector: 'ws-app-material-details', + templateUrl: './material-details.component.html', + styleUrls: ['./material-details.component.scss'] +}) +export class MaterialDetailsComponent implements OnChanges { + @Input() materialDetails: material | undefined + @Input() openMaterial: boolean = false + @Output() updatedMaterialDetails = new EventEmitter() + @Output() canCloseOrOpenMaterial = new EventEmitter() + @Output() currentMaterialSaveUpdate = new EventEmitter() + @Output() deleteMaterial = new EventEmitter() + + currentMaterialSaved = true + + eventForm!: FormGroup + fileUrl = '' + + constructor( + private formBuilder: FormBuilder + ) { } + + ngOnChanges(changes: SimpleChanges): void { + if (changes.materialDetails) { + this.buildForm() + } + } + + buildForm() { + if (this.materialDetails) { + if (this.eventForm) { + this.eventForm.setValue(this.materialDetails) + } else { + this.eventForm = this.formBuilder.group({ + fullName: new FormControl(_.get(this.materialDetails, 'fullName', ''), [Validators.required]), + fileUrl: new FormControl(_.get(this.materialDetails, 'fileUrl', '')), + }) + + this.eventForm.controls.fullName.valueChanges.subscribe((value: string) => { + if (value && _.get(this.materialDetails, 'fullName') !== value && this.currentMaterialSaved) { + this.currentMaterialSaved = false + this.currentMaterialSaveUpdate.emit(this.currentMaterialSaved) + } + }) + } + } + } + + openStatus(status: boolean) { + this.canCloseOrOpenMaterial.emit(status) + } + + deleteMaterialFromList() { + this.deleteMaterial.emit(true) + } + + saveDetails() { + if (this.eventForm.valid) { + this.updatedMaterialDetails.emit(this.eventForm.value) + } + } +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts b/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts index 5543cc9f3..b9e921710 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts @@ -73,7 +73,10 @@ const routes: Routes = [ }, { path: 'edit-event/:eventId', pathMatch: 'full', - component: CreateEventComponent + component: CreateEventComponent, + resolve: { + configService: ConfigResolveService, + }, } ] diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts b/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts index fecc3d02f..3f20341f1 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts @@ -19,8 +19,7 @@ import { MatLegacyInputModule as MatInputModule } from '@angular/material/legacy import { MatLegacyRadioModule as MatRadioModule } from '@angular/material/legacy-radio' import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select' import { MatLegacyFormFieldModule as MatFormFieldModule } from '@angular/material/legacy-form-field' -// import { MatLegacySnackBarModule as MatSnackBarModule } from '@angular/material/legacy-snack-bar' -import { MatSnackBarModule } from '@angular/material/snack-bar' +import { MatLegacySnackBarModule as MatSnackBarModule } from '@angular/material/legacy-snack-bar' import { EventsTableComponent } from './components/events-table/events-table.component' import { UpcomingEventsComponent } from './components/upcoming-events/upcoming-events.component' import { DraftEventsComponent } from './components/draft-events/draft-events.component' @@ -35,8 +34,9 @@ import { EventsService } from './services/events.service' import { BasicInfoComponent } from './dialogs/basic-info/basic-info.component' import { MatStepperModule } from '@angular/material/stepper' // import { NgxMaterialTimepickerModule } from 'ngx-material-timepicker' -import { MatDatepickerModule } from '@angular/material/datepicker'; -import { AddSpeakersComponent } from './dialogs/add-speakers/add-speakers.component' +import { MatDatepickerModule } from '@angular/material/datepicker' +import { AddSpeakersComponent } from './dialogs/add-speakers/add-speakers.component'; +import { MaterialDetailsComponent } from './components/material-details/material-details.component' @NgModule({ @@ -54,7 +54,8 @@ import { AddSpeakersComponent } from './dialogs/add-speakers/add-speakers.compon PastEventsComponent, RejectedEventsComponent, BasicInfoComponent, - AddSpeakersComponent + AddSpeakersComponent, + MaterialDetailsComponent ], imports: [ CommonModule, diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/models/events.model.ts b/project/ws/app/src/lib/routes/home/routes/events-2/models/events.model.ts index f674cc861..be59ee978 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/models/events.model.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/models/events.model.ts @@ -38,6 +38,6 @@ export interface speaker { } export interface material { - fileName: string, + fullName: string, fileUrl: string } \ No newline at end of file From 2daa5dbe6570b2146fcbf806b32f9971057a0aff Mon Sep 17 00:00:00 2001 From: mansurskTarento Date: Thu, 6 Feb 2025 14:28:09 +0530 Subject: [PATCH 07/14] adding all tabs into single component --- .../draft-events.component.spec.ts | 21 -- .../draft-events/draft-events.component.ts | 140 -------- .../events-list.component.html} | 0 .../events-list.component.scss} | 0 .../events-list/events-list.component.spec.ts | 21 ++ .../events-list/events-list.component.ts | 310 ++++++++++++++++++ .../events-table/events-table.component.html | 13 +- .../events-table/events-table.component.scss | 6 +- .../components/events/events.component.scss | 2 +- .../past-events/past-events.component.html | 5 - .../past-events/past-events.component.scss | 0 .../past-events/past-events.component.spec.ts | 21 -- .../past-events/past-events.component.ts | 138 -------- .../pending-approval-events.component.html | 5 - .../pending-approval-events.component.scss | 0 .../pending-approval-events.component.spec.ts | 21 -- .../pending-approval-events.component.ts | 145 -------- .../rejected-events.component.html | 5 - .../rejected-events.component.scss | 0 .../rejected-events.component.spec.ts | 21 -- .../rejected-events.component.ts | 141 -------- .../upcoming-events.component.html | 5 - .../upcoming-events.component.scss | 0 .../upcoming-events.component.spec.ts | 21 -- .../upcoming-events.component.ts | 146 --------- .../events-2/events-2-routing.module.ts | 24 +- .../home/routes/events-2/events-2.module.ts | 16 +- 27 files changed, 367 insertions(+), 860 deletions(-) delete mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.spec.ts delete mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.ts rename project/ws/app/src/lib/routes/home/routes/events-2/components/{draft-events/draft-events.component.html => events-list/events-list.component.html} (100%) rename project/ws/app/src/lib/routes/home/routes/events-2/components/{draft-events/draft-events.component.scss => events-list/events-list.component.scss} (100%) create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.ts delete mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.html delete mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.scss delete mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.spec.ts delete mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.ts delete mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.html delete mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.scss delete mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.spec.ts delete mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.ts delete mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.html delete mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.scss delete mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.spec.ts delete mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.ts delete mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.html delete mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.scss delete mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.spec.ts delete mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.ts diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.spec.ts deleted file mode 100644 index 852fc79fe..000000000 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.spec.ts +++ /dev/null @@ -1,21 +0,0 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; - -import { DraftEventsComponent } from './draft-events.component'; - -describe('DraftEventsComponent', () => { - let component: DraftEventsComponent; - let fixture: ComponentFixture; - - beforeEach(() => { - TestBed.configureTestingModule({ - declarations: [DraftEventsComponent] - }); - fixture = TestBed.createComponent(DraftEventsComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.ts deleted file mode 100644 index 8b47ab883..000000000 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.ts +++ /dev/null @@ -1,140 +0,0 @@ -//#region (imports) -import { Component, OnDestroy, OnInit } from '@angular/core' -import { events } from '../../models/events.model' -import { EventsService } from '../../services/events.service' -import { Subscription } from 'rxjs' -import * as _ from 'lodash' -import { HttpErrorResponse } from '@angular/common/http' -import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar' -//#endregion - -@Component({ - selector: 'ws-app-draft-events', - templateUrl: './draft-events.component.html', - styleUrls: ['./draft-events.component.scss'] -}) -export class DraftEventsComponent implements OnInit, OnDestroy { - //#region (global variables) - tableData!: events.tableData - paginationDetails!: events.pagination - menuItems!: events.menuItems[] - eventsList: any[] = [] - getEventSubscription!: Subscription - showEventsLoader = false - searchKey = '' - //#endregion - - //#region (constructor) - constructor( - private eventSvc: EventsService, - private matSnackBar: MatSnackBar - ) { } - //#endregion - - //#region (onInint) - ngOnInit(): void { - this.initialization() - this.getEvents() - } - - initialization() { - this.tableData = { - columns: [ - { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, - { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, - { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, - { displayName: 'Created On', key: 'createdOn', cellType: 'date' }, - ], - showSearchBox: true, - showPagination: true, - noDataMessage: 'There are no draft events.' - } - - this.paginationDetails = { - startIndex: 0, - lastIndex: 20, - pageSize: 20, - pageIndex: 0, - totalCount: 20, - } - - this.menuItems = [ - { - btnText: 'View', - action: 'view', - }, - { - btnText: 'Edit', - action: 'edit', - } - ] - } - - getEvents() { - const requestObj = { - locale: [ - 'en', - ], - request: { - query: this.searchKey, - limit: _.get(this.paginationDetails, 'pageSize', 20), - offset: _.get(this.paginationDetails, 'pageIndex', 0), - filters: { - status: ['Live'], - contentType: 'Event', - }, - sort_by: { - startDate: 'desc', - }, - }, - } - - if (this.getEventSubscription) { - this.getEventSubscription.unsubscribe() - } - this.showEventsLoader = true - this.getEventSubscription = this.eventSvc.getEvents(requestObj).subscribe( - { - next: (res: any) => { - this.showEventsLoader = false - this.eventsList = _.get(res, 'Event', []) - this.paginationDetails['totalCount'] = _.get(res, 'count', 0) - }, - error: (error: HttpErrorResponse) => { - this.showEventsLoader = false - const errorMessage = _.get(error, 'error.message', 'Some thing went wrong') - this.openSnackBar(errorMessage) - } - } - ) - } - //#endregion - - //#region (ui interactions like click) - searchEvents(searchKey: string) { - this.searchKey = searchKey - this.getEvents() - } - - onPageChange(paginationDetails: events.pagination) { - this.paginationDetails = paginationDetails - this.getEvents() - } - - contentEvents(events: any) { - console.log(events) - } - - //#endregion - - private openSnackBar(message: string) { - this.matSnackBar.open(message) - } - - ngOnDestroy(): void { - if (this.getEventSubscription) { - this.getEventSubscription.unsubscribe() - } - } - -} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.html similarity index 100% rename from project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.html rename to project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.html diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.scss similarity index 100% rename from project/ws/app/src/lib/routes/home/routes/events-2/components/draft-events/draft-events.component.scss rename to project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.scss diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.spec.ts new file mode 100644 index 000000000..7ce60a1b9 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { EventsListComponent } from './events-list.component'; + +describe('EventsListComponent', () => { + let component: EventsListComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [EventsListComponent] + }); + fixture = TestBed.createComponent(EventsListComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.ts new file mode 100644 index 000000000..0b687a094 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.ts @@ -0,0 +1,310 @@ +import { HttpErrorResponse } from '@angular/common/http' +import { Component, OnDestroy, OnInit } from '@angular/core' +import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar' +import { ActivatedRoute } from '@angular/router' +import _ from 'lodash' +import { Subscription } from 'rxjs' +import { events } from '../../models/events.model' +import { EventsService } from '../../services/events.service' + +@Component({ + selector: 'ws-app-events-list', + templateUrl: './events-list.component.html', + styleUrls: ['./events-list.component.scss'] +}) +export class EventsListComponent implements OnInit, OnDestroy { + //#region (global variables) + tableData!: events.tableData + paginationDetails!: events.pagination + menuItems!: events.menuItems[] + eventsList: any[] = [] + getEventSubscription!: Subscription + showEventsLoader = false + searchKey = '' + pathUrl = '' + //#endregion + + //#region (constructor) + constructor( + private eventSvc: EventsService, + private matSnackBar: MatSnackBar, + private activatedRoute: ActivatedRoute + ) { } + //#endregion + + //#region (onInint) + ngOnInit(): void { + this.initialization() + } + + initialization() { + this.pathUrl = _.get(this.activatedRoute, 'snapshot.url[0].path', 'pending-approval') + switch (this.pathUrl) { + case 'upcoming': + this.tableData = { + columns: [ + { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, + { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, + { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, + { displayName: 'Published On', key: 'publishedOn', cellType: 'date' }, + { displayName: 'Enrollments', key: 'enrollments', cellType: 'number' }, + { displayName: 'Certificates', key: 'certificates', cellType: 'number' }, + ], + showSearchBox: true, + showPagination: true, + noDataMessage: 'There are no upcoming events.' + } + + this.menuItems = [ + { + btnText: 'View', + action: 'view', + }, + { + btnText: 'Start Broadcast', + action: 'broadcast', + }, + { + btnText: 'Cancel', + action: 'cancel', + }, + ] + break + case 'draft': + this.tableData = { + columns: [ + { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, + { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, + { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, + { displayName: 'Created On', key: 'createdOn', cellType: 'date' }, + ], + showSearchBox: true, + showPagination: true, + noDataMessage: 'There are no draft events.' + } + + this.menuItems = [ + { + btnText: 'View', + action: 'view', + }, + { + btnText: 'Edit', + action: 'edit', + } + ] + break + case 'pending-approval': + this.tableData = { + columns: [ + { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, + { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, + { displayName: 'Created By', key: 'createrEmail', cellType: 'text' }, + { displayName: 'Created On', key: 'createdOn', cellType: 'date' }, + { displayName: 'Submitted On', key: 'submitedOn', cellType: 'date' }, + ], + showSearchBox: true, + showPagination: true, + noDataMessage: 'There are no pending events.' + } + + this.menuItems = [ + { + btnText: 'View', + action: 'view', + }, + { + btnText: 'Edit', + action: 'edit', + }, + { + btnText: 'Cancel', + action: 'cancel', + }, + ] + + break + case 'past': + this.tableData = { + columns: [ + { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, + { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, + { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, + { displayName: 'Published On', key: 'publishedOn', cellType: 'date' }, + { displayName: 'Enrollments', key: 'enrollments', cellType: 'text' }, + { displayName: 'Certificates', key: 'certificates', cellType: 'text' }, + ], + showSearchBox: true, + showPagination: true, + noDataMessage: 'There are no past events.' + } + + this.menuItems = [ + { + btnText: 'View', + action: 'view', + } + ] + break + case 'canceled': + this.tableData = { + columns: [ + { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, + { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, + { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, + { displayName: 'Created On', key: 'createdOn', cellType: 'date' }, + { displayName: 'Cancelled On', key: 'rejectedOn', cellType: 'date' }, + { displayName: 'Cancelled By', key: 'createdByName', cellType: 'text' }, + ], + showSearchBox: true, + showPagination: true, + noDataMessage: 'There are no rejected events.' + } + + this.menuItems = [ + { + btnText: 'Edit', + action: 'edit', + }, + { + btnText: 'View Remarks', + action: 'remarks', + }, + ] + break + case 'rejected': + this.tableData = { + columns: [ + { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, + { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, + { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, + { displayName: 'Created On', key: 'createdOn', cellType: 'date' }, + { displayName: 'Rejected On', key: 'rejectedOn', cellType: 'date' }, + ], + showSearchBox: true, + showPagination: true, + noDataMessage: 'There are no rejected events.' + } + + this.menuItems = [ + { + btnText: 'Edit', + action: 'edit', + }, + { + btnText: 'View Remarks', + action: 'remarks', + }, + ] + break + } + + this.paginationDetails = { + startIndex: 0, + lastIndex: 20, + pageSize: 20, + pageIndex: 0, + totalCount: 20, + } + this.getEvents() + } + + getEvents() { + const requestObj: any = { + locale: [ + 'en', + ], + request: { + query: this.searchKey, + limit: _.get(this.paginationDetails, 'pageSize', 20), + offset: _.get(this.paginationDetails, 'pageIndex', 0), + filters: { + status: ['Live'], + contentType: 'Event', + }, + sort_by: { + lastUpdatedOn: 'desc', + }, + }, + } + + const today = new Date() + const year = today.getFullYear() + const month = (today.getMonth() + 1).toString().padStart(2, '0') // Months are 0-indexed + const day = today.getDate().toString().padStart(2, '0') + + switch (this.pathUrl) { + case 'upcoming': + requestObj.request.filters.status = ['Live'] + requestObj.request.filters['endDate'] = { + '>=': `${year}-${month}-${day}` + } + break + case 'draft': + requestObj.request.filters.status = ['Draft'] + break + case 'pending-approval': + requestObj.request.filters.status = ['SentToPublish'] + break + case 'past': + requestObj.request.filters.status = ['Live'] + requestObj.request.filters['endDate'] = { + '<': `${year}-${month}-${day}` + } + break + case 'canceled': + requestObj.request.filters.status = ['Cancelled'] + break + case 'rejected': + requestObj.request.filters.status = ['Rejected'] + break + } + + if (this.getEventSubscription) { + this.getEventSubscription.unsubscribe() + } + this.showEventsLoader = true + this.getEventSubscription = this.eventSvc.getEvents(requestObj).subscribe( + { + next: (res: any) => { + this.showEventsLoader = false + this.eventsList = _.get(res, 'Event', []) + this.paginationDetails['totalCount'] = _.get(res, 'count', 0) + }, + error: (error: HttpErrorResponse) => { + this.showEventsLoader = false + const errorMessage = _.get(error, 'error.message', 'Some thing went wrong') + this.openSnackBar(errorMessage) + } + } + ) + } + //#endregion + + //#region (ui interactions like click) + searchEvents(searchKey: string) { + this.searchKey = searchKey + this.getEvents() + } + + onPageChange(paginationDetails: events.pagination) { + this.paginationDetails = paginationDetails + this.getEvents() + } + + contentEvents(events: any) { + console.log(events) + } + + //#endregion + + private openSnackBar(message: string) { + this.matSnackBar.open(message) + } + + ngOnDestroy(): void { + if (this.getEventSubscription) { + this.getEventSubscription.unsubscribe() + } + } +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.html index 2d5a068e0..3eb46002c 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.html @@ -21,7 +21,7 @@ {{col.displayName}} - + logo @@ -42,6 +42,17 @@ + + + {{col.displayName}} + + + + {{element[col.key]}} + + + + {{col.displayName}} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.scss index 88723dbe7..3ec25343e 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.scss @@ -41,7 +41,7 @@ } .imageCell { - width: 130px; + width: 120px; border-radius: 3px; } @@ -182,6 +182,10 @@ flex: 0 0 125px; } +.table-number-cell { + flex: 0 0 110px; +} + .table-menu-header { flex: 0 0 200px; } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.scss index 87221a42b..8bebf452b 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.scss @@ -35,6 +35,6 @@ .filter-option:first-child { margin-left: 0; - margin-bottom: 5px + height: 25px; } } \ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.html deleted file mode 100644 index 544175913..000000000 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.html +++ /dev/null @@ -1,5 +0,0 @@ -
- -
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.scss deleted file mode 100644 index e69de29bb..000000000 diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.spec.ts deleted file mode 100644 index ec04e0b01..000000000 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.spec.ts +++ /dev/null @@ -1,21 +0,0 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; - -import { PastEventsComponent } from './past-events.component'; - -describe('PastEventsComponent', () => { - let component: PastEventsComponent; - let fixture: ComponentFixture; - - beforeEach(() => { - TestBed.configureTestingModule({ - declarations: [PastEventsComponent] - }); - fixture = TestBed.createComponent(PastEventsComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.ts deleted file mode 100644 index 9e9356260..000000000 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/past-events/past-events.component.ts +++ /dev/null @@ -1,138 +0,0 @@ -//#region (imports) -import { Component, OnDestroy, OnInit } from '@angular/core' -import { events } from '../../models/events.model' -import { EventsService } from '../../services/events.service' -import { Subscription } from 'rxjs' -import * as _ from 'lodash' -import { HttpErrorResponse } from '@angular/common/http' -import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar' -//#endregion - -@Component({ - selector: 'ws-app-past-events', - templateUrl: './past-events.component.html', - styleUrls: ['./past-events.component.scss'] -}) -export class PastEventsComponent implements OnInit, OnDestroy { - //#region (global variables) - tableData!: events.tableData - paginationDetails!: events.pagination - menuItems!: events.menuItems[] - eventsList: any[] = [] - getEventSubscription!: Subscription - showEventsLoader = false - searchKey = '' - //#endregion - - //#region (constructor) - constructor( - private eventSvc: EventsService, - private matSnackBar: MatSnackBar - ) { } - //#endregion - - //#region (onInint) - ngOnInit(): void { - this.initialization() - this.getEvents() - } - - initialization() { - this.tableData = { - columns: [ - { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, - { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, - { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, - { displayName: 'Published On', key: 'publishedOn', cellType: 'date' }, - { displayName: 'Enrollments', key: 'enrollments', cellType: 'text' }, - { displayName: 'Certificates', key: 'certificates', cellType: 'text' }, - ], - showSearchBox: true, - showPagination: true, - noDataMessage: 'There are no past events.' - } - - this.paginationDetails = { - startIndex: 0, - lastIndex: 20, - pageSize: 20, - pageIndex: 0, - totalCount: 20, - } - - this.menuItems = [ - { - btnText: 'View', - action: 'view', - } - ] - } - - getEvents() { - const requestObj = { - locale: [ - 'en', - ], - request: { - query: this.searchKey, - limit: _.get(this.paginationDetails, 'pageSize', 20), - offset: _.get(this.paginationDetails, 'pageIndex', 0), - filters: { - status: ['Live'], - contentType: 'Event', - }, - sort_by: { - startDate: 'desc', - }, - }, - } - - if (this.getEventSubscription) { - this.getEventSubscription.unsubscribe() - } - this.showEventsLoader = true - this.getEventSubscription = this.eventSvc.getEvents(requestObj).subscribe( - { - next: (res: any) => { - this.showEventsLoader = false - this.eventsList = _.get(res, 'Event', []) - this.paginationDetails['totalCount'] = _.get(res, 'count', 0) - }, - error: (error: HttpErrorResponse) => { - this.showEventsLoader = false - const errorMessage = _.get(error, 'error.message', 'Some thing went wrong') - this.openSnackBar(errorMessage) - } - } - ) - } - //#endregion - - //#region (ui interactions like click) - searchEvents(searchKey: string) { - this.searchKey = searchKey - this.getEvents() - } - - onPageChange(paginationDetails: events.pagination) { - this.paginationDetails = paginationDetails - this.getEvents() - } - - contentEvents(events: any) { - console.log(events) - } - - //#endregion - - private openSnackBar(message: string) { - this.matSnackBar.open(message) - } - - ngOnDestroy(): void { - if (this.getEventSubscription) { - this.getEventSubscription.unsubscribe() - } - } - -} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.html deleted file mode 100644 index 544175913..000000000 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.html +++ /dev/null @@ -1,5 +0,0 @@ -
- -
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.scss deleted file mode 100644 index e69de29bb..000000000 diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.spec.ts deleted file mode 100644 index d05e97f69..000000000 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.spec.ts +++ /dev/null @@ -1,21 +0,0 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; - -import { PendingApprovalEventsComponent } from './pending-approval-events.component'; - -describe('PendingApprovalEventsComponent', () => { - let component: PendingApprovalEventsComponent; - let fixture: ComponentFixture; - - beforeEach(() => { - TestBed.configureTestingModule({ - declarations: [PendingApprovalEventsComponent] - }); - fixture = TestBed.createComponent(PendingApprovalEventsComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.ts deleted file mode 100644 index dac982886..000000000 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/pending-approval-events/pending-approval-events.component.ts +++ /dev/null @@ -1,145 +0,0 @@ -//#region (imports) -import { Component, OnDestroy, OnInit } from '@angular/core' -import { events } from '../../models/events.model' -import { EventsService } from '../../services/events.service' -import { Subscription } from 'rxjs' -import * as _ from 'lodash' -import { HttpErrorResponse } from '@angular/common/http' -import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar' -//#endregion - -@Component({ - selector: 'ws-app-pending-approval-events', - templateUrl: './pending-approval-events.component.html', - styleUrls: ['./pending-approval-events.component.scss'] -}) -export class PendingApprovalEventsComponent implements OnInit, OnDestroy { - //#region (global variables) - tableData!: events.tableData - paginationDetails!: events.pagination - menuItems!: events.menuItems[] - eventsList: any[] = [] - getEventSubscription!: Subscription - showEventsLoader = false - searchKey = '' - //#endregion - - //#region (constructor) - constructor( - private eventSvc: EventsService, - private matSnackBar: MatSnackBar - ) { } - //#endregion - - //#region (onInint) - ngOnInit(): void { - this.initialization() - this.getEvents() - } - - initialization() { - this.tableData = { - columns: [ - { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, - { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, - { displayName: 'Created By', key: 'createrEmail', cellType: 'text' }, - { displayName: 'Created On', key: 'createdOn', cellType: 'date' }, - { displayName: 'Submitted On', key: 'submitedOn', cellType: 'date' }, - ], - showSearchBox: true, - showPagination: true, - noDataMessage: 'There are no pending events.' - } - - this.paginationDetails = { - startIndex: 0, - lastIndex: 20, - pageSize: 20, - pageIndex: 0, - totalCount: 20, - } - - this.menuItems = [ - { - btnText: 'View', - action: 'view', - }, - { - btnText: 'Edit', - action: 'edit', - }, - { - btnText: 'Cancel', - action: 'cancel', - }, - ] - } - - getEvents() { - const requestObj = { - locale: [ - 'en', - ], - request: { - query: this.searchKey, - limit: _.get(this.paginationDetails, 'pageSize', 20), - offset: _.get(this.paginationDetails, 'pageIndex', 0), - filters: { - status: ['Live'], - contentType: 'Event', - }, - sort_by: { - startDate: 'desc', - }, - }, - } - - if (this.getEventSubscription) { - this.getEventSubscription.unsubscribe() - } - this.showEventsLoader = true - this.getEventSubscription = this.eventSvc.getEvents(requestObj).subscribe( - { - next: (res: any) => { - this.showEventsLoader = false - this.eventsList = _.get(res, 'Event', []) - this.paginationDetails['totalCount'] = _.get(res, 'count', 0) - }, - error: (error: HttpErrorResponse) => { - this.showEventsLoader = false - const errorMessage = _.get(error, 'error.message', 'Some thing went wrong') - this.openSnackBar(errorMessage) - } - } - ) - } - //#endregion - - //#region (ui interactions like click) - searchEvents(searchKey: string) { - this.searchKey = searchKey - this.getEvents() - } - - onPageChange(paginationDetails: events.pagination) { - this.paginationDetails = paginationDetails - this.getEvents() - } - - contentEvents(events: any) { - console.log(events) - } - - //#endregion - - private openSnackBar(message: string) { - this.matSnackBar.open(message) - } - - ngOnDestroy(): void { - if (this.getEventSubscription) { - this.getEventSubscription.unsubscribe() - } - } - -} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.html deleted file mode 100644 index 544175913..000000000 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.html +++ /dev/null @@ -1,5 +0,0 @@ -
- -
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.scss deleted file mode 100644 index e69de29bb..000000000 diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.spec.ts deleted file mode 100644 index dd7350edd..000000000 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.spec.ts +++ /dev/null @@ -1,21 +0,0 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; - -import { RejectedEventsComponent } from './rejected-events.component'; - -describe('RejectedEventsComponent', () => { - let component: RejectedEventsComponent; - let fixture: ComponentFixture; - - beforeEach(() => { - TestBed.configureTestingModule({ - declarations: [RejectedEventsComponent] - }); - fixture = TestBed.createComponent(RejectedEventsComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.ts deleted file mode 100644 index 4c50ab552..000000000 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/rejected-events/rejected-events.component.ts +++ /dev/null @@ -1,141 +0,0 @@ -//#region (imports) -import { Component, OnDestroy, OnInit } from '@angular/core' -import { events } from '../../models/events.model' -import { EventsService } from '../../services/events.service' -import { Subscription } from 'rxjs' -import * as _ from 'lodash' -import { HttpErrorResponse } from '@angular/common/http' -import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar' -//#endregion - -@Component({ - selector: 'ws-app-rejected-events', - templateUrl: './rejected-events.component.html', - styleUrls: ['./rejected-events.component.scss'] -}) -export class RejectedEventsComponent implements OnInit, OnDestroy { - //#region (global variables) - tableData!: events.tableData - paginationDetails!: events.pagination - menuItems!: events.menuItems[] - eventsList: any[] = [] - getEventSubscription!: Subscription - showEventsLoader = false - searchKey = '' - //#endregion - - //#region (constructor) - constructor( - private eventSvc: EventsService, - private matSnackBar: MatSnackBar - ) { } - //#endregion - - //#region (onInint) - ngOnInit(): void { - this.initialization() - this.getEvents() - } - - initialization() { - this.tableData = { - columns: [ - { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, - { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, - { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, - { displayName: 'Created On', key: 'createdOn', cellType: 'date' }, - { displayName: 'Rejected On', key: 'rejectedOn', cellType: 'date' }, - ], - showSearchBox: true, - showPagination: true, - noDataMessage: 'There are no rejected events.' - } - - this.paginationDetails = { - startIndex: 0, - lastIndex: 20, - pageSize: 20, - pageIndex: 0, - totalCount: 20, - } - - this.menuItems = [ - { - btnText: 'Edit', - action: 'edit', - }, - { - btnText: 'View Remarks', - action: 'remarks', - }, - ] - } - - getEvents() { - const requestObj = { - locale: [ - 'en', - ], - request: { - query: this.searchKey, - limit: _.get(this.paginationDetails, 'pageSize', 20), - offset: _.get(this.paginationDetails, 'pageIndex', 0), - filters: { - status: ['Live'], - contentType: 'Event', - }, - sort_by: { - startDate: 'desc', - }, - }, - } - - if (this.getEventSubscription) { - this.getEventSubscription.unsubscribe() - } - this.showEventsLoader = true - this.getEventSubscription = this.eventSvc.getEvents(requestObj).subscribe( - { - next: (res: any) => { - this.showEventsLoader = false - this.eventsList = _.get(res, 'Event', []) - this.paginationDetails['totalCount'] = _.get(res, 'count', 0) - }, - error: (error: HttpErrorResponse) => { - this.showEventsLoader = false - const errorMessage = _.get(error, 'error.message', 'Some thing went wrong') - this.openSnackBar(errorMessage) - } - } - ) - } - //#endregion - - //#region (ui interactions like click) - searchEvents(searchKey: string) { - this.searchKey = searchKey - this.getEvents() - } - - onPageChange(paginationDetails: events.pagination) { - this.paginationDetails = paginationDetails - this.getEvents() - } - - contentEvents(events: any) { - console.log(events) - } - - //#endregion - - private openSnackBar(message: string) { - this.matSnackBar.open(message) - } - - ngOnDestroy(): void { - if (this.getEventSubscription) { - this.getEventSubscription.unsubscribe() - } - } - -} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.html deleted file mode 100644 index 544175913..000000000 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.html +++ /dev/null @@ -1,5 +0,0 @@ -
- -
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.scss deleted file mode 100644 index e69de29bb..000000000 diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.spec.ts deleted file mode 100644 index 4b51ddead..000000000 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.spec.ts +++ /dev/null @@ -1,21 +0,0 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; - -import { UpcomingEventsComponent } from './upcoming-events.component'; - -describe('UpcomingEventsComponent', () => { - let component: UpcomingEventsComponent; - let fixture: ComponentFixture; - - beforeEach(() => { - TestBed.configureTestingModule({ - declarations: [UpcomingEventsComponent] - }); - fixture = TestBed.createComponent(UpcomingEventsComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.ts deleted file mode 100644 index 44164551f..000000000 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/upcoming-events/upcoming-events.component.ts +++ /dev/null @@ -1,146 +0,0 @@ -//#region (imports) -import { Component, OnDestroy, OnInit } from '@angular/core' -import { events } from '../../models/events.model' -import { EventsService } from '../../services/events.service' -import { Subscription } from 'rxjs' -import * as _ from 'lodash' -import { HttpErrorResponse } from '@angular/common/http' -import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar' -//#endregion - -@Component({ - selector: 'ws-app-upcoming-events', - templateUrl: './upcoming-events.component.html', - styleUrls: ['./upcoming-events.component.scss'] -}) -export class UpcomingEventsComponent implements OnInit, OnDestroy { - //#region (global variables) - tableData!: events.tableData - paginationDetails!: events.pagination - menuItems!: events.menuItems[] - eventsList: any[] = [] - getEventSubscription!: Subscription - showEventsLoader = false - searchKey = '' - //#endregion - - //#region (constructor) - constructor( - private eventSvc: EventsService, - private matSnackBar: MatSnackBar - ) { } - //#endregion - - //#region (onInint) - ngOnInit(): void { - this.initialization() - this.getEvents() - } - - initialization() { - this.tableData = { - columns: [ - { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, - { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, - { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, - { displayName: 'Published On', key: 'publishedOn', cellType: 'date' }, - { displayName: 'Enrollments', key: 'enrollments', cellType: 'text' }, - { displayName: 'Certificates', key: 'certificates', cellType: 'text' }, - ], - showSearchBox: true, - showPagination: true, - noDataMessage: 'There are no upcoming events.' - } - - this.paginationDetails = { - startIndex: 0, - lastIndex: 20, - pageSize: 20, - pageIndex: 0, - totalCount: 20, - } - - this.menuItems = [ - { - btnText: 'View', - action: 'view', - }, - { - btnText: 'Start Broadcast', - action: 'broadcast', - }, - { - btnText: 'Cancel', - action: 'cancel', - }, - ] - } - - getEvents() { - const requestObj = { - locale: [ - 'en', - ], - request: { - query: this.searchKey, - limit: _.get(this.paginationDetails, 'pageSize', 20), - offset: _.get(this.paginationDetails, 'pageIndex', 0), - filters: { - status: ['Live'], - contentType: 'Event', - }, - sort_by: { - startDate: 'desc', - }, - }, - } - - if (this.getEventSubscription) { - this.getEventSubscription.unsubscribe() - } - this.showEventsLoader = true - this.getEventSubscription = this.eventSvc.getEvents(requestObj).subscribe( - { - next: (res: any) => { - this.showEventsLoader = false - this.eventsList = _.get(res, 'Event', []) - this.paginationDetails['totalCount'] = _.get(res, 'count', 0) - }, - error: (error: HttpErrorResponse) => { - this.showEventsLoader = false - const errorMessage = _.get(error, 'error.message', 'Some thing went wrong') - this.openSnackBar(errorMessage) - } - } - ) - } - //#endregion - - //#region (ui interactions like click) - searchEvents(searchKey: string) { - this.searchKey = searchKey - this.getEvents() - } - - onPageChange(paginationDetails: events.pagination) { - this.paginationDetails = paginationDetails - this.getEvents() - } - - contentEvents(events: any) { - console.log(events) - } - - //#endregion - - private openSnackBar(message: string) { - this.matSnackBar.open(message) - } - - ngOnDestroy(): void { - if (this.getEventSubscription) { - this.getEventSubscription.unsubscribe() - } - } - -} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts b/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts index b9e921710..f443020e2 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts @@ -2,12 +2,8 @@ import { NgModule } from '@angular/core' import { RouterModule, Routes } from '@angular/router' import { EventsComponent } from './components/events/events.component' import { CreateEventComponent } from './components/create-event/create-event.component' -import { UpcomingEventsComponent } from './components/upcoming-events/upcoming-events.component' -import { DraftEventsComponent } from './components/draft-events/draft-events.component' -import { PendingApprovalEventsComponent } from './components/pending-approval-events/pending-approval-events.component' -import { PastEventsComponent } from './components/past-events/past-events.component' -import { RejectedEventsComponent } from './components/rejected-events/rejected-events.component' import { ConfigResolveService } from '../../resolvers/config-resolve.service' +import { EventsListComponent } from './components/events-list/events-list.component' const routes: Routes = [ { @@ -31,7 +27,7 @@ const routes: Routes = [ }, { path: 'upcoming', - component: UpcomingEventsComponent, + component: EventsListComponent, data: { pageId: 'app/home/events/upcoming', module: 'events-2', @@ -39,7 +35,7 @@ const routes: Routes = [ }, { path: 'draft', - component: DraftEventsComponent, + component: EventsListComponent, data: { pageId: 'app/home/events/draft', module: 'events-2', @@ -47,7 +43,7 @@ const routes: Routes = [ }, { path: 'pending-approval', - component: PendingApprovalEventsComponent, + component: EventsListComponent, data: { pageId: 'app/home/events/pending-approval', module: 'events-2', @@ -55,15 +51,23 @@ const routes: Routes = [ }, { path: 'past', - component: PastEventsComponent, + component: EventsListComponent, data: { pageId: 'app/home/events/past', module: 'events-2', }, }, + { + path: 'canceled', + component: EventsListComponent, + data: { + pageId: 'app/home/events/canceled', + module: 'events-2', + }, + }, { path: 'rejected', - component: RejectedEventsComponent, + component: EventsListComponent, data: { pageId: 'app/home/events/rejected', module: 'events-2', diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts b/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts index 3f20341f1..80573100c 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts @@ -21,11 +21,6 @@ import { MatLegacySelectModule as MatSelectModule } from '@angular/material/lega import { MatLegacyFormFieldModule as MatFormFieldModule } from '@angular/material/legacy-form-field' import { MatLegacySnackBarModule as MatSnackBarModule } from '@angular/material/legacy-snack-bar' import { EventsTableComponent } from './components/events-table/events-table.component' -import { UpcomingEventsComponent } from './components/upcoming-events/upcoming-events.component' -import { DraftEventsComponent } from './components/draft-events/draft-events.component' -import { PendingApprovalEventsComponent } from './components/pending-approval-events/pending-approval-events.component' -import { PastEventsComponent } from './components/past-events/past-events.component' -import { RejectedEventsComponent } from './components/rejected-events/rejected-events.component' import { MatLegacyCardModule as MatCardModule } from '@angular/material/legacy-card' import { MatTableModule } from '@angular/material/table' import { MatIconModule } from '@angular/material/icon' @@ -35,8 +30,9 @@ import { BasicInfoComponent } from './dialogs/basic-info/basic-info.component' import { MatStepperModule } from '@angular/material/stepper' // import { NgxMaterialTimepickerModule } from 'ngx-material-timepicker' import { MatDatepickerModule } from '@angular/material/datepicker' -import { AddSpeakersComponent } from './dialogs/add-speakers/add-speakers.component'; +import { AddSpeakersComponent } from './dialogs/add-speakers/add-speakers.component' import { MaterialDetailsComponent } from './components/material-details/material-details.component' +import { EventsListComponent } from './components/events-list/events-list.component' @NgModule({ @@ -48,14 +44,10 @@ import { MaterialDetailsComponent } from './components/material-details/material EventMaterialsComponent, EventCompetenciesComponent, EventsTableComponent, - UpcomingEventsComponent, - DraftEventsComponent, - PendingApprovalEventsComponent, - PastEventsComponent, - RejectedEventsComponent, BasicInfoComponent, AddSpeakersComponent, - MaterialDetailsComponent + MaterialDetailsComponent, + EventsListComponent ], imports: [ CommonModule, From 1bb912718511eca8e043b95990b47b97ff17b26f Mon Sep 17 00:00:00 2001 From: mansurskTarento Date: Thu, 6 Feb 2025 14:33:42 +0530 Subject: [PATCH 08/14] fixing pagination issue in events table --- .../src/lib/routes/home/routes/events-2/events-2.module.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts b/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts index 80573100c..5aa965eaf 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts @@ -24,7 +24,6 @@ import { EventsTableComponent } from './components/events-table/events-table.com import { MatLegacyCardModule as MatCardModule } from '@angular/material/legacy-card' import { MatTableModule } from '@angular/material/table' import { MatIconModule } from '@angular/material/icon' -import { MatPaginatorModule } from '@angular/material/paginator' import { EventsService } from './services/events.service' import { BasicInfoComponent } from './dialogs/basic-info/basic-info.component' import { MatStepperModule } from '@angular/material/stepper' @@ -33,6 +32,7 @@ import { MatDatepickerModule } from '@angular/material/datepicker' import { AddSpeakersComponent } from './dialogs/add-speakers/add-speakers.component' import { MaterialDetailsComponent } from './components/material-details/material-details.component' import { EventsListComponent } from './components/events-list/events-list.component' +import { MatLegacyPaginatorModule } from '@angular/material/legacy-paginator' @NgModule({ @@ -67,7 +67,7 @@ import { EventsListComponent } from './components/events-list/events-list.compon MatSnackBarModule, MatTableModule, MatIconModule, - MatPaginatorModule, + MatLegacyPaginatorModule, MatStepperModule, // NgxMaterialTimepickerModule, MatFormFieldModule, From 1fb494fee0e3b5ccfcedc2da2294e622935c8d7a Mon Sep 17 00:00:00 2001 From: mansurskTarento Date: Mon, 10 Feb 2025 19:25:02 +0530 Subject: [PATCH 09/14] adding competency ui --- .../create-event/create-event.component.html | 22 +- .../create-event/create-event.component.scss | 1 + .../create-event/create-event.component.ts | 186 ++++++---- .../event-basic-details.component.html | 26 +- .../event-basic-details.component.scss | 25 +- .../event-basic-details.component.ts | 1 + .../event-competencies.component.html | 76 ++++- .../event-competencies.component.scss | 158 +++++++++ .../event-competencies.component.ts | 323 +++++++++++++++++- .../event-materials.component.html | 4 +- .../event-materials.component.ts | 1 + .../events-list/events-list.component.ts | 80 ++++- .../components/events/events.component.html | 3 + .../components/events/events.component.ts | 20 +- .../material-details.component.html | 13 +- .../material-details.component.scss | 9 +- .../material-details.component.ts | 5 + .../speakers/speakers.component.html | 14 +- .../components/speakers/speakers.component.ts | 24 +- .../add-competency.component.html | 62 ++++ .../add-competency.component.scss | 76 +++++ .../add-competency.component.spec.ts | 25 ++ .../add-competency.component.ts | 171 ++++++++++ .../basic-info/basic-info.component.html | 4 +- .../basic-info/basic-info.component.ts | 4 +- .../events-2/events-2-routing.module.ts | 2 + .../home/routes/events-2/events-2.module.ts | 13 +- .../events-2/services/event-resolver.spec.ts | 15 + .../events-2/services/event-resolver.ts | 26 ++ .../events-2/services/events.service.ts | 79 ++++- 30 files changed, 1324 insertions(+), 144 deletions(-) create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.html create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.scss create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/services/event-resolver.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/services/event-resolver.ts diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.html index cb367ecca..2ee3e521e 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.html @@ -1,39 +1,41 @@
- arrow_back + arrow_back Event chevron_right Event Builder
- + + + + (click)="moveToNextForm()">Next
- + Basic Details - + Add Speaker - + Add Material - + Add Competency - +
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.scss index 3024c853f..7771cba12 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.scss @@ -5,6 +5,7 @@ .back-arrow { color: #000000DE !important; font-size: 24px; + cursor: pointer; } .event-text { diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts index 65cfade91..fa5ae8545 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts @@ -1,116 +1,184 @@ -import { AfterViewInit, Component, OnDestroy, OnInit, ViewChild } from '@angular/core' +import { AfterViewInit, Component, OnInit, ViewChild } from '@angular/core' import { EventsService } from '../../services/events.service' -import { ActivatedRoute } from '@angular/router' +import { ActivatedRoute, Router } from '@angular/router' import * as _ from 'lodash' import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms' import { material, speaker } from '../../models/events.model' import { StepperSelectionEvent } from '@angular/cdk/stepper' import { MatStepper } from '@angular/material/stepper' +import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar' +import { HttpErrorResponse } from '@angular/common/http' @Component({ selector: 'ws-app-create-event', templateUrl: './create-event.component.html', styleUrls: ['./create-event.component.scss'] }) -export class CreateEventComponent implements OnInit, AfterViewInit, OnDestroy { +export class CreateEventComponent implements OnInit, AfterViewInit { //#region (global varialbles) @ViewChild(MatStepper) stepper: MatStepper | undefined eventId = '' eventIconUrl = '' - eventDetails!: FormGroup - speakersList: speaker[] = [ - { - name: 'Puran', - email: 'puran123[at]yopmail[dot]com', - description: 'Praesent in mauris eu tortor porttitor accumsan. Mauris suscipit, ligula sit amet pharetra semper,' - }, - { - name: 'Puran', - email: 'puran123[at]yopmail[dot]com', - description: 'Praesent in mauris eu tortor porttitor accumsan. Mauris suscipit, ligula sit amet pharetra semper,' - }, - { - name: 'Puran', - email: 'puran123[at]yopmail[dot]com', - description: 'Praesent in mauris eu tortor porttitor accumsan. Mauris suscipit, ligula sit amet pharetra semper,' - }, - ] - materialsList: material[] = [ - { - fullName: 'event name 1', - fileUrl: 'its url' - }, - { - fullName: 'event name 2', - fileUrl: 'its url' - } - ] + eventDetails: any + eventDetailsForm!: FormGroup + speakersList: speaker[] = [] + materialsList: material[] = [] competencies: any - currentStepperIndex = 0 + currentStepperIndex = 3 + openMode = 'edit' + pathUrl = '' //#endregion constructor( private eventSvc: EventsService, private activatedRoute: ActivatedRoute, - private formBuilder: FormBuilder + private formBuilder: FormBuilder, + private router: Router, + private matSnackBar: MatSnackBar, ) { } //#region (onInit) ngOnInit(): void { this.initializeFormAndParams() - // this.getEventId() + this.getEventDetailsFromResolver() } - ngAfterViewInit() { - if (this.stepper) { - this.stepper._getIndicatorType = () => 'number' - } - } initializeFormAndParams() { - this.eventDetails = this.formBuilder.group({ + this.eventDetailsForm = this.formBuilder.group({ eventName: new FormControl('', [Validators.required]), description: new FormControl('', [Validators.required, Validators.maxLength(250)]), eventCategory: new FormControl('', [Validators.required]), - streamType: new FormControl('', [Validators.required]), + streamType: new FormControl(''), startDate: new FormControl('', [Validators.required]), startTime: new FormControl('', [Validators.required]), - endTime: new FormControl('', [Validators.required]) + endTime: new FormControl('', [Validators.required]), + resourceUrl: new FormControl('') }) } - getEventId() { - this.eventId = _.get(this.activatedRoute, 'snapshot.paramMap.params.eventId') - if (this.eventId) { - this.getEventDetails() + getEventDetailsFromResolver() { + if (_.get(this.activatedRoute, 'snapshot.data.eventDetails')) { + this.eventDetails = _.get(this.activatedRoute, 'snapshot.data.eventDetails.data') + this.patchEventDetails() } - } - - getEventDetails() { - this.eventSvc.getEventDetailsByid(this.eventId).subscribe({ - next: res => { - if (res) { - this.patchEventDetails(res) - } + this.activatedRoute.queryParams.subscribe((params: any) => { + this.openMode = params['mode'] + this.pathUrl = params['pathUrl'] + if (this.openMode === 'view') { + this.eventDetailsForm.disable() } }) } - patchEventDetails(res: any) { - console.log('event details: ', res) + patchEventDetails() { + this.eventId = _.get(this.eventDetails, 'identifier') + const eventBaseDetails = { + eventName: _.get(this.eventDetails, 'name', ''), + description: _.get(this.eventDetails, 'description', ''), + eventCategory: _.get(this.eventDetails, 'resourceType', ''), + streamType: _.get(this.eventDetails, 'streamType', ''),//new key to add + startDate: new Date(_.get(this.eventDetails, 'startDate', '')), + startTime: _.get(this.eventDetails, 'startTime', ''), + endTime: _.get(this.eventDetails, 'endTime', ''), + resourceUrl: _.get(this.eventDetails, 'resourceUrl', '') + } + this.eventDetailsForm.setValue(eventBaseDetails) + this.eventDetailsForm.updateValueAndValidity() + + this.speakersList = _.get(this.eventDetails, 'speakers', []) + this.materialsList = _.get(this.eventDetails, 'eventHandouts', []) + } + + ngAfterViewInit() { + if (this.stepper) { + this.stepper._getIndicatorType = () => 'number' + } } //#endregion //#region (ui interactions) - onChange(event: StepperSelectionEvent) { + onSelectionChange(event: StepperSelectionEvent) { this.currentStepperIndex = event.selectedIndex } - saveAndExit() { } + navigateBack() { + this.router.navigate([`/app/home/events/${this.pathUrl}`]) + } + + moveToNextForm() { + if (this.canMoveToNext || this.openMode === 'view') { + this.currentStepperIndex = this.currentStepperIndex + 1 + } + } + + get canMoveToNext() { + let currentFormIsValid = false + if (this.currentStepperIndex === 0) { + if (this.eventDetailsForm.valid) { + currentFormIsValid = true + } + } else if (this.currentStepperIndex === 1) { + if (this.speakersList && this.speakersList.length) { + currentFormIsValid = true + } + } else if (this.currentStepperIndex === 2) { + if (this.materialsList && this.materialsList.length) { + currentFormIsValid = true + } + } + return currentFormIsValid + } + + saveAndExit(navigateBack = true) { + const formBody = { + request: { + event: this.getFormBodyOfEvent() + } + } + this.eventSvc.updateEvent(formBody, this.eventId).subscribe({ + next: res => { + if (res) { + this.openSnackBar('Event details saved successfully') + if (navigateBack) { + this.navigateBack() + } + } + }, + error: (error: HttpErrorResponse) => { + const errorMessage = _.get(error, 'error.message', 'Something went wrong while creating event, please try again') + this.openSnackBar(errorMessage) + } + }) + } + + getFormBodyOfEvent() { + const eventDetails: any = JSON.parse(JSON.stringify(this.eventDetails)) + + const eventBaseDetails = this.eventDetailsForm.value + eventDetails['name'] = eventBaseDetails.eventName + eventDetails['description'] = eventBaseDetails.description + eventDetails['resourceType'] = eventBaseDetails.eventCategory + eventDetails['streamType'] = eventBaseDetails.streamType + eventDetails['startDate'] = eventBaseDetails.startDate + eventDetails['startTime'] = eventBaseDetails.startTime + eventDetails['endTime'] = eventBaseDetails.endTime + eventDetails['resourceUrl'] = eventBaseDetails.resourceUrl + + if (this.speakersList) { + eventDetails['speakers'] = this.speakersList + } + if (this.materialsList) { + eventDetails['eventHandouts'] = this.materialsList + } + + return eventDetails + } //#endregion - ngOnDestroy(): void { + private openSnackBar(message: string) { + this.matSnackBar.open(message) } } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html index 3fdbf29bd..debfa4960 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html @@ -1,9 +1,10 @@ -
+
Basic Details
-
+
Event Name
@@ -28,8 +29,17 @@ {{eventDetails?.value?.description?.length}}/250
+
+
+ upload from URL +
+ + + +
+
-
+
Event Category
@@ -46,7 +56,7 @@
-
+
-
+
Date
@@ -77,7 +87,7 @@
-
+
Start Time
@@ -92,7 +102,7 @@
-
+
Start Time
diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.scss index f4b733d0c..d3c06debe 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.scss @@ -12,14 +12,35 @@ .form-lable { /* stylelint-enable */ - font: 700 14px Lato; - /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-disable */ +} + +.form-url-lable { + color: #1B4CA1; + /* stylelint-enable */ + font: 600 14px Montserrat; + /* stylelint-disable */ } .description-count { margin-top: -30px; } + +:host ::ng-deep .disableForm { + .mat-form-field-outline { + background-color: #ededed; + } + + .disable-round { + .mat-form-field-outline { + border-radius: 20px; + } + } +} + + :host ::ng-deep .event-form { .mat-form-field-appearance-outline .mat-form-field-infix { padding: 5px 0px 10px; diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts index cb275a817..62613f542 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts @@ -11,6 +11,7 @@ export class EventBasicDetailsComponent implements OnInit, OnChanges { //#region (global variables) @Input() eventDetails!: FormGroup + @Input() openMode = 'edit' evntCategorysList = ['Webinar', 'Karmayogi Talks', 'Karmayogi Saptah'] todayDate = new Date() diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.html index 03683b504..ecb7109e0 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.html @@ -1 +1,75 @@ -

event-competencies works!

+
+
+
Add Competency
+
Add Competency
+
+
+
+
+
+
+
+ arrow_drop_up + arrow_drop_down +
{{competency.competencyAreaName}}
+
+
+
+ delete +
+
+ +
+
+
+
+
+ arrow_drop_up + arrow_drop_down +
{{i + 1}}. {{theme.competencyThemeName}}
+
+
+
+
+ delete +
+
+ +
+
+
+
+
+
{{i+1}}.{{j+1}}. {{subTheme.competencySubThemeAdditionalProperties.displayName}}
+
+
+
+
+ delete +
+
+
+ +
+ +
+
+
+
+
+ +
No competency has been added yet
+
+ +
+
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.scss index e69de29bb..a6993c18d 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.scss @@ -0,0 +1,158 @@ +.competency-details { + + .title { + font-family: Montserrat; + font-size: 14px; + font-weight: 600; + line-height: 17.07px; + text-align: left; + text-underline-position: from-font; + text-decoration-skip-ink: none; + } + + .pill { + padding: 5px 16px; + border: 1px solid rgba(0, 0, 0, 0.4); + border-radius: 50px; + cursor: pointer; + font-family: Lato; + font-size: 14px; + font-weight: 700; + line-height: 16.8px; + text-align: center; + text-underline-position: from-font; + text-decoration-skip-ink: none; + color: rgba(0, 0, 0, 0.4); + } + + .pill-active { + border: 1px solid rgba(27, 76, 161, 1); + background: rgba(27, 76, 161, 0.16); + color: rgba(27, 76, 161, 1); + } + + .theme-behavioural { + background: rgba(248, 184, 97, 0.24); + } + + .sub-theme-behavioural { + background: rgba(248, 184, 97, 0.12); + } + + .theme-functional { + background: rgba(226, 69, 119, 0.24); + } + + .sub-theme-functional { + background: rgba(226, 69, 119, 0.12); + } + + .theme-domain { + background: rgba(130, 25, 211, 0.21); + } + + .sub-theme-domain { + background: rgba(130, 25, 211, 0.12); + } + + .bottom-border { + border-bottom: 1px solid #c3c3c3; + } + + .theme { + padding: 6px 12px; + font-family: Montserrat; + font-size: 16px; + line-height: 19.5px; + text-align: left; + text-underline-position: from-font; + text-decoration-skip-ink: none; + } + + .no-events { + font-family: Lato; + font-size: 14px; + font-weight: 700; + line-height: 16.8px; + text-align: center; + text-underline-position: from-font; + text-decoration-skip-ink: none; + } + + .area { + padding: 6px 10px; + font-family: Montserrat; + font-size: 16px; + font-weight: 600; + line-height: 19.5px; + text-align: left; + text-underline-position: from-font; + text-decoration-skip-ink: none; + border-radius: 4px; + } + + .behavioural { + background: rgba(248, 184, 97, 0.4); + border-left: 4px solid rgba(243, 150, 47, 1); + } + + .functional { + background: rgba(226, 69, 119, 0.4); + border-left: 4px solid rgba(161, 45, 82, 0.4); + } + + .domain { + background: rgba(130, 25, 211, 0.4); + border-left: 4px solid rgba(68, 31, 95, 0.4); + } + + .add-theme { + padding: 5px 16px; + border: 1px solid rgba(27, 76, 161, 1); + border-radius: 50px; + cursor: pointer; + color: rgba(27, 76, 161, 1); + font-family: Lato; + font-size: 14px; + font-weight: 700; + line-height: 16.8px; + text-align: center; + text-underline-position: from-font; + text-decoration-skip-ink: none; + } + + .theme-header { + font-family: Helvetica Neue; + font-size: 16px; + font-weight: 700; + line-height: 24px; + text-align: left; + text-underline-position: from-font; + text-decoration-skip-ink: none; + } + +} + +.filter-overlay-12 { + background: rgba(0, 0, 0, 0.6); + width: 100%; + height: 100%; + position: fixed; + top: 0; + left: 0; + right: 0; + z-index: 1000; + + .filter-12 { + height: 95%; + border: 1px solid #ccc; + position: absolute; + right: 0; + background: #fff; + z-index: 10000 !important; + top: 0px; + overflow-y: auto; + width: 800px; + padding: 75px 24px 24px 24px; + } +} \ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.ts index 4beb3ab89..e4b4dee44 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.ts @@ -1,4 +1,8 @@ -import { Component } from '@angular/core'; +import { Component, Input } from '@angular/core' +import { EventsService } from '../../services/events.service' +import { MatLegacySnackBar } from '@angular/material/legacy-snack-bar' +import { AddCompetencyComponent } from '../../dialogs/add-competency/add-competency.component' +import { MatLegacyDialog } from '@angular/material/legacy-dialog' @Component({ selector: 'ws-app-event-competencies', @@ -6,5 +10,322 @@ import { Component } from '@angular/core'; styleUrls: ['./event-competencies.component.scss'] }) export class EventCompetenciesComponent { + @Input() openMode = 'edit' + competencies: any + searchText: string = '' + + constructor(private matSnackBar: MatLegacySnackBar, + private dialog: MatLegacyDialog, + private eventsService: EventsService, + ) { } + + ngOnInit(): void { + let _competencies: any = [ + { + "competencyAreaDescription": "Functional competencies are common among many domains, cutting across MDOs, as well as roles and activities.", + "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_af8caa53-7f84-499e-86b2-e32e5b59908e", + "competencyAreaName": "Functional", + "competencyAreaRefId": "COMAREA-000003", + "competencySubThemeAdditionalProperties": { + "displayName": "Handling Allowances & Reimbursement", + "timeStamp": 1724675891609 + }, + "competencySubThemeDescription": "Handling Allowances & Reimbursement Competency Sub-Theme", + "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_35bf9d51-7299-45a5-ad99-1f7c7db1e4ba", + "competencySubThemeName": "Handling Allowances & Reimbursement", + "competencySubThemeRefId": "COMSUBTHEME-000276", + "competencyThemeAdditionalProperties": { + "displayName": "Administration Matters", + "timeStamp": 1724675757333 + }, + "competencyThemeDescription": "Administration Matters competency Theme", + "competencyThemeIdentifier": "kcmfinal_fw_theme_92909bf6-2cea-47ea-b426-dc31803f2177", + "competencyThemeName": "Administration Matters", + "competencyThemeRefId": "COMTHEME-000205", + "competencyThemeType": "theme" + }, + { + "competencyAreaDescription": "Behavioural competencies describe the key values and strengths that help an official perform effectively in a range of roles.", + "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_5ed3587a-2a9b-4e3c-8852-8ffcff5c70b2", + "competencyAreaName": "Behavioural", + "competencyAreaRefId": "COMAREA-000001", + "competencySubThemeAdditionalProperties": { + "displayName": "Influencing and Negotiation", + "timeStamp": 1724328873174 + }, + "competencySubThemeDescription": "", + "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_42a53028-112d-43e8-9726-2065b4d36257", + "competencySubThemeName": "Influencing and Negotiation", + "competencySubThemeRefId": "COMSUBTHEME-000035", + "competencyThemeAdditionalProperties": { + "displayName": "Collaborative Leadership", + "timeStamp": 1724328741549 + }, + "competencyThemeDescription": "", + "competencyThemeIdentifier": "kcmfinal_fw_theme_b88dbaf8-99f8-45da-a4a7-5e23f9e1c001", + "competencyThemeName": "Collaborative Leadership", + "competencyThemeRefId": "COMTHEME-000011", + "competencyThemeType": "theme" + }, + { + "competencyAreaDescription": "Functional competencies are common among many domains, cutting across MDOs, as well as roles and activities.", + "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_af8caa53-7f84-499e-86b2-e32e5b59908e", + "competencyAreaName": "Functional", + "competencyAreaRefId": "COMAREA-000003", + "competencySubThemeAdditionalProperties": { + "displayName": "Implementing Official Language", + "timeStamp": 1724675927861 + }, + "competencySubThemeDescription": "Implementing Official Language Competency Sub-Theme", + "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_364e40fe-95ea-4437-9f14-d2d6331feff8", + "competencySubThemeName": "Implementing Official Language", + "competencySubThemeRefId": "COMSUBTHEME-000279", + "competencyThemeAdditionalProperties": { + "displayName": "Administration Matters", + "timeStamp": 1724675757333 + }, + "competencyThemeDescription": "Administration Matters competency Theme", + "competencyThemeIdentifier": "kcmfinal_fw_theme_92909bf6-2cea-47ea-b426-dc31803f2177", + "competencyThemeName": "Administration Matters", + "competencyThemeRefId": "COMTHEME-000205", + "competencyThemeType": "theme" + }, + { + "competencyAreaDescription": "Behavioural competencies describe the key values and strengths that help an official perform effectively in a range of roles.", + "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_5ed3587a-2a9b-4e3c-8852-8ffcff5c70b2", + "competencyAreaName": "Behavioural", + "competencyAreaRefId": "COMAREA-000001", + "competencySubThemeAdditionalProperties": { + "displayName": "Conflict Management", + "timeStamp": 1724328873172 + }, + "competencySubThemeDescription": "", + "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_61c8ba58-0202-4f76-8fbd-c32bb6b3c952", + "competencySubThemeName": "Conflict Management", + "competencySubThemeRefId": "COMSUBTHEME-000036", + "competencyThemeAdditionalProperties": { + "displayName": "Collaborative Leadership", + "timeStamp": 1724328741549 + }, + "competencyThemeDescription": "", + "competencyThemeIdentifier": "kcmfinal_fw_theme_b88dbaf8-99f8-45da-a4a7-5e23f9e1c001", + "competencyThemeName": "Collaborative Leadership", + "competencyThemeRefId": "COMTHEME-000011", + "competencyThemeType": "theme" + }, + { + "competencyAreaDescription": "Behavioural competencies describe the key values and strengths that help an official perform effectively in a range of roles.", + "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_5ed3587a-2a9b-4e3c-8852-8ffcff5c70b2", + "competencyAreaName": "Behavioural", + "competencyAreaRefId": "COMAREA-000001", + "competencySubThemeAdditionalProperties": { + "displayName": "Planning & Prioritization", + "timeStamp": 1724764179110 + }, + "competencySubThemeDescription": "Planning & Prioritization Competency Sub-Theme", + "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_81ded4ed-55dc-4bd1-a21e-6fc5840ce30e", + "competencySubThemeName": "Planning & Prioritization", + "competencySubThemeRefId": "COMSUBTHEME-000025", + "competencyThemeAdditionalProperties": { + "displayName": "Operational Excellence", + "timeStamp": 1724764141855 + }, + "competencyThemeDescription": "Operational Excellence competency Theme", + "competencyThemeIdentifier": "kcmfinal_fw_theme_49a613f9-b825-4e16-a74a-0d413cf6c4eb", + "competencyThemeName": "Operational Excellence", + "competencyThemeRefId": "COMTHEME-000008", + "competencyThemeType": "theme" + }, + { + "competencyAreaDescription": "Domain competencies are defined for a specific domain (for example, the Ministry of Personnel or Department of Biotechnology) but that does not mean others will not need them.", + "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_c527d0c7-ab6a-40d8-a06b-298fedc32b6c", + "competencyAreaName": "Domain", + "competencyAreaRefId": "COMAREA-000002", + "competencySubThemeAdditionalProperties": { + "displayName": "Adherence to Vigilance Guidelines", + "timeStamp": 1724329331026 + }, + "competencySubThemeDescription": "Adherence to Vigilance Guidelines Competency Sub-Theme", + "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_7d0f9ba8-275a-453f-a5ca-e6eba616ace5", + "competencySubThemeName": "Adherence to Vigilance Guidelines", + "competencySubThemeRefId": "COMSUBTHEME-000044", + "competencyThemeAdditionalProperties": { + "displayName": "Adherence to Vigilance Guidelines", + "timeStamp": 1724329319692 + }, + "competencyThemeDescription": "Adherence to Vigilance Guidelines competency Theme", + "competencyThemeIdentifier": "kcmfinal_fw_theme_b3d2e633-5959-4d1e-9d7f-bba42865ca68", + "competencyThemeName": "Adherence to Vigilance Guidelines", + "competencyThemeRefId": "COMTHEME-000016", + "competencyThemeType": "theme" + }, + { + "competencyAreaDescription": "Functional competencies are common among many domains, cutting across MDOs, as well as roles and activities.", + "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_af8caa53-7f84-499e-86b2-e32e5b59908e", + "competencyAreaName": "Functional", + "competencyAreaRefId": "COMAREA-000003", + "competencySubThemeAdditionalProperties": { + "displayName": "Preventive Vigilance", + "timeStamp": 1724767755390 + }, + "competencySubThemeDescription": "Preventive Vigilance Competency Sub-Theme", + "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_2ce23e33-3121-4a46-a07b-2adbdaffc579", + "competencySubThemeName": "Preventive Vigilance", + "competencySubThemeRefId": "COMSUBTHEME-000266", + "competencyThemeAdditionalProperties": { + "displayName": "Vigilance Administration", + "timeStamp": 1724767709764 + }, + "competencyThemeDescription": "Vigilance Administration competency Theme", + "competencyThemeIdentifier": "kcmfinal_fw_theme_f2717261-6319-4f5c-b05a-8767fa4c3f51", + "competencyThemeName": "Vigilance Administration", + "competencyThemeRefId": "COMTHEME-000201", + "competencyThemeType": "theme" + }, + { + "competencyAreaDescription": "Functional competencies are common among many domains, cutting across MDOs, as well as roles and activities.", + "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_af8caa53-7f84-499e-86b2-e32e5b59908e", + "competencyAreaName": "Functional", + "competencyAreaRefId": "COMAREA-000003", + "competencySubThemeAdditionalProperties": { + "displayName": "Inventory Management", + "timeStamp": 1724767037164 + }, + "competencySubThemeDescription": "Inventory Management Competency Sub-Theme", + "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_6ba1543e-891f-46ec-b09b-974156f54cc1", + "competencySubThemeName": "Inventory Management", + "competencySubThemeRefId": "COMSUBTHEME-000234", + "competencyThemeAdditionalProperties": { + "displayName": "Material Management", + "timeStamp": 1724767010422 + }, + "competencyThemeDescription": "Material Management competency Theme", + "competencyThemeIdentifier": "kcmfinal_fw_theme_b8e6271f-f225-4593-978b-4f1a822c7485", + "competencyThemeName": "Material Management", + "competencyThemeRefId": "COMTHEME-000193", + "competencyThemeType": "theme" + }, + { + "competencyAreaDescription": "Domain competencies are defined for a specific domain (for example, the Ministry of Personnel or Department of Biotechnology) but that does not mean others will not need them.", + "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_c527d0c7-ab6a-40d8-a06b-298fedc32b6c", + "competencyAreaName": "Domain", + "competencyAreaRefId": "COMAREA-000002", + "competencySubThemeAdditionalProperties": { + "displayName": "Human Resource Systems Management", + "timeStamp": 1724687263661 + }, + "competencySubThemeDescription": "Human Resource Systems Management Competency Sub-Theme", + "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_a445103c-94e6-4c21-8050-08b668f19e7c", + "competencySubThemeName": "Human Resource Systems Management", + "competencySubThemeRefId": "COMSUBTHEME-000116", + "competencyThemeAdditionalProperties": { + "displayName": "Human Resource Systems Management", + "timeStamp": 1724648584675 + }, + "competencyThemeDescription": "Human Resource Systems Management competency Theme", + "competencyThemeIdentifier": "kcmfinal_fw_theme_02855add-e2bf-4348-8c5f-a00492461620", + "competencyThemeName": "Human Resource Systems Management", + "competencyThemeRefId": "COMTHEME-000088", + "competencyThemeType": "theme" + }, + { + "competencyAreaDescription": "Functional competencies are common among many domains, cutting across MDOs, as well as roles and activities.", + "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_af8caa53-7f84-499e-86b2-e32e5b59908e", + "competencyAreaName": "Functional", + "competencyAreaRefId": "COMAREA-000003", + "competencySubThemeAdditionalProperties": { + "displayName": "Handling Miscellaneous Matters (Car, Residence, Personal Staff etc.)", + "timeStamp": 1724675861316 + }, + "competencySubThemeDescription": "Handling Miscellaneous Matters (Car, Residence, Personal Staff etc.) Competency Sub-Theme", + "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_0632be81-392a-45f8-a93b-b1649e29fb5e", + "competencySubThemeName": "Handling Miscellaneous Matters (Car, Residence, Personal Staff etc.)", + "competencySubThemeRefId": "COMSUBTHEME-000278", + "competencyThemeAdditionalProperties": { + "displayName": "Administration Matters", + "timeStamp": 1724675757333 + }, + "competencyThemeDescription": "Administration Matters competency Theme", + "competencyThemeIdentifier": "kcmfinal_fw_theme_92909bf6-2cea-47ea-b426-dc31803f2177", + "competencyThemeName": "Administration Matters", + "competencyThemeRefId": "COMTHEME-000205", + "competencyThemeType": "theme" + } + ] + this.competencies = this.eventsService.convertToTreeView(_competencies) + console.log("competenciesObject ", this.competencies) + } + + + + hideAnfShow(row: any) { + if (row.collapsed) { + row.collapsed = false + } else { + row.collapsed = true + } + } + + removeNode(_competency: any) { + this.competencies = this.competencies.filter((competency: any) => _competency.competencyAreaName !== competency.competencyAreaName) + this.openSnackBar('Competency area is remove successfully.') + } + + removeTheme(_competency: any, _theme: any) { + this.competencies = this.competencies.map((competency: any) => { + if (competency.competencyAreaName === _competency.competencyAreaName) { + return { + ...competency, + themes: competency.themes.filter((theme: any) => theme.competencyThemeName !== _theme.competencyThemeName) + } + } else { + return { ...competency } + } + }) + this.openSnackBar('Competency theme is remove successfully.') + } + + removeSubTheme(_competency: any, _theme: any, _subTheme: any) { + this.competencies = this.competencies.map((competency: any) => { + if (competency.competencyAreaName === _competency.competencyAreaName) { + return { + ...competency, + themes: competency.themes.map((theme: any) => { + if (theme.competencyThemeName === _theme.competencyThemeName) { + return { + ...theme, + subThems: theme.subThems.filter( + (subTheme: any) => _subTheme.competencySubThemeAdditionalProperties.displayName !== subTheme.competencySubThemeAdditionalProperties.displayName) + } + } + return theme + }) + } + } else { + return { ...competency } + } + }) + this.openSnackBar('Competency sub theme is remove successfully.') + + } + + showSearch() { + + const dialogRef = this.dialog.open(AddCompetencyComponent, { + panelClass: 'dialog_sidenav', + width: '800px', + disableClose: true, + }) + + dialogRef.afterClosed().subscribe((result: any) => { + if (result) { + console.log(result) + } + }) + } + + private openSnackBar(message: string) { + this.matSnackBar.open(message) + } } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.html index f45d943a4..f188ba52a 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.html @@ -4,7 +4,7 @@
+ [ngClass]="{'disableAddFile': !currentMaterialSaved || openMode === 'view'}">
@@ -18,7 +18,7 @@
- diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.ts index d3b874f21..e3d83db13 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.ts @@ -17,6 +17,7 @@ import { HttpErrorResponse } from '@angular/common/http' export class EventMaterialsComponent implements OnInit { @Input() materialsList: material[] = [] + @Input() openMode = 'edit' userProfile: any filePath: any diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.ts index 0b687a094..e5345b354 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.ts @@ -1,11 +1,11 @@ import { HttpErrorResponse } from '@angular/common/http' import { Component, OnDestroy, OnInit } from '@angular/core' import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar' -import { ActivatedRoute } from '@angular/router' -import _ from 'lodash' +import { ActivatedRoute, Router } from '@angular/router' import { Subscription } from 'rxjs' import { events } from '../../models/events.model' import { EventsService } from '../../services/events.service' +import * as _ from 'lodash' @Component({ selector: 'ws-app-events-list', @@ -28,7 +28,8 @@ export class EventsListComponent implements OnInit, OnDestroy { constructor( private eventSvc: EventsService, private matSnackBar: MatSnackBar, - private activatedRoute: ActivatedRoute + private activatedRoute: ActivatedRoute, + private route: Router ) { } //#endregion @@ -60,10 +61,10 @@ export class EventsListComponent implements OnInit, OnDestroy { btnText: 'View', action: 'view', }, - { - btnText: 'Start Broadcast', - action: 'broadcast', - }, + // { + // btnText: 'Start Broadcast', + // action: 'broadcast', + // }, { btnText: 'Cancel', action: 'cancel', @@ -153,8 +154,8 @@ export class EventsListComponent implements OnInit, OnDestroy { { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, { displayName: 'Created On', key: 'createdOn', cellType: 'date' }, - { displayName: 'Cancelled On', key: 'rejectedOn', cellType: 'date' }, - { displayName: 'Cancelled By', key: 'createdByName', cellType: 'text' }, + { displayName: 'Cancelled On', key: 'cancelledOn', cellType: 'date' }, + { displayName: 'Cancelled By', key: 'cancelledBy', cellType: 'text' }, ], showSearchBox: true, showPagination: true, @@ -163,13 +164,9 @@ export class EventsListComponent implements OnInit, OnDestroy { this.menuItems = [ { - btnText: 'Edit', - action: 'edit', - }, - { - btnText: 'View Remarks', - action: 'remarks', - }, + btnText: 'View', + action: 'view', + } ] break case 'rejected': @@ -293,7 +290,56 @@ export class EventsListComponent implements OnInit, OnDestroy { } contentEvents(events: any) { - console.log(events) + if (events && events.action && events.rows) { + switch (events.action) { + case 'view': + this.navigateToEditEvent(_.get(events, 'rows.identifier'), 'view') + break + case 'edit': + this.navigateToEditEvent(_.get(events, 'rows.identifier'), 'edit') + break + case 'cancel': + this.cancelEvent(events.rows) + break + case 'remarks': + break + case 'broadcast': + break + } + } + } + + navigateToEditEvent(eventId: string, openMode: string) { + this.route.navigate([`/app/home/events/edit-event`, eventId], { + queryParams: { + mode: openMode, + pathUrl: this.pathUrl + } + }) + } + + cancelEvent(rowData: any) { + const requestBody = { + request: { + event: { + versionKey: rowData.versionKey, + status: 'Cancelled', + identifier: rowData.identifier + } + } + } + this.eventSvc.publishEvent(rowData.identifier, requestBody).subscribe({ + next: res => { + if (res) { + this.openSnackBar('event is cancelled successfully') + this.getEvents() + } + }, + error: (error: HttpErrorResponse) => { + const errorMessage = _.get(error, 'error.message', 'Something went wrong please try again') + this.openSnackBar(errorMessage) + } + }) } //#endregion diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.html index 786cc8103..e0d145254 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.html @@ -19,6 +19,9 @@ Past + Canceled + Rejected diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.ts index 08912802d..163e56fae 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.ts @@ -19,13 +19,15 @@ export class EventsComponent implements OnInit, OnDestroy { currentRoute = 'pending-approval' routeSubscription: Subscription = new Subscription() userProfile: any + pathUrl = '' //#endregion //#region (constructor) constructor( private router: Router, private dialog: MatDialog, - private activeRoute: ActivatedRoute + private activatedRoute: ActivatedRoute, + private route: Router ) { } //#endregion @@ -47,9 +49,10 @@ export class EventsComponent implements OnInit, OnDestroy { this.updateCurrentRoute() } }) - if (_.get(this.activeRoute, 'snapshot.data.configService.userProfile')) { - this.userProfile = _.get(this.activeRoute, 'snapshot.data.configService.userProfile') + if (_.get(this.activatedRoute, 'snapshot.data.configService.userProfile')) { + this.userProfile = _.get(this.activatedRoute, 'snapshot.data.configService.userProfile') } + this.pathUrl = _.get(this.activatedRoute, 'snapshot.url[0].path', 'pending-approval') } updateCurrentRoute(): void { @@ -64,8 +67,15 @@ export class EventsComponent implements OnInit, OnDestroy { data: this.userProfile, }) - dialgRrf.afterClosed().subscribe((event: any) => { - if (event) { } + dialgRrf.afterClosed().subscribe((identifier: any) => { + if (identifier) { + this.route.navigate([`/app/home/events/edit-event`, identifier], { + queryParams: { + mode: 'edit', + pathUrl: this.pathUrl + } + }) + } }) } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.html index de699b205..e2487a2f7 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.html @@ -3,13 +3,16 @@
{{materialDetails?.fullName}}
edit - delete + + delete +
- +
Full Name
@@ -35,8 +38,10 @@
- + + +
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.scss index 61e1057ed..6a27f6a23 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.scss @@ -72,9 +72,16 @@ /* stylelint-disable */ } +:host ::ng-deep .disableForm { + .mat-form-field-outline { + background-color: #ededed; + border-radius: 20px; + } +} + :host ::ng-deep .event-form { .mat-form-field-wrapper { - padding-bottom: 0px !important; + padding-bottom: 16px !important; } .mat-form-field-appearance-outline .mat-form-field-infix { diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.ts index 0e2d257ab..67b15801d 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.ts @@ -11,6 +11,7 @@ import * as _ from 'lodash' export class MaterialDetailsComponent implements OnChanges { @Input() materialDetails: material | undefined @Input() openMaterial: boolean = false + @Input() openMode = 'edit' @Output() updatedMaterialDetails = new EventEmitter() @Output() canCloseOrOpenMaterial = new EventEmitter() @Output() currentMaterialSaveUpdate = new EventEmitter() @@ -47,6 +48,10 @@ export class MaterialDetailsComponent implements OnChanges { this.currentMaterialSaveUpdate.emit(this.currentMaterialSaved) } }) + + if (this.openMode === 'view') { + this.eventForm.disable() + } } } } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.html index 0fc505ccb..2cbf2d1ec 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.html @@ -2,10 +2,12 @@
Add Speakers
- + + + @@ -25,7 +27,9 @@ diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.ts index 8d523a315..013323a24 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.ts @@ -9,28 +9,8 @@ import { AddSpeakersComponent } from '../../dialogs/add-speakers/add-speakers.co styleUrls: ['./speakers.component.scss'] }) export class SpeakersComponent implements OnInit, OnChanges { - @Input() speakersList: speaker[] = [ - { - email: 'puran123[at]yopmail[dot]com', - name: 'Puran', - description: 'Praesent in mauris eu tortor porttitor accumsan. Mauris suscipit, ligula sit amet pharetra semper,' - }, - { - email: 'puran123[at]yopmail[dot]com', - name: 'Puran', - description: '' - }, - { - email: 'puran123[at]yopmail[dot]com', - name: '', - description: 'Praesent in mauris eu tortor porttitor accumsan. Mauris suscipit, ligula sit amet pharetra semper,' - }, - { - email: 'puran123[at]yopmail[dot]com', - name: 'Puran', - description: 'Praesent in mauris eu tortor porttitor accumsan. Mauris suscipit, ligula sit amet pharetra semper,' - }, - ] + @Input() speakersList: speaker[] = [] + @Input() openMode = 'edit' constructor( private dialog: MatDialog, diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.html new file mode 100644 index 000000000..5ceb90a23 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.html @@ -0,0 +1,62 @@ +
+

+
+ Add Competency + +
+

+
+
+
+
+ + + +
+
+
+
Themes
+
+ +
+ +
+ + {{themesShowMore ? 'See More' : 'See Less'}} +
+
+ +
+
Add Sub Themes
+
+ +
+ +
+ + {{subThemesShowMore ? 'See More' : 'See Less'}} +
+
+
+
+
+
+ + +
+
+
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.scss new file mode 100644 index 000000000..cfae0edbe --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.scss @@ -0,0 +1,76 @@ +:host ::ng-deep .mat-form-field-wrapper { + margin: 0 !important; + width: 760px; + +} + +:host ::ng-deep .mat-form-field-appearance-outline .mat-form-field-wrapper { + padding-bottom: 0 !important; +} +.add-competency-header { + font-family: Montserrat; + font-size: 16px; + font-weight: 600; + line-height: 19.5px; + text-align: left; + text-underline-position: from-font; + text-decoration-skip-ink: none; + color: rgba(0, 0, 0, 0.87); +} + +.themes-header { + font-family: Montserrat; + font-size: 14px; + font-weight: 600; + line-height: 17.07px; + text-align: left; + text-underline-position: from-font; + text-decoration-skip-ink: none; +} + +.themes-container { + display: flex; + flex-wrap: wrap; + gap: 8px; +} + +.chip-themes { + display: flex; + align-items: center; + gap: 4px; + padding: 8px 16px; + border: 1px solid #ccc; + border-radius: 16px; + font-family: Lato; + font-size: 12px; + font-weight: 400; + line-height: 14.4px; + text-align: left; + text-underline-position: from-font; + text-decoration-skip-ink: none; +} + +.active { + border: 1px solid rgba(27, 76, 161, 1); + color: rgba(27, 76, 161, 1); +} + +.theme-name { + display: flex; + align-items: center; + gap: 6px; + cursor: pointer; +} + +.see-more { + color: rgba(27, 76, 161, 1); + cursor: pointer; + text-decoration: underline !important; + padding-top: 5px; + padding-left: 5px; +} + +.content-section { + height: calc(100vh - 190px); + overflow: auto; +} \ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.spec.ts new file mode 100644 index 000000000..e225a4295 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.spec.ts @@ -0,0 +1,25 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { AddCompetencyComponent } from './add-competency.component'; + +describe('AddCompetencyComponent', () => { + let component: AddCompetencyComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ AddCompetencyComponent ] + }) + .compileComponents(); + }); + + beforeEach(() => { + fixture = TestBed.createComponent(AddCompetencyComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.ts new file mode 100644 index 000000000..a92782bef --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.ts @@ -0,0 +1,171 @@ +import { Component, OnInit } from '@angular/core' +import { FormControl } from '@angular/forms' +import { ProfileV2Service } from '../../../../services/home.servive' +import { MatLegacyDialogRef } from '@angular/material/legacy-dialog' +import { debounceTime } from 'rxjs/operators' +import * as _ from 'lodash' + +@Component({ + selector: 'ws-app-add-competency', + templateUrl: './add-competency.component.html', + styleUrls: ['./add-competency.component.scss'] +}) + +export class AddCompetencyComponent implements OnInit { + searchControl!: FormControl + themes: any[] = [] + themesShowMore = false + subThemesShowMore = false + subThemes: any[] = [] + filterThemes: any[] = [] + filteredSubThemes: any[] = [] + limitToShow = 4 + + comptencyAreasList: any[] = [] + validThemesList: any[] = [] + validSubThemesList: any[] = [] + constructor( + private dialogRef: MatLegacyDialogRef, + private homeService: ProfileV2Service + ) { } + + ngOnInit(): void { + this.searchControl = new FormControl('') + this.searchControl.valueChanges.pipe( + debounceTime(500) + ).subscribe((serachKey: string) => { + console.log(serachKey) + }) + + this.getFrameWorkDetails() + } + + getFrameWorkDetails() { + this.homeService.getFilterEntityV2().subscribe((response: any) => { + this.generateThemsAndSubThemes(response) + }) + } + + generateThemsAndSubThemes(response: any) { + if (response) { + let competencyArea: any = [] + let themes: any = [] + response.forEach((areas: any) => { + if (areas.code === 'competencyarea') { + competencyArea = areas + this.comptencyAreasList = competencyArea.terms + } else if (areas.code === 'theme') { + themes = areas + } + }) + + if (!themes || !themes.terms) return + + let filteredThemes = themes.terms + .filter((theme: any) => theme.associations && theme.associations.length > 0) + .map((theme: any, themeIndex: number) => { + const filteredAssociations = this.filterDuplicates(theme.associations, 'identifier') + filteredAssociations.forEach((subtheme: any) => { + subtheme['themeIndex'] = themeIndex + }) + + return { + ...theme, + associations: filteredAssociations + } + }) + + const competencyRefIdMap = new Map() + this.comptencyAreasList.forEach((competency: any) => { + competency.associations.forEach((competencyThemes: any) => { + competencyRefIdMap.set(competencyThemes.refId, competencyThemes) + }) + }) + filteredThemes.forEach((theme: any) => { + theme.associations.forEach((subtheme: any) => { + const competencyThemes = competencyRefIdMap.get(subtheme.refId) + if (competencyThemes) { + subtheme.competencyRefId = competencyThemes.refId + } + }) + }) + + this.validThemesList = filteredThemes + this.validSubThemesList = filteredThemes + .reduce((acc: any[], theme: any) => { + return [...acc, ...theme.associations] + }, []) + .filter((subtheme: any, index: number, self: any[]) => { + return self.findIndex(s => s.identifier === subtheme.identifier) === index + }) + } + } + + filterDuplicates(items: any[], key: string) { + const seen = new Set() + return items.filter((item) => { + if (seen.has(item[key])) { + return false // Duplicate found + } + seen.add(item[key]) + return true + }) + } + + setFilteredThemes(searchKey = '') { + if (this.validThemesList) { + let filteredList = this.validThemesList.filter((theme: any) => theme.name.includes(searchKey)) + this.filterThemes = filteredList ? filteredList.slice(0, this.limitToShow) : [] + } + } + + setFilteredSubThemes(searchKey = '') { + if (this.validSubThemesList) { + let filteredList = this.validSubThemesList.filter((theme: any) => theme.name.includes(searchKey)) + this.filteredSubThemes = filteredList ? filteredList.slice(0, this.limitToShow) : [] + } + } + + visibleThemes() { + if (this.validThemesList.length > 4) { + this.filterThemes = this.validThemesList.slice(0, this.limitToShow) + this.themesShowMore = true + } else { + this.filterThemes = this.validThemesList + this.themesShowMore = false + } + } + + visibleSubThemes() { + if (this.subThemes.length > 4) { + this.filteredSubThemes = this.subThemes.slice(0, this.limitToShow) + this.subThemesShowMore = true + } else { + this.filteredSubThemes = this.subThemes + this.subThemesShowMore = false + } + } + + toggleThemes() { + this.themesShowMore = !this.themesShowMore + if (!this.themesShowMore) { + this.filterThemes = this.validThemesList + } else { + this.filterThemes = this.validThemesList.slice(0, this.limitToShow) + } + } + + toggleSubThemes() { + this.subThemesShowMore = !this.subThemesShowMore + if (!this.subThemesShowMore) { + this.filteredSubThemes = this.subThemes + } else { + this.filteredSubThemes = this.subThemes.slice(0, this.limitToShow) + } + } + + closeDialog() { + this.dialogRef.close() + } + +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.html index 3c7bfc30f..2b3dfd5e6 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.html @@ -29,9 +29,9 @@ * - + Recorded Event diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts index f9e2c7540..79fd32038 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts @@ -162,14 +162,14 @@ export class BasicInfoComponent implements OnInit { eventType: 'Online', registrationEndDate: '', owner: _.get(this.userProfile, 'departmentName', ''), - createdFor: createdforarray, + createdFor: createdforarray } } } this.eventSvc.createEvent(requestBody).subscribe({ next: res => { if (res) { - this.dialogRef.close(res) + this.dialogRef.close(_.get(res, 'result.identifier', '')) } }, error: (error: HttpErrorResponse) => { diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts b/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts index f443020e2..3048d9471 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/events-2-routing.module.ts @@ -4,6 +4,7 @@ import { EventsComponent } from './components/events/events.component' import { CreateEventComponent } from './components/create-event/create-event.component' import { ConfigResolveService } from '../../resolvers/config-resolve.service' import { EventsListComponent } from './components/events-list/events-list.component' +import { EventResolverService } from './services/event-resolver' const routes: Routes = [ { @@ -80,6 +81,7 @@ const routes: Routes = [ component: CreateEventComponent, resolve: { configService: ConfigResolveService, + eventDetails: EventResolverService }, } ] diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts b/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts index 5aa965eaf..0b764579a 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts @@ -33,6 +33,10 @@ import { AddSpeakersComponent } from './dialogs/add-speakers/add-speakers.compon import { MaterialDetailsComponent } from './components/material-details/material-details.component' import { EventsListComponent } from './components/events-list/events-list.component' import { MatLegacyPaginatorModule } from '@angular/material/legacy-paginator' +import { EventResolverService } from './services/event-resolver' +import { AddCompetencyComponent } from './dialogs/add-competency/add-competency.component' +import { MatLegacyCheckboxModule } from '@angular/material/legacy-checkbox' +// import { MatTimepickerModule } from '@angular/material/timepicker'; @NgModule({ @@ -47,7 +51,8 @@ import { MatLegacyPaginatorModule } from '@angular/material/legacy-paginator' BasicInfoComponent, AddSpeakersComponent, MaterialDetailsComponent, - EventsListComponent + EventsListComponent, + AddCompetencyComponent ], imports: [ CommonModule, @@ -62,6 +67,7 @@ import { MatLegacyPaginatorModule } from '@angular/material/legacy-paginator' MatInputModule, MatRadioModule, MatSelectModule, + MatLegacyCheckboxModule, Events2RoutingModule, MatCardModule, MatSnackBarModule, @@ -72,10 +78,13 @@ import { MatLegacyPaginatorModule } from '@angular/material/legacy-paginator' // NgxMaterialTimepickerModule, MatFormFieldModule, MatDatepickerModule, + + ], providers: [ DatePipe, - EventsService + EventsService, + EventResolverService ] }) export class Events2Module { } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/services/event-resolver.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/services/event-resolver.spec.ts new file mode 100644 index 000000000..01aa924d3 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/services/event-resolver.spec.ts @@ -0,0 +1,15 @@ +import { TestBed } from '@angular/core/testing' +import { EventResolverService } from './event-resolver' + +describe('eventResolverResolver', () => { + let service: EventResolverService + + beforeEach(() => { + TestBed.configureTestingModule({}) + service = TestBed.inject(EventResolverService) + }) + + it('should be created', () => { + expect(service).toBeTruthy() + }) +}) diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/services/event-resolver.ts b/project/ws/app/src/lib/routes/home/routes/events-2/services/event-resolver.ts new file mode 100644 index 000000000..03bfbe51a --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/services/event-resolver.ts @@ -0,0 +1,26 @@ +import { Injectable } from '@angular/core' +import { catchError, map } from 'rxjs/operators' +import { of, Observable } from 'rxjs' +import { ActivatedRoute } from '@angular/router' +import { EventsService } from './events.service' +import * as _ from 'lodash' + +@Injectable() +export class EventResolverService { + + constructor(private eventSvc: EventsService) { } + + resolve(activatedRoute: ActivatedRoute): Observable { + const id = _.get(activatedRoute, 'params.eventId', '').replace(':', '') + return this.eventSvc.getEventDetailsByid(id) + .pipe( + map((data: any) => { + const requiredData = _.get(data, 'result.event') + return { data: requiredData, error: null } + }), + catchError((err: any) => { + return of({ data: null, error: err }) + }) + ) + } +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.ts b/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.ts index fea3f76ff..1acf12971 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.ts @@ -10,7 +10,9 @@ const API_END_POINTS = { CREATE_CONTENT: 'apis/proxies/v8/action/content/v3/create', UPLOAD_CONTENT: 'apis/proxies/v8/upload/action/content/v3/upload', CREATE_EVENT: '/apis/proxies/v8/event/v4/create', - EVENT_READ: (eventId: string) => `apis/proxies/v8/event/v4/read/${eventId}` + EVENT_READ: (eventId: string) => `apis/proxies/v8/event/v4/read/${eventId}`, + UPDATE_EVENT: (eventId: string) => `apis/proxies/v8/event/v4/update/${eventId}`, + PUBLISH_EVENT: (eventId: string) => `apis/proxies/v8/event/v4/publish/${eventId}` } @Injectable({ @@ -58,4 +60,79 @@ export class EventsService { return this.http.get(API_END_POINTS.EVENT_READ(eventId)) } + updateEvent(formBody: any, eventId: string) { + return this.http.patch(`${API_END_POINTS.UPDATE_EVENT(eventId)}`, formBody) + } + + publishEvent(eventId: string, formBody: any) { + return this.http.post(API_END_POINTS.PUBLISH_EVENT(eventId), formBody) + } + + convertToTabularView() { + + } + + convertToTreeView(competencies: any) { + const competenciesObject: any = [] + + competencies.forEach((_obj: any) => { + let _area = competenciesObject.find((cObj: any) => cObj.competencyAreaName === _obj.competencyAreaName) + if (_area) { + let findTheme = _area.themes.find((theme: any) => theme.competencyThemeRefId === _obj.competencyThemeRefId) + if (findTheme) { + findTheme.subThems.push({ + competencySubThemeDescription: _obj.competencySubThemeDescription, + competencySubThemeIdentifier: _obj.competencySubThemeIdentifier, + competencySubThemeName: _obj.competencySubThemeName, + competencySubThemeRefId: _obj.competencySubThemeRefId, + competencySubThemeAdditionalProperties: { + displayName: _obj.competencySubThemeAdditionalProperties.displayName, + timeStamp: _obj.competencySubThemeAdditionalProperties.timeStamp + } + }) + } else { + let _themeObj = this.generateThemeObj(_obj) + _area.themes.push(_themeObj) + } + } else { + let _themeObj = this.generateThemeObj(_obj) + competenciesObject.push({ + competencyAreaDescription: _obj.competencyAreaDescription, + competencyAreaIdentifier: _obj.competencyAreaIdentifier, + competencyAreaName: _obj.competencyAreaName, + competencyAreaRefId: _obj.competencyAreaRefId, + collapsed: true, + themes: [_themeObj] + }) + } + }) + return competenciesObject + } + + generateThemeObj(_obj: any) { + let themeObj: any = { + competencyThemeDescription: _obj.competencyThemeDescription, + competencyThemeIdentifier: _obj.competencyThemeIdentifier, + competencyThemeName: _obj.competencyThemeName, + competencyThemeRefId: _obj.competencyThemeRefId, + competencyThemeType: _obj.competencyThemeType, + collapsed: true, + competencyThemeAdditionalProperties: { + displayName: _obj.competencyThemeAdditionalProperties.displayName, + timeStamp: _obj.competencyThemeAdditionalProperties.timeStamp + }, + subThems: [{ + competencySubThemeDescription: _obj.competencySubThemeDescription, + competencySubThemeIdentifier: _obj.competencySubThemeIdentifier, + competencySubThemeName: _obj.competencySubThemeName, + competencySubThemeRefId: _obj.competencySubThemeRefId, + competencySubThemeAdditionalProperties: { + displayName: _obj.competencySubThemeAdditionalProperties.displayName, + timeStamp: _obj.competencySubThemeAdditionalProperties.timeStamp + } + }] + } + return themeObj + } + } From 52259efe4cbe6410adb2cf745c46ae6270ac37ee Mon Sep 17 00:00:00 2001 From: mansurskTarento Date: Tue, 11 Feb 2025 12:33:26 +0530 Subject: [PATCH 10/14] add competency old ui commit --- .../add-competency.component.html | 20 ++-- .../add-competency.component.scss | 1 + .../add-competency.component.ts | 113 +++++++++++------- 3 files changed, 83 insertions(+), 51 deletions(-) diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.html index 5ceb90a23..d46317d6e 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.html @@ -19,15 +19,15 @@

Themes
- -
-
@@ -35,14 +35,14 @@

Add Sub Themes
-
+
- {{subThemesShowMore ? 'See More' : 'See Less'}} + {{subThemesShowMore ?'See Less' : 'See More'}}

diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.scss index cfae0edbe..1d178329d 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.scss @@ -48,6 +48,7 @@ text-align: left; text-underline-position: from-font; text-decoration-skip-ink: none; + cursor: pointer; } .active { diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.ts index a92782bef..557b413fc 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.ts @@ -1,7 +1,7 @@ -import { Component, OnInit } from '@angular/core' +import { Component, Inject, OnInit } from '@angular/core' import { FormControl } from '@angular/forms' import { ProfileV2Service } from '../../../../services/home.servive' -import { MatLegacyDialogRef } from '@angular/material/legacy-dialog' +import { MAT_LEGACY_DIALOG_DATA, MatLegacyDialogRef } from '@angular/material/legacy-dialog' import { debounceTime } from 'rxjs/operators' import * as _ from 'lodash' @@ -13,19 +13,20 @@ import * as _ from 'lodash' export class AddCompetencyComponent implements OnInit { searchControl!: FormControl - themes: any[] = [] themesShowMore = false subThemesShowMore = false - subThemes: any[] = [] - filterThemes: any[] = [] + filteredThemes: any[] = [] filteredSubThemes: any[] = [] limitToShow = 4 comptencyAreasList: any[] = [] validThemesList: any[] = [] validSubThemesList: any[] = [] + selectedThemesList: any[] = [] + selectedSubThemesList: any[] = [] constructor( private dialogRef: MatLegacyDialogRef, + @Inject(MAT_LEGACY_DIALOG_DATA) private competencies: any[], private homeService: ProfileV2Service ) { } @@ -33,8 +34,9 @@ export class AddCompetencyComponent implements OnInit { this.searchControl = new FormControl('') this.searchControl.valueChanges.pipe( debounceTime(500) - ).subscribe((serachKey: string) => { - console.log(serachKey) + ).subscribe(() => { + this.setFilteredThemes() + this.setFilteredSubThemes() }) this.getFrameWorkDetails() @@ -67,7 +69,16 @@ export class AddCompetencyComponent implements OnInit { const filteredAssociations = this.filterDuplicates(theme.associations, 'identifier') filteredAssociations.forEach((subtheme: any) => { subtheme['themeIndex'] = themeIndex + subtheme['themeIdentifier'] = theme.identifier + if (this.competencies && this.competencies.find((competency) => competency.competencySubThemeIdentifier === subtheme.identifier)) { + subtheme['selected'] = true + this.selectedSubThemesList.push(theme) + } }) + if (this.competencies && this.competencies.find((competency) => competency.competencyThemeIdentifier === theme.identifier)) { + theme['selected'] = true + this.selectedThemesList.push(theme) + } return { ...theme, @@ -99,6 +110,9 @@ export class AddCompetencyComponent implements OnInit { return self.findIndex(s => s.identifier === subtheme.identifier) === index }) } + + this.setFilteredThemes() + this.setFilteredSubThemes() } filterDuplicates(items: any[], key: string) { @@ -112,55 +126,72 @@ export class AddCompetencyComponent implements OnInit { }) } - setFilteredThemes(searchKey = '') { + setFilteredThemes() { + const searchKey = this.searchControl.value.toLowerCase() || '' if (this.validThemesList) { - let filteredList = this.validThemesList.filter((theme: any) => theme.name.includes(searchKey)) - this.filterThemes = filteredList ? filteredList.slice(0, this.limitToShow) : [] + let filteredList = this.validThemesList.filter((theme: any) => theme.name.toLowerCase().includes(searchKey)) + if (!this.themesShowMore) { + this.filteredThemes = filteredList ? filteredList.slice(0, this.limitToShow) : [] + } else { + this.filteredThemes = filteredList + } } } - setFilteredSubThemes(searchKey = '') { + setFilteredSubThemes() { + const searchKey = this.searchControl.value.toLowerCase() || '' if (this.validSubThemesList) { - let filteredList = this.validSubThemesList.filter((theme: any) => theme.name.includes(searchKey)) - this.filteredSubThemes = filteredList ? filteredList.slice(0, this.limitToShow) : [] + let filteredList = this.validSubThemesList.filter((theme: any) => theme.name.toLowerCase().includes(searchKey)) + if (!this.subThemesShowMore) { + this.filteredSubThemes = filteredList ? filteredList.slice(0, this.limitToShow) : [] + } else { + this.filteredSubThemes = filteredList + } } } - visibleThemes() { - if (this.validThemesList.length > 4) { - this.filterThemes = this.validThemesList.slice(0, this.limitToShow) - this.themesShowMore = true - } else { - this.filterThemes = this.validThemesList - this.themesShowMore = false - } + toggleThemes() { + this.themesShowMore = !this.themesShowMore + this.setFilteredThemes() } - visibleSubThemes() { - if (this.subThemes.length > 4) { - this.filteredSubThemes = this.subThemes.slice(0, this.limitToShow) - this.subThemesShowMore = true - } else { - this.filteredSubThemes = this.subThemes - this.subThemesShowMore = false - } + toggleSubThemes() { + this.subThemesShowMore = !this.subThemesShowMore + this.setFilteredSubThemes() } - toggleThemes() { - this.themesShowMore = !this.themesShowMore - if (!this.themesShowMore) { - this.filterThemes = this.validThemesList - } else { - this.filterThemes = this.validThemesList.slice(0, this.limitToShow) + selectTheme(index: number) { + const currentTheme = this.filteredThemes[index] + if (currentTheme) { + const checked = currentTheme['selected'] !== true ? true : false + currentTheme['selected'] = checked + if (checked) { + this.selectedThemesList.push(currentTheme) + } else { + this.selectedThemesList = this.selectedThemesList.filter((selectedTheme) => selectedTheme.identifier !== currentTheme.identifier) + const selectedSubThemes: any = [] + this.selectedSubThemesList.forEach((selectedSubTheme) => { + if (selectedSubTheme.themeIdentifier === currentTheme.identifier) { + selectedSubTheme['selected'] = false + } else { + selectedSubThemes.push(selectedSubTheme) + } + }) + this.selectedSubThemesList = selectedSubThemes + } } } - toggleSubThemes() { - this.subThemesShowMore = !this.subThemesShowMore - if (!this.subThemesShowMore) { - this.filteredSubThemes = this.subThemes - } else { - this.filteredSubThemes = this.subThemes.slice(0, this.limitToShow) + selectSubTheme(index: number) { + const currentSubTheme = this.filteredSubThemes[index] + if (currentSubTheme) { + const checked = currentSubTheme['selected'] !== true ? true : false + currentSubTheme['selected'] = checked + if (checked) { + this.selectedSubThemesList.push(currentSubTheme) + } else { + this.selectedSubThemesList = this.selectedSubThemesList.filter((selectedSubTheme) => selectedSubTheme.identifier !== currentSubTheme.identifier) + } } } From a2b9b9e9799b29e299ae561c945bae8057b7a725 Mon Sep 17 00:00:00 2001 From: mansurskTarento Date: Tue, 11 Feb 2025 15:11:30 +0530 Subject: [PATCH 11/14] WIP competency new ui changes --- .../add-competency.component.html | 21 +++++++++++++-- .../add-competency.component.ts | 27 +++++++++---------- 2 files changed, 32 insertions(+), 16 deletions(-) diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.html index d46317d6e..e4f3bd2bc 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.html @@ -12,7 +12,7 @@

- +
@@ -31,7 +31,7 @@

-
+ + +
+
Add Sub Themes
+ +
+
{{selectedTheme.name}}
+ +
+ +
+ + +
diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.ts index 557b413fc..49d1eebff 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.ts @@ -14,16 +14,16 @@ import * as _ from 'lodash' export class AddCompetencyComponent implements OnInit { searchControl!: FormControl themesShowMore = false - subThemesShowMore = false + // subThemesShowMore = false filteredThemes: any[] = [] - filteredSubThemes: any[] = [] + // filteredSubThemes: any[] = [] limitToShow = 4 comptencyAreasList: any[] = [] validThemesList: any[] = [] - validSubThemesList: any[] = [] + // validSubThemesList: any[] = [] selectedThemesList: any[] = [] - selectedSubThemesList: any[] = [] + // selectedSubThemesList: any[] = [] constructor( private dialogRef: MatLegacyDialogRef, @Inject(MAT_LEGACY_DIALOG_DATA) private competencies: any[], @@ -36,7 +36,7 @@ export class AddCompetencyComponent implements OnInit { debounceTime(500) ).subscribe(() => { this.setFilteredThemes() - this.setFilteredSubThemes() + // this.setFilteredSubThemes() }) this.getFrameWorkDetails() @@ -65,19 +65,18 @@ export class AddCompetencyComponent implements OnInit { let filteredThemes = themes.terms .filter((theme: any) => theme.associations && theme.associations.length > 0) - .map((theme: any, themeIndex: number) => { + .map((theme: any) => { const filteredAssociations = this.filterDuplicates(theme.associations, 'identifier') - filteredAssociations.forEach((subtheme: any) => { - subtheme['themeIndex'] = themeIndex - subtheme['themeIdentifier'] = theme.identifier - if (this.competencies && this.competencies.find((competency) => competency.competencySubThemeIdentifier === subtheme.identifier)) { - subtheme['selected'] = true - this.selectedSubThemesList.push(theme) - } - }) + theme['selectedSubThemes'] = [] if (this.competencies && this.competencies.find((competency) => competency.competencyThemeIdentifier === theme.identifier)) { theme['selected'] = true this.selectedThemesList.push(theme) + filteredAssociations.forEach((subtheme: any) => { + if (this.competencies && this.competencies.find((competency) => competency.competencySubThemeIdentifier === subtheme.identifier)) { + subtheme['selected'] = true + theme['selectedSubThemes'].push(subtheme) + } + }) } return { From 0f0883be31295475969b4f300b2243415a8ccfae Mon Sep 17 00:00:00 2001 From: mansurskTarento Date: Wed, 12 Feb 2025 23:20:57 +0530 Subject: [PATCH 12/14] add competency new ui changes --- .../event-basic-details.component.html | 4 +- .../event-competencies.component.html | 12 +- .../event-competencies.component.scss | 62 ++--- .../event-competencies.component.ts | 211 ++---------------- .../add-competency.component.html | 60 +++-- .../add-competency.component.scss | 55 ++++- .../add-competency.component.ts | 176 +++++++++------ 7 files changed, 239 insertions(+), 341 deletions(-) diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html index debfa4960..cc5aa0db3 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html @@ -104,12 +104,12 @@
- Start Time + End Time
- start time is mandatory + end time is mandatory
diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.html index ecb7109e0..865d5dd8e 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.html @@ -1,12 +1,12 @@ -
+
Add Competency
-
Add Competency
+
Add Competency
-
+
-
+
@@ -44,7 +44,7 @@
diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.scss index a6993c18d..fcc724d23 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.scss @@ -31,32 +31,17 @@ color: rgba(27, 76, 161, 1); } - .theme-behavioural { - background: rgba(248, 184, 97, 0.24); - } - - .sub-theme-behavioural { - background: rgba(248, 184, 97, 0.12); - } - - .theme-functional { - background: rgba(226, 69, 119, 0.24); - } - - .sub-theme-functional { - background: rgba(226, 69, 119, 0.12); + .themes-card { + border-bottom: 1px solid #c3c3c3; } - .theme-domain { - background: rgba(130, 25, 211, 0.21); + .bottom-border { + border: 1px solid #c3c3c3; + border-bottom: 0px !important; } - .sub-theme-domain { - background: rgba(130, 25, 211, 0.12); - } - - .bottom-border { - border-bottom: 1px solid #c3c3c3; + .extra-padding { + padding-left: 4rem; } .theme { @@ -79,6 +64,8 @@ text-decoration-skip-ink: none; } + + .area { padding: 6px 10px; font-family: Montserrat; @@ -88,24 +75,41 @@ text-align: left; text-underline-position: from-font; text-decoration-skip-ink: none; - border-radius: 4px; + } + + .my-border { + border-left: 1px solid #c3c3c3; + border-right: 1px solid #c3c3c3; + border-bottom: 1px solid #c3c3c3; + min-height: 27px; } .behavioural { - background: rgba(248, 184, 97, 0.4); - border-left: 4px solid rgba(243, 150, 47, 1); + border-top: 4px solid #F8B861!important; + border-top-left-radius: 8px; + border-top-right-radius: 8px; + border-left: 1px solid #c3c3c3; + border-right: 1px solid #c3c3c3; } .functional { - background: rgba(226, 69, 119, 0.4); - border-left: 4px solid rgba(161, 45, 82, 0.4); + border-top: 4px solid #E24577; + border-top-left-radius: 8px; + border-top-right-radius: 8px; + border-left: 1px solid #c3c3c3; + border-right: 1px solid #c3c3c3; + } .domain { - background: rgba(130, 25, 211, 0.4); - border-left: 4px solid rgba(68, 31, 95, 0.4); + border-top: 4px solid #7B47A4!important; + border-top-left-radius: 8px; + border-top-right-radius: 8px; + border-left: 1px solid #c3c3c3; + border-right: 1px solid #c3c3c3; } + .add-theme { padding: 5px 16px; border: 1px solid rgba(27, 76, 161, 1); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.ts index e4b4dee44..cea25a4ef 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.ts @@ -13,6 +13,8 @@ export class EventCompetenciesComponent { @Input() openMode = 'edit' competencies: any searchText: string = '' + event: any + eventId: any constructor(private matSnackBar: MatLegacySnackBar, private dialog: MatLegacyDialog, @@ -20,6 +22,17 @@ export class EventCompetenciesComponent { ) { } ngOnInit(): void { + + // this.eventId = this.route.snapshot.paramMap.get('eventId') + + // this.eventsService.eventDetails.subscribe((res: any) => { + // if (res) { + // this.event = res + // if (this.event?.competencies_v6) { + // this.competencies = this.eventsService.convertToTreeView(this.event.competencies_v6) + // } + // } + // }) let _competencies: any = [ { "competencyAreaDescription": "Functional competencies are common among many domains, cutting across MDOs, as well as roles and activities.", @@ -44,75 +57,6 @@ export class EventCompetenciesComponent { "competencyThemeRefId": "COMTHEME-000205", "competencyThemeType": "theme" }, - { - "competencyAreaDescription": "Behavioural competencies describe the key values and strengths that help an official perform effectively in a range of roles.", - "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_5ed3587a-2a9b-4e3c-8852-8ffcff5c70b2", - "competencyAreaName": "Behavioural", - "competencyAreaRefId": "COMAREA-000001", - "competencySubThemeAdditionalProperties": { - "displayName": "Influencing and Negotiation", - "timeStamp": 1724328873174 - }, - "competencySubThemeDescription": "", - "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_42a53028-112d-43e8-9726-2065b4d36257", - "competencySubThemeName": "Influencing and Negotiation", - "competencySubThemeRefId": "COMSUBTHEME-000035", - "competencyThemeAdditionalProperties": { - "displayName": "Collaborative Leadership", - "timeStamp": 1724328741549 - }, - "competencyThemeDescription": "", - "competencyThemeIdentifier": "kcmfinal_fw_theme_b88dbaf8-99f8-45da-a4a7-5e23f9e1c001", - "competencyThemeName": "Collaborative Leadership", - "competencyThemeRefId": "COMTHEME-000011", - "competencyThemeType": "theme" - }, - { - "competencyAreaDescription": "Functional competencies are common among many domains, cutting across MDOs, as well as roles and activities.", - "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_af8caa53-7f84-499e-86b2-e32e5b59908e", - "competencyAreaName": "Functional", - "competencyAreaRefId": "COMAREA-000003", - "competencySubThemeAdditionalProperties": { - "displayName": "Implementing Official Language", - "timeStamp": 1724675927861 - }, - "competencySubThemeDescription": "Implementing Official Language Competency Sub-Theme", - "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_364e40fe-95ea-4437-9f14-d2d6331feff8", - "competencySubThemeName": "Implementing Official Language", - "competencySubThemeRefId": "COMSUBTHEME-000279", - "competencyThemeAdditionalProperties": { - "displayName": "Administration Matters", - "timeStamp": 1724675757333 - }, - "competencyThemeDescription": "Administration Matters competency Theme", - "competencyThemeIdentifier": "kcmfinal_fw_theme_92909bf6-2cea-47ea-b426-dc31803f2177", - "competencyThemeName": "Administration Matters", - "competencyThemeRefId": "COMTHEME-000205", - "competencyThemeType": "theme" - }, - { - "competencyAreaDescription": "Behavioural competencies describe the key values and strengths that help an official perform effectively in a range of roles.", - "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_5ed3587a-2a9b-4e3c-8852-8ffcff5c70b2", - "competencyAreaName": "Behavioural", - "competencyAreaRefId": "COMAREA-000001", - "competencySubThemeAdditionalProperties": { - "displayName": "Conflict Management", - "timeStamp": 1724328873172 - }, - "competencySubThemeDescription": "", - "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_61c8ba58-0202-4f76-8fbd-c32bb6b3c952", - "competencySubThemeName": "Conflict Management", - "competencySubThemeRefId": "COMSUBTHEME-000036", - "competencyThemeAdditionalProperties": { - "displayName": "Collaborative Leadership", - "timeStamp": 1724328741549 - }, - "competencyThemeDescription": "", - "competencyThemeIdentifier": "kcmfinal_fw_theme_b88dbaf8-99f8-45da-a4a7-5e23f9e1c001", - "competencyThemeName": "Collaborative Leadership", - "competencyThemeRefId": "COMTHEME-000011", - "competencyThemeType": "theme" - }, { "competencyAreaDescription": "Behavioural competencies describe the key values and strengths that help an official perform effectively in a range of roles.", "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_5ed3587a-2a9b-4e3c-8852-8ffcff5c70b2", @@ -135,129 +79,11 @@ export class EventCompetenciesComponent { "competencyThemeName": "Operational Excellence", "competencyThemeRefId": "COMTHEME-000008", "competencyThemeType": "theme" - }, - { - "competencyAreaDescription": "Domain competencies are defined for a specific domain (for example, the Ministry of Personnel or Department of Biotechnology) but that does not mean others will not need them.", - "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_c527d0c7-ab6a-40d8-a06b-298fedc32b6c", - "competencyAreaName": "Domain", - "competencyAreaRefId": "COMAREA-000002", - "competencySubThemeAdditionalProperties": { - "displayName": "Adherence to Vigilance Guidelines", - "timeStamp": 1724329331026 - }, - "competencySubThemeDescription": "Adherence to Vigilance Guidelines Competency Sub-Theme", - "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_7d0f9ba8-275a-453f-a5ca-e6eba616ace5", - "competencySubThemeName": "Adherence to Vigilance Guidelines", - "competencySubThemeRefId": "COMSUBTHEME-000044", - "competencyThemeAdditionalProperties": { - "displayName": "Adherence to Vigilance Guidelines", - "timeStamp": 1724329319692 - }, - "competencyThemeDescription": "Adherence to Vigilance Guidelines competency Theme", - "competencyThemeIdentifier": "kcmfinal_fw_theme_b3d2e633-5959-4d1e-9d7f-bba42865ca68", - "competencyThemeName": "Adherence to Vigilance Guidelines", - "competencyThemeRefId": "COMTHEME-000016", - "competencyThemeType": "theme" - }, - { - "competencyAreaDescription": "Functional competencies are common among many domains, cutting across MDOs, as well as roles and activities.", - "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_af8caa53-7f84-499e-86b2-e32e5b59908e", - "competencyAreaName": "Functional", - "competencyAreaRefId": "COMAREA-000003", - "competencySubThemeAdditionalProperties": { - "displayName": "Preventive Vigilance", - "timeStamp": 1724767755390 - }, - "competencySubThemeDescription": "Preventive Vigilance Competency Sub-Theme", - "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_2ce23e33-3121-4a46-a07b-2adbdaffc579", - "competencySubThemeName": "Preventive Vigilance", - "competencySubThemeRefId": "COMSUBTHEME-000266", - "competencyThemeAdditionalProperties": { - "displayName": "Vigilance Administration", - "timeStamp": 1724767709764 - }, - "competencyThemeDescription": "Vigilance Administration competency Theme", - "competencyThemeIdentifier": "kcmfinal_fw_theme_f2717261-6319-4f5c-b05a-8767fa4c3f51", - "competencyThemeName": "Vigilance Administration", - "competencyThemeRefId": "COMTHEME-000201", - "competencyThemeType": "theme" - }, - { - "competencyAreaDescription": "Functional competencies are common among many domains, cutting across MDOs, as well as roles and activities.", - "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_af8caa53-7f84-499e-86b2-e32e5b59908e", - "competencyAreaName": "Functional", - "competencyAreaRefId": "COMAREA-000003", - "competencySubThemeAdditionalProperties": { - "displayName": "Inventory Management", - "timeStamp": 1724767037164 - }, - "competencySubThemeDescription": "Inventory Management Competency Sub-Theme", - "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_6ba1543e-891f-46ec-b09b-974156f54cc1", - "competencySubThemeName": "Inventory Management", - "competencySubThemeRefId": "COMSUBTHEME-000234", - "competencyThemeAdditionalProperties": { - "displayName": "Material Management", - "timeStamp": 1724767010422 - }, - "competencyThemeDescription": "Material Management competency Theme", - "competencyThemeIdentifier": "kcmfinal_fw_theme_b8e6271f-f225-4593-978b-4f1a822c7485", - "competencyThemeName": "Material Management", - "competencyThemeRefId": "COMTHEME-000193", - "competencyThemeType": "theme" - }, - { - "competencyAreaDescription": "Domain competencies are defined for a specific domain (for example, the Ministry of Personnel or Department of Biotechnology) but that does not mean others will not need them.", - "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_c527d0c7-ab6a-40d8-a06b-298fedc32b6c", - "competencyAreaName": "Domain", - "competencyAreaRefId": "COMAREA-000002", - "competencySubThemeAdditionalProperties": { - "displayName": "Human Resource Systems Management", - "timeStamp": 1724687263661 - }, - "competencySubThemeDescription": "Human Resource Systems Management Competency Sub-Theme", - "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_a445103c-94e6-4c21-8050-08b668f19e7c", - "competencySubThemeName": "Human Resource Systems Management", - "competencySubThemeRefId": "COMSUBTHEME-000116", - "competencyThemeAdditionalProperties": { - "displayName": "Human Resource Systems Management", - "timeStamp": 1724648584675 - }, - "competencyThemeDescription": "Human Resource Systems Management competency Theme", - "competencyThemeIdentifier": "kcmfinal_fw_theme_02855add-e2bf-4348-8c5f-a00492461620", - "competencyThemeName": "Human Resource Systems Management", - "competencyThemeRefId": "COMTHEME-000088", - "competencyThemeType": "theme" - }, - { - "competencyAreaDescription": "Functional competencies are common among many domains, cutting across MDOs, as well as roles and activities.", - "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_af8caa53-7f84-499e-86b2-e32e5b59908e", - "competencyAreaName": "Functional", - "competencyAreaRefId": "COMAREA-000003", - "competencySubThemeAdditionalProperties": { - "displayName": "Handling Miscellaneous Matters (Car, Residence, Personal Staff etc.)", - "timeStamp": 1724675861316 - }, - "competencySubThemeDescription": "Handling Miscellaneous Matters (Car, Residence, Personal Staff etc.) Competency Sub-Theme", - "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_0632be81-392a-45f8-a93b-b1649e29fb5e", - "competencySubThemeName": "Handling Miscellaneous Matters (Car, Residence, Personal Staff etc.)", - "competencySubThemeRefId": "COMSUBTHEME-000278", - "competencyThemeAdditionalProperties": { - "displayName": "Administration Matters", - "timeStamp": 1724675757333 - }, - "competencyThemeDescription": "Administration Matters competency Theme", - "competencyThemeIdentifier": "kcmfinal_fw_theme_92909bf6-2cea-47ea-b426-dc31803f2177", - "competencyThemeName": "Administration Matters", - "competencyThemeRefId": "COMTHEME-000205", - "competencyThemeType": "theme" } ] this.competencies = this.eventsService.convertToTreeView(_competencies) - console.log("competenciesObject ", this.competencies) } - - hideAnfShow(row: any) { if (row.collapsed) { row.collapsed = false @@ -268,7 +94,7 @@ export class EventCompetenciesComponent { removeNode(_competency: any) { this.competencies = this.competencies.filter((competency: any) => _competency.competencyAreaName !== competency.competencyAreaName) - this.openSnackBar('Competency area is remove successfully.') + this.openSnackBar('Competency area is removed successfully.') } removeTheme(_competency: any, _theme: any) { @@ -282,7 +108,7 @@ export class EventCompetenciesComponent { return { ...competency } } }) - this.openSnackBar('Competency theme is remove successfully.') + this.openSnackBar('Competency theme is removee successfully.') } removeSubTheme(_competency: any, _theme: any, _subTheme: any) { @@ -305,21 +131,22 @@ export class EventCompetenciesComponent { return { ...competency } } }) - this.openSnackBar('Competency sub theme is remove successfully.') + this.openSnackBar('Competency sub theme is removed successfully.') } - showSearch() { + showAddCompetencyDialog() { const dialogRef = this.dialog.open(AddCompetencyComponent, { panelClass: 'dialog_sidenav', width: '800px', disableClose: true, + data: this.competencies }) dialogRef.afterClosed().subscribe((result: any) => { if (result) { - console.log(result) + this.competencies = this.eventsService.convertToTreeView(result) } }) } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.html index e4f3bd2bc..6d623fbfb 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.html @@ -20,58 +20,48 @@

Themes
-
+
- +
{{themesShowMore ? 'See Less' : 'See More'}}
- - - -
-
Add Sub Themes
- -
-
{{selectedTheme.name}}
- -
- + +
+
Add Sub Themes
+ +
{{selectedTheme.name}}
+
+ +
+ +
+
-
-
+
- -
diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.scss index 1d178329d..ba3272d26 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.scss @@ -8,9 +8,9 @@ padding-bottom: 0 !important; } .add-competency-header { - font-family: Montserrat; - font-size: 16px; - font-weight: 600; + /* stylelint-enable */ + font: 600 16px Montserrat; + /* stylelint-disable */ line-height: 19.5px; text-align: left; text-underline-position: from-font; @@ -19,9 +19,9 @@ } .themes-header { - font-family: Montserrat; - font-size: 14px; - font-weight: 600; + /* stylelint-enable */ + font: 600 14px Montserrat; + /* stylelint-disable */ line-height: 17.07px; text-align: left; text-underline-position: from-font; @@ -34,6 +34,12 @@ gap: 8px; } +.disableChip { + background-color: #d6d6d6; + cursor: default !important; + pointer-events: none; +} + .chip-themes { display: flex; align-items: center; @@ -41,9 +47,9 @@ padding: 8px 16px; border: 1px solid #ccc; border-radius: 16px; - font-family: Lato; - font-size: 12px; - font-weight: 400; + /* stylelint-enable */ + font: 400 12px Lato; + /* stylelint-disable */ line-height: 14.4px; text-align: left; text-underline-position: from-font; @@ -74,4 +80,35 @@ .content-section { height: calc(100vh - 190px); overflow: auto; +} + +.cancel-btn { + border: 1px solid #1B4CA1; + border-radius: 17px; + height: 32px; + width: 74px; + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ + color: #1B4CA1 !important; +} + +.disableAdd { + background-color: #999999 !important; + cursor: unset; + pointer-events: none; +} + +.enable-btn { + background-color: #1B4CA1 !important; +} + +.add-btn { + height: 32px; + width: 60px; + border-radius: 17px; + color: #FFFFFF !important; + /* stylelint-enable */ + font: 700 14px Lato; + /* stylelint-disable */ } \ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.ts index 49d1eebff..10e958ecf 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.ts @@ -14,16 +14,13 @@ import * as _ from 'lodash' export class AddCompetencyComponent implements OnInit { searchControl!: FormControl themesShowMore = false - // subThemesShowMore = false filteredThemes: any[] = [] - // filteredSubThemes: any[] = [] limitToShow = 4 comptencyAreasList: any[] = [] validThemesList: any[] = [] - // validSubThemesList: any[] = [] selectedThemesList: any[] = [] - // selectedSubThemesList: any[] = [] + preSelectedThemesCount = 0 constructor( private dialogRef: MatLegacyDialogRef, @Inject(MAT_LEGACY_DIALOG_DATA) private competencies: any[], @@ -36,7 +33,6 @@ export class AddCompetencyComponent implements OnInit { debounceTime(500) ).subscribe(() => { this.setFilteredThemes() - // this.setFilteredSubThemes() }) this.getFrameWorkDetails() @@ -63,21 +59,41 @@ export class AddCompetencyComponent implements OnInit { if (!themes || !themes.terms) return - let filteredThemes = themes.terms + let notSelectedThemes: any[] = [] + let sortedThemes: any = [] + + themes.terms .filter((theme: any) => theme.associations && theme.associations.length > 0) .map((theme: any) => { const filteredAssociations = this.filterDuplicates(theme.associations, 'identifier') theme['selectedSubThemes'] = [] - if (this.competencies && this.competencies.find((competency) => competency.competencyThemeIdentifier === theme.identifier)) { - theme['selected'] = true - this.selectedThemesList.push(theme) - filteredAssociations.forEach((subtheme: any) => { - if (this.competencies && this.competencies.find((competency) => competency.competencySubThemeIdentifier === subtheme.identifier)) { - subtheme['selected'] = true - theme['selectedSubThemes'].push(subtheme) + if (this.competencies) { + this.competencies.forEach((competencyArea: any) => { + if (competencyArea.themes) { + const selctedTheme = competencyArea.themes.find((_selctedThem: any) => _selctedThem.competencyThemeIdentifier === theme.identifier) + if (selctedTheme) { + theme['selected'] = true + theme['preSelected'] = true + const sortedAssociations: any[] = [] + filteredAssociations.forEach((subtheme: any) => { + if (selctedTheme.subThems && selctedTheme.subThems.find((selectedSubTheme: any) => selectedSubTheme.competencySubThemeIdentifier === subtheme.identifier)) { + subtheme['selected'] = true + subtheme['preSelected'] = true + theme['selectedSubThemes'].push(subtheme) + sortedAssociations.unshift(subtheme) + } else { + sortedAssociations.push(subtheme) + } + }) + theme['associations'] = sortedAssociations + this.selectedThemesList.push(theme) + } } }) } + if (theme['selected'] !== true) { + notSelectedThemes.push(theme) + } return { ...theme, @@ -85,40 +101,36 @@ export class AddCompetencyComponent implements OnInit { } }) - const competencyRefIdMap = new Map() - this.comptencyAreasList.forEach((competency: any) => { - competency.associations.forEach((competencyThemes: any) => { - competencyRefIdMap.set(competencyThemes.refId, competencyThemes) - }) - }) - filteredThemes.forEach((theme: any) => { - theme.associations.forEach((subtheme: any) => { - const competencyThemes = competencyRefIdMap.get(subtheme.refId) - if (competencyThemes) { - subtheme.competencyRefId = competencyThemes.refId - } - }) + const competencyIndexMap: Map = new Map() + this.comptencyAreasList.forEach((competency, index) => { + if (competency['associations']) { + competency['associations'].forEach((association: any) => { + competencyIndexMap.set(association.identifier, index) + }) + } }) - this.validThemesList = filteredThemes - this.validSubThemesList = filteredThemes - .reduce((acc: any[], theme: any) => { - return [...acc, ...theme.associations] - }, []) - .filter((subtheme: any, index: number, self: any[]) => { - return self.findIndex(s => s.identifier === subtheme.identifier) === index - }) + this.preSelectedThemesCount = this.selectedThemesList.length + + sortedThemes = [...this.selectedThemesList, ...notSelectedThemes] + + sortedThemes.forEach((theme: any) => { + const competencyIndex = competencyIndexMap.get(theme.identifier) + if (competencyIndex !== undefined) { + theme['competency_index'] = competencyIndex + } + }) + this.validThemesList = sortedThemes } this.setFilteredThemes() - this.setFilteredSubThemes() } filterDuplicates(items: any[], key: string) { const seen = new Set() return items.filter((item) => { if (seen.has(item[key])) { - return false // Duplicate found + return false } seen.add(item[key]) return true @@ -130,70 +142,98 @@ export class AddCompetencyComponent implements OnInit { if (this.validThemesList) { let filteredList = this.validThemesList.filter((theme: any) => theme.name.toLowerCase().includes(searchKey)) if (!this.themesShowMore) { - this.filteredThemes = filteredList ? filteredList.slice(0, this.limitToShow) : [] + const limitToSlice = this.preSelectedThemesCount + this.limitToShow + this.filteredThemes = filteredList ? filteredList.slice(0, limitToSlice) : [] } else { this.filteredThemes = filteredList } } } - setFilteredSubThemes() { - const searchKey = this.searchControl.value.toLowerCase() || '' - if (this.validSubThemesList) { - let filteredList = this.validSubThemesList.filter((theme: any) => theme.name.toLowerCase().includes(searchKey)) - if (!this.subThemesShowMore) { - this.filteredSubThemes = filteredList ? filteredList.slice(0, this.limitToShow) : [] - } else { - this.filteredSubThemes = filteredList - } - } - } - toggleThemes() { this.themesShowMore = !this.themesShowMore this.setFilteredThemes() } - toggleSubThemes() { - this.subThemesShowMore = !this.subThemesShowMore - this.setFilteredSubThemes() - } - selectTheme(index: number) { const currentTheme = this.filteredThemes[index] if (currentTheme) { const checked = currentTheme['selected'] !== true ? true : false currentTheme['selected'] = checked if (checked) { - this.selectedThemesList.push(currentTheme) + this.selectedThemesList.unshift(currentTheme) } else { this.selectedThemesList = this.selectedThemesList.filter((selectedTheme) => selectedTheme.identifier !== currentTheme.identifier) - const selectedSubThemes: any = [] - this.selectedSubThemesList.forEach((selectedSubTheme) => { - if (selectedSubTheme.themeIdentifier === currentTheme.identifier) { - selectedSubTheme['selected'] = false - } else { - selectedSubThemes.push(selectedSubTheme) - } - }) - this.selectedSubThemesList = selectedSubThemes + if (currentTheme.selectedSubThemes) { + currentTheme.selectedSubThemes.forEach((subThem: any) => { + subThem['selected'] = false // as it contains reference from root object false will be added to root object + }) + } + currentTheme.selectedSubThemes = [] } } } - selectSubTheme(index: number) { - const currentSubTheme = this.filteredSubThemes[index] + selectSubTheme(currentSubTheme: any, theme: any) { if (currentSubTheme) { const checked = currentSubTheme['selected'] !== true ? true : false currentSubTheme['selected'] = checked if (checked) { - this.selectedSubThemesList.push(currentSubTheme) + theme.selectedSubThemes.push(currentSubTheme) } else { - this.selectedSubThemesList = this.selectedSubThemesList.filter((selectedSubTheme) => selectedSubTheme.identifier !== currentSubTheme.identifier) + theme.selectedSubThemes = theme.selectedSubThemes.filter((selectedSubTheme: any) => selectedSubTheme.identifier !== currentSubTheme.identifier) } } } + get canAddCompetencies(): boolean { + if (!this.selectedThemesList || ( + this.selectedThemesList && + !this.selectedThemesList.find((selectedThem: any) => (selectedThem.selectedSubThemes && selectedThem.selectedSubThemes.length > 0)))) { + return false + } + return true + } + + saveCompetencies() { + const competencies = this.generateCompetencies() + this.dialogRef.close(competencies) + } + + generateCompetencies(): any[] { + let competenciesList: any[] = [] + if (this.selectedThemesList && this.comptencyAreasList) { + this.selectedThemesList.forEach((selctedThem: any) => { + const competencyAreaDetails = this.comptencyAreasList[selctedThem.competency_index] + if (selctedThem.selectedSubThemes && competencyAreaDetails) { + selctedThem.selectedSubThemes.forEach((subThem: any) => { + const competencyDetails = { + competencyAreaDescription: competencyAreaDetails.description, + competencyAreaIdentifier: competencyAreaDetails.identifier, + competencyAreaName: competencyAreaDetails.name, + competencyAreaRefId: competencyAreaDetails.refId, + + competencyThemeDescription: selctedThem.description, + competencyThemeIdentifier: selctedThem.identifier, + competencyThemeName: selctedThem.name, + competencyThemeRefId: selctedThem.refId, + competencyThemeType: 'Theme', + competencyThemeAdditionalProperties: selctedThem.additionalProperties, + + competencySubThemeDescription: subThem.description, + competencySubThemeIdentifier: subThem.identifier, + competencySubThemeName: subThem.name, + competencySubThemeRefId: subThem.refId, + competencySubThemeAdditionalProperties: subThem.additionalProperties + } + competenciesList.push(competencyDetails) + }) + } + }) + } + return competenciesList + } + closeDialog() { this.dialogRef.close() } From d42b61be26ca80af6740f9c506d8f73ef6af4bec Mon Sep 17 00:00:00 2001 From: mansurskTarento Date: Thu, 13 Feb 2025 20:31:01 +0530 Subject: [PATCH 13/14] wip create events ui --- .../card-competency.component.html | 28 +++ .../card-competency.component.scss | 79 ++++++ .../card-competency.component.spec.ts | 21 ++ .../card-competency.component.ts | 46 ++++ .../create-event/create-event.component.html | 28 ++- .../create-event/create-event.component.scss | 39 +-- .../create-event/create-event.component.ts | 102 +++++++- .../event-basic-details.component.html | 37 ++- .../event-basic-details.component.scss | 57 ++++- .../event-basic-details.component.ts | 120 ++++++++- .../event-competencies.component.html | 2 +- .../event-competencies.component.ts | 113 +++++---- .../event-materials.component.scss | 12 +- .../event-materials.component.ts | 6 +- .../events-list/events-list.component.ts | 12 +- .../events-preview.component.html | 178 ++++++++++++++ .../events-preview.component.scss | 229 ++++++++++++++++++ .../events-preview.component.spec.ts | 21 ++ .../events-preview.component.ts | 225 +++++++++++++++++ .../events-table/events-table.component.scss | 44 ++-- .../components/events/events.component.ts | 7 +- .../material-details.component.html | 8 +- .../material-details.component.scss | 20 +- .../material-details.component.ts | 10 +- .../speakers/speakers.component.scss | 12 +- .../components/speakers/speakers.component.ts | 21 +- .../add-competency.component.scss | 20 +- .../add-competency.component.ts | 2 +- .../add-speakers/add-speakers.component.html | 23 +- .../add-speakers/add-speakers.component.scss | 52 +++- .../add-speakers/add-speakers.component.ts | 72 +++++- .../basic-info/basic-info.component.scss | 16 +- .../basic-info/basic-info.component.ts | 10 +- .../youtube-player.component.html | 1 + .../youtube-player.component.scss | 0 .../youtube-player.component.spec.ts | 21 ++ .../youtube-player.component.ts | 229 ++++++++++++++++++ .../home/routes/events-2/events-2.module.ts | 23 +- .../routes/events-2/models/events.model.ts | 4 +- .../events-2/services/events.service.ts | 20 +- 40 files changed, 1750 insertions(+), 220 deletions(-) create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/card-competency/card-competency.component.html create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/card-competency/card-competency.component.scss create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/card-competency/card-competency.component.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/card-competency/card-competency.component.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/events-preview/events-preview.component.html create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/events-preview/events-preview.component.scss create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/events-preview/events-preview.component.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/components/events-preview/events-preview.component.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/dialogs/youtube-player/youtube-player.component.html create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/dialogs/youtube-player/youtube-player.component.scss create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/dialogs/youtube-player/youtube-player.component.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/dialogs/youtube-player/youtube-player.component.ts diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/card-competency/card-competency.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/card-competency/card-competency.component.html new file mode 100644 index 000000000..6114c5698 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/card-competency/card-competency.component.html @@ -0,0 +1,28 @@ +
+
+
+
+
{{ widgetData?.content?.key }} +
+
+ +
+ {{ subTheme }} +
+ +
+ View more +
+
+ View less +
+
+
+
+
+
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/card-competency/card-competency.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/card-competency/card-competency.component.scss new file mode 100644 index 000000000..ec24815e7 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/card-competency/card-competency.component.scss @@ -0,0 +1,79 @@ +.behavioural { + background-color: #F8B861; +} + +.functional { + background-color: #E24577; +} + +.domain { + background-color: #7B47A4; +} + +.competency-passbook-theme { + width: 100%; + max-width: 344px; + min-width: 320px; + height: 92px; + border-top-right-radius: 8px; + border-bottom-right-radius: 12px; + border-bottom-left-radius: 12px; + border-top-left-radius: 8px; +} + +.ellipsis { + white-space: nowrap; + width: 280px; + overflow: hidden; + text-overflow: ellipsis; +} + +.detail { + width: 100%; + max-width: 344px; + background-color: rgb(255, 255, 255); + border-radius: 8px; + position: relative; + top: 4px; + height: inherit; + border: 1px solid rgba(0, 0, 0, 0.08); + + &>div { + padding: 12px 16px 16px 16px; + } + + .chip-container { + .chip { + border: 1px solid #1B4CA1; + color: #1B4CA1; + line-height: 14px; + padding: 4px 8px; + white-space: normal; + } + } +} + +.chip-ellipsis { + white-space: nowrap !important; + max-width: 100px; + overflow: hidden; + text-overflow: ellipsis; +} + +.expanded { + padding-bottom: 12px; + + .competency-passbook-theme { + max-width: 372px; + width: 100%; + min-height: 92px; + height: auto; + + .detail { + width: 100%; + max-width: inherit; + min-height: inherit; + height: inherit; + } + } +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/card-competency/card-competency.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/card-competency/card-competency.component.spec.ts new file mode 100644 index 000000000..077c644eb --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/card-competency/card-competency.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { CardCompetencyComponent } from './card-competency.component'; + +describe('CardCompetencyComponent', () => { + let component: CardCompetencyComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [CardCompetencyComponent] + }); + fixture = TestBed.createComponent(CardCompetencyComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/card-competency/card-competency.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/card-competency/card-competency.component.ts new file mode 100644 index 000000000..e1b42a04c --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/card-competency/card-competency.component.ts @@ -0,0 +1,46 @@ +import { Component, OnInit, Input } from '@angular/core' +import { trigger, state, style, animate, transition } from '@angular/animations' +// import { NsWidgetResolver, WidgetBaseComponent } from '@sunbird-cb/resolver' +// import { NsCardContent } from '@sunbird-cb/utils/lib/services/card-content.model' +// import { NsCardContent } from '../card-content-v2/card-content-v2.model' +// import { NsWidgetResolver, WidgetBaseComponent } from '@ws-widget/resolver' + +@Component({ + selector: 'ws-widget-card-competency', + templateUrl: './card-competency.component.html', + styleUrls: ['./card-competency.component.scss'], + animations: [ + trigger('expandCollapse', [ + state('collapsed', style({ + height: '104px', + width: '320px', + })), + state('expanded', style({ + minHeight: '120px', + width: '372px', + height: 'auto', + })), + transition('collapsed <=> expanded', [ + animate('0.5s'), + ]), + ]), + ], +}) + +export class CardCompetencyComponent implements OnInit { + + @Input() widgetData!: any + @Input() competencyArea = '' + isExpanded = false + + constructor() { + // super() + } + + ngOnInit() { + } + + handleToggleSize(_viewMore: any): void { + this.isExpanded = !this.isExpanded + } +} \ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.html index 2ee3e521e..2eaafdc09 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.html @@ -11,21 +11,31 @@ - + + + + + + + + +
- + Basic Details - + Add Speaker - + @@ -35,7 +45,13 @@ Add Competency - + + + + + +

\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.scss index 7771cba12..7f5687587 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.scss @@ -9,9 +9,9 @@ } .event-text { - /* stylelint-enable */ - font: 400 14px Lato; /* stylelint-disable */ + font: 400 14px Lato; + /* stylelint-enable */ } .chevron-arrow { @@ -19,9 +19,9 @@ } .event-builder-text { - /* stylelint-enable */ - font: 700 14px Lato; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ color: #1B4CA1; } @@ -31,9 +31,9 @@ border-radius: 17px; border: 1px solid #1B4CA1; color: #1B4CA1 !important; - /* stylelint-enable */ - font: 700 14px Lato; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ } .next-btn { @@ -42,32 +42,43 @@ border-radius: 17px; background-color: #1B4CA1 !important; color: #FFFFFF !important; - /* stylelint-enable */ + /* stylelint-disable */ font: 700 14px Lato; + /* stylelint-enable */ + } + + .publish-btn { + height: 32px; + border-radius: 17px; + background-color: #1B4CA1 !important; + color: #FFFFFF !important; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ + padding: 0px 10px; } } :host ::ng-deep .events { + .mat-stepper-label-position-bottom .mat-horizontal-stepper-header-container { + width: calc(100% - 400px); + min-width: 800px; + align-self: center; + } .mat-step-icon { width: 25px; height: 25px; border-radius: 12.5px; color: #FFFFFF; - // background-color: #96ADD4!important; - /* stylelint-enable */ - font: 700 14px Lato; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ } .mat-step-icon-selected { background-color: #F3962F!important; } - // .mat-step-icon-active { - // background-color: #F3962F!important; /* Active color */ - // } - // .mat-step-icon-completed { // background-color: #1D8923!important; // } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts index fa5ae8545..a9ef03013 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts @@ -8,6 +8,7 @@ import { StepperSelectionEvent } from '@angular/cdk/stepper' import { MatStepper } from '@angular/material/stepper' import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar' import { HttpErrorResponse } from '@angular/common/http' +import { DatePipe } from '@angular/common' @Component({ selector: 'ws-app-create-event', @@ -20,13 +21,16 @@ export class CreateEventComponent implements OnInit, AfterViewInit { eventId = '' eventIconUrl = '' eventDetails: any + updatedEventDetails: any eventDetailsForm!: FormGroup speakersList: speaker[] = [] materialsList: material[] = [] - competencies: any - currentStepperIndex = 3 + competencies: any = [] + currentStepperIndex = 0 openMode = 'edit' pathUrl = '' + userProfile: any + showPreview = false //#endregion constructor( @@ -35,6 +39,7 @@ export class CreateEventComponent implements OnInit, AfterViewInit { private formBuilder: FormBuilder, private router: Router, private matSnackBar: MatSnackBar, + private datePipe: DatePipe ) { } //#region (onInit) @@ -43,7 +48,6 @@ export class CreateEventComponent implements OnInit, AfterViewInit { this.getEventDetailsFromResolver() } - initializeFormAndParams() { this.eventDetailsForm = this.formBuilder.group({ eventName: new FormControl('', [Validators.required]), @@ -53,11 +57,14 @@ export class CreateEventComponent implements OnInit, AfterViewInit { startDate: new FormControl('', [Validators.required]), startTime: new FormControl('', [Validators.required]), endTime: new FormControl('', [Validators.required]), - resourceUrl: new FormControl('') + resourceUrl: new FormControl(''), + // uploadUrl: new FormControl(''), + appIcon: new FormControl('', [Validators.required]), }) } getEventDetailsFromResolver() { + this.userProfile = _.get(this.activatedRoute, 'snapshot.data.configService.userProfile') if (_.get(this.activatedRoute, 'snapshot.data.eventDetails')) { this.eventDetails = _.get(this.activatedRoute, 'snapshot.data.eventDetails.data') this.patchEventDetails() @@ -73,21 +80,24 @@ export class CreateEventComponent implements OnInit, AfterViewInit { patchEventDetails() { this.eventId = _.get(this.eventDetails, 'identifier') + const startDate = _.get(this.eventDetails, 'startDate', '') const eventBaseDetails = { eventName: _.get(this.eventDetails, 'name', ''), description: _.get(this.eventDetails, 'description', ''), eventCategory: _.get(this.eventDetails, 'resourceType', ''), streamType: _.get(this.eventDetails, 'streamType', ''),//new key to add - startDate: new Date(_.get(this.eventDetails, 'startDate', '')), + startDate: startDate ? new Date(startDate) : startDate, startTime: _.get(this.eventDetails, 'startTime', ''), endTime: _.get(this.eventDetails, 'endTime', ''), - resourceUrl: _.get(this.eventDetails, 'resourceUrl', '') + resourceUrl: _.get(this.eventDetails, 'resourceUrl', ''), + appIcon: _.get(this.eventDetails, 'appIcon', '') } this.eventDetailsForm.setValue(eventBaseDetails) this.eventDetailsForm.updateValueAndValidity() this.speakersList = _.get(this.eventDetails, 'speakers', []) this.materialsList = _.get(this.eventDetails, 'eventHandouts', []) + this.competencies = _.get(this.eventDetails, 'competencies_v6', []) } ngAfterViewInit() { @@ -100,6 +110,7 @@ export class CreateEventComponent implements OnInit, AfterViewInit { //#region (ui interactions) onSelectionChange(event: StepperSelectionEvent) { this.currentStepperIndex = event.selectedIndex + this.showPreview = false } navigateBack() { @@ -112,6 +123,16 @@ export class CreateEventComponent implements OnInit, AfterViewInit { } } + preview() { + this.showPreview = true + this.updatedEventDetails = this.getFormBodyOfEvent() + } + + publish() { + this.eventDetails['status'] = 'SentToPublish' + this.saveAndExit() + } + get canMoveToNext() { let currentFormIsValid = false if (this.currentStepperIndex === 0) { @@ -130,6 +151,26 @@ export class CreateEventComponent implements OnInit, AfterViewInit { return currentFormIsValid } + get showPublish(): boolean { + if (this.currentStepperIndex === 3) { + if (this.eventDetailsForm.invalid) { + return false + } + if (!(this.speakersList && this.speakersList.length)) { + return false + } + if (!(this.materialsList && this.materialsList.length)) { + return false + } + return true + } + return false + } + + addCompetencies(competencies: any) { + this.competencies = competencies + } + saveAndExit(navigateBack = true) { const formBody = { request: { @@ -154,16 +195,24 @@ export class CreateEventComponent implements OnInit, AfterViewInit { getFormBodyOfEvent() { const eventDetails: any = JSON.parse(JSON.stringify(this.eventDetails)) - const eventBaseDetails = this.eventDetailsForm.value + let startTime = '' + if (eventBaseDetails.startTime) { + startTime = this.getFormatedTime(eventBaseDetails.startTime) + } + let endTime = '' + if (eventBaseDetails.endTime) { + endTime = this.getFormatedTime(eventBaseDetails.endTime) + } eventDetails['name'] = eventBaseDetails.eventName eventDetails['description'] = eventBaseDetails.description eventDetails['resourceType'] = eventBaseDetails.eventCategory eventDetails['streamType'] = eventBaseDetails.streamType - eventDetails['startDate'] = eventBaseDetails.startDate - eventDetails['startTime'] = eventBaseDetails.startTime - eventDetails['endTime'] = eventBaseDetails.endTime + eventDetails['startDate'] = eventBaseDetails.startDate ? this.datePipe.transform(eventBaseDetails.startDate, 'yyyy-MM-dd') : '' + eventDetails['startTime'] = startTime + eventDetails['endTime'] = endTime eventDetails['resourceUrl'] = eventBaseDetails.resourceUrl + eventDetails['appIcon'] = eventBaseDetails.appIcon if (this.speakersList) { eventDetails['speakers'] = this.speakersList @@ -171,10 +220,43 @@ export class CreateEventComponent implements OnInit, AfterViewInit { if (this.materialsList) { eventDetails['eventHandouts'] = this.materialsList } + if (this.competencies) { + eventDetails['competencies_v6'] = this.competencies + } return eventDetails } + getFormatedTime(selectedTime: string): string { + const timeString = selectedTime.trim() + const timeParts = timeString.split(' ') + + const time = timeParts[0] + const amPm = timeParts[1] + + const [hours, minutes] = time.split(':').map(num => parseInt(num)) + + let hours24 = hours + if (amPm === 'PM' && hours !== 12) { + hours24 += 12 + } else if (amPm === 'AM' && hours === 12) { + hours24 = 0 + } + + const timeFormatted = this.formatTime(hours24, minutes) + const fixedTimezone = '+05:30' + + + return `${timeFormatted}${fixedTimezone}` + } + + formatTime(hours: number, minutes: number): string { + const hoursFormatted = hours.toString().padStart(2, '0') + const minutesFormatted = minutes.toString().padStart(2, '0') + const seconds = '00' + return `${hoursFormatted}:${minutesFormatted}:${seconds}` + } + //#endregion private openSnackBar(message: string) { diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html index cc5aa0db3..4cf824acc 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html @@ -4,6 +4,29 @@ Basic Details
+ +
+
+ app icon + {{appIconName}} +
+ close +
+ + +
+ +
+ icon + Upload Images * + Supported file types: PNG, JPG + Max Size - 400MB +
+
+ +
Event Name @@ -92,11 +115,9 @@ Start Time
- - + + + start time is mandatory @@ -107,9 +128,11 @@ End Time
- + + + - end time is mandatory + start time is mandatory
diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.scss index d3c06debe..95ae1cc12 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.scss @@ -4,23 +4,70 @@ .event-header { color: #1B4CA1; - /* stylelint-enable */ + /* stylelint-disable */ font: 600 14px Montserrat; + /* stylelint-enable */ + } +} + +.appIconCard { + background-color: #1B4CA114; + height: 40px; + border-radius: 3px; + + .iconName { + color: #1B4CA1; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ + border-bottom: 1px solid #1B4CA1; + } + + .remove-app-icon { + color: #00000099 !important; + font-size: 17px; + height: 17px; + cursor: pointer; + pointer-events: all; + } +} + +.dashed-border { + border: 2px dashed #1B4CA1; + +} + +.upload { + background: linear-gradient(0deg, #EDF7FF 0%, #EDF7FF 100%), #FFF; + height: 125px; + width: 460px; + overflow: hidden; + position: relative; + border-radius: 12px; + + + span:first-child { + color: #1B4CA1; + } + + span:last-child { + line-height: 14.4px; + color: #666666; } } + .form-lable { - /* stylelint-enable */ - font: 700 14px Lato; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ } .form-url-lable { color: #1B4CA1; - /* stylelint-enable */ - font: 600 14px Montserrat; /* stylelint-disable */ + font: 600 14px Montserrat; + /* stylelint-enable */ } .description-count { diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts index 62613f542..9d3e17b93 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts @@ -1,30 +1,136 @@ -import { Component, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core' +import { Component, Input, OnInit } from '@angular/core' import { FormGroup } from '@angular/forms' +import { MatLegacySnackBar } from '@angular/material/legacy-snack-bar' import * as _ from 'lodash' +import { events } from '../../models/events.model' +import { EventsService } from '../../services/events.service' +import { map, mergeMap } from 'rxjs/operators' +import { environment } from '../../../../../../../../../../../src/environments/environment' +import { HttpErrorResponse } from '@angular/common/http' @Component({ selector: 'ws-app-event-basic-details', templateUrl: './event-basic-details.component.html', styleUrls: ['./event-basic-details.component.scss'] }) -export class EventBasicDetailsComponent implements OnInit, OnChanges { +export class EventBasicDetailsComponent implements OnInit { //#region (global variables) @Input() eventDetails!: FormGroup @Input() openMode = 'edit' + @Input() userProfile: any evntCategorysList = ['Webinar', 'Karmayogi Talks', 'Karmayogi Saptah'] todayDate = new Date() //#endregion - constructor() { } + constructor( + private matSnackBar: MatLegacySnackBar, + private eventSvc: EventsService + ) { } ngOnInit(): void { + } + + get appIconName(): string { + let name = '' + const appiconurl = _.get(this.eventDetails, 'value.appIcon', '') + if (appiconurl) { + const urlSplit = appiconurl.split('_') + if (urlSplit.length > 0) { + name = urlSplit[urlSplit.length - 1] + } + } + return name + } + + removeIcon() { + if (this.eventDetails.controls.appIcon) { + this.eventDetails.controls.appIcon.patchValue('') + this.eventDetails.controls.appIcon.updateValueAndValidity() + } + } + onFileSelected(files: any) { + let imagePath: any = '' + if (files.length === 0) { + return + } + const mimeType = files[0].type + if (mimeType.match(/image\/*/) == null) { + this.openSnackBar('Only JPG and PNG files are supported') + return + } + const reader = new FileReader() + imagePath = files[0] + if (imagePath && imagePath.size > events.IMAGE_MAX_SIZE) { + this.openSnackBar('Selected image size is more') + imagePath = '' + return + } + reader.readAsDataURL(files[0]) + this.saveImage(imagePath) + // reader.onload = _event => { + // this.imgURL = reader.result + // } } - ngOnChanges(changes: SimpleChanges): void { - if (changes) { } + saveImage(imagePath: any) { + if (imagePath) { + const org = [] + const createdforarray: any[] = [] + createdforarray.push(_.get(this.userProfile, 'rootOrgId', '')) + org.push(_.get(this.userProfile, 'departmentName', '')) + + const request = { + request: { + content: { + name: 'image asset', + creator: _.get(this.userProfile, 'userName', ''), + createdBy: _.get(this.userProfile, 'userId', ''), + code: 'image asset', + mimeType: imagePath.type, + mediaType: 'image', + contentType: 'Asset', + primaryCategory: 'Asset', + organisation: org, + createdFor: createdforarray, + }, + }, + } + this.eventSvc.createContent(request).pipe(mergeMap((res: any) => { + const contentID = _.get(res, 'result.identifier') + const formData: FormData = new FormData() + formData.append('data', imagePath) + if (contentID) { + return this.eventSvc.uploadContent(contentID, formData).pipe(map((fdata: any) => { + return _.get(fdata, 'result.artifactUrl', '') + })) + } else { + throw new Error('Something went wrong please try again') + } + })).subscribe({ + next: res => { + if (res) { + const createdUrl = res + const urlToReplace = 'https://storage.googleapis.com/igot'//https://portal.dev.karmayogibharat.net + let appIcon = createdUrl + if (createdUrl.startsWith(urlToReplace)) { + const urlSplice = createdUrl.slice(urlToReplace.length).split('/') + appIcon = `${environment.domainName}/assets/public/${urlSplice.slice(1).join('/')}` + } + if (this.eventDetails.controls.appIcon) { + this.eventDetails.controls.appIcon.patchValue(appIcon) + this.eventDetails.controls.appIcon.updateValueAndValidity() + } + } + }, + error: (error: HttpErrorResponse) => { + const errorMessage = _.get(error, 'error.message', 'Something went wrong please try again') + this.openSnackBar(errorMessage) + } + }) + } } showValidationMsg(controlName: string, validationType: string): Boolean { @@ -36,4 +142,8 @@ export class EventBasicDetailsComponent implements OnInit, OnChanges { return showMsg } + private openSnackBar(message: string) { + this.matSnackBar.open(message) + } + } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.html index 865d5dd8e..61c6813ad 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.html @@ -67,7 +67,7 @@
- +
No competency has been added yet
diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.ts index cea25a4ef..f7c1933d8 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-competencies/event-competencies.component.ts @@ -1,4 +1,4 @@ -import { Component, Input } from '@angular/core' +import { Component, EventEmitter, Input, OnChanges, Output, SimpleChanges } from '@angular/core' import { EventsService } from '../../services/events.service' import { MatLegacySnackBar } from '@angular/material/legacy-snack-bar' import { AddCompetencyComponent } from '../../dialogs/add-competency/add-competency.component' @@ -9,8 +9,10 @@ import { MatLegacyDialog } from '@angular/material/legacy-dialog' templateUrl: './event-competencies.component.html', styleUrls: ['./event-competencies.component.scss'] }) -export class EventCompetenciesComponent { +export class EventCompetenciesComponent implements OnChanges { @Input() openMode = 'edit' + @Input() competenciesList: any = [] + @Output() addCompetencies = new EventEmitter() competencies: any searchText: string = '' event: any @@ -21,6 +23,12 @@ export class EventCompetenciesComponent { private eventsService: EventsService, ) { } + ngOnChanges(changes: SimpleChanges): void { + if (changes && changes.competenciesList) { + this.competencies = this.eventsService.convertToTreeView(this.competenciesList) + } + } + ngOnInit(): void { // this.eventId = this.route.snapshot.paramMap.get('eventId') @@ -33,55 +41,55 @@ export class EventCompetenciesComponent { // } // } // }) - let _competencies: any = [ - { - "competencyAreaDescription": "Functional competencies are common among many domains, cutting across MDOs, as well as roles and activities.", - "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_af8caa53-7f84-499e-86b2-e32e5b59908e", - "competencyAreaName": "Functional", - "competencyAreaRefId": "COMAREA-000003", - "competencySubThemeAdditionalProperties": { - "displayName": "Handling Allowances & Reimbursement", - "timeStamp": 1724675891609 - }, - "competencySubThemeDescription": "Handling Allowances & Reimbursement Competency Sub-Theme", - "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_35bf9d51-7299-45a5-ad99-1f7c7db1e4ba", - "competencySubThemeName": "Handling Allowances & Reimbursement", - "competencySubThemeRefId": "COMSUBTHEME-000276", - "competencyThemeAdditionalProperties": { - "displayName": "Administration Matters", - "timeStamp": 1724675757333 - }, - "competencyThemeDescription": "Administration Matters competency Theme", - "competencyThemeIdentifier": "kcmfinal_fw_theme_92909bf6-2cea-47ea-b426-dc31803f2177", - "competencyThemeName": "Administration Matters", - "competencyThemeRefId": "COMTHEME-000205", - "competencyThemeType": "theme" - }, - { - "competencyAreaDescription": "Behavioural competencies describe the key values and strengths that help an official perform effectively in a range of roles.", - "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_5ed3587a-2a9b-4e3c-8852-8ffcff5c70b2", - "competencyAreaName": "Behavioural", - "competencyAreaRefId": "COMAREA-000001", - "competencySubThemeAdditionalProperties": { - "displayName": "Planning & Prioritization", - "timeStamp": 1724764179110 - }, - "competencySubThemeDescription": "Planning & Prioritization Competency Sub-Theme", - "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_81ded4ed-55dc-4bd1-a21e-6fc5840ce30e", - "competencySubThemeName": "Planning & Prioritization", - "competencySubThemeRefId": "COMSUBTHEME-000025", - "competencyThemeAdditionalProperties": { - "displayName": "Operational Excellence", - "timeStamp": 1724764141855 - }, - "competencyThemeDescription": "Operational Excellence competency Theme", - "competencyThemeIdentifier": "kcmfinal_fw_theme_49a613f9-b825-4e16-a74a-0d413cf6c4eb", - "competencyThemeName": "Operational Excellence", - "competencyThemeRefId": "COMTHEME-000008", - "competencyThemeType": "theme" - } - ] - this.competencies = this.eventsService.convertToTreeView(_competencies) + // let _competencies: any = [ + // { + // "competencyAreaDescription": "Functional competencies are common among many domains, cutting across MDOs, as well as roles and activities.", + // "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_af8caa53-7f84-499e-86b2-e32e5b59908e", + // "competencyAreaName": "Functional", + // "competencyAreaRefId": "COMAREA-000003", + // "competencySubThemeAdditionalProperties": { + // "displayName": "Handling Allowances & Reimbursement", + // "timeStamp": 1724675891609 + // }, + // "competencySubThemeDescription": "Handling Allowances & Reimbursement Competency Sub-Theme", + // "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_35bf9d51-7299-45a5-ad99-1f7c7db1e4ba", + // "competencySubThemeName": "Handling Allowances & Reimbursement", + // "competencySubThemeRefId": "COMSUBTHEME-000276", + // "competencyThemeAdditionalProperties": { + // "displayName": "Administration Matters", + // "timeStamp": 1724675757333 + // }, + // "competencyThemeDescription": "Administration Matters competency Theme", + // "competencyThemeIdentifier": "kcmfinal_fw_theme_92909bf6-2cea-47ea-b426-dc31803f2177", + // "competencyThemeName": "Administration Matters", + // "competencyThemeRefId": "COMTHEME-000205", + // "competencyThemeType": "theme" + // }, + // { + // "competencyAreaDescription": "Behavioural competencies describe the key values and strengths that help an official perform effectively in a range of roles.", + // "competencyAreaIdentifier": "kcmfinal_fw_competencyarea_5ed3587a-2a9b-4e3c-8852-8ffcff5c70b2", + // "competencyAreaName": "Behavioural", + // "competencyAreaRefId": "COMAREA-000001", + // "competencySubThemeAdditionalProperties": { + // "displayName": "Planning & Prioritization", + // "timeStamp": 1724764179110 + // }, + // "competencySubThemeDescription": "Planning & Prioritization Competency Sub-Theme", + // "competencySubThemeIdentifier": "kcmfinal_fw_subtheme_81ded4ed-55dc-4bd1-a21e-6fc5840ce30e", + // "competencySubThemeName": "Planning & Prioritization", + // "competencySubThemeRefId": "COMSUBTHEME-000025", + // "competencyThemeAdditionalProperties": { + // "displayName": "Operational Excellence", + // "timeStamp": 1724764141855 + // }, + // "competencyThemeDescription": "Operational Excellence competency Theme", + // "competencyThemeIdentifier": "kcmfinal_fw_theme_49a613f9-b825-4e16-a74a-0d413cf6c4eb", + // "competencyThemeName": "Operational Excellence", + // "competencyThemeRefId": "COMTHEME-000008", + // "competencyThemeType": "theme" + // } + // ] + // this.competencies = this.eventsService.convertToTreeView(_competencies) } hideAnfShow(row: any) { @@ -146,7 +154,10 @@ export class EventCompetenciesComponent { dialogRef.afterClosed().subscribe((result: any) => { if (result) { + // this.competenciesList = result this.competencies = this.eventsService.convertToTreeView(result) + this.addCompetencies.emit(result) + } }) } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.scss index 76a3982b6..5eab34b1c 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.scss @@ -4,9 +4,9 @@ .event-header { color: #1B4CA1; - /* stylelint-enable */ - font: 600 14px Montserrat; /* stylelint-disable */ + font: 600 14px Montserrat; + /* stylelint-enable */ } } @@ -35,16 +35,16 @@ } .add-file-text { - /* stylelint-enable */ - font: 700 14px Lato; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ width: 148px; } .add-file-type { - /* stylelint-enable */ - font: 400 10px Lato; /* stylelint-disable */ + font: 400 10px Lato; + /* stylelint-enable */ width: 148px; } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.ts index e3d83db13..619f57c4b 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-materials/event-materials.component.ts @@ -102,7 +102,7 @@ export class EventMaterialsComponent implements OnInit { let fileUrl = createdUrl if (createdUrl.startsWith(urlToReplace)) { const urlSplice = createdUrl.slice(urlToReplace.length).split('/') - fileUrl = `${environment.karmYogiPath}/assets/public/${urlSplice.slice(1).join('/')}` + fileUrl = `${environment.domainName}/assets/public/${urlSplice.slice(1).join('/')}` } this.addNewFileToList(fileUrl) } @@ -117,8 +117,8 @@ export class EventMaterialsComponent implements OnInit { addNewFileToList(fileUrl: string) { const fileDetails: material = { - fullName: '', - fileUrl: fileUrl + title: '', + content: fileUrl } this.materialsList.unshift(fileDetails) this.currentIndex = 0 diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.ts index e5345b354..0ec2bc16f 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.ts @@ -47,9 +47,9 @@ export class EventsListComponent implements OnInit, OnDestroy { { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, - { displayName: 'Published On', key: 'publishedOn', cellType: 'date' }, - { displayName: 'Enrollments', key: 'enrollments', cellType: 'number' }, - { displayName: 'Certificates', key: 'certificates', cellType: 'number' }, + { displayName: 'Published On', key: 'publishedOn', cellType: 'date' } + // { displayName: 'Enrollments', key: 'enrollments', cellType: 'number' }, + // { displayName: 'Certificates', key: 'certificates', cellType: 'number' }, ], showSearchBox: true, showPagination: true, @@ -131,9 +131,9 @@ export class EventsListComponent implements OnInit, OnDestroy { { displayName: 'Event Name', key: 'name', cellType: 'text', imageKey: 'appIcon', cellClass: 'text-overflow-elipse' }, { displayName: 'Start Date', key: 'startDate', cellType: 'date' }, { displayName: 'Created By', key: 'createdByName', cellType: 'text' }, - { displayName: 'Published On', key: 'publishedOn', cellType: 'date' }, - { displayName: 'Enrollments', key: 'enrollments', cellType: 'text' }, - { displayName: 'Certificates', key: 'certificates', cellType: 'text' }, + { displayName: 'Published On', key: 'publishedOn', cellType: 'date' } + // { displayName: 'Enrollments', key: 'enrollments', cellType: 'text' }, + // { displayName: 'Certificates', key: 'certificates', cellType: 'text' }, ], showSearchBox: true, showPagination: true, diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-preview/events-preview.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-preview/events-preview.component.html new file mode 100644 index 000000000..c317de4c7 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-preview/events-preview.component.html @@ -0,0 +1,178 @@ +
+
+
+
+ +
+
+ +
+
+
+ + + +
+
+
Description
+
{{event?.description}}
+
+
+
+ Competencies + info_outline +
+ +
+
+ +
{{ item.key }}
+ +
+ +
+ + + + + +
+ +
+ +
+
+ + + + + + +
+ + +
+
+
{{handout?.title}}
+
+ pdf + {{handout?.title}} +
+
+
+ + + + No material is added. + +
+ + + + + + + +
+ + +
+
+
{{speaker?.name}}
+
+ {{speaker?.description}} +
+
+
+ + + + No speakers are added. + +
+ + + + +
+
+
+
+
+
+
+
+
+ video_library + +
{{ event?.resourceType}}
+ + +
+
+
+
{{ handleCapitalize(event?.name) }} +
+
By {{ event?.sourceName + }}
+
+
+
+
+
+
View
+
+
+
{{ event?.startDate | date: 'MMM d, y'}}
+
{{getHoursAndMinites(event?.startTime)}} - + {{getHoursAndMinites(event?.endTime)}}
+
+
+
Event Type
+
{{ event?.resourceType}}
+
+
+
Hosted By
+
{{ event?.sourceName}}
+
+
+
+
+
+
+
+
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-preview/events-preview.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-preview/events-preview.component.scss new file mode 100644 index 000000000..ffaf32ce5 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-preview/events-preview.component.scss @@ -0,0 +1,229 @@ +@import 'ws-mixins'; +@import 'ws-vars'; + +.source-text { + color: rgba($color: #FFF, $alpha: 0.7); +} + +.preview-toc{ + background-color: #eff3f9; + overflow: hidden; + width: 100%; + min-height: calc(100vh - 60px); +} + +.toc-banner { + background: rgb(58, 131, 207); + background: linear-gradient(135deg, rgba(58, 131, 207, 1) 0%, rgba(27, 76, 161, 1) 100%); + width: 100%; + + .fixed-width { + padding: 0 16px; + } + + .banner-details { + padding: 36px 0px; + + .due-tag { + padding: 4px; + color: #FFF; + border-radius: 4px; + } + + .due-warning { + background-color: rgba(246, 153, 83, 1); + border: 1px solid rgba(246, 153, 83, 1); + } + + .due-overdue { + background-color: #D13924; + border: 1px solid #D13924; + } + + .due-success { + background-color: #5fa800; + border: 1px solid #5fa800; + } + + .rating-chip { + border: 1px solid rgba($color: #000000, $alpha: 0.6); + border-radius: 20px; + background-color: rgba($color: #000000, $alpha: 0.6); + + mat-icon { + width: 16px; + height: 16px; + color: rgba(246, 153, 83, 1); + font-size: 16px; + } + + .separator { + width: 1px; + height: 20px; + border-right: 1px solid rgba($color: #FFF, $alpha: 0.16); + margin: 0 8px; + } + } + + .banner-text { + color: rgba(255, 255, 255, 0.95); + word-wrap: break-word; + } + } + + .info-div { + max-width: 384px; + width: 100%; + } + + .most-enrolled-chip { + background-color: #FFEA9E; + border: 1px solid #FFEA9E; + padding: 4px; + border-radius: 2px; + } +} + +.tag-div { + border: 1px solid #f69953; + background-color: #00000080; +} +.rounded-2xl { + border-radius: 1rem; +} + +.toc-content { + max-width: 55%; + width: 100%; +} + +.tag-div mat-icon { + font-size: 12px; + width: 12px; + height: 12px; +} + +.leading-3 { + line-height: .75rem; +} + +.fixed-width { + max-width: 1200px; + margin: 0 auto; +} + +.toc-content { + max-width: 55%; + width: 100%; +} + +.right-content{ + z-index: 10; + padding-bottom: 1rem; + margin-top: -130px; +} +.right-container .right-content-inner { + background-color: #fff; + border-radius: 12px; + width: 384px; + margin-bottom: 1rem; + box-shadow: 0 2px 6px -1px #00000080, 0 -4px 4px -2px #00000080; +} + +.right-container .image-div { + height: 220px; + background-color: #ccc; + border-top-left-radius: 12px; + border-top-right-radius: 12px; +} +.right-container .text-container { + position: relative; + z-index: 2; + height: 220px; + padding: 16px; +} +.right-container .border-bottom { + border-bottom: 1px solid rgba(0, 0, 0, .2); +} + +.view-btn { + background-color: #1b4ca1; + border-radius: 35px; + padding: 7px; + color: white; + display: flex; + justify-content: center; + font-weight: 700; + cursor: pointer; +} +.duration-section { + background-color: #f6f6f6; +} +.time { + color: #1b4ca1; +} + +.content-card { + background: #ffffff; + border: 1px solid #dddddd; + overflow: hidden; + position: relative; +} + +.resource { + padding-left: 16px; + box-sizing: border-box; + width: 100%; + overflow: hidden; + padding: 16px 16px 16px 0; +} + +.text-truncate { + max-width: 100%; + overflow: hidden !important; + text-overflow: ellipsis !important; + white-space: nowrap !important; +} +.info-icon{ + width: 16px; + height: 16px; + font-size: 16px; +} + +.themes-button { + border-radius: 20px; + border: 1px solid rgba(0, 0, 0, .08); + background-color: #e6e8ef; + color: #0009; + font-weight: 400; + letter-spacing: .25px; + padding: 8px 16px; + cursor: pointer; +} + +.theme-activated { + border: 1px solid #1B4CA1; + background-color: #dee6f2; + color: #1b4ca1; + font-weight: 700; +} + +::ng-deep .competency-cards .mat-icon { + color: #fff !important; +} + +.speaker-name { + font-family: Montserrat; + font-weight: 600; + font-size: 14px; + line-height: 17.07px; + letter-spacing: 0%; +} + +.speaker-description { + font-family: Lato; + font-weight: 400; + font-size: 12px; + line-height: 14.4px; + letter-spacing: 0%; +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-preview/events-preview.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-preview/events-preview.component.spec.ts new file mode 100644 index 000000000..e915df6fa --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-preview/events-preview.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { EventsPreviewComponent } from './events-preview.component'; + +describe('EventsPreviewComponent', () => { + let component: EventsPreviewComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [EventsPreviewComponent] + }); + fixture = TestBed.createComponent(EventsPreviewComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-preview/events-preview.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-preview/events-preview.component.ts new file mode 100644 index 000000000..00e83e170 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-preview/events-preview.component.ts @@ -0,0 +1,225 @@ +import { Component, ElementRef, HostListener, Input, OnChanges, OnInit, SimpleChanges, ViewChild } from '@angular/core' +// import { MatLegacyDialog } from '@angular/material/legacy-dialog' +import { NsWidgetResolver } from '@sunbird-cb/resolver' +import { environment } from '../../../../../../../../../../../src/environments/environment' +// import { YoutubePlayerComponent } from '../../dialogs/youtube-player/youtube-player.component' + +@Component({ + selector: 'ws-app-events-preview', + templateUrl: './events-preview.component.html', + styleUrls: ['./events-preview.component.scss'] +}) +export class EventsPreviewComponent implements OnInit, OnChanges { + @Input() event: any + eventId: any + @ViewChild('rightContainer') rcElement!: ElementRef + @ViewChild('bannerDetails', { static: true }) bannerElem!: ElementRef + @ViewChild('contentSource') contentSource!: ElementRef + sourceEllipsis = false + scrollLimit = 0 + rcElem = { + offSetTop: 0, + BottomPos: 0, + } + scrolled = false + elementPosition: any + sticky = false + competencies_v6: any = [] + competenciesObject: any = [] + compentencyKey: any + competencySelected = '' + widgets?: NsWidgetResolver.IRenderConfigWithAnyData[] + + strip: any = { + key: 'blendedPrograms', + logo: '', + title: 'Blended Program', + stripTitleLink: { + link: '', + icon: '', + }, + sliderConfig: { + showNavs: true, + showDots: false, + }, + loader: true, + stripBackground: '', + titleDescription: 'Blended Program', + stripConfig: { + cardSubType: 'standard', + }, + viewMoreUrl: { + path: '', + viewMoreText: 'Show all', + queryParams: '', + }, + tabs: [], + filters: [], + } + + @HostListener('window:scroll', ['$event']) + handleScroll() { + const windowScroll = window.pageYOffset + if (windowScroll >= this.elementPosition - 100) { + this.sticky = true + } else { + this.sticky = false + } + + if (this.scrollLimit) { + if ((window.scrollY + this.rcElem.BottomPos) >= this.scrollLimit) { + this.rcElement.nativeElement.style.position = 'sticky' + } else { + this.rcElement.nativeElement.style.position = 'fixed' + } + } + + // 236... (OffsetTop of right container + 104) + if (window.scrollY > (this.rcElem.offSetTop + 104)) { + this.scrolled = true + } else { + this.scrolled = false + } + } + + constructor( + // private dialog: MatLegacyDialog, + ) { } + + ngOnInit(): void { + } + + ngOnChanges(changes: SimpleChanges): void { + if (changes.event) { + this.compentencyKey = { + vKey: environment.compentencyVersionKey, vCompetencyArea: 'competencyAreaName', vCompetencyTheme: 'competencyThemeName', + vCompetencySubTheme: 'competencySubThemeName', + } + this.eventId = this.event.identifier + this.loadCompetencies() + } + } + + loadCompetencies(): void { + if (this.event && this.compentencyKey && this.event[this.compentencyKey.vKey] && this.event[this.compentencyKey.vKey].length) { + const competenciesObject: any = {} + if (typeof this.event[this.compentencyKey.vKey] === 'string' + && this.checkValidJSON(this.event[this.compentencyKey.vKey])) { + this.event[this.compentencyKey.vKey] = JSON.parse(this.event[this.compentencyKey.vKey]) + } + this.event[this.compentencyKey.vKey].forEach((_obj: any) => { + if (competenciesObject[_obj[this.compentencyKey.vCompetencyArea]]) { + if (competenciesObject[_obj[this.compentencyKey.vCompetencyArea]] + [_obj[this.compentencyKey.vCompetencyTheme]]) { + const competencyTheme = competenciesObject[_obj[this.compentencyKey.vCompetencyArea]] + [_obj[this.compentencyKey.vCompetencyTheme]] + if (competencyTheme.indexOf(_obj[this.compentencyKey.vCompetencySubTheme]) === -1) { + competencyTheme.push(_obj[this.compentencyKey.vCompetencySubTheme]) + } + } else { + competenciesObject[_obj[this.compentencyKey.vCompetencyArea]] + [_obj[this.compentencyKey.vCompetencyTheme]] = [] + competenciesObject[_obj[this.compentencyKey.vCompetencyArea]] + [_obj[this.compentencyKey.vCompetencyTheme]] + .push(_obj[this.compentencyKey.vCompetencySubTheme]) + } + } else { + competenciesObject[_obj[this.compentencyKey.vCompetencyArea]] = {} + competenciesObject[_obj[this.compentencyKey.vCompetencyArea]][_obj[this.compentencyKey.vCompetencyTheme]] = [] + competenciesObject[_obj[this.compentencyKey.vCompetencyArea]][_obj[this.compentencyKey.vCompetencyTheme]] + .push(_obj[this.compentencyKey.vCompetencySubTheme]) + } + }) + + for (const key in competenciesObject) { + if (competenciesObject.hasOwnProperty(key)) { + const _temp: any = {} + _temp['key'] = key + _temp['value'] = competenciesObject[key] + this.competenciesObject.push(_temp) + } + } + this.handleShowCompetencies(this.competenciesObject[0]) + } + } + + handleShowCompetencies(item: any): void { + this.competencySelected = item.key + const valueObj = item.value + const competencyArray = [] + for (const key in valueObj) { + if (valueObj.hasOwnProperty(key)) { + const _tempObj: any = {} + _tempObj['key'] = key + _tempObj['value'] = valueObj[key] + competencyArray.push(_tempObj) + } + } + + this.strip['loaderWidgets'] = this.transformCompetenciesToWidget(this.competencySelected, competencyArray, this.strip) + } + + private transformCompetenciesToWidget( + competencyArea: string, + competencyArrObject: any, + strip: any) { + return (competencyArrObject || []).map((content: any, idx: number) => ( + content ? { + widgetType: 'card', + widgetSubType: 'competencyCard', + widgetHostClass: 'mr-4', + widgetData: { + content, + competencyArea, + cardCustomeClass: strip.customeClass ? strip.customeClass : '', + context: { pageSection: strip.key, position: idx }, + }, + } : { + widgetType: 'card', + widgetSubType: 'competencyCard', + widgetHostClass: 'mr-4', + widgetData: {}, + } + )) + } + + checkValidJSON(str: any) { + try { + JSON.parse(str) + return true + } catch (e) { + return false + } + } + + handleCapitalize(str: string, type?: string): string { + let returnValue = '' + if (str) { + if (type === 'name') { + returnValue = str.split(' ').map(_str => { + return _str.charAt(0).toUpperCase() + _str.slice(1) + }).join(' ') + } else { + + returnValue = str && (str.charAt(0).toUpperCase() + str.slice(1)) + } + } + return returnValue + } + + getHoursAndMinites(dateTime: any) { + if (dateTime) { + const [hours, minutes] = dateTime.split(":") + return `${hours}:${minutes}` + } + return '' + } + + viewPlayer() { + // this.dialog.open(YoutubePlayerComponent, { + // width: '900px', + // disableClose: false, + // data: { event: this.event } + // }) + } +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.scss index 3ec25343e..01b1ae7ef 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-table/events-table.component.scss @@ -11,9 +11,9 @@ padding: 9px 9px 9px 45px; margin-bottom: 0px; margin-top: 0; - /* stylelint-enable */ - font: normal 14px Lato; /* stylelint-disable */ + font: normal 14px Lato; + /* stylelint-enable */ font-weight: 400; } @@ -28,9 +28,9 @@ background-color: #1B4CA1 !important; border-radius: 4px; color: #FFFFFF !important; - /* stylelint-enable */ - font: 700 14px Lato; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ .delete-all-icon { font-size: 18px; @@ -61,9 +61,9 @@ .cources-table-cell { color: #000000DE; - /* stylelint-enable */ - font: 400 14px Lato; /* stylelint-disable */ + font: 400 14px Lato; + /* stylelint-enable */ // width: 150px; } @@ -88,9 +88,9 @@ border-radius: 4px; padding: 4px 8px; color: #FFFFFF; - /* stylelint-enable */ - font: 400 14px Lato; /* stylelint-disable */ + font: 400 14px Lato; + /* stylelint-enable */ .checkCircle{ color: #E8EAED; @@ -107,9 +107,9 @@ border-radius: 4px; padding: 4px 8px; color: #FFFFFF; - /* stylelint-enable */ - font: 400 14px Lato; /* stylelint-disable */ + font: 400 14px Lato; + /* stylelint-enable */ .pending-img{ width: 24px; @@ -121,9 +121,9 @@ height: 33px; width: 58px; background-color: #1D892333; - /* stylelint-enable */ - font: 700 14px Lato; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ color: #1D8923; border-radius: 4px; } @@ -133,9 +133,9 @@ border-radius: 4px; background-color: #D1392466; padding: 0px 16px; - /* stylelint-enable */ - font: 700 14px Lato; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ color: #D13924; } @@ -144,9 +144,9 @@ border-radius: 4px; background-color: #fad8b4; padding: 0px 16px; - /* stylelint-enable */ - font: 700 14px Lato; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ color: #fb8400; } @@ -163,9 +163,9 @@ .item-btn { color: #00000099 !important; - /* stylelint-enable */ - font: 400 14px Lato; /* stylelint-disable */ + font: 400 14px Lato; + /* stylelint-enable */ width: 160px; .menu-item-icon { @@ -199,9 +199,9 @@ .table-header-text { color: #666666 !important; - /* stylelint-enable */ - font: 400 12px Lato !important; /* stylelint-disable */ + font: 400 12px Lato !important; + /* stylelint-enable */ } .eventsTableLoader { @@ -223,9 +223,9 @@ .theme-igot.day-mode .mat-header-cell { color: #0000008A; - /* stylelint-enable */ - font: 400 14px Lato /* stylelint-disable */ + font: 400 14px Lato + /* stylelint-enable */ } } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.ts index 163e56fae..5e30f821b 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events/events.component.ts @@ -19,6 +19,7 @@ export class EventsComponent implements OnInit, OnDestroy { currentRoute = 'pending-approval' routeSubscription: Subscription = new Subscription() userProfile: any + userEmail = '' pathUrl = '' //#endregion @@ -51,6 +52,7 @@ export class EventsComponent implements OnInit, OnDestroy { }) if (_.get(this.activatedRoute, 'snapshot.data.configService.userProfile')) { this.userProfile = _.get(this.activatedRoute, 'snapshot.data.configService.userProfile') + this.userEmail = _.get(this.activatedRoute, 'snapshot.data.configService.userProfileV2.email') } this.pathUrl = _.get(this.activatedRoute, 'snapshot.url[0].path', 'pending-approval') } @@ -64,7 +66,10 @@ export class EventsComponent implements OnInit, OnDestroy { openBasicInfoDialog() { const dialgRrf = this.dialog.open(BasicInfoComponent, { panelClass: 'create-event-dialog', - data: this.userProfile, + data: { + userProfile: this.userProfile, + userEmail: this.userEmail + } }) dialgRrf.afterClosed().subscribe((identifier: any) => { diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.html index e2487a2f7..40dd52d00 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.html @@ -1,6 +1,6 @@
-
{{materialDetails?.fullName}}
+
{{materialDetails?.title}}
edit @@ -17,8 +17,8 @@ Full Name
- - + + Name is mandatory @@ -39,7 +39,7 @@
-
diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.scss index 6a27f6a23..51d3e04cc 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.scss @@ -12,9 +12,9 @@ .pdfName { color: #000000; - /* stylelint-enable */ - font: 600 14px Montserrat; /* stylelint-disable */ + font: 600 14px Montserrat; + /* stylelint-enable */ } .edit-icon { @@ -31,9 +31,9 @@ .form-lable { color: #212529; - /* stylelint-enable */ - font: 700 14px Lato; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ } .file-card { @@ -42,9 +42,9 @@ .pdfName { color: #1B4CA1; - /* stylelint-enable */ - font: 700 14px Lato; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ } } @@ -56,9 +56,9 @@ border-radius: 17px; border: 1px solid #1B4CA1 !important; color: #1B4CA1 !important; - /* stylelint-enable */ - font: 700 14px Lato; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ } .save-btn { @@ -67,9 +67,9 @@ border-radius: 17px; background-color: #1B4CA1 !important; color: #FFFFFF !important; - /* stylelint-enable */ - font: 700 14px Lato; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ } :host ::ng-deep .disableForm { diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.ts index 67b15801d..345013485 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/material-details/material-details.component.ts @@ -20,7 +20,7 @@ export class MaterialDetailsComponent implements OnChanges { currentMaterialSaved = true eventForm!: FormGroup - fileUrl = '' + content = '' constructor( private formBuilder: FormBuilder @@ -38,12 +38,12 @@ export class MaterialDetailsComponent implements OnChanges { this.eventForm.setValue(this.materialDetails) } else { this.eventForm = this.formBuilder.group({ - fullName: new FormControl(_.get(this.materialDetails, 'fullName', ''), [Validators.required]), - fileUrl: new FormControl(_.get(this.materialDetails, 'fileUrl', '')), + title: new FormControl(_.get(this.materialDetails, 'title', ''), [Validators.required]), + content: new FormControl(_.get(this.materialDetails, 'content', '')), }) - this.eventForm.controls.fullName.valueChanges.subscribe((value: string) => { - if (value && _.get(this.materialDetails, 'fullName') !== value && this.currentMaterialSaved) { + this.eventForm.controls.title.valueChanges.subscribe((value: string) => { + if (value && _.get(this.materialDetails, 'title') !== value && this.currentMaterialSaved) { this.currentMaterialSaved = false this.currentMaterialSaveUpdate.emit(this.currentMaterialSaved) } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.scss index 6d359cfd0..5772133e8 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.scss @@ -4,16 +4,16 @@ .event-header { color: #1B4CA1; - /* stylelint-enable */ - font: 600 14px Montserrat; /* stylelint-disable */ + font: 600 14px Montserrat; + /* stylelint-enable */ } .add-event { color: #1B4CA1; - /* stylelint-enable */ - font: 700 14px Lato; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ height: 32px; padding: 0px !important; width: 120px; @@ -26,9 +26,9 @@ background-color: #1B4CA1; height: 35px; color: #FEFEFE; - /* stylelint-enable */ - font: 400 12px Inter; /* stylelint-disable */ + font: 400 12px Inter; + /* stylelint-enable */ border-bottom: 10px solid #FFFFFF; min-width: 225px; } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.ts index 013323a24..c788b6411 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.ts @@ -1,4 +1,4 @@ -import { Component, Input, OnChanges, OnInit } from '@angular/core' +import { Component, Input } from '@angular/core' import { speaker } from '../../models/events.model' import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog' import { AddSpeakersComponent } from '../../dialogs/add-speakers/add-speakers.component' @@ -8,24 +8,22 @@ import { AddSpeakersComponent } from '../../dialogs/add-speakers/add-speakers.co templateUrl: './speakers.component.html', styleUrls: ['./speakers.component.scss'] }) -export class SpeakersComponent implements OnInit, OnChanges { +export class SpeakersComponent { @Input() speakersList: speaker[] = [] @Input() openMode = 'edit' + @Input() userProfile: any constructor( private dialog: MatDialog, ) { } - ngOnInit(): void { - } - - ngOnChanges(): void { - } - openAddSpeakerPopu() { const dialogRef = this.dialog.open(AddSpeakersComponent, { panelClass: 'dialog_sidenav', - width: '600px' + width: '600px', + data: { + rootOrgId: this.userProfile ? this.userProfile.rootOrgId : '' + } }) dialogRef.afterClosed().subscribe((speakerDetails: speaker) => { @@ -39,7 +37,10 @@ export class SpeakersComponent implements OnInit, OnChanges { if (this.speakersList && this.speakersList[index]) { const dialogRef = this.dialog.open(AddSpeakersComponent, { panelClass: 'dialog_sidenav', - data: this.speakersList[index], + data: { + rootOrgId: this.userProfile ? this.userProfile.rootOrgId : '', + speaker: this.speakersList[index] + }, width: '600px' }) diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.scss index ba3272d26..fa4a3fa16 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.scss @@ -8,9 +8,9 @@ padding-bottom: 0 !important; } .add-competency-header { - /* stylelint-enable */ - font: 600 16px Montserrat; /* stylelint-disable */ + font: 600 16px Montserrat; + /* stylelint-enable */ line-height: 19.5px; text-align: left; text-underline-position: from-font; @@ -19,9 +19,9 @@ } .themes-header { - /* stylelint-enable */ - font: 600 14px Montserrat; /* stylelint-disable */ + font: 600 14px Montserrat; + /* stylelint-enable */ line-height: 17.07px; text-align: left; text-underline-position: from-font; @@ -47,9 +47,9 @@ padding: 8px 16px; border: 1px solid #ccc; border-radius: 16px; - /* stylelint-enable */ - font: 400 12px Lato; /* stylelint-disable */ + font: 400 12px Lato; + /* stylelint-enable */ line-height: 14.4px; text-align: left; text-underline-position: from-font; @@ -87,9 +87,9 @@ border-radius: 17px; height: 32px; width: 74px; - /* stylelint-enable */ - font: 700 14px Lato; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ color: #1B4CA1 !important; } @@ -108,7 +108,7 @@ width: 60px; border-radius: 17px; color: #FFFFFF !important; - /* stylelint-enable */ - font: 700 14px Lato; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ } \ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.ts index 10e958ecf..1dc16bedd 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-competency/add-competency.component.ts @@ -189,7 +189,7 @@ export class AddCompetencyComponent implements OnInit { get canAddCompetencies(): boolean { if (!this.selectedThemesList || ( this.selectedThemesList && - !this.selectedThemesList.find((selectedThem: any) => (selectedThem.selectedSubThemes && selectedThem.selectedSubThemes.length > 0)))) { + this.selectedThemesList.find((selectedThem: any) => (!selectedThem.selectedSubThemes || selectedThem.selectedSubThemes.length === 0)))) { return false } return true diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.html index 1fa6249a4..2b10f3279 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.html @@ -8,11 +8,30 @@
Email
- - + + + + + +
+
+ {{user.iconText.substring(0,2)}} +
+
+
{{user.name}}
+
{{user.maskedEmail}}
+
+
+ + + email is mandatory + + Please enter a valid email +
diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.scss index 3aa45c0b3..a8cd86e3a 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.scss @@ -3,9 +3,9 @@ height: 70px; .add-speaker-text { - /* stylelint-enable */ - font: 600 16px Montserrat; /* stylelint-disable */ + font: 600 16px Montserrat; + /* stylelint-enable */ } .close-icon { @@ -21,9 +21,9 @@ } .form-lable { - /* stylelint-enable */ - font: 700 14px Lato; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ } .add-speaker-footer { @@ -34,9 +34,9 @@ border-radius: 17px; height: 32px; width: 75px; - /* stylelint-enable */ - font: 700 14px Lato; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ color: #1B4CA1 !important; } @@ -44,9 +44,9 @@ border-radius: 17px; height: 32px; background-color: #1B4CA1; - /* stylelint-enable */ - font: 700 14px Lato; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ color: #FFFFFF !important; } } @@ -69,3 +69,39 @@ display: none; } } + +.users-option { + line-height: unset !important; +} + +.iconDiv { + + .iconText { + border-radius: 50%; + background-color: black; + color: white; + width: 30px; + display: inline-block; + text-align: center; + height: 30px; + display: flex; + align-items: center; + justify-content: center; + } +} + +.userName { + height: 14px; + margin-top: -3px; +} + +.emailText { + opacity: 0.6; + height: 14px; +} + +:host ::ng-deep .emailForm { + .mat-option { + line-height: unset !important; + } +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.ts index 8eca8056d..8a89966ef 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.ts @@ -2,6 +2,10 @@ import { Component, Inject, OnInit } from '@angular/core' import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms' import { MatLegacyDialogRef, MAT_LEGACY_DIALOG_DATA } from '@angular/material/legacy-dialog' import * as _ from 'lodash' +import { debounceTime, distinctUntilChanged } from 'rxjs/operators' +import { EventsService } from '../../services/events.service' + +const EMAIL_PATTERN = /^[a-zA-Z0-9*]+([a-zA-Z0-9._-]*[a-zA-Z0-9*]+)*@[a-zA-Z0-9]+([-a-zA-Z0-9]*[a-zA-Z0-9]+)?(\.[a-zA-Z0-9-]+)*\.[a-zA-Z]{2,10}$/ @Component({ selector: 'ws-app-add-speakers', @@ -12,21 +16,83 @@ export class AddSpeakersComponent implements OnInit { speakerDetails: any speakerForm: FormGroup | undefined + filteredUsers: any[] = [] + rootOrgId = '' + allUsers: any[] = [] constructor( private dialogRef: MatLegacyDialogRef, @Inject(MAT_LEGACY_DIALOG_DATA) data: any, - private formBuilder: FormBuilder + private formBuilder: FormBuilder, + private eventsService: EventsService ) { - this.speakerDetails = data + this.speakerDetails = data.speaker + this.rootOrgId = data.rootOrgId } ngOnInit(): void { this.speakerForm = this.formBuilder.group({ - email: new FormControl(_.get(this.speakerDetails, 'email', ''), [Validators.required]), + email: new FormControl(_.get(this.speakerDetails, 'email', ''), [Validators.required, Validators.pattern(EMAIL_PATTERN)]), name: new FormControl(_.get(this.speakerDetails, 'name', '')), description: new FormControl(_.get(this.speakerDetails, 'description', '')) }) + + this.speakerForm.controls.email.valueChanges.pipe( + debounceTime(200), + distinctUntilChanged() + ).subscribe((res: any) => { + this.filteredUsers = [] + if (res) { + this.getUsersToShare(res) + } + }) + } + + getUsersToShare(queryStr: string) { + this.eventsService.searchUser(queryStr, this.rootOrgId).subscribe(data => { + if (data.result && data.result.response) { + const apiResponse = data.result.response.content + let name = '' + let pEmail = '' + apiResponse.forEach((apiData: any) => { + apiData.firstName.split(' ').forEach((d: any) => { + name = name + d.substr(0, 1).toUpperCase() + }) + if (apiData.profileDetails && apiData.profileDetails.personalDetails) { + pEmail = apiData.profileDetails.personalDetails.primaryEmail + if (!this.allUsers.filter(user => user.email.toLowerCase().includes(pEmail.toLowerCase())).length) { + this.allUsers.push( + { + maskedEmail: apiData.maskedEmail, + id: apiData.identifier, + name: apiData.firstName, + iconText: name, + email: pEmail, + } + ) + } + } + }) + } + if (this.allUsers.length === 0) { + this.filteredUsers = [] + } + this.filteredUsers = this.filterSharedUsers(queryStr) + }) + } + + selected(user: any): void { + if (user && this.speakerForm && this.speakerForm?.controls.name) { + this.speakerForm.controls.name.patchValue(user.name) + } + } + + filterSharedUsers(value: string): string[] { + if (value) { + const filterValue = value.toLowerCase() + return this.allUsers.filter(user => user.name.toLowerCase().includes(filterValue)) + } + return [] } addSpeaker() { diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.scss index be4b8a295..672c15910 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.scss @@ -63,9 +63,9 @@ $primary-color: #1B4CA1; .cancel-button { width: 74px; height: 32px !important; - /* stylelint-enable */ - font: 700 14px Lato; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ border-radius: 17px; } @@ -74,9 +74,9 @@ $primary-color: #1B4CA1; height: 32px !important; background-color: #1B4CA1 !important; color: #FFFFFF !important; - /* stylelint-enable */ - font: 700 14px Lato; /* stylelint-disable */ + font: 700 14px Lato; + /* stylelint-enable */ border-radius: 17px; } @@ -153,9 +153,9 @@ $primary-color: #1B4CA1; } .custome-title { - /* stylelint-enable */ - font-family: 'Montserrat'; /* stylelint-disable */ + font-family: 'Montserrat'; + /* stylelint-enable */ font-weight: 600; font-size: 20px; color: rgba(0, 0, 0, 0.40); @@ -192,7 +192,7 @@ $primary-color: #1B4CA1; .karmayogi-text { color: #1B2133; - /* stylelint-enable */ - font: 400 14px Lato; /* stylelint-disable */ + font: 400 14px Lato; + /* stylelint-enable */ } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts index 79fd32038..c9bc724e9 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts @@ -20,6 +20,7 @@ export class BasicInfoComponent implements OnInit { imgURL: string | ArrayBuffer | null = null imagePath: any userProfile: any + userEmail = '' constructor( private dialogRef: MatDialogRef, @@ -28,7 +29,8 @@ export class BasicInfoComponent implements OnInit { private matSnackBar: MatSnackBar, private eventSvc: EventsService ) { - this.userProfile = data + this.userProfile = data.userProfile + this.userEmail = data.userEmail } ngOnInit(): void { @@ -111,11 +113,11 @@ export class BasicInfoComponent implements OnInit { next: res => { if (res) { const createdUrl = res - const urlToReplace = 'https://storage.googleapis.com/igot' + const urlToReplace = 'https://storage.googleapis.com/igot'//https://portal.dev.karmayogibharat.net let appIcon = createdUrl if (createdUrl.startsWith(urlToReplace)) { const urlSplice = createdUrl.slice(urlToReplace.length).split('/') - appIcon = `${environment.karmYogiPath}/assets/public/${urlSplice.slice(1).join('/')}` + appIcon = `${environment.domainName}/assets/public/${urlSplice.slice(1).join('/')}` } this.createEvent(appIcon) } @@ -143,6 +145,8 @@ export class BasicInfoComponent implements OnInit { appIcon: appIcon, category: 'Event', createdBy: _.get(this.userProfile, 'userId', ''), + createdByName: _.get(this.userProfile, 'userName', ''), + createrEmail: this.userEmail ? this.userEmail : _.get(this.userProfile, 'email', ''), authoringDisabled: false, isContentEditingDisabled: false, isMetaEditingDisabled: false, diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/youtube-player/youtube-player.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/youtube-player/youtube-player.component.html new file mode 100644 index 000000000..1cf96bebe --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/youtube-player/youtube-player.component.html @@ -0,0 +1 @@ +
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/youtube-player/youtube-player.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/youtube-player/youtube-player.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/youtube-player/youtube-player.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/youtube-player/youtube-player.component.spec.ts new file mode 100644 index 000000000..4891ee35c --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/youtube-player/youtube-player.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { YoutubePlayerComponent } from './youtube-player.component'; + +describe('YoutubePlayerComponent', () => { + let component: YoutubePlayerComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [YoutubePlayerComponent] + }); + fixture = TestBed.createComponent(YoutubePlayerComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/youtube-player/youtube-player.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/youtube-player/youtube-player.component.ts new file mode 100644 index 000000000..5435a2f10 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/youtube-player/youtube-player.component.ts @@ -0,0 +1,229 @@ +// import { Component, ElementRef, Inject, Input, OnInit, ViewChild } from '@angular/core' +// import videoJs from 'video.js' +// // import { fireRealTimeProgressFunction, saveContinueLearningFunction, telemetryEventDispatcherFunction, youtubeInitializer } from '../../../../../../../../../library/ws-widget/collection/src/lib/_services/videojs-util' +// import { MAT_DIALOG_DATA } from '@angular/material/dialog' +// import { NsContent } from '@sunbird-cb/utils' + +import { Component } from "@angular/core" + +@Component({ + selector: 'ws-app-youtube-player', + templateUrl: './youtube-player.component.html', + styleUrls: ['./youtube-player.component.scss'] +}) +export class YoutubePlayerComponent { + + // @ViewChild('youtubeTag', { static: true }) youtubeTag!: ElementRef + + // currentEvent = false + // eventData: any + // @Input() videoId: any + // progressInterval: any + // intervalStarted = false + // isEnrolled = false + // resumeEventStatus = 0 + // rateToFire = 180 + // public player: videoJs.Player | null = null + // public dispose: (() => void) | null = null + constructor( + // @Inject(MAT_DIALOG_DATA) public data: any + ) { } + + // ngOnInit(): void { + // this.eventData = this.data.event + // this.getLink() + // this.initializePlayer('') + // } + + // getYouTubeVideoId(url: any) { + // const urlParams = new URL(url).searchParams + // return urlParams.get("v") + // } + + // getLink() { + // let url: any + // if (this.eventData && this.eventData.recordedLinks && this.eventData.recordedLinks.length > 0) { + // url = this.eventData.recordedLinks[0] + // } else { + // url = this.eventData.registrationLink + // } + // this.videoId = url + // if (this.videoId.includes('embed')) { + // this.videoId = this.videoId.split('embed/')[1] + // } else if (this.videoId.includes('watch')) { + // this.videoId = this.getYouTubeVideoId(this.videoId) + // } + // } + + // initializePlayer(resumeFrom: any) { + // let timeSpent = resumeFrom ? resumeFrom : 0 + + // let timeStamp = '' + // let timeStampString: any = '' + // let lastTimeAccessed = '' + // /* tslint:disable */ + // // let progress : any= '' + // /* tslint:enable */ + + // const dispatcher: telemetryEventDispatcherFunction = (event: any) => { + // /* tslint:disable */ + // console.log(event['data']) + + // if (event['data']['passThroughData'] && event['data']['passThroughData']['timeSpent']) { + // timeSpent = event['data']['passThroughData']['timeSpent'] + // /* tslint:disable */ + // console.log('timeSpent % 60 === 0 ', timeSpent, ':: ', timeSpent % 60 === 0) + // // if(timeSpent % 60 === 0){ + // // this.saveProgressUpdate(this.eventData.duration,timeSpent,lastTimeAccessed) + // // } + // if (this.eventData) { + // if (this.eventData.startDate && this.eventData.startTime) { + // let eventDateTime = this.eventData.startDate + ' ' + this.eventData.startTime + // let eventDateTimeStamp = new Date(eventDateTime).getTime() + // let currentDateTimeStamp = new Date().getTime() + // if (currentDateTimeStamp >= eventDateTimeStamp) { + // if (timeSpent && timeSpent % this.rateToFire === 0) { + // this.startInterval(timeSpent, lastTimeAccessed) + // } + // this.intervalStarted = true + // this.currentEvent = true + // } + // } + // } + + // } + // /* tslint:disable */ + // if (event['data'] && event['data']['playerStatus'] === 'ENDED') { + // if (this.currentEvent) { + // this.saveProgressUpdate(this.eventData.duration, timeSpent, lastTimeAccessed) + + // } + // } + // // if(event['data']['passThroughData'] && event['data']['passThroughData']['playerDuration']) { + // // playerDuration = event['data']['passThroughData']['playerDuration'] + // // } + // /* tslint:enable */ + // // if (this.widgetData.identifier) { + // // this.eventSvc.dispatchEvent(event) + // // } + // } + // const saveCLearning: saveContinueLearningFunction = (data: any) => { + // /* tslint:disable */ + // console.log(data, timeSpent) + // const dataobj: any = JSON.parse(data.data) + // if (dataobj && dataobj.timestamp) { + // // let progress = '' + // timeStamp = dataobj.timestamp + // timeStampString = new Date(timeStamp).toISOString().replace('T', ' ').replace('Z', ' ').split('.') + // lastTimeAccessed = timeStampString[0] + ':00+0000' + // // progress = dataobj.progress.toString() + // } + // if (this.currentEvent) { + // this.saveProgressUpdate(this.eventData.duration, timeSpent, lastTimeAccessed) + // } + // } + // const fireRProgress: fireRealTimeProgressFunction = (identifier: any, data: any) => { + // /* tslint:disable */ + // console.log(identifier, data) + // } + // const initObj = youtubeInitializer( + // this.youtubeTag.nativeElement, + // this.videoId, + // dispatcher, + // saveCLearning, + // fireRProgress, + // { resumeFrom }, + // '', + // true, + // {}, + // NsContent.EMimeTypes.YOUTUBE, + // '500px', + // ) + // this.dispose = initObj.dispose + // } + + // startInterval(timeSpent: any, lastTimeAccessed: any) { + // this.saveProgressUpdate(this.eventData.duration, timeSpent, lastTimeAccessed, true) + // } + + // getBatchId() { + // let batchId = '' + // if (this.eventData && typeof this.eventData.batches === 'string') { + // this.eventData.batches = JSON.parse(this.eventData.batches) + // } + // if (Array.isArray(this.eventData.batches) && this.eventData.batches.length > 0) { + // batchId = this.eventData.batches[0].batchId || '' + // } + // return batchId + // } + + // customDateFormat(date: any, time: any) { + // const stime = time.split('+')[0] + // const hour = stime.substr(0, 2) + // const min = stime.substr(2, 3) + // return `${date} ${hour}${min}` + // } + + // saveProgressUpdate(progress: any, timeSpent: any, lastTimeAccessed: any, normalUpdate?: boolean) { + // let userId = '' + // let completionPercentage: any = 0 + // const batchId = this.getBatchId() + // if (timeSpent) { + // // completionPercentage = (timeSpent / (this.eventData.duration * 60)) * 100 + // completionPercentage = normalUpdate ? + // (this.eventData.duration * 60 / (this.eventData.duration * 60)) * 100 : + // (timeSpent / (this.eventData.duration * 60)) * 100 + // } + + // if (this.eventData) { + // const req = { + // 'request': { + // 'userId': userId, + // 'events': [ + // { + // 'eventId': this.eventData.identifier, + // 'batchId': batchId, + // 'status': completionPercentage > 50 ? 2 : 1, + // 'lastAccessTime': lastTimeAccessed, // data.dateAccessed + // 'progressdetails': { + // 'max_size': this.eventData.duration * 60, // complete video duration + // 'current': [ // current state + // progress, + // ], + // 'duration': normalUpdate ? this.eventData.duration * 60 : timeSpent, // watch time + // 'mimeType': 'application/html', + // 'stateMetaData': timeSpent, // last state + // }, + // 'completionPercentage': completionPercentage ? Number(parseFloat(completionPercentage).toFixed(2)) : 0.0, + // }, + // ], + // }, + // } + // if (completionPercentage > 50) { + // this.rateToFire = 300 + // } + // if (this.resumeEventStatus !== 2) { + // /* tslint:disable */ + // console.log('req', req) + // /* tslint:enable */ + + // } else { + // /* tslint:disable */ + // console.log('Already completed ', req) + // } + // } + // } + + // ngOnDestroy() { + // /* tslint:disable */ + // console.log(this.player) + // /* tslint:enable */ + // this.intervalStarted = false + // if (this.player) { + // this.player.dispose() + // } + // if (this.dispose) { + // this.dispose() + // } + // } +} \ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts b/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts index 0b764579a..6c95c1e20 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts @@ -27,7 +27,6 @@ import { MatIconModule } from '@angular/material/icon' import { EventsService } from './services/events.service' import { BasicInfoComponent } from './dialogs/basic-info/basic-info.component' import { MatStepperModule } from '@angular/material/stepper' -// import { NgxMaterialTimepickerModule } from 'ngx-material-timepicker' import { MatDatepickerModule } from '@angular/material/datepicker' import { AddSpeakersComponent } from './dialogs/add-speakers/add-speakers.component' import { MaterialDetailsComponent } from './components/material-details/material-details.component' @@ -36,7 +35,14 @@ import { MatLegacyPaginatorModule } from '@angular/material/legacy-paginator' import { EventResolverService } from './services/event-resolver' import { AddCompetencyComponent } from './dialogs/add-competency/add-competency.component' import { MatLegacyCheckboxModule } from '@angular/material/legacy-checkbox' -// import { MatTimepickerModule } from '@angular/material/timepicker'; +import { MatLegacyAutocompleteModule } from '@angular/material/legacy-autocomplete' +import { EventsPreviewComponent } from './components/events-preview/events-preview.component' +import { YoutubePlayerComponent } from './dialogs/youtube-player/youtube-player.component' +import { MatLegacyTabsModule } from '@angular/material/legacy-tabs' +import { CardCompetencyComponent } from './components/card-competency/card-competency.component' +import { WidgetResolverModule } from '@sunbird-cb/resolver' +import { NgxMaterialTimepickerModule } from 'ngx-material-timepicker' +// import { MatTimepickerModule } from 'mat-timepicker' @NgModule({ @@ -52,7 +58,10 @@ import { MatLegacyCheckboxModule } from '@angular/material/legacy-checkbox' AddSpeakersComponent, MaterialDetailsComponent, EventsListComponent, - AddCompetencyComponent + AddCompetencyComponent, + EventsPreviewComponent, + YoutubePlayerComponent, + CardCompetencyComponent ], imports: [ CommonModule, @@ -75,11 +84,13 @@ import { MatLegacyCheckboxModule } from '@angular/material/legacy-checkbox' MatIconModule, MatLegacyPaginatorModule, MatStepperModule, - // NgxMaterialTimepickerModule, MatFormFieldModule, MatDatepickerModule, - - + MatLegacyAutocompleteModule, + MatLegacyTabsModule, + WidgetResolverModule, + // MatTimepickerModule + NgxMaterialTimepickerModule ], providers: [ DatePipe, diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/models/events.model.ts b/project/ws/app/src/lib/routes/home/routes/events-2/models/events.model.ts index be59ee978..73b44b25e 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/models/events.model.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/models/events.model.ts @@ -38,6 +38,6 @@ export interface speaker { } export interface material { - fullName: string, - fileUrl: string + title: string, + content: string } \ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.ts b/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.ts index 1acf12971..73bcd0cc8 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/services/events.service.ts @@ -12,7 +12,8 @@ const API_END_POINTS = { CREATE_EVENT: '/apis/proxies/v8/event/v4/create', EVENT_READ: (eventId: string) => `apis/proxies/v8/event/v4/read/${eventId}`, UPDATE_EVENT: (eventId: string) => `apis/proxies/v8/event/v4/update/${eventId}`, - PUBLISH_EVENT: (eventId: string) => `apis/proxies/v8/event/v4/publish/${eventId}` + PUBLISH_EVENT: (eventId: string) => `apis/proxies/v8/event/v4/publish/${eventId}`, + SEARCH_USERS: '/apis/proxies/v8/user/v1/search', } @Injectable({ @@ -68,10 +69,6 @@ export class EventsService { return this.http.post(API_END_POINTS.PUBLISH_EVENT(eventId), formBody) } - convertToTabularView() { - - } - convertToTreeView(competencies: any) { const competenciesObject: any = [] @@ -135,4 +132,17 @@ export class EventsService { return themeObj } + searchUser(value: string, rootOrgId: string) { + const reqBody = { + request: { + query: value, + filters: { + rootOrgId + }, + }, + } + + return this.http.post(`${API_END_POINTS.SEARCH_USERS}`, reqBody) + } + } From 20ada53e0e992ee3e5c9c4b00d1e19fa9e9dcef6 Mon Sep 17 00:00:00 2001 From: mansurskTarento Date: Fri, 14 Feb 2025 18:15:35 +0530 Subject: [PATCH 14/14] events timpicker issue fixes, added rejection and prewview in progress --- .../create-event/create-event.component.html | 17 +- .../create-event/create-event.component.ts | 39 ++- .../event-basic-details.component.html | 20 +- .../event-basic-details.component.scss | 8 + .../event-basic-details.component.ts | 93 ++++++- .../events-list/events-list.component.spec.ts | 245 ++++++++++++++++-- .../events-list/events-list.component.ts | 23 +- .../speakers/speakers.component.html | 12 +- .../speakers/speakers.component.scss | 3 +- .../components/speakers/speakers.component.ts | 18 +- .../add-speakers/add-speakers.component.html | 5 +- .../add-speakers/add-speakers.component.ts | 9 +- .../basic-info/basic-info.component.html | 2 +- .../basic-info/basic-info.component.ts | 4 +- .../rejection-reason.component.html | 10 + .../rejection-reason.component.scss | 16 ++ .../rejection-reason.component.spec.ts | 21 ++ .../rejection-reason.component.ts | 24 ++ .../home/routes/events-2/events-2.module.ts | 6 +- 19 files changed, 512 insertions(+), 63 deletions(-) create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/dialogs/rejection-reason/rejection-reason.component.html create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/dialogs/rejection-reason/rejection-reason.component.scss create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/dialogs/rejection-reason/rejection-reason.component.spec.ts create mode 100644 project/ws/app/src/lib/routes/home/routes/events-2/dialogs/rejection-reason/rejection-reason.component.ts diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.html index 2eaafdc09..2ee1f4738 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.html @@ -11,14 +11,14 @@ - + - +
@@ -45,13 +45,22 @@ Add Competency - + + + + + + Preview + + +
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts index a9ef03013..c789219a1 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/create-event/create-event.component.ts @@ -57,7 +57,7 @@ export class CreateEventComponent implements OnInit, AfterViewInit { startDate: new FormControl('', [Validators.required]), startTime: new FormControl('', [Validators.required]), endTime: new FormControl('', [Validators.required]), - resourceUrl: new FormControl(''), + resourceUrl: new FormControl('', [Validators.required]), // uploadUrl: new FormControl(''), appIcon: new FormControl('', [Validators.required]), }) @@ -110,7 +110,6 @@ export class CreateEventComponent implements OnInit, AfterViewInit { //#region (ui interactions) onSelectionChange(event: StepperSelectionEvent) { this.currentStepperIndex = event.selectedIndex - this.showPreview = false } navigateBack() { @@ -118,6 +117,8 @@ export class CreateEventComponent implements OnInit, AfterViewInit { } moveToNextForm() { + this.eventDetailsForm.markAllAsTouched() + this.eventDetailsForm.updateValueAndValidity() if (this.canMoveToNext || this.openMode === 'view') { this.currentStepperIndex = this.currentStepperIndex + 1 } @@ -125,12 +126,16 @@ export class CreateEventComponent implements OnInit, AfterViewInit { preview() { this.showPreview = true - this.updatedEventDetails = this.getFormBodyOfEvent() + this.updatedEventDetails = this.getFormBodyOfEvent(this.eventDetails['status']) + setTimeout(() => { + this.currentStepperIndex = 4 + }, 100) } publish() { - this.eventDetails['status'] = 'SentToPublish' - this.saveAndExit() + if (this.canPublish) { + this.saveAndExit('SentToPublish') + } } get canMoveToNext() { @@ -151,15 +156,22 @@ export class CreateEventComponent implements OnInit, AfterViewInit { return currentFormIsValid } - get showPublish(): boolean { + get canPublish(): boolean { if (this.currentStepperIndex === 3) { if (this.eventDetailsForm.invalid) { + this.openSnackBar('Please fill mandatory fields in basic details') return false } if (!(this.speakersList && this.speakersList.length)) { + this.openSnackBar('Please add atleast one speaker') return false } if (!(this.materialsList && this.materialsList.length)) { + this.openSnackBar('Please add atleast one material') + return false + } + if (!(this.competencies && this.competencies.length)) { + this.openSnackBar('Please add atleast one competency') return false } return true @@ -171,19 +183,18 @@ export class CreateEventComponent implements OnInit, AfterViewInit { this.competencies = competencies } - saveAndExit(navigateBack = true) { + saveAndExit(status = 'Draft') { const formBody = { request: { - event: this.getFormBodyOfEvent() + event: this.getFormBodyOfEvent(status) } } this.eventSvc.updateEvent(formBody, this.eventId).subscribe({ next: res => { if (res) { - this.openSnackBar('Event details saved successfully') - if (navigateBack) { - this.navigateBack() - } + const successMessage = status === 'Draft' ? 'Event details saved successfully' : 'Event details sent for approval successfully' + this.openSnackBar(successMessage) + this.navigateBack() } }, error: (error: HttpErrorResponse) => { @@ -193,7 +204,7 @@ export class CreateEventComponent implements OnInit, AfterViewInit { }) } - getFormBodyOfEvent() { + getFormBodyOfEvent(status: string) { const eventDetails: any = JSON.parse(JSON.stringify(this.eventDetails)) const eventBaseDetails = this.eventDetailsForm.value let startTime = '' @@ -224,6 +235,8 @@ export class CreateEventComponent implements OnInit, AfterViewInit { eventDetails['competencies_v6'] = this.competencies } + eventDetails['status'] = status + return eventDetails } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html index 4cf824acc..f2b7b00e6 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.html @@ -20,7 +20,7 @@ (change)="onFileSelected(file.files);">
icon - Upload Images * + Upload Image * Supported file types: PNG, JPG Max Size - 400MB
@@ -53,7 +53,7 @@
-
+
upload from URL
@@ -96,7 +96,7 @@
-
+
Date
@@ -114,10 +114,12 @@
Start Time
- - + + - + start time is mandatory @@ -128,9 +130,11 @@ End Time
- + - + start time is mandatory diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.scss index 95ae1cc12..98d988ceb 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.scss @@ -102,3 +102,11 @@ display: none; } } + +::ng-deep ngx-material-timepicker-content{ + --button-color: #1B4CA1 !important; + --dial-background-color: #1B4CA1 !important; + --dial-editable-active-color: #1B4CA1 !important; + --clock-hand-color: #1B4CA1 !important; +} + diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts index 9d3e17b93..8ee5a9550 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/event-basic-details/event-basic-details.component.ts @@ -1,4 +1,4 @@ -import { Component, Input, OnInit } from '@angular/core' +import { Component, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core' import { FormGroup } from '@angular/forms' import { MatLegacySnackBar } from '@angular/material/legacy-snack-bar' import * as _ from 'lodash' @@ -7,13 +7,14 @@ import { EventsService } from '../../services/events.service' import { map, mergeMap } from 'rxjs/operators' import { environment } from '../../../../../../../../../../../src/environments/environment' import { HttpErrorResponse } from '@angular/common/http' +import moment from 'moment' @Component({ selector: 'ws-app-event-basic-details', templateUrl: './event-basic-details.component.html', styleUrls: ['./event-basic-details.component.scss'] }) -export class EventBasicDetailsComponent implements OnInit { +export class EventBasicDetailsComponent implements OnInit, OnChanges { //#region (global variables) @Input() eventDetails!: FormGroup @@ -22,6 +23,11 @@ export class EventBasicDetailsComponent implements OnInit { evntCategorysList = ['Webinar', 'Karmayogi Talks', 'Karmayogi Saptah'] todayDate = new Date() + + maxTimeToStart = '11:30 pm' + minTimeToEnd = '12:30 am' + timeGap = 15 + //#endregion constructor( @@ -29,7 +35,70 @@ export class EventBasicDetailsComponent implements OnInit { private eventSvc: EventsService ) { } + ngOnChanges(changes: SimpleChanges): void { + if (changes.eventDetails) { + const startTime = _.get(this.eventDetails, 'value.startTime') + if (startTime) { + this.eventDetails.controls.startTime.patchValue(this.convertTo12HourFormat(startTime)) + } + + const endTime = _.get(this.eventDetails, 'value.endTime') + if (endTime) { + this.eventDetails.controls.endTime.patchValue(this.convertTo12HourFormat(endTime)) + } + } + } + + convertTo12HourFormat(timeWithTimezone: string): string { + const time = timeWithTimezone.split('+')[0] + const [hours, minutes] = time.split(':') + let hour = parseInt(hours) + let period = 'AM' + if (hour >= 12) { + period = 'PM' + if (hour > 12) { + hour -= 12 + } + } else if (hour === 0) { + hour = 12 + } + const formattedTime = `${hour}:${minutes} ${period}` + return formattedTime + } + ngOnInit(): void { + if (this.eventDetails.controls.startTime) { + this.eventDetails.controls.startTime.valueChanges.subscribe((time) => { + this.generatMinTimeToEnd(time) + }) + } + } + + + generatMinTimeToEnd(time: string) { + let [timePart, period] = time.split(' ') + let [hours, minutes] = timePart.split(':').map(Number) + minutes += this.timeGap + if (minutes >= 60) { + minutes -= 60 + hours += 1 + } + if (hours > 12) { + hours -= 12 + if (period === 'AM') { + period = 'PM' + } else { + period = 'AM' + } + } + if (hours === 12 && minutes === 0) { + period = period === 'AM' ? 'PM' : 'AM' + } + const formattedTime = `${hours}:${minutes < 10 ? '0' + minutes : minutes} ${period}` + this.minTimeToEnd = formattedTime + if (this.eventDetails.controls.startTime) { + this.eventDetails.controls.endTime.patchValue('') + } } get appIconName(): string { @@ -142,6 +211,26 @@ export class EventBasicDetailsComponent implements OnInit { return showMsg } + onStartTimeChange(event: any) { + const startTime = event ? event.formatted : '' + if (startTime) { + const minEndTime = this.calculateMinEndTime(startTime) + this.minTimeToEnd = minEndTime + if (this.eventDetails) { + const endTimeControl = this.eventDetails.get('endTime') + if (endTimeControl) { + endTimeControl.setValue('') + } + } + } + } + + calculateMinEndTime(startTime: string): string { + const startMoment = moment(startTime, 'HH:mm') + const minEndTimeMoment = startMoment.add(30, 'minutes') + return minEndTimeMoment.format('HH:mm') + } + private openSnackBar(message: string) { this.matSnackBar.open(message) } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.spec.ts index 7ce60a1b9..685520cd9 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.spec.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.spec.ts @@ -1,21 +1,234 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; +import { EventsListComponent } from './events-list.component' +import { HttpErrorResponse } from '@angular/common/http' +import { of, throwError } from 'rxjs' -import { EventsListComponent } from './events-list.component'; +// Mock interfaces and types +interface MockMatSnackBar { + open: jest.Mock +} + +interface MockEventsService { + getEvents: jest.Mock + updateEvent: jest.Mock +} + +interface MockRouter { + navigate: jest.Mock +} + +interface MockDialog { + open: jest.Mock +} describe('EventsListComponent', () => { - let component: EventsListComponent; - let fixture: ComponentFixture; + let component: any + let mockMatSnackBar: MockMatSnackBar + let mockEventsService: MockEventsService + let mockRouter: MockRouter + let mockDialog: MockDialog beforeEach(() => { - TestBed.configureTestingModule({ - declarations: [EventsListComponent] - }); - fixture = TestBed.createComponent(EventsListComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); -}); + // Initialize mocks + mockMatSnackBar = { + open: jest.fn() + } + + mockEventsService = { + getEvents: jest.fn(), + updateEvent: jest.fn() + } + + mockRouter = { + navigate: jest.fn() + } + + mockDialog = { + open: jest.fn() + } + + // Create component instance with mocked dependencies + component = new EventsListComponent( + mockEventsService as any, + mockMatSnackBar as any, + { snapshot: { url: [{ path: 'upcoming' }] } } as any, + mockRouter as any, + mockDialog as any + ) + }) + + describe('createEventRequest', () => { + it('should create correct request object for upcoming events', () => { + // Mock date for consistent testing + const mockDate = new Date('2024-02-14') + jest.spyOn(global, 'Date').mockImplementation(() => mockDate) + + component.pathUrl = 'upcoming' + const request = component['createEventRequest']() + + expect(request).toEqual({ + locale: ['en'], + request: { + query: '', + limit: 20, + offset: 0, + filters: { + status: ['Live'], + contentType: 'Event', + endDate: { '>=': '2024-02-14' } + }, + sort_by: { lastUpdatedOn: 'desc' } + } + }) + }) + + it('should throw error for invalid path URL', () => { + component.pathUrl = 'invalid-path' + expect(() => component['createEventRequest']()).toThrow('Invalid path URL: invalid-path') + }) + }) + + describe('contentEvents', () => { + const mockEventRow = { + identifier: 'test-id', + versionKey: 'v1' + } + + it('should handle view action correctly', () => { + component.contentEvents({ action: 'view', rows: mockEventRow }) + expect(mockRouter.navigate).toHaveBeenCalledWith( + ['/app/home/events/edit-event', 'test-id'], + expect.any(Object) + ) + }) + + it('should handle cancel action correctly', () => { + mockEventsService.updateEvent.mockReturnValue(of({ success: true })) + component.contentEvents({ action: 'cancel', rows: mockEventRow }) + expect(mockEventsService.updateEvent).toHaveBeenCalledWith( + { + request: { + event: { + identifier: 'test-id', + versionKey: 'v1', + status: 'Cancelled' + } + } + }, + 'test-id' + ) + }) + + it('should handle remarks action for event with reject comment', () => { + const eventWithRemarks = { + ...mockEventRow, + rejectComment: 'Test rejection reason' + } + + component.contentEvents({ action: 'remarks', rows: eventWithRemarks }) + expect(mockDialog.open).toHaveBeenCalled() + }) + + it('should not call any handler for unknown action', () => { + component.contentEvents({ action: 'unknown', rows: mockEventRow }) + expect(mockRouter.navigate).not.toHaveBeenCalled() + expect(mockEventsService.updateEvent).not.toHaveBeenCalled() + expect(mockDialog.open).not.toHaveBeenCalled() + }) + }) + + describe('handleError', () => { + it('should show error message from response', () => { + const error = new HttpErrorResponse({ + error: { message: 'Test error message' } + }) + + component['handleError'](error) + expect(mockMatSnackBar.open).toHaveBeenCalledWith( + 'Test error message', + 'Close', + expect.any(Object) + ) + }) + + it('should show default error message when no error message in response', () => { + const error = new HttpErrorResponse({}) + + component['handleError'](error) + expect(mockMatSnackBar.open).toHaveBeenCalledWith( + 'Something went wrong', + 'Close', + expect.any(Object) + ) + }) + }) + + describe('cancelEvent', () => { + const mockEvent = { + identifier: 'test-id', + versionKey: 'v1' + } + + it('should successfully cancel event and show success message', () => { + mockEventsService.updateEvent.mockReturnValue(of({ success: true })) + mockEventsService.getEvents.mockReturnValue(of([])) + + component.cancelEvent(mockEvent) + + expect(mockEventsService.updateEvent).toHaveBeenCalledWith( + expect.objectContaining({ + request: { + event: { + identifier: 'test-id', + versionKey: 'v1', + status: 'Cancelled' + } + } + }), + 'test-id' + ) + expect(mockMatSnackBar.open).toHaveBeenCalledWith( + 'event is cancelled successfully', + 'Close', + expect.any(Object) + ) + }) + + it('should handle error when cancelling event', () => { + const error = new HttpErrorResponse({ + error: { message: 'Cancel failed' } + }) + mockEventsService.updateEvent.mockReturnValue(throwError(() => error)) + + component.cancelEvent(mockEvent) + + expect(mockMatSnackBar.open).toHaveBeenCalledWith( + 'Cancel failed', + 'Close', + expect.any(Object) + ) + }) + }) + + describe('openRejectionPopup', () => { + it('should open dialog when rejection comment exists', () => { + const mockEvent = { + identifier: 'test-id', + versionKey: 'v1', + rejectComment: 'Test rejection reason' + } + + component.openRejectionPopup(mockEvent) + expect(mockDialog.open).toHaveBeenCalled() + }) + + it('should not open dialog when no rejection comment', () => { + const mockEvent = { + identifier: 'test-id', + versionKey: 'v1' + } + + component.openRejectionPopup(mockEvent) + expect(mockDialog.open).not.toHaveBeenCalled() + }) + }) +}) \ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.ts index 0ec2bc16f..7e2e9005e 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/events-list/events-list.component.ts @@ -6,6 +6,8 @@ import { Subscription } from 'rxjs' import { events } from '../../models/events.model' 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' @Component({ selector: 'ws-app-events-list', @@ -29,7 +31,8 @@ export class EventsListComponent implements OnInit, OnDestroy { private eventSvc: EventsService, private matSnackBar: MatSnackBar, private activatedRoute: ActivatedRoute, - private route: Router + private route: Router, + private dialog: MatLegacyDialog ) { } //#endregion @@ -302,6 +305,7 @@ export class EventsListComponent implements OnInit, OnDestroy { this.cancelEvent(events.rows) break case 'remarks': + this.openRejectionPopup(events.rows) break case 'broadcast': break @@ -322,13 +326,13 @@ export class EventsListComponent implements OnInit, OnDestroy { const requestBody = { request: { event: { + identifier: rowData.identifier, versionKey: rowData.versionKey, - status: 'Cancelled', - identifier: rowData.identifier + status: 'Cancelled' } } } - this.eventSvc.publishEvent(rowData.identifier, requestBody).subscribe({ + this.eventSvc.updateEvent(requestBody, rowData.identifier).subscribe({ next: res => { if (res) { this.openSnackBar('event is cancelled successfully') @@ -342,6 +346,17 @@ export class EventsListComponent implements OnInit, OnDestroy { }) } + openRejectionPopup(rowData: any) { + const remarks = _.get(rowData, 'rejectComment') + if (remarks) { + this.dialog.open(RejectionReasonComponent, { + minHeight: '200px', + minWidth: '400px', + data: remarks + }) + } + } + //#endregion private openSnackBar(message: string) { diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.html index 2cbf2d1ec..57fef5c8f 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.html @@ -25,11 +25,13 @@

- diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.scss index 5772133e8..75cce172f 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.scss +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.scss @@ -38,11 +38,12 @@ } .speaker-table-cell{ - height: 35px; + min-height: 35px; border: 1px solid #00000014; margin-top: -1px; font: 400 12px Inter; padding-left: 10px; + height: fit-content; } .edit-icon { diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.ts index c788b6411..1b767e20b 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/components/speakers/speakers.component.ts @@ -2,6 +2,7 @@ import { Component, Input } from '@angular/core' import { speaker } from '../../models/events.model' import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog' import { AddSpeakersComponent } from '../../dialogs/add-speakers/add-speakers.component' +import { MatLegacySnackBar } from '@angular/material/legacy-snack-bar' @Component({ selector: 'ws-app-speakers', @@ -15,6 +16,7 @@ export class SpeakersComponent { constructor( private dialog: MatDialog, + private matSnackBar: MatLegacySnackBar, ) { } openAddSpeakerPopu() { @@ -28,7 +30,11 @@ export class SpeakersComponent { dialogRef.afterClosed().subscribe((speakerDetails: speaker) => { if (speakerDetails) { - this.speakersList.push(speakerDetails) + if (this.speakersList.find((addedSpeaker: any) => addedSpeaker.email.toLowerCase() === speakerDetails.email.toLocaleLowerCase())) { + this.speakersList.push(speakerDetails) + } else { + this.openSnackBar('There is already a speaker with the same email. Please add the speaker with a different email.') + } } }) } @@ -46,7 +52,11 @@ export class SpeakersComponent { dialogRef.afterClosed().subscribe((speakerDetails: speaker) => { if (speakerDetails) { - this.speakersList[index] = speakerDetails + if (this.speakersList.find((addedSpeaker: any) => addedSpeaker.email.toLowerCase() === speakerDetails.email.toLocaleLowerCase())) { + this.speakersList[index] = speakerDetails + } else { + this.openSnackBar('There is already a speaker with the same email. Please update speaker with a different email.') + } } }) } @@ -57,4 +67,8 @@ export class SpeakersComponent { this.speakersList.splice(index, 1) } } + + private openSnackBar(message: string) { + this.matSnackBar.open(message) + } } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.html index 2b10f3279..74c6426e6 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.html @@ -41,9 +41,12 @@ + + name is mandatory +
-
+
Description
diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.ts index 8a89966ef..a6ca2bcbe 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/add-speakers/add-speakers.component.ts @@ -33,7 +33,7 @@ export class AddSpeakersComponent implements OnInit { ngOnInit(): void { this.speakerForm = this.formBuilder.group({ email: new FormControl(_.get(this.speakerDetails, 'email', ''), [Validators.required, Validators.pattern(EMAIL_PATTERN)]), - name: new FormControl(_.get(this.speakerDetails, 'name', '')), + name: new FormControl(_.get(this.speakerDetails, 'name', ''), [Validators.required]), description: new FormControl(_.get(this.speakerDetails, 'description', '')) }) @@ -96,8 +96,11 @@ export class AddSpeakersComponent implements OnInit { } addSpeaker() { - if (this.speakerForm && this.speakerForm.valid) { - this.dialogRef.close(this.speakerForm.value) + if (this.speakerForm) { + if (this.speakerForm.valid) { + this.dialogRef.close(this.speakerForm.value) + } + this.speakerForm.markAllAsTouched } } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.html index 2b3dfd5e6..bab2e9d7f 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.html +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.html @@ -63,7 +63,7 @@
icon - Upload Images * + Upload Image * Supported file types: PNG, JPG Max Size - 400MB
diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts index c9bc724e9..b8ed0cb6e 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/basic-info/basic-info.component.ts @@ -59,7 +59,7 @@ export class BasicInfoComponent implements OnInit { const reader = new FileReader() this.imagePath = files[0] if (this.imagePath && this.imagePath.size > events.IMAGE_MAX_SIZE) { - this.openSnackBar('Selected image size is more') + this.openSnackBar('Please select an image with a size of less than 400MB.') this.imagePath = '' return } @@ -72,6 +72,8 @@ export class BasicInfoComponent implements OnInit { onSave() { if (this.eventForm.valid && this.imgURL) { this.saveImage() + } else if (this.eventForm.valid && !this.imgURL) { + this.openSnackBar('please upload image') } } diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/rejection-reason/rejection-reason.component.html b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/rejection-reason/rejection-reason.component.html new file mode 100644 index 000000000..2eec00a16 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/rejection-reason/rejection-reason.component.html @@ -0,0 +1,10 @@ +
+
+
Remarks
+ clear +
+ +
+ {{rejectReason}} +
+
\ No newline at end of file diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/rejection-reason/rejection-reason.component.scss b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/rejection-reason/rejection-reason.component.scss new file mode 100644 index 000000000..0c291ebd4 --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/rejection-reason/rejection-reason.component.scss @@ -0,0 +1,16 @@ +.closIcon { + margin-right: -12px; + color: #666666; +} + +.remarks { + /* stylelint-disable */ + font: 600 17px Lato; + /* stylelint-enable */ +} + +.rejectReason { + /* stylelint-disable */ + font: 400 14px Lato; + /* stylelint-enable */ +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/rejection-reason/rejection-reason.component.spec.ts b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/rejection-reason/rejection-reason.component.spec.ts new file mode 100644 index 000000000..398f6779f --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/rejection-reason/rejection-reason.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { RejectionReasonComponent } from './rejection-reason.component'; + +describe('RejectionReasonComponent', () => { + let component: RejectionReasonComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [RejectionReasonComponent] + }); + fixture = TestBed.createComponent(RejectionReasonComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/rejection-reason/rejection-reason.component.ts b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/rejection-reason/rejection-reason.component.ts new file mode 100644 index 000000000..7952ef35b --- /dev/null +++ b/project/ws/app/src/lib/routes/home/routes/events-2/dialogs/rejection-reason/rejection-reason.component.ts @@ -0,0 +1,24 @@ +import { Component, Inject } from '@angular/core' +import { MAT_LEGACY_DIALOG_DATA, MatLegacyDialogRef } from '@angular/material/legacy-dialog' + +@Component({ + selector: 'ws-app-rejection-reason', + templateUrl: './rejection-reason.component.html', + styleUrls: ['./rejection-reason.component.scss'] +}) +export class RejectionReasonComponent { + + rejectReason: any + + constructor( + private dialogRef: MatLegacyDialogRef, + @Inject(MAT_LEGACY_DIALOG_DATA) data: any + ) { + this.rejectReason = data + } + + closeDialog() { + this.dialogRef.close() + } + +} diff --git a/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts b/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts index 6c95c1e20..e439d70d5 100644 --- a/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts +++ b/project/ws/app/src/lib/routes/home/routes/events-2/events-2.module.ts @@ -41,7 +41,8 @@ import { YoutubePlayerComponent } from './dialogs/youtube-player/youtube-player. import { MatLegacyTabsModule } from '@angular/material/legacy-tabs' import { CardCompetencyComponent } from './components/card-competency/card-competency.component' import { WidgetResolverModule } from '@sunbird-cb/resolver' -import { NgxMaterialTimepickerModule } from 'ngx-material-timepicker' +import { NgxMaterialTimepickerModule } from 'ngx-material-timepicker'; +import { RejectionReasonComponent } from './dialogs/rejection-reason/rejection-reason.component' // import { MatTimepickerModule } from 'mat-timepicker' @@ -61,7 +62,8 @@ import { NgxMaterialTimepickerModule } from 'ngx-material-timepicker' AddCompetencyComponent, EventsPreviewComponent, YoutubePlayerComponent, - CardCompetencyComponent + CardCompetencyComponent, + RejectionReasonComponent ], imports: [ CommonModule,
{{ speaker.description ? speaker.description : '-' }} edit - delete + + delete +
{{ speaker.name ? speaker.name : '-' }} {{ speaker.email ? speaker.email : '-' }} {{ speaker.description ? speaker.description : '-' }} - edit - - delete - + +
+ edit + + delete + +