cyril/client-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feedback updates

Browse Source
This commit is contained in:
Cyril Joseph 2025-12-06 05:59:58 -04:00
parent 1ffd6713f4
commit 09d7691cb8
13 changed files with 131 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/app/carnet/checkout/checkout.component.html
View File

@ -33,7 +33,7 @@
</div>
<div *ngIf="estimatedFees.bondPremium" class="summary-item">
<span>Bond Premium: </span>
<span>{{bondPremiumLabel}}: </span>
<span>{{estimatedFees.bondPremium | currency}}</span>
</div>
@ -46,6 +46,16 @@
<span>LDI Premium: </span>
<span>{{estimatedFees.ldiPremium | currency}}</span>
</div>
<div *ngIf="estimatedFees.securityAmount" class="summary-item">
<span>Security Amount: </span>
<span>{{estimatedFees.securityAmount | currency}}</span>
</div>
<div *ngIf="estimatedFees.insuredValue" class="summary-item">
<span>Insured Value: </span>
<span>{{estimatedFees.insuredValue | currency}}</span>
</div>
<div class="summary-item total">
<strong>Total:</strong>
<strong>{{ orderTotal | currency }}</strong>

10
src/app/carnet/checkout/checkout.component.ts
View File

@ -28,6 +28,7 @@ export class CheckoutComponent {
currentApplicationDetails: { headerid: number, applicationName: string, applicationType: string } | null = null;
changeInProgress: boolean = false;
estimatedFees: Fees = {};
bondPremiumLabel: string = 'Bond Premium';
@ViewChild('paypalcontrol', { static: true }) paypalElement!: ElementRef;
@ -56,6 +57,15 @@ export class CheckoutComponent {
next: (data: Fees) => {
if (data) {
this.estimatedFees = data;
if (this.estimatedFees.securityType === 'B') {
this.bondPremiumLabel = 'Bond Premium';
} else if (this.estimatedFees.securityType === 'C') {
this.bondPremiumLabel = 'Cash Deposit';
} else if (this.estimatedFees.securityType === 'G') {
this.bondPremiumLabel = 'Refundable claim deposit';
}
this.calculateTotal();
}
},

15
src/app/carnet/goods/goods.component.html
View File

@ -16,11 +16,16 @@
</div>
<div class="form-section">
<div class="checkbox-group">
<mat-checkbox formControlName="roadVehiclesUsed">Road Vehicles
used?</mat-checkbox>
<mat-checkbox formControlName="horseUsed">Horse used?</mat-checkbox>
</div>
<mat-radio-group formControlName="roadVehiclesUsed" class="radio-group">
<mat-label class="question">Are Road vehicle included in your General List?</mat-label>
<mat-radio-button value="Y" class="radio-button">Yes</mat-radio-button>
<mat-radio-button value="N" class="radio-button">No</mat-radio-button>
</mat-radio-group>
<mat-radio-group formControlName="horseUsed" class="radio-group">
<mat-label class="question">Are Horse included in your General List?</mat-label>
<mat-radio-button value="Y" class="radio-button">Yes</mat-radio-button>
<mat-radio-button value="N" class="radio-button">No</mat-radio-button>
</mat-radio-group>
</div>
<!-- Authorized Representatives Section -->

16
src/app/carnet/goods/goods.component.scss
View File

@ -20,6 +20,22 @@
}
}
.radio-group {
display: flex;
gap: 16px;
mat-label {
margin-top: 5px;
color: var(--mat-checkbox-label-text-color, var(--mat-sys-on-surface));
font-family: var(--mat-checkbox-label-text-font, var(--mat-sys-body-medium-font));
line-height: var(--mat-checkbox-label-text-line-height, var(--mat-sys-body-medium-line-height));
font-size: var(--mat-checkbox-label-text-size, var(--mat-sys-body-medium-size));
letter-spacing: var(--mat-checkbox-label-text-tracking, var(--mat-sys-body-medium-tracking));
font-weight: var(--mat-checkbox-label-text-weight, var(--mat-sys-body-medium-weight));
}
}
.full-width {
width: 100%;
}

8
src/app/carnet/goods/goods.component.ts
View File

@ -79,8 +79,8 @@ export class GoodsComponent {
commercialSample: [false],
professionalEquipment: [false],
exhibitionsFair: [false],
roadVehiclesUsed: [false],
horseUsed: [false],
roadVehiclesUsed: ['N'],
horseUsed: ['N'],
authorizedRepresentatives: ['', Validators.required]
}, { validator: this.atLeastOneRequired }
);
@ -176,8 +176,8 @@ export class GoodsComponent {
this.goodsForm.patchValue({
commercialSample: data.commercialSample || false,
professionalEquipment: data.professionalEquipment || false,
exhibitionsFair: data.exhibitionsFair || false,
roadVehiclesUsed: data.roadVehiclesUsed || false,
exhibitionsFair: data.exhibitionsFair || 'N',
roadVehiclesUsed: data.roadVehiclesUsed || 'N',
horseUsed: data.horseUsed || false,
authorizedRepresentatives: data.authorizedRepresentatives || ''
});

34
src/app/carnet/shipping/fees-dialog.component.ts
View File

@ -23,10 +23,18 @@ import { NotificationService } from '../../core/services/common/notification.ser
{{estimatedFees.continuationSheetFee | currency}}</li>
<li *ngIf="estimatedFees.expeditedFee">Expedited fee: {{estimatedFees.expeditedFee | currency}}</li>
<li *ngIf="estimatedFees.shippingFee">Shipping fee: {{estimatedFees.shippingFee | currency}}</li>
<li *ngIf="estimatedFees.bondPremium">Bond Premium: {{estimatedFees.bondPremium | currency}}</li>
<li *ngIf="estimatedFees.bondPremium">{{bondPremiumLabel}}: {{estimatedFees.bondPremium | currency}}</li>
<li *ngIf="estimatedFees.cargoPremium">Cargo Premium: {{estimatedFees.cargoPremium | currency}}</li>
<li *ngIf="estimatedFees.ldiPremium">LDI Premium: {{estimatedFees.ldiPremium | currency}}</li>
</ul>
<hr/>
<p>Additional Charges:</p>
<ul>
<li *ngIf="estimatedFees.securityAmount">Security Amount: {{estimatedFees.securityAmount | currency}}</li>
<li *ngIf="estimatedFees.insuredValue">Insured Value: {{estimatedFees.insuredValue | currency}}</li>
</ul>
<hr/>
<p class="total">Total: {{total | currency}}</p>
</mat-dialog-content>
<mat-dialog-actions>
<button mat-raised-button color="primary" (click)="onClose()">
@ -38,11 +46,18 @@ import { NotificationService } from '../../core/services/common/notification.ser
li {
margin-bottom: 8px;
}
.total {
font-weight: bold;
margin-top: 12px;
}
`]
})
export class FeesDialogComponent {
estimatedFees: Fees = {};
headerid: number | null = null;
bondPremiumLabel: string = 'Bond Premium';
total: number = 0;
private carnetService = inject(CarnetService);
private notificationService = inject(NotificationService);
@ -61,6 +76,16 @@ export class FeesDialogComponent {
next: (data: Fees) => {
if (data) {
this.estimatedFees = data;
if (this.estimatedFees.securityType === 'B') {
this.bondPremiumLabel = 'Bond Premium';
} else if (this.estimatedFees.securityType === 'C') {
this.bondPremiumLabel = 'Cash Deposit';
} else if (this.estimatedFees.securityType === 'G') {
this.bondPremiumLabel = 'Refundable claim deposit';
}
this.calculateTotal();
}
},
error: (error: any) => {
@ -72,6 +97,13 @@ export class FeesDialogComponent {
}
}
calculateTotal(): void {
const validFees = Object.values(this.estimatedFees).filter(
(fee): fee is number => typeof fee === 'number'
);
this.total = validFees.reduce((total, fee) => total + fee, 0);
}
onClose(): void {
this.dialogRef.close();
}

12
src/app/carnet/terms-conditions/terms-conditions.component.html
View File

@ -18,10 +18,20 @@
{{estimatedFees.continuationSheetFee | currency}}</li>
<li *ngIf="estimatedFees.expeditedFee">Expedited fee: {{estimatedFees.expeditedFee | currency}}</li>
<li *ngIf="estimatedFees.shippingFee">Shipping fee: {{estimatedFees.shippingFee | currency}}</li>
<li *ngIf="estimatedFees.bondPremium">Bond Premium: {{estimatedFees.bondPremium | currency}}</li>
<li *ngIf="estimatedFees.bondPremium">{{bondPremiumLabel}}: {{estimatedFees.bondPremium | currency}}
</li>
<li *ngIf="estimatedFees.cargoPremium">Cargo Premium: {{estimatedFees.cargoPremium | currency}}</li>
<li *ngIf="estimatedFees.ldiPremium">LDI Premium: {{estimatedFees.ldiPremium | currency}}</li>
</ul>
<hr />
<p>Additional Charges:</p>
<ul>
<li *ngIf="estimatedFees.securityAmount">Security Amount: {{estimatedFees.securityAmount | currency}}
</li>
<li *ngIf="estimatedFees.insuredValue">Insured Value: {{estimatedFees.insuredValue | currency}}</li>
</ul>
<hr />
<p class="total">Total: {{total | currency}}</p>
<mat-checkbox [(ngModel)]="hasReadAllTerms" color="primary" class="read-checkbox">
I have read and agree to all terms and conditions above
</mat-checkbox>

5
src/app/carnet/terms-conditions/terms-conditions.component.scss
View File

@ -43,6 +43,11 @@ mat-card-header {
strong {
font-weight: 500;
}
.total {
font-weight: bold;
margin-top: 12px;
}
}
.read-checkbox {

19
src/app/carnet/terms-conditions/terms-conditions.component.ts
View File

@ -35,6 +35,8 @@ export class TermsConditionsComponent {
changeInProgress: boolean = false;
estimatedFees: Fees = {};
needCheckOut: boolean = false;
bondPremiumLabel: string = 'Bond Premium';
total: number = 0;
private notificationService = inject(NotificationService);
private errorHandler = inject(ApiErrorHandlerService);
@ -53,6 +55,16 @@ export class TermsConditionsComponent {
next: (data: Fees) => {
if (data) {
this.estimatedFees = data;
if (this.estimatedFees.securityType === 'B') {
this.bondPremiumLabel = 'Bond Premium';
} else if (this.estimatedFees.securityType === 'C') {
this.bondPremiumLabel = 'Cash Deposit';
} else if (this.estimatedFees.securityType === 'G') {
this.bondPremiumLabel = 'Refundable claim deposit';
}
this.calculateTotal();
}
},
error: (error: any) => {
@ -130,4 +142,11 @@ export class TermsConditionsComponent {
}
});
}
calculateTotal(): void {
const validFees = Object.values(this.estimatedFees).filter(
(fee): fee is number => typeof fee === 'number'
);
this.total = validFees.reduce((total, fee) => total + fee, 0);
}
}

3
src/app/core/models/carnet/fee.ts
View File

@ -7,4 +7,7 @@ export interface Fees {
bondPremium?: number | null | undefined;
cargoPremium?: number | null | undefined;
ldiPremium?: number | null | undefined;
securityAmount?: number | null | undefined;
securityType?: string | null | undefined;
insuredValue?: number | null | undefined;
}

4
src/app/core/models/carnet/goods.ts
View File

@ -2,8 +2,8 @@ export interface Goods {
commercialSample: boolean;
professionalEquipment: boolean;
exhibitionsFair: boolean;
roadVehiclesUsed: boolean;
horseUsed: boolean;
roadVehiclesUsed: string;
horseUsed: string;
authorizedRepresentatives: string;
items?: GoodsItem[] | null;
}

3
src/app/core/services/carnet/carnet.service.ts
View File

@ -30,6 +30,9 @@ export class CarnetService {
bondPremium: estimatedFeesDetails.BONDPREMIUM,
cargoPremium: estimatedFeesDetails.CARGOPREMIUM,
ldiPremium: estimatedFeesDetails.LDIPREMIUM,
securityAmount: estimatedFeesDetails.SECURITYAMOUNT,
securityType: estimatedFeesDetails.SECURITYTYPE,
insuredValue: estimatedFeesDetails.INSUREDVALUE
};
return estimatedFeesData;

8
src/app/core/services/carnet/goods.service.ts
View File

@ -22,8 +22,8 @@ export class GoodsService {
private mapToGoods(goodDetails: any): Goods {
return {
roadVehiclesUsed: goodDetails.AUTOFLAG === 'Y',
horseUsed: goodDetails.HORSEFLAG === 'Y',
roadVehiclesUsed: goodDetails.AUTOFLAG,
horseUsed: goodDetails.HORSEFLAG,
exhibitionsFair: goodDetails.EXHIBITIONSFAIRFLAG === 'Y',
professionalEquipment: goodDetails.PROFEQUIPMENTFLAG === 'Y',
commercialSample: goodDetails.COMMERCIALSAMPLEFLAG === 'Y',
@ -56,8 +56,8 @@ export class GoodsService {
P_COMMERCIALSAMPLEFLAG: goodsData.commercialSample ? 'Y' : 'N',
P_PROFEQUIPMENTFLAG: goodsData.professionalEquipment ? 'Y' : 'N',
P_EXHIBITIONSFAIRFLAG: goodsData.exhibitionsFair ? 'Y' : 'N',
P_AUTOFLAG: goodsData.roadVehiclesUsed ? 'Y' : 'N',
P_HORSEFLAG: goodsData.horseUsed ? 'Y' : 'N',
P_AUTOFLAG: goodsData.roadVehiclesUsed,
P_HORSEFLAG: goodsData.horseUsed,
P_AUTHREP: goodsData.authorizedRepresentatives,
}