start working on office and accounting components
diff --git a/src/app/accounting/account-payable/account-payable.component.html b/src/app/accounting/account-payable/account-payable.component.html
new file mode 100644
index 0000000..a4bed29
--- /dev/null
+++ b/src/app/accounting/account-payable/account-payable.component.html
@@ -0,0 +1,60 @@
+<div class="main-div mat-elevation-z2">
+ <h3 class="heading">Account Payable</h3>
+ <mat-divider></mat-divider>
+ <div class="fineract-button">
+ <a mat-raised-button color="primary" [routerLink]="['/navbar/add_cheque']">
+ <mat-icon>add</mat-icon>Add cheque</a>
+ </div>
+
+ <mat-form-field>
+ <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Filter by identifier">
+ </mat-form-field>
+
+<mat-table #table [dataSource]="dataSource">
+
+ <!-- Position Column -->
+ <ng-container matColumnDef="name">
+ <mat-header-cell *matHeaderCellDef>Name </mat-header-cell>
+ <mat-cell *matCellDef="let element">
+ <a routerLink="{{element.name}}">{{element.name}}</a>
+ </mat-cell>
+ </ng-container>
+
+ <!-- Name Column -->
+ <ng-container matColumnDef="branch">
+ <mat-header-cell *matHeaderCellDef>Branch</mat-header-cell>
+ <mat-cell *matCellDef="let element"> {{element.branch}} </mat-cell>
+ </ng-container>
+
+ <ng-container matColumnDef="bankAccount">
+ <mat-header-cell *matHeaderCellDef>Bank Account</mat-header-cell>
+ <mat-cell *matCellDef="let element"> {{element.bankAccount}} </mat-cell>
+ </ng-container>
+
+ <ng-container matColumnDef="payableAccount">
+ <mat-header-cell *matHeaderCellDef>Payable Account</mat-header-cell>
+ <mat-cell *matCellDef="let element"> {{element.payableAccount} </mat-cell>
+ </ng-container>
+
+ <ng-container matColumnDef="payee">
+ <mat-header-cell *matHeaderCellDef>Payee</mat-header-cell>
+ <mat-cell *matCellDef="let element"> {{element.payee} </mat-cell>
+ </ng-container>
+
+ <ng-container matColumnDef="currency">
+ <mat-header-cell *matHeaderCellDef>Currency</mat-header-cell>
+ <mat-cell *matCellDef="let element"> {{element.currency} </mat-cell>
+ </ng-container>
+
+ <ng-container matColumnDef="amount">
+ <mat-header-cell *matHeaderCellDef>amount</mat-header-cell>
+ <mat-cell *matCellDef="let element"> {{element.amount} </mat-cell>
+ </ng-container>
+
+ <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
+ <mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
+</mat-table>
+
+
+</div>
+
\ No newline at end of file
diff --git a/src/app/accounting/account-payable/account-payable.component.scss b/src/app/accounting/account-payable/account-payable.component.scss
new file mode 100644
index 0000000..0961a8e
--- /dev/null
+++ b/src/app/accounting/account-payable/account-payable.component.scss
@@ -0,0 +1,18 @@
+.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/accounting/account-payable/account-payable.component.spec.ts b/src/app/accounting/account-payable/account-payable.component.spec.ts
new file mode 100644
index 0000000..6e951ab
--- /dev/null
+++ b/src/app/accounting/account-payable/account-payable.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AccountPayableComponent } from './account-payable.component';
+
+describe('AccountPayableComponent', () => {
+ let component: AccountPayableComponent;
+ let fixture: ComponentFixture<AccountPayableComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ AccountPayableComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(AccountPayableComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/accounting/account-payable/account-payable.component.ts b/src/app/accounting/account-payable/account-payable.component.ts
new file mode 100644
index 0000000..7e4bbc8
--- /dev/null
+++ b/src/app/accounting/account-payable/account-payable.component.ts
@@ -0,0 +1,40 @@
+import { Component, OnInit } from '@angular/core';
+import {MatTableDataSource} from '@angular/material';
+
+
+@Component({
+ selector: 'app-account-payable',
+ templateUrl: './account-payable.component.html',
+ styleUrls: ['./account-payable.component.scss']
+})
+export class AccountPayableComponent implements OnInit {
+
+ displayedColumns = ['name','branch','bankAccount','payableAccount','payee','currency','amount'];
+ 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 {
+ name: string;
+ branch:string;
+ bankAccount: string;
+ payableAccount:string;
+ payee: number;
+ currency:Date;
+ amount:string;
+
+}
+
+const ELEMENT_DATA: Element[] = [
+
+];
diff --git a/src/app/accounting/add-cheque/add-cheque.component.html b/src/app/accounting/add-cheque/add-cheque.component.html
new file mode 100644
index 0000000..5d5da0e
--- /dev/null
+++ b/src/app/accounting/add-cheque/add-cheque.component.html
@@ -0,0 +1,56 @@
+<div class="main-div mat-elevation-z2">
+ <h3 class="heading">Add Cheque</h3>
+ <div class="fin-button">
+ <a mat-raised-button class="button1" color="primary" [routerLink]="['/navbar/add_cheque']">
+ Process cheque</a>
+ <a mat-raised-button class="button2" color="primary" [routerLink]="['/navbar/add_cheque']">
+ Print cheque</a>
+ </div>
+ <mat-divider></mat-divider>
+<form class="fineract-form">
+ <mat-form-field>
+ <mat-select placeholder="Template">
+ <mat-option *ngFor="let template of templates" [value]="template.value">
+ {{ template.viewValue }}
+ </mat-option>
+ </mat-select>
+ </mat-form-field>
+ <br/>
+ <mat-form-field>
+ <input matInput placeholder="Branch">
+ </mat-form-field>
+<br/>
+ <mat-form-field>
+ <input matInput placeholder="Bank account">
+ </mat-form-field>
+ <br/>
+ <mat-form-field>
+ <input matInput placeholder="Payable account">
+ </mat-form-field>
+ <br/>
+ <mat-form-field>
+ <input matInput placeholder="Payee">
+ </mat-form-field>
+ <br/>
+ <mat-form-field>
+ <input matInput placeholder="Amount">
+ </mat-form-field>
+ <br/>
+ <mat-form-field>
+ <mat-select placeholder="Currency">
+ <mat-option *ngFor="let currency of currencies" [value]="currency.value">
+ {{ currency.viewValue }}
+ </mat-option>
+ </mat-select>
+ </mat-form-field>
+ <br/>
+ <mat-form-field>
+ <input matInput placeholder="Cheque number">
+ </mat-form-field>
+ <br/>
+ </form>
+
+ <div>
+ <button mat-raised-button class="button1" color="warn">Cancel</button>
+ </div>
+</div>
\ No newline at end of file
diff --git a/src/app/accounting/add-cheque/add-cheque.component.scss b/src/app/accounting/add-cheque/add-cheque.component.scss
new file mode 100644
index 0000000..3bf8f37
--- /dev/null
+++ b/src/app/accounting/add-cheque/add-cheque.component.scss
@@ -0,0 +1,17 @@
+.fineract-form {
+ min-width: 150px;
+ max-width: 500px;
+ width: 100%;
+ }
+
+ //changed
+ .button1{
+ margin-left: 60%;
+
+ }
+ .button1, .button2{
+ width:150px;
+ display: inline-block;
+ }
+
+
\ No newline at end of file
diff --git a/src/app/accounting/add-cheque/add-cheque.component.spec.ts b/src/app/accounting/add-cheque/add-cheque.component.spec.ts
new file mode 100644
index 0000000..61af568
--- /dev/null
+++ b/src/app/accounting/add-cheque/add-cheque.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AddChequeComponent } from './add-cheque.component';
+
+describe('AddChequeComponent', () => {
+ let component: AddChequeComponent;
+ let fixture: ComponentFixture<AddChequeComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ AddChequeComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(AddChequeComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/accounting/add-cheque/add-cheque.component.ts b/src/app/accounting/add-cheque/add-cheque.component.ts
new file mode 100644
index 0000000..978a8cf
--- /dev/null
+++ b/src/app/accounting/add-cheque/add-cheque.component.ts
@@ -0,0 +1,26 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+ selector: 'app-add-cheque',
+ templateUrl: './add-cheque.component.html',
+ styleUrls: ['./add-cheque.component.scss']
+})
+export class AddChequeComponent implements OnInit {
+
+ templates = [
+ {value: '', viewValue: ''},
+
+ ];
+
+ currencies = [
+ {value: '', viewValue: ''},
+
+ ];
+
+
+ constructor() { }
+
+ ngOnInit() {
+ }
+
+}
diff --git a/src/app/accounting/add-ledger/add-ledger.component.html b/src/app/accounting/add-ledger/add-ledger.component.html
new file mode 100644
index 0000000..992015e
--- /dev/null
+++ b/src/app/accounting/add-ledger/add-ledger.component.html
@@ -0,0 +1,94 @@
+<div class="main-div mat-elevation-z2">
+ <h3 class="heading">Add Ledger</h3>
+ <mat-divider></mat-divider>
+ <br/>
+
+<form class="fineract-form">
+ <mat-form-field>
+ <input matInput placeholder="Ledger number">
+ </mat-form-field>
+</form>
+
+<mat-tab-group>
+ <mat-tab label="Asset">
+ <form class="fineract-form">
+ <mat-form-field>
+ <input matInput placeholder="Name">
+ </mat-form-field>
+ <br/>
+ <mat-form-field>
+ <input matInput placeholder="Description">
+ </mat-form-field>
+ </form>
+ <mat-checkbox>Show account in chart</mat-checkbox>
+ <div>
+ <button mat-raised-button class="button1" color="primary">Submit</button>
+ <button mat-raised-button class="button2" color="warn">Cancel</button>
+ </div>
+ </mat-tab>
+ <mat-tab label="Liability">
+ <form class="fineract-form">
+ <mat-form-field>
+ <input matInput placeholder="Name">
+ </mat-form-field>
+ <br/>
+ <mat-form-field>
+ <input matInput placeholder="Description">
+ </mat-form-field>
+ </form>
+ <mat-checkbox>Show account in chart</mat-checkbox>
+ <div>
+ <button mat-raised-button class="button1" color="primary">Submit</button>
+ <button mat-raised-button class="button2" color="warn">Cancel</button>
+ </div>
+ </mat-tab>
+ <mat-tab label="Equity">
+ <form class="fineract-form">
+ <mat-form-field>
+ <input matInput placeholder="Name">
+ </mat-form-field>
+ <br/>
+ <mat-form-field>
+ <input matInput placeholder="Description">
+ </mat-form-field>
+ </form>
+ <mat-checkbox>Show account in chart</mat-checkbox>
+ <div>
+ <button mat-raised-button class="button1" color="primary">Submit</button>
+ <button mat-raised-button class="button2" color="warn">Cancel</button>
+ </div>
+ </mat-tab>
+ <mat-tab label="Expense">
+ <form class="fineract-form">
+ <mat-form-field>
+ <input matInput placeholder="Name">
+ </mat-form-field>
+ <br/>
+ <mat-form-field>
+ <input matInput placeholder="Description">
+ </mat-form-field>
+ </form>
+ <mat-checkbox>Show account in chart</mat-checkbox>
+ <div>
+ <button mat-raised-button class="button1" color="primary">Submit</button>
+ <button mat-raised-button class="button2" color="warn">Cancel</button>
+ </div>
+ </mat-tab>
+ <mat-tab label="Revenue">
+ <form class="fineract-form">
+ <mat-form-field>
+ <input matInput placeholder="Name">
+ </mat-form-field>
+ <br/>
+ <mat-form-field>
+ <input matInput placeholder="Description">
+ </mat-form-field>
+ </form>
+ <mat-checkbox>Show account in chart</mat-checkbox>
+ <div>
+ <button mat-raised-button class="button1" color="primary">Submit</button>
+ <button mat-raised-button class="button2" color="warn">Cancel</button>
+ </div>
+ </mat-tab>
+</mat-tab-group>
+
diff --git a/src/app/accounting/add-ledger/add-ledger.component.scss b/src/app/accounting/add-ledger/add-ledger.component.scss
new file mode 100644
index 0000000..7109ed8
--- /dev/null
+++ b/src/app/accounting/add-ledger/add-ledger.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/accounting/add-ledger/add-ledger.component.spec.ts b/src/app/accounting/add-ledger/add-ledger.component.spec.ts
new file mode 100644
index 0000000..0e5555b
--- /dev/null
+++ b/src/app/accounting/add-ledger/add-ledger.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AddLedgerComponent } from './add-ledger.component';
+
+describe('AddLedgerComponent', () => {
+ let component: AddLedgerComponent;
+ let fixture: ComponentFixture<AddLedgerComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ AddLedgerComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(AddLedgerComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/accounting/add-ledger/add-ledger.component.ts b/src/app/accounting/add-ledger/add-ledger.component.ts
new file mode 100644
index 0000000..cc3126a
--- /dev/null
+++ b/src/app/accounting/add-ledger/add-ledger.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+ selector: 'app-add-ledger',
+ templateUrl: './add-ledger.component.html',
+ styleUrls: ['./add-ledger.component.scss']
+})
+export class AddLedgerComponent implements OnInit {
+
+ constructor() { }
+
+ ngOnInit() {
+ }
+
+}
diff --git a/src/app/accounting/add-payroll/add-payroll.component.html b/src/app/accounting/add-payroll/add-payroll.component.html
new file mode 100644
index 0000000..f5c0137
--- /dev/null
+++ b/src/app/accounting/add-payroll/add-payroll.component.html
@@ -0,0 +1,29 @@
+<div class="main-div mat-elevation-z2">
+ <h3 class="heading">Add Payroll</h3>
+ <mat-divider></mat-divider>
+
+<form class="fineract-form">
+ <mat-form-field>
+ <input matInput placeholder="Account">
+ </mat-form-field>
+ <br/>
+ <mat-form-field>
+ <input matInput placeholder="Member">
+ </mat-form-field>
+ <mat-form-field>
+ <input matInput placeholder="Employer">
+ </mat-form-field>
+ <mat-form-field>
+ <input matInput placeholder="Salary">
+ </mat-form-field>
+ <button mat-icon-button color="warn"><mat-icon>clear</mat-icon></button>
+</form>
+<div style="margin-left: 80%;">
+ <button mat-raised-button color="primary">Add Payment</button>
+</div>
+<div>
+ <button mat-raised-button class="button1" color="primary">Submit</button>
+ <button mat-raised-button class="button2" color="warn">Cancel</button>
+ </div>
+ </div>
+
diff --git a/src/app/accounting/add-payroll/add-payroll.component.scss b/src/app/accounting/add-payroll/add-payroll.component.scss
new file mode 100644
index 0000000..33ff61b
--- /dev/null
+++ b/src/app/accounting/add-payroll/add-payroll.component.scss
@@ -0,0 +1,13 @@
+.fineract-form {
+ min-width: 150px;
+ max-width: 1000px;
+ width: 100%;
+ }
+ .button1{
+ margin-left: 50%;
+
+ }
+ .button1, .button2{
+ width:20px;
+ display: inline-block;
+ }
\ No newline at end of file
diff --git a/src/app/accounting/add-payroll/add-payroll.component.spec.ts b/src/app/accounting/add-payroll/add-payroll.component.spec.ts
new file mode 100644
index 0000000..1a31bd1
--- /dev/null
+++ b/src/app/accounting/add-payroll/add-payroll.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AddPayrollComponent } from './add-payroll.component';
+
+describe('AddPayrollComponent', () => {
+ let component: AddPayrollComponent;
+ let fixture: ComponentFixture<AddPayrollComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ AddPayrollComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(AddPayrollComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/accounting/add-payroll/add-payroll.component.ts b/src/app/accounting/add-payroll/add-payroll.component.ts
new file mode 100644
index 0000000..bc72cb9
--- /dev/null
+++ b/src/app/accounting/add-payroll/add-payroll.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+ selector: 'app-add-payroll',
+ templateUrl: './add-payroll.component.html',
+ styleUrls: ['./add-payroll.component.scss']
+})
+export class AddPayrollComponent implements OnInit {
+
+ constructor() { }
+
+ ngOnInit() {
+ }
+
+}
diff --git a/src/app/accounting/general-ledger/general-ledger.component.html b/src/app/accounting/general-ledger/general-ledger.component.html
index f65ec3d..6d76381 100644
--- a/src/app/accounting/general-ledger/general-ledger.component.html
+++ b/src/app/accounting/general-ledger/general-ledger.component.html
@@ -2,7 +2,7 @@
<h3 class="heading">General Ledger</h3>
<mat-divider></mat-divider>
<div class="fineract-button">
- <a mat-raised-button color="primary" [routerLink]="['/navbar/add-ledger']">
+ <a mat-raised-button color="primary" [routerLink]="['/navbar/add_ledger']">
<mat-icon>add</mat-icon>Add Ledger</a>
</div>
<mat-form-field>
diff --git a/src/app/accounting/payrolls/payrolls.component.html b/src/app/accounting/payrolls/payrolls.component.html
index d361809..9f8be54 100644
--- a/src/app/accounting/payrolls/payrolls.component.html
+++ b/src/app/accounting/payrolls/payrolls.component.html
@@ -2,7 +2,7 @@
<h3 class="heading">Payrolls</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_payroll']">
<mat-icon>add</mat-icon>Add Payroll</a>
</div>
<mat-form-field>
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 561d641..f257139 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -58,7 +58,13 @@
import { AddMemberComponent } from './customer/add-member/add-member.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'
+import { ManageEmployeeComponent } from './employee/manage-employee/manage-employee.component';
+import { AddOfficeComponent } from './office/add-office/add-office.component';
+import { ViewOfficesComponent } from './office/view-offices/view-offices.component';
+import { AddLedgerComponent } from './accounting/add-ledger/add-ledger.component';
+import { AccountPayableComponent } from './accounting/account-payable/account-payable.component';
+import { AddChequeComponent } from './accounting/add-cheque/add-cheque.component';
+import { AddPayrollComponent } from './accounting/add-payroll/add-payroll.component'
const appRoutes: Routes = [
{ path: 'login', component: LoginComponent },
@@ -81,6 +87,12 @@
{ path: 'manage_members', component: ManageMembersComponent },
{ path: 'add_employee', component: AddEmployeeComponent },
{ path: 'manage_employees', component: ManageEmployeeComponent },
+ { path: 'view_offices', component: ViewOfficesComponent },
+ { path: 'add_office', component: AddOfficeComponent },
+ { path: 'add_ledger', component: AddLedgerComponent },
+ { path: 'account_payable', component: AccountPayableComponent },
+ { path: 'add_cheque', component: AddChequeComponent },
+ { path: 'add_payroll', component: AddPayrollComponent },
]
}
];
@@ -90,7 +102,7 @@
declarations: [
AppComponent,LoginComponent, NavbarComponent, DashboardComponent,
AccountingComponent, GeneralLedgerComponent, AddJournalEntryComponent,
- PayrollsComponent, ChartOfAccountsComponent, AddTransactionTypeComponent, TrialBalanceComponent, ChequeClearingComponent, TransactionTypeComponent, AddMemberComponent, ManageMembersComponent, AddEmployeeComponent, ManageEmployeeComponent
+ PayrollsComponent, ChartOfAccountsComponent, AddTransactionTypeComponent, TrialBalanceComponent, ChequeClearingComponent, TransactionTypeComponent, AddMemberComponent, ManageMembersComponent, AddEmployeeComponent, ManageEmployeeComponent, AddOfficeComponent, ViewOfficesComponent, AddLedgerComponent, AccountPayableComponent, AddChequeComponent, AddPayrollComponent
],
imports: [RouterModule.forRoot(appRoutes),
BrowserModule, BrowserAnimationsModule,
diff --git a/src/app/dashboard/dashboard.component.html b/src/app/dashboard/dashboard.component.html
index e17d117..3a5c3c2 100644
--- a/src/app/dashboard/dashboard.component.html
+++ b/src/app/dashboard/dashboard.component.html
@@ -20,7 +20,7 @@
<span>Organisation</span>
<mat-list>
<mat-list-item>
- <span>View Offices</span> |
+ <a [routerLink]="['/navbar/view_offices']">View Offices</a> |
<a [routerLink]="['/navbar/manage_employees']">View Employees</a>
</mat-list-item>
</mat-list>
diff --git a/src/app/navbar/navbar.component.html b/src/app/navbar/navbar.component.html
index 2a35c37..a793414 100644
--- a/src/app/navbar/navbar.component.html
+++ b/src/app/navbar/navbar.component.html
@@ -20,7 +20,7 @@
<mat-icon>arrow_drop_down</mat-icon>
</button>
<mat-menu #client="matMenu">
- <a mat-menu-item [routerLink]="['/navbar/client']">Client</a>
+ <a mat-menu-item [routerLink]="['/navbar/manage_members']">Client</a>
<a mat-menu-item [routerLink]="['/navbar/group']">Group</a>
<a mat-menu-item [routerLink]="['/navbar/center']">Center</a>
</mat-menu>
diff --git a/src/app/office/add-office/add-office.component.html b/src/app/office/add-office/add-office.component.html
new file mode 100644
index 0000000..0a8ab41
--- /dev/null
+++ b/src/app/office/add-office/add-office.component.html
@@ -0,0 +1,44 @@
+<div class="main-div mat-elevation-z2">
+ <h3 class="heading">Add Office</h3>
+ <mat-divider></mat-divider>
+ <span>OFFICCE INFORMATION</span>
+<form class="fineract-form">
+ <mat-form-field>
+ <input matInput placeholder="Identifier">
+ </mat-form-field>
+<br/>
+ <mat-form-field>
+ <input matInput placeholder="Name">
+ </mat-form-field>
+<br/>
+ <mat-form-field>
+ <input matInput placeholder="Description">
+ </mat-form-field>
+</form>
+<span>ADDRESS</span>
+<form class="fineract-form">
+<mat-form-field>
+ <input matInput placeholder="Street">
+</mat-form-field>
+<br/>
+<mat-form-field>
+ <input matInput placeholder="City">
+</mat-form-field>
+<br/>
+<mat-form-field>
+ <input matInput placeholder="Postal code">
+</mat-form-field>
+<br/>
+<mat-form-field>
+ <input matInput placeholder="Country">
+</mat-form-field>
+<br/>
+<mat-form-field>
+ <input matInput placeholder="Region">
+</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/office/add-office/add-office.component.scss b/src/app/office/add-office/add-office.component.scss
new file mode 100644
index 0000000..7109ed8
--- /dev/null
+++ b/src/app/office/add-office/add-office.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/office/add-office/add-office.component.spec.ts b/src/app/office/add-office/add-office.component.spec.ts
new file mode 100644
index 0000000..c45da18
--- /dev/null
+++ b/src/app/office/add-office/add-office.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AddOfficeComponent } from './add-office.component';
+
+describe('AddOfficeComponent', () => {
+ let component: AddOfficeComponent;
+ let fixture: ComponentFixture<AddOfficeComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ AddOfficeComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(AddOfficeComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/office/add-office/add-office.component.ts b/src/app/office/add-office/add-office.component.ts
new file mode 100644
index 0000000..79d64af
--- /dev/null
+++ b/src/app/office/add-office/add-office.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+ selector: 'app-add-office',
+ templateUrl: './add-office.component.html',
+ styleUrls: ['./add-office.component.scss']
+})
+export class AddOfficeComponent implements OnInit {
+
+ constructor() { }
+
+ ngOnInit() {
+ }
+
+}
diff --git a/src/app/office/view-offices/view-offices.component.html b/src/app/office/view-offices/view-offices.component.html
new file mode 100644
index 0000000..afb9f7f
--- /dev/null
+++ b/src/app/office/view-offices/view-offices.component.html
@@ -0,0 +1,43 @@
+<div class="main-div mat-elevation-z2">
+<h3 class="heading">View Offices</h3>
+<mat-divider></mat-divider>
+<div class="fineract-button">
+<a mat-raised-button color="primary" [routerLink]="['/navbar/add_office']">
+ <mat-icon>add</mat-icon>Add Office</a>
+ </div>
+<mat-form-field>
+ <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Filter by name">
+</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="name">
+ <mat-header-cell *matHeaderCellDef> Name</mat-header-cell>
+ <mat-cell *matCellDef="let element"> {{element.name}} </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>
+
+<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/office/view-offices/view-offices.component.scss b/src/app/office/view-offices/view-offices.component.scss
new file mode 100644
index 0000000..87b71f6
--- /dev/null
+++ b/src/app/office/view-offices/view-offices.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/office/view-offices/view-offices.component.spec.ts b/src/app/office/view-offices/view-offices.component.spec.ts
new file mode 100644
index 0000000..2d0d3c7
--- /dev/null
+++ b/src/app/office/view-offices/view-offices.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ViewOfficesComponent } from './view-offices.component';
+
+describe('ViewOfficesComponent', () => {
+ let component: ViewOfficesComponent;
+ let fixture: ComponentFixture<ViewOfficesComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ ViewOfficesComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(ViewOfficesComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/office/view-offices/view-offices.component.ts b/src/app/office/view-offices/view-offices.component.ts
new file mode 100644
index 0000000..aed8376
--- /dev/null
+++ b/src/app/office/view-offices/view-offices.component.ts
@@ -0,0 +1,35 @@
+import { Component, OnInit } from '@angular/core';
+import {MatTableDataSource} from '@angular/material';
+
+@Component({
+ selector: 'app-view-offices',
+ templateUrl: './view-offices.component.html',
+ styleUrls: ['./view-offices.component.scss']
+})
+export class ViewOfficesComponent implements OnInit {
+
+ displayedColumns = ['id','name','description'];
+ 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;
+ name: string;
+ description: string;
+
+}
+
+const ELEMENT_DATA: Element[] = [
+
+];