Skip to content
Permalink
Browse files
continue accounting components
  • Loading branch information
pembemiriam committed May 28, 2018
1 parent bd10f97 commit 954d312963e7c7d06ca58a77fa4a9323411e9a86
Showing 33 changed files with 799 additions and 68 deletions.
@@ -0,0 +1,53 @@
<div class="page-space mat-elevation-z2">
<p>
<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>
<form class="fineract-form">
<mat-form-field>
<input matInput [matDatepicker]="picker" placeholder="Transaction date">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
</mat-form-field>
<br/>
<mat-form-field>
<input matInput placeholder="Transaction Type">
</mat-form-field>
<br/>
<mat-form-field>
<input matInput placeholder="Note(optional)">
</mat-form-field>
<br/>
<mat-form-field class="input">
<textarea matInput placeholder="Leave a comment"></textarea>
</mat-form-field>
</form>

<span>Affected Accounts</span>
<mat-card>
<span>Debit</span>
<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>
</mat-card>
<mat-card>
<span>Credit</span>
<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>
</mat-card>
</div>
</div>
@@ -0,0 +1,11 @@

.fineract-form {
min-width: 150px;
max-width: 500px;
width: 100%;
}

.input {
width: 100%;
}

@@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';

import { AddJournalEntryComponent } from './add-journal-entry.component';

describe('AddJournalEntryComponent', () => {
let component: AddJournalEntryComponent;
let fixture: ComponentFixture<AddJournalEntryComponent>;

beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ AddJournalEntryComponent ]
})
.compileComponents();
}));

beforeEach(() => {
fixture = TestBed.createComponent(AddJournalEntryComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});

it('should create', () => {
expect(component).toBeTruthy();
});
});
@@ -0,0 +1,34 @@
import { Component, OnInit } from '@angular/core';
import {ReactiveFormsModule} from '@angular/forms'
import {FormControl, Validators} from '@angular/forms';

@Component({
selector: 'app-add-journal-entry',
templateUrl: './add-journal-entry.component.html',
styleUrls: ['./add-journal-entry.component.scss']
})
export class AddJournalEntryComponent implements OnInit {

startDate = new Date(1990, 0, 1);
show=false;

myControl: FormControl = new FormControl();

options = [
{value: 'mor', viewValue: 'Morogoro branch'},
{value: 'kat', viewValue: 'Katuba'},
{value:'loan',viewValue:'Loan Officer'}
];

currencies = [
{value:'afgh',viewValue:'Afghanistan Afghani()'},
{value:'alba',viewValue:'Albanian lek()'},
{value:'alg',viewValue:'Algerian Dinar()'}
]

constructor() { }

ngOnInit() {
}

}
@@ -0,0 +1,19 @@
<div class="my-div mat-elevation-z2">
<h3 class="heading">General Ledger</h3>
<mat-divider></mat-divider>
<span>Transaction Type</span>

<mat-form-field>
<input matInput placeholder="Code">
</mat-form-field>

<mat-form-field>
<input matInput placeholder="Name">
</mat-form-field>

<mat-form-field>
<textarea matInput placeholder="Description(optional)"></textarea>
</mat-form-field>

<button mat-raise-button>Submit</button>
<button mat-raise-button>Cancel</button>
@@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';

import { AddTransactionTypeComponent } from './add-transaction-type.component';

describe('AddTransactionTypeComponent', () => {
let component: AddTransactionTypeComponent;
let fixture: ComponentFixture<AddTransactionTypeComponent>;

beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ AddTransactionTypeComponent ]
})
.compileComponents();
}));

beforeEach(() => {
fixture = TestBed.createComponent(AddTransactionTypeComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});

it('should create', () => {
expect(component).toBeTruthy();
});
});
@@ -0,0 +1,15 @@
import { Component, OnInit } from '@angular/core';

@Component({
selector: 'app-add-transaction-type',
templateUrl: './add-transaction-type.component.html',
styleUrls: ['./add-transaction-type.component.scss']
})
export class AddTransactionTypeComponent implements OnInit {

constructor() { }

ngOnInit() {
}

}
@@ -0,0 +1,47 @@
<div class="main-div mat-elevation-z2">
<h3 class="heading">Chart of Accounts</h3>
<mat-divider></mat-divider>
<div class="fineract-button">
<a mat-raised-button color="primary" >
Download</a>
</div>
<mat-form-field >
<input matInput class="filter" (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>

<ng-container matColumnDef="type">
<mat-header-cell *matHeaderCellDef>Type</mat-header-cell>
<mat-cell *matCellDef="let element"> {{element.type} </mat-cell>
</ng-container>

<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
<mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
</mat-table>


</div>

@@ -0,0 +1,11 @@

table {
width: 100%;
}

.mat-form-field {
font-size: 14px;
width: 100%;
}


@@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';

import { ChartOfAccountsComponent } from './chart-of-accounts.component';

describe('ChartOfAccountsComponent', () => {
let component: ChartOfAccountsComponent;
let fixture: ComponentFixture<ChartOfAccountsComponent>;

beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ ChartOfAccountsComponent ]
})
.compileComponents();
}));

beforeEach(() => {
fixture = TestBed.createComponent(ChartOfAccountsComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});

it('should create', () => {
expect(component).toBeTruthy();
});
});
@@ -0,0 +1,37 @@
import { Component, OnInit } from '@angular/core';
import {MatTableDataSource} from '@angular/material';


@Component({
selector: 'app-chart-of-accounts',
templateUrl: './chart-of-accounts.component.html',
styleUrls: ['./chart-of-accounts.component.scss']
})
export class ChartOfAccountsComponent implements OnInit {
displayedColumns = ['code','name','description','type'];
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;
type: string;

}

const ELEMENT_DATA: Element[] = [

];

@@ -0,0 +1,70 @@
<div class="main-div mat-elevation-z2">
<h3 class="heading">Cheque Clearing</h3>
<mat-divider></mat-divider>
<mat-form-field>
<input matInput (keyup)="applyFilter($event.target.value)" placeholder="Filter by identifier">
</mat-form-field>

<br>
<mat-divider></mat-divider>

<mat-table #table [dataSource]="dataSource">

<!-- Position Column -->
<ng-container matColumnDef="identifier">
<mat-header-cell *matHeaderCellDef>Identifier </mat-header-cell>
<mat-cell *matCellDef="let element">
<a routerLink="{{element.identifier}}">{{element.identifier}}</a>
</mat-cell>
</ng-container>

<!-- Name Column -->
<ng-container matColumnDef="drawee">
<mat-header-cell *matHeaderCellDef>Drawee</mat-header-cell>
<mat-cell *matCellDef="let element"> {{element.drawee}} </mat-cell>
</ng-container>

<ng-container matColumnDef="drawer">
<mat-header-cell *matHeaderCellDef>Drawer</mat-header-cell>
<mat-cell *matCellDef="let element"> {{element.drawer}} </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="amount">
<mat-header-cell *matHeaderCellDef>Amount</mat-header-cell>
<mat-cell *matCellDef="let element"> {{element.amount} </mat-cell>
</ng-container>

<ng-container matColumnDef="dateissued">
<mat-header-cell *matHeaderCellDef>Date Issued</mat-header-cell>
<mat-cell *matCellDef="let element"> {{element.dateisued} </mat-cell>
</ng-container>

<ng-container matColumnDef="state">
<mat-header-cell *matHeaderCellDef>state</mat-header-cell>
<mat-cell *matCellDef="let element"> {{element.state} </mat-cell>
</ng-container>

<ng-container matColumnDef="approve">
<mat-header-cell *matHeaderCellDef>Approve</mat-header-cell>
<mat-cell *matCellDef="let element"> {{element.approve} </mat-cell>
</ng-container>

<ng-container matColumnDef="cancel">
<mat-header-cell *matHeaderCellDef>Cancel</mat-header-cell>
<mat-cell *matCellDef="let element"> {{element.cancel} </mat-cell>
</ng-container>



<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
<mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
</mat-table>


</div>

0 comments on commit 954d312

Please sign in to comment.