diff --git a/src/app/pages/admin/admin-routing.module.ts b/src/app/pages/admin/admin-routing.module.ts new file mode 100644 index 0000000..c55c164 --- /dev/null +++ b/src/app/pages/admin/admin-routing.module.ts @@ -0,0 +1,12 @@ +import { NgModule } from '@angular/core'; +import { Routes, RouterModule } from '@angular/router'; + +import { AdminComponent } from './admin.component'; + +const routes: Routes = [{ path: '', component: AdminComponent }]; + +@NgModule({ + imports: [RouterModule.forChild(routes)], + exports: [RouterModule] +}) +export class AdminRoutingModule { } diff --git a/src/app/pages/admin/admin.component.html b/src/app/pages/admin/admin.component.html new file mode 100644 index 0000000..173015c --- /dev/null +++ b/src/app/pages/admin/admin.component.html @@ -0,0 +1,68 @@ + +
+ + + + + + +
+ + +
+
+ + Actions + +
+ + + Filter + + search + + + + + NAME + {{action.user}} + + + + ROLE + {{action.role}} + + + + ACTION + {{action.action}} + + + + STATUS + {{approvalStatus(action.approval)}} + + + + APPROVE + + + + + + + + + + +
+
+
+ +
+ + + +
+ diff --git a/src/app/pages/admin/admin.component.scss b/src/app/pages/admin/admin.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/pages/admin/admin.component.spec.ts b/src/app/pages/admin/admin.component.spec.ts new file mode 100644 index 0000000..1312d34 --- /dev/null +++ b/src/app/pages/admin/admin.component.spec.ts @@ -0,0 +1,61 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { AdminComponent } from './admin.component'; +import {HttpClient} from '@angular/common/http'; +import {HttpClientTestingModule, HttpTestingController} from '@angular/common/http/testing'; +import {AdminModule} from './admin.module'; +import {FooterStubComponent, SidebarStubComponent, TopbarStubComponent, UserServiceStub} from '../../../testing'; +import {AppModule} from '../../app.module'; +import {UserService} from '../../_services'; + +describe('AdminComponent', () => { + let component: AdminComponent; + let fixture: ComponentFixture; + let httpClient: HttpClient; + let httpTestingController: HttpTestingController; + let userService: UserServiceStub; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ + AdminComponent, + FooterStubComponent, + SidebarStubComponent, + TopbarStubComponent + ], + imports: [ + AdminModule, + AppModule, + HttpClientTestingModule, + ], + providers: [ + { provide: UserService, useClass: UserServiceStub } + ] + }) + .compileComponents(); + httpClient = TestBed.inject(HttpClient); + httpTestingController = TestBed.inject(HttpTestingController); + userService = new UserServiceStub(); + }); + + beforeEach(() => { + fixture = TestBed.createComponent(AdminComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); + + it('#approveAction should toggle approval status', () => { + const action = userService.getActionById('1'); + expect(action).toBe({ + id: 1, + user: 'Tom', + role: 'enroller', + action: 'Disburse RSV 100', + approval: false + }); + }); +}); diff --git a/src/app/pages/admin/admin.component.ts b/src/app/pages/admin/admin.component.ts new file mode 100644 index 0000000..543b2e4 --- /dev/null +++ b/src/app/pages/admin/admin.component.ts @@ -0,0 +1,43 @@ +import {AfterViewInit, Component, OnInit, ViewChild} from '@angular/core'; +import {MatTableDataSource} from '@angular/material/table'; +import {MatPaginator} from '@angular/material/paginator'; +import {MatSort} from '@angular/material/sort'; +import {UserService} from '../../_services'; + +@Component({ + selector: 'app-admin', + templateUrl: './admin.component.html', + styleUrls: ['./admin.component.scss'] +}) +export class AdminComponent implements OnInit, AfterViewInit { + dataSource: MatTableDataSource; + displayedColumns = ['user', 'role', 'action', 'status', 'approve']; + + @ViewChild(MatPaginator) paginator: MatPaginator; + @ViewChild(MatSort) sort: MatSort; + + constructor( + private userService: UserService + ) { } + + ngOnInit(): void { + this.dataSource = new MatTableDataSource(this.userService.actions); + } + + ngAfterViewInit(): void { + this.dataSource.paginator = this.paginator; + this.dataSource.sort = this.sort; + } + + doFilter(value: string): void { + this.dataSource.filter = value.trim().toLocaleLowerCase(); + } + + approvalStatus(status: boolean): string { + return status ? 'Approved' : 'Unapproved'; + } + + approveAction(action: any): void { + this.userService.approveAction(action.id); + } +} diff --git a/src/app/pages/admin/admin.module.ts b/src/app/pages/admin/admin.module.ts new file mode 100644 index 0000000..9d00e7a --- /dev/null +++ b/src/app/pages/admin/admin.module.ts @@ -0,0 +1,33 @@ +import { NgModule } from '@angular/core'; +import { CommonModule } from '@angular/common'; + +import { AdminRoutingModule } from './admin-routing.module'; +import { AdminComponent } from './admin.component'; +import {SharedModule} from '../../shared/shared.module'; +import {MatCardModule} from '@angular/material/card'; +import {MatFormFieldModule} from '@angular/material/form-field'; +import {MatInputModule} from '@angular/material/input'; +import {MatIconModule} from '@angular/material/icon'; +import {MatTableModule} from '@angular/material/table'; +import {MatSortModule} from '@angular/material/sort'; +import {MatPaginatorModule} from '@angular/material/paginator'; +import {MatButtonModule} from '@angular/material/button'; + + +@NgModule({ + declarations: [AdminComponent], + imports: [ + CommonModule, + AdminRoutingModule, + SharedModule, + MatCardModule, + MatFormFieldModule, + MatInputModule, + MatIconModule, + MatTableModule, + MatSortModule, + MatPaginatorModule, + MatButtonModule + ] +}) +export class AdminModule { }