starting customer components

src/app/accounting/accounting.component.html

@@ -4,28 +4,28 @@ <h3 class="heading">Accounting</h3>
   <mat-card class="card">
     <mat-list>
       <mat-list-item>
-        <a [routerLink]="['/navbar/frequentpostings']">
+        <a [routerLink]="['/navbar/chart_of_accounts']">
           <mat-icon>domain</mat-icon>Chart of accounts
           <br> List of the accounts used by the organisation
         </a>
       </mat-list-item>
       <mat-divider></mat-divider>
       <mat-list-item>
-        <a [routerLink]="['/navbar/addjournalentry']">
+        <a [routerLink]="['/navbar/journal_entry']">
           <mat-icon>add</mat-icon>Journal Entries
           <br> Manual journal entry transactions recorded in a journal
         </a>
       </mat-list-item>
       <mat-divider></mat-divider>
       <mat-list-item>
-        <a [routerLink]="['/navbar/searchjournal']">
+        <a [routerLink]="['/navbar/transaction_type']">
           <mat-icon>search</mat-icon>Transaction Types
           <br> Advance search option for journal entries
         </a>
       </mat-list-item>
       <mat-divider></mat-divider>
       <mat-list-item>
-        <a [routerLink]="['/navbar/financialactivity']">
+        <a [routerLink]="['/navbar/cheque_clearing']">
           <mat-icon>shuffle</mat-icon>Cheque Clearing
           <br> List of Financial Activity and GL Accounnt Mappings
         </a>
@@ -37,28 +37,28 @@ <h3 class="heading">Accounting</h3>
   <mat-card class="card1">
     <mat-list>
       <mat-list-item>
-        <a [routerLink]="['/navbar/chartaccount']">
+        <a [routerLink]="['/navbar/trial_balance']">
           <mat-icon>domain</mat-icon>Trial Balance
           <br> List of the accounts used by the organisation
         </a>
       </mat-list-item>
       <mat-divider></mat-divider>
       <mat-list-item>
-        <a [routerLink]="['/navbar/accountclosure']">
+        <a [routerLink]="['/navbar/']">
           <mat-icon>folder</mat-icon>Income Statement
           <br> Journal Entries made at the end of the accounting period
         </a>
       </mat-list-item>
       <mat-divider></mat-divider>
       <mat-list-item>
-        <a [routerLink]="['/navbar/accountingrules']">
+        <a [routerLink]="['/navbar/']">
           <mat-icon>lock</mat-icon>Financial Condition
           <br> Lists all Accounting rules
         </a>
       </mat-list-item>
       <mat-divider></mat-divider>
       <mat-list-item>
-        <a [routerLink]="['/navbar/accruals']">
+        <a [routerLink]="['/navbar/payroll']">
           <mat-icon>settings</mat-icon>Payroll
           <br> Accrues income,expenses and liabilities as on the provided date
         </a>

src/app/accounting/accounting.component.scss

@@ -2,7 +2,7 @@
     margin-left: 2%;
     margin-right:2%;
     border-radius: 5px 5px 5px 5px;
-    background-color: #e6e6ff;
+    background-color: white;
     min-height: 100%;
 
 }

src/app/accounting/accounting.component.ts

@@ -1,5 +1,6 @@
 import { Component, OnInit } from '@angular/core';
 
+
 @Component({
   selector: 'app-accounting',
   templateUrl: './accounting.component.html',

src/app/accounting/add-journal-entry/add-journal-entry.component.html

@@ -3,9 +3,9 @@
   <a [routerLink]="['/navbar/accounting']">Accounting</a>
   <span class="current-page">/ Add Journal Entry</span>
 </p>
-
 <div class="main-div mat-elevation-z2">
   <h3 class="heading">Add Journal Entry</h3>
+  <mat-divider></mat-divider>
   <form class="fineract-form">
   <mat-form-field>
     <input matInput [matDatepicker]="picker" placeholder="Transaction date">
@@ -25,29 +25,35 @@ <h3 class="heading">Add Journal Entry</h3>
     <textarea matInput placeholder="Leave a comment"></textarea>
   </mat-form-field>
   </form>
-
-  <span>Affected Accounts</span>
-  <mat-card>
+<div>
+  <span><b>Affected Accounts</b></span>
+  <br/>
+  <mat-card class="debit-card">
     <span>Debit</span>
+    <br/>
     <mat-form-field>
       <input matInput placeholder="Account">
     </mat-form-field>
     <mat-form-field>
       <input matInput placeholder="Amount">
     </mat-form-field>
-    <button mat-raised-button color="warn"><mat-icon>clear</mat-icon></button>
-    <button mat-raised-button color="primary">Add Debit</button>
+    <button mat-icon-button color="warn"><mat-icon>clear</mat-icon></button>
+    <br/>
+    <button mat-raised-button class="button" color="primary">Add Debit</button>
   </mat-card>
-  <mat-card>
+  <mat-card class="credit-card">
     <span>Credit</span>
+    <br/>
     <mat-form-field>
       <input matInput placeholder="Account">
     </mat-form-field>
     <mat-form-field>
       <input matInput placeholder="Amount">
     </mat-form-field>
-    <button mat-raised-button color="warn"><mat-icon>clear</mat-icon></button>
-    <button mat-raised-button color="primary">Add Credit</button>
+    <button mat-icon-button color="warn"><mat-icon>clear</mat-icon></button>
+    <br/>
+    <button mat-raised-button class="button" color="primary">Add Credit</button>
   </mat-card>
 </div>
+</div>
 </div>

src/app/accounting/add-journal-entry/add-journal-entry.component.scss

@@ -8,4 +8,17 @@
   .input {
     width: 100%;
   }
+  .debit-card,.credit-card{
+
+    display: inline-block;
+
+    width: 395px;
+
+
+
+  }
+
+  .button{
+    margin-left: 260px;
+  }
 

src/app/accounting/add-transaction-type/add-transaction-type.component.html

@@ -1,19 +1,23 @@
-<div class="my-div mat-elevation-z2">
-  <h3 class="heading">General Ledger</h3>
+<div class="main-div mat-elevation-z2">
+  <h3 class="heading">Add transaction Type</h3>
   <mat-divider></mat-divider>
+  <br/>
   <span>Transaction Type</span>
-
+<form class="fineract-form">
   <mat-form-field>
     <input matInput placeholder="Code">
   </mat-form-field>
-
+<br/>
   <mat-form-field>
     <input matInput placeholder="Name">
   </mat-form-field>
-
+<br/>
   <mat-form-field>
     <textarea matInput placeholder="Description(optional)"></textarea>
   </mat-form-field>
-
-  <button mat-raise-button>Submit</button>
-  <button mat-raise-button>Cancel</button>
+  </form>
+  <div>
+  <button mat-raised-button class="button1" color="primary">Submit</button>
+  <button mat-raised-button class="button2" color="warn">Cancel</button>
+  </div>
+</div>

src/app/accounting/add-transaction-type/add-transaction-type.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;
+  }

src/app/accounting/payrolls/payrolls.component.html

@@ -1,4 +1,4 @@
-<div class="my-div mat-elevation-z2">
+<div class="main-div mat-elevation-z2">
   <h3 class="heading">Payrolls</h3>
   <mat-divider></mat-divider>
   <div class="fineract-button">

src/app/accounting/transaction-type/transaction-type.component.html

@@ -0,0 +1,42 @@
+<div class="main-div mat-elevation-z2">
+  <h3 class="heading">Transaction Types</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>
+    </div>
+  <mat-form-field>
+    <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Filter by name/code">
+  </mat-form-field>
+
+<br>
+<mat-divider></mat-divider>
+
+<mat-table #table [dataSource]="dataSource">
+
+  <!-- Position Column -->
+  <ng-container matColumnDef="code">
+    <mat-header-cell *matHeaderCellDef>Code</mat-header-cell>
+    <mat-cell *matCellDef="let element">
+      <a routerLink="{{element.code}}">{{element.code}}</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>
+

src/app/accounting/transaction-type/transaction-type.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%;
+    }

src/app/accounting/transaction-type/transaction-type.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { TransactionTypeComponent } from './transaction-type.component';
+
+describe('TransactionTypeComponent', () => {
+  let component: TransactionTypeComponent;
+  let fixture: ComponentFixture<TransactionTypeComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ TransactionTypeComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(TransactionTypeComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/accounting/transaction-type/transaction-type.component.ts

@@ -0,0 +1,34 @@
+import { Component, OnInit } from '@angular/core';
+import {MatTableDataSource} from '@angular/material';
+
+@Component({
+  selector: 'app-transaction-type',
+  templateUrl: './transaction-type.component.html',
+  styleUrls: ['./transaction-type.component.scss']
+})
+export class TransactionTypeComponent implements OnInit {
+  displayedColumns = ['code','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 {
+  code: string;
+  name: string;
+  description: string;
+
+}
+
+const ELEMENT_DATA: Element[] = [
+
+];

src/app/accounting/trial-balance/trial-balance.component.html

@@ -1,10 +1,7 @@
 <div class="my-div mat-elevation-z2">
   <h3 class="heading">Trial Balance</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</a>
-    </div>
+
   <mat-form-field>
     <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Filter by name/short name">
   </mat-form-field>

src/app/app.module.ts

@@ -53,7 +53,10 @@ import { PayrollsComponent } from './accounting/payrolls/payrolls.component';
 import { ChartOfAccountsComponent } from './accounting/chart-of-accounts/chart-of-accounts.component';
 import { AddTransactionTypeComponent } from './accounting/add-transaction-type/add-transaction-type.component';
 import { TrialBalanceComponent } from './accounting/trial-balance/trial-balance.component';
-import { ChequeClearingComponent } from './accounting/cheque-clearing/cheque-clearing.component'
+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'
 
 const appRoutes: Routes = [
   { path: 'login', component: LoginComponent },
@@ -71,6 +74,8 @@ const appRoutes: Routes = [
         { path: 'add_transaction_type', component: AddTransactionTypeComponent },
         { path: 'trial_balance', component: TrialBalanceComponent },
         { path: 'cheque_clearing', component: ChequeClearingComponent },
+        { path: 'transaction_type', component: TransactionTypeComponent },
+        { path: 'add_member', component: AddMemberComponent },
   ]
 }
 ];
@@ -80,7 +85,7 @@ const appRoutes: Routes = [
   declarations: [
     AppComponent,LoginComponent, NavbarComponent, DashboardComponent,
      AccountingComponent, GeneralLedgerComponent, AddJournalEntryComponent, 
-     PayrollsComponent, ChartOfAccountsComponent, AddTransactionTypeComponent, TrialBalanceComponent, ChequeClearingComponent
+     PayrollsComponent, ChartOfAccountsComponent, AddTransactionTypeComponent, TrialBalanceComponent, ChequeClearingComponent, TransactionTypeComponent, AddMemberComponent, ManageMembersComponent
   ],
   imports: [RouterModule.forRoot(appRoutes),
     BrowserModule, BrowserAnimationsModule,