refractor: accounting module (#300)

* Refractor components.
* Add resolvers.
* Add relative router links.
* Replace mat-icons by font-awesome icons.
* Add comments.

Fixes: #298
This commit is contained in:
Abhay Chawla
2018-08-19 22:49:48 +05:30
committed by GitHub
parent 598f239251
commit 6e552d72eb
114 changed files with 3760 additions and 1432 deletions
@@ -1,3 +1,4 @@
<!-- TODO: Responsiveness/design enhancement and reduction in form loading time -->
<div class="container">
<mat-card>
@@ -9,11 +10,15 @@
<div fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column">
<mat-form-field fxFlex="88%">
<mat-select placeholder="Office" required formControlName="officeId">
<mat-label>Office</mat-label>
<mat-select required formControlName="officeId">
<mat-option *ngFor="let office of officeData" [value]="office.id">
{{ office.name }}
</mat-option>
</mat-select>
<mat-error *ngIf="openingBalancesForm.controls.officeId.hasError('required')">
Office is <strong>required</strong>
</mat-error>
</mat-form-field>
<button mat-button type="button" color="primary" fxFlex="4%" (click)="retrieveOpeningBalances()">Retrieve</button>
@@ -25,17 +30,25 @@
<label fxFlex="98%" class="content"><span class="header">Opening Balances Contra Account:</span>&nbsp;&nbsp;{{ openingBalancesData.contraAccount.name + ' (' + openingBalancesData.contraAccount.glCode + ')' }}</label>
<mat-form-field fxFlex="48%">
<mat-select placeholder="Currency" required formControlName="currencyCode">
<mat-label>Currency</mat-label>
<mat-select required formControlName="currencyCode">
<mat-option *ngFor="let currency of currencyData" [value]="currency.code">
{{ currency.displayLabel }}
</mat-option>
</mat-select>
<mat-error *ngIf="openingBalancesForm.controls.currencyCode.hasError('required')">
Currency is <strong>required</strong>
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="48%">
<input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="openingBalancesDatePicker" placeholder="Opening Balances Date" required formControlName="transactionDate">
<mat-label>Opening Balances Date</mat-label>
<input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="openingBalancesDatePicker" required formControlName="transactionDate">
<mat-datepicker-toggle matSuffix [for]="openingBalancesDatePicker"></mat-datepicker-toggle>
<mat-datepicker #openingBalancesDatePicker></mat-datepicker>
<mat-error *ngIf="openingBalancesForm.controls.transactionDate.hasError('required')">
Opening Balances Date is <strong>required</strong>
</mat-error>
</mat-form-field>
<div fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column" class="content" fxFlex="100%">
@@ -63,7 +76,7 @@
</div>
<div fxFlexFill fxLayout="row wrap" fxLayout.lt-md="column" class="content" formArrayName="glAccountEntries"
*ngFor="let credit of getFormArrayData('glAccountEntries').controls; let i = index;">
*ngFor="let credit of glAccountEntries.controls; let i = index;">
<div fxFlexFill fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column" [formGroupName]="i">
@@ -81,13 +94,15 @@
<div fxFlex="23%">
<mat-form-field>
<input matInput type="number" placeholder="Debit" formControlName="debit">
<mat-label>Debit</mat-label>
<input matInput type="number" formControlName="debit">
</mat-form-field>
</div>
<div fxFlex="23%">
<mat-form-field>
<input matInput type="number" placeholder="Credit" formControlName="credit">
<mat-label>Credit</mat-label>
<input matInput type="number" formControlName="credit">
</mat-form-field>
</div>
@@ -100,8 +115,8 @@
</mat-card-content>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px" *ngIf="openingBalancesData">
<button type="button" mat-raised-button [routerLink]="['/accounting']">Cancel</button>
<button mat-raised-button color="primary">Submit</button>
<button type="button" mat-raised-button [routerLink]="['../']">Cancel</button>
<button mat-raised-button color="primary" [disabled]="!openingBalancesForm.valid">Submit</button>
</mat-card-actions>
</form>