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:
+23
-8
@@ -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> {{ 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>
|
||||
|
||||
Reference in New Issue
Block a user