This is an automated email from the ASF dual-hosted git repository. myrle pushed a commit to branch master in repository https://gitbox.apache.org/repos/asf/fineract-cn-group-finance.git
commit 5584af0088d6999c88b9af191c5113f780155b49 Author: pembemiriam <pembe.mir...@skylabase.com> AuthorDate: Tue May 29 12:49:43 2018 +0100 worked on some employee and customer components --- .../transaction-type.component.html | 2 +- src/app/app.module.ts | 9 +++- .../customer/add-member/add-member.component.html | 36 +++++++------ .../manage-members/manage-members.component.html | 50 +++++++++++++++-- .../manage-members/manage-members.component.scss | 16 ++++++ .../manage-members/manage-members.component.ts | 20 +++++++ src/app/dashboard/dashboard.component.html | 4 +- .../add-employee/add-employee.component.html | 63 ++++++++++++++++++++++ .../add-employee/add-employee.component.scss | 13 +++++ .../add-employee/add-employee.component.spec.ts | 25 +++++++++ .../add-employee/add-employee.component.ts | 27 ++++++++++ .../manage-employee.component.html} | 26 ++++----- .../manage-employee/manage-employee.component.scss | 16 ++++++ .../manage-employee.component.spec.ts | 25 +++++++++ .../manage-employee/manage-employee.component.ts | 35 ++++++++++++ src/app/login/login.component.html | 3 +- .../{login.component.css => login.component.scss} | 0 src/app/login/login.component.ts | 4 +- 18 files changed, 334 insertions(+), 40 deletions(-) diff --git a/src/app/accounting/transaction-type/transaction-type.component.html b/src/app/accounting/transaction-type/transaction-type.component.html index 9760c4f..6090aaa 100644 --- a/src/app/accounting/transaction-type/transaction-type.component.html +++ b/src/app/accounting/transaction-type/transaction-type.component.html @@ -2,7 +2,7 @@ <h3 class="heading">Transaction Types</h3> <mat-divider></mat-divider> <div class="fineract-button"> - <a mat-raised-button color="primary" [routerLink]="['/navbar/managereport/create']"> + <a mat-raised-button color="primary" [routerLink]="['/navbar/add_transaction_type']"> <mat-icon>add</mat-icon>Add Transaction Type</a> </div> <mat-form-field> diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 9f6b19f..561d641 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -56,7 +56,9 @@ import { TrialBalanceComponent } from './accounting/trial-balance/trial-balance. import { ChequeClearingComponent } from './accounting/cheque-clearing/cheque-clearing.component'; import { TransactionTypeComponent } from './accounting/transaction-type/transaction-type.component'; import { AddMemberComponent } from './customer/add-member/add-member.component'; -import { ManageMembersComponent } from './customer/manage-members/manage-members.component' +import { ManageMembersComponent } from './customer/manage-members/manage-members.component'; +import { AddEmployeeComponent } from './employee/add-employee/add-employee.component'; +import { ManageEmployeeComponent } from './employee/manage-employee/manage-employee.component' const appRoutes: Routes = [ { path: 'login', component: LoginComponent }, @@ -76,6 +78,9 @@ const appRoutes: Routes = [ { path: 'cheque_clearing', component: ChequeClearingComponent }, { path: 'transaction_type', component: TransactionTypeComponent }, { path: 'add_member', component: AddMemberComponent }, + { path: 'manage_members', component: ManageMembersComponent }, + { path: 'add_employee', component: AddEmployeeComponent }, + { path: 'manage_employees', component: ManageEmployeeComponent }, ] } ]; @@ -85,7 +90,7 @@ const appRoutes: Routes = [ declarations: [ AppComponent,LoginComponent, NavbarComponent, DashboardComponent, AccountingComponent, GeneralLedgerComponent, AddJournalEntryComponent, - PayrollsComponent, ChartOfAccountsComponent, AddTransactionTypeComponent, TrialBalanceComponent, ChequeClearingComponent, TransactionTypeComponent, AddMemberComponent, ManageMembersComponent + PayrollsComponent, ChartOfAccountsComponent, AddTransactionTypeComponent, TrialBalanceComponent, ChequeClearingComponent, TransactionTypeComponent, AddMemberComponent, ManageMembersComponent, AddEmployeeComponent, ManageEmployeeComponent ], imports: [RouterModule.forRoot(appRoutes), BrowserModule, BrowserAnimationsModule, diff --git a/src/app/customer/add-member/add-member.component.html b/src/app/customer/add-member/add-member.component.html index 97d5de1..98c10eb 100644 --- a/src/app/customer/add-member/add-member.component.html +++ b/src/app/customer/add-member/add-member.component.html @@ -24,40 +24,44 @@ <mat-datepicker #picker></mat-datepicker> </mat-form-field> </form> - <span>Address</span> + <span>ADDRESS</span> <form class="fineract-form"> <mat-form-field> - <input matInput placeholder="Lastname"> + <input matInput placeholder="Street"> </mat-form-field> <br/> <mat-form-field> - <input matInput placeholder="Lastname"> + <input matInput placeholder="City"> </mat-form-field> <br/> <mat-form-field> - <input matInput placeholder="Lastname"> + <input matInput placeholder="Postal code"> </mat-form-field> <br/> <mat-form-field> - <input matInput placeholder="Lastname"> + <input matInput placeholder="Country"> + </mat-form-field> + <br/> + <mat-form-field> + <input matInput placeholder="Region"> </mat-form-field> </form> -<span>Contact</span> +<span>CONTACT</span> <form class="fineract-form"> <mat-form-field> - <input matInput placeholder="Lastname"> + <input matInput placeholder="Email"> </mat-form-field> <br/> <mat-form-field> - <input matInput placeholder="Lastname"> + <input matInput placeholder="Phone"> </mat-form-field> <br/> <mat-form-field> - <input matInput placeholder="Lastname"> + <input matInput placeholder="Mobile"> </mat-form-field> </form> -<span>Assign member to office(optional)</span> -<form> +<span>ASSIGN MEMBER TO OFFICE(OPTIONAL)</span> +<form class="fineract-form"> <mat-form-field> <mat-select placeholder="Assigned office"> @@ -72,8 +76,8 @@ </mat-form-field> <button mat-raised-button color="primary">search</button> </form> -<span>Assign member to employee(optional)</span> -<form> +<span>ASSIGN MEMBER TO EMPLOYEE(OPTIONAL)</span> +<form class="fineract-form"> <mat-form-field> <mat-select placeholder="Assigned employee"> @@ -88,8 +92,8 @@ </mat-form-field> <button mat-raised-button color="primary">search</button> </form> -<span>Custom Fields</span> -<br/> +<span>CUSTOM FIELDS</span> +<form class="fineract-form"> <mat-form-field> <input matInput placeholder="Sample customer field"> </mat-form-field> @@ -97,7 +101,7 @@ <mat-form-field> <input matInput placeholder="employer"> </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> diff --git a/src/app/customer/manage-members/manage-members.component.html b/src/app/customer/manage-members/manage-members.component.html index 4d9c93b..d846c2d 100644 --- a/src/app/customer/manage-members/manage-members.component.html +++ b/src/app/customer/manage-members/manage-members.component.html @@ -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> + diff --git a/src/app/customer/manage-members/manage-members.component.scss b/src/app/customer/manage-members/manage-members.component.scss index e69de29..87b71f6 100644 --- a/src/app/customer/manage-members/manage-members.component.scss +++ b/src/app/customer/manage-members/manage-members.component.scss @@ -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%; + } \ No newline at end of file diff --git a/src/app/customer/manage-members/manage-members.component.ts b/src/app/customer/manage-members/manage-members.component.ts index fcacd18..dc9c822 100644 --- a/src/app/customer/manage-members/manage-members.component.ts +++ b/src/app/customer/manage-members/manage-members.component.ts @@ -1,4 +1,5 @@ import { Component, OnInit } from '@angular/core'; +import {MatTableDataSource} from '@angular/material'; @Component({ selector: 'app-manage-members', @@ -6,6 +7,14 @@ import { Component, OnInit } from '@angular/core'; 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() { } @@ -13,3 +22,14 @@ export class ManageMembersComponent implements OnInit { } } +export interface Element { + id: number; + firstName: string; + lastName: string; + status: boolean; + +} + +const ELEMENT_DATA: Element[] = [ + +]; diff --git a/src/app/dashboard/dashboard.component.html b/src/app/dashboard/dashboard.component.html index 8f280fd..e17d117 100644 --- a/src/app/dashboard/dashboard.component.html +++ b/src/app/dashboard/dashboard.component.html @@ -2,7 +2,7 @@ <span>Clients</span> <mat-list> <mat-list-item> - <span>View Members</span> | + <a [routerLink]="['/navbar/manage_members']">View Members</a> | <span>View Groups</span> </mat-list-item> </mat-list> @@ -21,7 +21,7 @@ <mat-list> <mat-list-item> <span>View Offices</span> | - <span>View Employees</span> + <a [routerLink]="['/navbar/manage_employees']">View Employees</a> </mat-list-item> </mat-list> </mat-card> diff --git a/src/app/employee/add-employee/add-employee.component.html b/src/app/employee/add-employee/add-employee.component.html new file mode 100644 index 0000000..4689635 --- /dev/null +++ b/src/app/employee/add-employee/add-employee.component.html @@ -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> \ No newline at end of file diff --git a/src/app/employee/add-employee/add-employee.component.scss b/src/app/employee/add-employee/add-employee.component.scss new file mode 100644 index 0000000..7109ed8 --- /dev/null +++ b/src/app/employee/add-employee/add-employee.component.scss @@ -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; + } \ No newline at end of file diff --git a/src/app/employee/add-employee/add-employee.component.spec.ts b/src/app/employee/add-employee/add-employee.component.spec.ts new file mode 100644 index 0000000..87be9fe --- /dev/null +++ b/src/app/employee/add-employee/add-employee.component.spec.ts @@ -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(); + }); +}); diff --git a/src/app/employee/add-employee/add-employee.component.ts b/src/app/employee/add-employee/add-employee.component.ts new file mode 100644 index 0000000..526ce35 --- /dev/null +++ b/src/app/employee/add-employee/add-employee.component.ts @@ -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() { + } + +} diff --git a/src/app/accounting/transaction-type/transaction-type.component.html b/src/app/employee/manage-employee/manage-employee.component.html similarity index 55% copy from src/app/accounting/transaction-type/transaction-type.component.html copy to src/app/employee/manage-employee/manage-employee.component.html index 9760c4f..c6b2e94 100644 --- a/src/app/accounting/transaction-type/transaction-type.component.html +++ b/src/app/employee/manage-employee/manage-employee.component.html @@ -1,12 +1,12 @@ <div class="main-div mat-elevation-z2"> - <h3 class="heading">Transaction Types</h3> + <h3 class="heading">Manage Employees</h3> <mat-divider></mat-divider> <div class="fineract-button"> - <a mat-raised-button color="primary" [routerLink]="['/navbar/managereport/create']"> - <mat-icon>add</mat-icon>Add Transaction Type</a> + <a mat-raised-button color="primary" [routerLink]="['/navbar/add_employee']"> + <mat-icon>add</mat-icon>Add Employee</a> </div> <mat-form-field> - <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Filter by name/code"> + <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Filter by firstName/lastName"> </mat-form-field> <br> @@ -15,22 +15,22 @@ <mat-table #table [dataSource]="dataSource"> <!-- Position Column --> - <ng-container matColumnDef="code"> + <ng-container matColumnDef="id"> <mat-header-cell *matHeaderCellDef>Code</mat-header-cell> <mat-cell *matCellDef="let element"> - <a routerLink="{{element.code}}">{{element.code}}</a> + <a routerLink="{{element.id}}">{{element.id}}</a> </mat-cell> </ng-container> <!-- Name Column --> - <ng-container matColumnDef="name"> - <mat-header-cell *matHeaderCellDef>Name</mat-header-cell> - <mat-cell *matCellDef="let element"> {{element.name}} </mat-cell> + <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="description"> - <mat-header-cell *matHeaderCellDef>Description</mat-header-cell> - <mat-cell *matCellDef="let element"> {{element.description}} </mat-cell> + <ng-container matColumnDef="lastName"> + <mat-header-cell *matHeaderCellDef>Last Name</mat-header-cell> + <mat-cell *matCellDef="let element"> {{element.lastName}} </mat-cell> </ng-container> <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row> @@ -39,4 +39,4 @@ </div> - \ No newline at end of file + diff --git a/src/app/employee/manage-employee/manage-employee.component.scss b/src/app/employee/manage-employee/manage-employee.component.scss new file mode 100644 index 0000000..87b71f6 --- /dev/null +++ b/src/app/employee/manage-employee/manage-employee.component.scss @@ -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%; + } \ No newline at end of file diff --git a/src/app/employee/manage-employee/manage-employee.component.spec.ts b/src/app/employee/manage-employee/manage-employee.component.spec.ts new file mode 100644 index 0000000..8ebc029 --- /dev/null +++ b/src/app/employee/manage-employee/manage-employee.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { ManageEmployeeComponent } from './manage-employee.component'; + +describe('ManageEmployeeComponent', () => { + let component: ManageEmployeeComponent; + let fixture: ComponentFixture<ManageEmployeeComponent>; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ ManageEmployeeComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(ManageEmployeeComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/employee/manage-employee/manage-employee.component.ts b/src/app/employee/manage-employee/manage-employee.component.ts new file mode 100644 index 0000000..ea62ebe --- /dev/null +++ b/src/app/employee/manage-employee/manage-employee.component.ts @@ -0,0 +1,35 @@ +import { Component, OnInit } from '@angular/core'; +import {MatTableDataSource} from '@angular/material'; + + +@Component({ + selector: 'app-manage-employee', + templateUrl: './manage-employee.component.html', + styleUrls: ['./manage-employee.component.scss'] +}) +export class ManageEmployeeComponent implements OnInit { + displayedColumns = ['id','firstName','lastName']; + 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; + +} + +const ELEMENT_DATA: Element[] = [ + +]; diff --git a/src/app/login/login.component.html b/src/app/login/login.component.html index d054765..9bbfd38 100644 --- a/src/app/login/login.component.html +++ b/src/app/login/login.component.html @@ -47,7 +47,8 @@ </div> <div class="app-input1"> <mat-form-field class="app-input2"> - <input matInput placeholder="Password"> + <input matInput placeholder="Enter your password" [type]="hide ? 'password' : 'text'"> + <mat-icon matSuffix (click)="hide = !hide">{{hide ? 'visibility' : 'visibility_off'}}</mat-icon> </mat-form-field> </div> <br> diff --git a/src/app/login/login.component.css b/src/app/login/login.component.scss similarity index 100% rename from src/app/login/login.component.css rename to src/app/login/login.component.scss diff --git a/src/app/login/login.component.ts b/src/app/login/login.component.ts index ceeab4e..7d1588e 100644 --- a/src/app/login/login.component.ts +++ b/src/app/login/login.component.ts @@ -6,12 +6,12 @@ import {Router } from '@angular/router' @Component({ selector: 'app-login', templateUrl: './login.component.html', - styleUrls: ['./login.component.css'] + styleUrls: ['./login.component.scss'] }) export class LoginComponent implements OnInit { selected = 'English'; - + hide= true; constructor(private _router: Router){}