Permalink
Show file tree
Hide file tree
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Showing
18 changed files
with
363 additions
and
27 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @@ -1,3 +1,47 @@ | ||
| <p> | ||
| manage-members works! | ||
| </p> | ||
| <div class="main-div mat-elevation-z2"> | ||
| <h3 class="heading">Manage Members</h3> | ||
| <mat-divider></mat-divider> | ||
| <div class="fineract-button"> | ||
| <a mat-raised-button color="primary" [routerLink]="['/navbar/add_member']"> | ||
| <mat-icon>add</mat-icon>Add Member</a> | ||
| </div> | ||
| <mat-form-field> | ||
| <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Filter by firstName/lastName"> | ||
| </mat-form-field> | ||
|
|
||
| <br> | ||
| <mat-divider></mat-divider> | ||
|
|
||
| <mat-table #table [dataSource]="dataSource"> | ||
|
|
||
| <!-- Position Column --> | ||
| <ng-container matColumnDef="id"> | ||
| <mat-header-cell *matHeaderCellDef>Code</mat-header-cell> | ||
| <mat-cell *matCellDef="let element"> | ||
| <a routerLink="{{element.id}}">{{element.id}}</a> | ||
| </mat-cell> | ||
| </ng-container> | ||
|
|
||
| <!-- Name Column --> | ||
| <ng-container matColumnDef="firstName"> | ||
| <mat-header-cell *matHeaderCellDef>First Name</mat-header-cell> | ||
| <mat-cell *matCellDef="let element"> {{element.firstName}} </mat-cell> | ||
| </ng-container> | ||
|
|
||
| <ng-container matColumnDef="lastName"> | ||
| <mat-header-cell *matHeaderCellDef>Last Name</mat-header-cell> | ||
| <mat-cell *matCellDef="let element"> {{element.lastName}} </mat-cell> | ||
| </ng-container> | ||
|
|
||
| <ng-container matColumnDef="status"> | ||
| <mat-header-cell *matHeaderCellDef>Current Status</mat-header-cell> | ||
| <mat-cell *matCellDef="let element"> {{element.status}} </mat-cell> | ||
| </ng-container> | ||
|
|
||
| <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row> | ||
| <mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row> | ||
| </mat-table> | ||
|
|
||
|
|
||
| </div> | ||
|
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @@ -0,0 +1,16 @@ | ||
| .my-div{ | ||
| margin-left: 2%; | ||
| margin-right:2%; | ||
| border-radius: 5px 5px 5px 5px; | ||
| background-color: #e6e6ff; | ||
| min-height: 100%; | ||
|
|
||
| } | ||
| table { | ||
| width: 100%; | ||
| } | ||
|
|
||
| .mat-form-field { | ||
| font-size: 14px; | ||
| width: 100%; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @@ -1,15 +1,35 @@ | ||
| import { Component, OnInit } from '@angular/core'; | ||
| import {MatTableDataSource} from '@angular/material'; | ||
|
|
||
| @Component({ | ||
| selector: 'app-manage-members', | ||
| templateUrl: './manage-members.component.html', | ||
| styleUrls: ['./manage-members.component.scss'] | ||
| }) | ||
| export class ManageMembersComponent implements OnInit { | ||
| displayedColumns = ['id','firstName','lastName','status']; | ||
| dataSource = new MatTableDataSource(ELEMENT_DATA); | ||
|
|
||
| applyFilter(filterValue: string) { | ||
| filterValue = filterValue.trim(); // Remove whitespace | ||
| filterValue = filterValue.toLowerCase(); // MatTableDataSource defaults to lowercase matches | ||
| this.dataSource.filter = filterValue; | ||
| } | ||
|
|
||
| constructor() { } | ||
|
|
||
| ngOnInit() { | ||
| } | ||
|
|
||
| } | ||
| export interface Element { | ||
| id: number; | ||
| firstName: string; | ||
| lastName: string; | ||
| status: boolean; | ||
|
|
||
| } | ||
|
|
||
| const ELEMENT_DATA: Element[] = [ | ||
|
|
||
| ]; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @@ -0,0 +1,63 @@ | ||
| <div class="main-div mat-elevation-z2"> | ||
| <h3 class="heading">Add Employee</h3> | ||
| <mat-divider></mat-divider> | ||
| <span>EMPLOYEE DETAILS</span> | ||
| <form class="fineract-form"> | ||
| <mat-form-field> | ||
| <input matInput placeholder="username"> | ||
| </mat-form-field> | ||
| <br/> | ||
| <mat-form-field> | ||
| <input matInput placeholder="Firstname"> | ||
| </mat-form-field> | ||
| <br/> | ||
| <mat-form-field> | ||
| <input matInput placeholder="Middlename"> | ||
| </mat-form-field> | ||
| <br/> | ||
| <mat-form-field> | ||
| <input matInput placeholder="Lastname"> | ||
| </mat-form-field> | ||
| <br/> | ||
| <mat-form-field> | ||
| <mat-select placeholder="Role"> | ||
| <mat-option *ngFor="let office of offices" [value]="office.value"> | ||
| {{ office.viewValue }} | ||
| </mat-option> | ||
| </mat-select> | ||
| </mat-form-field> | ||
| <br/> | ||
| <mat-form-field> | ||
| <mat-select placeholder="Office(optional)"> | ||
| <mat-option *ngFor="let office of offices" [value]="office.value"> | ||
| {{ office.viewValue }} | ||
| </mat-option> | ||
| </mat-select> | ||
| </mat-form-field> | ||
| <br/> | ||
| <mat-form-field> | ||
| <input matInput placeholder="Enter your password" [type]="hide ? 'password' : 'text'"> | ||
|
|
||
| </mat-form-field> | ||
|
|
||
| </form> | ||
|
|
||
| <span>EMPLOYEE CONTACT(OPTIONAL)</span> | ||
| <form class="fineract-form"> | ||
| <mat-form-field> | ||
| <input matInput placeholder="Email"> | ||
| </mat-form-field> | ||
| <br/> | ||
| <mat-form-field> | ||
| <input matInput placeholder="Phone"> | ||
| </mat-form-field> | ||
| <br/> | ||
| <mat-form-field> | ||
| <input matInput placeholder="Mobile"> | ||
| </mat-form-field> | ||
| </form> | ||
| <div> | ||
| <button mat-raised-button class="button1" color="primary">Submit</button> | ||
| <button mat-raised-button class="button2" color="warn">Cancel</button> | ||
| </div> | ||
| </div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @@ -0,0 +1,13 @@ | ||
| .fineract-form { | ||
| min-width: 150px; | ||
| max-width: 500px; | ||
| width: 100%; | ||
| } | ||
| .button1{ | ||
| margin-left: 50%; | ||
|
|
||
| } | ||
| .button1, .button2{ | ||
| width:20px; | ||
| display: inline-block; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @@ -0,0 +1,25 @@ | ||
| import { async, ComponentFixture, TestBed } from '@angular/core/testing'; | ||
|
|
||
| import { AddEmployeeComponent } from './add-employee.component'; | ||
|
|
||
| describe('AddEmployeeComponent', () => { | ||
| let component: AddEmployeeComponent; | ||
| let fixture: ComponentFixture<AddEmployeeComponent>; | ||
|
|
||
| beforeEach(async(() => { | ||
| TestBed.configureTestingModule({ | ||
| declarations: [ AddEmployeeComponent ] | ||
| }) | ||
| .compileComponents(); | ||
| })); | ||
|
|
||
| beforeEach(() => { | ||
| fixture = TestBed.createComponent(AddEmployeeComponent); | ||
| component = fixture.componentInstance; | ||
| fixture.detectChanges(); | ||
| }); | ||
|
|
||
| it('should create', () => { | ||
| expect(component).toBeTruthy(); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @@ -0,0 +1,27 @@ | ||
| import { Component, OnInit } from '@angular/core'; | ||
|
|
||
| @Component({ | ||
| selector: 'app-add-employee', | ||
| templateUrl: './add-employee.component.html', | ||
| styleUrls: ['./add-employee.component.scss'] | ||
| }) | ||
| export class AddEmployeeComponent implements OnInit { | ||
|
|
||
| hide = true; | ||
|
|
||
| offices = [ | ||
| {value: 'office-1', viewValue: 'Head office'}, | ||
|
|
||
| ]; | ||
|
|
||
| employees = [ | ||
| {value: '', viewValue: ''}, | ||
|
|
||
| ]; | ||
|
|
||
| constructor() { } | ||
|
|
||
| ngOnInit() { | ||
| } | ||
|
|
||
| } |
Oops, something went wrong.