Skip to content

Commit

Permalink
feat(cb2-14451): edit mode finish trl fields
Browse files Browse the repository at this point in the history
  • Loading branch information
@BrandonT95
BrandonT95 committed Nov 28, 2024
1 parent 19f9e7d commit 5e33073
Show file tree
Hide file tree
Showing 2 changed files with 103 additions and 6 deletions.
79 changes: 77 additions & 2 deletions .../custom-sections/vehicle-section/vehicle-section-edit/vehicle-section-edit.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -73,6 +73,36 @@ <h1>
</div>

<!-- Date of first use (TRL only) -->
<app-date-controls *ngIf="shouldDisplayFormControl('techRecord_firstUseDate')" formControlName="techRecord_firstUseDate" #firstUseDate>
<div class="govuk-form-group-date" [formGroup]="firstUseDate.form">
<fieldset role="group">
<legend>
Date of first use
</legend>
<app-control-errors elementId="techRecord_firstUseDate-error" [control]="$any(form.get('techRecord_firstUseDate'))" />
<div id="techRecord_firstUseDate">
<div>
<div>
<label id="techRecord_firstUseDate-day-label">Day</label>
<input class="govuk-input--width-2" govukDateInput="techRecord_firstUseDate" formControlName="day" />
</div>
</div>
<div>
<div>
<label id="techRecord_firstUseDate-month-label">Month</label>
<input class="govuk-input--width-2" govukDateInput="techRecord_firstUseDate" formControlName="month" />
</div>
</div>
<div>
<div>
<label id="techRecord_firstUseDate-year-label">Year</label>
<input class="govuk-input--width-4" govukDateInput="techRecord_firstUseDate" formControlName="year" />
</div>
</div>
</div>
</fieldset>
</div>
</app-date-controls>

<!-- Number of axles -->
<div *ngIf="shouldDisplayFormControl('techRecord_noOfAxles')" class="govuk-form-group-input">
Expand Down Expand Up @@ -215,6 +245,15 @@ <h1 tag>
</div>

<!-- Suspension type (TRL Only) -->
<div class="govuk-form-group-select" *ngIf="shouldDisplayFormControl('techRecord_suspensionType')">
<label>
Suspension type (optional)
</label>
<app-control-errors elementId="techRecord_suspensionType" [control]="$any(form.get('techRecord_suspensionType'))" />
<select govukSelect formControlName="techRecord_suspensionType">
<option [value]="option.value" *ngFor="let option of suspensionTypeOptions">{{ option.label }}</option>
</select>
</div>

<!-- Fuel / propulsion system -->
<div *ngIf="shouldDisplayFormControl('techRecord_fuelPropulsionSystem')" class="govuk-form-group-select">
Expand Down Expand Up @@ -258,7 +297,34 @@ <h1>
</ng-container>

<!-- Coupling type (TRL Only) -->
<div class="govuk-form-group-select" *ngIf="shouldDisplayFormControl('techRecord_couplingType')">
<label>
Coupling type (optional)
</label>
<app-control-errors elementId="techRecord_couplingType" [control]="$any(form.get('techRecord_couplingType'))" />
<select govukSelect formControlName="techRecord_couplingType">
<option [value]="option.value" *ngFor="let option of CouplingTypeOptions">{{ option.label }}</option>
</select>
</div>

<!-- Max load on coupling (TRL Only) -->
<div *ngIf="shouldDisplayFormControl('techRecord_maxLoadOnCoupling')" class="govuk-form-group-input">
<h1>
<label id="techRecord_maxLoadOnCoupling-label">
Max load on coupling (optional)
<div>
<app-tag [type]="TagType.PURPLE">{{ TagTypeLabels.PLATES }}</app-tag>
</div>
</label>
</h1>
<input
appNumberOnly
inputmode="numeric"
type="number"
[width]="FormNodeWidth.XS"
govukInput
formControlName="techRecord_maxLoadOnCoupling" />
</div>


<!-- Vehicle configuration-->
Expand Down Expand Up @@ -306,6 +372,17 @@ <h1>
</fieldset>
</div>

<!-- Frame description (TRL Only) -->
<div *ngIf="shouldDisplayFormControl('techRecord_frameDescription')" class="govuk-form-group-select">
<label tag>
Frame description (optional)
</label>
<app-control-errors elementId="techRecord_frameDescription" [control]="$any(form.get('techRecord_frameDescription'))" />
<select govukSelect formControlName="techRecord_frameDescription">
<option [value]="option.value" *ngFor="let option of frameDescriptionOptions">{{ option.label }}</option>
</select>
</div>

<!-- EU Category -->
<div *ngIf="shouldDisplayFormControl('techRecord_euVehicleCategory')" class="govuk-form-group-select">
<label>EU vehicle category</label>
Expand Down Expand Up @@ -457,8 +534,6 @@ <h1>
</app-date-controls>
</div>

<!-- Frame description (TRL Only) -->

<!-- Departmental vehicle marker -->
<div *ngIf="shouldDisplayFormControl('techRecord_departmentalVehicleMarker')" class="govuk-form-group-radio">
<fieldset>
Expand Down
30 changes: 26 additions & 4 deletions ...ms/custom-sections/vehicle-section/vehicle-section-edit/vehicle-section-edit.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ import { FuelPropulsionSystem } from '@dvsa/cvs-type-definitions/types/v3/tech-r
import { TechRecordType } from '@dvsa/cvs-type-definitions/types/v3/tech-record/tech-record-vehicle-type';
import { getOptionsFromEnum } from '@forms/utils/enum-map';
import { CommonValidatorsService } from '@forms/validators/common-validators.service';
import { CouplingTypeOptions } from '@models/coupling-type-enum';
import { MultiOptions } from '@models/options.model';
import { EmissionStandard } from '@models/test-types/emissions.enum';
import {
Expand All @@ -24,7 +25,13 @@ import {
VehicleConfiguration,
} from '@models/vehicle-configuration.enum';
import { VehicleSize } from '@models/vehicle-size.enum';
import { FuelTypes, V3TechRecordModel, VehicleSubclass, VehicleTypes } from '@models/vehicle-tech-record.model';
import {
FrameDescriptions,
FuelTypes,
V3TechRecordModel,
VehicleSubclass,
VehicleTypes,
} from '@models/vehicle-tech-record.model';
import { Store } from '@ngrx/store';
import { FormNodeWidth, TagTypeLabels } from '@services/dynamic-forms/dynamic-form.types';
import { TechnicalRecordService } from '@services/technical-record/technical-record.service';
Expand All @@ -38,6 +45,7 @@ type VehicleSectionForm = Partial<Record<keyof TechRecordType<'hgv' | 'car' | 'p
styleUrls: ['./vehicle-section-edit.component.scss'],
})
export class VehicleSectionEditComponent implements OnInit, OnDestroy {
protected readonly CouplingTypeOptions = CouplingTypeOptions;
protected readonly FormNodeWidth = FormNodeWidth;
protected readonly TagType = TagType;
protected readonly TagTypeLabels = TagTypeLabels;
Expand Down Expand Up @@ -347,14 +355,28 @@ export class VehicleSectionEditComponent implements OnInit, OnDestroy {
];
}

get subClassOptions() {
get suspensionTypeOptions(): MultiOptions {
return [
{ value: 'S', label: 'Steel' },
{ value: 'R', label: 'Rubber' },
{ value: 'A', label: 'Air' },
{ value: 'H', label: 'Hydraulic' },
{ value: 'O', label: 'Other' },
];
}

get subClassOptions(): MultiOptions {
return getOptionsFromEnum(VehicleSubclass);
}

get vehicleSizeOptions() {
get vehicleSizeOptions(): MultiOptions {
return getOptionsFromEnum(VehicleSize);
}

get frameDescriptionOptions(): MultiOptions {
return getOptionsFromEnum(FrameDescriptions);
}

get controlsBasedOffVehicleType() {
switch (this.technicalRecordService.getVehicleTypeWithSmallTrl(this.techRecord())) {
case VehicleTypes.HGV:
Expand Down Expand Up @@ -386,7 +408,7 @@ export class VehicleSectionEditComponent implements OnInit, OnDestroy {
return !!this.form.get(formControlName);
}

getVehicleType() {
getVehicleType(): VehicleTypes {
return this.technicalRecordService.getVehicleTypeWithSmallTrl(this.techRecord());
}

Expand Down

0 comments on commit 5e33073

Please sign in to comment.